/* _______________________________________________ALLGEMEIN____________ */


@font-face {
    
font-family: 'Average';
    
src:url('font/Average-Regular.woff') format('woff'),
        
url('font/Average-Regular.svg#Average-Regular') format('svg'),
        
url('font/Average-Regular.eot'),
        
url('font/Average-Regular.eot?#iefix') format('embedded-opentype'); 
    
font-weight: normal;
    
font-style: normal;

}

html,body{
width:95vw;
height:101vh;
margin:0;
padding:0;
font-family:"Average", "Modern No. 20", "Times New Roman", "Times", "Georgia", serif; 
font-size:1.5vw;
}

/* _______________________________________________VERLAUF____________ */

#background{
background-image:url("img/Verlauf.png");
background-repeat:repeat-x;
background-position:top 0 left 0;
background-size:5px 100vh;
position:fixed;
top:0;
left:0;
width:100vw;
height:100vh;
}

/* _______________________________________________LOGO_________________ */

#logo{
background-image:url("img/Logo.png");
background-repeat:no-repeat;
background-size:9vw;
position:fixed;
width:13vw;
height:7.5vw;
left:3vw;
top:0.5vw;
}

/* _______________________________________________ANREISSER___________ */

#anreisser{
background-image:url("img/Anreisser.png");
background-repeat:no-repeat;
background-attachment:fixed;
background-size:120vh;
background-position-x:18vw;
position:fixed;
width:100vw;
height:10vh;
}

/* _______________________________________________Trennlinie___________ */

#trennung{
position:fixed;
top:10vh;
width:100vw;
height:0.5vw;
border-top:0.15vw solid white;
border-bottom:0.05vw solid white;
}

/* _____________________________________________NAV 1_________________ */

#navigation1{
position:fixed;
top:12vh;
right:20vw;
height:6.3vh;
}

#navigation1 *{
width:6.3vh;
height:6.3vh;
margin-right:5vw;
float:left;
background-repeat:no-repeat;
text-indent:-9999px;
}

#start{
background-image:url("img/Start.png");
background-size:6vh;
}

#termine{
background-image:url("img/Termine.png");
background-size:6vh;
}

#galerie{
background-image:url("img/Galerie.png");
background-size:6vh;
}


#chronik{
background-image:url("img/Chronik.png");
background-size:6vh;
}

#downloads{
background-image:url("img/Downloads.png");
background-size:6vh;
}

#infos{
background-image:url("img/Info.png");
background-size:6vh;
}

#facebook{
background-image:url("img/Facebook.png");
background-size:6vh;
}

#navigation1 a:hover, #navigation1 a:focus {
border-bottom:0.15vw solid white;
}
/* _____________________________________________NAV 2________________ */

#navigation2{
position:fixed;
top:12vh;
left:0;
}

#navigation2 ul{
padding-left:0;
list-style:none;
width:12vw;
height:25vh;
margin-top:8vh;
}

#navigation2 ul li{
margin-bottom:0.2vw;
heigth:8vh;
width:12vw;
}

#navigation2 ul li a{
display:block;
color:white;
text-decoration:none;
padding-right:2vw;
padding-top:1vw;
padding-bottom:1vw;
background:black;
border-top-right-radius:2vw;
border-bottom-right-radius:2vw;
font-size:1.5vw;
text-align:right;
heigth:6vh;
width:12vw;
}




/* _____________________________________________KATZE________________ */

#katze{
position:fixed;
width:10vw;
height:10vw;
top:75vh;
left:3vw;
background-image:url("img/Katze.png");
background-repeat:no-repeat;
background-size:15vh;
}

/* _____________________________________________CONTENT HEADLINE______ */

#content_headline{
position:fixed;
top:20vh;
left:17vw;
width:60vw;
height:5vh;
font-size:4vh;
display:block;
background-color:FireBrick;
text-align:center;
border-top-left-radius:2vw;
border-top-right-radius:2vw;
color:white;
opacity:0.8;
border-top:0.05vw solid pink;
border-left:0.05vw solid pink;
border-right:0.05vw solid firebrick;
}

/* _____________________________________________CONTENT________________ */

