body, html { height: 100%; width: 100vw; overflow-x:hidden; }


body {
	margin: 0 auto;
}

::-webkit-scrollbar { 
    display: none; 
}

h1,h2,h3,h4,h5,h6 {
	font-family:  'Trebuchet MS', 'Nunito Sans', sans-serif;
	color: #111;
}

p,a, td, tr, th {
	font-family: 'Nunito Sans', sans-serif;
	color: #111;
}

a {
	font-weight: 400;
}

h1 {
	font-weight: 700;
	font-size: 3em;
	line-height: 1.2em;
	letter-spacing: 0.2px;
	text-transform: capitalize;
}

h2 {
	font-weight: 700;
	font-size: 2em;
	line-height: 1.2em;
}

h3 {
	font-weight: 700;
	font-size: 1.6em;
	line-height: 1.2em;
}

h5	{
	font-size: 20px;
	line-height: 1.2em;
	font-weight: 700;
}

p, td {
	font-size: 1em;
	line-height: 1.65em;
	font-weight: 300;
	orphans: 1;
	color: #444;
}

p b {
	color: #222;
	font-weight: 700;
}

.body-p-lg { font-size: 1.15em; }
tbody { vertical-align: top; }
.bg-dark { background-color: rgb(0,0,0) !important; }
.bg-light { background-color: rgb(255,255,255) !important; }


video.background {
	width: 50% !important;
	max-width: 800px !important;
	height: auto;
	position: relative;
	background: black;
	z-index: 99;
}

.loader-spin {
	border: 16px solid #eee;
	border-top: 16px solid #fff;
	border-radius: 50%;
	width: 120px;
	height: 120px;
	position: absolute;
	top: 40%;
	left: 50%;
	z-index: 1000;
	transform: translate( -50% );
	-webkit-animation: spin 2s linear infinite;
	-ms-animation: spin 2s linear infinite;
	-o-animation: spin 2s linear infinite;
	-moz-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% {
		-moz-transform: rotate(0deg);
		-webkit-transform:rotate(0deg);
		-ms-transform:rotate(360deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-moz-transform: rotate(360deg);
		-webkit-transform:rotate(360deg);
		-ms-transform:rotate(360deg);
		-o-transform:rotate(360deg);
		transform: rotate(360deg);
	}
}

.hide {
	opacity: 0;
	-webkit-transition: all 1s linear;
	-moz-transition: all 1s linear;
	-ms-transition: all 1s linear;
	-o-transition: all 1s linear;
	transition: all 0.5s linear;
}

.show {	display: block; }

.hide-hide { display: none; }

.logo-mobile {
	display: none;
	position: relative;
	left: 50%;
	right: 50%; 
	top: 50%; 
	bottom: 50%; 
	-o-transform: translate(-50%);
	-moz-transform: translate(-50%);
	-webkit-transform: translate(-50%);
	-ms-transform: translate(-50%);
	transform: translate(-50%);
}

.sticky-navbar-padding { margin-top: 90px; }

.btn-primary {
	background-color: rgb(0,0,0);
	border-color: rgb(0,0,0);
	border-radius: 3px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.5px;
	line-height: 27px;
	text-transform: uppercase;
	height: 40px;
}

.btn-primary:hover {
	background-color: rgb(30,30,30);
	border-color: rgb(30,30,30);
	border-radius: 3px;

	-webkit-box-shadow: 0 6px 16px rgba(20,20,20,0.15);
 	-moz-box-shadow: 0 6px 16px rgba(20,20,20,0.15);
 	-ms-box-shadow: 0 6px 16px rgba(20,20,20,0.15);
 	-o-box-shadow: 0 6px 16px rgba(20,20,20,0.15);
 	box-shadow: 0 6px 16px rgba(20,20,20,0.15);
}

.btn-primary:active {
	background-color: rgb(30,30,30);
	border-color: rgb(30,30,30);
}

.btn-primary:not(:disabled):not(.disabled).active, 
.btn-primary:not(:disabled):not(.disabled):active, 
.show>.btn-primary.dropdown-toggle {
	background-color: #000;
	border-color: #000;
}

.btn-primary.focus, .btn-primary:focus {
	-webkit-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-moz-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-ms-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-o-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
}

.btn-back {
	border: 1px solid rgb(245,245,245);
	background-color: rgb(255,255,255);
	padding: 6px 12px 8px 14px;
	-webkit-transition: all 100ms ease-in-out;
	-moz-transition: all 100ms ease-in-out;
	-ms-transition: all 100ms ease-in-out;
	-o-transition: all 100ms ease-in-out;
	transition: all 100ms ease-in-out;
}

.btn-back:hover { 	background-color: rgb(245,245,245); }

.btn-back.focus, .btn-back:focus {
	-webkit-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-moz-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-ms-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	-o-box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
	box-shadow: 0 0 0 0.2rem rgba(120,120,120,.2);
}

.btn-back-wrapper {
	position: relative;
	top: 42px;
	left: 0;
}

#audio {
	position: absolute;
	right: 14px;
	bottom: 16px;
	height: 40px;
	width: 40px;
	border: none;
	color: white;
	background: none;
	border-radius: 2px;
	z-index: 1050;
	opacity: 0.8;
	cursor: pointer;
}

