:root{
   --main-color: #caa578;
   box-sizing: border-box;
}

html, body{
   margin: 0;
   padding: 0;
   font-family: 'IBM Plex Sans', sans-serif;
   font-weight: 300;
}

ul{
   text-decoration: none;
   list-style: none;
   padding: 0;
   margin-top: 0;
}

.container{
   display: flex;
   max-height: 100vh;
   max-width: 1920px;
   margin: 0 auto;
}

.content-col{
   display: flex;
   flex-direction: column;
   padding-top: 20px;
   padding-left: 20px;
   width: 40%;
}

.navbar{
   display: flex;
   flex-direction: row;
   justify-content: space-between;
}

.social{
   display: flex;
   justify-items: center;
   align-items: center;
 }
 
.social__icon{
display: inline-block;  
margin-right: 10px;
}

.social__icon img{
height: 26px;
width: 26px;
filter: invert(81%) sepia(1%) saturate(23%) hue-rotate(10deg) brightness(82%) contrast(89%);
}

.social__icon img:hover{
   filter: none;
}

 .contacts{
   min-width: 150px;
 }

 .contacts a{
    color: #000000;
    text-decoration: none;
    opacity: 0.8;
 }

 .contacts a:hover{
    text-decoration: underline;
 }

 .phone{
    font-weight: 500;
 }
 
 .mail__adress{
   font-size: 11pt;
   font-weight: 400;
   color: var(--main-color);
 }

article{
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   height: 100%;
}

h1{
   font-family: 'IBM Plex Sans', sans-serif;
   font-weight: 400;
   font-size: 36px;
}

.client-logo img{
   max-width: 200px;
   max-height: 200px;
}

p{
   font-size: 18px;
   line-height: 1.5rem;
   font-weight: 300;
   text-align: justify;
   text-indent: 1em;
}

.wrap-description{
   display: flex;
}

.description{
   display: flex;
   flex-direction: column;
}

.description h4{   
   text-transform: uppercase;
   font-size: 20px;
   font-weight: 500;
   color: black;
   margin-bottom: 10px;
}

.description ul li i img{
   height: 16px;
}

.description ul li{
   font-size: 16px;
   margin-bottom: 4px;
}

.description-bold{
   font-weight: 500;
   display: block;
   width: 150px;
   float: left;
}

.back {
   display: block;
   width: 30px;
}


.slider-col{
   width: 60%;
   padding-left: 20px;
}

.img-services{
   height: 100vh;
   background-position: center center;
   background-size: cover;
 }

 .sm-img{
    display: none;
    width: 100%;
    max-height: 200px;
 }

@media (min-width: 1200px) {
   #slider>li{
      height: calc(100vh - 120px);
  }
  
  #slider li img{
     height: 100%;
     object-fit: cover;
      /* width: 100%; */
  }
}

@media (max-width: 1200px){
   .container{
      flex-direction: column;
      padding-right: 20px;
   }

   .content-col{
      width: auto;
   }

   .slider-col{
      width: auto;
   }

   article{
      margin-top: 30px;
   }
}

@media (max-width: 768px){
   .container{
      max-height: auto;
   }

   .client-logo img{
      max-width: 180px;
      max-height: 180px;
   }
}