/*universal*/
body, html {
	height: 100%;
	margin: 0;
	color: #ff9000;
	background-color: #4d3e8a;
	background-image: url("../images/background.png");
	/*background-size: cover;*/
	font-family: sans-serif;
	font-family: 'Open Sans', sans-serif;
	font-size: .8em;	
	text-align: center;
}
body.overlay-active,
body.preload {
	overflow:hidden;
}
html {
	scroll-behavior: smooth;
}


#featured-content{
	background-image: url("../images/featured-bg.jpg");
	background-size: cover;
	padding-top: 25px;
	padding-bottom: 25px;
	border-bottom: 15px solid #ff9000;

}

a{
	text-decoration: none;
	color: #fff;
	display: inline;
}

a:hover{
	color: #95979a;
}



.thumb-image-container {
	position:relative;
	width:100%;
}
.thumb-image-overlay {
	position:absolute;
	top:0px;
	left:0px;
}
.thumb-top-text,
.thumb-bottom-text {
	width:100%;	
	color:#fff;	
	font-size:1vw;	
	line-height:19px;
	padding:0px;
	text-align:center;
	box-sizing:border-box;	
	text-transform: uppercase;
}
.thumb-top-text {
	position:absolute;
	top:1%;
	font-weight:700;	
}
.thumb-bottom-text {
	position:absolute;	
	bottom:2.5%;
  line-height:19px;	
}

.thumb {
	cursor:pointer;
}
.thumb-preload{
	display:none !important;
}
#netflix{
	cursor: pointer;
}
#lazy-loading {
	color:#fff;
	visibility: hidden;
	font-size:2em;
	padding: 20px 0px;
	animation: blinker 3s linear infinite;
}
#lazy-loading.active {
	visibility:visible;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}

/*about overlay*/
#about{
	cursor: pointer;
}
#about_overlay{
	position: absolute;
	top:0px;
	right: 0px;	
	height:100%;
	width: 100%;
	z-index: 2000;
	background-image: url("../images/opacity.png");
	overflow:auto;
	display: none;
}
#about_box{
	margin-top: 40px;
	max-width: 960px;
	width: 90%;
	margin: 0 auto;
	border-radius: 25px;
	 border: 5px solid #fff;
	background-color: #0373f9;
}
#about_camp_img{
	max-width: 960px;
	width: 100%;
	margin-top: 20px;
	padding-bottom: 15px;

}
#about_text{
	margin-top: 40px;
	max-width: 960px;
	font-size: 3em;
	color: white;
	margin: 0 auto;
	padding: 20px;
}

#campbtn{
	max-width: 320px;
	width: 100%;
}

#closebtn_about {
  position: relative;
  text-align: right;
  top: 0%;
  right: 5%;
  font-size: 5.5em;
  cursor: pointer;
  color: #fff;
  width: 100%;
	margin: 0 auto;
	padding-top: 5%;
	cursor:pointer;
}

/* Preload
############################ */
#preload-container {  
  width:100%;
  height:100%;
  overflow:hidden;
  position:fixed;
  top:0px;
  left:0px;
  z-index:9999;
  background: #000 url(../images/loader.png) center center no-repeat;
}
#preload-container.hidden {
  display:none;
}
#preload-progress {
  position: absolute;
  top:50%;
  left:50%;
  margin-left:-60px;
  margin-top:100px;
  width:120px;
  height:20px;
  color: rgba(255,255,255,0.75);
	text-align:center;
	font-size:1.5em;
}

