
/* =======================

    Responsive Overwrites

   ======================= */

div.featured-film-content, .page-link-container, h2, p, div.cols-container, div {
    /*
    mike - this might be causing the flickering
	-webkit-transition: all 0.25s;
	-moz-transition: all 0.25s;
	-o-transition: all 0.25s;
	-ms-transition: all 0.25s;
	transition: all 0.25s;
    */
}

#mobile-header {
	display:none;
}



@media screen and ( max-width : 900px ) {

  header nav {
    margin-right:20px;
    width:auto !important;
  }
  header a#header-logo {
    margin-left:20px !important;
  }

  /* Shift things over */
  div.featured-film-content,
  .page-link-container,
  h2 {
    left: 20px !important;
  }
	div.featured-film-content {
		top:40px;
	}
  div.featured-film-content h2 {
    left:0 !important;
  }
  h2 {
    margin-left:0;
  }

  div.cols-container {
    width: 100% !important;
  }
  div.cols-container div {
    width:auto;
  }
  div.cols-container div p {
    font-size:14px;
  }

  #login-form {
    left: 20px !important;
  }

	.page-link.v2 {
    margin-top: 37px;
	}

	div.info-container {
		max-width: 90%;
		box-sizing: border-box;
		z-index: 99;
		background: #000;
		padding-right: 10px;
	}
	div.info-container p {
		font-size:14px;
	}

	section.ourfilms #ourfilms-content {
	  vertical-align: top;
		padding-top:20px;
	}


}

/* Film Pages */
@media screen and ( max-width : 960px ) {

  #page-wrapper {

  }
  
  
    .col-full,
    .singleimage > img {
        width:90%;
        padding:0 5%;
        height:auto;
    }

  #page-wrapper h1,
  #page-wrapper section.top h2,
  #page-wrapper section.top h3 {
    width:86%;
    position:relative;
    margin-top:40px;
    top:auto;
    right:auto;
    bottom:auto;
    left:20px;
  }
  a.scrolldown {
    margin-left:20px;
    margin-bottom:20px;
  }
  #page-wrapper section.top h3 {
      margin-top:20px !important;
  }
  #page-wrapper h1 img {
    width:100%;
    display:block;
  }
  #page-wrapper section.top h1 span {
    height:auto;
    bottom:-10px;
  }

  div.col {
    width:90% !important;
    margin:0 5% !important;
    float:none !important;
    padding-bottom:0 !important;
  }
  div.col > .thumbs img:first-child {
      float:none;
  }

  a.mov-link {
    right: 18px;
    top: 11px;
  }

  div.lower-content-container {
    width: 100% !important;
    min-width:0 !important;
  }
  div.cols-container {
    width:50%;
    margin:20px !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  



}

@media screen and ( max-width : 1024px ) {

  /*
  #team-container {
    overflow:hidden;
    height:auto !important;
  }
  div.quart {
    position:relative !important;
    height:auto !important;
    width:100% !important;

    overflow:hidden;
  }
  div.quart img {
    width:100%;
    display:block;
  }
  div.team-info-container {
    bottom:50px;
  }
  */


  h2 span.beneath {
    top: 38px !important;
  }
  #login-form {
    top: 64px;
    width: 100%;
    right: 0;
    left: 120px;
  }

  #login-form div {
    position: relative;
    float: none;
    width: auto;
    margin-top:18px;
  }
  #login-form input[type="submit"] {
    float:left;
  }

  section.contact {
    overflow: hidden;
  }

  section.contact h2 {
    width:100% !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    left:0;
    padding:0 !important;
  }

}



@media screen and ( max-width : 740px ) {

  div.quart {
 
  }

  div.cols-container div {
    width:auto;
  }
  div.cols-container div p {
    font-size:14px;
  }

}


