body{
    background: white;
}
a{
    color:#11aab0;
    text-decoration:none;
    transition: all 280ms;
    margin: 0 0.2em;
    display: inline-block;
    cursor: pointer;
}
a:hover, a.hover{
    text-shadow: 0 0 0.8em #11aab0;
    transform: scale(1.19);
}
a:active{
    
    transition: all 80ms;
    transform: scale(1.1);
}
body{
    text-align:center;
    font-family:  "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    animation: fadeIn 1000ms ease-in-out;
}

h3{
    margin-bottom:0;
}

#livestream{
    margin-top:2rem;
    font-size:2em;
}
#livestream b{
    color: red;
}

.streaming{
    margin-top:1em;
    font-size:2em;
}
.row{
    color: green;
}
.row a:hover{
    transform: scale(1.15);
}
.row a:active{
   transform: scale(1.05);
}
#addcontent{
    font-size:1.4em;
}
#upnext{
    margin-top:2rem;
    font-size:1.3em;
}
#upnext a img, #watchlater a img, #beliebt a img{
    max-height:7em;
    max-width:8em;
    margin-left:1em;
    box-shadow: 0 0 0.5em grey;
}
#upnext a:first-of-type img{
    max-height:40vh;
    max-width:50vh;
    position: relative;
    top: 1em;
    box-shadow: 0 0 1em grey;
}

#watchlater{
    margin-top:2rem;
}

#beliebt{
    margin-top:2rem;
    font-size:1.5em;
}
#beliebt a img{
    max-height:8em;
    max-width:9em;
    margin-top:0.5em;
    animation: fadeInUp 2000ms ease-in-out;
}
.footer{
    font-size: 1.5em;
    margin-top:20vh;
    margin-bottom:15vh;
}
.footer a:first-of-type{
    margin-top:0.6em;
}


#trailer #trailerframe,#contentbrowser #contentbrowserframe{
    height:60vh;
    width:107vh;
    max-width:90vw;
}
#trailer, #contentbrowser{
    transition: all 2000ms;
    height:0vh;
    overflow: hidden;
}
#trailer.show,#contentbrowser.show{
    height: 60vh;
}

a.highlight{				
	animation: jump-highlight 500ms 15 ease-in-out; 
}

@keyframes jump-highlight {
	0% {position:relative;top:0}
	50% {position:relative;top:0.5em}
	100% {position:relative;top:0}
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 0;
    }
    
    100% {
        opacity: 1;
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(0.5);
    }
    88% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: translateY(1);
    }
}