/* Overlay Exit
######################### */
#overlay-exit-container {
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  z-index:9999;
  display:none;
}
#overlay-exit-bg {
  width:100%;
  height:100%;
  background-color:#4d3e8a;
  opacity:0.8;
}
#overlay-exit-body {
  position:absolute;
  top:50%;
  left:50%;
  margin-top:-160px;
  margin-left:-350px;
  background-color:#4d3e8a;
  color:#ff9000;
  width:700px;
  height:320px;  
  /*height:260px;*/
  text-align:center;
  border:5px solid #ff9000;
  border-radius:10px;
  font-size:25px;
  line-height:30px;
  text-transform: uppercase;
}
#overlay-exit-body-wrapper {
  padding:30px;  
}
.btn-overlay {
	/*
  background-color:#162d2c;
  padding:10px;
  border-radius:10px;
  color:#fff;
  font-size:20px;
  line-height:23px;
  border:1px solid #fff;
	cursor:pointer;
	*/

	font-weight: 700;
	border:5px solid #ff9000;
	background-color:#000;
	color:#fff;
	padding:10px 20px;
	padding: 5px 20px;
	border-radius: 25px;
	box-shadow: 3px 3px 3px black;
	cursor:pointer;
	color:#ff9000;
}
a.btn-overlay:hover {
	color:#fff;
}


/*
Footer
######################### */

.image-responsive {
    max-width: 100%;
    height: auto;
}


#footer-container{
  color:#fff;  
  position:relative;
  padding:20px 10px 10px 10px;
 
}
#footer-row{
  width:100%;
  display:flex;
}
#footer-row-left {
  width:50%;
  text-align:left;
}
#footer-row-right {
  width:50%;
  text-align:right;
}
#footer-legal {
  font-size:10px;
  text-align:center;
  line-height:13px;
  margin-top:10px;
}
#footer-commonsense{
  width:90px;
  position:absolute;
  top:-30px;
  left:20px;
}

ul.footer-social-container {
  list-style:none;
  padding:0px;
  margin:0px;
  position:relative;
  left:130px;
}
ul.footer-social-container li {
  display:inline-block;
  padding:0px;
  margin:0px 5px;
}
.footer-social-item {
  width:30px;
  position:relative;
}

.footer-netflix {
  width: 250px;
  position:relative;
  top:10px;
  right:20px;
  display: inline-block;
}

/* Exit bumper*/
.bumper-content {
  position: relative;
  top: 25%; /* 25% from the top */
	width: 80%; /* 100% width */
	background-color:#03a2f5;
	border:5px solid #fff;
	border-radius:10px;
  text-align: center; /* Centered text/links */
	margin:0 auto;
	font-size:3.5em;
	line-height:1.3em;
	color:#fff;
	padding:20px;
	margin-bottom: 80px;
}
.bumper-image {
	width:65.5%;
	margin-bottom:30px;
}
.bumper-button span {
	border:5px solid #fff;
	background-color:#3783c1;
	color:#fff;
	padding:10px 20px;
	padding: 5px 20px;
	border-radius: 25px;
	box-shadow: 3px 3px 3px black;
	
}
.bumper-button {
	margin-bottom:30px;
}

/*/////////////////*/
/* The Overlay (background) */

/*#overlay-obj{
	height: 80%;
	width: auto;
	max-width: 1200px;
	min-width: 350px;
}*/

#overlay-obj img{
	width: 100%;
	height: auto;
}

.overlay-container {
	width:80%;
	position:relative;	
	margin: 0 auto;
}

.overlay {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */    
  height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 1003; /* Sit on top */
  left: 0;
  top: 0;
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
  /*background-color:rgba(0,0,0,0.9)*/
  background-color:#03a2f5;
}
.overlay-bg {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	background-color:#4d3e8a;
	opacity:0.9;
}
.overlay-active .overlay-bg {
	position:fixed;
}

/* Position the content inside the overlay */
.overlay-content {
  position: relative;
  top: 0%; /* 25% from the top */
	width: 100%; /* 100% width */
	/*background-color:#4d3e8a;
	
	border:5px solid #fff;
	border-radius:10px;
	*/
  text-align: center; /* Centered text/links */
	margin:0 auto;
	font-size:3.5em;
	line-height:1em;
	color:#ff9000;
	/*padding:20px 20px 40px 20px;*/
	/*margin-bottom: 80px;*/
}
.overlay-content-inner {
	position:relative;
	padding:20px 20px 40px 20px;
}
.overlay-content-wrapper {
	position:relative;
}
.overlay-image {
	width:100%;
	/*margin-bottom:30px;*/
	border:5px solid #ff9000;
	border-radius:10px;
	padding:20px;
	background-color: #0f2d6b;
}
.overlay-button-container{
	position:absolute;
	/*bottom:-22px;*/
	bottom:28px;
	/*width:100%;*/
	left:50%;
	transform: translate(-50%, 0%);
}

