@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap');


      /* The Modal (background) */
        /* СТИЛИ ДЛЯ МДАЛЬНЫХ ОКОН ВЫБОРА ГОРОДА И СООБЩЕНИЯ О ВРЕМЕНИ РАБОТЫ */
        .modal-content .close:hover {
            transform: rotate(90deg);
        }
        .modal-content .close {
            position: absolute;
            right: -23px;
            top: -25px;
            transition: 0.4s;
            width: 0px;
            height: 0px;
            width: 50px;
            height: 50px;
        }
        .modal-content .close::before {
            content: '';
            position: absolute;
            left: 12px;
            top: 23px;
            transform: rotate(45deg);
            width: 28px;
            height: 3px;
            background: #fff;
        }
        .modal-content .close::after {
            content: '';
            position: absolute;
            left: 12px;
            top: 23px;
            transform: rotate(-45deg);
            width: 28px;
            height: 3px;
            background: #fff;
        }

        .modal {
            display: none;
            position: fixed;
            z-index: 999999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgb(0 0 0 / 90%);
        }

        /* Modal Content/Box */
        .modal-content {
            background-color: #fefefe;
            margin: 15% auto;
            padding: 41px;
            border: 20px solid #151515;
            width: 70%;
            position: relative;
            background: url(/images/bg-overlay-1.png),#1d1d1d;
            color: #fff;
        }

        /* The Close Button */
        .close {
            color: #aaa;
            float: right;
            font-size: 28px;
            font-weight: bold;
        }

        .close:hover,
        .close:focus {
            color: black;
            text-decoration: none;
            cursor: pointer;
        }




div#pop-up-tovar::-webkit-scrollbar {
    width: 0px;
}
div#pop-up-tovar b span {
    display: grid;
    float: left;
    margin-right: 5px;
    width: auto;
}
section.posts-show-blog div#home-text {
    padding: 5% 10%;
    color: #fff;
    padding: 0;
}
section.posts-show-blog {
    padding: 50px 10%;
    color: #fff;
    display: table;
    width: 100%;
    box-sizing: border-box;
}
section.posts-show-blog h3 {
    font-size: 2em;
}

.modal-content h1 {
    font-size: 1.5em;
    margin: 0;
}
section.posts-show-blog img {
    width: auto;
    float: left;
    margin-right: 30px;
    margin-bottom: 30px;
    max-width: 50%;
}

/* в корзине cart.blade.php */
.rashifrovka {
    font-size: 10px;
}

div#main-menu a.active {
    color: #e30613;
}
#main-menu span a.cart span {
    /* background: #fff; */
    text-align: center;
    color: #fff;
    width: 23px;
    padding: 5px;
    border-radius: 50%;
    position: absolute;
    right: -7px;
}
a{cursor: pointer;}
#main-menu ul.change li ul li a {
    color: #000;
    font-weight: 500;
    text-transform: none;
    padding: 0;
}
.cmn-toggle-switch, .m-cart-cab {
    display: none;
}
.history {
    padding: 50px 10%;
}
.history table {
    width: 100%;
    overflow-y: scroll;
    display: block;
}

.history td {
    color: #fff;
    padding: 20px;
    border: 1px solid #4e4e4e;
}

.posts-blog {
    display: grid;
    grid-template-columns: 22% 22% 22% 22%;
    grid-column-gap: 4%;
    padding: 50px 10%;
}
.posts-blog p {
    color: #fff;
}
.posts-blog h3 {
    color: #fff;
}
.posts-blog div {
    margin-bottom: 4vw;
    border: 1px solid #383838;
    padding: 25px;
    border-radius: 25px;
    transition: 0.4s;
}
.posts-blog div:hover {
    background: #222;
    border: 1px solid #ffffff;
}
.posts-blog div a {
    text-align: center;
    background: #e30613;
    color: #fff;
    font-weight: 600;
    padding: 8px 13px;
    margin: 0px 0px;
    border-radius: 5px;
    text-transform: uppercase;
    transition: 0.4s;
    margin-top: 10px;
    display: table;
}
.posts-blog div a:hover {
    transform: scale(1.06);
    background: #b3000b;
}




html, #main-menu {
    max-width: 1920px;
    position: relative;
    margin: 0 auto;
}

.oform-dannie{}
.oform-dannie p{}
.oform-dannie span p {
    display: grid;
    grid-template-columns: 50% 50%;
    min-width: 300px;
    max-width: 440px;
}
.oform-dannie span p bold {
    color: #e30613;
}
.oform-dannie span p b {
    display: flex;
    justify-content: center;
    flex-direction: column;
    height: 37px;
}
p.alerts {
    color: #fff;
    background: #1d1d1d;
    padding: 25px 0px;
    display: block;
    border-radius: 8px;
    border: 2px solid #e30613;
    min-width: 300px;
    max-width: 440px;
    text-align: center;
}
p.alerts a:hover{color:#fff;}
p.alerts a {
    color: red;
    margin: 0 auto;
    margin-top: 25px;
    display: table;
    padding: 3px 12px 6px 12px;
    font-weight: 400;
    letter-spacing: 1px;
    transition: 0.4s;
}
.oform-dannie input, .oform-dannie select, .oform-dannie textarea {
    /* box-sizing: border-box; */
    /* max-width: 100%; */
    /* padding: 10px 30px; */
    /* background: transparent; */
    /* border: 1px solid #fff; */
    /* color: #fff; */
    /* border-radius: 8px; */
}
option {
    background: #1d1d1d;
    color: #fff;
}
.radio-button input[type="radio" i] {
    float: left;
    padding: 0;
    margin: 2px 7px 0px 0px;
    font-size: 20px;
    width: 20px;
    height: 17px;
}
.radio-button {
    margin-bottom: 12px;
}
#cart-content span.filter {
    padding: 0px 0;
    display: flex;
    justify-content: flex-start;
    color: #fff;
    font-size: 20px;
    padding-bottom: 25px;
}
#cart-content span.filter a.act {
    border: 1px solid #333;
    padding: 10px 15px;
    background: #e30613;
    border-radius: 8px;
    color: #fff;
}
#cart-content span.filter a {
    border: 1px solid #333;
    padding: 10px 15px;
    background: transparent;
    border-radius: 8px;
    transition: 0.4s;
    margin-right: 20px;
}



