:root {
        --padding-multiplier: 3;
        --padding-multiplier-real: calc(var(--padding-multiplier) - 1);
}

@media (max-width: 1900px) {
        :root {
                --padding-multiplier: 1 !important;
        }
}

.Categories {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 1rem;
}

.Categories>* {

        aspect-ratio: 1 / 1;
        box-shadow: 0px 0px 3px var(--primary-fg-color);
        width: 200px;
        text-align: center;
        transition: box-shadow 0.75s linear;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;

}

.Categories>* span {
        /* text-shadow: 0px 0px 5px var(--primary-fg-color-inverted); */
        background-color: var(--primary-bg-color);
}

.Categories>*:hover {
        box-shadow: 0px 0px 20px var(--primary-fg-color) !important;
        transition: box-shadow 0.75s linear;
}

.Categories>*>* {
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        justify-items: center;
        align-items: center;
        align-content: center;
}

.main_view>img {
        max-width: min(600px, calc(100vw - 2* var(--padding-from-sides)));
        height: auto;
        box-shadow: 0px 0px 3px var(--primary-fg-color);
}

.main_view>p {
        max-width: 300px;
        height: fit-content;
        box-shadow: 0px 0px 3px var(--primary-fg-color);
}

.main_view {
        display: flex;
        gap: var(--padding-from-sides);
        margin-top: var(--padding-from-sides);
        margin-bottom: var(--padding-from-sides);
        ;
}

@media (max-width: 920px) {
        .main_view {
                flex-direction: column;
        }

        .main_view>p {
                margin-bottom: var(--padding-from-sides);
        }
}

body {
        font-size: 20px;
}

.description {
        margin-left: calc(var(--padding-from-sides)*var(--padding-multiplier-real));
        margin-right: calc(var(--padding-from-sides)*var(--padding-multiplier-real));
}

.description h2 {

        font-size: 30px;
        font-weight: bold;

}

h1 {
        /* margin-left: calc(calc(50%) + var(--padding-from-sides)); */
        padding-left: 0;
        box-sizing: border-box;
        display: none !important;
}

main>h1 {
        display: block !important;
        margin-bottom: var(--padding-from-sides);
}


.description li::before {
        content: "• ";
}

.description * {
        max-width: calc(100vw - 2* (var(--padding-from-sides)*var(--padding-multiplier))) !important;
        box-sizing: border-box;
        overflow-wrap: break-word;
}

.description *:not(iframe) {
        height: auto;
        /* fix youtube iframes */
}

.description img {
        margin-top: 5px;
        box-shadow: 0px 0px 3px var(--primary-fg-color);
}

main>a {
        font-size: 40px;
        font-style: bold;
}