.overlay-button span {
	border:5px solid #ff9000;
	background-color:#000;
	color:#ff9000;
	padding: 5px 20px;
	border-radius: 25px;
	box-shadow: 3px 3px 3px black;
	line-height:1em;
	font-weight: 700;
}
.overlay-button {
	/*margin-bottom:30px;*/
}

/* The navigation links inside the overlay */
/*
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}
*/

/* Position the close button (top right corner) */
.overlay .closebtn {
  position: relative;
  text-align: right;
  top: 0%;
  right: 0%;
  font-size: 5.5em;
  cursor: pointer;
  color: #ff9000;
  width: 100%;
	margin: 0 auto;
	padding-top: 5%;
	cursor:pointer;
}

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

#mobile-nav-container{
	display: none;
	
}

#content{
	position: relative;
	/*top:7%;*/
	top:0px;
	padding: 0px;
	margin: 0 auto;
	width: 100%;
	height: auto;
	max-width: 1900px;
}
body.filter-row-1 #content{
	top:1%;
}
body.filter-row-2 #content{
	top:3%;
}
body.filter-row-3 #content{
	top:5%;
}
body.filter-row-4 #content{
	/*top:7%;*/
	top:0px;
}


.main-container {
  /*background-image: url("../images/main.png");
  position: relative;
  background-position: right;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100%;
*/
margin-top: 0px;
background-color: #ffffff;
	position: relative;
	/*border-style:solid;
	border-color: #0d2f69;
	border-bottom-width: 70px;
	box-shadow: 0px 3px 0px #000000;*/
}

#unstoppable-container{
	/*
	position: relative;
	width: 30%;
	max-width: 375px;
	height: auto;
	*/
	width:24.4%;
	height:14.3%;
	position: absolute;
	top: 13%;
	left: 32%;

}

#unstoppable{
	width: 100%;
	height: auto;
}

#logo-container{
	width: 23.75%;
	height:30.587%;
	/*
	width: 30%;
	max-width: 475px;
	height: auto;
	*/
	position: absolute;	
	top: 0px;
	left: 0.5%;
	z-index: 1001;
}


#logo{
	width: 100%;
	height: auto;
}


#main-tout-container{
	/*
	width: 35%;
	max-width: 550px;
	height: auto;
	*/
	width:31.25%;
	height:62.12%;
	position: absolute;
	bottom:8%;
	left: 3%;
	cursor: pointer;

}

 #main-tout{
 	width: 100%;
	height: auto;
 }

#badge{
	/*
	height: 200px;
	position: absolute;
	bottom: 75px;
	right: 50px;
	*/
	width:15%;
	height:28.4%;
	position: absolute;
	bottom:8%;
	right:3%;
}

#main-bg{
	
}


#main-bg-mobile{
	display:none;
}
#main-nav-container{
	position: absolute;
	z-index: 1000;
	top: 0px;
	width: 100%;
	height: 50px;
	

}

#main-nav{
	position: absolute;

	background-color: #000;
	width: 100%;
	height: 55px;


}
#main-nav-shadow{
	position: absolute;
	top: 55px;
	background-color: #000;
	width: 100%;
	height: 2px;

}

.main-nav-btn{
	float: right;
	display: inline-block;
	height: 100%;
	width: auto;
	max-height: 46px;
	padding:5px 20px 0 0;
}

#arrow-container {
	position:absolute;
	top:90%;
	left: 40%;
	width:17.9%;
}

#arrow{
	width:100%;
	height: auto;
}
#arrow-holder{
	position: relative;		
	/*
	margin-top: -200px;
	*/
	width:100%;
	/*height:26.7%;*/
	z-index: 1002;	
	text-align:center;
}

