
:root {
  --ser: #9C9999;
  --main:#404040;
  --grey: #F1F1F1;
  --border:#DBDBDB;
  --black:#000
}


h1, .h1 {font-size: 32px; line-height: 42px;  }
h2, .h2 {font-size: 24px; line-height: 36px; color: #0671c4 }
h3, .h3 {font-size: 16px; line-height: 24px;  }
h4, .h4 {font-size: 16px; line-height: 24px;  }
.button-16 {font-size: 16px;}
.button-12 {font-size: 12px;}
.font-20 {font-size: 20px; line-height: 30px;}
.font-14 {font-size: 14px; line-height: 24px;}

.down_logos img {width: 140px; height: auto;}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1300px; 
    }
}

.dzen {width: 30px; height: 30px; border-radius: 50%; opacity: 1}
.social_buttons a img.vk {width: 35px; height: 35px; border-radius: 50%; opacity:1}


ul.header_menu {display: flex; padding: 0px; margin: 0px;   min-width: 450px;}
ul.header_menu>li {display: block; margin-right: 20px; position: relative}
ul.header_menu>li>a {display: block; font-size: 16px; font-weight: 400;  line-height: 24px; position: relative; }
ul.header_menu>li>ul {position: absolute; top: 0px; z-index: 2; width: 200px; background: #fff; box-shadow: -1px 0px 4px 0px #00000078; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; transition: all 0.3s;}
ul.header_menu>li:hover>ul{opacity: 1; visibility: visible;}
ul.header_menu>li>ul>li {display: block;}
ul.header_menu>li>ul>li>a {display: block; padding: 5px 10px; font-size: 14px; line-height: 18px; text-decoration: none}
ul.header_menu>li>ul>li>a:hover {color: #000; background: #f9f9f9} 

ul.header_menu>li.menu-item-has-children>a {padding-right: 20px;} 
ul.header_menu>li.menu-item-has-children>a::after {
    content: "";
    height: 18px;
    width: 18px;
    position: absolute; right: 0px; top: 5px;
    min-width: 18px;
    background: url(images/caret-down.svg);
    transition: .5s ease;
}

.f_menu_line {border-bottom: 1px solid #ccc; position: relative; z-index: 10; background: var(--grey)}
.s_menu_line {border-bottom: 1px solid #ccc; background: #f3f3f3; padding: 20px 0}


ul.second_menu {display: flex; padding: 0px; margin: 0px;   min-width: 450px;}
ul.second_menu>li {display: block; margin-right: 20px; position: relative}
ul.second_menu>li>a {display: block; font-size: 16px; font-weight: 400;  line-height: 24px; position: relative; color: #0671c4 }
ul.second_menu>li>ul {position: absolute; top: 20px; z-index: 10; width: 200px; background: #fff; box-shadow: -1px 0px 4px 0px #00000078; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; transition: all 0.3s;}
ul.second_menu>li:hover>ul{opacity: 1; visibility: visible;}
ul.second_menu>li>ul>li {display: block;}
ul.second_menu>li>ul>li>a {display: block; padding: 5px 10px; font-size: 14px; line-height: 18px; text-decoration: none; color: #0671c4}
ul.second_menu>li>ul>li>a:hover {color: #000; background: #f9f9f9} 

ul.second_menu>li.menu-item-has-children>a {padding-right: 20px;} 
ul.second_menu>li.menu-item-has-children>a::after {
    content: "";
    height: 18px;
    width: 18px;
    position: absolute; right: 0px; top: 5px;
    min-width: 18px;
    background: url(images/caret-down.svg);
    transition: .5s ease;
}


ul.header_menu li a:hover, ul.second_menu li a:hover {text-decoration: none; opacity: 0.6}

.header_buttons_wrapper { margin-left: 20px;}
.mobile_menu_open {height: 70px; width: 60px; background: #0671c4; border:#0671c4; display: flex; align-items: center; justify-content: center}
.mobile_menu_open img {max-width: 80%; }
.mega_wrapper_mask {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 1; opacity: 0; visibility: hidden;-webkit-transition: all 0.3s; transition: all 0.3s; }
.mega_wrapper {position: fixed; left: 0px; top: 70px; width: 100%; height: auto; background: #f9f9f9; border: 1px solid #ccc; z-index: 3; padding: 0px 30px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s; transition: all 0.3s;}

.mega_wrapper_mask.active, .mega_wrapper.active {opacity: 1; visibility: visible;}
.f_m_close {display: flex; justify-content: flex-end; padding-top: 20px;}
.mobile_menu_close {border: transparent; background: #334657; color: #fff; width: 30px; height: 30px; font-size: 24px; display: flex; align-items: center; justify-content: center; }
.mobile_menu_close span {transform: rotate(45deg); position: relative;}
.mega_menu {padding: 30px 0px; margin: 0px; text-transform: uppercase}
.mega_menu>li {display: block; margin-bottom: 5px}
.mega_menu>li>a {font-size: 14px; line-height: 22px;}


.mega_menu>li>ul {margin: 10px 0px 20px 20px;}
.mega_menu>li>ul>li {display: block; position: relative; padding-left: 15px;} 
.mega_menu>li>ul>li:before {width: 6px; height: 6px; background: #ccc; content: ''; position: absolute; left: 0px; top: 7px;}
.mega_menu>li>ul>li>a {font-size: 10px; line-height: 18px;}


body.admin-bar {padding-top: 40px}
.mobile {display: none}

.header {position: fixed; z-index: 1000; height: 70px; left: 0px; top: 0px; width: 100%; background: var(--grey);}
.admin-bar .header {top: 32px;}
.wrapper {padding-top: 70px}
.top_line {display: flex; align-items: center; position: relative; padding: 0px ; height: 70px; border-bottom: 1px solid var(--border); border-radius: 6px; }
a.logo {  position: relative; left: 0px; top: 0px; height: 70px; margin-right: 30px; width: 200px; display: flex; align-items: center; justify-content: flex-start; padding-left: 15px; padding: 5px;}
a.logo img {height: 100%; width: auto;}

.top_line_right {position: relative;  right: 0px; top: 0px;   display: flex; align-items: center; justify-content: flex-end}
 
.social_buttons {display: flex; align-items: center; justify-content: flex-end}
.social_buttons a {margin-left: 10px;}
.social_buttons a:hover {opacity: 0.5}
.social_buttons a img {width: 30px; height: auto;}


.mega_wrapper .social_buttons { justify-content: flex-start; padding: 20px 0}
.mega_wrapper  .social_buttons a {margin-left: 0px; margin-right: 10px;}
 

#search_form {height: 42px; display: block; flex: 1; position: relative; padding: 0px 42px 0px 0px; border: 1px solid var(--border); border-radius: 0px; background: #fff; overflow: hidden; margin-right: 35px;}
#search_form input {display: block; width: 100%; border: transparent; height: 40px; background: transparent; padding: 14px 30px;}
#search_form button {height: 42px; width: 42px; position: absolute; right: 0px; top: 0px; border: transparent; background: transparent;}

.cards {max-width: 460px; height: auto;}
.logo_trust {text-transform: uppercase; margin-left: auto}
.logo_trust .h2 {line-height: 32px}

.footer_revert {flex-direction: row-reverse; flex-wrap: wrap; display: flex; align-items: flex-start; justify-content: flex-end}

.copy {color: #949DA5; font-size: 12px;}
.copy a {color: #757575; text-decoration: none}


.main_wrapper {display: block;   padding-left: 360px; position: relative;}
.left_bar {width: 340px; min-width: 340px; margin-right: 0px; margin-left: -360px; float: left }
.right_bar { display: block;}

.index_slider_wrapper {background: var(--grey); padding: 30px 60px; display: flex;}
.index_slider_wrap {width: 50%; min-width: 50%; display: block;}

.index_slider_item img {max-width: 100%  }
.index_slider.owl-carousel { position: relative; }
.index_content {display: flex; align-items: center; justify-content: center; width: 50%; min-width: 50%; padding: 0px 20px;}
.index_content>div {max-width: 390px; text-align: center; }

a.blackbutton, .blackbutton {height: 50px; background: #334657; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; text-transform: uppercase; border: 1px solid #000;}
.blackbutton:hover {background: transparent; color: #000; text-decoration: none}

.mediumbutton.blackbutton {height: 39px; border-radius: 3px; font-weight: 500}
.smallbutton.blackbutton {height: 24px; border-radius: 3px; font-weight: 500; font-size: 12px}




.index_content .h1{text-transform: uppercase}

.owl-carousel .owl-dots {display: flex; align-items: center; justify-content: center; padding: 5px 0}
.owl-carousel .owl-dots button.owl-dot {width: 10px; height: 10px; border-radius: 50%; background: #000; border: transparent; margin: 5px }
.owl-carousel .owl-dots button.owl-dot.active {background: #f1f1f1}

.my_row {display: flex; flex-wrap: wrap; margin: 0px -10px; justify-content: stretch;}
.mycol {padding: 0px 10px}
.mycol-3 {width: 33%; min-width: 33.33%}
.mycol-4 {width: 25%; min-width: 25%}
.action_block {background: var(--grey); padding: 7px 10px;}

.action_block {display: flex; align-items: center ; justify-content: stretch; position: relative; height: 180px}
.action_thumb {width: 40%; min-width: 40%}
.action_thumb img {max-width: 100%; height: auto;}

.best_block {background: var(--grey); padding: 7px 10px; display: flex; align-items: flex-end}
.best_thumb {width: 40%; min-width: 40%; height: 92px;}
.best_thumb img { object-fit:cover; width: 100%; height: 100%;}
.best_body {padding: 10px 10px 0px 10px; flex: 1}
.best_body a {width: 100%}
.index_actions {padding: 20px 0}
.action_body {padding: 20px 10px 40px 10px;     text-align: center; position: relative; font-weight: 300; line-height: 24px; align-self: stretch;}
.action_body a {position: absolute; left: 10px; width: calc(100% - 20px); bottom: 10px; }

.action_title.font-20 {line-height: 20px;}



.single_gallery {display: block; padding-left: 80px; position: relative; margin-bottom: 30px;}
.gallery_thumbs {width: 70px; min-width: 70px;   position: absolute; left: 0px; top: 0px; }

.gallery_thumbs a {width: 70px; height: 70px; display: block; margin-bottom: 22px; border-radius: 3px;  border: 1px solid #ddd; position: relative; overflow: hidden; padding: 5px;}
.gallery_thumbs a.active {border: 1px solid #333}
.gallery_thumbs a img {position: absolute; border: 3px solid #fff; left: 0px; top: 0px; width: 100%; height: 100%; object-fit:cover}

.single_slider_item img {max-width: 100%; height: auto;}
.single_slider { padding:0px 0px; display: block;}
.big_thumb {display: block;  position: relative;}
.big_thumb img {max-width: 100%}

.bestseller {color: #2ECC71; font-size: 14px; line-height: 18px; position: relative; padding: 0px 0px 0px 15px; margin-bottom: 20px; }
.bestseller:after {content: ''; width: 10px; height: 10px; background: #2ECC71; position: absolute; left: 0px; top: 4px; border-radius: 50%;}

.product_form select {width: 100%; height: 44px;}

.order_wrap {display: flex; margin-bottom: 20px}

.order_button {border: 1px solid #404040; background: #404040; color: #fff; height: 44px; border-radius: 3px; min-width: 210px; font-size: 14px; margin-left: 10px}
.order_button:hover {background: #fff; color:#404040 }
#size_select {margin-bottom: 10px;}

.product_price {padding: 0px 0 10px 0}
.product_price h3 {padding: 0px; margin: 0px; font-size: 20px;}
.product_price .quo_sign {font-size: 16px;}

.single_info h3 {text-transform: uppercase}

.description {color: #565663; font-size: 14px; line-height: 18px;}

a.customize {display: inline-flex; height: 44px; border-radius: 4px; border: 1px solid #404040; color: #404040; align-items: center; justify-content: center; padding: 0px 15px; margin-bottom: 20px;}
a.customize:hover {background:#404040; color: #fff; text-decoration: none }

.upper {text-transform: uppercase}

.sale_thumb {position: relative; height: 150px; margin-bottom: 10px; cursor: pointer }
.sale_thumb img.sale_main_image {display: block; margin: 0px auto; height: 100%; width: auto;}

.sale_img {position: absolute; width: 50px; height: 50px; right: 0px; top: 0px;}

.sale_old {font-size: 12px; text-transform: uppercase; color: #BDBDBD; text-decoration: line-through}
.sale_new {font-size: 14px; color: #222222; text-transform: uppercase; margin-right: 10px; }

.sale_block {padding: 0px 0px 90px 0px; position: relative; height: 100%}
.sale_block a {position: absolute; bottom: 0px; width: 100%; font-size: 12px; text-transform: uppercase}

.sale_block .sale_prices {position: absolute; bottom: 50px; width: 100%; font-size: 12px; text-transform: uppercase}


.index_sale {padding: 30px 0}
.single_product_page h1 {margin-bottom: 30px;}

.pagination {display: flex; align-items: center; justify-content: center}

.pagination a, .pagination span {color: #DBDBDB; text-decoration: none; font-size: 12px; margin: 0px 7px}
.pagination span {color: #000}

.arc_block_button {display: flex; align-items: center; justify-content: center; padding: 25px 0}
.arc_block_button a {width: 274px; min-width: 274px}


.cus_image {margin-bottom: 20px;}
.cus_image img {max-width: 100%; height: auto}

.cus_block {font-size: 14px; line-height: 18px; font-weight: 300}


.myform {display: block}
.myform label {display: block; width: 100%; margin-bottom: 10px;}
.myform label input[type="text"],
.myform label input[type="email"],
.myform label textarea {min-height: 50px; padding: 10px; font-size: 14px; border: 1px solid #ccc; background: #fff; 
	outline: none; display: block; width: 100%}

.myform button {width: 100%}
.myform label.for_check {position: relative; padding: 8px 0px 0px 30px; font-size: 12px; line-height: 16px; margin-top: 10px; margin-bottom: 20px;}
.myform label.for_check span {width: 19px; height: 19px; display: flex; align-items: center; justify-content: center; position: absolute; left: 0px; top: 6px; border: 1px solid #DBDBDB}
.myform label.for_check span img {width: 100%; height: auto; opacity: 0}

.myform label.for_check input {position: absolute; left: 0px; top: 0px; opacity: 0}

.myform label.for_check input:checked~span img{opacity: 1}

iframe {max-width: 100%}







.sizes {display: flex; }
.product_form label {display: block; margin-bottom: 10px; border: 1px solid #ccc; background: #fff; margin: 3px; position: relative; overflow: hidden}
.product_form label input {position: absolute; left: -999px}
.product_form label span {width: 30px; height: 30px; padding: 5px 10px;}
.product_form label input:checked~span {background: red; color: #fff}





.single_order_nums {
    border: 1px solid #ddd;
    border-radius: 40px;
    height: 40px;
    width: 100%;
    max-width: 160px;
    padding: 0px 50px;
    position: relative;
    margin: 20px 0;
}
.single_order_nums button {
    display: flex
;
    align-items: center;
    justify-content: center;
    border: transparent;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: transparent;
}
.single_order_nums button.fr {
    left: auto;
    right: 0px;
}
.single_order_nums input {
    max-width: 100%;
    height: 40px;
    text-align: center;
    background: transparent;
    border: transparent;
}


.product_cart_line {display: flex; flex-wrap: wrap; padding:20px 30px 20px 20px; position: relative; border: 1px solid #ddd; margin-bottom: 10px; align-items: center;}
.product_image {width: 110px; height: 150px; min-width: 110px; margin-right: 10px; border: 1px solid #ddd; position: relative}
.product_image img {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit:contain}
.product_title {width: 200px; padding: 0px 20px; min-width: 200px;}
.product_count {width: 180px; padding: 20px 20px; min-width: 100px;}
.count_numbers {display: flex; }
.count_numbers .count_nums {width: 40px; min-width: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; cursor: pointer}
.count_numbers input {max-width: 60px; min-width: 60px; width: 60px; text-align: center; margin: 0px 2px}
.delete_prod {position: absolute; top: 10px; right: 10px;}

.order_form label {display: block; width: 100%; margin-bottom: 10px;}
.cart_product_price {font-size: 40px; line-height: 40px;}
.cart_product_price small {font-size: 20px;}
.product_item {padding: 0px 0px 50px 0px; border: 1px solid #ddd; background: #fff; height: 100%; position: relative}

.product_item_thumb {height: 300px; position: relative}
.product_item_thumb img {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit:cover}

.product_item h4 {font-size: 16px; font-weight: bold; line-height: 24px; padding: 20px;}
.product_item a.more {position: absolute; bottom: 20px; right: 20px}

.row.mb {padding: 0px 0}
.mb>div {margin-bottom: 30px;}

.cart_stat {font-size: 15px;}
.cart_stat span {font-size: 24px; font-weight: 300}
.promo_wrapper {margin-bottom: 20px;}
.promo_wrapper input {margin-bottom: 10px;}
.payform {max-width: 500px;}
.payform label {display: block;  position: relative; margin-bottom: 20px;}
.payform label span {position: relative; display: flex;border: 1px solid #ddd; align-items: center; justify-content: center; }
.payform label input:checked~span {border:1px solid #000}
.payform label input {position: absolute; left: 0px; opacity: 0}
.payform button {width: 100%}

.p_c_left {display: flex;   align-items: center; min-width: 50%}
.p_c_right {display: flex; align-items: center}

.undex_cus {padding-top: 30px;}



.front_news {border: 1px solid #768b9c; padding: 20px; max-height: 470px; overflow-y: auto}

.news_short_block {margin-bottom: 10px; }
.news_short_block h3 {font-size: 12px; line-height: 16px; margin-bottom: 2px; text-transform: none }
.news_date {font-size: 12px; color: #768b9c}


.news_short_block_with_image {display: flex; }
.news_short_block_with_image .thumb_wrapper {width: 90px; min-width: 90px; margin-right: 10px; height: 60px; position: relative;}
.news_short_block_with_image .thumb_wrapper img {position: absolute; left: 0px; width: 100%; height: 60px; top: 0px; object-fit:cover; }
.news_short_block_with_image h3 {font-size: 12px; line-height: 16px; margin-bottom: 2px; text-transform: none}

.news_big_block_with_image {display: block; padding: 5px; background: #f2f2f2}
.news_big_block_with_image .thumb_wrapper {width: 100%; height: 200px;  margin-buttom: 10px;  position: relative;}
.news_big_block_with_image .thumb_wrapper img {position: absolute; left: 0px; width: 100%; height: 100%; top: 0px; object-fit:cover; }
.news_big_block_with_image h3 {font-size: 16px; line-height: 24px; margin-bottom: 10px; text-transform: none}
.news_big_block_with_image .news_short_block_body {padding: 5px 10px 10px 10px;}

h2.title {padding: 20px 0px; border-bottom: 2px solid #ccc;   margin-bottom: 30px; display: flex; align-items: center; }
h2.title a {margin-left: auto; font-size: 14px; line-height: 18px; color: #fd7045; border-bottom: 1px dashed #fd7045}
h2.title a:hover {text-decoration: none; color: #000; border-bottom: 1px dashed #000}

.wide_block {max-width: 950px;}


.front_blog_section {padding: 50px 0 5px 0; background: #f2f2f2}

.mega_name {background: #334657; color: #fff; padding: 30px 15px; width: 295px; min-width: 295px; position: relative}
.mega_name img {width: 150px; height: auto; position: absolute; bottom: 0px; right: -140px;}
.gk {background: #f2f2f2}
.mega_name h2 {color: #fff}
.sub_flex {display: flex; align-items: center; background: #f2f2f2; margin: 30px 0 }
.mega_body {display: flex; align-items: center;  padding: 0px 30px 0px 200px; flex: 1}


.front_faq_section {padding: 50px 0 50px 0; background: #334657; color: #fff;}
.theme_wrapper button {border: 1px solid #fd7045; margin: 5px; color: #fd7045; font-size: 12px; background: transparent; padding: 5px 10px}
.theme_wrapper button.active {background: #fd7045; color: #fff;}

.front_faq_section h2 {color:#fd7045}
.theme_wrapper a {border: 1px solid #fd7045; margin: 5px; color: #fd7045; font-size: 12px; background: transparent; padding: 5px 10px}
.theme_wrapper a.active, .theme_wrapper a:hover {background: #fd7045; color: #fff; text-decoration: none}

.front_faq_section a {color: #fff;}

.faq_block {border: 1px solid #ddd; margin-bottom: 10px;}


.question {display: block; text-align: left; background: transparent; color: #fff; padding: 10px 30px 10px 10px; border: transparent; outline: none; position: relative; width: 100%}
.question::after {
    content: "";
    height: 18px;
    width: 18px;
    position: absolute; right: 0px; top: 5px;
    min-width: 18px;
    background: url(images/caret-down.svg);
    transition: .5s ease;
}
.faq_block.active .question::after{transform: rotate(180deg)}

.answer {padding: 0px 20px; overflow: hidden; height: 0px; -webkit-transition: all 0.3s; transition: all 0.3s;}
.faq_block.active .answer {height: auto} 


#faq_areas .faq_block {border: 1px solid #334657; margin-bottom: 10px;}

#faq_areas .question{color: #334657}

#faq_area, #faq_areas {padding: 30px 0}

.breadcrumbs, .breadcrumbs a {font-size: 12px; line-height: 16px; margin-bottom: 10px;}

.galleryblock {padding: 30px 0px;}
.galleryblock li {display: block;}
article {padding-bottom: 50px;}
article a {color: #0671c4}
article img {max-width: 100%; height: auto}
article ul, article ol {margin-left: 30px;}
article table {width: 100%; border-collapse: collapse}
article table td, article table th  {border:1px solid #ddd;}
article table th {background: #f9f9f9}

.share_block {background: #f2f2f2; padding: 20px; margin-bottom: 20px;}

.mar_b {margin-bottom: 30px;}

.pagination {padding: 30px 0px; display: flex; align-items: center; justify-content: center;}
.pagination a, .pagination span {padding: 5px 10px; border: 1px solid #334657; color: #334657; margin: 3px;}
.pagination a:hover, .pagination span {background: #fd7045; color: #fff;}

.top_banners img {max-width: 100%; height: auto}