@charset "UTF-8";
/* CSS Document */
/* Tablets  (standard size - portrait or landscape) ----------- */

html {height:100%;-ms-text-size-adjust:none;-webkit-text-size-adjust:none;}
body {
	font: 12px/16px Arial, Helvetica, sans-serif;
	height:auto;
	width:100%;
	max-width:1024px;
	min-width:768px;
	color:#222222;
	background:#F5DEB4 url(../../images/desert_bgloop-1024.jpg) repeat-y center top;
}

body.rainforest {
	background:#507D3C url(../../images/rainforest_bgloop-1024.jpg) repeat-y center top;
	color:#FFFFFF;
}
body.seaparting {
	background:#ABC1D9 url(../../images/seaparting_bgloop-1024.jpg) repeat-y center top;
}
body.darknight {
	background:#2A2D62 url(../../images/darknight_bgloop-1024.jpg) repeat-y center top;
	color:#FFFFFF;
}
.site-bgwrapper {
	background:none !important;
}
#site-container{
	width:100%;
	max-width:1024px;
	min-width:768px;
	margin-left:auto;
	margin-right:auto;
	background:url(../../images/desert_epic_header-1024.jpg) no-repeat center -20px;
}
body.eden #site-container{
	background:url(../../images/eden_epic_header-1024.jpg) no-repeat center -20px;
}body.rainforest #site-container{
	background:url(../../images/rainforest_epic_header-1024.jpg) no-repeat center -20px;
}
body.seaparting #site-container{
	background:url(../../images/seaparting_epic_header-1024.jpg) no-repeat center -20px;
}
body.darknight #site-container{
	background:url(../../images/darknight_epic_header-1024.jpg) no-repeat center -20px;
}
/* --- Custom BGs for certain pages --- */
.home-container {
	background:url(../../images/home_epic_header-1024.jpg) no-repeat center -20px !important;
}
.about-container {
	background:url(../../images/about_epic_header-1024.jpg) no-repeat center -20px !important;
}

.contact-container {
	background:url(../../images/contact_epic_header-1024.jpg) no-repeat center -20px !important;
}

/* --------- STYLES For SITE HEADER --------- */

header {
	width:100%;
	max-width:1024px;
	min-width:768px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	padding-top:0;
}
header h1 {
	width:100%;
	max-width:1024px;
	min-width:768px;
	height:150px;
	margin:0;
}
header>h1>a {
	display:block;
	width:100%;
	max-width:1024px;
	min-width:768px;
	height:100%;
}
header>h1>a>img {
	display:none !important;
}
header nav {
	margin:0 auto;
	padding:0;
	height:auto;
	width:100%;
	max-width:900px;
	background: none;
}
.darknight header nav,.rainforest header nav,.eden header nav,.seaparting header nav {
	background: none;
}
nav ul {
	list-style:none;
	padding: 5% 0 3% 0;
	margin:0 auto;
	width:100%;
	text-align: center;
}
nav li {
	float:none;
	display: inline-block;
	position: relative;
	margin-right: 0;
	padding: 0 1%;
	width:auto;
}
nav li:last-child, ie nav a.store {
	margin-right:0;
}
nav a {
	height:28px;
	width:100%;
	max-width:110px;
	display:block;
	padding: 0;
	background-position: center top !important;
}
nav a.home {
	width:75px;
}
nav a.about {
	width:83px;
}
nav a.parents {
	width:98px;
}
nav a.features {
	width:108px;
}
nav a.art {
	width:50px;
}
nav a.store {
	width:73px;
}
nav a.signin {
	width:94px;
}
nav li .rollover {
	display:none;
	background:none;
}

/* --------- STYLES For Main content area --------- */

.mainArea {
	width:100%;
	max-width:940px;
	margin-right:auto;
	margin-left:auto;
	font-size: 1.3em;
	line-height: 1.5em;
}
.mainArea h2 {
	font-family: 'IM Fell French Canon SC', serif;
	color:#663300;
	font-size: 1.2em;
	font-weight: normal;
}
.darknight .mainArea h2, .rainforest .mainArea h2 {
	color:#e5d090;
}

