@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600|Quicksand:300,400,700);

/* ============================================================
  HTML & BODY
============================================================ */
html, body {
  height: 100%;
  width:100%;
  margin:0;
  padding:0;
  color: #F9F9F9;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 200;
  background-color: #000;
}

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 {
  width:100%;
  position:fixed;
  _position:absolute;
  top:1.25rem;
  _top:expression(eval(document.body.scrollTop));
  z-index:50;
}

#navigation li {
  margin:0;
  padding:0;
  text-align:center;
}

#navigation li a {
  text-transform: uppercase;
  font-size: 1.75rem;
  line-height: 1.75rem;
  text-align: center;
  font-family: 'kessel_105bold', 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 700;
  color: #F8F8F8;
  padding: .25rem;
}

#navigation li a:hover {
  color:#e7da6d;
  background-color: #000;
}

.icon-list {
  color:#F7F7F7;
}

#homepage {
  min-height:600px;
  height: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#000000;
  margin:0;
}

.pageslide {
  height: 100%;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#000000;
  margin:0;
}

#pageslide1, #pageslide3, #pageslide4 {
  min-height: 600px;
  padding: 8% 0 0 0;
}

#pageslide2 {
  /*gallery*/
  min-height:600px;
  padding: 10% 0 0 0;
}

#pageslide3 .festival {
  /*cast*/
  padding: 3rem 0 0 0;
}

#inter-1 {
  padding: 17% 0 0 0;
}

#inter-2 {
  /*edited*/
  min-height:600px;
  padding: 8% 0 0 0;
}

#inter-3 {
  max-height: 425px;
  padding: 4% 0 0 0;
}

#inter-4 {
  /*edited*/
  min-height:600px;
   padding:10% 0 0 0;
}

.openingdates {
  width:100%;
  position:absolute;
  bottom: 5rem;
  /*******/
  text-align:center;
  margin: 0;
  padding: 0;
  font-size: 1.5rem;
  line-height: 1.5rem;
  font-family: 'kessel_105bold', 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 300;
  color: #F9F9F9;
  text-transform: uppercase;
  text-shadow: 0px 3px #000;
}
/*
.openingdates a {
  color: #000;
  padding: .25rem;
  background-color: #F9F9F9;
  text-shadow: none;
}

.openingdates a:hover {
  background-color: #5ebcdd;
}
*/

/* ============================================================
TONI ERDMANN
============================================================ */

#homepage-quotes {
  position: absolute;
  top: 5rem;
  text-align: center;
}

#quote-row {
  width:100%;
  position:absolute;
  top: 4rem;
}

#title-row {
  width:100%;
  position:absolute;
  bottom: 40%;
}

#homepage h1 {
  margin: 0;
  padding: 0;
  font-family: 'lemonmilkregular', sans-serif;
  color: #5ebcdd;
  font-size: 7rem;
  line-height: 6rem;
}

#homepage h5 {
  margin: 0;
  padding: 0;
  font-family: 'lemonmilkregular', sans-serif;
  color: #F9F9F9;
  font-size: 1.5rem;
  line-height: 1.75rem;
  text-align: right;
  letter-spacing: 0.01rem;
}

.title-wrapper {
  text-align: right;
}

.title-text-large {
  margin: 0;
  padding: 0;
  font-family: 'lemonmilkregular', sans-serif;
  color: #5ebcdd;
  font-size: 10rem;
  line-height: 9rem;
}

.title-text-small {
  margin: 0;
  padding: 0;
  font-family: 'lemonmilkregular', sans-serif;
  color: #5ebcdd;
  font-size: 3.5rem;
  line-height: 3rem;
}

#homepage h1.resize {
  font-size: 3rem;
}

.pageslide h2 {
  padding: 0;
  margin: 0 0 1rem 0;
  font-family: 'lemonmilkregular', sans-serif;
  font-size: 2rem;
  line-height: 2rem;
  color: #5ebcdd;
}

.quote {
  margin: 2rem 0;
  padding: 0;
  font-size: 2.5rem;
  line-height: 2.8rem;
  color: #e7d86d;
  font-family: 'kessel_105bold', 'kessel_105bold', 'Quicksand', sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0px 3px #000;
}

.quote-credit {
  margin: 0;
  padding: 0;
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 700;
  font-size: .75rem;
  line-height: .5rem;
}

