@charset "utf-8";

@import url("../webfonts/Libertad-Family-Webfonts/Libertad 3/Libertad.css");
@import url("../webfonts/Libertad-Family-Webfonts/Libertad 3/Libertad-Bold.css");
@import url("../webfonts/Boton_Webfonts/stylesheet.css");
@import url("../../javascript/flexslider/flexslider.css");

@media screen, print {
* {
	margin: 0px;
	padding: 0px;
}
body.normBody {
	background: #555;
	/*background-image: url(../bilder/layout/kopf_hintergrund_115x1px.gif);
	background-repeat: repeat-x;*/
	/*text-align: center;*/
}

.normBody .huelle {
	background-color: rgb(240, 240, 240);
	/*background-image: url(../mp3/UI_Vorlage_v1.png);*/
	/*background-image: url(../mp3/background_2.jpg)*/; 
	width:1183px; 
	height:713px; 
	padding-top: 35px;
	padding-bottom: 50px;
	padding-left: 60px;
	padding-right: 35px; 
	margin: 0px;"
}

body.normBody h1 {
	color: #222;
	padding-top: 0px;
	font-family: "botonmedium", Arial, Helvetica, sans-serif;
	font-size: 45px;
	font-weight: normal;
    font-style: normal;
}

body.normBody h2 {
	color: #222;
	padding-left: 0px;
	padding-bottom: 30px;
	font-family: "botonregular", Arial, Helvetica, sans-serif;
	font-size: 32px;
	font-weight: normal;
    font-style: normal;
}

body.normBody h3 {
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-style: normal;
	font-size: 20px;
	line-height: 27px;
}

body.normBody p {
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 20px;
	line-height: 27px;
}

.normBody .test {
	background-color: rgba(148, 148, 148, 1.0);
	/*background-image: url(../images/UI-Entwurf_v1_s6.png);*/
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
	margin-right: 15px;
	height: 159px;
	width: 157px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: left;
	color: #fff;
	text-align: left;
}

.normBody .test #audio_with_controls {
	margin-top: 20px;
	/*height: 35px;*/
	width: 100%;
	color: #000;
}

.normBody .testGross {
	background-color: rgba(41, 128, 185, 1.0);
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
	margin-right: 15px;
	height: 348px;
	width: 345px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: left;
	color: #fff;
	text-align: left;
}

.normBody .testGross #audio_with_controls {
	margin-top: 212px;
	/*height: 35px;*/
	width: 100%;
	color: #000;
}

.normBody a {
	color: #005bb7;
	text-decoration: none;
}
.normBody a:hover, a:focus {
	color: #005bb7;
	text-decoration: none;
}
.normBody a:visited {
	color: #005bb7;
}
.normBody img {
	border-style: none;
}
.clearfloat {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
}

/*################################################################*/

.boxBig {
	background-color: rgba(41, 128, 185, 1.0);
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 20px;
	height: 421px;
	width: 418px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: left;
	color: #fff;
	text-align: left;
}

.boxSmall {
	
	background-color: rgba(148, 148, 148, 1.0);
	/*background-image: url(../images/UI-Entwurf_v1_s6.png);*/
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-right: 20px;
	height: 192px;
	width: 200px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: left;
	color: #fff;
	text-align: left;
	
}
.boxSmall1 {
	
	background-color: rgba(148, 148, 148, 1.0);
	/*background-image: url(../images/UI-Entwurf_v1_s6.png);*/
	margin-top: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
	margin-right: 15px;
	height: 192px;
	width: 200px;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 8px;
	float: left;
	color: #fff;
	text-align: left;
	
}

.boxContent {
	background-color: rgba(41, 128, 185, 1.0);
	height: 318px;
	width: 100%;
}


.boxContentSmall {
	/*background-image: url(../images/play-background.png);*/
	background-color: rgba(148, 148, 148, 1.0);
	height: 137px;
	width: 100%;
	background-size: 150px;
}

.boxContentSmall1 {
	/*background-image: url(../images/play-background.png);*/
	background-color: rgba(148, 148, 148, 1.0);
	height: 137px;
	width: 100%;
	background-size: 150px;
}

.boxPlay {
	/*background-color: rgba(0,250,0,1.0);*/
	height: 30px;
	width: 100%;
}

nav {
	background-color: rgba(41, 128, 185, 1.0);
	height: 30px;
	width: 100%;
}

#small{
	background-color: rgba(148, 148, 148, 1.0);
}