.cart-result button:hover{
    transform: scale(1.06);
    background: #b3000b;
}
p.cart-result {
    font-weight: 600;
    font-size: 20px;
    margin: 0 auto;
    display: table;
    margin-top: 50px;
}
.cart-result button {
    text-align: center;
    background: #e30613;
    color: #fff;
    font-weight: 600;
    padding: 15px 30px;
    margin: 0px 0px;
    border-radius: 5px;
    text-transform: uppercase;
    transition: 0.4s;
    border: none;
    cursor: pointer;
    margin-left: 25px;
}

input.curProductCount {
    background: transparent;
    border: none;
    color: #fff;
    text-align: center;
    width: 50px;
    margin: 0;
    padding: 0;
    height: 26px;
}
div#main-content.cart .span p.price {
    text-align: right;
    font-weight: 600;
}
#cart-content .right {
    display: grid;
    grid-template-columns: 50% 50%;
}

#cart-content span.plus, 
#cart-content  span.minus {
    filter: brightness(0)invert(100%);
    width: 25px;
    display: block;
    cursor: pointer;
}
#cart-content .number {
    display: flex;
    justify-content: center;
    padding: 4px 0px;
    flex-direction: column;
}
#cart-content  .number div{
    display: flex;
    justify-content: center;
    padding: 4px 0px;
}





div#main-content.cart {
    color: #fff;
    padding: 50px 10%;
}
div#main-content.cart .span {
    display: grid;
    grid-template-columns: 15% 40% 45%;
    margin-bottom: 25px;
    border: 2px solid #313131;
    padding: 25px;
    border-radius: 25px;
}
div#main-content.cart .span p {
    padding: 0px 25px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}


#cabinet span#filter {
    padding: 50px 10%;
    display: flex;
    justify-content: flex-start;
    color: #fff;
    font-size: 20px;
    padding-bottom: 0;
}
#cabinet span#filter a.act {
    border: 1px solid #333;
    padding: 10px 15px;
    background: #e30613;
    color: #fff;
    border-radius: 8px;
}
#zag-page a {
    font-size: 14px;
}

#cabinet span#filter a {
    border: 1px solid #333;
    padding: 10px 15px;
    background: transparent;
    border-radius: 8px;
    transition: 0.4s;
    margin-right: 20px;
}




#cat-places img {
    float: left;
    width: 20%;
    margin-right: 25px;
    border-radius: 25px;
}
#cat-places span {
    display: table;
    width: 100%;
    margin-bottom: 20px;
    border: 2px solid #404040;
    padding: 25px;
    border-radius: 25px;
    color: #fff;
}

#restorany span#filter {
    padding: 50px 10%;
    display: flex;
    justify-content: space-between;
    color: #fff;
    font-size: 20px;
}
#restorany div#cat-places {
    padding: 50px 10%;
    padding-top: 0;
}
#restorany span#filter a.act{
    border: 1px solid #333;
    padding: 10px 15px;
    background: #e30613;
    border-radius: 8px;
}
#restorany span#filter a {
    border: 1px solid #333;
    padding: 10px 15px;
    background: transparent;
    border-radius: 8px;
    transition: 0.4s;
    color: #fff;
}
#restorany span#filter a.act {
    background: #e30613;
}
#zag-page {
    padding: 165px 10%;
    font-size: 35px;
    padding-bottom: 76px;
    color: #fff;
    background: url(/images/bg-overlay-2.jpg);
    margin: 0;
}
#zag-page bold {
    color: #e30613;
    font-weight: 600;
}
#zag-page h1 {
    margin: 0;
    padding: 0;
}
#zag-page p {
    margin: 0;
    padding: 0;
    font-size: 20px;
}
#pop-up-tovar h3 {
    color: #fff;
    font-size: 35px;
    padding-bottom: 0;
    margin-bottom: 0;
}
#pop-up-tovar p {
    color: #a5a5a5;
}
#pop-up-tovar b {
    color: #fff;
    font-size: 30px;
    padding-bottom: 20px;
    display: table;
}
div#pop-up-tovar span {
    width: 300px;
}
div#pop-up-tovar .close:hover {
    transform: rotate(90deg);
}
div#pop-up-tovar .close {
    position: absolute;
    right: 4px;
    top: 17px;
    transition: 0.4s;
    width: 0px;
    height: 0px;
    width: 50px;
    height: 50px;
}
div#pop-up-tovar .close::before {
    content: '';
    position: absolute;
    left: 12px;
    top: 23px;
    transform: rotate(45deg);
    width: 28px;
    height: 3px;
    background: #fff;
}
div#pop-up-tovar .close::after {
    content: '';
    position: absolute;
    left: 12px;
    top: 23px;
    transform: rotate(-45deg);
    width: 28px;
    height: 3px;
    background: #fff;
}
a#joie:hover {
    color: #e30a17;
}
a#joie {
    position: relative;
    left: 0;
    text-align: center;
    background: #0c0c0c;
    color: #565656;
    width: 100%;
    display: table;
    padding: 18px;
    box-sizing: border-box;
    text-transform: lowercase;
    letter-spacing: 4px;
    font-weight: 100;
    font-size: 12px;
    transition: 0.4s;
}
div#home-text {
    padding: 5% 10%;
    color: #fff;
}

