*{margin:0;padding:0}

html{ box-sizing:border-box;}
html, body{
    height: 100%; width:100%; margin:0;
	
	font-size:72px;
	font-family:Arial, Helvetica, sans-serif;
}
svg {position:absolute;top:10%;width:100%;height:90%;}
h1 {
	padding-left:10%;
	-webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color:#399;
	-webkit-text-fill-color:#FFF;	
}
.flipbook-viewport{zoom:0.6 !important;}
body {
	overflow:hidden;
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	font-size: 16px;
	color:grey;
	border: 0;
	margin: 0;
	padding:0;
	background-color:white;
	text-align:left;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(124deg, rgba(255,255,255,1) 0%, rgba(222,222,222,1) 100%);
	background: -webkit-linear-gradient(124deg, rgba(255,255,255,1) 0%, rgba(222,222,222,1) 100%);
	background: linear-gradient(124deg, rgba(255,255,255,1) 0%, rgba(222,222,222,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#dedede",GradientType=1);
}
#container {
	position: absolute;
	width: 84%;
	/*    border: 3px solid #73AD21;
*/	z-index: 500;
	left: 8%;
	top: 0;
	
}
.titletext {
	font-size:2em;
margin-top:20px;
	line-height:1.1em;
	color:#00cc66 !important;
	z-index:1;
}
.titletext img, .titletext iframe{width:100%;     max-width: 720px;height:auto;z-index:50;}
.pointer {pointer-events:auto;}
.statement {
	font-size:0.5em;
	line-height:1.5em;
	color:grey;
}

#constellation{font-size:0.6em;position:absolute;top:0; left:0;width:100%; height:100%;z-index:400;}
#constellation.img {height:102px; width:160px;}
p {font-size:inherit;padding-left:10%;}
/*shapes */
/*diamond by Joseph Silber http://josephsilber.com/ */
#diamond {
      width: 0;
      height: 0;
      border: 50px solid transparent;
      border-bottom-color: red;
      position: relative;
      top: -50px;
    }
 #diamond:after {
      content: '';
      position: absolute;
      left: -50px;
      top: 50px;
      width: 0;
      height: 0;
      border: 50px solid transparent;
      border-top-color: red;
    }
.triangle-down {
      width: 0;
      height: 0;
      border-left: 50px solid transparent;
      border-right: 50px solid transparent;
      border-top: 100px solid red;
    }

.circle {
    width: 100px;
    height: 100px;
    background: red;
    border-radius: 50%
    }

.tv {
      position: relative;
      width: 200px;
      height: 150px;
      margin: 20px 0;
      background: red;
      border-radius: 50% / 10%;
      color: white;
      text-align: center;
      text-indent: .1em;
    }
#tv:before {
      content: '';
      position: absolute;
      top: 10%;
      bottom: 10%;
      right: -5%;
      left: -5%;
      background: inherit;
      border-radius: 5% / 50%;
    }
.cone {
      width: 0;
      height: 0;
      border-left: 70px solid transparent;
      border-right: 70px solid transparent;
      border-top: 100px solid red;
      border-radius: 50%;
    }
 .cross {
      background: red;
      height: 100px;
      position: relative;
      width: 20px;
    }
    .cross:after {
      background: red;
      content: "";
      height: 20px;
      left: -40px;
      position: absolute;
      top: 40px;
      width: 100px;
    }
img, ul, ul li{
	padding: 0;
	border: 0;
	margin: 0;
}
ul {
    list-style:none;
}
ul li {
    display:inline-block;
    width:20%;
}
ul li{
  display: inline-block; border: 0;
}

a, a:link, a:hover, a:visited {
  text-decoration: none;
}

a:hover, a:focus{color:grey;}

