@import url(http://fonts.googleapis.com/css?family=Alegreya+Sans:100,300,400,500,700|Roboto+Condensed:400,300,700|Open+Sans+Condensed:300);

/* ============================================================
  HTML & BODY
============================================================ */
html, body {
  height: 100%;
  width:100%;
  margin:0;
  padding:0;
  font-family:'Roboto Condensed', Helvetica, Arial, sans-serif;
  font-weight: 300;
}

a {
  -webkit-transition: background .5s, color .5s ease-out;
  -moz-transition:
   background, color .5s .5s ease-out;
  transition: background .5s, color .5s ease-out;
}

/* ============================================================
 main sections
============================================================ */
#navigation {
  border-bottom: 1px solid #FFF;
  width:100%;
  padding:1em;
  min-height:3em;
  position:fixed;
  _position:absolute;
  top:0;
  _top:expression(eval(document.body.scrollTop));
  z-index:50;
    transition: all .6s;
}

#navigation li {
  margin:0;
  padding:0;
  text-align:center;
  font-size:.9em;
}

#navigation li a {
  font-family:'Open Sans Condensed', Helvetica, Arial, sans-serif;
  color:#fff;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#navigation li a:hover {
  color:#333;
}

.icon-list {
  color:#fff;
}


#navigation li a.theaterbtn {
  font-family:'Open Sans Condensed', Helvetica, Arial, sans-serif;
  color:#fff;
  text-transform: uppercase;
  letter-spacing: 1px;
	background-color: #333;
	padding: 5px;
	border-radius: 7px;
	font-weight: 400;
}

#navigation li a.theaterbtn:hover {
  color:#333;
	background-color: #fff;
	padding: 5px;
	border-radius: 7px;
}

#homepage {
  height: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#555; /***  only needed if you're not using a background image ****/
  margin:0;
  padding:5em 0 0 0;
}

.pageslide {
   padding:5em 0 3em 0;
   min-height:600px;
}

.parallax {
  height: 600px;
  margin:0;
  padding:0;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.openingdates {
  width:100%;
  position:absolute;
  bottom:4.5em;
  visibility: hidden;
  display: none;
  /*******/
  text-align:center;
	font-family:'Open Sans Condensed', Helvetica, Arial, sans-serif;
	font-size: .9rem;
	line-height: .95rem;
	text-transform: uppercase;
	color:#fff;
	letter-spacing: 4px;
  text-shadow: 1px 1px #333;
}

h1 {
	color:#fff;
	font-family:'Alegreya Sans', Helvetica, Arial, sans-serif;
	font-size: 9rem;
	line-height: 7rem;
	letter-spacing: 30px;
	font-weight: 100;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	}

.spacer {
	letter-spacing: 37px;
	}

h2 {
	color:#c69f45;
	font-family:'Alegreya Sans', Helvetica, Arial, sans-serif;
	font-size: 2rem;
	line-height: 2rem;
	letter-spacing: 10px;
	font-weight: 300;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	}

h5 {
	color:#333;
	font-family:'Alegreya Sans', Helvetica, Arial, sans-serif;
	font-size: 1.25rem;
	line-height: 1.3rem;
	letter-spacing: 10px;
	font-weight: 300;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
	text-shadow: 1px 1px #c69f45;
	}

.smallText {
	font-size: smaller;
	}

.globes {max-width: 350px;}

.awards {display: none; text-align: center;}

.bray-digital {
	text-align: center;
	max-width: 290px;
	margin: 0 auto;
	}

.bray-digital p {
	padding: 0 0 7px 0;
	margin: 0;
	color:#333;
	font-family:'Alegreya Sans', Helvetica, Arial, sans-serif;
	font-size: .8rem;
	line-height: .9rem;
	letter-spacing: 5px;
	font-weight: 300;
	text-transform: uppercase;
	text-shadow: 1px 1px #c69f45;
	}

img.boxart {
	max-width: 150px;
	padding: 0;
	margin: 0;
	}

.buybutton {max-width: 100px; margin: 3px 3px 2px 3px; padding: 0;}

/*** Background images for homepage & interstitial pages ****/
/****************
For the following, do not edit the background size css. 
Change the path of the background image to change it, 
or just name your background images the same as what's already here.
The background image paths had to come before the background size css in order to work properly.
For best results, use a size of around 1920x1080. Ratio should be similar to 16:9, or standard TV ratio.
****************/

#homepage {
  background-image: url("../img/bg_1.jpg");
  }

#pageslide1  {
  background-image: url("../img/bg_julianne_1.jpg");
  }

#pageslide2  {
  background-image: url("../img/bg_alec_1.jpg");
  }

#pageslide3  {
  background-image: url("../img/bg_k-j_1.jpg");
  }