div#pop-up-tovar.act {
    transform: scale(1);
}
div#pop-up-tovar {
    position: fixed;
    z-index: 99999;
    width: 75%;
    max-height: 70vh;
    display: grid;
    overflow-y: scroll;
    overflow-x: hidden;
    grid-template-columns: 50% 46%;
    grid-column-gap: 4%;
    background: #fff;
    transition: 0.4s;
    left: 12.5%;
    top: 19vh;
    transform: scale(0);
    background: url(/images/bg-overlay-1.png),#222222;
    padding: 55px;
    border: 2px solid #3c3c3c;
}
div#pop-up-tovar-fon {
    opacity: 1;
    position: fixed;
    width: 100%;
    height: 100%;
    background: hsl(0deg 0% 0% / 82%);
    top: 0;
    left: 0;
    z-index: 9999;
    transition: 0.4s;
    display: none;
    opacity: 0;
}
div#pop-up-tovar-fon.act {
    display: block;
    opacity: 1;
}
body.body-no-scroll {
    overflow: hidden;
}
div#pop-up-tovar select {
    cursor: pointer;
    padding: 6px 10px;
    margin: 0;
    display: table;
    margin-bottom: 22px;
    width: auto;
    font-size: 16px;
    background: transparent;
    border: none;
    color: #fff;
    padding-left: 0;
}
.tavar select option{}
.tavar select {
    cursor: pointer;
    padding: 6px 10px;
    margin: 0 auto;
    display: table;
    margin-bottom: 22px;
    width: auto;
    font-size: 16px;
    background: transparent;
    border: none;
    color: #fff;
}
#pop-up-tovar a.add {
    display: table;
    width: 130px;
}

#pop-up-tovar .number {
    display: flex;
    padding: 4px 0px;
}

#curmodifiers input[type="checkbox" i].checkbox {
    display: block;
    float: left;
    margin: 0px 0px 0px -26px;
    cursor: pointer;
    z-index: 99999;
    position: relative;
    width: 27px;
    height: 35px;
    opacity: 0;
}
div#curmodifiers {
    padding-top: 12px;
}

div#footer {
    padding: 5% 10%;
    background: url(/images/bg-overlay-2.jpg),#2d2d2d;
    color: #fff;
}
#footer .b {
    display: grid;
    grid-template-columns: 33% 33% 33%;
}
#footer div.b {
    display: grid;
    grid-template-columns: 33.33% 33.33% 33.33%;
    width: 100%;
    padding-top: 125px;
}
#footer div.b .b {
    display: table;
    text-align: center;
}
#footer div.b .c {
    text-align: right;
}
#footer p {margin: 0;padding: 0;}
#footer div.a {
    padding: 32px 0px;
    display: table;
    justify-content: space-between;
    color: #ffffff;
    font-weight: 600;
    float: left;
    width: 80%;
}
div#footer .b img {
    width: 35px;
    margin: 0px 6px -12px 11px;
}
#footer div.a a {
    padding: 0px 15px;
    color: #fff;
    transition: 0.4s;
}
#footer div.a a:hover {
    color: #e30613;
}
#footer a.logo {
    display: table;
    float: left;
    width: 20%;
}
#footer a.logo img {
    width: 220px;
    /* margin: 0px auto; */
    display: table;
}

#toptop {
    position: fixed;
    right: 5%;
    bottom: -12%;
    z-index: 99;
    background: #e30613;
    color: #ffffff;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    transition: 0.4s;
    border-radius: 0;
    font-size: 21px;
    font-weight: 900;
    transform: rotate(180deg);
    text-decoration: none;
    border-radius: 50px;
}
.toptop-act {bottom: 5%!important;}
a#toptop:hover, #main-menu span a.user:hover, #main-menu span a.cart:hover {
    filter: brightness(0.6);
}

input.curProductCount {
    background: transparent;
    border: none;
    color: #fff;
    text-align: center;
    width: 50px;
    margin: 0;
    padding: 0;
    height: 26px;
}
div#pop-up-tovar a.add:hover,
div#catalog div.tovars .tavar a.add:hover{
    transform: scale(1.06);
    background: #b3000b;
}
div#pop-up-tovar a.add, 
div#catalog div.tovars .tavar a.add {
    text-align: center;
    background: #e30613;
    color: #fff;
    font-weight: 600;
    padding: 8px 0px;
    margin: 0px 0px;
    border-radius: 5px;
    text-transform: uppercase;
    transition: 0.4s;
}
div#pop-up-tovar span.plus, div#pop-up-tovar span.minus, div#catalog div.tovars .tavar span span.minus, div#catalog div.tovars .tavar span span.plus {
    filter: brightness(0)invert(100%);
    width: 25px;
    display: block;
    cursor: pointer;
    position: relative;
    bottom: auto;
    left: auto;
}
div#pop-up-tovar div.tovars .tavar .number,
div#catalog div.tovars .tavar .number {
    display: flex;
    justify-content: center;
    padding: 4px 0px;
}