/*grid style change width to make 'skinnier'*/
.flow {
	position:relative;
	width:84%; 
	margin-top:5em;
	left:8%;
	/*display:flex;*/
	-webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
iframe{z-index:999 !important;max-height:60%;padding-top:5%;}

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

.center {text-align: center}

.#000000 {color:#000000;margin-bottom:0;}
p {margin-bottom: 1em;}
h1 {font-size:1.5em;}
h3 {margin:0; line-height: 1.5em;}

.flowboxes {
color: grey;
position: relative;
width: 100%;
/*display:-webkit-flex;
-webkit-justify-content:flex-start;*/
display: -ms-grid;
display: grid;
margin:0 auto;
-ms-grid-columns:(minmax(220px, 1fr))[auto-fit];
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
grid-gap: 10px;
-ms-grid-column-align: center;
justify-items: center;
font-size: smaller;
}

.floating-box {
    /*display: inline-block;*/
    width:100%;
	height:auto;
    margin: 0px;
    /*border: 3px solid #73AD21; */ 
	text-align:left;
	vertical-align:bottom;
}

div.floating-box img {width:100%; height:auto;}
div.floating-box p { }
.button { background-color: white;
    color: #000000;
    /*width:80%;*/
    /*border: 2px solid #000000;*/
    /*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%;
	}

.noshow{display:none;}

.clear {text-align: center;}
.clear button, .clear input {
	background-color: white;
    color: #000000;
	width: 80%;
    border: 2px solid #000000;
    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: white;
    color: #000000;
    border: 2px solid #000000;
    /*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%;
	/*background: url(../assets/zig.png) repeat-x 0 0; background-size:contain;*/
	z-index: 199;
    border: 0;
	
	margin:0;
	width: 80.2%;
    margin-top:-1px;
}

.headerhr {
	/*background: url(../assets/zag.png) repeat-x 0 0;
	background-size:contain; this is zigzag */
	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{
    background: url(../assets/zag.png) repeat-x 0 0;
	background-size:contain;
	position:absolute;
	left:0;
    width:100%;
	z-index:50;
    height:1.5em;
	margin-top: 2%; /*pushes middlehr down over image*/
}
.middlehrZines {margin-top:-1.5%;z-index:38;}

div.logo {
/*	clear: none;*/
    position: relative;
	top: 0;
	left:0;
    height: 4.5em;
	width: 4.5em;
	z-index: 100;
	/* 	margin-left: 20%;
	margin-top: -25%;
   border: 3px solid #73AD21;*/
}
div.logo img {
	-webkit-filter:hue-rotate(90deg);
	filter:hue-rotate(90deg);}
.cart {
/*	clear:none;*/
    position: relative;
	top: 0;
	float: right;
    height: 4.5em;
	width: 4.5em;
/*    border: 3px solid #73AD21;
*/	z-index: 200;
/*	margin-left:-3%;*/
	text-align:right;
}

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

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

.topBanner {
	color:white;
	text-align: center;logo
	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:-0.2em;}

.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: 0% 0% 0% 0%; /* T R B L*/
    width: 81%;
	top: 0;
	left: 9.5%;
	background-color: white;
	color: #000000;
	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;
	left: 0;
/*    border: 3px solid #73AD21;
*/	z-index: 110;
}

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

div.cart img, div.logo img {
	height: 100%;
	width: auto;
}

div.menu, .menu a, .menu a:hover, .menu a:active, .menu a:visited {
	position: relative;
	text-align: center;
	width: 100%;
	z-index: 200;
	color:#000000;
}

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;
    position: fixed;
	padding: 0% 10% 0% 0%; /* T R B L*/
	bottom: 0;
	left:10%;
    width: 80%;
	height: 3.8em;
	background-color: white;
/*    border: 3px solid #73AD21;
*/	z-index: 998;
}

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

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

div.longtext {
    position: relative;
	width: 80%;
	top: 6em;
	color: #000000;
	left: 10%;
	padding-bottom: 33%;
/*    border: 3px solid #73AD21;
*/	z-index: 0; 	
}

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

div.Zinestext {
    position: relative;
	width: 80%;
	top:10%;
	color: #000000;
	left: 10%;
	padding: 0% 0% 32% 0; /* T R B L*/
/*    border: 3px solid #73AD21;
*/	z-index: 0;
	margin-top:6em; 	
}

div.dida {
	position:relative;
    display: inline-block !important;
    left: 10%;
	color: #000000;
    width:40%;
	/* top:50vh;
   border: 3px solid #73AD21;
*/	z-index: 0;
	margin-top:20%;
}



div.carousel {
    position: static;
	float:left;
    left: 10%;
	/*top:16%;*/
	color: #000000;
	width: 40vw;
	height: 40vw;
	margin-right: 1em;
	margin-bottom: 0.5em;
/*    border: 3px solid #73AD21;
*/	z-index: -1;
	overflow: hidden;
	display: inline-block;
}

.carousel img {
	min-height: 100%;
	width: auto;
}

.slick-dots {
	/*    border: 3px solid #73AD21;
*/
}

.slick-dots li {
	color:#000000;
}

.slick-active {color:#000000}

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: #000000;
	width: 80%;
    right: 0;
	bottom: 0;
	margin-top: 5%;
/*    border: 3px solid #73AD21;
*/	z-index: 0;
}

.bg {
	width: 100%;
	height: auto;
	z-index: 0;
}

/*    For small devices */
@media only screen and (max-width: 767px){
		.flowboxes{grid-template-columns: repeat(auto-fit, minmax(122px, 1fr));-ms-grid-columns:repeat(auto-fit, minmax(122px, 1fr));grid-gap: 8px;
		}
}

@media only screen and (max-width: 767px) and (orientation:portrait){ /* includes skinny browser windows position:relative;left:0;top:0;*/
	ul li{/*text-align:center;*/display: block;width: auto;margin: 0 auto;}
	div.menu {width:40%; margin-top: -3%;}
	div.cart , div.logo  {}
	div.carousel{margin-top:0; width: 100%;height: 80vw;overflow:hidden;}
	.slickslide{width:100%;height:80vw;}
	.buttright {position:relative;visibility:visible;}
	.carousel img {width: 80vw; height: auto;min-height:none;}
	div.headercontent{-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between; !important;}
	/*.flowboxes{grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));grid-gap: 8px;}*/
		}

@media only screen and (orientation:landscape) {
	.titletext{}
	div.logo {}
	div.cart {}
	.buttright {position:relative;visibility:visible;}
	div.carousel{}
	.carousel img {height: 40vw; width: auto;min-height:none;}
}

/* IPAD CORRECTIONS GO HERE */
@media only screen and (min-width : 768px) and (min-height : 400px)  {
	#cartContainer {width: 50%; left: 25%;}
	#mc_embed_signup {width: 62.5%; margin-left: 19%; margin-top:10%;}
	.carousel img {width: 40vw; height:auto;min-height:none;}
/*	.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:0%;}
	/*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: #000000 !important;
}
/*@media (min-width:420px) {
	div.cart img, div.logo img {
	width: 80%;
	font-size:small !important;
	height: auto;
}
*/