:root {
	--all-width: 96%;
	--top: 100px;
	--font-grey: #999;
	--font-black: #151515;
	--font-orange: #f3a416;
	--font-small: 16px;
	--num-font: Roboto;
	--borders: #e8e8e8;
	--bg-color: #f8f8f8
}

* {margin: 0; padding: 0}
html * {max-height:20000px;}
body {font-family: Roboto, Arial; font-size: 17px; font-weight: 500; color: var(--font-black)}
div, section {box-sizing: border-box; position: relative; overflow: hidden}
section {overflow: auto}
h1 {font-family: Montserrat; font-weight: 800; font-size: 62px; 1text-transform: uppercase; color: var(--font-black); line-height: 90%; letter-spacing: -2px; margin-bottom: 12px}
h1 span {font-size: 36px; font-weight: 900; line-height: 100%; padding-left: 3px; letter-spacing: 0}
h2 {font-family: Montserrat; font-weight: 800; font-size: 62px; 1text-transform: uppercase; color: var(--font-black); letter-spacing: -1px; line-height: 100%; margin-bottom: 21px; text-align: center}
h2 a, a:visited{color: var(--font-black);}
h3 {font-family: Roboto; font-weight: 700; font-size: 26px;}
h4 {font-weight: 700; font-size: 16px; color: var(--font-black); margin-bottom: 0; line-height: 100%}
p {font-size: 18px; line-height: 150%; font-weight: 500;}
p.lid {font-size: 23px; letter-spacing: 0px; text-align: center; font-weight: 400; margin: 0 auto 32px; max-width: 1100px}
.note p {font-size: 14px; color: var(--font-grey);}

.all {width: 100%; max-width: 1000px; margin: 120px auto 40px}
.all h1 {margin-bottom: 22px}
.all h3 {margin-bottom: 18px; margin-top: 54px}
.all p {margin-bottom: 12px}
.1center {text-align: center; max-width: 1100px; margin: 82px auto 22px}

