@font-face {
    font-display: swap;
}

:root {
    --default-color-1: #000000;
    --default-color-2: #333333;
    --default-color-3: #b9b9b9;
    --default-color-4: #eeeeee;
    --default-color-5: #e0e0e0;
    --default-color-6: #d90d0d;
    --default-color-7: #18b669;
    --default-color-8: #ffffff;
    --default-color-9: #fefefe;
    --default-color-10: #177536;
    --default-color-11: #1b1b1b;
    --default-color-12: #d9d60d;
    --default-color-13: #0d8ad9;
    --default-color-14: #aaaaaa;
    --default-color-14: #d9540d;
    --default-filter-1: invert(0%) sepia(40%) saturate(5440%) hue-rotate(86deg) brightness(106%) contrast(100%);
    --default-filter-2: invert(16%) sepia(0%) saturate(134%) hue-rotate(210deg) brightness(102%) contrast(90%);
    --default-filter-3: invert(81%) sepia(9%) saturate(0%) hue-rotate(223deg) brightness(91%) contrast(89%);
    --default-filter-4: invert(100%) sepia(0%) saturate(2909%) hue-rotate(53deg) brightness(112%) contrast(87%);
    --default-filter-5: invert(100%) sepia(1%) saturate(3429%) hue-rotate(200deg) brightness(118%) contrast(76%);
    --default-filter-6: invert(19%) sepia(83%) saturate(3953%) hue-rotate(350deg) brightness(81%) contrast(113%);
    --default-filter-7: invert(45%) sepia(87%) saturate(1098%) hue-rotate(115deg) brightness(97%) contrast(81%);
    --default-filter-8: invert(100%) sepia(0%) saturate(0%) hue-rotate(134deg) brightness(99%) contrast(105%);
    --default-filter-10: invert(35%) sepia(28%) saturate(1957%) hue-rotate(95deg) brightness(86%) contrast(82%);
    --default-filter-11: invert(0%) sepia(27%) saturate(6147%) hue-rotate(0deg) brightness(93%) contrast(79%);
    --default-filter-12: invert(98%) sepia(13%) saturate(7052%) hue-rotate(357deg) brightness(89%) contrast(91%);
    --default-filter-13: invert(35%) sepia(69%) saturate(1643%) hue-rotate(180deg) brightness(100%) contrast(90%);
    --default-filter-14: invert(32%) sepia(73%) saturate(1263%) hue-rotate(353deg) brightness(103%) contrast(100%);
    --default-font-1: "Fira Sans Condensed", sans-serif;
    --default-transition-1: all 0.5s cubic-bezier(0.4,0,0.2,1);
    --default-radius: 4px;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s,
samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, input, select, textarea, button, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0; padding: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; outline: 0
}
html {font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%}
body {line-height: 1}
main, article, aside, details, figcaption, figure, footer, header, nav, section {display: block; margin: 0; padding: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; outline: 0}

table, .table {border-collapse: separate; border-spacing: 0}
caption, th, td {font-weight: 400}
blockquote::before, blockquote::after, q::before, q::after {content: ''}
blockquote, q {quotes: '' ''}
a:focus {outline: 0}
a:active {outline: 0}
a img {border: 0}
em, i {font-style: italic}
u {text-decoration: underline}
strong {font-family: inherit; font-weight: 700}
sub {font-size: 65%; position: relative; bottom: 0}
sup {font-size: 65%; position: relative; top: 0}
.clear {display: block; clear: both}
.pointer {cursor: pointer}
.pcNone {display: none!important}

/* General */
* {margin: 0; padding: 0}
*, *::after, *::before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box}
.boxBeforeAfter:before, .boxBeforeAfter:after {content: ''; display: block; clear: both}

.block {display: block} .inline {display: inline-block} .bTable {display: table} .bTableCell {display: table-cell} .none {display: none}
.floatLeft {float: left} .floatRight {float: right} .hidden {overflow: hidden} .vhidden {visibility: hidden} .vvisible {visibility: visible}

