.SS_STD .prezrti-shell,
.SS_STD.prezrti-shell {
    --shell_side_L: calc((100vw - var(--space_92)) / 2);
}
/* =========================================================
   SS_STD — novi sistem
   Vsi page-specific classi imajo predpono ss_.
   ========================================================= */
.SS_STD,
.SS_STD *,
.SS_STD *::before,
.SS_STD *::after {
    box-sizing: border-box;
}
    /*  stranski menu */

    h5 {
        color: var(--color_LunarGreen);
        font-family: var(--font_Roboto);
    }

    .SS_STD .ss_navigation {
        position: absolute;
        right: 0;
        display: flex;
        background-color: var(--color_LightCyan);
        width: 60%;
        height: 100%;
    }

    .SS_STD .ss_navigation_center {
        padding-top: var(--space_2);
    }

.SS_STD .ss_navigation_top {
    position: absolute;
    display: flex;
    top: 0;
    right: var(--space_8);
    width: var(--space_52);
    height: var(--space_40);
    background-color: var(--color_White);
}

    .SS_STD .ss_navigation_top > a {
        display: block;
        width: 100%;
        height: 100%;
        text-decoration: none;
    }

        .SS_STD .ss_navigation_top > a div:first-child {
            position: absolute;
            bottom: calc(0px - var(--space_4) * 1.2);
            right: 0;
            font-family: var(--font_Rockit);
            font-size: var(--font_size_32);
            color: var(--color_LighterCyan);
        }

        .SS_STD .ss_navigation_top > a div:last-child {
            position: absolute;
            bottom: calc(0px - var(--space_4));
            right: 0;
            font-family: var(--font_Rockit);
            font-size: var(--font_size_24);
            color: var(--color_LightCyan);
        }

    .SS_STD .ss_navigation_center {
        position: absolute;
        display: flex;
        flex-direction: column;
        top: var(--space_40);
        left: 0;
        width: 100%;
        height: calc(80vh - var(--space_20));
    }

.SS_STD .ss_navigation_link {
    width: 100%;
    height: var(--space_18);
    margin-top: var(--space_4);
    margin-bottom: var(--space_4);
    padding-left: var(--space_4);
    padding-right: var(--space_8);
    border-top: 1px solid var(--color_LunarGreen);
    border-bottom: 1px solid var(--color_LunarGreen);
}

        .SS_STD .ss_navigation_link a {
            display: flex;
            flex-direction: row;
            height: 100%;
            justify-content: end;
        }

            .SS_STD .ss_navigation_link a:hover {
                font-weight: 500;
            }

            .SS_STD .ss_navigation_link a img {
                height: 100%;
                width: auto;
            }

    .SS_STD [class^="ss_navigation_text_"] {
        position: relative;
        width: var(--space_52);
        padding-left: var(--space_2);
        padding-top: var(--space_0_8);
    }
.SS_STD .ss_navigation_text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(var(--space_4) * 13.5);
    min-width: 0;
    height: 100%;
    padding-inline-start: var(--space_2);

}

    /* =========================================================
   SS_STD - NAVIGATION BUTTON IMAGES
   ========================================================= */

    .SS_STD .ss_navigation_text::before {
        content: "";
        display: block;
        flex: 0 0 auto;
        width: 100%;
        height: var(--space_6);
        background-repeat: no-repeat;
        background-position: left center;
        background-size: contain;
    }

    .SS_STD .ss_navigation_text > span {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .SS_STD .ss_navigation_text h5 {
        margin: 0;
    }


/* 01 - ČLANI */

.SS_STD .ss_navigation_text_1::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-01-skupek-gumb.webp");
}

.SS_STD .ss_navigation_link > a:hover .ss_navigation_text_1::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-01-skupek-gumb-hover.webp");
}


/* 02 - SVEŽE */

.SS_STD .ss_navigation_text_2::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-02-sveze-gumb.webp");
}

.SS_STD .ss_navigation_link > a:hover .ss_navigation_text_2::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-02-sveze-gumb-hover.webp");
}


/* 03 - SEBI TA DAN */

.SS_STD .ss_navigation_text_3::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-03-sebi-gumb.webp");
}

.SS_STD .ss_navigation_link > a:hover .ss_navigation_text_3::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-03-sebi-gumb-hover.webp");
}


/* 04 - GALERIJA */

.SS_STD .ss_navigation_text_4::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-04-galerija-gumb.webp");
}

.SS_STD .ss_navigation_link > a:hover .ss_navigation_text_4::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-04-galerija-gumb-hover.webp");
}


/* 05 - ŠTACUNA */

.SS_STD .ss_navigation_text_5::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-05-starcuna-gumb.webp");
}