header {position: absolute; top:0; left:0; right:0; overflow: hidden; z-index: 10;}
nav {width: var(--all-width); margin: 14px auto 0; height: 90px; padding: 0; box-sizing: content-box; position: relative;}
nav svg {margin-left: 0px; vertical-align: middle; transition: all 200ms; fill: #fff}
#menu a {text-decoration: none; font-size: 16px; font-weight: 500; color: #151515; margin: 0 15px; transition: color 300ms}
nav a:hover {color: var(--font-orange) !important; opacity: 1 !important}
svg.rot {transform: rotate(180deg); fill: #f08829 !important}
#nav1, #nav2, #nav3, #nav4 {position: absolute; z-index: 11; text-align: right}
#nav1 {top:0; right: 0;}
#nav1 a {text-decoration: none; font-size: 16px; color: #fff; opacity: 0.6; font-weight: 500; margin-left: 14px; transition: color 300ms}
#nav2 {top:30px; right:0px; display: none}
#nav3 {top:31px; right:0px; font-size: 28px; font-weight: 700; font-family: var(--num-font); line-height: 100%; color: #fff}
#nav4 {top:36px; right:240px; overflow: visible}
#nav4 a {text-decoration: none; font-size: 18px !important; font-weight: 900; text-transform: uppercase; color: #fff; 1padding: 21px 12px; margin-right: 21px !important; transition: color 300ms; letter-spacing: 0px}
.header_black svg {fill: var(--font-black)}
.header_black #nav1 a {color: var(--font-grey); opacity: 1}
.header_black #nav4 a, .header_black #nav3 {color: var(--font-black);}

#logo {margin-top: 6px; float: left}
.header_black #logo a img:first-child{display: block}
.header_black #logo a img:last-child{display: none}
#logo a img:first-child{display: none}
#logo a img:last-child{display: block}

#menu {display: none; position: absolute; width: auto; top: 90px; left: 0; right: 0; overflow: hidden; background-color: #fff; box-shadow: 0px 8px 8px -3px rgba(0,0,0,0.1);  z-index: 999}
#menu1 {position: relative; width: var(--all-width); display: flex; margin: 5px auto 15px; align-items: stretch; opacity: 0; display: none; }
.show1 {animation: show 500ms cubic-bezier(0.215, 0.61, 0.355, 1); animation-fill-mode: both; }
#menu1 > div {flex-grow:1; flex-basis: 210px; width: 210px; margin: 12px; text-align: center; transition: all 400ms; 1transition: background-color 200ms, border-left-color 100ms; height: 290px; display: table; overflow: hidden}
#menu1 > div:hover {box-shadow: 0px 0px 12px rgba(0,0,0,0.15); 1background-color: var(--font-orange); cursor: pointer; border-left-color: #fff}
#menu1 > div:first-child {border-left: 0}
#menu1 a {display: table-cell; width: 100%; vertical-align: bottom; margin: 0; padding: 6px 0 12px; text-align: center}
#menu1 img {margin-bottom: 9px}
#menu1 a > h4 {font-size: 18px; text-decoration: none; color: var(--font-black); transition: color 200ms; line-height: 120%; margin: 0}
#menu1 a > p {font-size: 15px; text-decoration: none; color: var(--font-grey); margin-top: 6px; font-weight: 400; line-height: 100% }
#shopping_cart {position: relative}
#shopping_cart i {vertical-align: text-bottom}
#shopping_cart_count {position: absolute; width: 22px; height: 22px; top: -6px; right: 7px; border: 2px solid #fff; color: #fff; padding-top: 1px; font-size: 14px; font-weight: 400;  border-radius: 50%; text-align: center; background-color: var(--font-orange)}

.cards {display: flex; flex-wrap: wrap; width: var(--all-width); margin: 0 auto}
.card {min-width: 350px; 1background-color: var(--bg-color); margin: 16px; padding: 24px 12px; text-align: center; flex-basis: 0; flex-grow: 1; transition: all 400ms}
.card:hover {box-shadow: 0px 0px 16px rgba(0,0,0,0.2);}
.card a {text-decoration: none; color: var(--font-color)}
.card button {margin: 8px auto;}
.card img {width: 300px;}
.card h3 {font-weight: 700; margin-top: -18px}
.product_oldprice {text-decoration:line-through; text-decoration-color: #e24a4a; line-height: 120%; color: var(--font-grey); font-size: 17px}
.product_price {font-size: 19px}

.counter {border: 2px solid var(--borders); display: inline-block; margin: 2px 0; transition: all 350ms; width: 100px; text-align: center; background-color: #fff}
.counter:hover {border-color: var(--font-orange) !important;}
.counter button, .counter input {border: 0; background-color: #fff; text-align: center; font-size: 20px; font-weight: 500; outline: none; font-family: var(--num-font)}
.counter button {cursor: pointer; 1padding: 6px 4px; width: 26px; color: #cacaca; transition: color 350ms}
.counter button:hover {color: var(--font-orange)}
.counter input {width: 30px; padding: 6px 2px !important; border: 0 !important; font-size: 19px; clear: both; float: none !important}
.disabled {display: none}

#sum {font-size: 52px; font-weight: 700; font-family: var(--num-font); 1margin-bottom: 3px; letter-spacing: -1px}
#old_sum {font-size: 21px; min-width: 110px; display: inline-block; font-weight: 500; 1color: var(--font-grey); text-decoration: line-through; text-decoration-color: #e24a4a; font-family: var(--num-font)}
#discount {display: none}
#discount_percent {font-size: 19px; color: #fff; background-color: #329232; margin-left: 9px; padding: 1px 6px; font-weight: 500}
.prices {box-shadow: 0px 0px 12px rgba(0,0,0,0.08); margin: 12px; width: calc(100% - 24px); padding: 28px 10% 42px; background-color: #fff;}
.prices img {margin-top: 24px}
#rassrochka {margin-top: 9px}
.delivery {!border: 1px solid var(--borders); margin: 32px 0 0;}
.delivery input[type="text"] {width: 60%;height: 40px;}
.delivery h4 {margin-bottom: 6px}
.button {text-decoration: none; border: 0; display: block; outline: none; color: #fff; cursor: pointer; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; font-family: 'Roboto'}
.button i {vertical-align: text-bottom; margin-right: 6px;}
.b_orange {background-color: var(--font-orange); padding: 14px 18px; font-size: 17px; display: block; position: relative}
.b_order {width:244px}
.b_grey {background-color: var(--borders); padding: 0 12px; height: 40px; color: #000 !important; font-size: 12px; }
.b_small {padding: 6px 16px 6px; font-size: 17px; text-transform: none}
input[type="text"], select {border: 3px solid var(--borders); padding: 6px 12px; font-size: 21px; font-weight: 500; font-family: Roboto; float: left; outline: none; transition: all 350ms}
input[type="text"]:focus, input[type="text"]:hover {border-color: var(--font-orange)}
input[type="text"]::placeholder {color: #999; transform: scale(0.8); transform-origin: 0% 50%; font-weight: normal}

.tooltip_icon {color: #cecece; width: 14px; height: 14px; margin: 0 0 0 6px; vertical-align: bottom; font-size: 14px; line-height: 110%; text-align: center; display: inline-block; text-decoration: none; border: 1px solid #cecece; border-radius: 50%; transition: all 350ms}
.tooltip_icon:before {content: '?'}
.tooltip_icon:hover {background-color: var(--font-orange); border-color: var(--font-orange); color: #fff}


.cart_wrap {1display: flex; justify-content: space-between; width: var(--all-width); max-width: 1000px; margin: 130px auto 100px}
.cart_wrap h1 {margin-left: 8px}
.cart {width: 100%; 1max-width: 1100px; margin: 20px auto 0}
.cart_item {display: flex; padding: 18px 32px 12px 16px; margin: 24px 12px; height: 190px; box-shadow: 0px 0px 12px rgba(0,0,0,0.08); 1border-bottom: 1px solid var(--borders); 1background-color: var(--bg-color)}
.cart_item > div {margin-top: 12px}
.cart_item_img img {object-fit: contain; height: 100%; width: 100%;}
.cart_item_img {margin-top: 0 !important; width: 130px;}
.cart_item_price {width: 110px; text-align: right; font-family: var(--num-font);}
.cart_item_name {flex-grow: 1; max-width: 500px}
.cart_item_name h3 {margin-bottom: 9px; line-height: 100%}
.cart_item_name p {margin-bottom: 3px; font-size: var(--font-small)}
.cart_item_name p span {font-weight: 700}
.cart_item_quantity {width: 110px; text-align: right; 1padding: 0 32px}
.cart_item_sum {width: 130px; text-align: right; font-family: var(--num-font); }
.item_sum {font-size: 22px; font-weight: 700; line-height: 120%;}
.item_old_sum {font-size: 17px; font-weight: 500; text-decoration: line-through; text-decoration-color: #e24a4a;}
.cart_prices {text-align: right; margin-right: 92px}
.cart_item_del {padding-left: 24px}
.cart_item_del a {color: #e4e4e4}
.cart_item_del a:hover {color: #e24a4a}

footer {background-color: #090909; text-align: center; padding: 52px 0 22px; margin-top: 80px}
footer .lid {color: #fff}
footer h2 {line-height: 100%; font-size: 46px; color: #fff; font-weight: 700; margin-bottom: 6px}
footer a, footer a:visited {color: #8a8a8a; transition: color 300ms}
footer a:hover, #copy a:hover {color: #fff}
footer p {color: #666; text-align: center;}
.social a {margin: 0 3px}
.worktime {margin: 6px auto 24px; font-size: 21px; color: #fff; font-size: 17px;}
.privacy {max-width: 700px; margin: 18px auto 18px; font-size: 13px}
.copy {font-size: 13px;}


.old {margin: 0 auto}
.old h2 {font-size: 46px; text-align: center; margin-top: 72px; line-height: 120%; letter-spacing: 0}

.tab2_table {border-collapse: separate; margin: auto; width: 90%; max-width: 1200px; line-height: 135%; color: #6b6b6b}
.tab2_table thead td {vertical-align: middle; border-top: 0; font-size: 15px !important; font-weight: bold; color: #303030; padding: 6px 12px }
.tab2_table td {border: 0px; border-bottom: 1px solid #e4e4e4; border-top: 1px solid #fff; text-align: left; vertical-align: top; font-size: 15px; padding: 4px 12px }
.tab2_table ul {list-style: none}
.tab2_table ul li {margin-bottom: 6px; padding: 0}
.tab2_table ul li:before {float: left; margin-right: 4px; content: "\2022";}

hr {width: 120px; height: 5px; background-color: #ffbc00; color: #ffbc00; border: 0; margin-top: 24px; margin-bottom: 21px}

#s0 {width: 100%; max-width: 1560px; margin: 30px auto 100px; height: 650px; background-size: auto 100%; background-repeat: no-repeat; background-position: left top;}
#s0 > #s01 {position: absolute; top: 120px; width: 820px; right: 0px; font-size: 24px; font-weight: 500; color: #263238; background-color: #eff4f6; padding: 38px 52px}
#s0 h2 {margin-top: 12px; text-align: left}

#photos {display: flex; align-content: flex-start; justify-content: space-between; width: 100%; align-items: flex-top; flex-wrap: wrap; margin: 1vw 0}
#photos > div {width: 31vw; height: 42vw; overflow: hidden; margin: 0.7vw 0}
#photos > div > div {width: 100%; height: 100%; background-position: center center; background-size: cover; transition: all .4s ease-out;}
#photos > div > div:hover {1transform: scale3d(1.05,1.05,1);}

.thumbs img {box-shadow: 1px 1px 6px rgba(0,0,0,0.3);}

#tec_wrap {text-align: center; margin: 60px 0 50px; }
#tec_wrap > p {1font-size: 17px; font-weight: 400; 1color: #777; margin-bottom: 6px}
#tec {display: flex; align-content: flex-start; justify-content: center; width: 100%; max-width: 1500px; 1align-items: center; margin: 40px auto 40px; flex-wrap: wrap;}
#tec > div {text-align: center; border-left: 1px solid #e8e8e8; padding: 18px 1.5vw}
#tec > div > p:first-child {font-size: 34px; line-height: 100%; font-weight: 700; margin-bottom: 6px; color: #263238; letter-spacing: -1px; font-family: 'Roboto', Arial}
#tec > div:first-child {border: 0}
#tec > div > p:last-child {1font-size: 17px; font-weight: 400; 1color: #455A64; margin-bottom: 0}

#tec1 {display: flex; align-content: flex-start; justify-content: space-between; width: 100%; align-items: flex-top; flex-wrap: wrap; margin: 1vw 0}
#tec1 > div {width: 22.8vw; height: 22.8vw; overflow: hidden; margin: 0.7vw 0}
#tec1 > div > div {width: 100%; height: 100%; background-position: center center; background-size: cover; transition: all .4s ease-out;}
#tec1 > div > div:hover {1transform: scale3d(1.05,1.05,1);}

#benefits_wrap {text-align: center; margin: 30px 0 0px; }
#benefits_wrap > p {width: 80%; max-width: 900px; font-size: 24px; margin: 28px auto 0; font-weight: 500; color: #263238;}
#benefits h4 {font-size: 23px; color: #263238; margin-bottom: 9px}
#benefits p {line-height: 130%;}
#benefits {display: flex; align-content: flex-start; width: 92%; max-width: 1200px; justify-content: center; margin: 20px auto 10px; flex-wrap: wrap;}
#benefits > div {text-align: center; width: 240px; margin: 28px 32px 28px}
#benefits > div i {font-size: 62px; color: #0f4099}
#benefits > div > p:first-child {font-size: 62px; color: #0f4099; height: 70px}

#s3 {width: 100%; padding: 68px 0 70px; text-align: center; overflow: auto; 1max-width: 1660px; margin: 0 auto; background-color: #f3f3f3;}
#s3 img {width: 100%; display: block}
#s3 table {border-spacing: 20px; margin: 0 auto; table-layout: fixed; border-collapse: separate;} 
#s3 td {height: 310px; width: 310px; overflow: hidden; background-color: #151515;}
#s3 > div {display: inline-block; height: 500px; width: 300px; overflow: hidden; margin: 7px;}
#s3 a > div:nth-child(1) {transition: transform 300ms ease-in-out, opacity 300ms ease-in-out; width: 100%; height: 100%; will-change: transform;}
#s3 a:hover div:nth-child(1) {transform: scale3d(1.03,1.03,1); opacity: 0.7}

#s4 {width: 100%; padding: 58px 0 60px; text-align: center; overflow: auto; margin: 0 auto; background-color: #f8f8f8;}
#s4t {margin: 0 auto; 1table-layout: fixed; border-collapse: separate;} 
#s4t td {font-size: 18px; width: 174px; border-bottom: 1px solid #e9e9e9; vertical-align: middle; padding: 12px 0 12px 18px; color: #323232; line-height: 100%}
#s4t .desc {color: #888888; height: 30px; width: 100px; text-align: left; font-weight: 300 !important; font-size: 16px !important; line-height: 120% !important}
#s4t button {border: 0px solid #fff; background-color: rgba(183,127,0,0.7); margin-top: 6px; outline: none; padding: 8px 14px; color: #fff; font-family: 'Roboto'; font-size: 15px; font-weight: 400; transition: background-color 300ms; cursor: pointer}
#s4t tr:nth-child(6) td {font-weight: 500; font-size: 23px}
#s4t tr:nth-child(1) td {vertical-align: bottom}
#s4t .clean td {border: 0}
#s4t s {font-size: 16px; color: #888888; font-weight: 300;} 

.calc_wrap {padding: 58px 0 48px; margin: 70px 0 50px; background-color: var(--bg-color)}
.calc {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: stretch; width: 100%; max-width: 1200px; margin: 52px auto 22px;}
.calc1 {width: 570px}
.calc2 {width: 520px}
.calc1 > div {1text-align: center; overflow: auto; clear: left; 1width: 500px; margin: 0 0 28px 0;}
.i1 p {line-height: 140%; margin-bottom: 12px; text-align: left;}
.i2 {font-size: 26px; font-weight: 900; margin: -14px 0 0 12px; font-family: 'Roboto', Arial; color: #000; float: left}
.i3 {1font-size: 17px; font-weight: 400; color: #455A64; 1margin-top: 21px; float: left; width: 380px}
.calc2 p {margin-bottom: 12px}
.calc2 p > span {font-weight: 900; font-family: 'Roboto', Arial}
.calc2 p:first-child {font-size: 90px; color: #ff9c31; line-height: 90%; letter-spacing: -3px; font-family: 'Roboto', Arial; font-weight: 900; margin-bottom: 0}
.calc2 p:nth-child(2) {font-size: 21px; font-weight: 700; margin-bottom: 44px}
.calc .rangeslider {background: #fff;}
.calc .rangeslider__fill {background: #ffd36c;}
.calc .rangeslider__handle {background-color: #ff9c31;}


#o2 iframe {width: 100%; height: 800px; border: 0}

.video {width: 90%; max-width: 1100px; margin: 32px auto 130px}
.video > div {position: relative; padding-bottom: 56.25%; height: 0; margin: 42px auto 0; box-shadow: 3px 3px 40px 0px rgba(0,0,0,0.2);}
.video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%}

#video{
  position: absolute;
  top: 50%; 
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%; 
  min-height: 100%; 
  width: auto; 
  height: auto;
  z-index: -1000; 
  overflow: hidden;
}

#skidka {font-weight: 500; margin-top: 32px}

@media screen and (min-width: 1100px) and (max-width: 1450px) {
	#head1 .title {width: 500px;}
	#head1 .title p {font-size: 26px !important;}
	#phone {margin-top: 9px;}
	#phone p:nth-child(1) {font-size: 30px;}
	#phone p:nth-child(2) {font-size: 13px;}
	#s0 {margin: 90px auto 90px; height: 520px}
	#s0 > #s01 {font-size: 21px; width: 730px; top: 70px;}
	#photos > div {width: 47.2vw; height: 47.2vw; overflow: hidden; margin: 0.8% 0}
	#benefits_wrap {margin: 90px 0 110px; }
	#benefits {margin: 50px auto 40px;}
	.card {min-width: 280px}
	.card img {width: 260px;}
}

@media screen and (max-width: 1099px) {
	#nav1,#nav2,#nav3,#nav4 {display: none}
	hr {height: 3px; margin-top: 18px; margin-bottom: 15px}
	#head1 .title {width: 86%;}
	#head1 .title p, #bp1 .lid {font-size: 24px !important; line-height: 120%}
	#skidka > span {font-size: 21px !important; margin-top: 18px; font-weight: 500}
	#skidka {margin-top: 18px}
	#phone {margin-top: 0}
	#phone p:nth-child(1) {font-size: 20px;}
	#phone p:nth-child(2) {font-size: 11px;}
	#photos > div {width: 98vw; height: 98vw; overflow: hidden; margin: 0.8% 0}
	#benefits_wrap {margin: 40px 0 40px; }
	#benefits_wrap > p {width: 90%; font-size: 18px; margin: 18px auto 0;}
	#benefits {justify-content: center; margin: 18px auto 18px;}
	#benefits div {margin-bottom: 16px}
	li {margin-bottom: 1px; font-size: 15px}
	#tec_wrap {margin: 38px 0 28px; }
	#tec {margin: 12px 0 12px; }
	#tec > div {border:0; width: 50%}
	#tec > div > p:first-child {font-size: 24px;}
	#tec1 > div {width: 47vw; height: 47vw; margin: 1vw 0}
	#s2 {padding-bottom: 24px}
	#s2_flex > div {width: 100%; height: 98vw; background-size: 80%}
	#s2_flex > div:last-child {height: auto; padding: 0 6%}
	#s2 .t1 {display: none}
	#s0 {margin: 38px auto 28px; width: 100%; background: none; height: 420px}
	#s0 hr {margin-left: auto; margin-right: auto}
	#s0 > #s01 {font-size: 18px; width: 90%; margin: 0 auto; top: 0; right: 0; text-align: center}
	.calc1 > div {width: 100%; margin: 0 auto 28px auto;}
	.i1 p {font-size: 15px}
	.i2 {font-size: 21px}
	.i3 {width: 170px;}
}


@keyframes show {
from {opacity: 0; transform: translate3d(0, -7%, 0);}
to {opacity: 1; transform: none;}
}

@media screen and (max-width: 1100px) {
	#nav02_2 > p:first-child, #nav02_1 {display: none}
	#nav02_2 > p:last-child {display: block}
	#nav02_3 a {font-size: 16px}
	#menu1 a > h4 {font-size: 16px}
}

@media screen and (min-width: 1201px) and (max-width: 1400px) {
	#nav02_2 > p:first-child{display: none}
}

@media screen and (min-width: 1101px) and (max-width: 1200px) {
#menu1 img {transform: scale(0.8); margin-bottom: 0px;}
#nav02_3 a {font-size: 15px}
#menu1 a > h4 {font-size: 15px; margin-top: -12px}
#menu1 > div {height: 260px}
}



/* checkbox 
.container .rs-path-color  {
    background-color: #cacaca;
}
.container .rs-handle, .rs-handle-dot:after  {
    background-color: #d1262c;
}
.rs-handle-dot, .rs-border, .rs-handle-dot:after {
	border: 0 !important
}
.1rs-tooltip {
	border-radius: 0;
	color: #444
}
*/

.checkbox label {padding-left: 25px; cursor: pointer; font-weight: 500;}
input[type="checkbox"] {margin: -2px 9px 0 0; cursor: pointer; vertical-align: middle;}
.checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {-webkit-appearance: none;margin-left: -25px;}
.checkbox input[type="checkbox"]:after, .checkbox-inline input[type="checkbox"]:after {border-color: rgba(0, 0, 0, 0.54);}
/*.checkbox input[type="checkbox"]:disabled:after, .checkbox-inline input[type="checkbox"]:disabled:after {border-color: rgba(0, 0, 0, 0.26);}*/
.checkbox input[type="checkbox"]:focus, .checkbox-inline input[type="checkbox"]:focus {outline: none;}
.checkbox input[type="checkbox"]:after, .checkbox-inline input[type="checkbox"]:after {border: 2px solid #d0d0d0; border-radius: 0px; content: '';display: block; height: 15px; transition: 240ms; width: 15px;}
.checkbox input[type="checkbox"]:checked:before, .checkbox-inline input[type="checkbox"]:checked:before {-webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; left: 6px; 1top: 0; display: table; width: 6px; height: 12px; border: 2px solid #fff; border-top: 0; border-left: 0; content: '';}
.checkbox input[type="checkbox"]:checked:after, .checkbox-inline input[type="checkbox"]:checked:after {background-color: var(--font-orange); border-color: var(--font-orange)}
/*.checkbox input[type="checkbox"]:disabled:checked:after, .checkbox-inline input[type="checkbox"]:disabled:checked:after {background-color: rgba(0, 0, 0, 0.26);border-color: transparent;}*/


.b_order:disabled {color: transparent !important;}

@keyframes spinner {
  to {transform: rotate(360deg);}
}
 
.b_order:disabled:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #fff;
  animation: spinner .6s linear infinite;
}