.wrapper {width: 100%; max-width: 1740px; margin: 0 auto}
.row {margin-right: -8px; margin-left: -8px}
    .menuleirasalul {padding: 20px 0; border-top: 1px solid rgba(255,255,255,0.15); border-bottom: 1px solid rgba(255,255,255,0.15)}
    .menuleirasalul {width: calc(100% - 20px); margin: 0 10px}

.col-sm-1 {width: 8.333333%} .col-sm-2 {width: 16.666667%} .col-sm-3 {width: 25%} .col-sm-4 {width: 33.333333%} .col-sm-5 {width: 41.666667%} .col-sm-6 {width: 50%}
.col-sm-7 {width: 58.333333%} .col-sm-8 {width: 66.666667%} .col-sm-9 {width: 75%} .col-sm-10 {width: 83.333333%} .col-sm-11 {width: 91.666667%} .col-sm-12 {width: 100%}

.col-m-1 {width: 10%} .col-m-2 {width: 20%} .col-m-3 {width: 30%} .col-m-4 {width: 40%} .col-m-5 {width: 50%}
.col-m-6 {width: 60%} .col-m-7 {width: 70%} .col-m-8 {width: 80%} .col-m-9 {width: 90%} .col-m-10 {width: 100%}

.inline.col-sm-6 {width: calc(50% - 4px); vertical-align: top}

.flex {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap}
.flex .col-sm-1, .flex .col-sm-2, .flex .col-sm-3, .flex .col-sm-4, .flex .col-sm-5, .flex .col-sm-6, .flex .col-sm-7, .flex .col-sm-8, .flex .col-sm-9, .flex .col-sm-10, .flex .col-sm-11, .flex .col-sm-12 {width: 100%; padding-right: 8px; padding-left: 8px}

.flex .col-sm-1 {-webkit-box-flex: 0; -ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%}
.flex .col-sm-2 {-webkit-box-flex: 0; -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%}
.flex .col-sm-3 {-webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%}
.flex .col-sm-4 {-webkit-box-flex: 0; -ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%}
.flex .col-sm-5 {-webkit-box-flex: 0; -ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%}
.flex .col-sm-6 {-webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%}
.flex .col-sm-7 {-webkit-box-flex: 0; -ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%}
.flex .col-sm-8 {-webkit-box-flex: 0; -ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%}
.flex .col-sm-9 {-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%}
.flex .col-sm-10 {-webkit-box-flex: 0; -ms-flex: 0 0 83.333333%; flex: 0 0 83.333333%; max-width: 83.333333%}
.flex .col-sm-11 {-webkit-box-flex: 0; -ms-flex: 0 0 91.666667%; flex: 0 0 91.666667%; max-width: 91.666667%}
.flex .col-sm-12 {-webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%}

.align-items-start {-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start}
.align-items-end {-webkit-box-align: end; -ms-flex-align: end; align-items: flex-end}
.align-items-center {-webkit-box-align: center; -ms-flex-align: center; align-items: center}
.align-items-stretch {-webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch}

.align-self-start {-ms-flex-item-align: start; align-self: flex-start}
.align-self-end {-ms-flex-item-align: end; align-self: flex-end}
.align-self-center {-ms-flex-item-align: center; align-self: center}

.align-content-start {-ms-flex-line-pack: start; align-content: flex-start}
.align-content-end {-ms-flex-line-pack: end; align-content: flex-end}
.align-content-center {-ms-flex-line-pack: center; align-content: center}

.justify-content-start {-webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start}
.justify-content-end {-webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end}
.justify-content-center {-webkit-box-pack: center; -ms-flex-pack: center; justify-content: center}
.justify-content-between {-webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between}
.justify-content-around {-ms-flex-pack: distribute; justify-content: space-around}

.flex-column {-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column}
.flex-row {-webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row}