#audio:hover { 	opacity: 1; }

#audio:focus {
	border:none;
	outline: none;
}

.play {
	height: 32px;
	width: 32px;
	background-image: url("../images/assets/mute.svg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.play-icon {
	height: 80px;
	width: 80px;
	background-image: url("../images/assets/play-video.svg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	transform: translate(-50%, 0);
}

.mute {
	height: 32px;
	width: 32px;
	background-image: url("../images/assets/volume.svg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#play-video {
	display: none;
	position: absolute;
	left: 50%;
	top: 35%;
	height: 100px;
	width: 100px;
	border: none;
	background: none;
	z-index: 6;
	opacity: 0.8;
	cursor: pointer;
	padding: 0;
}

#play-video img {
	height: 99px;
	width: 99px;
}

#play-video:focus,
.navbar-toggler {
	outline: none !important;
}

.about-padding {
	position: relative;
	height: 50vh;
}

.about-container h1 {
	margin-top: 100px;
}

.about-container .row {
	margin-top: 80px;
	margin-bottom: 20px;
}

.about-logo {
	position: relative;
	width: 60%;
	height: auto;
	max-height: 50%;
	max-width: 554px;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -60%);
	-moz-transform: translate(-50%, -60%);
	-ms-transform: translate(-50%, -60%);
	-o-transform: translate(-50%, -60%);
	transform: translate(-50%, -60%);
}

.img-full-width {
	width: 100%;
	height: auto;
}

.justify-content-center h1 { text-align: center; }


/*********************************************************************

film strips

*********************************************************************/
.img_highres {
	display: none;
}

#feature-1 { background-image: url("../images/films/feature-01.jpg"); }
#feature-2  { background-image: url("../images/films/feature-02.jpg"); }
#feature-3 { background-image: url("../images/films/feature-03.jpg"); }

#short-1 { background-image: url("../images/films/short-01.jpg"); }
#short-2 { background-image: url("../images/films/short-02.jpg"); }
#short-3 { background-image: url("../images/films/short-03.jpg"); }

#feature-1, #feature-2, #short-1  {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

#feature-3, #short-3 {
	background-size: cover;
	background-position: 50% 25%;
}

#short-2{
	background-size: cover;
	background-position: 50% 5%;
}

.movie-strip-wrapper {
	height: 83%;
	height: calc(100% - 162px);
	transition: all 200ms linear;
	-webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-ms-transition: all 200ms linear;
	-o-transition: all 200ms linear;
}

