:root {
  --primary-color: #FFF;
  --bg-color: #FFF;
  --primary-text-color: #000;
  --secondary-text-color: #0000FF;
}
*{margin:0;padding:0; font-family: 'Karla', sans-serif;
	}
.dark-mode {
  --bg-color: #000;
  --primary-text-color: #FFF;
  --secondary-text-color: #0000FF;
}
.smalltext{font-size:0.8em;width:inherit;}
.dark-mode .cart{-webkit-filter: grayscale(1) invert(1);
    filter: grayscale(1) invert(1);}
html{ box-sizing:border-box;font-size:13px;height:100%;line-height:1.9em;} /* Sets 1em = 12px */
html{
    height: 100%; width:100%;
	/*background-color:var(--bg-color);
	border-color:var(--primary-text-color);*/
  color: var(--primary-text-color);
}
body {
    height: 100%; width:100%;
	background-color:var(--bg-color);
	border-color:var(--primary-text-color);
  color: var(--primary-text-color);
}
.tox .tox-tbtn svg, #tinymce {background-color:var(--bg-color);
	border-color:var(--primary-text-color);
  fill: var(--primary-text-color) !important;
  color:var(--primary-text-color) !important;}
.tox-tinymce {margin-top:-2px;background-color:var(--bg-color) !important;
	border-color:var(--primary-text-color) !important;
  color: var(--primary-text-color) !important;
  }
#warning{position:absolute; margin-top:-50%; left:1em;}
.switch{position:relative;left:0;top:0.4em;font-size:2em;}
input#switch { display: none }
input[type="checkbox" i] {width:1em;height:1em;} 
.shrink{float:right;} 
.switch:hover .tooltiptext {
  visibility: visible;
}
.switch .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: var(--primary-text-color);
  color: var(--bg-color);
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  font-size:14px;
  
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: -5px;
  left: 105%;
}
.burger {margin-left:40px;
/*font-size:14px;*/
line-height:15px;}

body {
	font-family: 'Karla', sans-serif;
	font-size: 1.8em;
    color:var(--primary-text-color);
	border: 0;
	margin: 0;
	padding: 0;
	background-color:var(--bg-color);
	text-align:left;
}
#template{
	position:absolute;
	top:1em;left:0;
	width:100%;
	height:auto;
	z-index:0;
	}
#template img{
	position:absolute;
	top:0;left:0;
	width:100%;
	height:auto;
	}
td{
	background-color:var(--bg-color);
word-wrap:break-word;
vertical-align:top;
 }
#cartContainer::-webkit-scrollbar {display:none;}
img, ul, ul li{
	vertical-align: super;
	padding: 0;
	border: 0;
	margin: 0;
}
h2{font-size:1em; }
ul {
    list-style:none;
	margin-left:0;
}
ul li {
    /* grid-template-columns: 25% 25% 25% 25%; */
    width: calc(25% - 6px);
    /*width:20%;*/
vertical-align: baseline;
  display: inline-block; border: 0;
}

a, a:link, a:hover, a:visited {
	text-decoration: none;
	color: var(--primary-text-color);
}

.dropdown:hover, a:hover, a:focus, .dropdown:focus, button:focus, button:hover {color:var(--primary-text-color); background-color:var(--bg-color); }
textarea {width:100%;height: fit-content !important;font-size:0.8em;background-color:var(--bg-color) !important;
	color:var(--primary-text-color) !important;}
.tox *:not(svg):not(rect) {
	background-color:var(--bg-color) !important;
	color:var(--primary-text-color) !important;
	}
