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

/* Reset CSS
 * --------------------------------------- */
:root {
--text-color: #000000;
--text-blue: #00B0E3;	
--bg-color: #F7FCFF;
--all-blue: #00B0E3;
}

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(.8em + .10vw);
	font-weight: 500;
  	overscroll-behavior: none;
	overflow-x: hidden !important;
}

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

footer a {color:#00B0E3;}


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

body::-webkit-scrollbar {
  width: 12px;               /* ширина scrollbar */
}
body::-webkit-scrollbar-track {
  background: white;        /* цвет дорожки */
}
body::-webkit-scrollbar-thumb {
  background-color: #00B0E3;    /* цвет плашки */
  border-radius: 20px;       /* закругления плашки */
  border: 3px solid #fff;  /* padding вокруг плашки */
}




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


.btn {border: 1px solid var(--all-blue); color:var(--all-blue); font-size: 13px; border-radius: 5px; height: 42px;}
.btn.active, .btn:hover {border: 1px solid var(--all-blue);; color:#fff; background:var(--all-blue);}

.btn-form {border: 1px solid #fff;  color:#fff; font-size: 13px; border-radius: 5px; height: 42px; }
.btn-form:hover {border: 1px solid #1E2945;  color:#fff; font-size: 13px; background: #1E2945; border-radius: 5px; height: 42px; }


/********************************************/
.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);
}
/********************************************/


/**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;}
.nav-link:hover {font-weight: 600; color:#00B0E3 !important;}
.nav-link.active {color:#00B0E3 !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: #00B0E3;
  
}
	
/**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: 250px; margin: 0px 0;}
.btn-round {
    background: var(--all-blue) url(../img/arr-white.png) no-repeat center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 0;
    bottom: 5px;
    right: 10px;
    position: absolute;
}


/*****************************/
	
.card {background: rgba(255, 255, 255, 1);
border-radius: 10px; border: 1px solid #DAF1FF; 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;}