* {
  box-sizing: border-box;
  font-family: 'Manrope', sans-serif;
}
div {
  border: px  solid;
 
}
a.bnt-white, a.bnt-black {
    display: inline-block;
    font-weight: 700;
    padding: 16px 26px;
    border-radius: 5px;
    text-decoration: none;
}
.main_button {
    margin-top: 80px;
    margin-left: 65px;
}
.main_button_2 {
    margin-top: 20px;
}
a.bnt-white:link,
a.bnt-white:active,
a.bnt-white:visited {
  background: white;
    color: #69c7c0;
    border: 2px #69c7c0 solid;  
}
a.bnt-white:hover {
    background: #69c7c0;
    color: white;
    border: 2px #69c7c0 solid;  
}

a.bnt-black:link,
a.bnt-black:active,
a.bnt-black:visited {
    background: #69c7c0;
    color: white;
    border: 2px #69c7c0 solid;
    
}
a.bnt-black:hover {
    background: white; 
    color: #69c7c0;
    border: 2px #69c7c0 solid;
}


.content {
    width: 1140px;
    margin: 0 auto;
    min-height: 500px;
}
.section-navigation {
    height: 150px;
    position: sticky;
    top: 0;
    background: #eef2f5;
    z-index: 999;
   
}
.section-navigation-all{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    flex-direction: row;
   
}
.logo img{
   height: 120px;
   width: 150px;
}
.section-navigation-1,
.section-navigation-2,
.section-navigation-3,
.section-navigation-4,
.section-navigation-5{
    margin-top: 50px;
}
.main_button-1 {
    margin-top: 35px;
}
a{
    color: #69c7c0;
     text-decoration: none;
    font-weight: 600;
}

.section-navigation-4{
     padding-top: 5px;
     font-size: 12px;
     font-weight: 800;
}


.section-main {
    height: 100vh;
    background: #eef2f5;
   
    
}
.main_text {

   margin-left: 50px; 
   font-size: 70px;
   line-height: 70px;
    font-weight: 400;
    
}
ul {
   display: flex;
   column-gap: 50px;
   margin-left: 40px;
     margin-top: 50px;
}

li::before {
    content: "";
    width: 15px;
    height: 15px;
    background: #69c7c0;
    position: absolute;
    border-radius: 50%;
    margin-top: 5px;
    margin-left: -25px;
}


.section-main_bg_1 {
  position: absolute;
  background: url(images/Frame_1.svg); 
  top: 0;
  bottom: 80px;
  left: 200px;
  width: 90%;
  background-size: contain;
  background-position-x: right;
  background-repeat: no-repeat;
}
.color 
{ 
    width: 34px;
    height: 34px;
    border: 1px grey solid;
    display: block;
    border-radius: 50%;
    margin-bottom: 40px;
    padding: 3px;
    margin-top: 5px;
}
.color-1 { 
    width: 26px;
    height: 26px;
    border: 1px grey solid;
    border-radius: 50%; 
}

.section-main_bg_2 {
  position: absolute;
  background: url(images/female-hands-disposa.png); 
  top: 150px;
  bottom: 0;
  width: 100%;
  background-size: contain;
  background-position-x: 79%;
  background-repeat: no-repeat; 
}
.section-price-header{
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    flex-direction: row; 
}
.price-item img{
    width: 80%;
    
}

.section-price-item {
  display: flex; 
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}
.section-recomendation-item {
  display: flex; 
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}
.price-item, .recomendation-item{
  background: #eef2f5; 
  border-radius: 15px;
  width: 300px;
  margin-bottom: 30px;
  min-height: 400px;
  padding: 15px;
    
}
.recomendation-item img {
    width: calc(100% + 30px);
    height: 250px;
    object-fit: cover;
    margin: -15px 0px 0px -15px;
    border:3px solid #eef2f5; 
    border-radius: 15px 15px 0px 0px;
}