/* --------- STYLES For Home left content area --------- */

.home {
	background:none;
}
.home h1 {
	width:90%;
	max-width:498px;
	height: 42%;
	max-height:148px;
	margin: 0 0 0 10%;
	background-image: url(../../images/home_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left -15px;
	background-size:contain;
}
.videoPane {
	float:left;
	position:relative;
	width:60%;
	max-width:630px;
	height:354px;
	padding:0;
}
.playButton {
	padding:0;
	margin: 0 25% 0 45%;
	position:relative;
	width:30%;
	height:auto;
	max-width:162px;
	max-height:190px;
}
.playButton .rollover {
	display:none;
}
.playButton img {
	width:100%;
	height:auto;
	max-width:162px;
	max-height:190px;
}
.vimeoContainer {
	width:100%;
	height:100%;
	max-width:630px;
	max-height:354px;
	background-color:#000000;
}
.vimeoContainer>iframe{
	width:100%;
	height:100%;
	max-width:630px;
	max-height:354px;
}

/* STYLES For right col on home page */
.home .rightCol {
	padding: 0 2% 15px 2%;
	width: 36%;
	margin-left: 60%;
}
.home .rightCol .mobileCentered {
	text-align:center;
}


/* --------- STYLES For CONTACT left content area --------- */

.contact {
	background-image:none;
	min-height:607px;
}
.contact .leftCol {
	float:left;
	position:relative;
	width:27%;
	height:89px;
	padding:0 2% 0 0;
}
.contact h1 {
	width:80%;
	height:89px;
	margin:0;
	padding:0 0 0 20%;
	background-position:top right;
	background-image: url(../../images/contact_epic-main-h1.png);
	background-repeat: no-repeat;
	background-size:contain;
}
/* STYLES For right col on CONTACT page */
.contact .rightCol {
	padding: 0 1% 15px 3%;
	width: auto;
	height: auto;
	margin-left: 27%;
	min-height: 300px;
}


/* --------- STYLES for FOR PARENTS PAGE --------- */
.forparents .parentsLogo {
	width:68.7%;
	max-width:200px;
	height:89px;
	margin: 0 0 0 13%;
	background-image: url(../../images/parents_epic-main-h1.png);
	background-repeat: no-repeat;
	background-size: 100%;
}

/* --- left content area --- */
.forparents .leftCol {
	float:left;
	position:relative;
	width:31%;
	height:auto;
	padding:0;
}

.forparents .leftCol a {
	padding-top: 10px;
	margin-left:13%;
	display:block;
}
.forparents .leftCol a img{
	width:75%;
	height:auto;
	display:block;
}
/* STYLES For right col on FOR PARENTS page */
.forparents .rightCol {
	padding: 0 0 15px 2%;
	width: 67%;
	height: auto;
	margin-left: 31%;
}

.forparents .threeLeftCol,
.forparents .threeMidCol {
  float: left;
  position: relative;
  width: 35%;
  margin-right: 1%;
}

.forparents .threeRightCol {
  float: right;
  position: relative;
  width: 27%;
}
.forparents .threeRightCol img {
  width: 80%;
}
/* --------- STYLES for ABOUT PAGE --------- */


.aboutpage {
	background:none !important;
}
/* --- left content area --- */
.aboutpage .leftCol {
	float:none;
	position:relative;
	margin: 0 3%;
}
.aboutpage h1 {
	width:495px;
	height:84px;
	margin:0;
	background-image: url(../../images/about_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left 50px;
}
.aboutpage h1:first-child {
	padding-top: 50px;
}

/* STYLES For right col on ABOUT page */
.aboutpage .rightCol {
	float:right;
	padding:0;
	width: 60%;
	height:650px;
	margin:0;
}

/* --------- STYLES for FEATURES PAGE --------- */


.featurespage {
	background:none;
}
/* --- left content area --- */
.featurespage .leftCol {
	float:none;
	position:relative;
	padding:0 40px;
}
.featurespage h1 {
	width:106px;
	height:62px;
	margin:0;
	background-image: url(../../images/features_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}
.featurespage .leftCol iframe {
	width:100% !important;
	max-width:630px;
	max-height:354px;
}

/* --------- STYLES for FREE SAMPLES PAGE --------- */


.freesamplespage {
	background:none;
}
/* --- left content area --- */
.freesamplespage .leftCol {
	float:none;
	position:relative;
	padding:0;
}
.freesamplespage h1 {
	width:161px;
	height:71px;
	margin:0 0 0 5%;
	background-image: url(../../images/freesamples_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}
.freesamplespage .gallery {
	list-style:none;
	margin:0 auto;
	padding:0;
	width:100%;
	max-width:890px;
	text-align: center;
}
.freesamplespage .gallery li {
	float:none;
	display:inline-block;
	margin:10px;
	text-align:center;
	width:200px;
	height:270px;
}
.freesamplespage .gallery li .title {
	font-size: 0.9em;
}
.freesamplespage .gallery .downloadLink {
	padding-top:10px;
}
.freesamplespage .gallery .clickMeButton {
	padding: 5px 10px;
	margin:0;
	font-size:1em;
}
.freesamplespage colorbox {
	width:100%;
	height:85%;
	max-width:1024px;
	max-height:870px;
}
.freesamplespage videoContainer {
	width:100%;
	max-width:none;
	max-height:none;
}
.freesamplespage videoContainer iframe {
	width:100%;
	max-width:none;
	max-height:none;
}

/* --------- STYLES for ART PAGE --------- */


.artpage {
	background:none;
}
/* --- left content area --- */
.artpage .leftCol {
	float:none;
	position:relative;
	padding:0;
}
.artpage .artLogo {
	width:47px;
	height:54px;
	margin:0 0 0 3%;
	background-image: url(../../images/art_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}
.artpage h3 {
	position:absolute;
	z-index:900;
	display:block;
	width: 100%;
	height: 50px;
	margin: 0 auto;
	top: 0;
	left: 0;
	text-align: center;
	font-size:.9em;
	font-weight:normal;
	line-height:50px;
}
.artpage h3 .clickMeButton {
	display: inline-block;
	width: 103px !important;
	height: 21px;
	line-height: 21px;
	text-align: center;
}
.artpage iframe {
	width: 100% !important;
	max-width: 630px;
	max-height: 354px;
}

.artpage .gallery {
	list-style:none;
	margin:0 auto;
	padding:0;
}
.artpage .gallery li {
	float:left;
	display:block;
	text-align:center;
  width: 21%;
  margin: 2% 4% 2% 0;
  -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-color: #333333;
	border: 6px solid #ffffff;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 0 5px 20px #3a2e2e;
	-webkit-box-shadow: 0 5px 20px #3a2e2e;
	box-shadow: 0 5px 20px #3a2e2e;
}
.artpage h3 .clickMeButton {
	width:125px !important;
	display: inline-block;
	height: 17px;
	line-height: 17px;
}
.artpage videoContainer {
	width:100%;
	max-width:854px;
	max-height:480px;
}
.artpage videoContainer iframe {
	width:100%;;
	max-width:854px;
	max-height:480px;
}

.artpage .galleryContainer {
  width: 48%;
  margin-right: 2%;
  float: left;
  -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  background: url('../../images/sectionDivider.png') no-repeat right center;
}

.galleryContainer.last {
  background-image: none;
}

.artpage .thumbnail img {
  width: 100%;
}

/* --------- STYLES for EMAIL SIGNUP PAGE --------- */


.emailsignuppage {
	background: none;
	min-height:430px;
	width:100%;
	max-width:660px;
	margin:0 auto;
}
/* --- left content area --- */
.emailsignuppage .leftCol {
	float:left;
	position:relative;
	width:330px;
	padding:0;
}
.emailsignuppage h1 {
	width:182px;
	height:74px;
	margin:0;
	background-image: url(../../images/emailsignup_epic-main-h1.png);
	background-repeat: no-repeat;
}
/* STYLES For right col on EMAIL SIGNUP page */
.emailsignuppage .rightCol {
	padding:0;
	width: 330px;
	margin-left: 330px;
}


/* --------- STYLES for FREE MONTH PAGE --------- */


.freemonthpage {
	background: none;
	min-height:430px;
	width:660px;
	margin:0 auto;
}
/* --- left content area --- */
.freemonthpage .leftCol {
	position:relative;
	padding:0;
}
.freemonthpage h2 {
	text-align:center;
	font-size: 1.7em;
	line-height: normal;
}
	
/* STYLES For right col on EMAIL SIGNUP page */
.freemonthpage .rightCol {
	padding:0;
	width: 330px;
	margin-left: 330px;
}


/* --------- STYLES for FAQs PAGE --------- */


.faqspage {
	background:none;
}
/* --- left content area --- */
.faqspage .leftCol {
	float:none;
	position:relative;
	padding:0 4%;
}
.faqspage h1 {
	width:58px;
	height:55px;
	margin:25px 0 0 0;
	background-image: url(../../images/faqs_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}


/* --------- STYLES for TERMS OF USE PAGE --------- */


.termspage {
	background:none;
}
/* --- left content area --- */
.termspage .leftCol {
	float:none;
	position:relative;
	padding:0 40px;
}
.termspage h1 {
	width:154px;
	height:68px;
	margin:0;
	background-image: url(../../images/termsofuse_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}

/* --------- STYLES for MEET THE ARTIST PAGE --------- */


.meetartistpage {
	background:none;
}
/* --- left content area --- */
.meetartistpage .leftCol {
	float:none;
	position:relative;
	padding:0 40px;
}
.meetartistpage h1 {
	width:181px;
	height:73px;
	margin:0;
	background-image: url(../../images/meettheartist_epic-main-h1.png);
	background-repeat: no-repeat;
	background-position: left top;
}


/* --------- STYLES For Lower Panes area --------- */

.scrollPanel {
	width:100%;
	height:183px;
	text-align:center;
}
.scrollPanel ul {
	margin:0 auto;
	padding:0;
	width:100%;
	max-width:695px;
	list-style:none;
}
.scrollPanel ul li {
	float:none;
	display:inline-block;
	width:32%;
	height:183px;
	padding:0;
	margin:0;
	position:relative;
}
.scrollPanel ul li a {
	width:100%;
	height:100%;
	display:block;
	padding:0;
	margin:0;
}
.scrollPanel a.scrollEmailSignup {
	background-image: url(../../images/epic-scrollBttn-emailSignup.png);
	background-repeat: no-repeat;
	background-size: contain;
}
.scrollPanel a.scrollFreeSample {
	background-image: url(../../images/epic-scrollBttn-freeSamples.png);
	background-repeat: no-repeat;
	background-size: contain;
}
.scrollPanel a.scrollFreeMonth {
	background-image: url(../../images/epic-scrollBttn-freeMonth.png);
	background-repeat: no-repeat;
	background-size: contain;
}
.scrollPanel ul li .rollover {
	display:none;
	background:none;
}
/* --------- STYLES For FOOTER area --------- */

footer {
	clear:both;
	width:100%;
	max-width:940px;
	font-family: 'IM Fell French Canon SC', serif;
	font-size:1.3em;
	color:#333333;
	margin-right:auto;
	margin-left:auto;
	padding:10px 0 30px 0;
	text-align:center;
}
.rainforest footer, .darknight footer {
	color:#FFFFFF;
}
footer a:link, footer a:visited {
	color:#333333;
	text-decoration:underline;
}
.rainforest footer a:link, .rainforest footer a:visited,
.darknight footer a:link, .darknight footer a:visited {
	color:#FFFFFF;
}
footer a:hover, footer a:hover {
	text-decoration:none;
	color:#de6f04;
}
footer .shareLinks a {
	text-decoration:none;
}
footer .shareLinks a img {
	padding:20px 10px;
}

/* --------- STYLES For WEB FORM --------- */

.webForm {
	color:#FFFFFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;
}
.webForm ul {
	list-style:none;
	margin:0;
	padding:0;
}
.webForm ul li {
	margin: 0 0 10px 0;
}
.webForm .requiredFieldContainer {
	position:relative;
}
.webForm label {
	display:block;
	font-size:1.1em;
	font-weight:normal;
	color:#FFFFFF;
	line-height: 1.5em;
}
.webForm input[type=text], .webForm input[type=email] {
	width: 300px;
	/*height: 35px;*/
	padding: 5px 10px;
	margin: 0;
	font-size: 1.1em;
	color: #333333;
	vertical-align:middle;
	border:none;
	-moz-appearance:none;
	-webkit-appearance:none;
	background: #FFFFFF;
	appearance:none;
	-webkit-box-shadow: inset 0 1px 4px   rgba(0,0,0,.2);
	-moz-box-shadow: inset 0 1px 4px      rgba(0,0,0,.2);
    box-shadow: inset 0 1px 4px           rgba(0,0,0,.2);
}
.webForm input[type=submit] {
	-moz-appearance:none;
	-webkit-appearance:none;
}
.webForm input::-webkit-input-placeholder  {
    color: #cca48f;
    line-height:40px;
}
.webForm input:-moz-placeholder {
    color: #cca48f;
}
.webForm input:focus {
    background: #FFF;
	outline: none;
}
.webForm .redText {
	display:inline !important;
	color:#FF0000;
}
.webForm .emailconfirmation {
	display:none;
}
.webForm .note {
	font-size:.9em;
}
.webForm .formError {
	font-size:.9em;
	border: solid 1px #FF0000;
	background-color:#FFCCCC;
	vertical-align:middle;
	-moz-appearance:none;
	-webkit-appearance:none;
	appearance:none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
    -webkit-box-shadow: inset 0 1px 4px   rgba(0,0,0,.2);
	-moz-box-shadow: inset 0 1px 4px      rgba(0,0,0,.2);
    box-shadow: inset 0 1px 4px           rgba(0,0,0,.2);
}
.webForm .formError div {
	padding:10px;
}
.webForm input.error {
	background-color:#FFCCCC;
	-moz-box-shadow: 0 0 5px red;
	-webkit-box-shadow: 0 0 5px red;
	box-shadow: 0 0 5px red;
}
.webForm .requiredFieldContainer span {
	display:none;
}
.webForm .requiredFieldContainer span.error {
	display:block;
	position: absolute;
	top: 25px;
	left: 325px;
	z-index: 998;
	width:220px;
	height:30px;
	text-align:center;
	padding:0;
	color:#FFF;
	font-size:.9em;
	line-height:30px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	border:none;
	background-color: #464646; /* Old browsers */
	background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* W3C */
	-webkit-box-shadow: 0 5px 10px #000000;
	-moz-box-shadow: 0 5px 10px #000000;
	box-shadow: 0 5px 10px #000000;
}
.freemonthpage .webForm .requiredFieldContainer span.error {
    display:block;
    position: static;
    top:inherit;
    left:inherit;
    z-index:auto;
    width:auto;
    height:inherit;
    text-align:center;
}
.webForm .requiredFieldContainer span.error .left-arrow {
	position:absolute;
	top:2px;
	left:-16px;
	width:16px;
	height:26px;
}
.freemonthpage .webForm .requiredFieldContainer span.error .left-arrow {
	display:none;
}
.webForm #FormBody {
	margin:10px;
}
.response_area h3 {
	padding-top:0;
	padding-bottom:0;
	margin-left:auto;
	margin-right:auto;
	font-family: 'IM Fell French Canon SC', serif;
	color:#E5D090;
	font-size: 2em;
	font-weight: normal;
	text-align:left;
}
.response_area p {
	text-align:left;
	font-size:1em;
}