.container {
  margin-left:1%;
  margin-right:5%;
  width: 98%;
}

.container_main {
  margin:0% 8% 0% 8%;
  text-align:justify;
  text-align:center;
  font-weight:bold;
  color:solid black;


}

.container_referenzen {
  position:relative;
  text-align:center;
  font-weight:bold;
  color:solid black;
  margin-top:30px;

}
.container_Musik{
  position:relative;
  margin-left:50px;
  font-weight:bold;
  color:solid black;
  display: table;
  margin: 0 auto;


}


.container_fancybox {
  position:relative;
  margin-left:30px;
  font-weight:bold;
  color:solid black;
  display: table;
  margin: 0 auto;
  margin-top:10px;

}

.Logo_DG {
 width:auto;
 position:relative;
 margin:0 auto;
 margin-top: 1em;
}
.container_video{
  position:relative;
  margin-left:300px;
  display: table;
  margin: 0 auto;
  margin-top:40px;

}

.fancybox img {
  border:3px solid white;
  border-radius:10px;
  box-shadow:10px 10px 5px grey;
}

 .border {
  width: 98%;
  height:auto;
  min-height:400px;
  position:relative;
  margin-top:0px;
  margin-bottom:auto;
  height:auto;
  background-image:url(../img/Noten07.png);
background-repeat:no-repeat;
 }


  /********************  Header ****************************************************/


#main_header {
 width:100%;
 position:relative;
 margin-top:10px;

}

#main_header img{
    width:100%;
    position:relative;
    top:-5px;
    border:3px solid darkred;
    border-radius:10px;
    box-shadow:10px 10px 5px grey;
}

header { /*that is the navbar*/

  border-radius:8px;
  box-shadow:10px 10px 5px grey; 
  border:4px inset #E3E3E2;
  list-style:none;
  position:relative; 
  width:100%;
background-color:darkred;
  margin-bottom:10px;
  margin-right:2%;

}


  

/*image header*/
img {
  position:relative;
  width: 100%  auto;
  height: auto;
  max-width: 100%;

  }

/* } that was missed, then footer and fancy worked again*/

/*header { that is the navbar
  border-radius:8px;
  box-shadow:10px 10px 5px grey; that is shown, but not the radius
  margin:0 auto;
  list-style:none;
  position:relative; 
  width:100%;
  margin-top:20px;
  margin-bottom:20px;
  border:4px inset #E3E3E2;
  border-radius:10px;
  box-shadow:10px 10px 5px grey;


}
*/
#nav {
width:980px; /*center navbar*/

}

nav#cssmenu li a:hover{
height:auto;

}


 /******************** Navigation Textformatierungen ****************************************************/	


section  {
  margin:0% 8% 0% 8%;

  font-weight:bold;
  color:solid black;
}



/***** HTML- Überschriften H1 und H2  *************/
h1
{
    margin: 40px 0px 0px 0px;
    color:solid black;


}

h2
{
    text-align:center;
    margin-top:15px;
}

h3
{
    margin: 65px 0px 0px 0px;
  margin-top:10px;
}

h4
{
    margin: 65px 0px 0px 120px;



}

h6
{
    margin: 65px 0px 0px 120px;
    font-size:14px;
    font-family:Arial, Helvetica, sans-serif;
    font-color:#fff;
    text-align:center;

}

.color {
  color:#9e0b0f;
}
/***** Musicplayer  *************/

#inhalt .textinhalt .playertext {
    height: 40px;
    width: 50%;
    display: table;
    margin: 0 auto;
}

.playertext:not(img)
    {position:relative;
    margin: 0px 0px 20px 10px;
}

.playertext img
  {position:relative;
  top: 10px;

}



/***** Fancybox  *************/

.fancybox4 img {
padding-top:20px; 
height:35px;
width:330px; 
font-style:bolder;

font-size:18px;
border:0px;
}

.fancybox4 { /*Zertifikat*/
position:relative;
text-align:center;

}
 

 
.fancybox2 { /*Anja_Mantel*/
position:relative;
text-align:center;
margin-top:2%;

}

.fancybox2 img { /*Anja tanzt*/
box-shadow: 5px 7px 5px grey;
border:3px solid white;
border-radius:20px;
margin-top:2%;


}

.fancybox3 { /*Anja rot*/
position:relative;
margin-right:100px;
margin-top:2%;


}

.fancybox3 img {
box-shadow: 5px 7px 5px grey;
border:3px solid white;
border-radius:20px;


}


/******************** Header Text und Bild Formatierungen ****************************************************/

IMG.displayed {
    display: block;
    margin-top:0.2%;
    margin-left: auto;
    margin-right: auto;
margin-bottom:0;
    position:relative;
    border:5px solid #9e0b0f;
    box-shadow: 7px 7px 5px grey;
    border-radius: 100%;
    opacity:0.5;
    height:113px;
    width:113px;
 }