h2 {
    margin-left: 10px;
    font-size: 30px;
}
h3 {
    font-size: 16px;
    margin-left: 10px;
}
p {
    font-size: 14px;
    margin-left: 10px;
}
.section-price_list .content {
   border-radius: 15px;
   min-height: 550px;
   background: rgb(99,231,221);
   background: linear-gradient(135deg, rgba(99,231,221,1) 0%, rgba(108,182,176,1) 100%);
   position: relative;
}
.section-price_list {
    color: white;
    
}
.section-price_list_bg1{
  position: absolute;
  background: url(images/Vector_1.svg); 
  top: 0;
  bottom: 0;
  width: 100%;
  background-size: contain;
  background-position-x: right;
  background-repeat: no-repeat;
}
.section-price_list_bg2{
  position: absolute;
  background: url(images/iphone-x-line-button.webp); 
  top: 0;
  bottom: 0;
  width: 100%;
  background-size: contain;
  background-position-x: 80%;
  background-repeat: no-repeat;  
}
.section-price_list-header{
   font-size: 40px;
   line-height: 0,95;
    font-weight: 400;
    margin-bottom: 20px;
    padding-top: 70px;
    padding-left: 50px;
    color: white;

}
.section-price_list-text{
 padding-left: 50px;   
}
.main_button_4 {
    margin-left: 50px;
    margin-top: 50px;
}
.section-company {
    background: rgb(238,242,245);
    background: linear-gradient(180deg, rgba(238,242,245,1) 0%, rgba(255,255,255,1) 100%);
    height: 200vh;
    position: relative;
    
}