#content{
position:fixed;
top:25vh;
left:17vw;
width:60vw;
height:65vh;
border-bottom:0.05vw solid FireBrick;
border-left:0.05vw solid pink;
border-right:0.05vw solid firebrick;
}

#content_bottom{
position:absolute;
width:60vw;
height:65vh;
background-color:darkred;
opacity:0.1;
}

#content_top{
position:absolute;
left:0vw;
top:0vw;
width:56vw;
height:58vh;
background-color:transparent;
font-size:1.7vw;
overflow-y:auto;
color:black;
white-space:pre-wrap;
padding:2vw;
}

#content_top h1{
font-size:2vw;
margin:0;
}

a {
text-decoration:none;
color:white;
}

.download{
background-image:url("img/pdf.png");
background-size:7vw;
background-repeat:no-repeat;
background-position:center;
display:block;
margin:1vw;
width:10vw;
color:white;
text-decoration:none;
text-align:center;
padding-top:9vw;
font-size:1.5vw;
float:left;
}

#zitat{
font-style:italic;
width:18vw;
color:white;
font-size:2.5vw;
float:left;
margin-right:2vw;
}

.start{
max-width:10vw;
max-height:15vw
min-width:10vw;
}

#salsa_img{
margin-top:3vw;
margin-left:9vw;
margin-right:5vw;
}

#content_top iframe{
width:11vw;
height:10vw;
border:none;
}

#content_top .termine{
width:16vw;
height:12vw;
float:left;
margin:1.1vw;
}

#content_top .termine div{
text-align:center;
width:13vw;
color:white;
margin-left:-2vw;
}

#kontakt{
position:absolute;
font-size:1.5vw;
left:2vw;
top:0vw;
}

#impressum{
position:absolute;
font-size:1.5vw;
margin-left:22vw;
top:0vw;
}

#website{
position:absolute;
font-size:1.5vw;
left:44vw;
top:0vw;
}

#ort{
position:absolute;
font-size:1.5vw;
left:2vw;
top:17vw;
}

#video{
float:left;
padding-left:1vw;
}

.galerie img{
margin:1vw;
max-height:11vw;
max-width:15vw;
float:left;
padding-left:1vw;
}

.galerie img:active, .galerie img:focus{
position:fixed;
top:-9999vw !important;
left:-9999vw !important;
bottom:-9999vw !important;
right:-9999vw !important;
max-width:96.5vw;
max-height:50vw;
width:auto;
height:auto;
padding:0;
margin:auto !important;
border: 1000px solid black;
}

/* _____________________________________________SIDEBAR HEADLINE______ */

#sidebar_headline{
position:fixed;
top:20vh;
left:77.6vw;
width:20vw;
height:5vh;
font-size:3vh;
display:block;
background-color:FireBrick;
text-align:center;
border-top-left-radius:2vw;
border-top-right-radius:2vw;
color:white;
opacity:0.8;
border-top:0.05vw solid pink;
border-left:0.05vw solid pink;
border-right:0.05vw solid firebrick;
}

#sidebar_headline *{
margin:0.5vw;
}      

/* _____________________________________________SIDEBAR________________ */

#sidebar{
position:fixed;
top:25vh;
left:77.6vw;
width:20vw;
height:65vh;
border-bottom:0.05vw solid FireBrick;
border-left:0.05vw solid pink;
border-right:0.05vw solid firebrick;
}

#sidebar_bottom{
position:absolute;
width:20vw;
height:65vh;
background-color:darkred;
opacity:0.1;
}

#sidebar_top{
position:absolute;
width:16vw;
height:58vh;
background-color:transparent;
color:black;
font-size:1.5vw;
overflow-y:auto;
white-space:pre-wrap;
padding:2vw;
}

#sidebar_top ul{
white-space:normal;
list-style:none;
padding:0;
margin-top:0;
}

#sidebar_top ul li a{
text-decoration:none;
color:black;
margin-left:2vw;
}


#sidebar_top ul li a:hover{
text-decoration:underline;
color:white;
}

#sidebar_top iframe{
border:none;
white-space:pre-line;
width:11vw;
height:18vw;
margin-left:3vw;
}


#sidebar_top img{
max-width:15vw;
display:block;
margin:0 auto;
}


#party img{
max-width:50vw;
}