.dropbtn button, button {
  background-color:var(--bg-color);
  color:var(--primary-text-color);
  border: none;
  cursor: pointer;
  font-size:inherit !important;
}
.dropbtn a {display:block;}
.dropdown, .dropdown a{
background-color:var(--bg-color);
  color:var(--primary-text-color);
  position: relative;

  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  margin-left:-12px;
  padding:12px;
  background-color: var(--bg-color);
  opacity:0.9;
  min-width: 160px;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  z-index: 1;
  font-weight:400;
}
.floating-box:hover .floatover, .floating-box:active .floatover{
  opacity: 0.9;
 /* background-color:var(--bg-color);*/
  opacity:0.9;
}
.divider {background-color:var(--bg-color);color:var(--primary-text-color);width:50%;}
.edit {width: 100%;}
.image{z-index:100;}
.image:hover{background:yellow;opacity:0.3;}
.floattext {
 background-color:var(--bg-color);
width:calc(100% - 22px); /*-webkit-fill-available*/
height:calc(100% - 22px);
 position:absolute;
 left:0;
 top:0;
 /*font-size:larger;*/
 text-transform: capitalize;
 hyphens: auto;
 padding: 11px;
 margin:0px;
  /*z-index:200;*/
display: block;
  /*-webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;*/
}
.floatover{
opacity: 1;
 transition: .8s ease;
background-color:var(--bg-color);
 z-index:200;}
 .floattext:hover, .floatover:active{
	 background-color:none;
opacity: 0;
 transition: .8s ease;

 z-index:200;}

.dropdown-content a {
  color: black;
  padding: 6px 12px;
  text-decoration: none;
  display: block;

}
.tox-statusbar__branding{visibility:hidden !important;}
.preview
{
width:300px;
border:solid 1px var(--primary-text-color);
padding:6px;
margin-right:10px;
}

.progress { position:relative; width:400px; border: 1px solid #ddd; padding: 1px; border-radius: 3px; }
.bar { background-color: #B4F5B4; width:0%; height:20px; border-radius: 3px; }
.percent { position:absolute; display:inline-block; top:3px; left:48%; }

.profile-upload{
	display: inline-block;
    background-image:url('');
    background-size:cover;
    background-position: center;
    height: 150px !important; width: 100%;
    border: 1px solid var(--primary-text-color);
    position:relative;
  border-radius:10px;
  overflow:hidden;
}
.igrid{display:inline-grid;}
.profile-upload:hover input.upload{
  display:block;
}
.profile-upload:hover .hvr-profile-img{
  display:inline-block;
 }
.profile-upload .fa{   margin: auto;
    position: absolute;
    bottom: -4px;
    left: 0;
    text-align: center;
    right: 0;
    padding: 6px;
   opacity:1;
  transition:opacity 1s linear;
   -webkit-transform: scale(.75); 
 
 
}
.profile-upload:hover .fa{
   opacity:1;
   -webkit-transform: scale(1); 
}
.profile-upload input.upload {
    z-index:1;
    left: 0;
    margin: 0;
    bottom: 0;
    top: 0;
    padding: 0;
    opacity: 0;
    outline: none;
    cursor: pointer;
    position: absolute;
    background:#ccc;
    width:100%;
    display:none;
}

.profile-upload .hvr-profile-img {
  width:100%;
  height:100%;
  display: none;
  position:absolute;
  vertical-align: middle;
  position: relative;
  background: transparent;
 }
.profile-upload .fa:after {
    content: "";
    position:absolute;
    bottom:0; left:0;
    width:100%; height:0px;
    background:rgba(0,0,0,0.3);
    z-index:-1;
    transition: height 0.3s;
    }

.profile-upload:hover .fa:after { height:100%; }
.dropdown-content a:hover {/*font-weight:700;*/}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  background-color: var(--bg-color);
}

/*Splash animation stuff*/
#splashLogo {position: fixed; top:0; left:0; width: 100%; height: 100%; z-index: 99999;}
#splashLogo svg {width:100%;height:100%}
#splashLogo path {
  	stroke:lime;
	stroke-width:5;
	stroke-dasharray: 1100;
  	stroke-dashoffset: 1100;
  	-webkit-animation: dash 3s linear alternate;
	-moz-animation: dash 3s linear alternate;
    animation: dash 3s linear alternate;
	-webkit-animation-iteration-count: 2;
	-moz-animation-iteration-count: 2;
	animation-iteration-count: 2;
}

@-webkit-keyframes dash {
  to {stroke-dashoffset: 0; }}

@-moz-keyframes dash {
  to {stroke-dashoffset: 0; }}

@keyframes dash {
  to {stroke-dashoffset: 0px; }}