#pageslide4  {
  background-image: url("../img/bg_julianne_2.jpg");
  }

#pageslide6  {
  background-image: url("../img/bg_black.jpg");
  }

#parallax-1 {
  background-image: url("../img/bg_kate_1.jpg");
}
.parallax-2 {
  background-image: url("http://lorempixel.com/1920/1080/people/1");
}
.parallax-3 {
  background-image: url("http://lorempixel.com/1920/1080/people/2");
}
.parallax-4 {
  background-image: url("http://lorempixel.com/1920/1080/people/3");
}

.parallax-5 {
  background-image: url("http://lorempixel.com/1920/1080/people/5");
}
.parallax-6 {
  background-image: url("http://lorempixel.com/1920/1080/people/6");
}
.parallax-7 {
  background-image: url("http://lorempixel.com/1920/1080/people/7");
}

/**********************
Accordion - everything in this section is editable
**********************/
.accordion dd > a {
  font-family:'Open Sans Condensed', Helvetica, Arial, sans-serif;
  font-weight: 300;
  background:rgba(0,0,0,0.5);
  color:#fff;
}

.accordion dd > a:hover {
  background:rgba(0,0,0,1);
}

.accordion dd.active > a {
  background:rgba(0,0,0,0.8);
}
.accordion dd > .content.active {
  background:rgba(0,0,0,0.2);
}

/**********************
footer
*********************/
.footer {
  width:100%;
   position:fixed;
  _position:absolute;
  bottom:0;
  _top:expression(eval(document.body.scrollBottom));
  /*******/
  margin: 0;
  padding:.2em;
  font-size:.8em;
  text-transform:uppercase;
  border-top: 1px solid #FFF;
}

.footer a{
  /*******/
  font-family:'Open Sans Condensed', Helvetica, Arial, sans-serif;
  color:#fff;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size:.8em;
  line-height: .85rem;
}

.footer li {
  text-align:center;
  padding: 0;
  margin: 0;
}

.footer a.social {
  /*******/
  color:#fff;
  font-size:1em;
}
.copyright {
  /*****/
  font-size:.8em;
  color:#d2d2d2;
  text-align:center;
  text-transform:none;
  margin: 0;
  padding-top:.3em;
}

/**********************
back to top button
*********************/
.back-to-top {
  position:fixed;
  _position:absolute;
  bottom:48px;
  _top:expression(eval(document.body.scrollBottom));
  left: 50%;
  text-align: center;
  right: 0px;
  display: none;
  z-index: 200;
  padding:1em;
  /******/
  margin-left:-30px;
  width: 60px;
  height:50px;
  border-radius:3px 3px 0 0;
  -webkit-border-radius:3px 3px 0 0;
}

a .back-to-top {
  /******/
  font-size: .8rem;
  line-height: .8rem;
  color:#FFF;
  text-transform: uppercase;
  text-align: center;
}

/**********************
scrolling text box
*********************/

.scrolltext {
  /******/
  margin-top: 1rem;
  height:auto;
  max-height: 450px;
  padding:1rem;
  border-top: 1px solid #FFF;
  background:rgba(255,255,255,0.5);
}

.scrolltext-dark {
  /******/
  color: #FFF;
  margin-top: 1rem;
  height:auto;
  max-height: 450px;
  padding:1rem;
  border-top: 1px solid #FFF;
  background:rgba(0,0,0,0.5);
}

.scrolltext-dark a {
	font-family: 'Alegreya Sans', Helvetica, sans-serif;
	color: #FFF;
	text-transform: uppercase;
	letter-spacing: 1px;
	}

.scrolltext-dark a:hover {
	color: #c69f45;
	}

.scrollmodal {
  /******/
  margin-top: 1rem;
  height: auto;
  max-height:450px;
  overflow-y:scroll;
  padding: 0 .5rem 0 0;
}

.scrollmodal img {
	width: 100%;
	min-width: 200px;
	max-width: 450px;
	}

.scrollmodal a {
	color: #000;
	text-decoration: none;
	border-bottom: 1px dotted #c69f45;
	}

.scrollmodal a:hover {
	color: #c69f45;
	}

.img-right {
	padding: 0 0 7px 7px;
	}

.img-left {
	padding: 0 10px 7px 0;
	}

.link {
	font-family: 'Alegreya Sans', Helvetica, sans-serif;
	color: #FFF;
	text-transform: uppercase;
	letter-spacing: 1px;
	}

/**********************
Mobile Styles
*********************/

.mobileheader h1 {
  color:#fff;
  font-size:1em;
  text-align:center;
}

/**********************
modal
**********************/
.reveal-modal {
  /******/
  color:#000;
}

.reveal-modal h1,.reveal-modal h2,.reveal-modal h3,.reveal-modal h4,.reveal-modal h5 {
  /******/
  color:#000;
}