#top-divider{
	position: relative;
	background-color: #ee9d44;
	width: 100%;
	height: 4.73%;	
}
#top-divider-shadow{
	position: relative;
	margin-top: -1px;
	background-color: #000;
	width: 100%;
	height: 2px;

}

#main_bg{
margin-top: 1%;
}
.img-responsive{
	width: 100%;
	height: auto;
	display: block;

}



.comingsoon{
	width: 100%;
	height:100%;
	position:absolute; left:0; top:0px;
	text-align: center;
	font-size: 3em;
	padding-left: 5px;    
	font-weight: 300;
	background-color: #000;
	color: #fff;
	vertical-align: middle;
	opacity: 0;
}


.img-wrapper{
	position:relative;
	text-align: center;
	font-size: 1.65em;
  line-height:1em;
	font-weight: 700;
	background: #000000;
		padding: 8px 0 9px 0;
	bottom: -2px;
	width: 50%;
	height: 15px; 
	border-radius: 20px;
	border-style: solid;
  	border-width: 5px;;
	
	border-color: #ff9000;
	color:#ff9000;
	display: inline-block;
	box-shadow: 3px 3px 3px black;
}

.img-wrapper-fc{
	position:relative;
	text-align: center;
	font-size: 2.5em;
  	line-height:1em;
	font-weight: 700;
	background: #000000;
	padding: 8px 0 9px 0;
	/*bottom: -2px;*/
	width: 50%;
	max-width: 300px;
	/*height: 15px; */
	border-radius: 20px;
	border-style: solid;
  	border-width: 5px;;
	
	border-color: #ff9000;
	color:#ff9000;
	display: inline-block;
	box-shadow: 3px 3px 3px black;
}


select#movie-tv-titles {
	width: 100%;
	padding: 10px 60px;
  background-color: #ff9000;
  color: #000;
  border:2px solid #000;
	font-size: 2em;

	/* reset */
  margin: 0;      
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
}
#movie-tv-titles-container {
	position: relative;	
	max-width: 400px;
	margin: 0 auto;
}
#movie-tv-titles-container:after {	
  content: "\25bc";
  font-size: 2em;
  position: absolute;
  top: 9px;
  right: 20px;
  color: #000;
  pointer-events: none;
}

#movie-tv-titles-container::-ms-expand {
  display: none;
}
/*
select#movie-tv-titles {
  background-image:
    linear-gradient(45deg, transparent 50%, white 50%),
    linear-gradient(135deg, white 50%, transparent 50%),
    linear-gradient(to right, #011456, #011456);
  background-position:
    calc(100% - 20px) calc(1em + 2px),
    calc(100% - 15px) calc(1em + 2px),
    100% 0;
  background-size:
    5px 5px,
    5px 5px,
    2.5em 2.5em;
  background-repeat: no-repeat;
}
*/

#filter-mobile {
	display:none;
}
.main-filter-btn,
.filter-btn{
	position:relative;

	text-align: center;
	font-size: 1.85em;
  line-height:1em;
	font-weight: 700;
	background: #000;
	border-color: #ff9000;
	padding: 5px 10px;
	margin: 5px;
	/*bottom: 30px;*/
	width: auto;
	border-radius: 20px;
	border-style: solid;
  	border-width: 5px;;
	
	color:#ff9000;
	display: inline-block;
	box-shadow: 3px 3px 3px black;
	cursor: pointer;
	display:none;
}
.main-filter-btn.available,
.filter-btn.available{
	display:inline-block;
}
.main-filter-btn.active,
.filter-btn.active{
	border-color:#000;
	background: #ff9000;
	color:#000;
}
.filter-dropdown {
	display:none;
}
.filter-dropdown.available {
	display:block;
}

.filter-text{
	position:relative;
	text-align: center;
	font-size: 1.85em;
	font-weight: 700;

	padding: 4px 10px 10px 10px;
	margin: 5px;
	/*bottom: 30px;*/
	width: auto;
	height: 15px; 
	
	color:#ff9000;
	display: inline-block;
	
}