.liner-upper {
  border-top: 1px solid #e7d86d;
}

.liner-lower {
  border-bottom: 1px solid #e7d86d;
}

.festival {
  margin: 2rem 0;
  padding: 0;
  font-size: 2.5rem;
  line-height: 2.35rem;
  color: #e7d86d;
  font-family: 'kessel_105bold', 'kessel_105bold', 'Quicksand', sans-serif;
  text-align: center;
  text-transform: uppercase;
}

.festival-wrapper {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

.header-wrapper {
  margin-bottom: 5rem;
}

.middle-wrapper {
  margin-top: 8rem;
}

.photogallery img {
  padding: .25rem;
  border-radius: 7px;
  background-color: #e7d86d;
  opacity: 0.9;
}

.photogallery img:hover {
  background-color: #5ebcdd;
  opacity: 1.0;
  -webkit-transition: background .5s, color .5s ease-out;
  -moz-transition:
   background, color .5s .5s ease-out;
  transition: background .5s, color .5s ease-out;
}

img.image-section {
  width: 100%;
  max-height: 780px;
  padding: .25rem;
  background-color: #e7d86d;
  border-radius: 7px;
  border: 0;
  opacity: 0.85;
}

.bizarro {
  margin-top: .5rem;
  padding: 1rem 1rem .75rem 1rem;
  background-color: #e7d86d;
}

.bizarro-color {
  color: #000;
}

.bio-image {
  max-width: 450px;
  max-height: 500px;
  padding: .25rem;
  background-color: #F9F9F9;
}

.font-fix {
  font-family: 'kessel_105bold', 'Quicksand';
  font-weight: 700;
}

.small-text {
  font-size: smaller;
}

.italics {
  font-style: italic;
}

.yellow-text {
  color: #e7d86d;
}

.align-right {
  float: right;
}

.align-left {
  float: left;
}

.margin-right {
  margin-right: 1rem;
}

.menu-btn {
  font-size: 2rem;
}

.align-awards-left {
  text-align: left;
  padding: 0 20% 0 0;
}

.text-spacer {
  line-height: 2.5rem;
}

/**********************
Awards Section
*********************/

.awards {
  font-size: 1.5rem;
  line-height: 1.5rem;
  color: #e7d86d;
  font-family: 'kessel_105bold', 'kessel_105bold', 'Quicksand', sans-serif;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0px 3px #000;
}

.awards .large-text {
  font-size: 2rem;
}


/*** Blu-ray/Digital ****/

.bluray-digital-wrapper {
  max-width: 330px;
  max-height: 175px;
  float: right;
  background-color: #000;
}

.box-art {
  max-height: 175px;
  max-width: 142px;
  float: left;
}

.box-art img {
  max-height: 175px;
  max-width: 142px;
}

.cta {
  max-width: 155px;
  text-align: center;
  padding: .5rem .25rem .25rem .5rem;
}

.cta p {
  color: #F9F9F9;
  font-family: 'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1rem;
}

img.cta-button {
  max-width: 100px;
  padding: .25rem 0;
}


/*** Background images for homepage & interstitial pages ****/

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

#inter-1 {
  background-image: url("../img/backgrounds/inter-1.jpg");
}

#inter-5 {
  background-image: url("../img/gallery/21.jpg");
}

#pageslide1 {
  /*synopsis*/
  background-image: url("../img/backgrounds/1.jpg");
  }

#pageslide2, #pageslide3, #pageslide4 {
  background-color: #000;
  }

#inter-2, #inter-3, #inter-4 {
  /*edited*/
  background-color: #000;
  }

/**********************
footer
*********************/
.footer {
  width:100%;
   position:fixed;
  _position:absolute;
  bottom:0;
  _top:expression(eval(document.body.scrollBottom));
  /*******/
  opacity: 0.5;
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
}

.footer a{
  /*******/
  color: #e7d86d;
  font-size:.7rem;
  text-transform: uppercase;
}

.footer a:hover {
  opacity: 1.0;
  border-bottom: 1px dotted #F9F9F9;
}

.footer ul {
  margin: 0;
  padding: 0;
}

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

