/* CSS Document */
html, body { width:100%; height:100%; margin:0px; padding:0px;}
/* GENERAL STYLE */
#homepage {width:100%; height:100%; position: absolute; margin:0px; padding:0px; z-index:3!important;}
#biography {width:100%; height:100%; position:relative; margin:0px; padding:0px;}
#showreel {width:100%; height:100%; position:relative; margin:0px; padding:0px;}
#contactus {width:100%; height:100%; background:#FFF; position:relative; margin:0px; padding:0px; background:url(../images/back-contactus.jpg) no-repeat bottom}
#light {width:100%; height:100%;margin:0px; padding:0px; z-index:-1; overflow: hidden;background-image: url(../images/light.png);background-position:center;	background-repeat: no-repeat;background-color:#95979A;}
#menu-bar { width:100%; height:100px; position: fixed; background-color:#716855; z-index:10; top:0px; font-family: "adobe-garamond-pro"; font-style:italic; font-size:20px;opacity: 0.7; filter: alpha(opacity=70);}
.background-gold { background:#716855;}
.background-black { background:black;}
/* HEADER */
#language { width:26px; height:26px;  position:absolute; right:10px; top:10px; text-align:center; }
#language a { color:white;font-family: "brandon-grotesque"; font-size:12px; text-decoration:none; font-style:normal; }
.logo { width:320px; height:75px; position:absolute; margin-left:50%; left:-160px; top:13px;}
.menu-left ul { width:310px; height:40px; display:block; margin:0; padding:0; position:absolute; top:47px; margin-left:50%; left:-470px;}
.menu-left ul li { display:inline-block; float:left; margin: 0; padding: 0 35px;}
.menu-left ul li:first-child { border-right:1px dotted white;}
.menu-left ul li a { color:white; text-decoration:none;}
.menu-right ul { width:300px; height:40px; display:block; margin:0; padding:0; position:absolute; top:47px; margin-right:50%; right:-470px;}
.menu-right ul li { display:inline-block; float:left; margin: 0; padding: 0 35px;}
.menu-right ul li:first-child { border-right:1px dotted white;}
.menu-right ul li a { color:white; text-decoration:none;}
.page-title { width:380px; height:100px; position:absolute; margin-left:50%; left:-190px; top:160px;}
.slogan { position:absolute; left:50%; top:50%; margin-left:-105px; margin-top:-25px; font-family: "brandon-grotesque"; font-size:20px; border:2px solid black; padding:10px 40px; z-index:10;}
/* BIOGRAPHY */
.biography-text { color:white; font-size:14px;  position:absolute; width:900px; top:50%; margin-top:-40px; margin-left:50%; left:-450px; padding-right:20px; font-family: "brandon-grotesque"; text-shadow: 0px 0px 10px #000000;}
#style-4::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #716855;}
#style-4::-webkit-scrollbar{width: 10px;background-color: #716855;}
#style-4::-webkit-scrollbar-thumb{	background-color: #000000;border: 1px solid #fff;}
/* SHOWREEL */
#arrow-left { position: absolute; top:50%; margin-top: 70px; margin-left: 50%; left:-400px; }
#arrow-right { position: absolute; top:50%; margin-top: 70px; margin-left: 50%; left:280px;}
#video-area { width:568px; height:323px; background:#716855; padding:8px 0 0 8px; position:absolute; margin-left:50%; left:-285px; top:50%; margin-top:-40px;}
/* CONTACT US */
.contactus-text { font-size:14px;  position:absolute; width:460px; top:260px; margin-left:50%; left:-100px; padding-right:20px; font-family: "brandon-grotesque"; }
.contactus-text a { text-decoration:none; color:black;}
.contactus-text a:hover { text-decoration:underline;}
#footer { width:100%; height:100px; background:black; position:absolute; bottom:0px;}
#facebook { margin-left:50%; left:-480px; top:0px; position:absolute;}
#twitter { margin-left:50%; left:-436px; top:0px; position:absolute;}
#instagram { margin-left:50%; left:-392px; top:0px; position:absolute;}
#youtube { margin-left:50%; left:-348px; top:0px; position:absolute;}
#cag {margin-left:50%; left:380px; bottom:10px; position:absolute;}
#copyright{margin-left:50%; left:-480px; bottom:15px; position:absolute; color:#FFF;font-family: "brandon-grotesque"; font-size:12px;}
@media only screen and (max-width: 768px) {
    .biography-text { color:white; font-size:13px;  position:absolute; width:320px; top:40%; margin-top:-40px; margin-left:50%; left:-160px; padding-right:20px; font-family: "brandon-grotesque"; text-shadow: 0px 0px 10px #000000;}
}