@media screen and ( max-width : 640px ) {

  header {
    display:none;
  }
	#mobile-header {
		display:block;
	}

  div.featured-film-content h3 {
    height: auto !important;
    width: 85% !important;
  }
  h2 {
    margin-left:0;
		width: 80%;
    padding:0 0px 0 0 !important;
    font-size:20px;
    line-height:normal

  }
  h2 span {
    top:-16px !important;
  }

  div.cols-container {
    width:100%;
    margin:20px !important;
  }
  div.cols-container div {
    width:auto;
    float:none;
  }

  div.logo-container {
    width:100%;
    position:relative;
  }
  img.logo {
    margin:0 0 0 13%;
    width:74%;
    display:block;
  }

  .lower-content-container {
    min-width:0 !important;
    width:100%;
  }

	#fp-nav.right {
	    right: 0px !important;
	}

	.fp-tableCell {
			vertical-align:top !important;
			padding-top:40px;
	}

	section.home .fp-tableCell {
		vertical-align:middle !important; /* v center logo */
	}


	body {
		overflow-x: hidden !important;
		width: 100% !important;
	}



    section.ourpeople,
	section.ourpeople .fp-tableCell {
		height:auto !important;
		padding-top:0 !important;
	}

	div.team-info-container {
	   bottom: 10px !important;
		left:10px !important;
	}
	div.team-info-container h4 {
			font-size:12px;
			padding:0 8px;
	}
	div.team-info-container a.linkedin {
		margin-right: 30px;
	}
    
    #team-container {
        height:auto!important;
        position:relative!important;
    }
    
    div.quart {
        position:relative!important;
        height:300px!important;
        width:100%!important;
    }
    
    /* posters */
    .posters-container img {
        height:auto;
        width:100%!important;
    }
    

    #ourfilms-content div.page-link-container {
        position:relative;
        top:inherit;
        bottom:inherit;
        left:inherit;
    }
    
    div.team-info-container p {
        font-size:12px;
        line-height:14px;
        width:90%;
    }
    
    .cols-number-2 div {
        width:100%!important;
    	-webkit-column-count: 1; /* Chrome, Safari, Opera */
        -moz-column-count: 1; /* Firefox */
        column-count: 1;        
    }
    
    div.cols-container {
        margin-left:0!important;
        margin-right:0!important;
    }
    
    div.cols-container div {
        padding-right:0;
    }
    
    div.cols-container div p {
        margin-right:10px;
        margin-left:10px;
    }
    
    section.slide h2 {
        margin-top:20px;
    }
    
    section.slide {
        background-position:bottom left!important;
        background-size:cover!important;
        background-attachment:inherit!important;
    }

    .col iframe {
        width:100%!important;
        height:inherit!important;
    }
    
    a.mov-link {
        width:80%!important;
        padding:0 5%!important;
        margin:0 5%!important;
        text-align:center!important;
        right:0;
        top:0;
    }
    
    a.mov-link span {
        display:none;
    }
    
    #page-wrapper h1 {
        width:90%!important;
        margin:20px 5%!important;
        left:0;
    }
    
    .icon-text {
        display:none!important;
    }
    
    .page-link-facebook,
    .page-link-twitter {
        margin-right:10px!important;
        margin-top:37px!important;
    }
    
    body.single .page-link-facebook, .page-link-twitter {
        margin-top:10px!important;
    }
    
    .page-link {
        margin-right:10px!important;
    }
    
    video {
        display:none!important;
    }
    
    .awards-container {
        display:none;
    }
    
    #page-wrapper h1, #page-wrapper h2 {
        height:inherit!important;
    }
    
      
      #page-wrapper h1, #page-wrapper h2 {
        height:auto!important;
    }

}

@media screen and ( max-width : 950px ) {
      section.slide {
        background-position:bottom left!important;
        background-size:cover!important;
        background-attachment:inherit!important;
    }
}

@media screen and ( max-height : 720px ) {
    div.info-container {
        width:100%;        
        max-width:100%;
    }
    
    div.lower-content-container {
        min-height:inherit;
    }
}

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
  video { display:none; }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
  video { display:none; }
}