div#catalog {
    padding: 1% 10%;
    margin-top: 135px;
}
div#catalog div.tovars {
    display: grid;
    grid-template-columns: 22% 22% 22% 22%;
    grid-column-gap: 4%;
}
div#catalog div.tovars .tavar span {
    position: absolute;
    width: 94%;
    bottom: 20px;
    left: 0;
}
div#catalog div.tovars .tavar {
    margin-bottom: 4vw;
    border: 1px solid #383838;
    padding: 25px;
    border-radius: 25px;
    transition: 0.4s;
    position: relative;
    padding-bottom: 50px;
}
button {
    cursor:pointer;
    background: #e30613;
    font-size: 16px;
    border: none;
    padding: 10px 30px;
    color: #fff;
    font-weight: 600;
    letter-spacing: 1px;
    border-radius: 20px;
}
div#catalog div.tovars .tavar:hover {
    background: #222;
    border: 1px solid #ffffff;
}
div#pop-up-tovar span,
div#catalog div.tovars .tavar span {
    display: grid;
    grid-template-columns: 50% 50%;
}

input, select, textarea {
    box-sizing: border-box;
    max-width: 100%;
    background: #101010;
    border: 2px solid #080808;
    border-radius: 10px;
    padding: 10px 30px;
    /* display: table; */
    color: #fff;
    margin: 3px 0px 14px 0px;
}

div#catalog div.tovars .tavar b {
    text-align: center;
    display: table;
    width: 100%;
    padding: 20px 0px;
    margin: 0;
    font-size: 25px;
    color: #ffffff;
}
div#catalog div.tovars h3 {
    text-align: center;
    color: #fff;
}

div#catalog p {
    text-align: center;
    color: #fff;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0;
    margin: 0;
}
div#catalog h2 {
    font-size: 40px;
    color: #fff;
    text-align: center;
    text-transform: unset;
}
ul.tels {
    margin: 0;
    list-style: none;
    padding: 32px 0px;
    position: relative;
}
div#main-menu .tels li ul li a {
    color: #000;
}
.tels li:hover ul{
transform: scale(1);
}
#main-menu ul.tels li.a::after {
    content: '';
    background: url(/images/arrow-down.png);
    background-position: center;
    background-size: 8px;
    background-repeat: no-repeat;
    position: absolute;
    top: 47px;
    right: calc(50% - 8px);
    width: 17px;
    height: 20px;
}
.tels li ul {
    transition: 0.4s;
    position: absolute;
    left: -30px;
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    color: #000;
    padding: 13px 0px;
    width: calc(100% + 30px);
    padding-left: 30px;
    transform: scale(0);
}
.change li:hover ul{
transform: scale(1);
}

.change li ul {
    transition: 0.4s;
    position: absolute;
    left: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    color: #000;
    padding: 13px 0px;
    width: auto;
    transform: scale(0);
}
#main-menu ul.change li ul li {
    padding: 4px 10px;
}
#main-menu ul.change {
    display: flex;
    list-style: none;
    color: #fff;
    position: absolute;
    right: 20px;
    top: 16px;
    margin-left: 0;
    padding-left: 0;
}
#main-menu ul.change li {
    padding: 0px 10px;
    position: relative;
}
#main-menu ul.change li.a::after {
    content: '';
    background: url(/images/arrow-down.png);
    background-position: center;
    background-size: 8px;
    background-repeat: no-repeat;
    position: absolute;
    top: 15px;
    right: calc(50% - 8px);
    width: 17px;
    height: 20px;
}
#menu-categories {
    display: block;
    position: absolute;
    width: 100%;
    padding: 0px 30px;
}


div#menu-categories.categories-lip:hover img {
    margin-top: 0;
    opacity: 1;
}

div#menu-categories.categories-lip {
    position: fixed;
    top: 84px;
    background: #222222;
    padding: 10px 30px;
    padding-bottom: 6px;
    border-bottom: 1px solid #3e3e3e;
    border-top: 1px solid #3e3e3e;
    z-index: 9;
    max-width: 1920px;
}
a{text-decoration: none;}
div#menu-categories.categories-lip img {
    margin-top: -114px;
    opacity: 0;
}
div#menu-categories.categories-lip a {
    margin: 0px 10px;
    padding: 10px 0px;
}


#menu-categories button.slick-next.slick-arrow:hover{filter: brightness(0.6);}
#menu-categories button.slick-prev.slick-arrow:hover{filter: brightness(0.6);}
#menu-categories button.slick-next.slick-arrow {
    background: url(/images/arrow.png), #e30613;
    font-size: 0px;
    border: none;
    width: 25px;
    height: 25px;
    background-size: 10px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    transform: rotate(0deg);
    position: absolute;
    right: 15px;
    top: calc(50% - 12px);
    cursor: pointer;
    transition: 0.4s;
    padding: 0;
}

#menu-categories button.slick-prev.slick-arrow {
    background: url(/images/arrow.png), #e30613;
    font-size: 0px;
    border: none;
    width: 25px;
    height: 25px;
    background-size: 10px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    transform: rotate(180deg);
    position: absolute;
    left: 15px;
    top: calc(50% - 12px);
    cursor: pointer;
    transition: 0.4s;
    padding: 0;
}


