@charset "UTF-8";
/* CSS Document */
/*---------- Gilt f�r alle Seiten--------*/
html,body{
height:100%;
}

html{
        background-color:#CECECE;
        /*background-image:url("Fotos/Hintergrund.png");*/
	background-size: 100% auto;
        outline: 1px solid ;
      }
        }


html
{background: no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color:#F2F2F2;
}

html, body{
width: 100%;
min-height:100%;}



  h1{
font-family: 'Abel','Helvetica','Arial','sans-serif';
        font-size:13pt;
        font-weight:400;
                text-decoration:none;
        color:#000000;
        text-align:center;}

h2{
font-family: 'Abel','Helvetica','Arial','sans-serif';
        font-size:15;
        font-weight:300;
                text-decoration:none;
        color:white;
        text-align:left;}

body{
        background-repeat:no-repeat;
        color: white;
        font-family: 'Abel','Helvetica','Arial','sans-serif';
        text-decoration:none;
        margin:0;
        padding: 0;
        width:100%;
        /*max-width:1800px;*/
        text-align:center;
        margin-left:auto;
        margin-right:auto;
        position:relative;
        background-color: transparent;
}

header, nav, section, footer, .box a, .big_box a,.box_socialm a, .box_news a{
        Display: block;
}

.box_news a{ height:auto;}

/*Header*/

#bg                {
				height: 100%;
				width: 100%;
                background-size: cover;
                position:absolute;
                top:0px;
	z-index: 1;
				
                }

#album{
                width:300px;
                height:auto;
                position:absolute;
                right:0px;
                top: 10%;
                font-family:'Abel','Helvetica','Arial','sans-serif';
                text-align:left;
                background-color:transparent;
                z-index:6;
                font-size:36px;
                }


#content {
            font-family:'Abel','Helvetica','Arial','sans-serif';
            position:absolute;
                width: 100%;
                height: auto;
                text-align:center;
                  top:40%;
                z-index:4;
                background-color:#FFFFFF;
                  }

#news {
                height:800px;
                width: 530px;
                position:relative;
                bottom:-21%;
                font-family:'Abel','Helvetica','Arial','sans-serif';
                text-align:left;
                font-size:20px;
                clear:left;
                margin-left:8%;
                aligne:bottom;

                }



#logo{
                height: auto;
                width:110px;
                align:center;
                margin-left:50px;
                position:absolute;
                clear:left;
                top: 4%;
             color:#FFFFFF;
        font-size:150%;
        background-color:white;
                }


#nav{
             height: auto;
                width:420px;
                /*align:center;*/
                margin-left:5%;
                position:absolute;
                clear:left;
                top: 15%;
             	color:#FFFFFF;
        	font-size:150%;
        	background-color:transparent;
                }

#socialm{
               /* position:absolute; */
                height:auto;
                width:auto;
                right:80px;
                align:center;
                clear:left;
                margin-top:10%;
                text-align:right;
                color:#A0A0A0;
                font-size:13px;
	        z-index:5;
                }

#sounds{
                position:absolute;
                height:auto;
                left:-428px;
                width:856px;
                align:center;
                margin-left:50%;
                clear:left;
         }

#about{
                position:absolute;
                align:center;
                height:auto;
                width:600px;
                text-align:justify;
                font-family:'Abel','Helvetica','Arial','sans-serif';
                color:black;
                margin-left:35%;
               /*left:-400px;*/
                font-size:15px;
		z-index: 3;
		top: 20%;
		background-color:rgba(223,213,213,0.60);
		/*background-color: transparent;*/
		padding: 30px;
		border-radius:15px;
                }


.points{
            display:block;
            width:100px;
            height:auto;
            position:relativ;
                        bottom:0;
            left:50%;
            margin-left:0px;
            top:0px;
            }

.points_box{
            float:left;
            display:block;
            width:100px;
            height:16px;
            padding:10px;
            position:relative;
            bottom:20px;
            z-index:4;
                        background-color:white;
            }

.points_box img{
            height:16px;
            width: 20px;
            border: 0 none;
            position:realtive;
            z-index:4;
           }





 /*Container f�r den Inhalt*/
 /*Safari*/
 html* .galery{
        width:100%;
        height: auto;
        position:relativ;
        margin-top:30%;
        }

/*Opera*/
.galery{
        width:100%;
        height: auto;
        position:relativ;
        margin-top:0%;
                }

.home{
                float:left;
        display:block;
        width:100%;
        height:auto;
        left:0%;
        margin-left:0%;
        position:relative;
                margin-top:0%;
                }

/*Die Breite aller Boxen zusammen*/
.Bilderboxen{
        display:block;
                height:auto;
        width:75%;

        position:relative;
        left:50%;
                margin-left:-37.5%;
                margin-top:1%;
        }



/*hebt float wieder auf*/
.clear {
        clear:left;
}

.box_title{
                position:relative;
                width: 186px;
                height: 64px;
                text-align:center;
                display: -webkit-flex;
                   display: flex;
                  left:50%;
                margin-left:-93px;
                padding-bottom:100px;
                padding-top:30px;
                }