.SS_STD .ss_navigation_link > a:hover .ss_navigation_text_5::before {
    background-image: url("/media/images/layout/ss_std/5s-menu-05-starcuna-gumb-hover.webp");
}


    .SS_STD .ss_page {
        position: relative;
        padding: 0;
    }

    .SS_STD .ss_header {
        height: var(--space_40);
        display: flex;
        flex-direction: row;
    }

    .SS_STD .ss_header_title {
        top: 0;
        margin-left: var(--space_8);
        height: var(--space_40);
        background-color: var(--color_LightCyan);
        width: var(--space_56);
        color: var(--color_White);
        position: relative;
    }
        .SS_STD .ss_header_title span {
            position: absolute;
            font-family: var(--font_Rockit);
            bottom: calc(var(--space_4)* -1);
            right: 0;
            font-size: var(--font_size_28);
            z-index: 10;
        }

    .SS_STD .ss_header_details {
        display: block;
        width: calc(var(--space_4) * 15);
        padding-left: var(--space_4);
        padding-top: var(--space_2);
    }

        .SS_STD .ss_header_details > a {
            display: block;
            width: 100%;
        }

        .SS_STD .ss_header_details a h5 {
            padding-bottom: var(--space_0_6);
            font-family: var(--font_Roboto);
            font-size: var(--font_size_16);
        }

        .SS_STD .ss_header_details .active h5 {
            color: var(--color_Red);
        }

    .SS_STD .ss_content {
        position: relative;
        margin-top: var(--space_6);
        padding-left: var(--space_8);
        width: calc((100vw - var(--space_92)) * 0.5);
        font-family: var(--font_Roboto);
        overflow-y: auto;
        height: calc(100vh - var(--space_40));
        padding-bottom: var(--space_8);
    }

        .SS_STD .ss_content::-webkit-scrollbar {
            display: none;
        }

        .SS_STD .ss_content h3 {
            color: var(--color_Red);
            padding-bottom: var(--space_3_2);
        }

        .SS_STD .ss_content p {
            color: var(--color_LunarGreen);
            font-size: var(--font_size_16);
            font-weight: 500;
            text-align: justify;
            padding-right: var(--space_8);
        }

        .SS_STD .ss_content > * {
            padding-top: var(--space_2);
            padding-bottom: var(--space_2);
        }

    .SS_STD .ss_content_0 {
        height: 0rem;
        padding-top: 0;
        padding-bottom: 0;
    }

    .SS_STD .ss_content_gray {
        width: calc((100vw - var(--space_92)) * 0.5);
        margin-left: calc(var(--space_4) * -2);
        padding-top: calc(var(--space_4) * 0.6);
        padding-left: var(--space_8);
        background-color: var(--color_DirtyBlue);
        min-height: calc(var(--space_4) * 4.375);
    }

        .SS_STD .ss_content_gray p {
            padding-top: var(--space_2);
            padding-bottom: var(--space_2);
            position: relative;
            font-size: var(--font_size_14);
            width: calc(var(--space_4)* 21);
        }

            .SS_STD .ss_content_gray p span {
                position: absolute;
                left: calc(var(--space_4) * 6.7);
            }

        .SS_STD .ss_content_gray span {
            font-weight: 700;
        }

    .SS_STD .ss_content > div:nth-child(2) img {
        width: calc(var(--space_4) * 21);
        height: auto;
        /* max-height: var(--space_52); */
    }

    .SS_STD .ss_content .ss_form {
        display: flex;
        height: var(--space_18);
        padding-top: 0;
        padding-bottom: 0;
    }

        .SS_STD .ss_content .ss_form div a img {
            height: 100%;
            width: auto;
        }

        .SS_STD .ss_content .ss_form > div {
            padding: var(--space_1_2);
        }

        .SS_STD .ss_content .ss_form:nth-child(even) {
            margin-left: calc(var(--space_4) * -2);
            background-color: var(--color_DirtyBlue);
            width: calc((100vw - var(--space_92)) * 0.5);
        }

            .SS_STD .ss_content .ss_form:nth-child(even) div:first-child {
                padding-left: calc(var(--space_4) * 2.3);
            }

    .SS_STD .ss_content .ss_new {
        position: relative;
        display: flex;
        padding-top: var(--space_1_2);
        padding-bottom: var(--space_1_2);
    }

    .SS_STD .ss_news_item {
        display:flex;
    }

.SS_STD .ss_content .ss_news_item a {
    position: absolute;
    display: flex;
    left: calc(var(--space_4) * 9.5);
}

.SS_STD .ss_content > .ss_content_spacer_albums {
    padding-top: 0;
    padding-bottom: 0;
}

.SS_STD .ss_content .ss_content_link {
    display: flex;
    justify-content: space-between;
    padding-top: 0;
}

.SS_STD .ss_content .ss_product {
    display: flex;
    flex-direction: row;
    height: var(--space_18);
    padding-top: var(--space_0_4);
    padding-bottom: var(--space_0_4);
    font-size: var(--font_size_14);
    line-height: calc(var(--space_4) * 0.86);
}

    .SS_STD .ss_content .ss_product img {
        height: 100% !important;
        width: auto !important;
    }

    .SS_STD .ss_content .ss_product > div:last-child {
        padding-left: var(--space_8);
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
    }

        .SS_STD .ss_content .ss_product > div:last-child > div:last-child {
            display: flex;
            flex-direction: row;
            padding-top: var(--space_0_8);
        }

        .SS_STD .ss_content .ss_product > div:last-child > div:nth-child(2) {
            padding-top: var(--space_0_6);
        }

    .SS_STD .ss_content .ss_content_gray > div:last-child > div:nth-child(2) {
        margin-top: calc(var(--space_4) * -0.5);
    }