.filter-nav{
	/*display: inline-block;*/
	max-width: 900px;
}


.filter-nav-container{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items:center;
	align-content:center;
	margin-top: 1%;
	margin-bottom: 30px;
}


.row{

	text-align: center;
}

.col{
	position: relative;
	width: 15.5%;
	height: auto;
	padding: 0px;
	text-align: center;
	display: inline-block;

	margin: 5px 5px 15px 5px;
}


.col-featured{
	position: relative;
	width: 20%;
	height: auto;
	padding: 0px;
	text-align: center;
	display: inline-block;
	margin: 15px 15px 15px 15px;
}

.touts{
	

}
#video-container{
	width: 100%;
	position: relative;
	margin: 30 auto;
	display: inline-block;
}




/*//// Mobile Nav Set up//////*/


#nav-mobile-holder{
font-family: 'Open Sans', sans-serif;
background-color: #f2f1f1;

 z-index: 1100;
 display: none;
 top: 0px;
 width: 100%;
 margin: 0px;
 padding: 0px;
 height: 50px;
 font-size: 1.2em;
font-weight: 800;
}
#nav-mobile {
	
	list-style: none;
	padding: 0 0 0 0;
	width: 100%;
	margin: 0px;
 	padding: 0px;
	
}
#nav-mobile li{
	display: block;
	background-color: #f2f1f1;
	font-weight: bold;
	margin: 0px;
	cursor: pointer;
	padding: 15px 15px 1px 7px;
	list-style: circle;
	text-align: center;
    border: 0px;
	border-bottom: 1px solid #606162;
}

#nav-mobile ul {
	list-style: none;
	padding: 0 0 0 0;
	display: none;
}
#nav-mobile ul li{
	font-weight: 700;
	cursor: auto;
	background-color: #f2f1f1;
	padding: 10px 0 10px 7px;
}
#nav-mobile ul li a {
	text-decoration: none;
}
#nav-mobile a:hover {
	
}

#nav-mobile #burger{
	text-align: left;
	padding-bottom: 10px;
}
#nav-mobile #burger span{
	margin-top: 10px;
	float: right;
	font-size: 1.8em;
	color:#606162;
}
#nav-mobile li .social{
	height: 30px;
	padding: 10px;
}

#nav-mobile-logo{
	
}

#mobile_logo{
	width: 100%;
	position: relative;
}

/*///////////////////////////////////*/
/*///////////////////////////////////*/
/*///////////MAIN//////////////*/
/* Desktops and laptops ----------- */

/*
@media only screen and (min-width : 668px) and (max-width : 1364px) {
 .col{
 	width: 30%;
 }
 #about_text{
	font-size: 1em;
}
}

@media only screen and (min-width : 430px) and (max-width : 667px) {
 .col, .col-featured{
 	width: 45%;
 }
}

@media only screen and (max-width : 430px) {
 .col, .col-featured{
 	width: 90%;
 }
}

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

	
	
}
*/
/*///////////////////////////////////*/
/*///////////////////////////////////*/
/*///////////////////////////////////*/
@media only screen  and (max-width : 1500px) {
	#content {
		top:5%;
	}
	body.filter-row-1 #content{
		top:0%;
	}
	body.filter-row-2 #content{
		top:2%;
	}
	body.filter-row-3 #content{
		top:4%;
	}
	body.filter-row-4 #content{
		top:5%;
	}
}

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

}

@media only screen and (max-width : 1364px) {
  .col{
    width: 30%;
  }
  #about_text{
    font-size: 1em;
  }
}

@media only screen  and (max-width : 1170px) {
  .img-wrapper.featured {
    font-size: 1.5em;
    padding: 8px 10px 8px 10px;
    margin-bottom: 20px;
    width: 70%;
  }
}

@media only screen  and (max-width : 1100px) {
	.horses{
		width:100px;
		height: auto;
	}

	#content {
		top:8%;
	}
  
  .overlay-content-inner {
		
	}

}

