body {
 font-family: 'Dosis', sans-serif;
 font-size: 25px;
 text-align: center;
 line-height: 1.5;
 text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
 padding: 0;
 height: 100vh;
 position: relative;
 margin: 0;
 overflow-x: hidden;
 overflow-y: auto;
background-image: url("../img/hintergrund.jpg");
background-repeat: no-repeat;
background-size: cover;

}

* {
 box-sizing: border-box;
}

/* ALLGEMEINES */

a {
 color: #b90800;
 transition: all 200ms ease-in-out 0s;
 text-decoration: none;
 text-shadow: 1px 1px 1px rgba(185,8,0,0.5);
}
a:hover,
a:focus,
a:active {
 color: #910701;
}
ul {
 margin: 0;
 padding: 0;
}

#maincontent {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80vw;
}

#maincontent h1 {
	margin-top: 0;
}

canvas {
 position: absolute;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
}

footer {
bottom: 0;
 position:absolute;
 transform: translate(-50%, 0);
 font-size: 15px;
left: 50%;
}
footer #metanavi ul li{
 display: inline-block;
 text-align: center;
 margin-right: 30px;
}
footer #metanavi ul li:last-child{
 margin-right: 0;
}
footer #metanavi ul li a{
 background: #b90800;
 color: #fff;
 text-shadow: none;
 padding: 5px 10px;
}
footer #metanavi ul li a:hover,
footer #metanavi ul li a:active,
footer #metanavi ul li a:focus {
 background: #b90800;
}

#particles-js {
position: absolute;
top: 0;
left: 0;
z-index: -30;
	height: 100vh;
	width: 100vw;
}


#logo
{
margin-top:20px;

}


@media screen and (max-width: 1400px)  {

body {
font-size: 20px;
background-size: auto;
background-image: url("../img/hintergrundklein.jpg")
}


}

@media screen and (max-width: 768px)  {

#maincontent {
		position: relative;
		top: 0;
		transform: translate(-50%, 0);
	}
	


}

@media screen and (max-height: 600px)  {
	#maincontent {
		position: relative;
		top: 0;
		transform: translate(-50%, 0);
	}
}

@media screen and (max-height: 450px)  {
	footer {
		position: relative;
		margin-top: 50px;
	}
}

@media screen and (max-width: 470px)  {
	footer {
		position: relative;
		margin-top: 50px;
	}
}

/******************************** Cookieset ***************************************************/

#eu_cookiebox{
    display: block;
    z-index: 1000000000000000000;
    position: fixed;
    bottom: 0px;
    left: 0;
    min-height: 30px;

    margin: 0;
    width: 100%;
    max-width: 100%;
    color: #000;
    border-top: 2px solid red;

    background: #ffffe1;

    text-align: center;
    opacity: .9;


}

#eu_cookiebox button{
    cursor: pointer;
    margin: 20px;
    padding: 7px;
    font-weight: bold;
    -webkit-transition-duration: 0.8s; /* Safari */
    transition-duration: 0.8s;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;

}



#eu_cookiebox button:hover{

    box-shadow: 0 5px 5px 0 rgba(0,0,0,0.24),0 7px 20px 0 rgba(0,0,0,0.19);
}

#eu_cookiebox a{
    color: black;
    -webkit-transition-duration: 0.8s; /* Safari */
    transition-duration: 0.8s;
}

#eu_cookiebox a:hover{
    color: #df011a;
}

/******************************** Cookie set *************************************************/