footer {

  position:relative;
  margin-top:30px;
  padding-bottom:90px;
  width:auto;
  height: auto;
  text-align:center;
  font-size:18px;
  color:solid black;
  line-height:1.5em;
  font-weight:bold;

}

#footer_kontakt_for_impressum {

  position:relative;
  margin-top:30px;
  padding-bottom:90px;
  width:auto;
  height: auto;
  text-align:center;
  font-size:16px;
  color:solid black;
  line-height:1.5em;
  font-weight:bold;

}

 a:link{color:#9e0b0f}
    a:visited{color:#666;}
    a:hover{color:#666;}
    a:active{color:#666;}



.gallery a img { border: 2px solid white; border-radius:10px; 
position:relative;
margin-left:15%;
margin-top:2%;
box-shadow:10px 10px 5px grey;


}

.gallery1 a img { border: 2px solid white; border-radius:10px; 
position:relative;
text-align:center;
margin-right:9%;
margin-left:9%;
margin-top:2%;
box-shadow:10px 10px 5px grey;

}



.gallery2 a img { border: 2px solid white; border-radius:10px; 
position:relative;
text-align:center;
margin-top:2%;
box-shadow:10px 10px 5px grey;


}

.fa{
	margin-right: 7px;
 
}
.fa-list.modify{
	display: none;
	font-size: 40px;
	position: absolute;
	right: 30px;
	top:60px;
	cursor: pointer;
}
.fa-list.modify{
		display: block;
	}
  

a:active, a:focus {outline: none;} /*remove border in nav*/



/********* I have to add the ::after for fucking bloody mozilla firefox!!!!*********/

/*Media Qeries*/

/*tablet*/

#main_header img{
    width:98%;
    border:3px solid darkred;
    border-radius:10px;
    box-shadow:10px 10px 5px grey;
}

header { /*that is the navbar*/

  border-radius:8px;
  box-shadow:10px 10px 5px grey; 
  border:4px inset #E3E3E2;
  list-style:none;
  position:relative; 
  width:98%;
  background-color:darkred;

  

}

.container_video{
  position:relative;
  margin-left:50px;
  display: table;
  margin: 0 auto;
  margin-top:40px;
  padding-right:5%;
  marging-left:2%;
}


h3
{
  margin: 65px 0px 0px 0px;
  margin-top:5px;
  font-size:20px;
}



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

#main_header {
margin-right:10px; 

}

#main_header img{
    width:98%;
    border:3px solid darkred;
    border-radius:10px;
    box-shadow:10px 10px 5px grey;
}

.container_video{
  position:relative;
  margin-left:50px;
  display: table;
  margin: 0 auto;
  margin-top:40px;
  padding-right:5%;
  margin-left:2%;


}

header { /*that is the navbar*/

  border-radius:8px;
  box-shadow:10px 10px 5px grey; 
  border:4px inset #E3E3E2;
  list-style:none;
  position:relative; 
  width:97%;
  background-color:darkred;

  

}


h2
{
    margin: 40px 0px 0px 0px;
    color:solid black;
    font-size:20px;
    margin-top:1px;
}

h3
{
  margin: 65px 0px 0px 0px;
  margin-top:5px;
  font-size:14px;
}

footer {

  position:relative;
  margin-top:30px;
  padding-bottom:90px;
  width:auto;
  height: auto;
  text-align:center;
  font-size:16px;
  color:solid black;
  line-height:1.5em;
  font-weight:bold;

}

#footer_kontakt_for_impressum {

  position:relative;
  margin-top:30px;
  padding-bottom:90px;
  width:auto;
  height: auto;
  text-align:center;
  font-size:12px;
  color:solid black;
  line-height:1.5em;
  font-weight:bold;

}


  /* iPhone 6 in portrait & landscape */
  @media only screen 
  and (min-device-width : 375px) 
  and (max-device-width : 667px) {
    .container_video{
  position:relative;
  margin-left:50px;
  display: table;
  margin: 0 auto;
  margin-top:40px;
  padding-right:3%;
}


h3
{
  margin: 65px 0px 0px 0px;
  margin-top:5px;
  font-size:16px;
}


/* iPhone 6 in landscape */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : landscape) {
  .container_video{
  position:relative;
  margin-left:50px;
  display: table;
  margin: 0 auto;
  margin-top:40px;
  padding-right:3%;
}



/* iPad mini in portrait & landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1) {

  .container_video{
  position:relative;
  margin-left:50px;
  display: table;
  margin: 0 auto;
  margin-top:40px;
  padding-right:0%;
}

  
}