html {
  font-size: 10px;
}

div.toosmall{
         display: none;
}

body.index {
         background-color: #FFFFFF;
}
body.test {
         background-color: #FF00FF;
}
  
body.games {
         background-image: url("game_bg.svg");
         background-repeat: no-repeat;
         background-attachment: fixed;
         background-size: cover;
         align:center;
}
body.typo {
         background-image: url("typo_bg.svg");
         background-repeat: no-repeat;
         background-attachment: fixed;
         background-size: cover;
         align:center;
}

div.center {
         align:center;
}
iframe{
         display:block;
         margin:auto;
         border:0px #FFFFFF none;
         padding:0px;
}
iframe.index{
         background-color: #FFFFFF;
}
iframe.game{
         background: rgba(255, 255, 255, 0.0)
}

#impressum, #impressum_hover:hover{
         opacity: 1;
}
#impressum_hover, #impressum:hover{
         opacity: 0;
}

#bild, #bild_hover:hover{
         opacity: 1;
}
#bild_hover, #bild:hover{
         opacity: 0;
}

#game, #game_hover:hover{
         opacity: 1;
}
#game_hover, #game:hover{
         opacity: 0;
}

#foto, #foto_hover:hover{
         opacity: 1;
}
#foto_hover, #foto:hover{
         opacity: 0;
}

#typo, #typo_hover:hover{
         opacity: 1;
}
#typo_hover, #typo:hover{
         opacity: 0;
}

#Menue_auf:hover{
         opacity: 1;
}
#Menue_auf{
         opacity: 0;
}
#bild:hover, #game:hover, #foto:hover, #typo:hover, #main:hover{
         opacity: 1;
}

@media all and (max-width: 1000px), (max-height: 800px) {
         div.center{
                 display: none;
         }
         div.toosmall{
                display: block;
         }  
         
         p.toosmall{
                color: red;
                font-family: sans-serif;
                font-size: 5rem;
}
}

#zeug_hover, #zeug_hover_on{
    opacity: 0;
}
#zeug_hover:hover, zeug_hover_on:hover{
    opacity: 1;
}