html {height: 100%!important; min-height: 100%!important; font-size: 16px}
body {
    background-color: var(--default-color-8); background-image: image-set(url('../art/bg-body-592.webp') type('image/webp'), url('../art/bg-body-592.jpg') type('image/jpeg')); width: 100%; height: 100%; min-height: 100%; margin: 0; padding: 0; color: var(--default-color-1);
    font-family: 'Fira Sans Condensed', 'Arial Narrow', 'Helvetica Neue', sans-serif; font-size: 1rem; font-display: swap; font-weight: 400; line-height: 24px; overflow-x: hidden!important; -webkit-overflow-scrolling: touch; -webkit-font-smoothing: antialiased
}
body.hidden {overflow: hidden!important}

#header {width: 100%; margin: 0 auto}
    #hbefore {background-color: var(--default-color-2); padding-right: 35px; padding-left: 35px}
        #hbefore .wrapper {min-height: 50px}
            #hbefore .navigation-selector {list-style: none; margin: 0; padding: 0; font-size: 1rem; line-height: 1.2; color: var(--default-color-8); font-weight: 500; text-transform: uppercase}
                #hbefore .navigation-selector li {margin: 0 13px; padding: 0}
                #hbefore .navigation-selector li:first-child {margin-left: 0}
                #hbefore .navigation-selector li:last-child {margin-right: 0}
                    #hbefore .navigation-selector li a {display: block; color: inherit; text-decoration: none; opacity: 0.8}
                    #hbefore .navigation-selector li.active a {opacity: 1}
            .information-time {color: var(--default-color-8); font-size: 1rem; font-weight: 700; line-height: 1.2; text-transform: uppercase}
            .information-time .sep::after {content: '|'; margin: 0 22px}
                .information-time a {color: inherit; text-decoration: none}
                .information-time a + strong {margin-left: 15px}
            #header .language-selector {margin: 0 0 0 auto; color: var(--default-color-8); font-size: 1rem; font-weight: 500; line-height: 1.2; text-transform: lowercase}
                #header .language-selector a {padding: 3px 0 3px 27px; color: inherit; text-decoration: none; position: relative; z-index: 1}
                #header .language-selector a::before {
                    content: ''; background-color: var(--default-color-8); width: 20px; height: 20px; position: absolute; top: 50%; left: 0; z-index: -2; border-radius: 20px;
                    -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: var(--default-transition-1); -moz-transition: var(--default-transition-1); transition: var(--default-transition-1)
                }
                #header .language-selector a::after {
                    content: ''; background: url('../art/svg/icon-arrow-right.svg') no-repeat center center; background-size: 12px; width: 20px; height: 20px; position: absolute; top: 50%; left: 0; z-index: -1;
                    -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: var(--default-transition-1); -moz-transition: var(--default-transition-1); transition: var(--default-transition-1)
                }
    #hafter {background-color: var(--default-color-6); background-image: image-set(url('../art/bg-hafter-592.webp') type('image/webp'), url('../art/bg-hafter-592.jpg') type('image/jpeg')); padding-right: 35px; padding-left: 35px; position: relative}
        #hafter .wrapper {min-height: 85px; padding-top: 10px; padding-bottom: 10px}
            #hafter .logo {display: block; width: 300px; height: 55px; line-height: 0; text-decoration: none}
                #hafter .logo img {width: 100%; height: auto}
            #navigation {}
                #navigation .topNav {list-style: none; margin: 0 0 0 28px; padding: 2px 0 0; color: var(--default-color-8); font-size: 1.125rem; font-weight: 700; line-height: 1.2; text-transform: uppercase; -moz-user-select: none; -o-user-select: none; user-select: none}
                    #navigation .topNav li {margin: 0 10px; padding: 7px 10px; position: relative; top: 0; -webkit-transition: var(--default-transition-1); -moz-transition: var(--default-transition-1); transition: var(--default-transition-1)}
                        #navigation .topNav li a {display: block; color: inherit; text-decoration: none}
                        #navigation .topNav li.active {background-color: var(--default-color-1)}
                    #navigation .topNav li.toggle {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer}
                    #navigation .topNav li.toggle::after {content: ''; background: transparent url('../art/svg/icon-arrow-down.svg') no-repeat center center; background-size: 14px; display: block; width: 14px; height: 9px; margin-left: 3px; -webkit-filter: var(--default-filter-8); filter: var(--default-filter-8)}
                    #navigation .topNav li.toggled {background-color: var(--default-color-1); top: 5px}
                    #navigation .topNav li.toggle.toggled::after {background-image: url('../art/svg/icon-arrow-up.svg')}
                #navigation .submenu {
                    list-style: none; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; -moz-flex-flow: row wrap; flex-flow: row wrap; -webki-justify-content: flex-start;
                    -moz-justify-content: flex-start; justify-content: flex-start; background-color: var(--default-color-8); width: 100%; padding: 7px 13px 0; border-top: 2px solid var(--default-color-1);
                    color: var(--default-color-1); font-size: 1rem; font-weight: 600; line-height: 1.2; opacity: 0; position: absolute; top: 100%; left: 0; z-index: 99;
                    visibility: hidden; -webkit-box-shadow: 0 0 10px 1px rgba(0,0,0,0.5); -moz-box-shadow: 0 0 10px 1px rgba(0,0,0,0.5); box-shadow: 0 0 10px 1px rgba(0,0,0,0.5)
                }
                 #navigation .submenu.opened {opacity: 1; visibility: visible}
                    #navigation .submenu li {width: calc(20% - 14px); margin-right: 7px; margin-left: 7px; border-bottom: 1px solid var(--default-color-5)}
                    #navigation .submenu.gyartok li {width: calc(12.5% - 14px)}
                        #navigation .submenu li a {display: block; height: 100%; padding: 16px 10px 14px; color: inherit; text-decoration: none}
                        #navigation .submenu li.aktiv a {background-color: var(--default-color-1); color: var(--default-color-8)}
                #navigation .icon {background-color: #fbafaf; display: block; width: 34px; height: 34px; margin: 13px 0 13px 10px; color: #322323; cursor: pointer; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out}
                    #navigation .icon:before {content: ''; display: block; width: 100%; height: 100%; font-family: 'FontAwesome'; font-size: 23px; line-height: 34px; text-align: center}
                    #navigation .icon.user:before {content: '\f007'}
                    #navigation .icon.cart:before {content: '\f07a'}
            .mobile-back {display: none}
            #hafter .funcBlock {margin-left: auto}
                #hafter .funcBlock > *:not(script) {margin-left: 15px}
                #hafter .funcBlock .icon {background-color: var(--default-color-8); display: block; width: 50px; height: 50px; position: relative; cursor: pointer; border-radius: 50px; -webkit-transition: var(--default-transition-1); -moz-transition: var(--default-transition-1); transition: var(--default-transition-1)}
                #hafter .funcBlock .icon::before {content: ''; background: transparent no-repeat center center; display: block; width: 50px; height: 50px; -webkit-filter: var(--default-filter-1); filter: var(--default-filter-1)}
                #hafter .funcBlock #searchBox .icon::before {content: ''; background-image: url('../art/svg/kereses.svg'); background-size: 35px}
                #hafter .funcBlock #cartBox .icon::before {content: ''; background-image: url('../art/svg/kosar.svg'); background-size: 35px}
                #hafter .funcBlock #miniFavorites .icon {display: none!important}
                #hafter .funcBlock #miniFavorites .icon::before {display: none!important}
                #hafter .funcBlock #userBox .icon::before {content: ''; background-image: url('../art/svg/user.svg'); background-size: 35px}
                #cartBox {}
                    #cartBox .icon.cart span {background-color: var(--default-color-7); width: 18px; height: 18px; padding: 2px 0 0; color: var(--default-color-8); font-size: 13px; font-weight: 700; line-height: 1; text-align: center; position: absolute; top: -2px; right: -2px; border-radius: 50%}
                    .search-modal {
                        background-color: var(--default-color-8); width: 100%; max-width: 768px; height: auto; padding: 30px 30px 19px; opacity: 0; position: fixed; top: calc(50% - 50px); left: 50%; z-index: -101; visibility: hidden; border-radius: 3px; -webkit-box-shadow: 0 0 10px 3px rgba(0,0,0,0.6); box-shadow: 0 0 10px 3px rgba(0,0,0,0.6);
                        -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: opacity 0.5s, top 0.5s ease-in-out; -moz-transition: opacity 0.5s, top 0.5s ease-in-out; transition: opacity 0.5s, top 0.5s ease-in-out;
                    }
                    .searchOpened .search-modal {opacity: 1; z-index: 101; visibility: visible}
                        .searchOpened .search-modal .close-func {background-color: var(--default-color-6); position: absolute; top: -45px; right: -55px}
                        .searchOpened .search-modal .close-func::before {-webkit-filter: var(--default-filter-8); filter: var(--default-filter-8)}
                        .searchOpened .search-modal form {}
                            .searchOpened .search-modal form > div:not(.formGroup) {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap}
                                .searchOpened .search-modal form > div:not(.formGroup) .input {width: calc(100% - 135px)}
                                .searchOpened .search-modal form > div:not(.formGroup) .btn {height: 42px; width: 120px; margin: 0 0 0 15px; padding-right: 10px; padding-left: 10px}
                            .searchOpened .search-modal form > div + div.formGroup {padding: 11px 0}
                                .searchOpened .search-modal form > div.formGroup label {margin: 4px; color: var(--default-color-2)}
                    .left-slideing-modal {
                        background-color: var(--default-color-8); width: 100%; max-width: 360px; height: 100%; height: calc(var(--vh, 1vh) * 100); padding: 0; opacity: 1; position: fixed; top: 0; right: 0; bottom: 0; z-index: 101; visibility: hidden; -webkit-transform: translate3d(101%,0,0); -moz-transform: translate3d(101%,0,0); transform: translate3d(101%,0,0);
                        -webkit-transition: opacity 0.5s,-webkit-transform 0.5s ease,visibility 0.5s ease; -moz-transition: opacity 0.5s,-moz-transform 0.5s ease,visibility 0.5s ease; transition: opacity 0.5s,transform 0.5s ease,visibility 0.5s ease
                    }
                    .minicartOpened #cartBox .left-slideing-modal, .userdataOpened #userBox .left-slideing-modal {opacity: 1; visibility: visible; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0)}
                #hafter .funcBlock .mobile-menu {display: none!important}
                #hafter .funcBlock .mobile-menu::before {display: none!important}
                .mobile-menu {background-color: var(--default-color-8)!important}
                    .mobile-menu graph {
                        background-color: var(--default-color-1); display: block; width: calc(100% - 24px); height: 2px; font-size: 0; line-height: 0; overflow: inherit;
                        position: absolute; top: 50%; left: 12px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%)
                    }
                        .mobile-menu graph:before, .mobile-menu graph:after {
                            content: ''; background-color: var(--default-color-1); width: 100%; height: 100%; position: absolute; left: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden;
                            -webkit-transform: translateZ(0); transform: translateZ(0); transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s
                        }
                        .mobile-menu graph:before {top: -7px; -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0)}
                        .mobile-menu graph:after {bottom: -7px; -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0)}
                    .mobileMenuOpened .mobile-menu graph {background-color: var(--default-color-8)}
                            .mobileMenuOpened .mobile-menu graph:before, .mobileMenuOpened .mobile-menu graph:after {background-color: var(--default-color-1)}
                            .mobileMenuOpened .mobile-menu graph:before {top: 0; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg)}
                            .mobileMenuOpened .mobile-menu graph:after {bottom: 0; -webkit-transform: rotate(225deg); -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg)}
    .stickyHeader #hafter {width: 100vw; position: fixed; top: 0; left: 0; z-index: 99; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: slideInDown; animation-name: slideInDown; -webkit-animation-duration: 0.25s; animation-duration: 0.25s; -webkit-animation-delay: 0.4s; animation-delay: 0.4s; box-shadow: #000000 0 -5px 20px 0}

