html {
    cursor: default;
}

.info {
    font-size: 35px !important;
    text-align: center;
}

h2 {
    transition: 1.75s;
    transition-delay: 0.25s;
}

@media (max-width: 800px) {
    .middle-box {
        margin-left: 50px !important;
        margin-right: 50px !important;
    }

    .flex-within {
        font-size: 25px !important;

        .web-img {
            max-width: 150px !important;
            max-height: 150px !important;
            margin-right: 70% !important;
        }
    }

    h2 {
        margin-top: 10px;
        margin-bottom: 30px;
        transition-delay: 1s;
    }
}

@media (min-width: 2300px) {
    .middle-box {
        margin-left: 150px !important;
        margin-right: 150px !important;
    }

    .flex-within {
        font-size: 35px !important;

        .web-img {
            width: 400px !important;
            height: 400px !important;
            max-width: 400px !important;
            max-height: 400px !important;
            margin-right: 25% !important;
        }
    }
}

@font-face {
    font-family: UnifontEX;
    src: url('/assets/fonts/UnifontEX.ttf');
    /*https://www.fontspace.com/unifontex-font-f26370*/
}

.middle-box {
    margin-left: 100px;
    margin-right: 100px;
    transition: 0.5s;

    header {
        font-size: 40px;
    }
}

.flex-box {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

.flex-within {
    flex-grow: 2;
    flex-basis: content;
    max-width: 600px;
    margin: 5px;
    text-align: left;
    font-size: 20px;
    transition: 1s;

    .web-img {
        width: 200px;
        height: 200px;
        max-height: 200px;
        max-width: 200px;
        background-color: rgb(139, 139, 139);
        float: left;
        margin-right: 10px;
        border-radius: 5px;
        border: solid white 2px;
        -webkit-user-drag: none;
        user-select: none;
        -webkit-user-select: none;
        image-rendering: auto;
        transition: 1.5s;

        &.contributor {
            margin-top: 10px;
        }

        &.pixel {
            image-rendering: pixelated !important;
        }
    }

    .block-title {
        font-size: 28px;
        display: block;
        margin-left: 2%;
        margin-right: 2%;
        text-align: center;
        margin-bottom: -25px;
    }

    &.other-side {
        text-align: right;
    }

    &.single {
        max-width: 100%;
        text-align: center;
        flex-grow: 2;
    }
}

span[data-color=weaver] {
    color: #bbbcc4;
    text-shadow: 2px 2px #4d4e58;
}

span[data-cmcdev=c] {
    color: #fdf052;
    text-shadow: 2px 2px #bc6514;
}

span[data-cmcdev=m] {
    color: #c65c7c;
    text-shadow: 2px 2px #6a3c53;
}

span[data-cmcdev=c2] {
    color: #d8ad6c;
    text-shadow: 2px 2px #91673a;
}

span[data-cmcdev=dev] {
    color: #ccc5ff;
    text-shadow: 2px 2px #544b97;
}

span[data-color=discord] {
    color: white;
    text-shadow: 2px 2px #5765f2;
}

span[data-color=ghosts] {
    color: #b876e5;
    text-shadow: 2px 2px #9236d8;
}

span[data-color=jirachi6774] {
    color: #FDE28F;
    text-shadow: 2px 2px #675c3b;
}

span[data-color=shirokumo] {
    color: #bbbcc4;
    text-shadow: 2px 2px #4d4e58;
}

span[data-color=mitsuro] {
    color: #ecc865;
    text-shadow: 2px 2px #ec8c32;
}

span[data-color=mitoid] {
    color: #80c5e7;
    text-shadow: 2px 2px #3d6a80;
    text-decoration: overline #e390d4 5px;
}

span[data-color=cocojuju] {
    color: #a3e5ff;
    text-shadow: 2px 2px #465a7f;

    span[data-color=mudkip] {
        color: #ffa662;
        text-shadow: 2px 2px #ff9549;
        user-select: none;
    }
}

span[data-color=aleiza] {
    color: #c6c6c6;
    text-shadow: 2px 2px #4f4c67;
}

span[data-color=ray] {
    color: #f0a139;
    text-shadow: 2px 2px #d76346;
}

span[data-color=spenz] {
    color: #ca5c89;
    text-shadow: 2px 2px #742646;
}

span[data-color=alsnapz] {
    color: #767ffd;
    text-shadow: 2px 2px #4b5ae9;
}

span[data-color=soulcatcher] {
    color: #f2f1df;
    text-shadow: 2px 2px #7e8a85;
}

span[data-color=soraime] {
    color: #4bbaba;
    text-shadow: 2px 2px #3a6a7c;
}