@charset "UTF-8";
/* CSS Document */


.MovieList  {
	text-align: left;
}

.MovieList.Baby {
	border-left: 5px solid #C80096;
	border-right: 5px solid #C80096;
}

.MovieList.Junior {
	border-left: 5px solid #FFA000;
	border-right: 5px solid #FFA000;
}

.MovieList.SportMix {
	border-left: 5px solid #009BFF;
	border-right: 5px solid #009BFF;
}

.MovieList.Active {
	border-left: 5px solid #FF0000;
	border-right: 5px solid #FF0000;
}



.MovieList .ProgramLogo, .MovieDetail .ProgramLogo {
	width: 400px;
	max-width: 100%;
	display: block;
	margin: 0 auto 30px auto;
}

.MovieList h1, .MovieDetail h1 {
	font-size: 2.3em;
}

.MovieList a, .MovieDetail a {
	text-decoration: none;
	color:#FFF;
	position: relative;
}

.MovieList a::after {
	content: '';
	position: absolute;
	left:50%;
	right:50%;
	bottom:-2px;
	height: 1px;
	background: #FFF;
	transition: all ease-in-out .2s;
}


.MovieList a:hover::after {
	left:0;
	right:0;
	transition: all ease-in-out .2s;
}

.MovieList.Baby a::after {
	background: #C80096;
}

.MovieList.Junior a::after {
	background: #FFA000;
}

.MovieList.SportMix a::after {
	background: #009BFF;
}

.MovieList.Active a::after {
	background: #FF0000;
}



.MovieList .VimeoWrapper {
	display: inline-block;
	width: 20.7%;
	margin: 2%;
	position: relative;
	text-align: left;
	vertical-align: top;
}

.MovieList .VimeoWrapper > div, .MovieDetail .VimeoWrapper > div {
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.4);
}


.MovieList .VimeoWrapper h2 {
	font-size: 1.2 em;
	font-weight: 700;
	margin: 15px 0 10px 0; 
}

.MovieList.Baby .VimeoWrapper h2, .MovieList.Baby .VimeoWrapper h2 a, .Baby h1 {
	color: #C80096; 
}

.MovieList.Junior .VimeoWrapper h2, .MovieList.Junior .VimeoWrapper h2 a, .Junior h1 {
	color: #FFA000; 
}

.MovieList.SportMix .VimeoWrapper h2, .MovieList.SportMix .VimeoWrapper h2 a, .SportMix h1 {
	color: #009BFF; 
}

.MovieList.Active .VimeoWrapper h2, .MovieList.Active .VimeoWrapper h2 a, .Active h1 {
	color: #FF0000; 
}

.MovieList .VimeoWrapper h2 .Number {
	display: inline-block;
	margin-right:15px; 
}

.MovieList .VimeoWrapper p {
	font-size: .95em;
	font-weight: 300;
}

@media (max-width: 1920px)
{
	.MovieList .VimeoWrapper {
	width: 29%;
	}
	
} 


@media (max-width: 1280px)
{
	.MovieList .VimeoWrapper {
	width: 45.5%;
	}
	
} 


@media (max-width: 768px)
{
	.MovieList .VimeoWrapper {
	display: block;
	width: 100%;
	margin: 20px 0 50px 0;
	
}
	
}