/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
body { line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

/** End Reset **/

/** Fonts **/

@font-face {
	font-family: proximanova;
	src: url(../fonts/ProximaNova-Regular.otf);
	}
	
@font-face {
	font-family: proximanovalt;
	src: url(../fonts/ProximaNova-Light.otf);
	}
	
/** Stylesheet **/

html, body {
    height: 100%;
    position: relative;
    width: 100%;
}
section { overflow-x: hidden; position: relative; width: 100%; text-align: center; }
p { font-family: georgia, serif; font-size: 18px; color: #444; line-height: 36px; }
a { font-family: georgia, serif; font-size: 18px; color: #444; line-height: 36px; text-decoration: none; }
h1 { font-family: proximanovalt, arial, sans-serif; color: #fff; font-size: 16px; letter-spacing: 4px; font-weight: lighter;text-transform:uppercase;}
h2 { font-family: proximanovalt, arial, sans-serif; color: #444; font-size: 40px; font-weight: lighter; letter-spacing: 4px; line-height: 54px; }
h3 { font-family: proximanovalt, arial, sans-serif; color: #545454; font-size: 32px; font-weight: lighter; letter-spacing: 15px; }
ul li { list-style: none; }

.container { margin-left: auto; margin-right: auto; }
.section-background { background-size: cover, auto; }
#navarea0 { height: 100%; }
#section1 { background-position: 50% 100%; height: 100%; position: relative; padding: 100px 0; }
#section1 .container { height: 100%; width: 1000px; }
#section1 .container > div { height: 100%; width: 100%; display: table; }
#section1 .container > div > div { display: table-cell; vertical-align: middle; }
#section1 .content { text-align: center; }
#section1 .content h1 { margin: 20px 0 0; }

#section2 { height: 100%; position: relative; margin-top: -26px; }
#section2 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section2 .container > div { height: 100%; width: 100%; }
#section2 .container > div > div { width: 1100px; }
#section2 .content { text-align: left; margin: 55px auto 99px auto; }

#section3 { height: 100%; position: relative; background-position: 50% 45%; }
#section3 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section3 .container > div { height: 100%; width: 100%; }
#section3 .container > div > div { width: 1031px; }
#section3 .content { text-align: center; margin: 200px auto 200px auto; }

#section4 { height: 100%; position: relative; margin-top: -26px; }
#section4 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section4 .container > div { height: 100%; width: 100%; }
#section4 .container > div > div { width: 1100px; }
#section4 .content { text-align: left; margin: 55px auto 99px auto; }

#section5 { height: 100%; position: relative; background-position: 50% 68%; margin-top: -26px; }
#section5 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section5 .container > div { height: 100%; width: 100%; }
#section5 .container > div > div { width: 1031px; }
#section5 .content { text-align: center; margin: 250px auto 250px auto; }

#section6 { height: 100%; position: relative; margin-top: -26px; }
#section6 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section6 .container > div { height: 100%; width: 100%; }
#section6 .container > div > div { width: 1100px; }
#section6 .content { text-align: left; margin: 55px auto 99px auto; }

#section7 { height: 100%; position: relative; background-color: #FFF; }
#section7 .container { height: 100%; margin-right: auto; margin-left: auto; }
#section7 .container > div { height: 100%; width: 100%; }
#section7 .container > div > div { width: 1100px; }
#section7 .content { text-align: center; margin: 55px auto 160px auto; }

.bottom_border { background-image: url(../img/section_bottom.png); background-position: center bottom; position: absolute; width: 100%; height: 35px;  bottom: 0; }
.top_border { background-image: url(../img/section_top.png); background-position: center center; height: 35px; }
a.scroll-down { text-shadow: none; background-color: transparent; border: 0; bottom: 0; color: white; height: 85px; left: 50%; margin-left: -40px; position: absolute; width: 80px; z-index: 9; }
.scroll-down-top { bottom: auto; top: 0; }
.headline { margin-bottom: 50px; background: url(../img/dot_border.gif) bottom left repeat-x; }
.borderimgsmall { margin-top: 20px; margin-bottom: 10px; }
.pfloat1 { float: left; margin-right: 100px; width: 500px;}
.pfloat2 { float: left; width: 500px; }
.movie { font-size: 22px; line-height: 26px; }
.role { font-size: 18px; font-style: italic; line-height: 26px; }
.footerp { font-size: 14px; font-style: italic; line-height: 18px; }
.footer { width: 1095px; margin: 65px auto 0px auto; }
.emaild { width: 300px; float: left; text-align: center; margin-right: 47px; }
.locationd { width: 300px; float: left; text-align: center; margin-left: 48px; margin-right: 47px; }
.phoned { width: 300px; float: left; text-align: center; margin-left: 48px; }
.emailogo { margin-bottom: 23px; }
.loclogo { margin-bottom: 15px; }
.phonelogo { margin-bottom: 13px; }
.ftp { line-height: 24px; }
.films1 { float: left; width: 500px; margin-right: 100px; }
.films2 { float: left; width: 500px; }
.filmtable { width: 100%; }
.filmtable tr td { padding: 0 0 30px 0; }
.lefttd { width: 80%; text-align: left; }
.righttd { width: 20%; text-align: right; }
/**
.left1 { float: left; }
.right1 { float: right; text-align: right; }
.left2 { float: left; }
.right2 { float: right; text-align: right; }
**/
.clearfix { content: ''; display: block; clear: both; }

nav { position: fixed; top: 45%; left: 95%; z-index: 999; text-align: center; }
/*nav li a { display: inline-block; width: 10px; height: 10px; background: #ccc; text-indent: -9999px; margin: 0 0 15px; border-radius: 50%; }
nav li a:hover { border: 2px solid white; }
nav li a.active { border: 2px solid white; }*/

.logo {width:400px;}

iframe {width: 100%; height:618px; margin: 50px auto 100px;}

@media (min-width: 1921px) {
	#section3 { min-height: 900px; }
	#section5 { min-height: 900px; }
}

@media (max-width: 1200px) { 
	h1 { font-size: 16px; letter-spacing: 4px;}
	h3 { text-align: center; }
	section { max-width: 1200px; }
	#section1 { height: 100%; padding: 0; }
	#section1 .container { width: 500px; }
	#section1 .container > div > div { margin-left: auto; margin-right: auto; }
	#section1 .content { margin-top: 180px; }
	#section2 { max-height: 520px; }
	#section2 .container > div > div { width: 80%; }
	#section3 { max-height: 600px; }
	#section3 .container > div > div { width: 100%; }
	#section4 .container > div > div { width: 80%; }
	#section5 { max-height: 640px; }
	#section5 .container > div > div { width: 100%; }
	#section6 .container > div > div { width: 80%; }
	#section7 .container { width: 100%; }
	#section7 .container > div > div { width: 100%; }
	.pfloat1 { width: 100%; float: none; }
	.pfloat2 { width: 100%; float: none; margin-top: 40px; margin-bottom: 40px; }
	.films1 { width: 100%; }
	.films2 { width: 100%; }
	.footerp { width: 100%; }
	.footer { width: 750px; margin: 65px auto 0px auto; }
	.emaild { width: 250px; margin-left: 0px; margin-right: 0px; }
	.locationd { width: 250px; margin-left: 0px; margin-right: 0px; }
	.phoned { width: 250px; margin-left: 0px; }
	nav { position: fixed; top: 185px; }


}

@media (max-width: 767px) {
	#section1 { height: 100%; max-height: 100%; }
	#section1 .container { width: 500px; }
	#section1 .container > div > div { width: 100% margin-left: auto; margin-right: auto; }
	#section2 { height: 100%; max-height: 100%; }
	#section5 { background-position: 20% 60%; }
	#section7 .container { width: 100%; }
	#section7 .container > div > div { width: 100%; }
	.films1 { width: 100%; }
	.films2 { width: 100%; }
	.footer { width: 90%; margin: 65px auto 0px auto; }
	.footerp { width: 80%; margin: 0 auto; }
	.emaild { width: 33%; margin-left: 0px; margin-right: 0px; }
	.locationd { width: 33%; margin-left: 0px; margin-right: 0px; }
	.phoned { width: 33%; margin-left: 0px; }
iframe {width: 700px; height:393px;margin: 50px auto 100px;}
}

@media (max-width: 700px) {
	.emaild { width: 100%; float: none; margin: 0 auto 40px auto; }
	.locationd { width: 100%; float: none; margin: 40px auto; }
	.phoned { width: 100%; float: none; margin: 40px auto 0 auto; }
iframe {width: 520px; height:292px;margin: 50px auto;}

}

@media (max-width: 520px) {
	p { font-family: georgia, serif; font-size: 16px; color: #444; line-height: 20px; }
	.pfloat1 { width: 100%; float: none; }
	.pfloat2 { width: 100%; float: none; margin-top: 20px; margin-bottom: 40px; }
	.borderimg { margin-bottom: 20px; }
	.films1 { float: none; width: 100%; margin-right: 0; }
	.films2 { float: none; width: 100%; }
	.movie { font-size: 18px; }
	.role { font-size: 14px; }
iframe {width: 400px; height:225px;margin: 50px auto;}

}

@media (max-width: 400px) {
	nav {left: 90%; top:40%;}
	nav li a {margin: 0 0 10px;}
	p {font-size: 14px;}
	#section1 { height: 100%; padding: 0; }
	#section1 .container { width: 300px !important; }
	#section1 .container > div > div { margin-left: auto; margin-right: auto; width: 300px !important; }
	#section1 .content { margin-top: 180px; }
	#section1 .content h1 { margin: 10px 0 0; }
	h1 { font-size: 12px; letter-spacing: 2px; }
	h3 { font-size: 18px; letter-spacing: 10px; }
	h2 { font-size: 24px; letter-spacing: 2px; }
	.lefttd { width: 70%; text-align: left; }
	.righttd { width: 30%; text-align: right; }
	.movie { font-size: 14px; line-height: 18px; }
	.role { font-size: 12px; font-style: italic; line-height: 18px;  }
	.dotstyle li {margin: 7px 0px; width: 12px; height: 12px; cursor: pointer;}
	.logo {width:220px;}
iframe {width: 300px; height:169px; margin: 50px auto;}

}

/* CSS for high-resolution devices */
@media only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5)  {
    /* Set the retina background */
 	.bottom_border { background-image: url(../img/section_bottom@2.png); background-size:auto 35px; }
 	.top_border { background-image: url(../img/section_top@2.png); background-size:auto 35px; }

}