:root {
    /*custom*/
    /*--header-height: 3rem;*/
    /* 100px || 1920 || 5.208vw */
    --header-height: 100px;
    /*custom*/
    /*--nav-width: 68px;*/
    /*90px 1920*/
    --nav-width: 4.688vw;
    --first-color: #011C26;
    --first-color-light: #03CEA4;
    --white-color: #FFFFFF;
    --body-font: 'Signika', sans-serif;
    /* 16px / 1rem / 1920 / 0.833vw*/
    --normal-font-size: 16px;
    --z-fixed: 100
}

*,
::before,
::after {
    box-sizing: border-box
}

body {
    position: relative;
    margin: var(--header-height) 0 0 0;
    /*padding: 0 1rem;*/
    padding-left: 32px;
    padding-right: 32px;
    font-family: var(--body-font);
    font-size: var(--normal-font-size);
    /*transition: .5s;*/
    /*custom*/
    background:#011C26
}

a {
    text-decoration: none
}

.header {
    width: 100%;
    height: var(--header-height);
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*padding: 0 1rem;*/
    padding: 0 31px;/*custom*/
    /*custom*/
    /*background-color: var(--white-color);*/
    background-color: transparent;
    z-index: var(--z-fixed);
    /*transition: .5s*/
}

.header_toggle {
    color: var(--first-color);
    font-size: 1.5rem;
    cursor: pointer
}

/* 41px dimensione prototipo per icona utente header */
/* 39px dimensione prototipo per icona utente in card */
.header_img {
    width: 41px;
    height: 41px;
    /*
    display: flex;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden
    */
}

.l-navbar {
    position: fixed;
    top: 0;
    left: -30%;
    /*custom*/
    /*width: var(--nav-width);*/
    width: 100vw;
    height: 100vh;
    background-color: var(--first-color);
    /*custom*/
    /*padding: .5rem 1rem 0 0;*/
    padding-top: 38px;
    /*transition: .5s;*/
    z-index: var(--z-fixed);
    /*custom*/
    box-shadow: 20px 0px 50px #A2A2A229
}

.header_toggle{
    color: white !important;
}

/*
.toogle-open{
    z-index:101 !important;
    position: absolute;
    left: 365px;
}
*/
.toogle-open{
    z-index: 101 !important;
    position: absolute;
    font-size: 37px;
    left: 328px;
    top: 40px;
}

.toogle-z-index{
    z-index: 99 !important;
}

.nav {
    height: 100%;
    width:100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    align-content: center;
}

.nav_logo,
.nav_link {
    display: grid;
    grid-template-columns: max-content max-content;
    align-items: center;
    column-gap: 1rem;
    padding-top: 0.5rem;
    padding-right: 0px;
    padding-bottom: 40px;
    /*custom*/
    /*padding-left: 1.5rem;*/
    padding-left: 32px;
}

.nav_logo {
    margin-bottom: 2rem
}


.nav_logo{
    /*15px 390 */
    padding-top: 3.846vw !important;
    /* manual */
    padding-left: 5.6vw !important;
    /*76px 390 */
    padding-bottom: 19.487vw !important;
}

.nav_logo-icon {
    /*custom*/
    /*font-size: 1.25rem;*/
    font-size: 46.58px;
    /*custom*/
    /*color: var(--white-color)*/
    color: var(--first-color-light);
}

.nav_logo-name {
    /*custom*/
    /*color: var(--white-color)*/
    color: var(--first-color-light);
    font-weight: 700
}

.nav_link {
    position: relative;
    /*custom*/
    /*color: var(--first-color-light);*/
    /*color: var(--white-color);*/
    /*transition: .3s*/
    margin-bottom: 1.5rem;
    filter: brightness(0) invert(1);
}
/*
.nav_link:hover {
    //custom
    //color: var(--white-color)
    //color: var(--first-color-light);
    //transition-delay: 0;
    //filter: inherit;
}
*/

.nav_icon {
    /*custom*/
    /*font-size: 1.25rem*/
    font-size: 26.32px;
}

.show {
    left: 0 !important;
}

.body-pd {
    padding-left: calc(var(--nav-width) + 1rem);
}

.active {
    /*custom*/
    /*color: var(--white-color)*/
    /*color: var(--first-color-light);*/
    filter: inherit;
}

#nav-bar .active{
    /*filter: brightness(0) invert(1);*/
    /*transition-delay: 0;*/
    filter: inherit;
}

.nav_logo img{
    /*46.58px 390 */
    width: 11.944vw!important;
}

.nav-home{
    /*26.32px 390 */
    width: 6.749vw;
}

.nav-map{
    /*22.78px 390 */
    width: 6.767vw;
}

.nav-tour{
    /*26.39px 390 */
    width: 6.767vw;
}

.nav-brick{
    /*26.39px 390 */
    width: 6.767vw;
}


.sidebar-item-box p{
    visibility: visible;
}

.nav_link.active .sidebar-item-box p{
    color: #03CEA4;
}

.nav_link .sidebar-item-box p{
    color: #FFFFFF;
}