#menu-categories img {
    width: 100px;
    display: table;
    margin: 0 auto;
    background: rgb(255 255 255 / 5%);
    border-radius: 50%;
    padding: 13px;
    margin-bottom: 10px;
    border: 2px solid #fff;
    transition: 0.4s;
}
#menu-categories a {
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1px;
    text-align: center;
    margin: 30px 10px;
    transition: 0.4s;
    text-decoration: none;
}
#menu-categories a.active {
    color: #e30613;
}
#slider-home {
    padding: 13% 10%;
    padding-bottom: 10%;
    background: url(/images/bg-overlay-2.jpg),#222222;
}
#slider-home ul.slick-dots li.slick-active button {
    background: #e30613;
}
#slider-home ul.slick-dots button {
    margin: 4px 4px;
    background: transparent;
    color: #fff;
    border-radius: 50%;
    border: 2px solid #fff;
    width: 25px;
    height: 25px;
    text-align: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    flex-direction: column-reverse;
    color: transparent;
    width: 10px;
    height: 10px;
    padding: 10px;
}
#slider-home button.slick-next.slick-arrow:hover{filter: brightness(0.6);}
#slider-home button.slick-prev.slick-arrow:hover{filter: brightness(0.6);}
#slider-home button.slick-next.slick-arrow {
    background: url(/images/arrow.png), #e30613;
    font-size: 0px;
    border: none;
    width: 50px;
    height: 50px;
    background-size: 17px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    transform: rotate(0deg);
    position: absolute;
    right: -8%;
    top: calc(50% - 25px);
    cursor:pointer;
    transition: 0.4s;
}

#slider-home button.slick-prev.slick-arrow {
    background: url(/images/arrow.png), #e30613;
    font-size: 0px;
    border: none;
    width: 50px;
    height: 50px;
    background-size: 17px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%;
    transform: rotate(180deg);
    position: absolute;
    left: -8%;
    top: calc(50% - 25px);
    cursor: pointer;
    transition: 0.4s;
}

#slider-home ul.slick-dots {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex!important;
    justify-content: center;
    width: 100%;
    position: absolute;
    bottom: -29%;
}
#slider-home h2 {
    color: #fff;
    font-size: 60px;
    margin: 0;
    padding: 0;
}
#slider-home p {
    margin: 0;
    padding: 15px 0px;
    color: #fff;
}
#slider-home a {
    font-weight: 400;
    text-align: center;
    background: #e30613;
    border: 0px solid #fff;
    color: #fff;
    padding: 22px 28px;
    border-radius: 5px;
    font-size: 14px;
    margin-top: 29px;
    line-height: 22px;
    letter-spacing: 2px;
    transition: 0.4s;
    display: block;
    width: 300px;
    position: relative;
    overflow: hidden;
    position: relative;
    bottom: 0;
    text-transform: uppercase;
}
#slider-home .slick-initialized .slick-slide div {
    display: flex;
    justify-content: center;
    flex-direction: column;
}
#slider-home a span{position: relative;}
#slider-home a:hover span{color:#000;}
#slider-home a:hover::before {
    top: 0%;
}
#slider-home a:hover {
    transform: translateY(-5px);
    border: 0px solid #ffbd01;
    color: #000;
}
#slider-home a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 100%;
    background: #ffffff;
    transition: 0.4s;
}


#slider-home img{}
#slider-home .slick-slide {
    display: none;
    float: left;
    height: auto;
    min-height: 1px;
}
#slider-home .slick-initialized .slick-slide {
    display: grid;
    grid-template-columns: 50% 50%;
    padding: 0px 4px;
}


a {
    cursor: pointer;
    box-sizing: border-box;
    color: #e30613;
}
:focus {
    outline: -webkit-focus-ring-color auto 0px;
}
div, span, img, p, ul, li {
    box-sizing: border-box;
}
body {
    padding: 0;
    margin: 0;
    font-family: 'Ubuntu', sans-serif;
    background: url(/images/bg-overlay-1.png),#1d1d1d;
}
img{width:100%;}


a.logo img {
    width: 220px;
    margin: 15px 0px;
}
div#main-menu a.logo {
    padding: 0;
}
div#main-menu {
    background: #222222;
    position: fixed;
    top: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0% 10%;
    border-bottom: 1px solid #3e3e3e;
    z-index: 99;
    height: 85px;
}
div#main-menu a:hover {
    color: #e30613;
}
div#main-menu a {
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: 600;
    padding: 32px 0px;
    position: relative;
    transition: 0.4s;
}
#main-menu span {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    margin-left: 5%;
}
#main-menu span .tel {
    margin-right: 35px;
}
#main-menu span a.user, #main-menu span a.cart {
    width: 35px;
    height: 35px;
    background: #e30613;
    display: block;
    padding: 8px;
    box-sizing: border-box;
    margin: 24px 7px;
    border-radius: 50%;
    transition: 0.4s;
}
body::-webkit-scrollbar-thumb {
    width: 10px;
    background: #505050;
}
::-webkit-scrollbar {
    width: 10px;
}

@media(max-width: 1800px){
#main-menu ul.change {
    position: relative;
    right: 20px;
} 
}
@media(max-width: 1600px){
div#catalog {
    padding: 1% 2%;
}
div#main-menu {
    padding: 0% 1%;
}
.posts-blog div a {
    font-size: 10px;
}
}
@media(max-width: 1400px){
#slider-home h2 {
    font-size: 44px;
}
#slider-home a {
    padding: 16px 1px;
}
}

@media(max-width: 1300px){
#menu-categories a {
    font-size: 10px;
    font-weight: 500;
}
div#menu-categories.categories-lip img {
    margin-top: -80px;
    opacity: 0;
}
#menu-categories img {
    width: 65px;
    padding: 7px;
}
a.logo img {
    width: 154px;
    margin: 24px 0px;
}
div#main-menu a {
    font-weight: 500;
    padding: 36px 0px;
    font-size: 12px;
}
div#catalog div.tovars {
    display: grid;
    grid-template-columns: 30% 30% 30%;
    grid-column-gap: 5%;
}
}








