@font-face {
    font-family: "Marcellus";
    src: url("https://cdn.myshoptet.com/usr/www.kbdekor.cz/user/documents/fonts/Marcellus.ttf") format("truetype-variations");
    /* Rozpätie hrúbok pri variable fonte */
    font-weight: 100 900;
    font-style: normal;
}

@font-face {
    font-family: "Jost";
    src: url("https://cdn.myshoptet.com/usr/www.kbdekor.cz/user/documents/fonts/Jost.ttf") format("truetype-variations");
    /* Rozpätie hrúbok pri variable fonte */
    font-weight: 100 900;
    font-style: normal;
}

/* Poradie sekcii */
body.in-index .overall-wrapper {
    display: flex;
    flex-direction: column;
}

body.in-index .user-action {
    order: 1;
}

body.in-index .admin-bar {
    order: 2;
}

body.in-index .top-navigation-bar {
    order: 3;
}

body.in-index #header {
    order: 4;
}

body.in-index #content-wrapper.container.content-wrapper {
    order: 5;
}

body.in-index .content-wrapper.homepage-box.before-carousel {
    order: 6;
}

body.in-index .content-wrapper.container {
    order: 8;
}

body.in-index .content-wrapper.homepage-box.welcome-wrapper {
    order: 7;
}

body.in-index .content-wrapper.container .content-wrapper-in main.content {
    display: flex;
    flex-direction: column;
}

body.in-index .content-wrapper.container .content-wrapper-in main.content .homepage-products-heading-2 {
    order: 1;
}

body.in-index .content-wrapper.container .content-wrapper-in main.content .products {
    order: 2;
}

body.in-index .content-wrapper.container .content-wrapper-in main.content .benefitBanner {
    order: 3;
}

/* KONIEC Poradie sekcii */


body {
    font-family: "Jost", Arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
}

.blank-mode .cart-related-name, .blank-mode .cart-table .main-link, .blank-mode .h1,
.blank-mode .h2, .blank-mode .h3, .blank-mode .h4, .blank-mode .h5, .blank-mode .h6,
.blank-mode h1, .blank-mode h2, .blank-mode h3, .blank-mode h4, .blank-mode h5, .blank-mode h6,
.cart-related-name, .cart-table .main-link, .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, .benefitBanner__title {
    font-family: "Marcellus", Arial, sans-serif;
    color: var(--color-primary);
    /* letter-spacing: -1px; */
}

.btn, .next-step, .price-additional, .price-final, .price-measure, .price-save, .price-standard, .price-wrapper, .products .name, ol.cart-header {
    font-family: "Jost", Arial, sans-serif;
}

.h1, h1 {
    font-size: 36px;
}

body #header .site-name a img {
    max-height: 70px;
}

.benefitBanner__content {
    overflow: hidden;
    padding-right: 10px;
    word-break: break-word;
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: 290px;
}

.benefitBanner__title {
    font-size: 1.5em;
}

.welcome {
    margin: 64px 0 16px;
}

body.in-index .homepage-box {
    background-color: transparent;
    border-color: transparent;
}

.welcome h1, .welcome > div {
    text-align: center;
}

.sidebar .h4, .sidebar h4, .h4, h4 {
    font-size: 18px;
    font-weight: 600;
}

body.in-index header#header {
    /* background: transparent; */
    /* position: absolute; */
    /* top: 0; */
    /* left: 0; */
    /* right: 0; */
    /* z-index: 9999; */
    /* background: rgba(255, 255, 255, 0.0); */
    /* backdrop-filter: blur(5px); */
    /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08); */
}


.top-navigation-menu {
    display: none !important;
}

body header#header nav#navigation {
    margin-top: 0;
    margin-bottom: 16px;
}

body header#header nav#navigation .menu {
    background-color: var(--color-header-background);
    /* display: flex; */
    /* justify-content: center; */
}

body header#header nav#navigation .menu.navigation-in > ul > li {
    border: none;
}

.navigation-in > ul > li.exp > a, .navigation-in > ul > li > a {
    color: var(--Neutral-Dark, #000);

}

.navigation-in > ul > li.exp > a, .navigation-in > ul > li > a:hover {
    color: var(--color-secondary);
}

body.in-index header#header .navigation-in, .navigation-buttons a[data-target=login], .navigation-buttons a[data-target=search], .navigation-buttons a[data-target=search]:hover {
    /* background: transparent; */
}

body .btn.add-to-cart-button, .btn.btn-cart, .btn.express-checkout-button, a.btn.add-to-cart-button, a.btn.btn-cart, a.btn.express-checkout-button {
    font-family: "Jost", Arial, sans-serif;
    font-size: 16px;
    padding: 6px 16px;
    border-radius: 4px;
}




body .top-navigation-bar {
    border-bottom-color: transparent;
    border-top-color: transparent;
    margin-top: 8px;
}

body header#header .navigation-in ul {
    justify-content: center;
    max-width: 1468px;
}

@media (min-width: 768px) {
    body header#header .navigation-in ul {
        justify-content: center;
        max-width: 747px;
    }
}

@media (min-width: 992px) {
    body header#header .navigation-in ul {
        justify-content: center;
        max-width: 972px;
    }
}

@media (min-width: 1200px) {
    body header#header .navigation-in ul {
        justify-content: center;
        max-width: 1178px;
    }
}

@media (min-width: 1440px) {
    body header#header .navigation-in ul {
        justify-content: center;
        max-width: 1418px;
    }
}