.sidebar-item-box{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sidebar-item-box p{
    font-family: 'Signika', sans-serif;
    font-weight: 400;
    font-size:11px;
}

/*custom*/
/*
.active::before {
    content: '';
    position: absolute;
    left: 0;
    width: 2px;
    height: 32px;*/
    /*custom*/
    /*background-color: var(--white-color)*/
    /*background-color: var(--first-color-light)
}*/

@media (min-width: 768px) {

    .header{
        padding-left: calc(var(--nav-width) + 1rem);
        padding-right: calc(var(--nav-width) + 1rem);
    }

    .header_toggle {
        font-size: 1.8rem;
    }

    .toogle-open{
        z-index: 101 !important;
        position: absolute;
        font-size: 37px;
        left: initial;
        top: 40px;
        right: 40px;
    }

    .nav_logo,
    .nav_link {
    display: flow-root;
    padding-left: initial !important;
    /* 140px || 1024 */
    padding-bottom: 13.672vw;
    }

    .nav_logo {
        padding-bottom: 16.487vw !important;
    }

    .nav_logo img{
        /*46.58px 390 */
        width: 9.944vw!important;
    }

    .sidebar-item-box p{
        /*21px 1024 */
        font-size: 2.051vw;
    }

    .nav-home{
        /*26.32px 390 */
        width: 5.749vw;
    }

    .nav-map{
        /*22.78px 390 */
        width: 5.767vw;
    }

    .nav-tour{
        /*26.39px 390 */
        width: 5.767vw;
    }

    .nav-brick{
        /*26.39px 390 */
        width: 5.767vw;
    }
}

.body-pd .logo-header-mobile{
    display: none !important;
}

.body-pd .toor-dropdown-user{
    display: none !important;
}

.body-pd .toor-header-search-bar{
    display: none !important;
}

.body-pd .top-header-bar {
    background-color: rgba(1, 29, 40, 0.0) !important;
}

.body-pd .header-brick{
    background-color: rgba(1, 29, 40, 0.0) !important;
}

.body-pd .header-tour{
    background-color: rgba(1, 29, 40, 0.0) !important;
    box-shadow: none !important;
}

.body-pd .header-tour-box-close-icon{
    display: none !important;
}

.body-pd .header-brick-box{
    display: none !important;
}

#main{
    height: calc(100% - var(--header-height));
}

@media screen and (min-width: 1200px) {
    body {
        margin: calc(var(--header-height) + 1rem) 0 0 0;
        padding-left: calc(var(--nav-width) + 2rem);
        /*custom*/
        padding-right: calc(var(--nav-width) - 1.8rem)
    }

    .header {
        /*custom*/
        /*height: calc(var(--header-height) + 1rem);*/
        padding-left: var(--nav-width);
        padding-right: 31px;
        /*padding: 0 2rem 0 calc(var(--nav-width) + 2rem);*/
    }

    .body-pd {
        padding-left: calc(var(--nav-width) + 188px)
    }

    /*custom*/
    /*
    #main{
        height: calc(100vh - calc(var(--header-height) + 1rem));
    }
    */

    .l-navbar {
        left: 0;
        width: var(--nav-width);
        /*custom*/
        /*padding: 1rem 1rem 0 0*/
        padding-top: 39px;
    }

    /*.show {
        width: calc(var(--nav-width) + 156px)
    }*/

    .nav {
        align-content: start;
    }

    .nav_logo,
    .nav_link {
    display: grid;
    grid-template-columns: max-content max-content;
    align-items: center;
    column-gap: 1rem;
    padding-right: 0px;
}

    .nav_logo{
        padding-top:0 !important;
        /*22px 1920 */
        padding-left: 1.146vw !important;
        /*18px 1920 */
        padding-bottom: 0.938vw !important;
    }

    .nav_logo img{
        /*46.58px 1920 */
        width:2.426vw !important;
    }

    .nav_link{
    /*32px 1920 */
    padding-left: 1.667vw !important;
    /*8px 1920 */
    padding-top: 0.417vw !important;
    /*40px 1920 */
    padding-bottom: 2.083vw !important;
    }

    .nav_link.home{
        padding-left: 1.567vw !important;
    }

    .nav_link.map{
        padding-left: 1.267vw !important;
    }

    .nav-home{
        /*26.32px 1920 */
        /*width:1.371vw;*/
        width:1.374vw;
    }

    .nav-map{
        /*22.78px 1920 */
        width:1.186vw;
    }

    .nav-tour{
        /*26.39px 1920 */
        width:1.374vw;
    }

    .nav-brick{
        /*26.39px 1920 */
        width:1.374vw;
    }

    .sidebar-item-box{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .sidebar-item-box p{
        font-family: 'Signika', sans-serif;
        font-weight: 400;
        font-size:11px;
    }

    .sidebar-item-box p{
        visibility: hidden;
    }

    .nav_link.active:hover .sidebar-item-box p{
        visibility: visible;
        color: #03CEA4;
    }

    .nav_link:hover .sidebar-item-box p{
        visibility: visible;
        color: #FFFFFF;
    }
}