html { -webkit-text-size-adjust: 100%;}
#mainCover {display:none;}
.iris h1 {display:none; }
.iris { position:relative;  max-width:700px;  margin:0 auto}
#iMage, #homePage #extra1 , #homePage #extra2 { visibility:hidden; opacity:0; }
.nb {text-decoration:none;}
.flex-container {text-align: center; display: flex;  flex-flow: row wrap; margin:0; justify-content: space-between; padding:0;  list-style: none;}

.flex-item {position: relative; padding:0; width: 32%; margin: 0;text-align: left;display: inline-block; }
.flex-item a.nb, .flex-item2 a.nb {display:block; }
.flex-item img { width:100%; display:none; padding:3px; border:1px solid #a2d8e6} /*/ */

.flex-item2 { position: relative; padding:0; width: 23%; margin: 0;text-align: left;display: inline-block; }
.flex-item2 img { position: relative;width:100%;  padding:3px; border:1px solid #a2d8e6; opacity: 0;transition: all 2s ease}
.fadeIn, #extra3 .flex-item2 img.fadeIn { display:block; opacity: 1.0; transition: all 2s ease}

.top {transform: translateY(100%);  transition: all 2s ease;opacity:0;}
.topped { transform: translateY(0%);opacity:1;}
.lazyz {visibility:hidden;}
figure {margin: 0px; position: relative; display: block;}
figure img {position: relative;}

.flex-item figcaption,.flex-item2 figcaption  {cursor:pointer; position: absolute; top: 0; left: 0; padding: 0 4px; background: url(../assets/whiteshade60.png); color: #000;}
.flex-item figcaption h3, .flex-item2 figcaption h3 {margin: 0; padding: 0; color: #064387; border-color:#064387;}
 
 figcaption a {text-align: center; padding: 3px 10px; border-radius: 2px;  background: #fff; color: #000;}
 figcaption span {display:block; position:relative; padding:15px 15px 25px 15px;}
 
.cs-style-3 figure {clip-path: inset(0px -9px 0px 0px);} /*overflow:hidden; */

figure:hover img {transform: translateY(0px);transition: transform 0.4s }
.flex-item figcaption, .flex-item2 figcaption { width: 100%; top: auto; bottom: 0px; opacity: 0; transform: translateY(100%);transition: transform 0.4s, opacity 0.1s 0.3s;}

.flex-item figcaption{height:70px; }
.flex-item2 figcaption {height:65px; }

figure:hover figcaption {opacity: 1; transform: translateY(0px);transition: transform 0.4s, opacity 0.1s;} /* use this one*/

#main .cs-style-3 figcaption a {position: absolute; display:block; bottom: 0px; right: 5px;}

#main a.ca { color:#000; text-decoration:none; font-weight:bold}
.home.schedule, .home.about, .home.gallery, .gallery {min-height:500px;}
p {margin-top:0;}
#homePage #extra1 img {pointer-events:none;}
.red {color:#b22222;}
.showpic { max-width:360px; float:left; margin:0 3.5% 3% 0;}
.left, .right {
	border: 2px solid white;
	background-color: #0e70cd;
	border-radius: 14px;
}
.right {
	cursor: pointer;
	position: relative;
	display: inline-block;
	width: 24px;
	height: 24px;
	background:#a73a8a url(/images/rightarrow.png) 2px center no-repeat;
}
.left {
	cursor: pointer;
	position: relative;
	display: inline-block;
	width: 24px;
	height: 24px;
	background:#a73a8a url(/images/leftarrow.png) 6px center no-repeat;
}
.left:hover, .right:hover {
	background-color: lightblue;
}

#headUL .thumbli { visibility:hidden; opacity:0;}
#homePage #cartIcon, #bioPage #cartIcon, #eventsPage #cartIcon, #galleryPage #cartIcon { display:none; position:relative; float:right; margin:-22px 0 0 0 }
.cart-margin, .cart-margin a { color:#000; font-size:.9em }
.cart-margin a:hover { color:#9cc6ca;}

body {margin:0; padding:0; text-align:left; background:#83cbdd; font-size:18px; 
font-family: brandon-grotesque,sans-serif; font-weight: 300; font-style: normal; }

#content { position:relative; background:white; }
#header { position:relative;  background:#83cbdd; }
#siteTitle {text-align:center; margin:0 auto; width:100%; max-width:300px }
#container  { position:relative; }
#main { position:relative; top:0px; font-family: brandon-grotesque,sans-serif; font-weight: 300; font-style: normal; font-size:1.2em; line-height:1.4em; }
#main #itemDesc b { font-weight: 600;}

.info {position: relative;z-index: 2;}
#main a.info, #main p a, #main a, #gallRet a {color:#477eb7;  border-bottom:none;}
#footer, .footer a {color:#fff;  border-bottom:none;}
.footer a:hover {color:#000; }

#main p a, #main .home a, #main a.info , .footer a , #gallRet a { text-decoration:none; display: inline; position: relative; overflow: hidden; }
#main p a:after,  #main .home a:after, #main a.info:after, #gallRet a:after { content: ""; position: absolute; z-index: 1; left: 0; width: 0; bottom: 5px; height: 2px; transition-property: width; transition-duration: 0.4s; transition-timing-function: ease-out; background: #477eb7; }

.footer a:after { content: ""; position: absolute; z-index: -1; left: 0; width: 0; bottom: 3px; height: 1px; transition-property: width; transition-duration: 0.4s; transition-timing-function: ease-out; background: #fff; }
.footer  a:after img.nb  { background:red;}
.footer #map a:after {bottom: 0px;}
#main p a:before,  #main .home a:before,#main a.info:before, .footer a:before, #gallRet a:before { content: ""; position: absolute; z-index: -1; left: 0; width: 100%; bottom: 5px;   height: 2px; transition-property: width; transition-duration: 0.4s; transition-timing-function: ease-out; }
#gallRet a:before {height:1px;}
#gallRet a:before, #gallRet a:after { bottom: 3px;}

 #main p a:before, #main a:before, #main a.info:before, #gallRet a:before {background: url(../assets/linedotbl.png) center center}

#gallRet a:hover:after,#gallRet a:focus:after, #gallRet a:active:after, 
#main p a:hover:after, #main a:hover:after, #main p a:focus:after, #main p a:active:after, 
#main a.info:hover:after, #main a.info:focus:after,
.footer a:hover:after, .footer a:focus:after, .footer a:active:after {left: 0; right: auto; width: 100%; }

/* --- no link effect on these ---*/
#main .showpic a:before, #browsebuttons a:before, #cartbuttons a:before,  #main h2 a:before { background-image:none; }
#main .showpic a:after, #browsebuttons a:after, #cartbuttons a:after , #main h2 a:after  { background:transparent; }

#homePage #extra1 { position:relative; }
#extra2, #extra2b,#extra3 { margin:2% auto;}
#homePage .home,  #homePage .homez, .the_artist, #show_schedule .schedule, #about .about, #galleryPage .home  { max-width:1200px; margin:0 auto; width:85%;}
#gallery .gallery, .gallery { max-width:1200px; margin:0 auto; width:85%;}
#main .home.top {width: 50%; padding: 0 20px; border: 5px double #b3dfea; border-width: 0 5px;}

#main {margin:0 auto; background:#ffffff; }
#extra2 {background:#e0f2f6; padding:2% 0 1% 0;}
 
#homePage #subNav { text-align:center;  font-size:1.2em; max-width:1200px; margin:0 auto; color:#678; font-family: alkaline, sans-serif; font-weight: 400; font-style: normal}
#homePage #main a:hover { color:#000 }

h2 {text-transform:uppercase; font-size:1em; color:#678; text-align:center; font-family: dazzle-unicase,sans-serif; font-weight: 500; font-style: normal;  position:relative; margin: 2% auto 0 auto}
h2 {font-size:1.3em;  color:#477eb7; /*font-family: p22-stickley-pro-text; */ font-weight: 400; font-style: normal; }

h3 {text-transform:uppercase; border-bottom:1px solid #888; font-size:1em;  color:#678; font-family: dazzle-unicase,sans-serif; font-weight: 500; font-style: normal;  position:relative; margin: 2% auto 0 auto}
h3 {font-size:1.2em;  color:#000; font-weight: 400; font-style: normal; /*line-height: .7em;*/}
#extra3 h3 {font-size:1.1em; }
#main h1 {text-transform:uppercase;  font-size:1.6em;  font-family: dazzle-unicase,sans-serif; font-weight: 500; font-style: normal; color:#678; margin: 4% 0 .6% 0; }

#main a:hover; a:hover {color:#000 ;}
.nav a {text-decoration:none; border-width:0 }

#wrap { z-index:9; position:relative; top:0px; left:0px;  padding: 0; margin: 0 auto}
#content { position:relative; top:0px; left:0px; padding:0; } 
#container { position:relative; top:0px; padding:0; margin:0 auto 0 auto} 

#header {z-index:99; position:relative; top:0px;  height:auto }
#wrap { display: flex;  flex-flow: column; }
#extra1 {margin:0 auto; text-align:center}

#extra2,#extra3  { position:relative; margin:2% auto }
#template1 #extra2 {position:relative;margin:0 auto;}
#extra2 h1 { width:95%; margin:0 auto;font-size:2.2em;  text-align:center; color:#8ba392; font-weight:normal}

#show_schedule .schedule h1 {font-size:1.8em;}
.eventName {  font-weight: 500;font-family: dazzle-unicase, georgia; color:#a73a8a; margin:2% auto 0 auto ; font-size:1.8em;}
.eventDate { color:#0e70cd; position:relative;font-family: Century Gothic, dazzle-unicase,sans-serif; text-transform:uppercase; font-weight: 700; font-size:1.3em;}
.show { margin: 1% 0 0 3% ; display: flex; flex-direction: column; }
.schedule h2 {color:#000;}

#extra2 h1 span, h1 span  {color:#7db0b5;  font-weight:normal}
#itemtop h2 span { font-family:verdana; font-weight:normal ; }
#extra2 h1 span>span {font-family:verdana; font-weight:normal ; }
#footer  { position:relative;  margin:0px auto;  text-align:center}
.footer p { font-size:1em; }

.outline { background: #ffffff; padding: 5px; border: 1px solid #064387; }

.leftPic { width:40%;
	position: relative;
	float: left;
	margin: 0 20px 10px 0;
	background: #fff; padding: 5px; border: 1px solid #888;
}

.outlines { background:white; padding:4px; border:1px solid #b2b2b2; max-width: 900px;} 
#thumbsUL a, #browsebuttons a {border:0px; text-decoration:none}
#thumbsUL ,#headUL{ margin:0; padding:0;  list-style: none}
#thumbsUL {position:relative; top:0px; justify-content:center; display: flex; flex-wrap: wrap;}
#headUL {position:relative; top:0px; justify-content: space-evenly ; display: flex; flex-wrap: wrap;}
#thumbsUL>li {margin: 1.5%}
#thumbsUL>li {width:16%;  }
#thumbsUL li p { text-align:center; margin: 5px 0 0 0px;  padding: 0px; text-transform:uppercase;  font-size:.6em; line-height:1em}
p span.italic {text-transform:lowercase; font-style:italic; font-family:georgia}
#thumbsUL li p { font-family: transat, sans-serif; font-weight: 300; font-style: normal;  }

#thumbsUL>li.thumbli:hover img {background:#e0f2f6; border-color:#000 }

#thumbsUL>li.thumbli span {color:#b22222; font-weight:bold; font-size:.8em }
#thumbsUL>li.thumbli:hover span {color:#8ba392 }
.thumb {width:100%; max-width:350px}

img.lazy { display: block; opacity: 0; }
img:not(.initial) { transition: opacity 1s; }
img.initial, img.loaded, img.error { opacity: 1; }
img:not([src]) { visibility: hidden; }

/*------events page stuff----------*/
#main .events h1 { font-size:3em; font-weight:normal; color:#b7a9b2; border-bottom:1px solid; line-height:.9em; margin-bottom:5%}
.events a {font-weight:bold ; }
.show { color:#000 }
.show span {color:#b22222; font-weight:bold;}
#headUL > li { margin:0 1.5%  0 1.5% ; }
#headUL>li { width:21%;  }
.eventListing {position:relative; 	display: flex; align-items: stretch; min-height:220px; margin: 0 0 1.5% 0;} 
.eventListing > div {
	margin: 10px;
}
.leftDiv {
	z-index: 1;
	position: relative;
	width: 25%;
	max-width: 300px;
}
.rightDiv {
	position: relative;
	width: 70%;
	margin-left: 2.5%;
}

@media (max-width: 600px) { 
.showpic {float:none;max-width:none; max-width:360px;}
.eventListing {display: block; margin: 5% 0}
.eventListing > div {margin: 0;}
.leftDiv,.rightDiv {display:block; width:100%;}
}

/*-----SLICK NAV-----*/
.slicknav_menu {display:none;position:fixed;right:5px; z-index:999; width:400px}
.slicknav_nav li a {background:white;}
a li.slicknav_open a {}

.slicknav_nav li.d {display:none; }
#homePage #extra1 {margin: 2% auto;}
#subNav { display:none; width:94%; margin: 0 auto 0 auto;}
#size {display:none;
/*	width:200px;z-index:999999; position:absolute; left:10px; color:red; font-size:12px;
*/
}

#curtain { z-index:98; position:relative; height:100%; background:#83cbdd;}
.fad, .footer { padding:3% 5% 2% 5%; width:80%; max-width:1200px; margin:0 auto;}
.fad { display: flex;  justify-content: space-between; } 
#template1 .fad {display: flex;  justify-content: space-between; flex-flow:wrap;}
.fad { overflow: hidden; } 
#template1 #extra2   { background: url(../assets/whiteshade20.png); }
#template1 #extra2 .fad  { background: url(../assets/whiteshade80.png); color:#000; }
#extra2 .fad { max-width:1200px; width:85%; }
.txt2 { flex: 1 0;  margin: 0 2.5%;}
#template1 .txt2 {order:3; margin:2% auto; font-size:1.2em}
#template1 .txt2.lnk { display: flex; flex-flow: row wrap; justify-content: space-between; margin:2% auto; }
.home h1 { position:relative; padding:2% 0 1.5% 0;}
#template1 .home h1 { position:relative; padding:2% 0 2% 0;}