#defaultBar {
	background-color: rgba(31,95,137,1.0);
	height: 5px;
	width: 250px;
	margin-top: 13px;
	margin-right: 10px;
	position: relative;
	float: left;
}

#defaultBar_small {
	background-color: rgba(70,70,70,1.0);
	height: 5px;
	width: 75px;
	margin-top: 13px;
	margin-right: 0px;
	position: relative;
	float: left;
}
#defaultBar_small1 {
	background-color: rgba(70,70,70,1.0);
	height: 5px;
	width: 75px;
	margin-top: 13px;
	margin-right: 0px;
	position: relative;
	float: left;
}

#progressBar {
	background-color: rgba(220,220,220,1.0);
	height: 5px;
	/*width: 100%;*/
	position: absolute;
}

#progressBar1 {
	background-color: rgba(220,220,220,1.0);
	height: 5px;
	/*width: 100%;*/
	position: absolute;
}
#progressBar2 {
	background-color: rgba(220,220,220,1.0);
	height: 5px;
	/*width: 100%;*/
	position: absolute;
}
#progressBar3 {
	background-color: rgba(220,220,220,1.0);
	height: 5px;
	/*width: 100%;*/
	position: absolute;
}

#playButton {
	background-color: rgba(41, 128, 185, 1.0);
	border: none;
	height: 30px;
	width: 30px;
	margin-right: 10px;
	background-image: url(../images/play.png);
	background-repeat: no-repeat;
	background-position: center;
	float: left;
}
#playButton2 {
	background-color: rgba(41, 128, 185, 1.0);
	border: none;
	height: 30px;
	width: 30px;
	margin-right: 10px;
	background-image: url(../images/play.png);
	background-repeat: no-repeat;
	background-position: center;
	float: left;
}

#buttons2 {
	background-color: rgba(148, 148, 148, 1.0);
}
#buttons3 {
	background-color: rgba(148, 148, 148, 1.0);
}

#playButton1 {
	background-color: rgba(148, 148, 148, 1.0);
	border: none;
	height: 30px;
	width: 30px;
	margin-right: 3px;
	background-image: url(../images/play.png);
	background-repeat: no-repeat;
	background-position: center;
	float: left;
}
#playButton2 {
	background-color: rgba(148, 148, 148, 1.0);
	border: none;
	height: 30px;
	width: 30px;
	margin-right: 3px;
	background-image: url(../images/play.png);
	background-repeat: no-repeat;
	background-position: center;
	float: left;
}
#playButton3 {
	background-color: rgba(148, 148, 148, 1.0);
	border: none;
	height: 30px;
	width: 30px;
	margin-right: 3px;
	background-image: url(../images/play.png);
	background-repeat: no-repeat;
	background-position: center;
	float: left;
}

#playTime {
	padding-top: 8px;
	text-align: right;
}

#fullDuration {
	/*background-color: rgba(250,0,250,1.0);*/
	/*height: 20px;*/
	/*width: 5px;*/
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 17px;
	text-align: right;
}
#timeDur{
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 17px;
	text-align: right;
	
	
}

#timeDur1{
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 17px;
	text-align: left;
	
}
#timeDur3{
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 17px;
	text-align: left;
	
}
#timeDur4{
	font-family: "Libertad3", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 17px;
	text-align: left;
	
}
div.boxContent{
	/*background-image: url(../images/play-background.png);*/
	height: 318px;
	width: 100%;
	padding-top: 8px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	
}

.overlay {
    position: absolute;
    display: none;
    width:1025px; 
	height:600px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2;
    cursor: pointer;
	margin: 0px
}
.overlay-content {
	position: absolute;
	width:1025px; 
	height:600px;
    top: 0%;
    
    text-align: left;
    margin-top: 0px;
}

#ReiherVideo{
    position: absolute;
   width:1025px; 
	height:600px;
    font-size: 200px;
    color: white;
    transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
	padding-top: 0px;
	padding-bottom: 0px;
	
}

.Bild{
	position: absolute;
    width:1025px; 
	height:600px;
    /*font-size: 200px;*/
    color: white;
    transform: translate(0%,0%);
    -ms-transform: translate(0%,0%);
	padding-top: 0px;
	padding-bottom: 0px;
	
}

.overlay .closebtn {
    position: absolute;
	color: red;
    left: 940px;
	top: 10px;
	font-size: 100px;
	
}
#mytrack{
	background-color: #95B9C7;
	width: 100%;
	padding: 0px;
}