/*

      Design
        is so simple,
      that is why
        it is so
      complicated.
        -Paul Rand


Theme Name:		 ATLAS Child
Description:	 Child theme of Quadsimia ATLAS CSS
Author:			   Rob Perry, Creative Director / Senior Web Developer, Quadsimia
Author URI:		 https://www.quadsimia.com/
Version:		   1.0.0
-------------------------------------------------------------- */

/* TABLE OF CONTENTS
 1: CLIENT BRANDING
    1a: Fonts
    1b: Colors
 2: GENERAL STYLES
    2a: Structural
    2b: Typography
    2c: Links/CTAs
    2d: Lists
    2e: Tables
    2f: Grids/Columns
    2g: Flex
    2h: Images
    2i: Videos
    2j: Forms
    2k: Formatting
 3: HEADER
    3a: Header
    3b: Header - Sticky
    3c: Alert Bar
    3d: Top Nav Bar
    3e: Logo
 4: NAV
    4a: Nav Menu
    4b: Nav Menu - Position
    4c: Nav Menu - Full Background
 5: BODY/CONTENT
    5a: Breadcrumbs
    5b: Homepage
    5c: Interior
 6: SIDEBAR
    6a: Aside
 7: FOOTER
    7a: Footer Content
    7b: Copyright
 8: ANIMATION/FX
 9: RESPONSIVE
-------------------------------------------------------------- */

/* 1: CLIENT BRANDING */
/* -- 1a: Fonts ---------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
/* -- 1b: Colors --------------------------------------------- */
body{
  color:#fff;
  /*background:#000;*/
  background-image: url("/assets/images/black-grunge-bg.jpg");
  background-repeat:repeat;
  background-size: contain;}
/*------------------------------------------------------------ */
/* 2: GENERAL STYLES */
/* -- 2a: Structural ----------------------------------------- */
/* -- 2b: Typography ----------------------------------------- */
h1{
  font-family:'Montserrat', sans-serif;
  font-size:2.5em;}
h1 span.large{
  font-size:2.5em;}
h2, h3, h4, h5, h6{
  font-family: 'Montserrat', sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;}
h2{
  font-size:4em;
  font-weight:bold;}
h3{
  font-size:2.75em;
  font-weight:bold;}