body header#header .navigation-in ul li a b {
    font-family: "Marcellus", Arial, sans-serif;
    /* font-weight: 400; */
    /* letter-spacing: 1px; */
    font-size: 16px;
    text-transform: none;
}

body .form-control, body select {
    background-color: #eee;
    border-color: #eee;
}

body .btn.btn-default, body a.btn.btn-default {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary-hover);
    color: #fff;
}

body.in-index div#content-wrapper.container, body.in-index div.content-wrapper.homepage-box {
    padding: 0;
    margin: 0;
}

body.in-index div#content-wrapper.container, body.in-index div.content-wrapper.homepage-box .content-wrapper-in > .container {
    width: 100%;

}

@media (min-width: 768px) {
    body.in-index div#content-wrapper.container #carousel .extended-banner-texts, body.in-index div.content-wrapper.homepage-box .extended-banner-texts {
        width: 747px;
    }
}

@media (min-width: 992px) {
    body.in-index div#content-wrapper.container #carousel .extended-banner-texts, body.in-index div.content-wrapper.homepage-box .extended-banner-texts {
        width: 972px;
    }
}

@media (min-width: 1200px) {
    body.in-index div#content-wrapper.container #carousel .extended-banner-texts, body.in-index div.content-wrapper.homepage-box .extended-banner-texts {
        width: 1178px;
    }
}

@media (min-width: 1440px) {
    body.in-index div#content-wrapper.container #carousel .extended-banner-texts, body.in-index div.content-wrapper.homepage-box .extended-banner-texts {
        width: 1418px;
    }
}

.benefitBanner {
    margin: 128px auto;
}

@media (min-width: 768px) {
    .benefitBanner {
        max-width: 747px;
    }
}

@media (min-width: 992px) {
    .benefitBanner {
        max-width: 972px;
    }
}

@media (min-width: 1200px) {
    .benefitBanner {
        max-width: 1178px;
    }
}

@media (min-width: 1440px) {
    .benefitBanner {
        max-width: 1418px;
    }
}


body.in-index #carousel .extended-banner-texts, .next-to-carousel-banners .extended-banner-texts {
    bottom: unset;
    left: unset;
    position: absolute;
    right: unset;
    top: unset;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-left: 20px;
    padding-right: 20px;
    align-self: center;
    justify-self: center;
}

body.in-index #carousel .extended-banner-texts .extended-banner-title,
body.in-index #carousel .extended-banner-texts .extended-banner-text,
body.in-index #carousel .extended-banner-texts .extended-banner-link {
    background-color: transparent;
    border: none;
    box-shadow: none;
    padding: 0px;
    position: relative;
}

body.in-index #carousel .extended-banner-texts .extended-banner-title {
    font-family: Marcellus;
    font-size: 48px;
    font-style: normal;
    line-height: normal;
}

body.in-index #carousel .extended-banner-texts .extended-banner-text {
    max-width: 420px;
    color: var(--color-tertiary);
}

body.in-index #carousel .extended-banner-texts .extended-banner-link {
    display: flex;
    background-color: var(--color-secondary);
    width: fit-content;
    color: white;
    padding: 10px 32px;
    height: fit-content;
    border-radius: 4px;
    margin-top: 8px;
}

body.in-index .carousel-inner > .item {

}

body.in-index .carousel-inner > .item > a {
    display: flex;
    justify-content: center;
}

body.in-index .carousel-inner .item > a > img, body.in-index .carousel-inner .item > img {
    width: 100%;
    object-fit: cover;
    height: 690px;
}


footer#footer {
    background-color: #F5F1EC;
}

#footer > .container {
    background-color: transparent;
}

footer#footer .custom-footer {
    border-top-width: 0;
}

.breadcrumbs {
    border-color: transparent;
}


body.type-category .benefitBanner {
    display: none;
}

body.type-category .category-title {
    text-align: center;
}


body.type-detail .p-detail-inner-header {
    display: flex;
    flex-direction: row;
    gap: 40px;
}

body.type-detail .p-detail-inner-header h1 {
    order: 2;
    flex: 1;
    text-align: center;
}

body.type-detail .p-detail-inner-header .p-code {
    display: none;
    visibility: hidden;
    order: 1;
    flex: 1;
}

body.type-detail .p-detail .add-to-cart {
    align-items: center;
    justify-content: space-between;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    flex-direction: row;
}

body.type-detail .btn.add-to-cart-button {
    flex: 1;
}

body.type-detail .p-detail .add-to-cart .quantity {
    border-style: solid solid solid solid;
    border-radius: 4px;
}

@media (min-width: 768px) {
    body.type-detail .p-detail-inner-header h1 {
        text-align: center;
    }

    body.type-detail .p-detail-inner-header .p-code {
        display: none;
        visibility: visible;
    }
}

@media (min-width: 992px) {
    body.type-detail .p-detail-inner-header h1 {
        text-align: center;
    }

    body.type-detail .p-detail-inner-header .p-code {
        display: none;
        visibility: visible;
    }
}

@media (min-width: 1200px) {
    body.type-detail .p-detail-inner-header h1 {
        text-align: left;
    }

    body.type-detail .p-detail-inner-header .p-code {
        display: block;
        visibility: hidden;
    }
}

@media (min-width: 1440px) {
    body.type-detail .p-detail-inner-header h1 {
        text-align: left;
    }

    body.type-detail .p-detail-inner-header .p-code {
        display: block;
        visibility: hidden;
    }
}


body.type-page article header > h1 {
    text-align: center;
}