/* top text */
#header .top-text {background-color: var(--default-color-2); min-height: 10px; padding: 20px 35px 16px; color: var(--default-color-8); font-size: 20px; font-weight: 700; text-align: center; text-transform: uppercase; position: relative}
#header .top-text::after {content: ''; background: transparent url('../art/svg/graph-line.svg') repeat-x center top; display: block; width: 100vw; height: 25px; margin: 0 -35px; position: absolute; bottom: -14px; z-index: 1; -webkit-filter: var(--default-filter-2); filter: var(--default-filter-2)}

/* slider */
#topSlider {width: 100vw; margin: 0 auto 89px; overflow: hidden; position: relative; z-index: 0}
    #topSlider .wrapper {max-width: 100vw}
    #topSlider .sliderFor:not(.slick-slider) {display: -webkit-box; display: -ms-flexbox; display: flex}

    #topSlider .sliderFor {width: 100%; max-width: 1280px; margin: 0 auto; overflow: visible!important}
    #topSlider .sliderFor::after {
        content: ''; background: transparent url('../art/svg/graph-line.svg') repeat-x center top; display: block; width: 100vw; height: 25px; margin: 0; position: absolute; bottom: 0; left: 50%; z-index: 1;
        -webkit-transform: scaleY(-1) translateX(-50vw); -moz-transform: scaleY(-1) translateX(-50vw); -ms-transform: scaleY(-1) translateX(-50vw); transform: scaleY(-1) translateX(-50vw); -webkit-filter: var(--default-filter-8); filter: var(--default-filter-8)
    }
        #topSlider .sliderFor .slick-list {overflow: visible}
    #topSlider .sliderFor .box {display: block; float: left; width: 100%; position: relative}
    #topSlider .sliderFor .box::before {content: ''; display: block; width: 100%; max-height: 450px; padding-top: 35.16%; position: relative}
        #topSlider .sliderFor .box img {width: 100%; height: 100%; position: absolute; top: 0; left: 0; -moz-object-fit: cover; -o-object-fit: cover; object-fit: cover; -moz-object-position: center center; -o-object-position: center center; object-position: center center}
    #topSlider .slick-dots {position: absolute}