.footer a.social {
  /*******/
  color: #5ebcdd;
  font-size:.8em;
}
.copyright {
  /*****/
  font-size:.7rem;
  color:#d2d2d2;
  text-align:center;
  text-transform: uppercase;
  padding-top: 1rem;
}

/**********************
back to top button
*********************/
.back-to-top {
  position:fixed;
  _position:absolute;
  bottom: 3.5rem;
  _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 {
  /******/
  color: #5ebcdd;
  font-weight: 600;
  font-size: 1.25rem;
}

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

.scrolltext {
  /******/
  height:525px;
  padding: 0 1rem .1rem 0;
}

.scrolltext p {
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-size: 1.5rem;
  font-weight: 200;
  color: #F9F9F9;
}

.scrolltext a {
  color: #F3F3F3;
  border-bottom: 1px dotted #F1F1F1;
}

.scrolltext a:hover {
  border-bottom: 1px solid #FFF;
}

.scrolltext ul li {
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: #F9F9F9;
  font-size: 1.5rem;
}

.scrolltext ul li a {
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 300;
  color: #F1F1F1;
  text-transform: uppercase;
  border-bottom: none;
  font-size: 1.5rem;
  background-color: none;
  border-bottom: 1px dotted #F9F9F9;
}

.scrolltext ul li a:hover {
  color: #FFF;
  border-bottom: 1px solid;
}

.scrolltext ul li .link {
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 200;
  color: #F9F9F9;
  text-transform: uppercase;
  border-bottom: none;
  font-size: 1.5rem;
  background-color: none;
}

.boxed-text {
  padding: .25rem;
  background-color: #F1F1F1;
  color: #000;
}

.scrollmodal {
  /******/
  height:525px;
  overflow-y:scroll;
  overflow-x: hidden;
  padding: 0 1.5rem 0 0;
}

.scrollmodal p {
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-size: 1.5rem;
  font-weight: 200;
  color: #F9F9F9;
}

.scrollmodal::-webkit-scrollbar{width: 3px;}
.scrollmodal::-webkit-scrollbar-thumb{background-color:rgba(231,216,109,0.5); border-radius: 0;}
.scrollmodal::-webkit-scrollbar-thumb:hover{background-color:rgba(231,216,109,0.75);}
.scrollmodal::-webkit-scrollbar-track{background-color:rgba(231,216,109,0.25);}

.scrolltext::-webkit-scrollbar{width: 2px;}
.scrolltext::-webkit-scrollbar-thumb{background-color:rgba(231,216,109,0.75); border-radius: 0;}
.scrolltext::-webkit-scrollbar-thumb:hover{background-color:rgba(231,216,109,0.95);}
.scrolltext::-webkit-scrollbar-track{background-color:rgba(2231,216,109,0.75);}


/**********************
modal
**********************/
.reveal-modal {
  /******/
  color:#F9F9F9;
  background-color: #000;
  border:none;
}

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

}

.reveal-modal-bg {
  background:rgba(0,0,0,0.9);
  border:none;
}

.reveal-modal h2 {
  padding: 0;
  margin: 0 0 1rem 0;
  font-family: 'lemonmilkregular', sans-serif;
  font-size: 2rem;
  line-height: 2rem;
  color: #5ebcdd;
}

.reveal-modal h5 {
  margin: 0 0 1rem 0;
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.25rem;
  color: #F9F9F9;
  text-transform: uppercase;
}

.reveal-modal h6 {
  padding: 0 0 0 .75rem;
  font-family: 'lemonmilkregular', sans-serif;
  font-size: 1.25rem;
  line-height: 1.25rem;
  color: #F9F9F9;
  text-transform: uppercase;
}

.reveal-modal ul li {
  margin: 0;
  padding: 0 0 0 .75rem;
  font-family: 'kessel_105bold', 'Quicksand', sans-serif;
  font-size: 1.25rem;
  font-weight: 200;
  color: #F9F9F9;
}

.color-block {
  padding: .25rem;
  background-color: #5ebcdd;
}


/**********************
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;
}

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

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

/**********************
MMW Adds - MOBILE ONLY
*********************/

@media (max-height: 650px) {

#homepage .quote {
  font-size: 2rem;
  line-height: 1.75rem;
}

}
@media (max-width: 1200px) {

.quote {
  margin: 2rem 0;
  font-size: 2.5rem;
  line-height: 2.8rem;
}

.text-spacer {
  line-height: 2.5rem;
}

.festival {
  margin: 2rem 0;
  font-size: 2rem;
  line-height: 1.95rem;
}
}