/*grid style*/
.flow {
	position: relative;
    width: calc(100% - 1.8em + 4px);
    padding-bottom: 4em;
    left: calc(1em - 2px);
    /* margin-top: 0.5em; */
    top: 5.5em;
    /* display: flex; */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.underscore, .underline a:hover, .underline a:focus, .underline a, .underline a:link, .underline a:visited {
  border-bottom: solid 2px !important;
  padding-bottom: 0 !important;
}

.center {text-align: center}

.blue {color:blue;margin-bottom:0;}
/*p {margin-bottom: 1em; max-width:50%;}
*/
h1 {font-size:inherit;color:var(--primary-text-color);}
h3 {margin:0; line-height: 1.5em;}

.flowboxes {
	top:1.5em;
	margin-bottom:1.5em;
	padding-bottom: 1.5em;
	color: var(--primary-text-color);
    position: relative;
    left: 2px;
    /*width: calc(100% - 7.2em);*/
    display: -ms-grid;
    display: grid;
	max-width: calc(100% - 4px);
    /* margin: 0 auto; */
    /*-ms-grid-columns: calc(25% - 2px) calc(25% - 2px) calc(25% - 2px) calc(25% - 2px);*/
	
grid-template-columns: repeat(auto-fit, minmax(24%, 4fr));    
grid-gap: 2.4em;
    -ms-grid-column-align: center;
    justify-items: center;
    /* font-size: smaller;*/
}

.floating-box {
	position:relative;
	background-image:url("");
    /*display: inline-block;*/
    width:100%;
	height:auto;
    margin: 0px;
    border: 2px solid var(--primary-text-color); 
	text-align:left;
	vertical-align:bottom;
	background-color:transparent;
	}

div.floating-box img {width:100%; height:100%;/*visibility:hidden;*/}
div.floating-box p { }
.button { background-color: var(--bg-color);
    color: var(--primary-text-color);
    /*width:80%;*/
    /*border: 2px solid black;*/
    /*padding: 10px 20px;*/
/*	padding: 0.25em 0.5em;
*/    text-align: center;
    text-decoration: none;
    display: inline-block;
margin-bottom:1em;
	}
/*end grid style*/

/*Cart styles---do not mess with this*/
.headerRow,.itemRow{
	width:100%;
	display:-webkit-flex;-webkit-justify-content:space-between; /*both of these for old safari only*/
	display:grid;
	/*grid-template-columns:10% 40% 3% 3% auto -webkit-max-content; old values 
	grid-template-columns:10% 40% 3% 3% 10% auto max-content; old values */
	grid-template-columns:5% 50% 2% 4% 10% 27%;
	}
.headerRow{color:var(--primary-text-color);text-decoration:none;}
.itemRow{color:black;}
.item-total{text-align:right;}
.item-quantity,.item-remove{justify-self:center;}
.item-origprice{text-decoration: line-through;}
.cartTotal{
	text-align:right;
	width:100%;
	line-height:1.8em;
	margin:10px 0 10px 0;}
#grandTotal {
	text-align:center;}
#cartContainer{
	display:none;
	position:absolute;
	background-color:var(--bg-color);
	left:10%;
	width:80%;
	min-height:80vh;
	height:auto;
	top:10em;
	z-index:40;
	overflow:auto;}
.tophr{position:static !important;
	display:inline;
	z-index:1199;}
#viewcart {display:block;
	cursor: pointer;}
input {font-family:inherit;
	font-size:inherit;
	color:inherit;
	border:none;
	border-bottom:dashed thin;
	max-width: 60%;}
select {font-family:inherit;
background-color: var(--bg-color);
	font-size:inherit !important;
	color:var(--primary-text-color);
	border:none;
	border-bottom:dashed thin;}
.promoButton {
	width:35% !important;
	font-size:inherit;
	background-color:var(--bg-color);
	padding:0.25em 0.5em;
	text-align:center !important;
	color:grey;
	text-decoration:none;
	border:2px solid var(--primary-text-color);}
#promoSub, #promoChange {
	font-size:inherit;
	background-color:var(--primary-text-color);
	border:2px solid var(--primary-text-color);
	border-radius:0;
	padding:0.25em 0.7em;
	color:var(--bg-color);
	line-height: 1.1.8em;}
#discOK {display:none;
	text-align:right;
	white-space: pre-wrap;}
#flowboxes, #flowboxes1,, #flowboxes2{visibility:visible;}
#promoCodeDiv {margin-top: 1em;
	text-align: center}
#cc{padding-bottom: 120px;} /*this clears the end of the cart after the cards*/
.paypal{text-align:justify;
	width:100%;}