/* content */
#content {width: 100%; margin: 0 auto; padding: 0 35px}
    #content > .wrapper {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding-top: var(--cw-pt, 0); padding-right: var(--cw-pr, 0); padding-bottom: var(--cw-pb, 0); padding-left: var(--cw-pl, 0)}
    #content.oneColumn > .wrapper > *:not(script), #content.oneColumn > .wrapper #lSide, #content.oneColumn > .wrapper #rSide {-webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; width: 100%; max-width: 100%}

/* footer */
#footer {background-image: image-set(url('../art/bg-footer-592.webp') type('image/webp'), url('../art/bg-footer-592.jpg') type('image/jpeg'))}

/* mediaqueries */
@media (min-width: 593px){
    body {background-image: image-set(url('../art/bg-body-1080.webp') type('image/webp'), url('../art/bg-body-1080.jpg') type('image/jpeg'))}
    #hafter {background-image: image-set(url('../art/bg-hafter-1080.webp') type('image/webp'), url('../art/bg-hafter-1080.jpg') type('image/jpeg'))}
    #footer {background-image: image-set(url('../art/bg-footer-1080.webp') type('image/webp'), url('../art/bg-footer-1080.jpg') type('image/jpeg'))}
}
@media (min-width: 993px){
    #navigation .submenu {max-height: calc(100vh - 240px); overflow: hidden; overflow-y: scroll}
    #topSlider .slick-slide, #topSlider .slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] {
        -webkit-transform: scale(0.95, 0.9); -moz-transform: scale(0.95, 0.9); -ms-transform: scale(0.95, 0.9); transform: scale(0.95, 0.9)
    }
    #topSlider .sliderFor .slick-center, #topSlider .slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"] {
        -webkit-transform: scale(1, 1); -moz-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1)
    }

    #topSlider .sliderFor:not(.slick-slider) {-webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; max-width: 100%; overflow: hidden!important}
        #topSlider .sliderFor:not(.slick-slider) .box {width: auto}
        #topSlider .sliderFor:not(.slick-slider) .box:nth-child(1) {flex: 0 1 1280px; max-width: 1280px; width: 100%}
        #topSlider .sliderFor:not(.slick-slider) .box:nth-child(2), #topSlider .sliderFor:not(.slick-slider) .box:last-child {flex: 1 1 auto; display: block; overflow: hidden}
        #topSlider .sliderFor:not(.slick-slider) .box:last-child {order: -1}
        #topSlider .sliderFor:not(.slick-slider) .box:nth-child(2) {margin: 24px 0 24px 32px}
        #topSlider .sliderFor:not(.slick-slider) .box:last-child {margin: 24px 32px 24px 0}
            #topSlider .sliderFor:not(.slick-slider) .box:nth-child(2) img {-moz-object-position: left center; -o-object-position: left center; object-position: left center}
            #topSlider .sliderFor:not(.slick-slider) .box:last-child img {-moz-object-position: right center; -o-object-position: right center; object-position: right center}
}
@media (min-width: 1081px){
    body {background-image: image-set(url('../art/bg-body-1380.webp') type('image/webp'), url('../art/bg-body-1380.jpg') type('image/jpeg'))}
    #hafter {background-image: image-set(url('../art/bg-hafter-1680.webp') type('image/webp'), url('../art/bg-hafter-1680.jpg') type('image/jpeg'))}
    #footer {background-image: image-set(url('../art/bg-footer-1680.webp') type('image/webp'), url('../art/bg-footer-1680.jpg') type('image/jpeg'))}
}
@media (min-width: 1281px){
    #topSlider .sliderFor:not(.slick-slider) .box {display: none}
    #topSlider .sliderFor:not(.slick-slider) .box:first-child {display: block}
}
@media (min-width: 1381px){
    body {background-image: image-set(url('../art/bg-body-1680.webp') type('image/webp'), url('../art/bg-body-1680.jpg') type('image/jpeg'))}
}
@media (min-width: 1681px){
    body {background-image: image-set(url('../art/bg-body-1920.webp') type('image/webp'), url('../art/bg-body-1920.jpg') type('image/jpeg'))}
    #hafter {background-image: image-set(url('../art/bg-hafter-1920.webp') type('image/webp'), url('../art/bg-hafter-1920.jpg') type('image/jpeg'))}
    #footer {background-image: image-set(url('../art/bg-footer-1920.webp') type('image/webp'), url('../art/bg-footer-1920.jpg') type('image/jpeg'))}
}
@media (min-width: 1921px){
    body {background-image: image-set(url('../art/bg-body-2560.webp') type('image/webp'), url('../art/bg-body-2560.jpg') type('image/jpeg'))}
    #hafter {background-image: image-set(url('../art/bg-hafter-2560.webp') type('image/webp'), url('../art/bg-hafter-2560.jpg') type('image/jpeg'))}
    #footer {background-image: image-set(url('../art/bg-footer-2560.webp') type('image/webp'), url('../art/bg-footer-2560.jpg') type('image/jpeg'))}
}

@media (min-width: 593px) and (max-width: 1280px){
    #topSlider .sliderFor:not(.slick-slider) .box:nth-child(2), #topSlider .sliderFor:not(.slick-slider) .box:last-child {display: none}
    #topSlider .sliderFor:not(.slick-slider) .box:nth-child(1) {max-width: 100%}
}