.reveal-modal h2 {
  border-bottom: 1px solid #c69f45;
}

#trailer.reveal-modal {
  background:none;
  border:none;
  box-shadow: none;

}

.reveal-modal-bg {
  background:rgba(0,0,0,0.9);
}
/**********************
Foundation overrides - DO NOT TOUCH
*********************/
.flex-video  {
  margin-bottom:0;
}

@media only screen and (max-width: 40em) {
  dialog, .reveal-modal {
    min-height:0;
  }
}

/**********************
IE8 Fix
*********************/
.ie8 {
  display:none;
}
/**********************
Slick Slider fix
*********************/
.slick-prev, .slick-next {
border-radius:100%;
-webkit-border-radius:100%;

}

.slick-slider {
  margin-top: 15%;
  padding:1em;
  text-align: left;
}

.slidercontent h5 {
	font-size: 1.75rem;
	line-height: 2rem;
	color: #000;
	text-shadow: none;
	}

.slidercontent p {
	margin-top: 10px;
	padding-top: 10px;
	color: #000;
	letter-spacing: 1px;
	border-top: 1px solid #FFF;
	}

.slidercontent a {
	color: #000;
	}

.slidercontent a:hover {
	color: #c69f45;
	}



/**********************
gallery
*********************/

.spacer {
  margin-top: 1rem;	
  }


/**********************
Lightbox gallery 
*********************/
.photogallery img {
  border-radius:3px;
  -webkit-border-radius:3px;
}

.lb-outerContainer {
  background:rgba(255,255,255,0.4)
}



/**********************
Mobile-only styles - MMW Adds
*********************/
@media (max-width: 1060px) {
.openingdates {
  width:100%;
  position:absolute;
  bottom: 6em;
  visibility: visible;
  display: inline;
	}

.bray-digital {
  visibility: hidden;
  display: none;
	}
}


@media (max-width: 850px) {

.openingdates {
  width:100%;
  position:absolute;
  bottom: 5.5em;
  visibility: visible;
  display: inline;
	}

.bray-digital {
  visibility: hidden;
  display: none;
	}

h1 {
	font-size: 6rem;
	line-height: 5.5rem;
	letter-spacing: 30px;
	}

h5 {
	font-size: 1rem;
	line-height: 1rem;
	letter-spacing: 10px;
	text-shadow: 1px 1px #c69f45;
	}

.slidercontent h5 {
	font-size: 1.2rem;
	line-height: 1.2rem;
	color: #000;
	text-shadow: none;
	}

.back-to-top {
  position:fixed;
  _position:absolute;
  bottom:65px;
}

}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {

.openingdates {
  width:100%;
  position:absolute;
  bottom: 5.5em;
  visibility: visible;
  display: inline;
	}

.bray-digital {
  visibility: hidden;
  display: none;
	}

h1 {
	font-size: 6rem;
	line-height: 5.5rem;
	letter-spacing: 30px;
	}

h5 {
	font-size: 1rem;
	line-height: 1rem;
	letter-spacing: 10px;
	text-shadow: 1px 1px #c69f45;
	}

.slidercontent h5 {
	font-size: 1.2rem;
	line-height: 1.2rem;
	color: #000;
	text-shadow: none;
	}

.back-to-top {
  position:fixed;
  _position:absolute;
  bottom:65px;
}

}



@media (max-width: 550px) {

.openingdates {
  width:100%;
  position:absolute;
  bottom: 5.5em;
  visibility: visible;
  display: inline;
	}

.bray-digital {
  visibility: hidden;
  display: none;
	}

h1 {
	font-size: 6rem;
	line-height: 5.5rem;
	letter-spacing: 30px;
	}

h5 {
	font-size: 1rem;
	line-height: 1rem;
	letter-spacing: 10px;
	text-shadow: 1px 1px #c69f45;
	}

.slidercontent h5 {
	font-size: 1.2rem;
	line-height: 1.2rem;
	color: #000;
	text-shadow: none;
	}

.back-to-top {
  position:fixed;
  _position:absolute;
  bottom:65px;
}

}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {

.openingdates {
  width:100%;
  position:absolute;
  bottom: 5.5em;
  visibility: visible;
  display: inline;
	}

.bray-digital {
  visibility: hidden;
  display: none;
	}

h1 {
	font-size: 6rem;
	line-height: 5.5rem;
	letter-spacing: 30px;
	}

h5 {
	font-size: 1rem;
	line-height: 1rem;
	letter-spacing: 10px;
	text-shadow: 1px 1px #c69f45;
	}

.slidercontent h5 {
	font-size: 1.2rem;
	line-height: 1.2rem;
	color: #000;
	text-shadow: none;
	}

.back-to-top {
  position:fixed;
  _position:absolute;
  bottom:65px;
}

}