/************************************************************************************
smaller than 1500
*************************************************************************************/

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

/**** END 1500 ****/

/************************************************************************************
smaller than 1280
*************************************************************************************/

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


}

/**** END 1280 ****/

/************************************************************************************
smaller than 1180
*************************************************************************************/

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



}

/**** END 1180 ****/

/************************************************************************************
smaller than 1024
*************************************************************************************/

@media screen and (max-width: 1024px) {
	
	
/*** Menu ***/
#menu {
height: 85px;
}



a.menu-burger {
display: inline-block;
}


#menu-nav ul {
z-index: 9999;
position: fixed;
top: 0;
left: 0;
width: 100%;
background: #000;
padding: 0;
display: none;
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.45);
box-shadow: 0 5px 10px rgba(0,0,0,0.45);
}

#menu-nav ul li {
width: 100%;
display: block;
text-align: left;
border-top: 1px solid rgba(255,255,255,0.10);
}

#menu-nav ul li a,#menu-nav ul li span {
padding: 0.75em;
}

#menu-nav ul li a:hover {
background: rgba(255,255,255,0.1);
}

#menu-social a {
font-size: 0.80em;
}
	
	
	.column-third {
		width: 48%;
	}

	
/** Home Slider **/
#home-header {
height: auto;
background: #000 url(../images/fof-home-slider-bg-mobile.jpg) no-repeat center top;
background-size: auto;
	padding: 75px 15px;
}
	
	.home-left {
		display: none;
	}

#home-header .column-half {
width: 100%;
	margin: auto;
}
	
	.synopsis-column-1 {
		width: 33%;
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 auto;
		        flex: 0 0 auto;
	}
	
	.synopsis-column-2 {
		width: 67%;
        -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
                flex: 1 0 auto;
	}
	
	#stills,
	#resources,
	#cast {
			padding: 75px 20px;
	}
	
	
	.cast-container {
	width: 100%;
	margin: 25px auto;
}
	
	



	

} /**** END 1024 ****/

/************************************************************************************
smaller than 900
*************************************************************************************/

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

#resources .column-half {
		width: 100%;
		margin: 15px auto 30px auto;
	display: block;
	}
	
/** Resources **/
	#resources {
background: #000 url(../images/bg-resources-mobile.jpg) no-repeat center top;
background-size: auto;
}
	
	
	#quote {
	font-size: 28px;
	padding: 75px;
		background: #000 url(../images/bg-resources-mobile.jpg) no-repeat center center;
	background-size: auto;
}

#quote span {
	font-size: 19px;
}


	
}

/**** END 900 ****/

/************************************************************************************
smaller than 768
*************************************************************************************/

@media screen and (max-width: 768px) {
	.license-column-left,
	.license-column-right {
		width: 100%;
		margin: 10px auto;
	}
	
#synopsis {
	display: block;
}
	
	.synopsis-column-1 {
		width: 100%;
		display: block;
		height: 300px;
		margin: 0 auto;
	}
	
	.synopsis-column-2 {
		width: 100%;
		display: block;
       margin: 0 auto;
		height: auto;
	}
	
	.padit60 {
		padding: 40px 30px;
	}
	
	#updates {
		padding: 3em 1.5em;
	}
	
	
	
	
	.cast-container {
		display: block;
		margin: 10px auto 40px auto;
	}
	
	.cast-column-left {
	width: 50%;
	margin: 10px;
		display: block;

}

.cast-column-right {
	width: 100%;
}



}/**** END 768 ****/

/************************************************************************************
smaller than 640
*************************************************************************************/

@media screen and (max-width: 640px) {
	
	
	.column-third {
		width: 100%;
		display: block;

	}
	
	#freecode-box {
		padding: 30px 20px;
	}
	


}

/**** END 640 ****/



/************************************************************************************
smaller than 550
*************************************************************************************/

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

}

/**** END 550 ****/



/************************************************************************************
smaller than 480
*************************************************************************************/

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

	.cast-column-left {
	width: 100%;
	margin: 10px auto;
}
	
.button-main,
.button-outline-dark {
display: block;
margin: 5px auto;
width: 100%;
}
	
	
		
	#quote {
	font-size: 20px;
	padding: 45px;
}

#quote span {
	font-size: 16px;
}
	

} /**** END 480 ****/

/************************************************************************************
smaller than 320
*************************************************************************************/

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

/**** END 320 ****/