@media(max-width:1100px){
    #main-menu ul.change li.a {
        color: #e30613;
    }
    div#main-menu .tels li ul li a {
        color: #fff;
    }
    .tels li ul {
        position: relative;
        transform: none;
        left: auto;
        padding: 0;
        background: transparent;
    }
    .m-cart-cab .logo{}
.m-cart-cab {
    display: flex;
    position: fixed;
    right: 0;
    z-index: 9;
    background: #1d1d1d;
    width: 100%;
    padding-left: 94px;
}
.m-cart-cab a.user {
    width: 35px;
    height: 35px;
    background: #e30613;
    display: block;
    padding: 8px;
    box-sizing: border-box;
    margin: 24px 7px;
    border-radius: 50%;
    transition: 0.4s;
    right: 56px;
    position: absolute;
}   
 .m-cart-cab a.cart {
    width: 35px;
    height: 35px;
    background: #e30613;
    display: block;
    padding: 8px;
    box-sizing: border-box;
    margin: 24px 7px;
    border-radius: 50%;
    transition: 0.4s;
    right: 9px;
    position: absolute;
}   
.m-cart-cab a.cart span {
    background: transparent;
    text-align: center;
    color: #fff;
    width: 23px;
    padding: 5px;
    border-radius: 50%;
    position: absolute;
    right: 0px;
    bottom: -12px;
    font-size: 13px;
    font-weight: 600;
    text-shadow: 0px 1px 1px #000;
} 
#main-menu ul.change li ul li {
    padding: 4px 0px;
}
#main-menu ul.change li.a::after {
    top: 6px;
    left: 7px;
    opacity: 0;
}
#main-menu ul.change li ul li a {
    color: #fff;
    font-weight: 500;
    text-transform: none;
    text-align: left;
    width: 100%;
    padding: 2px 0px;
}
#main-menu ul.change li ul li a {
    color: #fff;
    font-weight: 500;
    text-transform: none;
    text-align: left;
    width: 100%;
}
#main-menu ul.change {
    position: relative;
    right: 0;
    margin: 0 auto;
    text-align: left;
    width: 100%;
    font-size: 11px;
    display: table;
    padding: 13px;
}
.change li ul {
    transition: 0.4s;
    position: relative;
    left: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    background: transparent;
    color: #fff;
    padding: 13px 0px;
    width: 100%;
    transform: scale(1);
    padding: 7px 0px;
}
#main-menu span a.user, #main-menu span a.cart {
    float: left;
    margin: 7px auto;
    margin-left: 42px;
}
ul.tels {
    margin: 0;
    list-style: none;
    padding: 10px 0px;
    position: relative;
    width: 100%;
}
#main-menu span {
    display: table;
    justify-content: space-between;
    flex-direction: row;
    margin-left: 0;
    width: 100%;
}
    #main-menu ul.tels li.a::after{display: none;}
div#main-menu a {
    font-weight: 500;
    padding: 11px 23px;
    font-size: 12px;
    width: 100%;
    display: table;
    box-sizing: border-box;
}
a.logo img {
    width: 154px;
    margin: 24px auto;
    display: table;
}
div#main-menu {
    position: fixed;
    display: block;
    width: 220px;
    padding-top: 64px;
    height: 100vh;
    overflow-x: scroll;
    transition: 0.4s;
    left: -220px;
}
.cmn-toggle-switch span {
    display: block;
    position: absolute;
    top: 24px;
    left: 15px;
    right: 18px;
    height: 2px;
    width: 18px;
    background: white;
    border-radius: 100px;
}
.cmn-toggle-switch span::before, .cmn-toggle-switch span::after {
    position: absolute;
    display: block;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #ffffff;
    content: "";
}

.cmn-toggle-switch span::before {
    top: -6px;
    height: 2px;
    border-radius: 100px;
}
.cmn-toggle-switch span::after {
    bottom: -6px;
    height: 2px;
    border-radius: 100px;
}

/**
 * Style 1
 *
 * Rotating hamburger icon (rot), that simply rotates 90 degrees when activated.
 * Nothing too fancy, simple transition.
 */
.cmn-toggle-switch__rot {
  background-color: #28aadc;
}

.cmn-toggle-switch__rot span {
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

/* active state, i.e. menu open */
.cmn-toggle-switch__rot.active {
  background-color: #166888;
}

.cmn-toggle-switch__rot.active span {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}

/**
 * Style 2
 * 
 * Hamburger to "x" (htx). Takes on a hamburger shape, bars slide
 * down to center and transform into an "x".
 */
 .cmn-toggle-switch__htx {
    position: fixed;
    top: 19px;
    left: 24px;
    z-index: 999;
    border: none!important;
    height: 48px;
    width: 48px!important;
    padding: 0;
    display: block;
    background: #e30613;
    background-color: #e30613!important;
    cursor: pointer;
    transition: 1.0s;
    color: transparent;
    margin: 0;
    border-radius: 0;
    border: none;
}

.cmn-toggle-switch__htx span {
    font-size: 0px;
    -webkit-transition: background 0s 0.3s;
    transition: background 0s 0.3s;
    color: #ccb27f;
    background: #ffffff;
}

.cmn-toggle-switch__htx span::before,
.cmn-toggle-switch__htx span::after {
  -webkit-transition-duration: 0.3s, 0.3s;
          transition-duration: 0.3s, 0.3s;
  -webkit-transition-delay: 0.3s, 0s;
          transition-delay: 0.3s, 0s;
}

.cmn-toggle-switch__htx span::before {
  -webkit-transition-property: top, -webkit-transform;
          transition-property: top, transform;
}

.cmn-toggle-switch__htx span::after {
  -webkit-transition-property: bottom, -webkit-transform;
          transition-property: bottom, transform;
}
div#main-menu.menu-open-open {
    left: 0;
}
/* active state, i.e. menu open */
.cmn-toggle-switch__htx.active {
    /* left: 183px; */
    background-color: #fff!important;
}

