:root { /*Can not use CSS vars on media queries so remember updating all repeated sizes on this file*/
    --vl-height-carrousel:   890px;
    --vl-width-list:         511px;
    --vl-width-intermediate: 728px;
}

@media (width < 1600px) {
    #body__profile_photo {
        top: 40px;
    }
}
@media (width < 728px) {
    body {
        overflow-y: visible;
    }
    h1 {
        position: fixed;
        top: 20px;
    }
    #body__profile_photo {
        top: 10px;
        width: 100px;
    }
    .body__profile_photo_img {
        outline-width: 4px;
    }
    #projects_carrousel__techs_coontainer {
        position: absolute;
        top: 20px;
        margin: 0;
        padding: 0;
        left: auto;
        right: -200px;
        width: 400px;
        background: none;
    }
    #projects_carrousel__languages {
        height: fit-content;
        width: fit-content + 100%;
        letter-spacing: 3px;
        background-color: rgb(117, 117, 117);
        border-radius: 15px;
        opacity: 0.4;
    }
    .projects_carrousel_language_first,
    .projects_carrousel_language {
        min-width: fit-content;
        padding: 0;
    }
    .projects_list_view__list_view_element {
        position: absolute;
        height: 1px;
    }
}
@media (width >= 511px) {
    #projects_list_view {
        visibility: hidden;
    }
}
@media (width < 511px) {
    #projects_carrousel {
        visibility: hidden;
    }
    h1 {
        position: absolute;
        top: 360px;
        margin: 0 auto;
        left: 0;
        right: 0;
    }
    #body__profile_photo {
        top: 140px;
        width: 180px;
    }
    #project_carrousel_selector__left,
    #project_carrousel_selector__right {
        visibility: hidden;
    }
    #projects_carrousel__techs_coontainer {
        visibility: hidden;
    }
    .projects_list_view__list_view_element {
        position: relative;
        height: fit-content;
    }
    #header_helper__middle-view_scroll_down {
        visibility: hidden;
    }
}
@media (width < 430) {
    .projects_list_view_languages_container {
        height: 1000px;
    }
}
@media (width < 329px) {
    h1 {
        width: fit-content;
        font-size: 30px;
    }
    #body__profile_photo {
        width: 60vw;
    }
    .projects_list_view_languages {
        justify-content: space-around;
    }
}

@media (height < 890px) and (width > 511px) {
    h1 {
        position: fixed;
        top: 0;
        left: 0;
    }
    #projects_carrousel__techs_coontainer {
        top: 0;
        right: 0;
    }
    #body__profile_photo {
        position: fixed;
        width: 10vw;
        margin: 0;
        top: auto;
        bottom: 20px;
        left: 20px;
        right: auto;
    }
    .body__profile_photo_img {
        outline-width: 2px;
    }
    .header_helper__middle-view_scroll {
        visibility: visible;
    }
}