.movie-strip {
	height: 33.33%;
	height: calc(100% / 3);
	width: 100%;
	text-align: center;
	z-index: 1;
	opacity: 0.9;
	text-decoration: none !important;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.movie-strip div {
	height: 100%;
	width: 100%;
	text-align: center;
	align-content: center;
	opacity: 1;

}

.movie-strip h2, .movie-strip h3, .movie-strip h4 {
	font-size: 16px;
	align-content: center;
	margin: auto;
	color: #fff;
	letter-spacing: 0.5px;
	text-transform: capitalize;
	font-weight: 400;
}

/**********************************************

short and feature hover underline

***********************************************/
.hover-underline h3:after {
	background-color: white;
	position: relative;
	display: block;
	top: 8px;
	left: 50%;
	content: '';
	width: 0;
	height: 2px;
	opacity: 0;
	-o-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	-o-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.movie-strip:hover h3::after {	opacity: 1; }


.movie-strip:hover h3::after,
.movie-strip:focus h3::after {
	opacity: 1;
	width: 100%;
}



/*********************************************************************

navbar

*********************************************************************/

.navbar {
	padding-top: 5px;
	padding-bottom: 5px;
	z-index: 99999 !important;
}

.auto-width {
    display: block;
    position: relative;
    width:17%;
    height:60px;
    padding:10px 10px;
	float: none;
}

.auto-width-logo {
    display:block;
    width:32%;
    height:80px;
}

.navbar-brand {
    padding:2px 15%;
    margin-right: 0;
}


/*////////////////////////////////////////////////////////////////*/

.nav-link {
	font-size: 13px;
	line-height: 24px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: #fff !important;
	text-decoration: none;
	font-family: 'Trebuchet MS', sans-serif;
	opacity: 0.8;
	margin: auto;	
}

.navbar-toggler {
	padding: .25rem .25rem;
	color: rgb(245,245,245);
	color: rgba(255,255,255,0.8);
}

.auto-width a::after {
	background: #fff;
	position: absolute;
	top: 100%;
	left: 50%;
	content: '';
	width: 0;
	height: 2px;
	-o-transform: translateY(13px) translateX(-50%);
	-ms-transform: translateY(13px) translateX(-50%);
	-moz-transform: translateY(13px) translateX(-50%);
	-webkit-transform: translateY(13px) translateX(-50%);
	transform: translateY(13px) translateX(-50%);
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}


.auto-width a:hover { opacity: 1; }

.auto-width > a:hover::after,
.auto-width > a:focus::after {
	opacity: 1;
	width: 80%;
}



.nav-effect a {
	position: relative;
	display: inline;
	height: 24px;
	margin: auto;
	padding: 2px 8px;
	font-size: 16px;
}

.nav-effect a::after {
	background: white;
	position: absolute;
	top: 100%;
	left: 50%;
	content: '';
	width: 0;
	height: 2px;
	-o-transform: translateY(11.5px) translateX(-50%);
	-moz-transform: translateY(11.5px) translateX(-50%);
	-webkit-transform: translateY(11.5px) translateX(-50%);
	transform: translateY(11.5px) translateX(-50%);	
	-o-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.nav-effect a:hover { opacity: 1; }

.nav-effect > a:hover::after,
.nav-effect > a:focus::after {
	opacity: 1;
	width: 100%;
}


.nav-link-active { border-bottom: 2px solid #fff; }


.logo-mobile img {
	height: 60px;
	width: auto;
}
	
.logo-desktop img {
	height: 70px;
	width: auto;
	margin: 3px 0;
	opacity: 0.9;
}

.logo-desktop:hover img { opacity: 1; }

/*********************************************************************

Landing

*********************************************************************/
/*video*/

.loading-background {
	background-color: #000;
	height: 100%;
	width: 100%;
	background-image: url("../images/assets/loading.gif");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 80px;
}

.video_contain {
	position: absolute;
  	/*z-index: -1;*/
  	top: 0;
  	left: 0;
  	bottom: 0;
  	right: 0;
  	padding: 0;
  	overflow: hidden;
  	background-size: cover;
  	background-repeat: no-repeat;
  	background-position: 50% 50%;
  	background-image: none;
}

#myVideo {
	margin: auto;
  	position: absolute;
  	/*z-index: -1;*/
  	top: 50%;
  	left: 50%;
  	visibility: visible;
  	width: 100%;
  	height: auto;
  	-webkit-transform: translate(-50%, -50%);
  	-moz-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	-o-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
}


.img-video-fallback {
	width: 100%;
	height: auto;
	max-height: 100%;
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: -9000;
}




/*********************************************************************

About page

*********************************************************************/
.about-list {
	list-style: none;
	padding: 0;
}

.about-list li {
	display: block;
	padding-left: 0;
	margin: 8px 0;
}

.slate-list li {
	margin: 16px 0;
}


/*********************************************************************

Footer

*********************************************************************/

footer {
	z-index: 1;
	background-color: #000;
	padding: 4px 15px;
}

footer .row {
	display: flex;
	align-items: center;
	padding: 18px 0;
}

footer p, footer a {
	font-weight: 300;
	letter-spacing: 0.5px;
	color: #fff;
	font-size: 16px;
	line-height: 18px;
	font-style: italic;
	margin-bottom: 0;
}

footer ul {
	list-style: none;
	display: inline;
	text-align: right;
	width: 100%;
	padding: 0;
	margin-bottom: 0;
}

footer li {	display: inline; }

footer img {
	width: 22px;
	height: 26px;
	margin: 0 8px;
	opacity: 0.8;
	padding: 2px;
}

footer img:hover {
	opacity: 1;
}

.footer-social-links{
	display: flex;
	color: #fff;
}

footer a {
	color: #fff;
	text-decoration: none;
	position: relative;
	right: 0;
}

footer a:hover {
	color: #fff;
	text-decoration: none;
}

.footer-email {
	float: right;
	width: auto;
	height: auto;
	max-width: 206px;
	margin: 0 auto;
}


.footer-email a::after {
	background: white;
	position: absolute;
	top: 100%;
	left: 50%;
	content: '';
	width: 0;
	height: 2px;
	opacity: 0;
	-o-transform: translateY(2px) translateX(-50%);
	-ms-transform: translateY(2px) translateX(-50%);
	-moz-transform: translateY(2px) translateX(-50%);
	-webkit-transform: translateY(2px) translateX(-50%);
	-o-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}

.footer-email  a:hover::after {
	opacity: 1;
	width: 100%;
}


.footer-email > div {
	margin: auto;
	text-align: right;
}

/*********************************************************************

directors

*********************************************************************/

.dir-hover-effect {
	position: absolute;
	top: 0;
	left: 0;
	padding: 15px;
	height: 100%;
	width: 100%;
}

.director-container {
  position: relative;
  width: 100%;
  height: auto;
  margin-top: 30px;
}


.director-image {
	width: 100%;
	height: auto;
	vertical-align: middle;
	border-style: none;
}

.middle {
	opacity: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-o-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-o-transition: 300ms ease;
	-moz-transition: 300ms ease;
	-ms-transition: 300ms ease;
	-webkit-transition: 300ms ease;
	transition: 300ms ease;
}

.director-overlay {
  	position: absolute;
  	padding: 15px;
  	top: 0;
  	bottom: 0;
  	left: 0;
  	right: 0;
  	height: 100%;
  	width: 100%;
  	opacity: 0;
  	display: block;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.75);	
	-o-transition: .5s ease;
	-moz-transition: .5s ease;
	-ms-transition: .5s ease;
	-webkit-transition: .5s ease;
	transition: .5s ease;
}

.director-imdb {
	opacity: 0.9;
	height: 40px;
	width:	auto; 
}

.director-imdb:hover {
	opacity: 1;
}

.director-container:hover .director-overlay {
	opacity: 1;
}

.shadow-hover-effect:hover .director-overlay {

	-webkit-box-shadow: 0 8px 32px rgba(20,20,20,0.2);
 	-moz-box-shadow: 0 8px 32px rgba(20,20,20,0.2);
 	-ms-box-shadow: 0 8px 32px rgba(20,20,20,0.2);
 	-o-box-shadow: 0 8px 32px rgba(20,20,20,0.2);
 	box-shadow: 0 8px 32px rgba(20,20,20,0.2);


	-webkit-transition:all 300ms ease-in-out;
	-moz-transition:all 300ms ease-in-out;
	-ms-transition:all 300ms ease-in-out;
	-o-transition:all 300ms ease-in-out;
	transition:all 300ms ease-in-out; 

}

.desktop-dir-links {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  
  
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.desktop-dir-links a {
	color: #fff;
	min-width: 110px;
}

.desktop-dir-links h4 {
	color: #fff;
	font-size: 20px;
	line-height: 20px;
	letter-spacing: 0.5px;
	padding-top: 12px;
	text-transform: uppercase;
}

.hover-split {
	margin: 0 48px;
	height: 80px;
	width: 2px;
	background-color: #fff;
}


.dir-bio {
	margin-top: 30px;
	margin-bottom: 30px;
}

/*.dir-bio a { font-weight: 400; }*/
.dir-bio a:hover, .dir-bio a:visited { color: #111; }

.mobile-dir-links { display: none !important; }
.director-wrapper { margin-bottom: 8px; }
.about-container .dir-bio { margin-top: 0; }


/*********************************************************************

film page

*********************************************************************/

.about-header-img { 	min-height: 216px; }

.about-header-img .img-fluid {
	width: auto;
	height: 100%;
}

.masthead {
	height: 50%;
	max-height: 600px;
	width: 100%;
}

.masthead-about {
	position: relative;
	height: 50%;
}

.masthead-about .about-logo { 	position: absolute; }

.masthead-video {
	width: 100%;
	height: 69%;
	height: calc(100% - 76px);
}

.masthead-video iframe {
	width: 100%;
	height: 100%;
	background-color: #000;
}

.synopsis-container h2 { text-transform: capitalize; }

.synopsis-container {
	margin-top:30px; 
	margin-bottom: 80px;
}

.synopsis-table { margin-top: 32px; }
.short-table { margin-top: 0; }

.synopsis-table td{
	line-height: 1.6em;
	padding-top: 4px;
	padding-bottom: 4px;
}

.synopsis-table td:nth-child(1) {
	font-family:  'Trebuchet MS', 'Nunito Sans', sans-serif;
	font-weight: 700;
	padding-right: 16px;
	color: #111;
}

.synopsis-container h5 {
	margin-top: 50px;
	margin-bottom: 16px;
}

.short-poster-wrapper { padding-top: 50px; }

.img-imdb {
	height: 30px;
	width: auto; 
}

.short-poster-wrapper .img-imdb { margin-top: 16px; }
.short-poster-wrapper .img-imdb:hover { opacity: .85; }



/*********************************************************************

decoration

*********************************************************************/

.hover-shadow {
	-webkit-box-shadow: 0 0 0 rgb(0,0,0);
 	-moz-box-shadow: 0 0 0 rgb(0,0,0);
 	-ms-box-shadow: 0 0 0 rgb(0,0,0);
 	-o-box-shadow: 0 0 0 rgb(0,0,0);
 	box-shadow: 0 0 0 rgb(0,0,0);
	-webkit-transition:all 300ms ease-in-out;
	-moz-transition:all 300ms ease-in-out;
	-ms-transition:all 300ms ease-in-out;
	-o-transition:all 300ms ease-in-out;
	transition:all 300ms ease-in-out; 
}

.hover-shadow:hover {

	-webkit-box-shadow: 0 12px 32px rgba(20,20,20,0.15);
 	-moz-box-shadow: 0 12px 32px rgba(20,20,20,0.15);
 	-ms-box-shadow: 0 12px 32px rgba(20,20,20,0.15);
 	-o-box-shadow: 0 12px 32px rgba(20,20,20,0.15);
 	box-shadow: 0 12px 32px rgba(20,20,20,0.15);
	-webkit-transition:all 300ms ease-in-out;
	-moz-transition:all 300ms ease-in-out;
	-ms-transition:all 300ms ease-in-out;
	-o-transition:all 300ms ease-in-out;
	transition:all 300ms ease-in-out; 
}



#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {  background-color: #555; }


/*********************************************************************

Media Queries

*********************************************************************/
@media screen and (max-width: 1199px) {
	.navbar-brand {
		padding: 2px 10%;
	}

}

@media screen and (max-width: 992px) {

	#play-video { display: block; }
	.nav-effect a { font-size: 1.1em; }
	.logo-mobile{ display: block; }	
	.auto-width-logo { display: none; }
	.mobile-dir-links { display: flex !important; }
	.sticky-navbar-padding { margin-top: 76px; }
	.footer-social-links { padding-top: 16px; }

	.navbar {
		padding-top: 8px;
		padding-bottom: 8px;
	}
		
	/*hide desktop center logo and reveal mobile logo*/

	footer p {
		text-align: center;
		line-height: 1.6em;
		float: none;
	}

	footer ul { text-align: center; }

	.footer-email {
		border-top: 1px solid white;
    	max-width: 346px;
    	margin: auto;
    	text-align: center;
    	padding-top: 16px;
	}

	.movie-strip-wrapper {
		height: 83%;
		height: calc(100% - 76px);
		-webkit-transition: all 200ms linear;
		-moz-transition: all 200ms linear;
		-ms-transition: all 200ms linear;
		-o-transition: all 200ms linear;
		transition: all 200ms linear;
	}

	.director-padding { padding: 15px 0; }
	.director-image { width: 100%; }
	.director-imdb {
		position: relative;
		fill: #000;
	}

	.dir-bio { margin-bottom: 40px; }
	.director-wrapper { margin-bottom: 32px; }
	.director-overlay { display: none; }
	.masthead { max-height: 400px; }
	.synopsis-container{ margin-top: 32px; }
	.synopsis-container h2 { margin-bottom: 20px;  }
	.btn-back-wrapper {	top: -10px;	}
	.btn-back { padding: 2px 20px 4px 20px; }
	.about-container h1 { margin-top: 40px;	}
	.about-container .row {	margin-top: 40px;}

	.about-container h3 {
		margin-bottom: 16px;
		margin-top: 16px;
	}

	.about-container .dir-bio {	margin-top: 30px; }
	.short-table {	margin-top: 24px;	}
	.masthead-video {	height: 32%;	}
	.footer-email > div {	text-align: center;	}
	.auto-width a::after {	display: none;	}

	.auto-width {
		width: 100%;
		margin: 28px 0;
	}

	#audio { 
		width: 50px;
		right: 8px;
	}

	#loading {
		background-size: 70%;
	}

}

@media screen and (max-width: 576px) {
	.masthead { max-height: 260px; 	}
	h1 { font-size: 2.3em; }
	h2 { font-size: 2em; }
	.director-container { width: auto;	}
	.dir-bio { margin-bottom: 0;	}
	.shadow-hover-effect:hover .director-overlay { display: none; }

	#myVideo {
		width: auto;
		height: 40%;
		
		-webkit-transform: translate(-50%, -65%);
		-moz-transform: translate(-50%, -65%);
		-ms-transform: translate(-50%, -65%);
		-o-transform: translate(-50%, -65%);
		transform: translate(-50%, -65%);
	}	

	.about-container h3 {
		margin-top: 0;
		margin-bottom: 16px;
	
	}
}

@media screen and (max-width: 480px) {
	.movie-strip h3, .movie-strip h2 { max-width: 300px; }
}

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

	#feature-1 { background-image: url("../images/films/feature-01@2x.jpg"); }
	#feature-2 { background-image: url("../images/films/feature-02@2x.jpg"); }
	#feature-3 { background-image: url("../images/films/feature-03@2x.jpg"); }

	#short-1 { background-image: url("../images/films/short-01@2x.jpg"); }
	#short-2 { background-image: url("../images/films/short-02@2x.jpg"); }
	#short-3 { background-image: url("../images/films/short-03@2x.jpg"); }

}