.section-company-bg1{
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    background: url(images/pixlr-bg-result.webp);
    background-repeat: no-repeat; 
    background-position-y: 100%;
    background-size: contain;
    background-position-x: 60%;
    
}
.section-company-info{
        display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    margin-bottom: 50px;
    margin-top: 50px;
}
.section-company-header-1
{
    width: 50%;
}
.section-company-header-2
{width: 80%;
    
}
.section-company-service{
    display: flex;
    flex-wrap:wrap;
    flex-direction: row;
    justify-content: space-between;
}
.section-company-main-header { 
   font-size: 40px;
   line-height: 0,95;
    font-weight: 400;
    margin-bottom: 20px;
}
.section-company-text {
    display: flex;
}
.section-company-service-item{
  background: white; 
  border-radius: 15px;
  width: 300px;
  margin-bottom: 30px;
  min-height: 250px;
  border: 2px #dcd5d5 solid;
  padding: 30px;
  position: relative;
  z-index: 2;
    
}
.oval-0{
    z-index: -1;
    background: #d2d8d5; 
    height: 200px;
    width: 200px;
    position: absolute;
    top: 0px;
    left:0px;
    border-radius: 20px 0px 200px 0px;
    animation-delay: 3s;
}
.oval-1 {
  background: #edf1ed;
    height: 130px;
    width: 130px;
    border-radius: 20px 0px 130px 0px;
    animation-delay: 3s;
}
.section-company-service-item:hover .oval-0 {background: #69c2bb60; animation-delay: 3s;}
.section-company-service-item:hover .oval-1 {background: #86d4cd60; animation-delay: 3s;}

.company-img_1,
.company-img_2,
.company-img_3,
.company-img_4,
.company-img_5,
.company-img_6
{
 height: 70px;
 background-repeat: no-repeat !important;
 background-position: left !important;
 background-size: 40px !important;
 background-position-y: top !important;
}
.company-img_1{ background: url(images/fi-rr-credit-card.svg);
    
    
}
.company-img_2 {background: url(images/fi-rr-truck-side.svg);

}
.company-img_3 {background: url(images/fi-rr-shield-check.svg);

}
.company-img_4 {background: url(images/fi-rr-earnings.svg); 

}
.company-img_5 {background: url(images/fi-rr-shopping-cart-.svg);
}
.company-img_6 {background: url(images/fi-rr-user.svg);
}
.section-map {
    height: 500px;
    background-color: skyblue;
}
.section-contacts {
   background: rgb(99,231,221);
   background: linear-gradient(135deg, rgba(99,231,221,1) 0%, rgba(108,182,176,1) 100%);
    position: relative;
    height: 550px;

}
.section-contacts-header{
    height: 200px;
    color: white;
    font-size: 25px;
    margin-left: 50px; 
}
.section-contacts-header-1 {
   font-size: 70px;
   line-height:1;
    font-weight: 400;
    margin-top: 50px;
    margin-bottom: 20px;
    
}
.contacts
{
    font-size: 12px;
    color:#ffffff73;
    margin-top: 40px;
}
.section-contacts_bg1{
  position: absolute;
  background: url(images/Vector_1.svg); 
  top: 0;
  bottom: 0;
  width: 100%;
  background-size: contain;
  background-position-x: right;
  background-repeat: no-repeat;
}

@media only screen and (max-width:820px) {
    .container {
        width: 100%;}
    
    
    .price-item, .recomendation-item {
        width: calc(100% / 2 - 20px);
    }
}
@media only screen and (max-width:420px) {
    .container {
        width: 100%;}
    
    .section-navigation {
    height: 290px;
    width: 1200px;
    
}
    .section-navigation-all {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
        flex-direction: row;}
    .section-navigation-1, .section-navigation-2, .section-navigation-3, .section-navigation-4, .section-navigation-5 {
    font-size: 30px;
    }
    
     h2 {margin-left: 170px;
    font-size: 70px;}
    .section-main_bg_2 {
    top: 270px;
    margin-left: 750px;
    }
    
    .section-main {
    
    width: 1200px;
    }
    
.main_text {
    padding-top: 30px;}
    
    .section-main_bg_2 {
        display: none;}
    
    .section-price-header {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
        flex-direction: column;}
    
    .main_button_2 {
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    flex-wrap: nowrap;
    align-content: space-around;
    justify-content: center;
    }
    .price-item, .recomendation-item {
        width: calc(100% / 1 - 20px);
    }
    .price-item, .recomendation-item{
    background: #eef2f5;
    border-radius: 15px;
    margin-bottom: 50px;
    min-height: 300px;
    padding: 55px;
    }
    .section-price-item {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: space-between;
    align-content: flex-end;
}
    .price-item img {
        width: 75%;}
    .section-company {
   
    width: 1200px;
        height: 3900px;
    }
    .section-map {
   
    width: 1200px;
}
    .section-contacts {

    width: 1200px;
        height: 700px;
    }
    h3 {
        font-size: 40px;}
    p {
        font-size: 30px;}
    span {
     font-size: 40px;}
    
    .color {   
    width: 64px;
    height: 64px;
}
.color-1 {   
    width: 54px;
    height: 54px;
}

    
    .section-company-service-item {
   
     width: calc(100% / 2 - 20px);
    }
    .section-company-header-1 {
    width: 50%;
        font-size: 40px;
    padding-bottom: 30px;}
    
    .section-company-header-2 {
        width: 95%;}
    
    .section-company-main-header {
        font-size: 60px;}
    
    .section-company-info {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin-bottom: 50px;
    margin-top: 50px;
    flex-direction: column;
}
    .recomendation-item img {
   
        height: 500px;}
    
    li::before {
    content: "";
    width: 19px;
    height: 19px;
    margin-top: 13px;
    margin-left: -28px;
}
   ul {
  
       font-size: 30px;}
    
    .section-price_list_bg2 {
   
        display: none;}
    
    .section-company-bg1 {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    
    background-repeat: no-repeat;
    background-position-y: 100%;
    background-size: contain;
        background-position-x: 60%;}
    
    a.bnt-white, a.bnt-black {
    display: inline-block;
        height: 120px;
        width: 350px;
        font-size: 30px;
        text-align: center;
    font-weight: 700;
    padding: 16px 26px;
    border-radius: 5px;
    text-decoration: none;
}
    .section-price_list .content {

        min-height: 600px;}
  
    
}