.cmn-toggle-switch__htx.active span {
  background: none;
}
.cmn-toggle-switch__htx.active span::before, .cmn-toggle-switch__htx.active span::after {
    background: #e30613;
}
.cmn-toggle-switch__htx.active span::before {
  top: 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.cmn-toggle-switch__htx.active span::after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.cmn-toggle-switch__htx.active span::before,
.cmn-toggle-switch__htx.active span::after {
  -webkit-transition-delay: 0s, 0.3s;
          transition-delay: 0s, 0.3s;
}

/**
 * Style 3
 *
 * Hamburger to left-arrow (htla). Hamburger menu transforms to a left-pointing
 * arrow. Usually indicates an off canvas menu sliding in from left that
 * will be close on re-click of the icon.
 */
.cmn-toggle-switch__htla {
  background-color: #32dc64;
}

.cmn-toggle-switch__htla span {
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

.cmn-toggle-switch__htla span::before {
  -webkit-transform-origin: top right;
      -ms-transform-origin: top right;
          transform-origin: top right;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, top 0.3s;
          transition: transform 0.3s, width 0.3s, top 0.3s;
}

.cmn-toggle-switch__htla span::after {
  -webkit-transform-origin: bottom right;
      -ms-transform-origin: bottom right;
          transform-origin: bottom right;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, bottom 0.3s;
          transition: transform 0.3s, width 0.3s, bottom 0.3s;
}

/* active state, i.e. menu open */
.cmn-toggle-switch__htla.active {
  background-color: #18903c;
}

.cmn-toggle-switch__htla.active span {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.cmn-toggle-switch__htla.active span::before,
.cmn-toggle-switch__htla.active span::after {
  width: 50%;
}

.cmn-toggle-switch__htla.active span::before {
  top: 0;
  -webkit-transform: translateX(42px) translateY(3px) rotate(45deg);
      -ms-transform: translateX(42px) translateY(3px) rotate(45deg);
          transform: translateX(42px) translateY(3px) rotate(45deg);
}

.cmn-toggle-switch__htla.active span::after {
  bottom: 0;
  -webkit-transform: translateX(42px) translateY(-3px) rotate(-45deg);
      -ms-transform: translateX(42px) translateY(-3px) rotate(-45deg);
          transform: translateX(42px) translateY(-3px) rotate(-45deg);
}

/**
 * Style 4
 *
 * Hamburger to right-arrow (htra). Hamburger menu transforms to a
 * right-pointing arrow. Usually indicates an off canvas menu sliding in from 
 * right that will be close on re-click of the icon.
 */
.cmn-toggle-switch__htra {
  background-color: #ff9650;
}

.cmn-toggle-switch__htra span {
  -webkit-transition: -webkit-transform 0.3s;
          transition: transform 0.3s;
}

.cmn-toggle-switch__htra span::before {
  -webkit-transform-origin: top left;
      -ms-transform-origin: top left;
          transform-origin: top left;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, top 0.3s;
          transition: transform 0.3s, width 0.3s, top 0.3s;
}

.cmn-toggle-switch__htra span::after {
  -webkit-transform-origin: bottom left;
      -ms-transform-origin: bottom left;
          transform-origin: bottom left;
  -webkit-transition: -webkit-transform 0.3s, width 0.3s, bottom 0.3s;
          transition: transform 0.3s, width 0.3s, bottom 0.3s;
}

/* active state, i.e. menu open */
.cmn-toggle-switch__htra.active {
  background-color: #e95d00;
}

.cmn-toggle-switch__htra.active span {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

.cmn-toggle-switch__htra.active span::before,
.cmn-toggle-switch__htra.active span::after {
  width: 50%;
}
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: initial;
    width: auto;
    background: transparent;
}
.cmn-toggle-switch__htra.active span::before {
  top: 0;
  -webkit-transform: translateX(-6px) translateY(3px) rotate(-45deg);
      -ms-transform: translateX(-6px) translateY(3px) rotate(-45deg);
          transform: translateX(-6px) translateY(3px) rotate(-45deg);
}

.cmn-toggle-switch__htra.active span::after {
  bottom: 0;
  -webkit-transform: translateX(-6px) translateY(-3px) rotate(45deg);
      -ms-transform: translateX(-6px) translateY(-3px) rotate(45deg);
          transform: translateX(-6px) translateY(-3px) rotate(45deg);
}
.home .cmn-toggle-switch, .home #main-mobile-menu {
    position: fixed;
}

.cmn-toggle-switch{display:block;}
}


@media(max-width:1000px){
#footer div.b .c {
    text-align: left;
    padding: 9px 0px;
}
#footer div.b .b {
    display: table;
    text-align: left;
    padding: 10px 0px;
}
#footer div.b {
    display: grid;
    grid-template-columns: 100%;
    width: 100%;
    padding-top: 27px;
}
#slider-home {
    padding: 18% 10%;
}
input.curProductCount {
    width: 40px;
}
input.curProductCount {
    width: 27px;
}
div#pop-up-tovar a.add, div#catalog div.tovars .tavar a.add {
    padding: 12px 0px;
    font-size: 10px;
}
}

