body, html {
    background-color: #333333;
    color: #FFFFFF;
}

.mediaPlayerContainer {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
}

.mediaPlayer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.appearingElement {
    -webkit-animation: appear 300ms ease;
    animation: appear 300ms ease;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

.disappearingElement {
    -webkit-animation: disappear 300ms ease;
    animation: disappear 300ms ease;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

.invisible {
    display: none;
}

.navicon {
    height: 60px;
    width: 60px;
    filter: brightness(90%);
}

.navicon:hover {
    filter: brightness(100%);
}

.releaseThumbnail {
    background-color: #ffffff;
    cursor: pointer;
    width: 100%;
}

@-webkit-keyframes appear
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}
@keyframes appear
{
    0%
    {
        opacity: 0;
    }
    100%
    {
        opacity: 1;
    }
}

@-webkit-keyframes disappear
{
    0%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0;
    }
}
@keyframes disappear
{
    0%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0;
    }
}

@-webkit-keyframes plop
{
    25%
    {
        -webkit-transform: scale(1.015);
        transform: scale(1.015);
        opacity: 0.90;
    }
    100%
    {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
}
@keyframes plop
{
    25%
    {
        -webkit-transform: scale(1.015);
        transform: scale(1.015);
        opacity: 0.90;
    }
    100%
    {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1;
    }
}

.releaseThumbnail:hover {
    -webkit-animation: plop 1s ease;
    animation: plop 1s ease;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;

    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}