
 html,
    body {
      position: relative;
      height: 100%;
      font-family: roboto;
    }

html {
    box-sizing: border-box;

  }


 a {
 
text-decoration: none;

 }

 section {
     padding: 60px 0; 
}

  ul.submenu {
    display: none;
    }

ul>li:hover>ul.submenu {
     display: block;
      }
   
     .bg7 {

    background-image: url(../img/13013.jpg);width: 100%; height: 100%;
    background-size: cover;
    
   }

    .grey1 h2 {

    color: #4c5866;

}

 card.cd:hover {
 box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);

 }

 .box-shadow {

  -webkit-box-shadow: 0 0px 0px rgba(72,78,85,.6);
  box-shadow: 0 0px 0px rgba(72,78,85,.6);
 }

 .box-shadow:hover {
  -webkit-box-shadow: 0 3px 10px rgba(72,78,85,.6);
  box-shadow: 0 3px 10px rgba(72,78,85,.6);
  -webkit-transform: translateY(-5px);
 }

 .buttblue {
  background-color: #00bfff;
 }



.imghov {
  position: relative;
  width: 450px;
  height: 360px;


.bdr {
  border-radius: 20px;
  overflow: hidden;
}

.bdr header {
  border-radius: 20px;
  overflow: hidden;
}


}

.texthov {
  position: absolute;
  top: 0;
  bottom: -10px;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  visibility: hidden;
  opacity: 0.3;
  /* transition effect. not necessary */
  transition: opacity .3s, visibility .1s;
  border-radius: 10px;
  -webkit-transition: 0.1s ease;
   filter: brightness(0.4);


}

.imghov:hover .texthov {
  visibility: visible;
  opacity: 1;
 transition: 0.1s;
  filter: brightness(0.9);
   cursor: pointer;
}

 .wra img {
  width: 100%;
  transition-duration: 0.8s;
  position: relative;

}

.wra img:hover {


  filter: brightness(0.5);
  transition-duration: 0.8s;
  z-index: 1;
}


.imgor {

  position: absolute;
  top: 60;
  bottom: 0;
  left: 220;
  right: 0;

  width: 255px; 
  height: 170px; 

  -webkit-transition: 0.3s ease;

}


.texthide {
visibility: visible;
}


.dd.card {
  width: 420px;
  height: 260px;
  background-color: light;
  

 }

.dd.card:hover .texthide {
  visibility: hidden;
}

.dd.card:hover .imgor {
 
  top: 20;
  bottom: 0;
  left: 100;
  right: 0; 
  -webkit-transition: 0.8s ease; 

}

.backcard {
  background-color: orange;
}



