@charset "utf-8";
/* CSS Document */

/* Reset CSS
 * --------------------------------------- */
:root {
--text-color: #000000;
--text-yell: #FFAC0A;	
--bg-color: #fff;
--all-yell: linear-gradient(180deg, #FFAC0A 0%, #DF7D18 100%);
}

html, body{width:100%; max-width: 100vw; scroll-behavior: smooth;}

body {
  	color: var(--text-color);
	background:var(--bg-color);
    font-family: 'Montserrat', sans-serif;
	font-size: calc(.7em + .10vw);
	font-weight: 500;
  	overscroll-behavior: none;
	overflow-x: hidden !important;
}

a {color: var(--all-yell); text-decoration: none;}
a:hover {color: var(--text-color);}



.h1, h2, h3 {line-height: 1; font-size: 2.5rem;}


/**Кнопка**/
.bg-yell {background: var(--all-yell);}


.btn {text-transform: uppercase; border: 2px solid #FFAC0A; color:var(--all-yell); font-size: 10px; font-weight: bold; border-radius: 5px; 
}

.btn.active, .btn:hover {border: 2px solid grey; background:var(--all-yell);}
.btn-form {border: 1px solid #fff;  color:#fff; font-size: 13px; border-radius: 5px; }


/********************************************/
.edit {
    overflow: hidden;
    clear: both;
}

.edit a span {
    text-align: center;
    display: inline-block;
    margin: 10px 0px 0px 1px !important;
    border: 0px solid #bbb;
    background: #0F82BB;
    color: #fff;
    border-radius: 2px;
    text-transform: uppercase;
    font-size: 9px;
    padding: 1px 4px;
    height: 15px;
}
.ar-top {
    display: inline-block;
    margin-top: 5px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(-45deg);
}
.ar-down {
    display: inline-block;
    margin-top: 5px;
    width: 6px;
    height: 6px; 
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(135deg);
}
/********************************************/

.gradient-text {background: linear-gradient(180deg, #FFAC0A 0%, #DF7D18 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}

.gradient-all {background: linear-gradient(180deg, #FFAC0A 0%, #DF7D18 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  border: 2px solid transparent; 
  border-image: linear-gradient(135deg, #FFAC0A 20%, #DF7D18 70%);
  border-image-slice: 1;}


/**header*****************************************************/

header nav {font-weight: 600; background:var(--bg-color);}
header .nav {font-size: .7rem;}
.nav-link {font-weight: 600; color:var(--text-color) !important;}


.topTel {}
.topTel a {color: var(--text-color);}


/**Intro***********************************************************/
#intro .h1 strong {font-size: 84px !important;}
.introProd1 img {position: absolute; top: 0; height: 465px; z-index: 9;}	
.carousel-item {position: relative;}
.carousel-item .offset-1 {align-items: center; min-height: 440px;}
.carousel-item .container{height: 440px; margin-top:25px;}
.carousel-item .introTitle2 {font-size: 36px;}
.carousel-item .lead1 {font-size: 18px;}
.carousel-item .lead1 span {color: #0FAFE2; font-weight: 600;}
.carousel-item .lead2 {font-size: 13px;}
.carousel-item .introProd1 img {position: absolute; top: 0; height: 465px; z-index: 9}



/*************************************************************/

.bigTitle {line-height: 1;}
.bigTitle.h2 {color:var(--text-blue); font-weight: 600;}
.bigTitle p {font-weight: 600; font-size: 20px;}	

/*****************************/	
	
hr {
    height: 3px;
    width: 100px !important;
    opacity: 1;
    border: 0;
    background: var(--all-yell);
  
}


.left-menu {width: 250px; border: 1px solid #EBEBEB;}
	
/**indexCatalog******************************************************************************/
#indexCatalog .oneProd {position: relative; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, .8) 80%);}
#indexCatalog .oneProd .img {height: 300px;}
.btn-round {
    background: var(--all-blue);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 0;
    bottom: 5px;
    right: 10px;
    position: absolute;
}


/*****************************/

.oneProd {border: 1px solid #EBEBEB;}

.oneProd .img {height: 200px;}
	
.card {background: rgba(255, 255, 255, 1);
border-radius: 10px; border: 1px solid #DFDFDF; position: relative; text-align: left; overflow: hidden;}

.card .color {width: 25px; height: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; margin-right: 5px;}

.card .img {height: 200px; margin-bottom: 15px;}

.card .title {font-weight: 600; font-size: 15px;}
.card .price {font-size: 18px;}
.card .price span {font-weight: 
600;}