.box        {
                float:left;
                position:relative;
                width: 280px;
                height: auto;
                padding-left:20px;
                padding-right:20px;
                padding-top: 0px;
                padding-bottom:0px;
                text-align:center;
                display: -webkit-flex;
                   display: flex;
                  margin: 0 auto;
                }





.box_socialm{
                position:relative;
                height:auto;
                width:150px;
                display:flex;
                margin: 0 auto;
                float:left;
                }

.box_logo{
                position:absolute;
                height:auto;
                width:90px;
                display:flex;
                margin: 0 auto;
                float:left;
                margin-left:5%;
                margin-top:10px;
                }


.box_sounds{
                float:left;
                position:relative;
                width: 210px;
                height: 130px;
                padding:2px;
                text-align:center;
                  display: flex;
                  margin: 0 auto;
                }

.vierBilder{
                margin-left:-428px;
                width:856px;
                }


.box_news{
                height:730px;
                width: 530px;
                position:relative;
                  margin: 0 auto;
                padding-top:20px;
                background-color:#FFFFFF;
                }


.box_news a{
                width:470px;
                padding-left:20px;
                }


.news_botton{
                width:130px;
                height:55px;
                position:relative;
                bottom:0px;

                }
/*Bilder Gr��e*/

.box img , .box_socialm img, .box_logo img, .news_botton img, #bg img, .box_title img, .box_sounds img{
        height:auto;
        width: 100%;
         border: 0 none;
    position:relative;
    z-index:3;
        }

#news img{
        width:130px;
        height:auto;
        position:relative;

        }


/* Bildbox f�r die Startseite*/

.start {
       display:block;
       height:auto;
       width: 13%;
       top:50%;
       left:50%;
       margin-left:-6.5%;
       margin-top:-6.5%;
       position:relative;
       }

.start img{
           width:100%;
           height:auto;
           position:realtive;
           }





 /* Bild und Textbox f�r About, Live, Sounds Seite*/
 .about , .live , .sounds, .contact{
         font-family:'Abel','Helvetica','Arial','sans-serif';
        display:block;
        width:auto;
        height:auto;
        color:black;
        position:relative;

                font-size:16px;
        }



          .sounds_box1, .sounds_box2{
          display:block;
          float:left;
          width:31%;
          height:auto;
          padding:1%;
          position:relative;
          text-align:left;
          font-family: 'Abel','Helvetica','Arial','sans-serif';
          font-size:medium;
          line-height:25px;
          color:#000000;
          font-weight:400;
          }

.about_box1{
width 200px;
height auto;}


 .about_box1 img , .live_box1 img, .sounds_box1 img, .about_box1 iframe{
             float:left;
             width:250px;
             height:auto;
             position:relative;
	     padding-right:20px;
	     padding-left:20px;
             padding-bottom:10px;

		}



             }

caption{
        font-weight:normal;
        text-align:left;
                color:#A0A0A0;
                font-size:25px
        }
td {
        font-family:'Abel','Helvetica','Arial','sans-serif';
                color:#A0A0A0;
                padding:0px ;
        padding-right:10px;
                padding-top:15px;
        text-align:left;
                font-size:20px
        }
th {
   padding:15px;
   text-align:center;
   }
/*Bild und Textbox f�r Contact Seite*/



a:link {
                font-family:'Abel','Helvetica','Arial','sans-serif';
       text-decoration:none;
       font-weight:normal;
       color:#A0A0A0;
       }
#content a{font-family:'Abel','Helvetica','Arial','sans-serif';
}
a:visited { text-decoration:none; font-weight:normal; color:#A0A0A0; }
a:hover{ text-decoration:none; font-weight:normal; color:#fc51d5;}

#content d{font-family:'Abel','Helvetica','Arial','sans-serif';
                        color:#A0A0A0;
}


#popup1
{
  position:relative;
  top:20vh;
  left:35vw;
  width:40vw;
  background-color:hsla(0,0%,0%,0.75);
  color:white;
  -khtml-opacity:0;
  -moz-opacity : 0;
  -ms-filter: "alpha(opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  filter : alpha(opacity=0);
  opacity : 0;
  padding:20px;
  border-style:solid;
  border-radius:15px;
  border-color:black;
  transition:all 1s;
  -webkit-transition:all 1s;
  font-family:Helvetica;
  text-align: left;
	font-size: 70%;
 line-height: 1;
	z-index: 5;
	
}

#popup1:target
{
  -khtml-opacity:1;
  -moz-opacity : 1;
  -ms-filter: "alpha(opacity=100)";
  filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
  filter : alpha(opacity=100);
  opacity : 1;
  text-align: left;
}

/* Bouton fermeture */

#close
{
  position:absolute;
  left:100%;
  top:-20px;
  margin-left:-10px;
  background-color:#EFF1F3;
  font-size:12px;
  padding:5px 7px;
  border-radius:50px;
  border-style:solid;
  border-color:#bbd8b3;
  color:#bbd8b3;
  text-decoration:none;
  font-family:arial;
}

#close:hover
{
  background-color:#EFF1F3;
  border-color:#bbd8b3;
  color:#D77A61;
}

#close:active
{
  background-color:#A9F5F2;
  color:black;
}