@media(max-width:800px){
    .modal-content {
        padding: 19px;
    }
    .modal-content h1 {
        font-size: 1em;
        margin: 0;
        font-weight: 100;
    }
    div#pop-up-tovar span {
        width: 100%;
    }
    #pop-up-tovar .number {
        display: flex;
        flex-direction: initial;
        justify-content: center;
        padding: 4px 0px;
        width: 100px;
        margin: 0 auto;
    }
    #slider-home button.slick-next.slick-arrow,#slider-home button.slick-prev.slick-arrow{
        display:none!important;
    }
    section.posts-show-blog h3 {
        font-size: 1.5em;
    }
    section.posts-show-blog img {
        max-width: 100%;
        width: 100%;
    }
div#main-content.cart .span {
    grid-template-columns: 50% 50%;
}
.posts-blog {
    display: grid;
    grid-template-columns: 47% 47%;
    grid-column-gap: 4%;
    padding: 50px 10%;
}
#restorany span#filter a {
    font-size: 10px;
}
#zag-page h1 {
    margin: 0;
    padding: 0;
    font-size: 30px;
}
#pop-up-tovar b {
    color: #fff;
    font-size: 20px;
    padding-bottom: 20px;
    display: table;
}
#pop-up-tovar h3 {
    font-size: 29px;
}
#pop-up-tovar div {
    padding: 0px 15px;
}
div#pop-up-tovar {
    grid-template-columns: 100%;
    overflow-x: hidden;
    overflow-y: scroll;
    padding: 0px 0px;
    margin: 0;
    grid-column-gap: 0;
    padding: 0!important;
    padding-bottom: 20px!important;
    display: block;
}
#footer div.a a {
    padding: 0px 15px;
    width: 100%;
    display: table;
}
#slider-home img {
    padding: 19% 0%;
}
#slider-home button.slick-next.slick-arrow {
    right: -11%;
}
#slider-home button.slick-prev.slick-arrow {
    left: -11%;
}
div#catalog div.tovars {
    display: grid;
    grid-template-columns: 46% 46%;
    grid-column-gap: 7%;
}
#slider-home h2 {
    font-size: 35px;
}
    #slider-home a {
    padding: 12px 1px;
    font-size: 17px;
    width: auto;
}
}



@media(max-width:600px){
    div#catalog div.tovars h3 {
        text-align: center;
        color: #fff;
        font-size: 14px;
        font-weight: 100;
    }
#footer div.a {
    width: 100%;
}
#footer div.b .b {
    display: table;
    text-align: left;
    padding: 27px 0px;
}
#footer div.a a {
    padding: 2px 15px;
    width: 100%;
    display: table;
    text-align: center;
}
#footer a.logo {
    display: table;
    float: none;
    width: 20%;
    margin: 0 auto;
}
.cart-result button {
    margin: 0;
    margin-top: 20px;
}
    
p.cart-result {
    margin: 0 auto;
    display: block;
    text-align: center;
}
div#main-content.cart .span {
    grid-template-columns: 100%;
    display: table;
}
div#main-content.cart .span img {
    float: left;
    width: 25%;
}
div#main-content.cart .span .number img{width:auto;}   
    
    
#cabinet span#filter a {
    font-size: 10px;
}
.posts-blog {
    display: grid;
    grid-template-columns: 100%;
    grid-column-gap: 0;
    padding: 50px 10%;
}
#cat-places img {
    float: left;
    width: 100%;
    margin-right: 25px;
    border-radius: 25px;
    padding-bottom: 20px;
}
div#pop-up-tovar a.add {
    margin: 0 auto;
    margin-top: 20px;
}
div#catalog p {
    font-size: 12px;
    font-weight: 100;
}
div#catalog div.tovars .tavar b {
    padding: 5px 0px;
    font-size: 20px;
}
div#catalog div.tovars .tavar a.add {
    padding: 12px 0px;
    font-size: 10px;
    width: 100px;
    margin: 10px auto;
}
div#catalog div.tovars img {
    width: 100%;
    border-radius: 10px;
}
div#catalog div.tovars {
    grid-template-columns: 49% 49%;
    grid-column-gap: 2%;
}
div#catalog div.tovars .tavar {
    padding: 9px;
    padding-bottom: 125px;
}
div#pop-up-tovar span, div#catalog div.tovars .tavar span {
    display: grid;
    grid-template-columns: 100%;
}
div#catalog h2 {
    font-size: 27px;
}
#slider-home a {
    padding: 12px 1px;
    font-size: 17px;
    width: 200px;
    /* margin: 0 auto; */
}
#slider-home img {
    padding: 55px 0%;
    padding-bottom: 0;
}
#slider-home .slick-initialized .slick-slide {
    display: grid;
    grid-template-columns: 100%;
    padding: 53px 4px;
}
#slider-home ul.slick-dots {
    bottom: -7%;
}
}






@media(max-width:400px){
#pop-up-tovar h3 {
    font-size: 19px;
}
a.logo img {
    width: 108px;
    margin: 29px auto;
    display: table;
}
#slider-home h2 {
    font-size: 30px;
}
#slider-home button.slick-next.slick-arrow,
#slider-home button.slick-prev.slick-arrow{display: none!important;}

}




