@import url(http://fonts.googleapis.com/css?family=Ropa+Sans:400,400italic);
@import url(http://fonts.googleapis.com/css?family=Lato:400,300,900,700);
body{
    background-repeat:no-repeat;
    background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-color:#000;
    background-image:url(images/home_background.jpg);
    margin:0px;
    padding:0px;
    font-family: 'Ropa Sans', Arial, sans-serif;
}
body.no-background {
	background-color:#000;
	background-image:none;
}
body.contact-us {
	background-image:url(images/home_background_2.jpg);
	background-size:contain;
}
body.about {
	background-image: url("images/home_background.jpg");
}
body.movie {
	background-image: url("images/movie/background/2.jpg");
}
#container{
    width:996px;
    height:100%;
    margin: 20px auto 0px;
    max-height:900px;
}
body.index #container {
	width:100% !important;
	margin:0 auto;
}

/*Notification*/
.notification {
	padding:15px;
	color:#FFF;
	font-size:18px;
}
.notification.red {
	background-color:#A45758;
}
.notification.green {
	background-color:#32ac91;
}

/*Form Block*/
.form-block {
	max-width:40%;
}
.form-block .field {
	padding-top:5px;
}
.form-block .field label,
.form-block .field input,
.form-block .field select,
.form-block .field textarea{
	width:100%;
	box-sizing:border-box;
}
.form-block .field label {
	font-size:16px;
	color:#FFF;
}
input,select,textarea {
	border:1px solid #000;
	padding:4px 10px;
	font-size:14px;
	font-weight:300;
	font-family: "Ropa Sans",Arial,sans-serif;
	transition:all 0.2s ease-in-out 0s;
}
input:hover,select:hover,textarea:hover,
input:focus,select:focus,textarea:focus {
	border-color:#FFF;
	background-color:#bdf3e7;
}
input[type=submit] {
	font-size:16px;
	background-color:#276756;
	color:#FFF;
	border-color:#32ac91;
}
input[type=submit]:hover {
	border-color:#FFF;
	background-color:#FFF;
	color:#000;
}

/*Text*/
h1,h2,h3,h4,h5,h6,p {
	color:#FFF;
	margin:0.5em 0;
}
h1 {
	font-style:italic;
}
h2 {
	font-weight:300;
}
a,p {
	color:#FFF;
}
h1 .small {
	font-size:18px;
}
h1.light,
h2.light,
h3.light,
p.light {
	font-weight:200;
}
.hide {
	display:none;
}

/*Content Fit*/
.content-fit {
	width:100%;
}
.content-fit.v {
	height:400px;
}

/*Video Tariler*/
.video {
	padding:10px;
	background-color:rgba(0,0,0,0.8);
	border:1px solid #444;
	margin-bottom:15px;
	display:none;
}
.video iframe {
	width:100%;
	box-sizing:border-box;
}
.video h2 {
	margin-top:0;
}

/*Button*/
.button {
	border:2px solid #555;
	color:#FFF;
	padding:5px 15px;
	text-decoration:none;
	transition:all 0.2s ease-in-out 0s;
}
.button:hover {
	border-color:#FFF;
}

/*Other*/
.responsive {
	width:100%;
	vertical-align:top;
}
.nomargin {
	margin:0;
}
.nopadding {
	padding:0;
}
.text-right {
text-align:right;
}

/*Nav styles*/
#nav{
    width:100%;
	margin:0px;
	overflow:hidden;
	border-bottom:1px solid #EEE;
	padding:0 0 20px;
}
#nav .item {
	display:inline-block;
	vertical-align:bottom;
}
#nav h1{
    
    color:#ffffff;
    font-family: 'AvantGardeBkBTDemi', Arial, sans-serif;
    font-size:68px;
    letter-spacing:-3px;
    font-weight:500;
    border:none;
    margin-bottom:-5px;
	text-indent:-9999px;
	background-image:url(images/logo.png);
	background-size:contain;
	background-repeat:no-repeat;
	width:230px;
	height:250px;
	margin:0;
    background-position: bottom;
}

#page_links{
	padding-left: 10px;
}

#nav a {
    color:#ffffff;
    font-family: 'Ropa Sans', Arial, sans-serif;
    font-size:16px;
    text-decoration:none;
	font-style:italic;
	text-transform:uppercase;
}
#nav a, 
#nav a span {
	transition:all 0.2s ease-in-out 0s;
}
#nav a span {
	color:#000;
}
#nav a span.white {
	color:#FFF;
}
#nav a:hover span {
	color:#FFF;
}



