@font-face {
        font-family: Asinastra; src: url('../asinastra.ttf');
    }

    body {
        color: #5D3D2D;
        font-family: asinastra;
        scrollbar-color: white #5D3D2D;
        margin: 0px;
    }

    .container {
        margin: 0px 0px 0px 22px;
        height: 512px;
        overflow-y: scroll;
    }

    .gamecover, .cover {
        float: left;
        margin: 2px;
        border: 2px dashed #5D3D2D;
    }

    .cover {
        height: 166px;
        width: 166px;
    }

    .gamecover {
        margin-right: 4px;
    }
    .portrait, .landscape {
        position: relative;
        float: left;
        margin: 4px;
        border: 2px dashed white;
        height: 249px;
    }

    .landscape {
        height: 166px;
    }

    .artist {
        transition: .5s ease;
        opacity: 0;
        position: absolute;
        bottom: 0px;
        text-align: center;
        width: 217px;
        background-image: linear-gradient(to bottom, #00000000, #00000088, #00000088, #00000088);
        color: white;
        font-size: 16px;
        padding: 8px 16px;
    }

    .landscape:hover .artist, .portrait:hover .artist {
        opacity: 1;
    }

    .portrait .artist{
        width: 134px;
    }

    .game {
    border: 2px dashed #5D3D2D;
    display: inline-block;
    padding: 4px;
    width: 506px;
    margin: 4px 0px 4px 2px;
    }