@media (max-width: 1100px) {

.awards {
  margin-top: 2rem;
}

.quote {
  font-size: 1.75rem;
  line-height: 1.85rem;
}

@media (max-width: 1025px) {

#homepage {
  padding: 3.5rem 0 0 0;
}

#title-row {
  bottom: 45%;
}

.openingdates {
  bottom: 7rem;
}

#quote-row {
  top: 0;
}

.quote {
  margin: 2rem 0;
  font-size: 1.75rem;
  line-height: 1.7rem;
}

.text-spacer {
  line-height: 2rem;
}

.festival {
  margin: 2rem 0;
  font-size: 1.25rem;
  line-height: 1.25rem;
}

#inter-1 {
  visibility: hidden;
  display: none;
}
}

@media (max-width: 900px) {



.openingdates {
  bottom: 7.5rem;
}

.align-awards-left {
  padding: 0 0 0 0;
}

.quote {
  margin: .75rem 0;
  font-size: 1.5rem;
  line-height: 1.55rem;
}

.text-spacer {
  line-height: 2rem;
}

.festival {
  margin: 2rem 0;
  font-size: 1.75rem;
  line-height: 1.5rem;
}
}

@media (max-width: 725px) {

.quote {
  margin: .75rem 0;
  font-size: 1.5rem;
  line-height: 1.55rem;
}

.align-awards-left {
  padding: 0 0 0 0;
}

#inter-2 {
  /*edited*/
  padding: 3% 0 0 0;
}

.festival {
  margin: 2rem 0;
  font-size: 1.25rem;
  line-height: 1.25rem;
}

.scrolltext {
  /******/
  height:480px;
}

.scrolltext p {
  font-size: 1.25rem;
}

.scrolltext ul li {
  font-size: 1.25rem;
}

.scrolltext ul li a {
  font-size: 1.25rem;
}
.scrolltext ul li .link {
  font-size: 1.25rem;
}

.scrollmodal {
  /******/
  height:480px;
}

.scrollmodal p {
  font-size: 1.25rem;
}
}

@media (max-width: 600px) {

#title-row {
  bottom: 40%;
}

.title-wrapper {
  text-align: center;
}

.align-awards-left {
  padding: 0 0 0 0;
}

#homepage h5 {
  text-align: center;
  text-shadow: 0px 3px #000;
}

.openingdates {
  bottom:8.5rem;
}

#quote-row {
  top: 0;
}

.quote {
  font-size: 2rem;
  line-height: 2.1rem;
}
}

/* Image Jump Patch ----------- */
@media only screen and (min-width: 1300px) and (max-width: 1399px) {

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

#pageslide1 {
  /*synopsis*/
  background-image: none;
  background: #000;
  }

#inter-1 {
  /*edited*/
  background-image: none;
  background: #000;
  }

#inter-2 {
  /*edited*/
  background-image: none;
  background: #000;
  padding: 10% 0 0 0;
  }

.pageslide h2 {
  padding: .5rem;
  color: #000;
  background-color: #5ebcdd;
  max-width: 35%;
}
}

@media only screen and (min-width: 1600px) {

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

#pageslide1 {
  /*synopsis*/
  background-image: none;
  background: #000;
  }

#inter-1 {
  /*edited*/
  background-image: none;
  background: #000;
  }

#inter-2 {
  /*edited*/
  background-image: none;
  background: #000;
  padding: 12% 0 0 0;
  }

.pageslide h2 {
  padding: .5rem;
  color: #000;
  background-color: #5ebcdd;
  max-width: 35%;
}


.align-awards-left {
  text-align: left;
  padding: 0 35% 0 0;
}

}

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

.awards {
  visibility: hidden;
  display: none;
}

}

/* iPhone 5 Portrait ----------- */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait) { 

#homepage {
  padding: 0;
  background-color: #000;
  background-image: none;
}

#inter-1 {
  padding: 0 0 0 0;
  background-color: #000;
  background-image: none;
}

#pageslide1, #pageslide2, #pageslide3, #pageslide4 {
  /*synopsis*/
  padding: 0;
  background-color: #000;
  background-image: none;
}