/*end nav styles*/

/*page content*/

#content{
    float:left;
    width:996px;
    margin:0px;
    margin-top:-8px;
}

/*end page content*/

/*this is to make the hr on the home page sit at the bottom of the content div*/

#home_hr{
    margin-top:400px;
}

hr {
	background:none;
	border:none;
	margin:10px 0;
	border-top:1px solid #FFF;
}

/*social buttons styling*/

#social_buttons{
    float:left;
    height:20px;
    width:120px;
}

#social_buttons p{
    float:left;
    color:#ffffff;
    font-family: 'Ropa Sans', Arial, sans-serif;
    font-size:18px;
    text-decoration:none;
    margin-top:5px;
}
#icons {
    float:left;
    width: 120px;
    margin-left:69px;
    margin-top: -35px;
    
}


#fb a{
	float: left;
	display:block;
    height:27px;
    width:25px;
    margin-left:1px;
    background-image:url('images/fb_button.png');
    

}

#twitter a{
    float:left;
    display:block;
    height:27px;
    width:25px;
    margin-left: 10px;
    background-image:url('images/twitter_button.png');
    
    
   
}

/*end social buttons */


#contact a{
    float:right;
    color:#ffffff;
    font-family: 'Ropa Sans', Arial, sans-serif;
    font-size:18px;
    text-decoration:none;
    margin-top:5px;
    }
    
#footer{
   float:left;
    width:996px; 
}

#footer_credits{
    float:left;
    width:996px;
    margin-top:3px;
}
    
/*    this is styling for the transparent area on the pages*/

#transparent_area{
    
    width:996px;
    height:100%;
    max-height:400px;
    position:absolute;
    padding:0px;
    margin:0px;
    margin-top:-7px;
    background-color:black;
    filter:alpha(opacity=75);
        -moz-opacity:0.75;
        -khtml-opacity: 0.75;
        opacity: 0.75;
        z-index:-1;
}

#transparent_area_credits{
    
    width:748px;
    height:100%;
    max-height:400px;
    position:absolute;
    padding:0px;
    margin:0px;
    margin-top:-7px;
    margin-left:248px;
    background-color:black;
    filter:alpha(opacity=75);
        -moz-opacity:0.75;
        -khtml-opacity: 0.75;
        opacity: 0.75;
        z-index:-1;
}


#transparent_content{
    position:relative;
    width:665px;
    float:left;
    margin-left:297px;
    
    
}

#transparent_content p{
    color:#ffffff;
    font-family: 'Ropa Sans', Arial, sans-serif;
    font-size:13px;
    text-decoration:none;
    
    
}

#transparent_content .left_col{
    float:left;
    width:320px;
}

#transparent_content .right_col{
    float:right;
    width:320px;
    margin-left:20px;
}






/*this is for the coming soon title on the trailer page can be deleted once trailer is put up*/

.left_col h3{
    color:#ffffff;
    font-family: 'AvantGardeBkBTDemi', Arial, sans-serif;
    font-size:48px;
    letter-spacing:-2px;
    font-weight:500;
    border:none;
    margin-bottom:55px;
    text-align:center;
    margin-top:65px;
}




#trailer_image{
    margin-top:-6px;
    margin-bottom:-11px;
    margin-left:57px;
    
}

/*this is for spliting up the characters on the cast page*/

#cast_content{
    position:relative;
    width:760px;
    float:left;
    margin-left:235px;
    margin-top:-9px;
    
}

#cast_content .left_col{
    float:left;
    width:380px;
    margin:0px;
    padding:0px;
}

#cast_content .right_col{
    float:right;
    width:380px;
    margin-left:20px;
    margin:0px;
    padding:0px;
}

#cast_content p{
    color:#ffffff;
    font-family: 'Ropa Sans', Arial, sans-serif;
    font-size:13px;
    text-decoration:none;
}

.split_left{
    float:left;
    margin:0px;
    padding:0px;
    width:190px;
    
}

.spilt_right{
    float:left;
    margin:0px;
    padding:0px;
    width:190px;

}

.cast_text{
    float:left;
    width:180px;
}

/*This will style the scrollbox for the credits*/

#credits_scrollbox{
    overflow:scroll;
    overflow-x:hidden;
    height:400px;
    width:750px;
    margin:0px;
    margin-left:-52px;
    padding:0px;
    margin-top:-6px;
    border-left:2px solid white;
}