.noshow{display:none;}
/*End Cart styles*/

/*MC styles*/
.mailchimp ul li {text-align: left;display:flex;}
.indicates-requiblack {font-size: smaller;}
.clear {text-align: center;}
.clear button, .clear input {
	background-color: var(--bg-color);
    color: black;
	width: 80%;
    border: 2px solid var(--primary-text-color);
    padding: 10px 20px;
    padding: 0.25em 0.5em;
	text-align: center;}


.footer a:link, .footer a:visited, .button a:link, .button a:visited{
    background-color: var(--bg-color);
    color: black;
    border: 2px solid var(--primary-text-color);
    /*padding: 10px 20px;*/
	padding: 0.25em 0.5em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

.footer a:hover, .footer a:active, .button a:hover, .button a:active{
    background-color: yellow;
}

hr {
	height: 1.5em;
	position: fixed;
	left: 9.9%;
	z-index: 199;
    border: 0;
	margin:0;
	width: 80.2%;
    margin-top:-1px;
}

.headerhr {	
	z-index:42;
	position:fixed;
	clear:both;
	left:0;
	width:80%;
left:10%;
	top:6em;
}

.footerhr {
	position:fixed;
	bottom: 3.75em;
	/*margin-top: -35px;*/
	z-index: 999;
}
li{white-space: nowrap;}
.middlehr{
	position:absolute;
	left:0;
    width:100%;
	z-index:50;
    height:1.5em;
	margin-top: 2%; /*pushes middlehr down over image*/
}
.middlehrBooks {margin-top:-1.5%;z-index:38;}

div.logo {
/*	clear: none;*/
    position: absolute;
	top: 1em;
	left:1em;
	z-index: 100;
	/* 	margin-left: 20%;
	margin-top: -25%;
   border: 3px solid #73AD21;*/
}
div.short  {visibility:hidden;}
div.long{visibility:visible;}
.cart {
/*	clear:none;*/
    position: absolute;
	top: 1.25em;
	right:0.2em;
	text-align:right;
/*    border: 3px solid #73AD21;
*/	z-index: 200;
/*	margin-left:-3%;*/
}

.cartcount { 
    border-radius: 50%;
	position:fixed;
	top:1.8em;
	right:10%;
    width: 1.1em;
    height: 1.1em;
    padding: 1.8em;
    background: var(--primary-text-color);
    color: white;
    text-align: center;
	z-index: 1;
}

.sticker { /*not working yet*/
    border-radius: 50%;
    width: 1.1em;
    height: 1.1em;
    padding: 1.8em;
    background: green;
    color: white;
    text-align: center;
	z-index: 999;
}

.topBanner {
	color:white;
	text-align: center;
	vertical-align: middle;
	width:100%;
    height:1.5em;
	padding:1.5em 0 0 0; /* T R B L*/
	margin-bottom: 0.5em;
    background: -webkit-linear-gradient(right, rgba(255,0,0,0), rgba(255,0,0,1),rgba(255,0,0,1)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left, rgba(255,0,0,0), rgba(255,0,0,1),rgba(255,0,0,1)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left, rgba(255,0,0,0), rgba(255,0,0,1),rgba(255,0,0,1)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left, rgba(255,0,0,0), rgba(255,0,0,1),rgba(255,0,0,0)); /* Standard syntax (must be last) */
}
#topBanner{z-index: 41;
    width: 80%;
    top: 6em;
    left: 10%;
	display:none;
    position: fixed;}
#cartBanner{z-index: 41;
    width: 80%;
    top: 6em;
    left: 10%;
    display: none;
    position: fixed;
	}
.middleBanner {margin-top:-1.8em;}

.buttright {
	text-align: center;
	top: 0;
	float: right;
	margin-right: 0;
    width: 22%;
/*    border: 3px solid #73AD21;
*/	z-index: 999;
	/*visibility:hidden;*/
}

div.header {
	/*display:flex;*/
	/*justify-content: space-between;*/
    position: fixed;
    padding: 1em 0% 0% 0%; /* T R B L*/
    width:100%;
	top: 0;
	left: 0;
	background-color: var(--bg-color);
	color: var(--primary-text-color);
	/*height: 6em;*/
/*    border: 3px solid #73AD21;
*/	z-index: 200;
	padding:0; /*just to cover part-pixel rounding*/
	
}

