@charset "UTF-8";

body {

    font-family: Lato, sans-serif;
}


img.bg {
    min-height: 100%;
    min-width: 1024px;

    width: 100%;
    height: auto;

    position: fixed;
    top: 0;
    left: 0;
}

@media screen and (max-width: 1024px) {
    /* Specific to this particular image */
    img.bg {
        left: 50%;
        margin-left: -512px;
        /* 50% */
    }
}

a {
    text-decoration: none;
}

a:link {
    color: #000;
}

a:visited {
    color: #000;
}

a:hover {
    color: #ff9900;
}

a:active {
    color: #000;
}

ul {
    margin-top: 21%;
}

.menuItem {
    text-align: right;
    /*display: block;*/
    margin-top: 12%;
    padding: 1%;
    font-size: larger;
    font-weight: bold;
    font-family: Verdana, Geneva, sans-serif;
}

.menu {
    position: absolute;
    top: 5%;
    right: 6%;
    /*height:auto;*/
}

#logotext {
    text-align: right;
    font-size: xx-large;
    font-weight: bold;
    font-family: Verdana, Geneva, sans-serif;
    color: #ed1e79;
}

/*
#whatisit { color:#ff3333; }
#keys { color:#f15a24; }
#insects { color:#c69c6d; }
#weed { color:#8c6239; }	
#trees { color:#42210b; }	
#coffee { color:#662d91; }
#surprise { color:#2e3192; }

#whatisit { color:#fff; }
#fluegelzeug { color:#000; }*/

#keys {
    color: #fff;
}

#insects {
    color: #fff;
}

#weed {
    color: #fff;
}

#trees {
    color: #fff;
}

#coffee {
    color: #fff;
}

#surprise {
    color: #fff;
}

#movingsurprise {
    position: absolute;
    left: 2%;
    top: 75%;
}

h1 {
    font-size: 2.4vh;
}


.audio_button {
    padding-left: 2%;
    /*width:2.8%;*/
    width: 2.8vh;
    cursor: pointer;
}

h2 {
    font-size: 1.9vh;
}

p {
    font-size: 1.7vmin;
    line-height: 2.4vmin;
}

#impressum {
    position: -webkit-sticky;
    position: fixed;
    top: 90%;
    left: 80%;
    padding: 5px;
    background-color: #fff;
}

#impressumT {
    position: -webkit-sticky;
    position: fixed;
    top: 90%;
    left: 78%;
    padding: 5px;
    color: #fff;
    z-index: 345;
}

#informationtext {
    position: absolute;
    left: 30%;
    top: 30%;
    width: 30%;
}

#informationtextfluegelzeug {
    padding: 1%;
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    left: 25%;
    top: 20%;
    width: 40%;
}

#informationtextimpressum {
    padding: 1%;
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    left: 3%;
    top: 3%;
    width: 80%;
}

#wendland {
    padding: 1%;
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    left: 35%;
    top: 10%;
    width: 30%;
}

#konzisdurch {
    padding: 1%;
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    left: 35%;
    top: 15%;
    width: 30%;
}