#credits_scrollbox{
    text-align:center;
}


/**/
.movie-list {
	margin:0;
	padding:40px 0;
	overflow:hidden;
}
.movie-list li {
	float:left;
	width:25%;
	padding:10px;
	box-sizing:border-box;
}
.movie-list li img {
	width:100%;
	vertical-align:top;
}
.movie-list li .movie-box {
	padding:5px;
	text-align:center;
	color:#FFF;
}
.movie-list li .movie-box a {
	text-decoration:none;
	color:#FFF;
	transition:all 0.2s ease-in-out 0s;
}
.movie-list li .movie-box h3 {
	border-top:1px solid #FFF;
	margin:10px 0 0;
	padding:10px 0;
}
.movie-list li .movie-box h3 span.subcap {
	font-size:10px;
	font-style:italic;
	font-weight:300;
}

/*Coltable*/
.coltable {
    display: table;
    width: 100%;
}
.coltable .col {
    display: table-cell;
    vertical-align: top;
}
.coltable.vmiddle > .col {
	vertical-align:middle;
}
.coltable.vmarg {
    margin: 10px 0;
}
.vmiddle,
.coltable .col.vmiddle {
	vertical-align:middle;
}
.coltable.col2 .col {
    width: 50%;
}
.coltable.col3 .col,
.coltable .col.w50 {
    width: 50%;
}
.coltable.col4 .col,
.coltable .col.w25 {
    width: 25%;
}
.coltable .col.w60 {
    width: 60%;
}
.coltable .col.w40 {
    width: 40%;
}
.coltable .col img.responsive {
	width:100%;
	max-width:100%;
}
.coltable .col.pad-left-20 {
	padding-left:20px;
}
.coltable .col.pad-right-20 {
	padding-right:20px;
}
.coltable .col.pad-right-40 {
	padding-right:40px;
}

/*Spec List*/
ul.spec-list {
	overflow:hidden;
	list-style:none;
	margin:1em 0;
	padding:0;
}
ul.spec-list li p {
	display:table-cell;
	padding:5px 0;
	font-size:14px;
}
ul.spec-list li p.value {
	width:65%;
	text-align:left;
}
ul.spec-list li p.label {
	width:35%;
	color:#999;
	font-weight:300;
	padding-right:15px;
	box-sizing:border-box;
	text-align:right;
}
ul.spec-list li {
	border-bottom:1px solid #444;
	display:table;
	width:100%;
}
ul.spec-list li.first {
	border-top:1px solid #CCC;
}

.block-contact {
    border: 1px solid #eee;
    border-radius: 20px;
    padding: 15px;
}

/*Homepage*/
.home-container {
	position:relative;
}
.home-container h2 {
	font-size:60px;
}

/*Artwork Thumb*/
.artwork {
	border:1px solid #222;
}
.artwork-parent {
}

/*About*/
.about-box{
	background-color:rgba(0,0,0,0.70); 
	padding:15px;	
}

/*Landing Buttons*/
.landing-buttons {
	text-align:center;
	top:500px;
	width:100%;
	position:absolute;
}
.landing-buttons a {
	display:inline-block;
	padding:10px 40px;
	color:#409e90;
	text-decoration:none;
	font-size:22px;
	border-radius:10px;
	transition:all 0.2s ease-in-out 0s;
	font-family:Lato,Arial,sans-serif;
	text-transform:uppercase;
	font-weight:300;
}
.landing-buttons a:hover {
	color:#FFF;
	border-color:#FFF;
}
.video-box {
	display:none;	
}
.video-static {
	display:none;
	text-align:center;
	padding:50px 50px 0;
	box-sizing:border-box;
}
.video-static img {
	width:100%;
}

@media screen and (max-width:900px) {
	#container {
		width:100% !important;
		box-sizing:border-box;
		padding:0 10px;
	}
	#content,
	#nav,
	#footer {
		width:100%;
	}
	body {
		background-size:cover;
		background-position:center;
	}
}
@media screen and (max-width:600px) {
	.form-block {
		max-width:100%;
	}
}
@media screen and (max-width:500px) {
	.video-box-desk {
		display:none !important;
	}
	.video {
		display:block !important;
	}
	.video-static {
		display:block;
	}
	.video-landing {
		display:none;
	}
	.landing-buttons {
		top:300px	
	}
}