.gr3 {

  background: linear-gradient(70deg, #fdf3e8, #e9ebee);
}

.gr32 {

  background: linear-gradient(70deg, #fdf3e8, #e9ebee);
}

.box-shadow2 {
  -webkit-box-shadow: 0 0px 0px rgba(72,78,85,.6);
  box-shadow: 0 0px 0px rgba(72,78,85,.6);

 -webkit-transition: 0.5s ease;


}

.box-shadow2:hover {


box-shadow: 0px 0px 0px 0px rgba(72,78,85,.6);

  transform: scale(103%);
  transition: 0.3s;

}

.cardfon {
  background-image: url(../img/poloc.jpg); max-width: 100%;  height: auto;
}


  img.cf {
  left: 0px;
  top: 0px;
  bottom: 0px;
  end: 0px;
  }

  .img2 {
float:left;
}

.card2.card .icon {
  color: #00A4B4;
  font-size: 4.1rem;
}



.card-text {
  color: gray;
}

.card {
  transition: all 0.5s;
}



.card-body:hover {
  background-color: #37738f;
  color: #fff;
}

.btn1 {
  background-color:#00A4B4;
  color: #fff;
}
  

.card2:hover {
  background-color: #00A4B4;
  color: #fff;
}

.card2:hover .icon,
.card2:hover .card-text {
  color: #fff;
}

.card3:hover {
  background-color: #35b3bf;
  color: #fff;
}

.card3:hover .icon,
.card3:hover .card-text {
  color: #fff;
}

.cr  {
  background-color: light;
   border-radius: 15px;
  overflow: hidden;
}


.cr:hover  {
  background-color: #00A4B4;
  color: #fff;

}

.fonm {
  background-image: url(../img/056.jpg); max-width: 100%;  height: auto;
}



}

.card2 {
        width: 420px; 
        height: 200px; 

      }


.card3 {
        width: 520px; 
        height: 200px; 

      }

  

.cr  {
  background-color: light;
   border-radius: 10px;
  overflow: hidden;
}


.cr:hover  {
  background-color: #00A4B4;
  color: #fff;

}

.hero {

padding: 350px 0px;
border-radius: 20px;
overflow: hidden;
background-image: url(../img/5555.jpg);width: 100%; height: 100%;
background-size: cover;
color: #f7f1ea;


}

 .ach {
      font-size: 54px;
       color: #303030;
      font-weight: 600;
      margin-bottom: 30px;
  }


.hero2 {


border-radius: 20px;

background-image: url(../img/557.jpg); width:100%; height: auto;

background-size: cover;
}

  .zel {
    color: #00A4B4;
    

  }

.btnX {
  background-color:#4c5866;
  color: white;
  
}

.header {
  position: sticky;
  top: 0;
  z-index: 10; /
}


    .grey1 p {

    color: #4c5866;

}

.mainc {
   color:#00A4B4;
}

    .bgpoloc {

  background-color: grey;
  background-clip: border-box;
  

}



    .hr1 {
  margin: 1rem 0;
  color: inherit;
  background-color: currentColor;
  border: 1;
  opacity: 0.1;
}
   
.accordion {
  --bs-accordion-active-bg: #00A4B4; /* цвет активной вкладки */
  --bs-accordion-active-color: white;  /* цвет текста в активной вкладке */

}

.accordion-button:focus {
    box-shadow: none;               /* убрать выделение (по умолчанию в бутстрапе) */   
    border-color: rgba(0,0,0,.125);
}

.accordion-body {
  background-color: #f8f9fa; /* Цвет внутренней вкладки */
}


.accordion {
  --bs-accordion-color: grey; /* цвет текста внутри вкладки */
  --bs-accordion-bg: white;  /* цвет тела аккордеона */
  --bs-accordion-transition: color 0.15s ease-in-out, 
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out, 
        box-shadow 0.15s ease-in-out,
        border-radius 0.15s ease;
  --bs-accordion-border-color: #FBFBFB; /* цвет границ */
  --bs-accordion-border-width: 1px;                    /* ширина границ */
  --bs-accordion-border-radius: 27px;                  /* закругленность внешняя часть*/
  --bs-accordion-inner-border-radius: 26px;            /* закругленность внутренняя часть*/
  --bs-accordion-btn-padding-x: 3rem;                  /* паддинг влево вправо px */
  --bs-accordion-btn-padding-y: 2rem;                  /* паддинг вниз вверх py */  
  --bs-accordion-btn-color: grey;                      /* цвет заголовков */ 
  --bs-accordion-btn-bg: var(--bs-accordion-bg);       /* цвет тела аккордеона внешняя */   
  --bs-accordion-btn-icon: url( "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox= '0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd'd='M1.646 4.646a.5.5 0 0 1 .708 
  0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-width: 2rem;
  --bs-accordion-btn-icon-transform: rotate(180deg);
  --bs-accordion-btn-icon-transition: transform 2s ease-in-out;
  --bs-accordion-btn-active-icon: url(
  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'viewBox='0 0 16 16'fill='white'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 
  10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon-color: white;
  --bs-accordion-btn-focus-border-color: white;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 1);
  --bs-accordion-body-padding-x: 3.5rem;
  --bs-accordion-body-padding-y: 4.5rem;
  --bs-accordion-active-color: red; !important
  --bs-accordion-active-bg: white;
}

 .mySwiper2 {
      height: 90%;     /*размер визора баннера */
      width: 100%;
      border-radius: 10px;
      width: auto; !important;
    }                      

    .swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
     
      object-fit: cover;
      border-radius: 10px;

    }
     

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: flex;
     justify-content: space-between;
      align-items: center;
      border-radius: 10px;
      width: 100%;
      height: auto;
     
    }

    .swiper-paginationcolor {
        color: white;
    }

    :root {
  
  --swiper-pagination-color: white;
  --swiper-navigation-color: white;

}

.card .icon {
  color: #00A4B4;
  font-size: 4.1rem;
}



.icon2 {
 color:#00A4B4;
 font-size: 4.1rem;

}

 .swiper-slide2  {
  width: 28vw;
  overflow: hidden;
  background-position: top;
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  color: green;
  font-size: 20px;
  font-weight: bold;
  background-color:#00A4B4;
}

.swiper-wrapper2   {
  -webkit-transition-timing-function:linear!important; 
  -o-transition-timing-function:linear!important;
  transition-timing-function:linear!important; 
}

.zontback {

 background-image: url(../img/zon.jpg);width: 100%; height: 100%;
background-size: cover;

}


 .serun {

    filter: grayscale(1);
   -ms-filter: grayscale(1);
   -webkit-filter: grayscale(1);
   -moz-filter: grayscale(1);
    -o-filter: grayscale(1);

}


   div.navbar-nav {

 --bs-nav-link-hover-color: orange;

}
