@charset "utf-8";
* { box-sizing:border-box; }

:root {
	--site-hue: 336;
	--site-sat: 84%;
	--site-text-lum: 16%;
	--site-title-lum: 56%;
	--site-header-lum: 56%;
	--site-light-bg-lum: 96%;
	--color: hsl( var(--site-hue), var(--site-sat), var(--site-text-lum) );
	--background-color: hsl( var(--site-hue), var(--site-sat), var(--site-light-bg-lum) );
	--sitewide-title-color: hsl( var(--site-hue), var(--site-sat), var(--site-title-lum) );
}

/* rgb(237,49,124) hsl(336,84%,56%) #ed317c */
/* hsl(334,84%,56%) hsl(246,100%,99%) hsl(246,100%,2 0%) */

html, body { 
	font-size:100%; 
	font-family:sans-serif; 
	color: var(--color);
	background-color: var(--background-color);
	}
.websiteTitleColor { color:var(--sitewide-title-color); }
.websiteTitle { 
	position:relative;
	transform:scale(1.9,1);
	color:var(--sitewide-title-color); 
	border:3px solid var(--sitewide-title-color); 
	border-radius:36pt;
	font-size:36pt;
	padding:6pt 9pt 3pt 9pt;
	font-weight:bold;
	display:table; 
	margin:0 auto;
	background-color:#ffffff;
	cursor:pointer;
	}
.websiteTitleHomeLink { 
	position:absolute; left:0; bottom:-6px;
	background-color:var(--sitewide-title-color);
	color:var(--background-color);
	border-radius:4pt;
	font-size:8pt;
	padding:4pt;
	font-weight:normal;
	cursor:pointer;
	}
.websiteLoginButton { 
	background-color:var(--sitewide-title-color);
	color:var(--background-color);
	border-radius:4pt;
	font-size:12pt;
	padding:4pt;
	font-weight:normal;
	cursor:pointer;
	width:fit-content;
	}
.websiteTitleContactLink { 
	position:absolute; right:0; bottom:-6px;
	background-color:var(--sitewide-title-color);
	color:var(--background-color);
	border-radius:4pt;
	font-size:8pt;
	padding:4pt;
	font-weight:normal;
	cursor:pointer;
	}
.website-box-around-text { 
	border:3px solid var(--sitewide-title-color);
	border-radius:1em;
	padding:1em;
	background-color:#ffffff;
	position:relative;
	}
.website-main-column { 
	position:relative; 
	max-width:500px; 
	margin:0 auto; 
	}
.imageContainerDiv { margin:0 auto; border:none; outline:none; text-align:center; }
img { max-width:100%; border:none; outline:none; }

ul > :first-child, ol > :first-child, ul > :last-child, ol > :last-child { margin:0; }
div > :last-child { margin-bottom:0; }
div > :first-child { margin-top:0; }

input, textarea { font-size:1rem; font-family:sans-serif; }
input[type="button"], input[type="submit"] { width:100%; }
input[type="text"], input[type="email"], input[type="password"], textarea { width:100%; border:1px solid #ccc; padding:.25em; border-radius:.25em; }
input[type="image"]:hover, input[type="button"]:hover, input[type="submit"]:hover { cursor:pointer; }
input[type="radio"], input[type="checkbox"] { margin:0; }

li { margin:.3em 0; }
.p, p, tr, li, div { line-height:135%; }
.p { margin:1em 0; font-size:100%; }
h1 { line-height:120%; }
.content-editable-box { border:1px dotted #ccc; padding:.5em; border-radius:.5em; min-height:.7in; }
.center { text-align:center; margin-left:auto; margin-right:auto; }
.nowrap { white-space:nowrap; }
.bold { font-weight:bold; }
.italic { font-style:italic; }
.underline { text-decoration:underline; }
.normal { font-weight:normal; font-style:normal; text-decoration:none; }

a { text-decoration:none; }

/* ??????????????? */

.flexible-content-container {
   display:flex;
   flex-wrap:wrap;
   justify-content:center;
   }
.linked-book-images-flexible-content-div { 
   width:200px; 
   margin:0 .75em .75em 0;
   border-radius:0em;
   border:transparent; 
   background-color:transparent;
   overflow:visible;
   }

.linked-book-image-div { max-width:50%; margin-right:1em; float:left; }

.Xinner-buy-icon { display:inline-block; width:5vw; width:13%; max-width:128px; min-width:40px; margin:2% 3% 2% 0; vertical-align:top; }
.Xinner-buy-icon-wider { display:inline-block; outline:1px dotted blue; width:fit-content; height:128px; margin:2% 3% 2% 0; vertical-align:top; }
.inner-buy-icon-size { max-width:70px; max-height:70px; vertical-align:top; margin:10px; }

@media screen and (max-width:510px)
{
	.websiteTitle {
		transform:scale(1.8,1);
		font-size:30pt;
		border-radius:30pt;
		padding:6pt 9pt 3pt 9pt;
		}
}

@media screen and (max-width:420px)
{
	.websiteTitle {
		transform:scale(1.7,1);
		font-size:26pt;
		border-radius:26pt;
		padding:4pt 9pt 2pt 9pt;
		}
	.websiteTitleHomeLink {
		font-size:7pt; 
		padding:4pt;
		border-radius:4pt;
		}
}

@media screen and (max-width:350px)
{
	.websiteTitle {
		transform:scale(1.7,1);
		font-size:22pt;
		border-radius:22pt;
		padding:4pt 6pt 2pt 6pt;
		}
	.websiteTitleHomeLink {
		font-size:6pt; 
		padding:3pt;
		border-radius:3pt;
		}
}

@media screen and (max-width:310px)
{
	.websiteTitle {
		transform:scale(1.5,1);
		font-size:18pt;
		border-radius:18pt;
		}
	.websiteTitleHomeLink {
		font-size:6pt; 
		padding:3pt;
		border-radius:3pt;
		}
}