body .content{
    background-color: var(--theme-light);
    height: fit-content;
    width: 100vw;

    --padding-left : 5vw;
    padding-left: var(--padding-left);
    padding-top: 5vh;
    padding-bottom: 10vw;
    box-shadow: 0px 0px 20px var(--theme-darker);
    p{
        color: var(--desc-text-color);
        margin: 1vw;
        margin-left: 0;
    }
    ul{
        list-style-type: square;
        color: var(--theme-dark);
    }
    li{
        width: 25vw;
        cursor: default;
    }
    li *{
        margin: 0;
    }
    li:hover{
        transform: translateX(10%);
    }
    .text-img{
        border-top: 2px solid var(--theme-dark);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 90vw;
        padding-top: 5vh;
        margin-top: 5vh;
        p{
            width: 30vw;
            margin-right: 10vw;
        }
        .img{
            border: 3px solid white;
            --img-length : 15vw;
            width: var(--img-length);
            height: var(--img-length);
            border-radius: 5px;
            overflow: hidden;
            display: grid;
            box-shadow: 0px 0px 20px white;
            img{
                width: var(--img-length);
                height: var(--img-length);
                object-fit: cover;
                grid-column: 1;
                grid-row: 1;
                z-index: 0;
            }
            .shadow{
                box-shadow: inset 0px 0px 3vw 1vw var(--theme-darker);
                grid-column: 1;
                grid-row: 1;
                width: 100%;
                height: 100%;
                z-index: 1;
            }

            *{
                transition-duration: 500ms;
            }

        }
        .img:hover{
            .shadow{
                box-shadow: inset 0px 0px 3vw 0 var(--theme-darker);
                z-index: 1;
            }
            img{
                transform: scale(102%);
                z-index: 0;
            }
        }
    }
}
body .separator{
    background-image: linear-gradient(var(--theme-light), var(--theme-dark));
    height: 10vh;
}
body .content.first-block{
    box-shadow: 0px 0px 20px var(--theme-light);
}
body .content.dark{
    background-color: var(--theme-dark);
}