.SS_STD .ss_content .ss_product > div:last-child > div:last-child input {
    margin-top: calc(var(--space_4) * -0.2);
}

.SS_STD .ss_content .ss_product > div:last-child > div:last-child div:first-child {
    padding-right: var(--space_2);
}

.SS_STD .ss_content .ss_product span {
    color: var(--color_Red);
    left: var(--space_8) !important;
    font-weight: 500;
}

    .SS_STD .ss_content .ss_address {
        display: flex;
        flex-direction: row;
        position: relative;
    }

        .SS_STD .ss_content .ss_address div:first-child {
            width: var(--space_24);
            text-align: right;
            padding-right: var(--space_6);
        }

        .SS_STD .ss_content .ss_address input {
            width: calc(var(--space_4) * 11.5);
        }

        .SS_STD .ss_content .ss_address .ss_choose a {
            height: var(--space_6);
            background-color: var(--color_LightCyan);
            padding: var(--space_2);
        }

    .SS_STD .ss_content .ss_new > a {
        left: calc(var(--space_4)*7.5);
    }
  
    .SS_STD .ss_content_galery {
        position: relative;
        margin-top: var(--space_6);
        padding-left: var(--space_8);
        width: calc((100vw - var(--space_92)) * 0.5);
        font-family: var(--font_Roboto);
        overflow-y: scroll;
        height: calc(100vh - var(--space_40));
        padding-bottom: var(--space_8);
    }

    .SS_STD .ss_content_galery .form {
        display: flex;
        height: var(--space_18);
        padding-top: 0px;
        padding-bottom: 0px;
    }

        .SS_STD .ss_content_galery .form div {
            padding: var(--space_1_2);
        }

            .SS_STD .ss_content_galery .form div a img {
                height: 100%;
                width: auto;
            }

        .SS_STD .ss_content_galery .form:nth-child(even) {
            margin-left: calc(var(--space_4) * -2);
            background-color: var(--color_DirtyBlue);
            width: calc((100vw - var(--space_92)) * 0.5);
        }

            .SS_STD .ss_content_galery .form:nth-child(even) div:first-child {
                padding-left: calc(var(--space_4) * 2.3);
            }

@media only screen and (max-width: 64em) /*769-1024px*/ {
    .SS_STD .ss_navigation {
        width: 100%;
    }

    .SS_STD .ss_navigation_top {
        right: var(--space_8);
        width: var(--space_40);
    }

    .SS_STD .ss_navigation_link {
        height: var(--space_22);
        padding-left: var(--space_8);
        padding-right: var(--space_8);
    }

    .SS_STD [class^="ss_navigation_link_text_"] div {
        height: 35%;
    }

    .SS_STD .ss_navigation_text_2 span {
        font-size: var(--font_size_24);
    }

    .SS_STD .ss_content {
        height: calc(80vh - var(--space_40));
    }

        .SS_STD .ss_content,
        .SS_STD .ss_content .ss_content_gray {
            width: calc(100vw - var(--space_4)* 22);
        }
}

@media only screen and (max-width: 48em) /*481-768px*/ {
        .SS_STD .ss_navigation {
            width: 100%;
        }

        .SS_STD .ss_navigation_top {
            height: var(--space_20);
            width: var(--space_40);
        }

        .SS_STD .ss_navigation_center {
            top: var(--space_20);
        }

        .SS_STD .ss_navigation_link {
            width: 100%;
            flex: 1;
            margin-top: var(--space_4);
            margin-bottom: var(--space_4);
            padding-left: var(--space_12);
            padding-right: var(--space_18);
            border-top: 1px solid var(--color_LunarGreen);
            border-bottom: 1px solid var(--color_LunarGreen);
        }

            .SS_STD .ss_navigation_link a img {
                /*width: calc(100% - var(--space_40));*/
                height: 100%;
            }

        .SS_STD [class^="ss_navigation_link_text_"] {
            width: var(--space_40);
        }

        .SS_STD .ss_content_galery .form {
            height: var(--space_24);
        }

        .SS_STD .ss_content,
        .SS_STD .ss_content .ss_content_gray {
            width: 100vw;
            padding-right: var(--space_2);
        }

    .SS_STD .ss_content_galery .form:nth-child(even) {
        width: calc(100% + (var(--space_8)));
        
    }

        .SS_STD .ss_content .ss_form:nth-child(even) {
            width: 104vw;
        }

    .SS_STD .ss_content_galery .form div a img {
        aspect-ratio: 1 / 1;
        height: 100%;
    }
    }