div.headercontent {
	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;    /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;  /* TWEENER - IE 10 */
	display: -webkit-flex; /* NEW - Chrome */
	display: flex;         /* NEW, Spec - Opera 12.1, Firefox 20+ */
          justify-content: space-evenly;
		  -webkit-box-pack: justify;
		  -ms-flex-pack: justify;
	align-items: center;
    /*position: relative;*/
    padding: 0% 0% 0% 0%; /*T R B L*/
    width: 100%;
	top: 0;
	height:4em;
	background-color:var(--bg-color);
	left: 0;
/*    border: 3px solid #73AD21;
*/	z-index: 110;
}

div.spacer {
    width: 100%;
	top: 0;
	left: 0;
	height:1.1em;
	background-color:var(--bg-color);
/*    border: 3px solid #73AD21;
*/	z-index: 110;
}

div.cart img, div.logo img {
	height: 100%;
	width: auto;
}
div.menu{position: absolute;
	top:4em;
	left:0px;
	text-align: left;
	width: calc(100% - 1.8em + 5px);
	height:1.5em;
	left:0.9em;
	background-color:var(--bg-color);
	z-index:200;
	border-top:solid 2px var(--primary-text-color);
	border-bottom:solid 2px var(--primary-text-color);
}
.topsave{
	position: fixed;
    top: calc(5.5em + 4px);
    right: calc(0.9em - 4px);
    z-index: 101;
	border-bottom:none;
	padding:4px;
	}
.badge{
	position: absolute;
    bottom: 0;
	text-transform:lowercase;
	text-transform:capitalize;
	border-top:solid;
	border-width:2px;
    padding-left: 0.5em;
	padding-top:8px;
	height:1.6em;
    width: calc(100% - 0.5em);
    z-index: 99;
	background-color:transparent;
}
.cop_icon{
	position: absolute;
    bottom: 0;
	text-transform:lowercase;
	text-transform:capitalize;
	font-size:2em;
    padding-left: 0;
	padding-top:8px;
	height:1.6em;
    width: calc(100% - 0.5em);
    z-index: 99;
	background-color:transparent;
}
.red {background-color: red;}
.blue {background-color: blue;}
.yellow {background-color:yellow;}
div.longtext.dividerMenu{padding-top:0px;}
div.dividerMenu{
width:100%;
	min-height:1.5em;
	left:0;
	position:sticky;
	top:5.5em;
	background-color:var(--bg-color);
	    margin-top: -1px;

	z-index:100;
	border-top:solid 2px var(--primary-text-color);
	/*border-top-style:outset;*/
	border-bottom:solid 2px var(--primary-text-color);
	padding:6px 0 4px 0 !important; 
}
#studio { position:relative; background-color:var(--bg-color);color:var(--primary-text-color)}
.fit textarea{width: calc(100% - 1.8em) !important;}
.ui-accordion .ui-accordion-content {
    padding: 0 !important;
    border-top: 0;
    overflow-x: hidden;}
