* {
	list-style-type:none;
	padding:0;
	text-decoration: none;
	margin:0;
	}


body {
	background-image: url('../img/bg.png');
	color: #000305;
	font-size: 87.5%;
	font-family: Arial, 'Lucida Sans Unicode';
	line-height: 1.5;
	text-align: left;
	list-style-type: none;
}

html {
	
  overflow-x: hidden;
  
}

a {
	text-decoration: none;
}
a:link, a:visited {
	color: #000;
}
a:hover, a:active {
	color: #DC322F;
}

.body {
	margin: 0 auto;
	width: 70%;
	clear: both;
}

.mainHeader img {
	width: 30%;
	height: auto;
	margin: 2% 0%
	float: left;
} 

.Header-socialmenu {
	width: 6%;
	height: 80px;
	position: absolute;
	top: 4%;
	left: 79%;
	display: block;
	list-style-type: none;
	margin: 0 auto;
	text-align: center;
}

.mainHeader nav {

	position: relative;
	width: 100%;
	margin: 2% -9999rem;
	padding: 0.25rem 9999rem;
	background-color: #202020;
	height: 40px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	}

.mainHeader nav ul {
	list-style: none;
	margin: 0 auto;
}
audio {
	height: 35px;
	width: 25%;
	margin: 0.5% 0 0 6%;
}
.mainHeader nav ul li {
	margin: 0 1% 0 0;
	float: right;
	display: inline;
	}
	
.mainHeader nav a:link, .mainHeader nav a:visited {
	color: #FFF;
	display: inline-block;
	padding: 10px 25px;
	height: 20px;
}

.mainHeader nav a:hover, .mainHeader nav a:active,
.mainHeader nav .active a:link, .mainHeader nav .active a:visited {
	background-color: #333;
	text-shadow: none;
	height: inherit;
	color: #DC322F;
}

.mainHeader nav ul li a {
	
	border-radius: 1px;
	-moz-border-radius: 1px;
	-webkit-border-radius: 1px;
}

.mainContent {
	line-height: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.Info {
	padding: 0.5% 1%;
	background-repeat: no-repeat;
	background-image: url('../img/featuredabout.png');
	background-size: contain; 
	margin: 0% 1.4%;
	width: 98%
	background-size: 100% 100%;
	 background-color: #FFF; 
}



.Contact {
	position: relative;
	width: 14%;
	float: left;
list-style: none;
	margin: 0 0 0 5%;
	text-align: center;	 
	font-size: 0.9vmax;
	color: #FFF;
	line-height: 2;
	padding: 2% 0;
}


.Crew {


width: 57%;

margin: 0 0 0 42%;
padding: 0 0 0.5% 0;

}

.umbra img {
	
	margin: 0 auto;
	width: 100%;

}

.Top10 {
	
	background-color: #333;
	margin: 0 -9999rem;
	padding: 3% 9999rem;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;

}

.Top10 h2 {
	height: 40px;
	text-align: center;
	font-size: 2vmax;
	color: #DC322F;
	
}

.Top10 p {
	
	text-align: center;
	font-size: 1.5vmax;
	color: #fff;
	
}





/* ===========================
   ========= Footer ========== 
   =========================== */

.mainFooter {
	width: 100%;
	float: left;
	padding-left: 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	color: #FFF;
	margin: 2% -9999rem;
	padding: 0.25rem 9999rem;
	background-color: #202020;	
}

.mainFooter p {
	width: 91%;
	margin: 2% auto;
}




/* ===========================
   ======= Content Prog ====== 
   =========================== */

.mprogcontent {
	background-color: #FFF;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	padding: 3% 5%;	
	margin-bottom: 3%;
	line-height: 2;
}

.mprogcontent h2 {
	text-align: center;
	font-size: 2.4vmax;
}
.mprogcontent h3 {
	text-align: center;
	text-decoration: underline;
	font-size: 1.7vmax;
}
.mprogcontent p {
	text-align: center;
	font-size: 1.4vmax;
}
.progcontent {
	
	width: 100%;
	float: left;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
}

.mprogpost-info {
	font-style: italic;
	color: #999;
	font-size: 85%;
	text-align: right;
}

@media only screen and (min-width: 150px) and (max-width: 780px){
	
	.body {
	
	width: 100%;
	font-size: 90%;
	
}
/* ===========================
   ======= Media Prog ========
   =========================== */
  

  .mprogcontent {
		background-color: #FFF;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;	
		padding: 2% 5%;
		margin-bottom: 4%;
		margin: 0 auto;
	}
	
	
	.progcontent {
		margin: 2% 5%;
		width: 90%;
		float: left;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;	
	}	

	.mprogpost-info {
		display: none;
	}



audio {
	width: 100%;
	margin: 0 0 0 0;
	}
	
	
.mainHeader img {
	width: 85%;
}
	
.Header-socialmenu {
	
	left: 90%;
	
}	
	.mainHeader nav {
	height: 160px;
	float: left;
	margin: 0 ;
	padding: 0 ;
			border-radius: 0px;
		-moz-border-radius: 0px;
		-webkit-border-radius: 0px;	
	}
	

.mainHeader nav ul {
	padding-left:0;
}

.mainHeader nav ul li {
	width: 100%;
	text-align: center;
	
	}
	
.mainHeader nav a:link, .mainHeader nav a:visited {
	padding: 10px 25px;
	height: 20px;
	display: block;
}

.mainContent {
	
	line-height: 28px;

}

.Info {
	
}

.Contact {
	width: 100%;
	float: left;
	margin: 2% 0 0 0;
	text-align: center;
	background-color: #333333;
	font-size: 100%;
	
}

.Crew {
background-color: #FFF;
float: left;
width: 100%;
margin: 0 ;
}

.Top10 h2 {
	
	font-size: 35px;
	
}

.Top10 p {
	
	font-size: 100%;
	
}

.umbra {
margin: 0 0 0 0;	
}
	.mainFooter {
		width: 100%;
		float: left;
		margin: 2% 0;
	padding: 0;
		background-color: #202020;
		border-radius: 0px;
		-moz-border-radius: 0px;
		-webkit-border-radius: 0px;	
		color: #FFF;
			
	}
	
	.mainFooter p {
		width: 86%;
		margin: 2% auto;
	}
}

 #Top10-slider .item{
        margin: 5%;
    }
    #Top10-slider .item img{
        display: block;
        width: 80%;
        height: auto;
    }
    
#Crew-slider .item img{
        display: block;
        width: 100%;
        height: auto;
        margin: 2% 0;
    }