body {
    background-image: url(Bilder/therisingoftheshieldhero.jpg);
    background-size: cover;
    background-attachment: fixed;
    width: 800px;
    margin: auto;
}
header{
    text-align: center;
    color: white;
    font-family: 'Dancing Script', cursive;
    text-shadow: 3px 3px black;
    margin: 50px 50px 20px 50px
}
header h1{
    background-image: linear-gradient(to right, rgba(219, 153, 105, 85%), rgba(230, 203, 184, 85%));
    width: 150px;
    height: 50px;
    border-radius: 50px;
    margin: auto;
}
nav{
    background: rgba(219, 153, 105, 85%);
    width: 800px;
    height: 30px;
    padding: 15px 0 0 0;
    text-align: center;
    font-family: 'Source Sans Pro', sans-serif;
    border-radius: 15px 15px 0 0;
}
nav a{
    text-decoration: none;
    font-family: 'Source Sans Pro', sans-serif;
    color: white;
    text-shadow: 1px 1px black;
    padding: 1px 10px 1px 10px;
    border: 5px solid #ffffff;
    border-radius: 5px;
    animation: navmouseout 1s forwards;
}
nav a:hover{
    animation: nav 1s forwards;
}
.active{
    box-shadow: 3px 3px #000000;
}
main h2{
    font-family: 'Dancing Script', cursive;
    color: white;
    text-shadow: 1px 1px black;
    text-align: center;
}
main {
    background-image: radial-gradient(rgba(230, 203, 184, 85%) 50%, rgba(219, 153, 105, 85%));
    padding: 15px;
}
main a {
    font-family: 'Source Sans Pro', sans-serif;
    color: white;
    text-shadow: 1px 1px black;
}
main h3{
    font-family: 'Source Sans Pro', sans-serif;
    color: white;
    text-shadow: 1px 1px black;
}
main li{
    font-family: 'Source Sans Pro', sans-serif;
    color: white;
    text-shadow: 1px 1px black;
}
.oldvsnew{
    padding: 10px;
    border-radius: 25px;
}
.varkanjaghittaanime{
    height: 920px;
}
.crunchyrolllogo{
    max-height: 107px;
    float: right;
}
div.crunchyroll{
    padding: 0px 5px 0px 5px;
    border: 5px solid orange;
    border-radius: 0 25px;
    margin: 0;
}
.funimationlogo{
    max-height: 143px;
    float: left;
}
div.funimation{
    padding: 0px 5px 0px 5px;
    border: 5px solid darkblue;
    border-radius: 25px 0;
    margin: 0;
}
div.funimation h3{
    padding: 0 0 0 254.22px
}
.wakanimlogo{
    float: right;
    padding: 0 5px 0 5px;
    max-height: 107px
}
div.wakanim{
    padding: 5px 5px 20px 5px;
    border: 5px solid red;
    border-radius: 0 25px;
    margin: 0;
}
footer {
    background: rgba(219, 153, 105, 85%);
    width: 800px;
    height: 50px;
    border-radius: 0 0 15px 15px;
    margin: 0 0 50px 0;
    text-align: center;
    padding: 25px 0 0 0;
}
footer a{
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 25px;
    color: white;
    text-shadow: 2px 2px black;
}
.animegenrer footer a{
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 25px;
    color: white;
    text-shadow: 2px 2px black;
}
@keyframes nav{
    0%{
    }
    25%{
    box-shadow: 1.5px 1.5px #bfbfbf;
    }
    50%{
    box-shadow: 2px 2px #808080;
    }
    75%{
    box-shadow: 2.5px 2.5px #404040;
    }
    100%{
    box-shadow: 3px 3px #000000;
    margin: 0 8px 0 8px;
    }
}
@keyframes navmouseout{
    0%{
    box-shadow: 3px 3px #000000;
        margin: 0 8px 0 8px;
    }
    25%{
    box-shadow: 2.5px 2.5px #404040; 
    }
    50%{
    box-shadow: 2px 2px #808080;
    }
    75%{
    box-shadow: 1.5px 1.5px #bfbfbf;   
    }
    100%{
    }
}

@media screen and (max-width:700px){
    body{
        width: 400px;
    }
    nav a{
        font-size: 25px;
    }
}