.ui-accordion .ui-accordion-header {height:1.5em;
	left:0;
	position:sticky;
	top:5.5em;
	padding:0;
	background-color:var(--bg-color);
	z-index:102;
	border-top:solid 2px var(--primary-text-color);
	border-bottom:solid 2px var(--primary-text-color);
	/* padding:2px; */
	padding-top: 6px;
	width: 100% !important;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {background-color:var(--primary-text-color);color:var(--bg-color);}
h1.dividerMenu{	background-color:var(--bg-color);color:var(--primary-text-color);}
div.studioGroup{
	position:relative;
	width:100%;
	display: inline-block;
	}
.needed {visibility:hidden;/*color:red;*/}
.menu a, .menu a:hover, .menu a:active, .menu a:visited {
	z-index: 200;
	color: var(--primary-text-color);
	display:block;
	padding:2px;
	text-transform: capitalize;
}
strong {font-weight: bolder;}
.highlight{background-color:yellow;}
/*.menu a:hover {	font-weight:700;} */
form{font-size:1em !important; }
div.footer {
	display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;    /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;  /* TWEENER - IE 10 */
	display: flex;         /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	background-color:var(--bg-color);
	border-top: solid 2px var(--primary-text-color);
    position: fixed;
	bottom:-1px;
	left: calc(1em - 3px);
    width: calc(100% - 1.8em + 5px);
	height: 3.5em;
/*    border: 3px solid #73AD21;
*/	z-index: 998;
}
div.footer.img {bottom:1.5em;}
div.footer.img::after{
	content:'Copyright 2022';
	}

div.footerright {
	position: relative;
	color: black;
/*    border: 3px solid #73AD21;
*/	top: 5%;
	white-space: nowrap;
	z-index: 999;
}

div.footerleft {
	position: relative;
	color: var(--primary-text-color);
	bottom: 0;
	white-space: nowrap;
    /*width: 25%;*/
	top: 5%;
/*    border: 3px solid #73AD21;
*/	z-index: 999;
}

div.longtext {
    position: relative;
	/*width: 90%;*/
	top: 6em;
	color: var(--primary-text-color);
	width: calc(100% - 1.8em + 5px);
    left: calc(1em - 3px);
	padding-bottom: 33%;
/*    border: 3px solid #73AD21;
*/	z-index: 0; 
	background-color:var(--bg-color);	
}
div.longtext div{
	/*padding-top: 0.5em;*/
	padding-bottom:0.5em;
	overflow-wrap:anywhere;
	min-height: fit-content;
	
	}

div.longtext:after {
	content:"";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

div.bookstext {
    position: relative;
	width: 80%;
	top:10%;
	color: black;
	left: 10%;
	padding: 0% 0% 32% 0; /* T R B L*/
/*    border: 3px solid #73AD21;
*/	z-index: 0;
	margin-top:6em; 	
}
#burger {display:none;}
.caption{
    font-size: 0.8em;
    text-align: left;
    line-height: normal;
    display: block;padding-top:4px;}
div.dida {
	position:relative;
    display: inline-block !important;
    left: 10%;
	color: black;
    width:40%;
	/* top:50vh;
   border: 3px solid #73AD21;
*/	z-index: 0;
	margin-top:20%;
}

div.container {
	float: left;
	width: 100%;
/*    border: 3px solid #73AD21;
*/	z-index: 1;
}
div.rightblock {
    position: static;
	float:right;
    left: 10%;
	margin-top:6em;
	color: var(--primary-text-color);
	width: 40vw;
	height: 40vw;
	margin-right: 1em;
	margin-bottom: 0.5em;
/*    border: 3px solid #73AD21;
*/	z-index: -1;
	overflow: hidden;
	display: inline-block;
	
}
.upload {border:none;
	text-decoration:none !important;}
div.carousel {
	margin-top:0.5em;
	color: var(--primary-text-color);
	position: static;
	float:right;
    left: 10%;
	color: var(--primary-text-color);
	width: 35vw;
	height: auto;
	margin-right: 1em;
	margin-bottom: 0.5em;
/*    border: 3px solid #73AD21;
*/	z-index: -1;
	overflow: hidden;
	display: inline-block;
}
.mobileCarousel{height: fit-content;max-height:calc(100% - 300px);}

.carousel img {
	max-height: calc(100% - 6.5em);
	width: auto;
	padding:0px;
}
.slickslide {width: calc(100% + 1px);}
.slick-dots {
	/*    border: 3px solid #73AD21;
*/
}
.slick-slide
{
 display: flex;
 justify-content: center;
 align-items: center;}
.slick-dots li {
	color:var(--primary-text-color);
}

.slick-active {color:var(--primary-text-color)}

div.page {
    position: fixed;
    left: 10%;
	top: 20%;
    width: 80%;
	height: 80vw;
	text-align: center;
	padding: 10px;
	overflow: hidden;
/*    border: 3px solid #73AD21;
*/	z-index: 0;
}

div.colophon {
	text-align: center;
	font-size: medium;
	color: black;
	width: 80%;
    right: 0;
	bottom: 0;
	margin-top: 5%;
/*    border: 3px solid #73AD21;
*/	z-index: 0;
}

.bg {
	width: 100%;
	height: auto;
	z-index: 0;
}
#yin::before {
          font-family: "Font Awesome 5 Brands"; 
          font-weight: 400;
          content: "\f09a";
        }
/*    For small devices */
@media only screen and (max-width: 767px){
		/*h1{font-size:1.8em;}*/
		/*html {font-size:0.8em;}*/
		/*div.menu {height:1.8em;top: 6em; }*/
		body{font-size: 1.4em;}
		.cart{max-width:85px;height:auto;}
		input{all:unset;}
		.flowboxes{
		    width: calc(100% - 4px); 
		    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
		    -ms-grid-columns:repeat(auto-fit, minmax(240px, 1fr)); 
		    grid-gap: 1em; 
		}
		div.carousel{margin-top:5.5em;}
		
}
pre {display:none;}
.half{width:50% !important;}
@media only screen and (max-width: 767px) and (orientation:portrait){ /* includes skinny browser windows position:relative;left:0;top:0;*/
	/*ul li{display: block;width: auto;margin: 0 auto; background-color:#EBE8DE;}*//*text-align:center;*/
	.divider {width:100%;}
	.dividerMenu{
	width: 100%;}

	div.menu {    width: calc(100% - 1.8em + 4px);}
	/*.flow{left:7%;}*/
	ul {margin-left:0;}
	.cart{right:7%;}
	/*div.menu ul {width:40%;}*/
	/*.dropdown-content a {padding:0px;}*/
	/*#horiz {display:none;}*/
	/*.dropdown-content{margin-left:130px;margin-top:-20px;}*/
	/*#burger {display:block;}*/
	div.longtext{width: calc(100% - 1.8em); padding: 0.9em;padding-bottom: 33%;padding-top:0px;left:0;top:5.5em;height:auto;}
	div.longtext div{height:fit-content;padding-top: 0.5em;}
  div.half, table.half{width: calc(100% + 2px) !important;}
	div.shrink{width: calc(100% - 1.8em) !important;padding-top:0px !important;padding-bottom:0px;}
	/*.longtext{top:4em;}*/
	p {max-width:100%;}
	/*li.separator {visibility:hidden; line-height:0px;}*/
	div.long  {visibility:hidden;}
	div.short {visibility:visible;}
	div.carousel{position:relative;left:0;padding-top:0.5em;width: 100%;padding-bottom:1em;overflow:hidden;margin:auto;position:inherit;}
	.slickslide{width:100%;max-height:calc(100% - 6em - 2.5em);}
	.buttright {position:relative;visibility:visible;}
	.carousel img {width: calc(100vw - 1.8em); height: auto;min-height:unset;}
	div.headercontent{height:4em;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between; !important; background-color:var(--bg-color);}
	/*.flowboxes{grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));grid-gap: 8px;}*/
		}

@media only screen and (orientation:landscape) {
	.flowboxes{grid-template-columns: repeat(auto-fit, minmax(9.6em, 4fr));grid-gap: 1.8em;
	-ms-grid-columns:(minmax(9.6em, 4fr))[auto-fit];}
	div.logo {}
	.buttright {position:relative;visibility:visible;}
	/*div.carousel{margin-top:-2em;}*/
	.carousel img {height: 35vw; width: auto;min-height:none;}
}

/* IPAD CORRECTIONS GO HERE */
@media only screen and (min-width : 768px) and (min-height : 400px)  {
	/*body{font-size: 1em;}*/
	#cartContainer {width: 50%; left: 25%;}
	#mc_embed_signup {width: 62.5%; margin-left: 19%; margin-top:10%;}
	.carousel img {background-color:var(--bg-color);max-height:55vh;width:55vh;height:55vh;width:auto;padding-top:0.5em !important;}
/*	.flowboxes{grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));grid-gap: 10px;}
*/}

@media only screen and (min-aspect-ratio : 10/10) {
    	
	/*div.carousel{width:40vw;margin-top:10%}*/
	/*div.longtext{margin-top:20vh;  top:0%;}*/
}
@media only screen and (min-aspect-ratio : 955/555) {
	div.carousel{/*position:static;margin-top:-1.8em;*/}
	/*div.longtext{margin-top:20vh;  top:0%;}*/
}
@media only screen and (max-aspect-ratio : 10/10) {
	/*div.carousel{width:80vw;}*/
	/*div.longtext{margin-top:0%;  top:0%;}*/
}
.a2a_s__default {
  background-color: var(--primary-text-color) !important;
}
/*@media (min-width:420px) {
	div.cart img, div.logo img {
	width: 80%;
	font-size:small !important;
	height: auto;
}
*/