p{font-family:'Montserrat', sans-serif;}
/* -- 2c: Links/CTAs ----------------------------------------- */
a{color:#000;text-decoration:none;}
a:hover{color:#936a93;}
.cta{/*background-color:#d2232a;color:#fff;*/background:#fff;color:#000;}
.cta:hover{/*background-color:#ff5057;color:#fff;*/background:#FFCC40;color:#000;}
.cta.outline{background-color:transparent;border:3px solid #fff;color:#fff;}
.cta.outline:hover{border:3px solid #fff;color:#000;background-color:#FFCC40;}
/* Secondary color */
.cta.secondary{/*background-color:#4e0301;color:#fff;*/background:#000;color:#fff;}
.cta.secondary:hover{background-color:#FFCC40;color:#000;}
.cta.outline.secondary{background-color:transparent;border:3px solid #6CC24A;color:#6CC24A;}
.cta.outline.secondary:hover{border:3px solid #009739;color:#009739;}
/* Contact color */
.cta.contact{background-color:#684c9d;color:#fff;}
.cta.contact:hover{background-color:#45376a;color:#fff;}
.cta.outline.contact{background-color:transparent;border:3px solid #684c9d;color:#684c9d;}
.cta.outline.contact:hover{border:3px solid #684c9d;color:#fff;background:#684c9d;}
/* -- 2d: Lists ---------------------------------------------- */
/* -- 2e: Tables --------------------------------------------- */
/* -- 2f: Grids/Columns -------------------------------------- */
/* -- 2g: Flex ----------------------------------------------- */
/* -- 2h: Images --------------------------------------------- */
/* -- 2i: Videos --------------------------------------------- */
/* -- 2j: Forms ---------------------------------------------- */
/* -- 2k: Formatting ----------------------------------------- */
/*------------------------------------------------------------ */
/* 3: HEADER */
/* -- 3a: Header --------------------------------------------- */
/* -- 3b: Header - Sticky ------------------------------------ */
/* -- 3c: Alert Bar ------------------------------------------ */
/* -- 3d: Top Nav Bar ---------------------------------------- */
/* -- 3e: Logo ----------------------------------------------- */
/*------------------------------------------------------------ */
/* 4: NAV */
/* -- 4a: Nav Menu ------------------------------------------- */
/* -- 4b: Nav Menu - Position -------------------------------- */
/* -- 4c: Nav Menu - Full Background ------------------------- */
/* -- 4d: Mobile Nav Menu ------------------------------------ */
/* -- 4e: Mobile MeanMenu ------------------------------------ */
a.meanmenu-reveal{top:7px !important;color:#fff !important;}
a.meanmenu-reveal span{color:#fff !important;background:#fff !important;}
.mean-bar{background:transparent !important;}
.mean-nav{background:#000 !important;}
.mean-nav ul li a{color:#fff !important;}
.mean-container a.meanmenu-reveal,
.mean-bar{
  font-family: 'Montserrat', sans-serif !important;
  font-optical-sizing: auto !important;
  font-weight: 800 !important;
  font-style: normal !important;}
/*------------------------------------------------------------ */
/* 5: BODY/CONTENT */
/* -- 5a: Breadcrumbs ---------------------------------------- */
/* -- 5b: Homepage ------------------------------------------- */
header .main-header{
  height: auto;}
@media screen and (min-width: 980px){
  header .main-header{
    /*padding-top:7%;*/
    padding-top:3em;
    padding-bottom:18em;
    /*height: 100vh;*/}
}
header{
  padding-top:2em;
  background: transparent;
  z-index: auto;}
header .container{
  z-index:10;}
header .logo{
  max-width:1000px;}
header h4.tagline{
  background: #fff;
  margin: auto 0.25em;
  padding: 0.15em;
  font-weight: 800;
  color: #000;
  text-transform: uppercase;}
section{z-index:0;}
@media screen and (max-width: 680px){
  header .logo{
    max-width:450px;position:relative;margin:0 auto;}
}
img.divider-top,
img.divider-bottom{
  display:block;}
/* intro */
.tag{
  position:absolute;
  top:-4.5em;
  right:0;
  margin:0;
  padding:0.15em 1em;
  text-align:right;
  background:#fff;
  color:#000;}
.tag h6{
  font-size:1.15em;}
@media screen and (max-width: 680px){
  .tag{
    padding:0.1em 0.75em;}
  .tag h6{
    font-size:0.95em;}
  .awards .span2{
    width:48%;}
}
.new-illusion-stamp {
  width: 250px;
  position:absolute;
  top:3em;
  margin-left: 0.5em;
  padding:0.25em 1em;
  z-index:1001;
  transform: rotate(342deg); /* Equal to rotateZ(342deg) */}
header h1{
  padding-top:1.5em;}
header h1 .flag-icon{
  max-width: 50px;
  margin: 0 0.25em;
  vertical-align: middle;}
@media screen and (max-width: 680px){
  header h1{
    font-size:1.25em;
    line-height:1.5em;}
  header h1 .flag-icon{
    max-width: 35px;}
}
.promo-banner.parallax-banner{
  position: absolute;
  height: 35%;}
/* details */
section.details .span5{
  position: relative;}
section.details .overlay{
  position: absolute;
  width:100%;
  height:50%;
  bottom:0;
  background: rgb(0,0,0);
background: -moz-linear-gradient(0deg, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(0deg, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
background: linear-gradient(0deg, rgba(0,0,0,1) 25%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
  z-index:2;}
section.details img.leon-photo{
  margin-top:-3.25em;
  z-index:1;}
section.details .info{
  position: relative;
  z-index:3;}
section.details h2{
  position:relative;}
section.details .live-stamp{
  position:absolute;
  top:0.25em;
  right:0.45em;
  max-width:150px;}
section.details .asotv{
  max-width:650px;}
section.details h2.starring-ile{
  font-size: 1.5em;
  font-weight: 600;
  line-height: 2.25em;
  letter-spacing: 2px;}
section.details .ile-logo{
  max-width:550px;}
section.details .nacc-logo{
  position: absolute;
  left: 2em;
  bottom: 5em;
  width: 250px;
  z-index: 10;}
@media screen and (max-width: 680px){
  section.details .nacc-logo{
    position:relative;
    left: auto;
    bottom: auto;
    width: auto;
    text-align: center;
    z-index: 10;}
  section.details .nacc-logo img{
    max-width:200px;}
}
/* light bg */
section.light-bg{
  color:#000;
  background: #fff;}
/* video and description */
section.video{
  padding:2em 1em;
  /*background:#333;*/}
video{
  width:100%;
  max-width:1100px;
  z-index:1;
  border:1px solid #fff;
  -webkit-box-shadow:0px 0px 50px 10px rgb(0 0 0 / 70%);
  -moz-box-shadow:0px 0px 50px 10px rgba(0,0,0,0.7);
  box-shadow:0px 0px 50px 10px rgb(0 0 0 / 70%);}
.description{
  margin-bottom:1em;}
.description p{
  font-size:1.35em;
  line-height:1.5em;}
address{
  margin: 0.8em 0;}
.address address a{
  color:#fff;}
.address address a:hover{
  color:#FFCC40;}
.description-cta{
  margin-bottom:2em;}
.description-cta a{
  font-weight:800;
  color:#d2232a;}
.description-cta a:hover{
  color:#ff5057;}
/* schedule */
.shows #schedule-slider{
  margin:0 auto;
  max-width:1200px;}
.shows #schedule-slider img{
  border-radius:10px;
  padding:1em;
  background:#fff;}
.show-date img{
  width: 25px;
  vertical-align: middle;}
.show-date {
  font-size: 1.3em;}
.more{margin:2em auto;}
.more .cta{
  margin:0.25em;
  font-size:1.75em;
  font-weight:bold;
  text-transform:uppercase;
  min-width:315px;}
.ticket-container{
  background:#fff;
  padding:2em;
  border-radius:12px;
  width:100%;
  max-width:1200px;
  margin:0 auto;}
/* Mobile Footer */
.call-mobile{
  display:none;
  position:fixed;
  bottom:0;
  width:100%;
  left:0;
  right:0;
  z-index:999;}
.call-mobile .cta{
  margin:0;
  padding:0.25em 0;
  width:100%;
  font-size:1.75em;
  text-align:center;
  text-transform:uppercase;
  line-height:1.15em;
  border-radius:0;}
.call-mobile .cta .border{
  display: block;
  margin: 0 auto;
  padding: 0.5em;
  width: 95%;
  border: 2px solid #000;
  border-radius: 2em;}
@media screen and (max-width: 768px){
  body{padding-bottom:80px;}
  .call-mobile{display:block;}
  #return-to-top{bottom:80px;}
  .ticket-container{
    padding:1em;}
}

/* EXTRAS - Tour, Social, Newsletter */
section#Extras{margin-left: 1.25em;margin-right: 1.25em;margin-top: -3%;padding-top: 0;padding-bottom: 0;}
section#Extras .container{/*border: 1px solid #fff;*/padding: 3em 0;/*background: rgba(0,0,0,0.35);*/}

button, input[type="submit"]{
  border-radius:2em;
  color:#000;
  background:#fff;
  border:0;
  text-shadow: 0 0 0 #388e3c, 0 0 0 #388e3c, 0 0 0 #388e3c, 0 0 0 #388e3c;
  transition: all 0.25s ease;}
button:hover, input[type="submit"]:hover{
  color:#000;
  background:#FFCC40;}

#Newsletter button, #Newsletter input[type="submit"]{
  color: #fff;
  background: #000;}

#Newsletter button:hover, #Newsletter input[type="submit"]:hover{
  color:#000;
  background:#FFCC40;}

@media screen and (max-width: 768px){
  form .col{
    margin:0;}
}

/* Tour */
article#Tour{margin-bottom:3em;}
article#Tour .row{margin: 0 1.25em;border-top:1px solid #fff;}
article#Tour .row p.nodates{margin: 0.75em;text-align: center;}
article#Tour .tour-show{clear: both;display: table;width: 100%;padding: 0.5em 0;border-bottom: 1px solid #fff;}
article#Tour .tour-show{color:#fff;}
article#Tour .tour-show:hover{background-color:rgba(255,255,255,0.2);}
article#Tour .tour-show .tour-date{float: left;text-align: center;width: 100%;max-width:125px;text-transform: uppercase;line-height: 1.0em;}
article#Tour .tour-show .tour-date .month{font-size:1.05em;font-weight:bold;}
article#Tour .tour-show .tour-date .day{font-size:2.25em;font-weight:bold;line-height:0.8em;}
article#Tour .tour-show .tour-date .year{font-size:1.1em;}
article#Tour .tour-show .tour-details{float:left;}
article#Tour .tour-show .tour-details h3{margin:0;font-family:sans-serif;font-size:1.45em;font-weight:bold;}
article#Tour .tour-show .tour-details p{margin:0;font-size:1.15em;}
article#Tour .tour-show .tour-link{float:right;width:100%;max-width:200px;}
article#Tour .tour-show .tour-link a.cta{display:inline-block;margin:0.5em 0;padding:0.5em 1.25em;width:100%;max-width:180px;font-size:1.15em;font-weight:bold;text-align:center;color:#000;border:0 solid #fff;border-radius:5em;white-space:nowrap;}
article#Tour .tour-show .tour-link a.cta:hover{color:#000;background-color:#FFCC40;}
article#Tour .tour-show.tour-nodates{text-align:center;}
article#Tour .tour-show.tour-nodates .tour-details{float:none;}

@media screen and (max-width: 680px){
  article#Tour .tour-show .tour-date{
    max-width:60px;}
  article#Tour .tour-show .tour-date .month{
    font-size:0.9em;}
  article#Tour .tour-show .tour-date .day{
    font-size:2em;}
  article#Tour .tour-show .tour-date .year{
    font-size:0.9em;}
  article#Tour .tour-show .tour-details{
    float: none;}
  article#Tour .tour-show .tour-details h3{
    margin-top:0.25em;
    font-size:1.15em;}
  article#Tour .tour-show .tour-details p{
    margin:0.15em;
    padding:0;
    font-size:1em;}
  article#Tour .tour-show .tour-link{
    max-width:100%;}
  article#Tour .tour-show .tour-link a.cta{
    max-width:100%;}
}

/* Social */
article#Social{text-align:center;}
article#Social img{width:auto;margin:0 0.5em;}

/* Newsletter */
article#Newsletter{text-align: center;}
article#Newsletter input{width:45%;padding:0.5em 0.5em;display:inline;}
article#Newsletter input#submit {width:91%;}

/* Shop */
section#Extras.shop{padding-top:2em;padding-bottom:0;}
section#Extras.shop h3{margin-bottom:0;}
section#Extras.shop p{margin:0 0 0.5em 0;font-size:2em;font-weight:bold;}
section#Extras.shop .more .cta{font-size: 1.15em;}

@media screen and (max-width: 680px) {
  section#Extras.shop p{font-size:1.1em;}
  section#Extras.shop .more {
    margin: 0 auto 2em auto;}
}

/* REVIEWS */
section#Reviews{/*padding-top: 0;*//*background: #000 url(../images/reviews-bg.jpg) no-repeat top center;background-size:cover;*//*color:#fff;*/text-align: center;}
section#Reviews .container{position: relative;padding-bottom: 12%;z-index: 100;}
section#Reviews img{width: auto;display: block;margin: 0 auto 0.5em auto;}
section#Reviews .owl-carousel img{width: 100%;max-width: 175px;border-radius: 999em;border: 2px solid #FFF;-webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);-moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.3);}
section#Reviews .stars{margin-top:2em;}
section#Reviews blockquote{font-size:0.95em;border-left:0;}
section#Reviews cite{font-size:0.95em;background:transparent;}

/* ABOUT */
@media screen and (max-width: 680px) {
  section#About img.leon-photo {
    margin-right: auto;
    margin-top: -1.25em;
    margin-left: auto;
    max-width: 300px;}
}

/* CONTACT */
section#Contact .col.right{position: relative;z-index: 999;}

@media screen and (min-width:920px){
  .crowd{position: absolute; margin-top:-24%;}
  .fog{position: absolute;margin-top:-24%;}
}

@media screen and (max-width:680px){
  section#Contact .crowd{margin-bottom:-5em;}
}

/* -- 5c: Interior ------------------------------------------- */
/*------------------------------------------------------------ */
/* 6: SIDEBAR */
/* -- 6a: Aside ---------------------------------------------- */
/*------------------------------------------------------------ */
/* 7: FOOTER */
/* -- 7a: Footer Content ------------------------------------- */
/* -- 7b: Copyright ------------------------------------------ */
/*------------------------------------------------------------ */
/* 8: ANIMATION/FX */
/* -- 8a: Grid Effects --------------------------------------- */
/* -- 8c: Parallax Images - Using Simple Parallax JS --------- */
.parallax-banner .container{
  padding:20% 1em;}
.parallax-banner .overlay{
  height:50%;
  bottom:0;
  background: rgb(0,0,0);
background: -moz-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
  z-index:1;}
/*------------------------------------------------------------ */
/* faq */  
#accordion h3{
  padding: 0.35em 2.75em 0.35em 1em;
  font-family:'Montserrat', sans-serif;
  font-size:1.15em;
  font-weight: bold;}
.ui-accordion .ui-accordion-content{
  padding:0.5em 1em;
  background:#fff;}

/* 8c: Owl Carousel */
.owl-carousel .owl-stage {
  margin: 0 auto;}

/* centers entries */
#gallery-slider.owl-carousel .owl-item img {
  max-width: 500px;
  margin: 0 auto;}
.owl-theme .owl-nav [class*=owl-] {
  background: rgba(0, 0, 0, 0.4) !important;}
.owl-theme .owl-nav [class*=owl-]:hover {
  background: rgba(0, 0, 0, 0.6) !important;}
.owl-prev, .owl-next {
  position: absolute;
  top: 40%;
  margin-top: -10px;}
.owl-prev {
  left: 0;}
.owl-next {
  right: 0;}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
  box-shadow: none;}
.owl-carousel .owl-nav button.owl-next .fa, .owl-carousel .owl-nav button.owl-prev .fa {
  padding: 0.45em 0.35em;
  font-size: 1.85em;
  color: #fff;}
.owl-carousel .owl-nav button:hover {
  background: #5cc661;
  border-color: #4CAF50;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 -1px 1px #000, 1px 0 1px #000, 0 1px 1px #000, -1px 0 1px #000;}

/* 9: RESPONSIVE */
@media screen and (max-width:1380px){
  section.details h2{
    font-size:3em;}
  section.details .live-stamp{
    max-width:120px;}
  .new-illusion-stamp{
    top: 17em;
    width: 240px;
  }
}
@media screen and (max-width:1100px){
  section.details h2{
    font-size:2.5em;}
  section.details .live-stamp{
    max-width:100px;}
  .new-illusion-stamp {
    width: 225px;
    top: 15em;
  }
}
@media screen and (max-width:920px){
  h1{font-size:2em;}
  h4{font-size:1.5em;}
  h6{font-size:1em;}
  section.details h2{
    font-size:1.75em;}
  section.details .live-stamp{
    max-width:75px;}
  .new-illusion-stamp{
    top: 12em;
    width: 195px;
  }
}
@media screen and (max-width:680px){
  header .main-header{width:100%;}
  h1{
    font-size: 1.75em;
    line-height: 1.35em;}
  h1 .mobile{display:none;}
  h3{font-size:1.5em;}
  h4{font-size:1.3em;}
  .tag{/*top:8em;*/ width:auto;}
  h6{font-size:0.7em;}
  .parallax-banner{}
  .parallax-banner .container{
    padding:8em 1em;}
  section.details img.leon-photo{
    /*display:block;*/
    margin-right:auto;
    /*margin-top:-6em;*/
    margin-top:-1.25em;
    margin-left:auto;
    max-width:300px;}
  section.details .info{
    margin-top:-8em;}
  .new-illusion-stamp {
    width: 150px;
    top: 9.5em;}
  section.details .asotv{
    /*margin-top: 2em;*/
    margin-top: 4em;}
  address{
    font-size:1.15em;
    line-height:1.35em;
    text-align: center;}
}
@media screen and (max-width:429px){
  h1 span.large{
    font-size:2em;}
}