@media only screen  and (max-width : 1024px) {
	
	.filter-nav{
		max-width: 500px;
	}
	.filter-btn{
		position:relative;
		text-align: center;
		font-size: 1.2em;		
		margin: 5px;
		width: auto;
	}
	#content {
		top:6%;
	}
	
}
@media only screen  and (max-width : 830px) {
		.horses{
		display: none;
	}
	#content {
		top:5%;
	}
	body.filter-row-1 #content{
		top:8%;
	}
	body.filter-row-2 #content{
		top:9%;
	}
	body.filter-row-3 #content{
		top:10%;
	}
	body.filter-row-4 #content{
		top:1%;
	}
	
	#logo-container {
		
	 top:2%;
 }	
 #main-tout-container {
	 bottom:6%;
 }
 #main-nav-container{
	
 }
 #unstoppable-container{
	 /*display: none;*/
 }
 .main-container {
	 top:0px;
	 
 }	


 .img-wrapper {
	 font-size:1.5em;
	 padding: 8px 0px 8px 0px;
	 margin-bottom: 20px
 }
 
}

@media only screen  and (max-width : 767px) {
	#filter-mobile {
		display:block;
	}
	.filter-btn {
		display:none !important;
	}
	#content,
	body.filter-row-1 #content,
	body.filter-row-3 #content,
	body.filter-row-4 #content,
	body.filter-row-5 #content{
		top:120px;
	}
	.filter-nav-container {
		margin-top:50px;
	}
	#main-bg{
		display:none;
	}
	#main-bg-mobile{
		display:block;
	}
	#logo-container,
	#unstoppable-container{
		display: none;
	}
	#badge {
    width: 35%;
    height: auto;  
	}
	#main-tout-container {
		width: 45%;
		height:auto;  
	}
	.main-container {
		border-bottom-width: 30px !important;
	}
	#arrow-container {
		width:30%;
		top: 93%;
    left: 35%;
	}
	.bumper-content {
    position: relative;
    top: 20%;
    font-size: 2em;
    line-height: 1.3em;
    padding: 20px;
    margin-bottom: 80px;
	}
	.overlay a.bumper-button {
    font-size: 1em;
	}
	.bumper-image {
    width: 80%;
	}
	#overlay-exit-body {
    width:95%;
    top:5%;
    left:2%;
    margin-top:0px;
    margin-left:0px;
    height:auto;
	}
	.overlay-button span {
		border:3px solid #ff9000;
	}
	.overlay-button-container{
		bottom:28px;
	}
  .overlay-content-inner {
		
	}
}

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


}

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

  .col, .col-featured{
    width: 45%;
  }
   
	.col{
 		margin: 0px;
	 }
	 #content,
	body.filter-row-1 #content,
	body.filter-row-3 #content,
	body.filter-row-4 #content,
	body.filter-row-5 #content{
		top:10px;
	}
	#footer-legal {
		margin-top:40px;
	}
}

@media only screen  and  (max-width: 580px) {
	#overlay-exit-body {
    top:10%;
	}
	#overlay-exit-body-wrapper,
  .btn-overlay {
  	font-family: sans-serif;
	font-family: 'Helvetica', sans-serif;
	font-weight: 700;
    font-size: 12px;
    line-height:15px;
    margin-top:10px;

	}
	#btn-overlay-container {
		margin-top:20px;
	}
	.overlay-button span {
		border:1px solid #fff;
		padding: 3px 10px;
	}  
	.overlay-button-container{ 
		bottom:0px;
	}
  .overlay-content-inner {
		padding:20px 20px 10px 20px;
	}
	.filter-nav-container {
		margin-top:30px;
	}
}

@media only screen and (max-width : 430px) {
 .col, .col-featured{
 	width: 90%;
 }
}

@media only screen  and (max-width : 400px) {
	.mobile-nav-btn {
		height: 25px;
		padding-top:15px;
	}	
	#content,
	body.filter-row-1 #content,
	body.filter-row-3 #content,
	body.filter-row-4 #content,
	body.filter-row-5 #content{
		top:80px;
	}
	.filter-nav-container {
		margin-top:8px;
	}
}