#inter-1, #inter-3, #inter-5 {
  visibility: hidden;
  display: none;
}

#inter-2 {
  /*edited*/
  padding-top: 4%;
  background-color: #000;
  background-image: none;
}

#inter-3 {
  padding: 0 0 0 0;
  max-height: 200px;
}

.awards {
  font-size: 1rem;
  line-height: 1.25rem;
}

#homepage h5 {
  font-size: 1.1rem;
  line-height: 1.25rem;
}

#title-row {
  top: 6rem;
}

.title-text-large {
  font-size: 4rem;
  line-height: 4rem;
}

.openingdates {
  bottom: 7rem;
  font-size: 1rem;
  line-height: 1.25rem;
}

#homepage-quotes {
  top: 0;
}

.quote {
  font-size: 1.5rem;
  line-height: 1.55rem;
}

.festival {
  margin: 0;
  font-size: 1rem;
  line-height: 1rem;
}

.scrolltext {
  /******/
  height:475px;
}

.scrolltext p {
  font-size: 1rem;
}

.scrolltext ul li {
  font-size: 1rem;
  line-height: 1.1rem;
}

.scrolltext ul li a {
  font-size: 1rem;
  line-height: 1.1rem;
}

.scrolltext ul li .link {
  font-size: 1rem;
  line-height: 1.1rem;
}

.scrollmodal {
  /******/
  height:480px;
}

.scrollmodal p {
  font-size: 1.1rem;
}

.reveal-modal h5 {
  line-height: 1.5rem;
}

.bio-image {
  max-width: 300px;
  padding: .25rem;
  margin-left: 1rem;
}

.footer a{
  font-size:.5rem;
  line-height: .5rem;
}

.footer a.social {
  font-size:.6rem;
  line-height: .6rem;
}
.copyright {
  padding-top: 0;
  font-size:.5rem;
}
}

/* iPhone 5 Landscape ----------- */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) { 


#homepage {
  padding: 0;
}

#pageslide1 {
  background-color: #000;
  background-image: none;
  padding: 3rem 0 0 0;
  }

#pageslide2, #pageslide3, #pageslide4 {
  padding: 0;
  background-color: #000;
  background-image: none;
}

#quote-row {
  top: 0rem;
}

.awards {
  font-size: 1rem;
  line-height: 1.25rem;
  margin: 0;
  padding: 0;
}

#title-row {
  bottom: 40%;
}

#inter-1, #inter-3, #inter-5 {
  visibility: hidden;
  display: none;
}

#inter-2 {
  /*edited*/
  padding: 3% 0 0 0;
}

.title-wrapper {
  text-align: right;
}

.title-text-large {
  font-size: 4rem;
  line-height: 4rem;
}

#homepage h5 {
  text-align: right;
  text-shadow: 0px 3px #000;
  font-size: 1.1rem;
  line-height: 1.25rem;
}

.openingdates {
  bottom:5.5rem;
  font-size: .75rem;
  line-height: 1.25rem;
}

.bluray-digital-wrapper {
  visibility: hidden;
  display: none;
}

#homepage-quotes {
  top: 0;
}

#quote-row {
  top: 0;
}

#quote-row .quote {
  margin: 0;
}

.quote {
  margin: .75rem 0;
  font-size: 1.25rem;
  line-height: 1.25rem;
}

.festival {
  margin: 0;
  font-size: 1rem;
  line-height: 1rem;
}

.scrolltext {
  /******/
  height:425px;
}

.scrolltext p {
  font-size: 1.1rem;
}

.scrolltext ul li {
  font-size: 1.1rem;
  line-height: 1.2rem;
}

.scrolltext ul li a {
  font-size: 1.1rem;
  line-height: 1.2rem;
}
.scrolltext ul li .link {
  font-size: 1.1rem;
  line-height: 1.2rem;
}

.scrollmodal {
  /******/
  height:480px;
}

.scrollmodal p {
  font-size: 1.1rem;
}

.bio-image {
  max-width: 300px;
  padding: .25rem;
}

.footer a{
  font-size:.5rem;
  line-height: .5rem;
}

.footer a.social {
  font-size:.6rem;
  line-height: .6rem;
}

.copyright {
  padding-top: 0;
  font-size:.5rem;
}
}