@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk5hkaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk8ZkaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk_RkaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0RkxhjaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0RkyFjaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memQYaGs126MiZpBA-UFUIcVXSCEkx2cmqvXlWq8tWZ0Pw86hd0Rk0ZjaVc.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsiH0C4n.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjZ0C4n.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsjr0C4n.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsgH1y4n.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgsg-1y4n.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/opensans/v40/memSYaGs126MiZpBA-UvWbX2vVnXBbObj2OVZyOOSr4dVJWUgshZ1y4n.ttf) format('truetype');
}


.roboto-thin {
   font-family: "Roboto", sans-serif;
   font-weight: 100;
   font-style: normal;
 }
 
 .roboto-light {
   font-family: "Roboto", sans-serif;
   font-weight: 300;
   font-style: normal;
 }
 
 .roboto-regular {
   font-family: "Roboto", sans-serif;
   font-weight: 400;
   font-style: normal;
 }
 
 .roboto-medium {
   font-family: "Roboto", sans-serif;
   font-weight: 500;
   font-style: normal;
 }
 
 .roboto-bold {
   font-family: "Roboto", sans-serif;
   font-weight: 700;
   font-style: normal;
 }
 
 .roboto-black {
   font-family: "Roboto", sans-serif;
   font-weight: 900;
   font-style: normal;
 }
 

.ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 100;
   font-style: normal;
 }
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 200;
   font-style: normal;
 }
 
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 300;
   font-style: normal;
 }
 
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 400;
   font-style: normal;
 }
 
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 500;
   font-style: normal;
 }
 
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 600;
   font-style: normal;
 }
 
 .ibm-plex  {
   font-family: "IBM Plex Sans", sans-serif;
   font-weight: 700;
   font-style: normal;
 }

body{
   overflow-x: hidden;
   box-sizing: border-box;
   font-family: "IBM Plex Sans", sans-serif;
   padding: 0;
   margin: 0;
}

a{color: inherit; text-decoration: none;}
input{ -webkit-appearance: none; appearance: none; -webkit-border-radius:0px;}

.container{
   max-width: 1215px;
   margin: 0 auto;
   height: 100%;
}

.title{
   margin: 0 auto;
}

.title h1{
   color: #151515;
text-align: center;
font-size: 40px;
font-style: normal;
font-weight: 500;
line-height: 30px;
text-transform: uppercase;
}

.title hr{
   width: 35px;
   height: 0;
   border: 1px solid #214577;
   margin-bottom: 40px;
}

header{
   background-color: #fff;
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
    transition: top 0.2s ease-in-out;
   z-index: 100;
   box-shadow: 0px 12px 12px -12px rgba(0,0,0,.2); 
}

.header.hide{top: -120px;
    transition: top 0.2s ease-in-out;}

.text_hover::before {
   transform: scaleX(0);
   transform-origin: bottom right;
}
     
.text_hover:hover::before {
   transform: scaleX(1);
   transform-origin: bottom left;
}
.text_hover{
   position: relative;
}
     
.text_hover::before {
   content: " ";
   display: block;
   position: absolute;
   top: 0; right: 0; bottom: 0; left: 0;
   inset: 0 0 0 0;
   border-bottom: 2px solid #214577;
   transition: transform .3s ease;
}

.footerNav .text_hover::before{
   border-bottom: 2px solid #fff;
}

.burger{
   display: none;
}

.headerWrapper , .nav , .headerContacsItem{
   display: flex;
   justify-content: space-between;
   align-items: center;
}

.headerWrapper{
   padding: 20px 0;
}

.headerContacs{
   display: flex;
   align-items: center;
   justify-content: end;
}

.headerContacsItem{
   margin-left: 35px;
}

.headerContacsItem h2{
   font-size: 16px;
   font-weight: 400;
   color: #444444;
   text-transform: uppercase;
   margin-left: 8px;
   transition: all .3s;
}

.headerContacsItem h2:hover{color: #214577; transition: all .3s;}

.navLink{
   color: #151515;
font-family: "IBM Plex Sans";
font-size: 17px;
font-style: normal;
font-weight: 500;
line-height: normal;
text-transform: uppercase;
text-decoration: none;
margin-left: 30px;
}

.welcome{
   position: relative;
   height: 100vh;
   width: 100%;
}

.welcomeBack{
   position: absolute;
   left: 0;
   top: 0;
   width: 100vw;
   height: 100vh;
   object-fit: cover;
   z-index: 5;
   background-repeat: no-repeat;
}

.welcome::after{
   z-index: 6;
   content: '';
   display: block;
   position: absolute;
   left: 0;
   top: 0;
   min-width: 100%;
   min-height: 100%;
   background-color: rgba(40, 40, 40, .6);
}

.welcomeWrapper{
   position: relative;
   height: 100%;
}

.welcomeText{
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   z-index: 8;
   color: #fff;
   max-width: 50%;
}

.welcomeText h1{
   color: #FFF;
font-size: 67px;
font-style: normal;
font-weight: 700;
line-height: 0px;
}

.welcomeText h2{
   color: #DBDBDB;
font-size: 28px;
font-style: normal;
font-weight: 400;
line-height: 38.726px;
letter-spacing: 0.84px;
}

.welcomeInfo{
   position: absolute;
   bottom: 35px;
   z-index: 8;
   color: #fff;
   display: flex;
   align-items: center;
}

.welcomeInfoItem{
   display: flex;
   align-items: center;
   margin-right: 50px;
}

.welcomeInfoItem:last-child{
   margin-right: 0px;
}

.welcomeInfoItem img{
   margin-right: 15px;
}

.welcomeInfoItem h2{
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 27px;
text-transform: uppercase;
}

.social{
   position: fixed;
   right: 10px;
   bottom: 10px;
   display: flex;
   flex-direction: column;
   align-items: center;
   z-index: 102;
}
.socialItem{
   display: block;
   width: 50px;
   height: 50px;
}
.socialItem img{
   width: 100%;
   height: 100%;
}

.services{
   background-clip: padding-box;
   border-top: 155px solid transparent;
	margin-top: -55px;
   margin-bottom: 100px;
}

.servicesWrapper{
   display: grid;
   grid-template-columns: repeat(4,1fr);
   grid-gap: 15px;
}

.servicesItem{
   max-width: 100%;
}

.servicesItem img{
   width: 100%;
   z-index: 6;
}

.servicesItem_text{
   background-color: #fff;
   z-index: 10;
   width: 70%;
   max-width: 70%;
   margin: 0 auto;
   padding: 14px 25px;
   margin-top: -50px;
   position: relative;
   transition: all .3s;
}

.servicesItem_text h3{
   color: #151515;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 121.687%;
width: 70%;
transition: all .3s;
}

.servicesItem_text p{
   color: #666;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 22px;
transition: all .3s;
}

.servicesItem_text button{
   color: #214577;
font-size: 14px;
font-style: normal;
font-weight: 700;
text-decoration-line: underline;
background-color: transparent;
text-transform: uppercase;
border: none;
display: flex;
align-items: center;
padding-left: 0px;
cursor: pointer;
transition: all .3s;
}

.servicesItem_text button::before{
   margin-right: 12px;
   content: url('../themes/demo/assets/images/services_button.svg');
   transition: all .3s;
}

.servicesItem_text:hover{
   background-color: #214577;
   transition: all .3s;
}
.servicesItem_text:hover h3 , .servicesItem_text:hover p , .servicesItem_text:hover button{
   color: #fff;
   transition: all .3s;
}

.servicesItem_text:hover button::before{
   content: url('../themes/demo/assets/images/services_button_hover.svg');
   transition: all .3s;
}

.types{
   margin-bottom: 200px;
   position: relative;
}

.types_back{
   position: absolute;
   max-height: 600px;
   z-index: 1;
   width: 100%;
   object-fit: cover;
   bottom: -100px;
}

.types::before{
   content: '';
   display: block;
   width: 100%;
   height: 600px;
   position: absolute;
   background: rgba(40, 40, 40, 0.75);
   backdrop-filter: blur(3px);
   z-index: 2;
   left: 0;
   bottom: -100px;
}

.typesWrapper{
   display: grid;
   grid-template-columns: repeat(2,1fr);
   grid-gap: 32px;
}

.typesItem{
   width: 100%;
   height: 300px;
   position: relative;
   cursor: pointer;
   transition: all .3s;
}

.typesImg{
   width: 100%;
   height: 100%;
   z-index: 7;
   position: absolute;
   object-fit: cover;
   transition: all .3s;
}

.typesItem:hover .typesItem_text p{
   height: 0;
   width: 0;
   opacity: 0;
   visibility: hidden;
}

.typesItem::before{
   z-index: 8;
   content: '';
   display: block;
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   background: rgba(40, 40, 40, 0.60);
}

.typesItem::after{
   z-index: 9;
   content: '';
   display: block;
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   background: #214577;
   opacity: .0;
   transition: all .3s;
}

.typesItem:hover::after{
   z-index: 10;
   opacity: .6;
   transition: all .3s;
}

.typesItem_text{
   z-index: 11;
   position: absolute;
   min-height: 100%;
   min-width: 100%;
}

.typesItem_wrapper{
   position: relative;
   max-width: 100%;
   height: 100%;
}

.typesIcon{
   position: absolute;
   top: 0;
   top: 34px;
   left: 40px;
}

.typesItem_text h1{
   color: #FFF;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 32px;
letter-spacing: 0.48px;
text-transform: uppercase;
z-index: 11;
position: absolute;
bottom: 10px;
left: 40px;
}

.typesItem:hover .typesItem_text{
   padding-left: 40px;
   padding-top: 100px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

.typesItem:hover .typesItem_text h1{
   position: static;
   margin: 0px;
   line-height: 24px;
   margin-top: 50px;
}

.typesItem:hover .typesItem_text hr{
   position: static;
   margin: 0px;
   margin: 15px 0;
}

.typesItem:hover .typesItem_text p{
   position: static;
   height: auto;
   width: 85%;
   visibility: visible;
   overflow: visible;
   opacity: 1;
   margin-top: -10px;
}

.typesItem_text p{
   color: #FFF;
   font-family: "Open Sans", sans-serif;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 24px; 
z-index: 11;
opacity: 0;
overflow: hidden;
visibility: hidden;
height: 0;
width: 0;
}

.typesItem_text hr{
   width: 25px;
   height: 0;
   border: 1px solid #fff;
   z-index: 11;
   text-align: left;
   position: absolute;
   left: 40px;
   bottom: 10px;
}

.typesItem_text button{
   background: url('../themes/demo/assets/images/typesButton.svg');
   background-repeat: no-repeat;
   background-size: cover;
   width: 31px;
   height: 31px;
   border: none;
   position: absolute;
   z-index: 12;
   right: 10px;
   bottom: 10px;
   cursor: pointer;
}

.typesItem:hover .typesItem_text button{
   background: url('../themes/demo/assets/images/services_button_hover.svg');
   overflow: hidden;
   right: 50px;bottom: 110px;
}

.whyus{
   margin-bottom: 100px;
}

.whyusWrapper{
   display: grid;
   grid-template-columns: repeat(4,1fr);
   grid-gap: 32px;
}

.whyusItem{
   border: 1px solid #E4E4E4;
   text-align: center;
   padding: 36px 18px;
}

.whyusItem h3{
   color: #151515;
text-align: center;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 24px;
text-transform: uppercase;
margin: 0px;
margin-top: 20px;
margin-bottom: 10px;
}

.whyusItem p{
   color: #666;
text-align: center;
font-size: 15px;
font-style: normal;
font-weight: 400;
line-height: 23px;
margin: 0px;
}

.feedback{
   position: relative;
   padding: 90px 0;
   margin-bottom: 100px;
   border-top: 120px solid transparent;
   margin-top: -120px;
   background-clip: padding-box;
}

.feedback::before{
   top: 0;
   left: 0;
   content: '';
   display: block;
   width: 100%;
   min-height: 100%;
   position: absolute;
   background: rgba(40, 40, 40, 0.70);
   z-index: 3;
}

.feedback_back{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

.feedback_back img{
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: 2;
}

.feedbackWrapper{
   z-index: 4;
   position: relative;
   color: #fff;
}

.feedbackWrapper .title h1{
   color: #fff;
   text-align: left;
   margin: 0px;
   margin-bottom: 20px;
}

.feedbackWrapper .title hr{
   border: 1px solid #fff;
   text-align: left;
   margin: 0px;
}

.feedbackWrapper h2{
   text-align: left;
   max-width: 75%;
   margin-top: 35px;
   color: #FFF;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 26px;
}

.formWrapper{
   width: 600px;
}

.formWrapper input{
   padding: 14px 18px;
}

.formWrapperTop{
   display: flex;
   justify-content: space-between;
   width: 100%;
   margin-bottom: 10px;
}
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    color: #fff;
    cursor: pointer;
     filter: invert(1);
}

.formWrapperTop input{
   max-width: 100%;
   padding-left: 18px;
   width: 100%;
}

.formWrapperTop input:first-child{margin-right: 15px;}

.service_select{
   padding: 14px 18px;
   outline: none;
background: rgba(255, 255, 255, 0.20);
border: 1px solid rgba(255, 255, 255, 0.50);
color: #fff;
-webkit-appearance: none;
  appearance: none;
  width: 100%;
}

.service_select {
   background-image: url('../themes/demo/assets/images/f_sel.svg');
   background-size: 9px;
   background-repeat: no-repeat;
   background-position: calc(100% - 18px) center;
   color: #fff;   
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
padding: 14px;
 }

 .service_select option{
   background-color: #6a6a6a;
   padding: 14px;
 }

.formWrapperBottom{
}

.formWrapper input{
   border: 1px solid rgba(255, 255, 255, 0.50);
background: rgba(255, 255, 255, 0.20);
color: #fff;   
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
outline: none;-webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
}

.formWrapper input::placeholder{
   color: #fff;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
}

.formWrapper input:active{
   border: none;
}

.blueButton{
   color: #FFF;
   font-size: 16px;
   font-style: normal;
   font-weight: 500;
   line-height: normal;
   border: none;
   background-color: #214577;
   padding: 18px 36px;
   margin-top: 40px;
   cursor: pointer;
}

.blueButton::after{
   content: url('../themes/demo/assets/images/blueButton.svg');
   padding-left: 10px;
}

.modal_feedback{
   display: none;
   z-index: 103;
}

.modal_feedback.active{
   display: block;
   position: fixed;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   width: 100vw;
   height: 100vh;
}

.modal_feedback .container{
   position: relative;
   padding: 0 50px;
}

.modal_feedback_close{
   position: absolute;
   right: 0px;
   top: 0px;
   z-index: 110;
   cursor: pointer;
}

.modal_feedback.active::before{
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   content: '';
   display: block;
   background-color: rgba(40, 40, 40, 0.70);
   backdrop-filter: blur(5px);
}

.modal_feedback_image::before{
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   content: '';
   display: block;
   background-color: rgba(40, 40, 40, 0.70);
   border-radius: 16px;
}

.modal_feedback_image{
   width: 90%;
   height: 90vh;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   border-radius: 16px;
}
.modal_feedback_image img{
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 16px;
}

.modal_feedback_wrapper{
   height: 85vh;
   width: 90%;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
}

.modal_feedback_text{
   position: absolute;
   top: 50%;
   transform: translate(0,-50%);
   width: 100%;
}

.modal_feedback_text h1{color: #FFF;
   font-family: "IBM Plex Sans";
   font-size: 40px;
   font-style: normal;
   font-weight: 500;
   line-height: 120%; /* 48px */
   text-transform: uppercase;
}
.modal_feedback_text hr{
   width: 32px;
   height: 0;
   border: 1px solid #fff;
   margin: 0px;
   margin-top: -25px;
}
.modal_feedback_text p{
   color: #FFF;
font-family: "IBM Plex Sans";
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 26px; /* 144.444% */
}


.steps{
   border-top: 120px solid transparent;
   margin-top: -120px;
   background-clip: padding-box;
   margin-bottom: 100px;
}

.stepsWrapper{
   display: grid;
   grid-template-columns: repeat(3,1fr);
   grid-gap: 35px;
}

.stepsItem{
   text-align: center;
   background: #FFF;
box-shadow: 0px 3.335px 37.518px 0px rgba(0, 0, 0, 0.06);
padding: 32px;
}

.stepsItem h3{
   color:  #214577;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;
margin: 0px 0px 0px 0px;
margin-bottom: 23px;
}
.stepsItem h2{
   color: #151515;
text-align: center;
font-size: 22px;
font-style: normal;
font-weight: 600;
line-height: 32px;
letter-spacing: 0.44px;
text-transform: uppercase;
margin: 0px 0px 0px 0px;
margin-top: 20px;
}
.stepsItem hr{
   width: 25px;
   height: 0;
   border: 1px solid #214577;
}
.stepsItem p{
   color: #666;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin: 0px 0px 0px 0px;
margin-top: 10px;
}

.stepsLastItem{
   background-color: #214577;
   color: #fff;
}

.stepsLastItem img{
   margin-top: 32px;
}
.stepsLastItem h2{
   color: #FFF;
font-size: 22px;
font-style: normal;
font-weight: 700;
line-height: 32px;
letter-spacing: 0.44px;
text-transform: uppercase;
}
.stepsLastItem hr{
   width: 25px;
   height: 0;
   border: 1px solid #fff;
}
.stepsLastItem p{
   color: #FFF;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 24px; 
}
.stepsLastItem button{
   background-color: transparent;
   border: 1px solid #fff;
   color: #fff;
   padding: 18px 32px;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
margin-top: 24px;
cursor: pointer;
}

.stepsLastItem button::after{
   content: url('../themes/demo/assets/images/stepsButton.svg');
   padding-left: 8px;
}

.about{
   margin-bottom: 100px;
   border-top: 120px solid transparent;
   margin-top: -120px;
   background-clip: padding-box;
}

.aboutWrapper{
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.aboutImage{
   max-width: 45%;
}

.aboutImage img{
   max-width: 100%;
}

.aboutText{
   width: 50%;
}

.aboutText h1{
   color: #151515;
font-size: 40px;
font-style: normal;
font-weight: 500;
line-height: 0px;
text-transform: uppercase;
}
.aboutText hr{
   width: 32px;
   height: 0;
   border: 1px solid #214577;
   margin: 0px;
}
.aboutText h2{
   color: #666;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 27px;
}

.partners{
   margin-bottom: 100px;
   border-top: 120px solid transparent;
   margin-top: -120px;
   background-clip: padding-box;
}

.slider{
   position: relative;
}

.partnersWrapper{
   border-top: 1px solid #DADADA;
   border-bottom: 1px solid #DADADA;
   padding: 42px 0;
}

.partnersItem{
   border: 1px solid #C6C6C6;
   position: relative;
   width: 167px;
   height: 77px;
   margin: 0 20px;
}

.partnersItem img{
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
}

.prev:before {
   content: url('../themes/demo/assets/images/prev.svg');
   left: -42px;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   cursor: pointer;
 }
 
 .next:before {
   content: url('../themes/demo/assets/images/next.svg');
   right: -42px;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   cursor: pointer;
 }

 .contacts{
   margin-bottom: 100px;
   border-top: 120px solid transparent;
   margin-top: -120px;
   background-clip: padding-box;
 }

 .contactsText{
   display: grid;
   grid-template-columns: 35% 18% 18% 23%;
   grid-gap: 25px;
   margin-bottom: 35px;
 }

.contactsItem{
   border: 1px solid #E4E4E4;
   padding: 20px 28px;
}

 .contactsText h3{
   color: #555;
font-family: 'Roboto', sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: normal;
display: flex;
align-items: center;
 }


 .contactsItem h3::before{
   padding-right: 10px;
 }
 .contactsItem:nth-child(1) h3::before{
   content: url('../themes/demo/assets/images/adress.svg');
 }

 .contactsItem:nth-child(2) h3::before{
   content: url('../themes/demo/assets/images/phone_contacts.svg');
 }

 .contactsItem:nth-child(3) h3::before{
   content: url('../themes/demo/assets/images/email_contacts.svg');
 }

 .contactsText h2{
   color: #151515;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 25px;
 }
 .contactsWhatsapp{
   background-color: #51CB5F;
   display: flex;
   align-items: center;
   color: #fff;
   padding: 0 30px;
   text-align: center;
   text-decoration: none;
 }
 .contactsWhatsapp h2{
   margin-left: 10px;
   color: #fff;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 26px;
 }
 
 .contactsMap{width: 100%;}
 .dg-widget-link{width: 100%;}

 .footer{
   background-color: #214577;
   padding-top: 46px;
   padding-bottom: 24px;
   color: #fff;
 }

 .footer hr{
   width: 100%;
   height: 0;
   border: 1px solid rgba(255, 255, 255, .2);
 }

 .footerTop{
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding-bottom: 30px;
 }

 .footerNav a{
   text-decoration: none;
   color: #fff;
   text-transform: uppercase;
   margin-left: 42px;
 }
 .footerNav a:first-child{
   margin-left: 0px;
 }

 .footerBottom{
   padding-top: 16px;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .footerSocial a{
   margin-left: 8px;
 }
 .footerSocial a:first-child{
   margin-left: 0px;
 }

 .modal , .modalType{
   display: none;
 }

.modal.active , .modalType.active{
   display: block;
   min-width: 100vw;
   min-height: 100vh;
   position: fixed;
   left: 0;
   top: 0;
   z-index: 101;
   overflow: hidden;
}

.closespace{content: ' '; display: block; width: 100vw; height: 100vh; background: rgba(40, 40, 40, 0.60); position: fixed; z-index: 102;
   backdrop-filter: blur(5px);} 

.modal.active .container , .modalType.active .container {
   width: 100%;
   height: 100vh;
   position: relative;
   z-index: 104;
}

.modalWrapper{
   height: 85vh;
   display: flex;
   align-items: center;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   background-color: #fff;
}
.modal_close , .typemodal_close{
   border: none;
   background-color: transparent;
   top: 10px;
   right: 10px;
   position: absolute;
   z-index: 102;
   cursor: pointer;
}


.close{
   display: none;
}
.modalImage{
   margin-right: 80px;
   height: 100%;
   width: 75%;
}

.modalImage img{
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.modalText{
   width: 100%;
}

.modalText h1{
   width: 90%;
   color: #151515;
font-size: 40px;
font-style: normal;
font-weight: 500;
line-height: 120%; 
text-transform: uppercase;
margin: 0px;
}
.modalText hr{
   width: 90%;
   width: 32px;
   height: 0px;
   border: 1px solid #214577;
   margin: 0px;
   margin-top: 15px;
   margin-bottom: 30px;
}
.modalText p{
   width: 90%;
   color: #666;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin: 0px;
margin-bottom: 20px;
}


.modalFormInputs input{
   color: #555;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
padding: 17px 20px;
border: 1px solid rgba(198, 198, 198, 0.50);
}

.modalFormInputs input:first-child{
   margin-right: 12px;
}

.modalFormButton{
   margin-top: 30px;
}
.alert p{
   color: #51CB5F !important;
}

.modal_input_lox{
   opacity: 0;
   height: 0;
   width: 0;
}

@media(max-width: 1270px) {
   .container{
      max-width: 1000px;
   }
   .navLink{
      font-size: 15px;
      margin-left: 18px;
   }
   .headerLogo{
      width: 25%;
   }
   .headerLogo img{
      max-width: 100%;
      width: 100%;
   }
   .headerContacsItem{
      margin-left: 0px;
   }
   .servicesItem_text button{
      font-size: 12px;
   }
   .typesItem_text{
      width: 75%; 
   }
   .stepsLastItem button{
      font-size: 14px;
   }
   .partnersItem img{
      max-width: 80%;
   }
   .contactsText h2{
      font-size: 15px;
   }
   .footerNav a{
      margin-left: 10px;
   }
}

@media(max-width: 1070px){
   .modalText h1{
      font-size: 34px;
   }
   .modalText p{
      font-size: 14px;
      line-height: 22px;
      margin-bottom: 40px;
   }
   .modalFormInputs input:first-child{
      margin-right: 0px;
      margin-bottom: 12px;
   }
   .modalFormInputs input{
      width: auto;
   }
   .modalFormButton{
      margin-top: 0px;
   }
   .modalFormInputs{
      max-height: 140px;
   }
   .typesItem{
      pointer-events: none;
   }
   .typesItem:hover .typesItem_text {
      padding: 0px;
   }
   .typesItem:hover .typesItem_text h1{
      margin: 0px;
      bottom: 35px;
      position: absolute;
   }
   .typesItem:hover .typesItem_text hr{
      position: absolute;
      bottom: 5px;
   }
   .typesItem:hover .typesItem_text button{
      position: absolute;
      right: 10px;
      bottom: 10px;
   }
   .typesItem_text p{
      display: none;
   }
   .typesItem_text button{
      pointer-events: all;
   }
   .next::before , .prev::before{
      top: 100%;
      margin-top: 30px;
      /* transform: translateX(-50%); */
   }
   .next::before{
      right: 45%;
   }
   .prev::before{
      left: 45%;
   }
   .container{
      max-width: 800px;
   }
   .contactsText{
      grid-template-columns: repeat(2,1fr);
   }
   .contactsText h2{
      font-size: 18px;
   }
   .aboutText h2{
      font-size: 16px;
   }
   .stepsWrapper{
      grid-template-columns: repeat(2,1fr);
   }
   .whyusWrapper{
      grid-template-columns: repeat(3,1fr);
   }
   .servicesWrapper{
      grid-template-columns: repeat(3,1fr);
   }
   .welcomeInfo{
      display: grid;
      grid-template-columns: repeat(2,1fr);
   }
   .welcomeText{
      max-width: 100%;
   }
   .navLink {
      font-size: 12px;
      margin-left: 15px;
  }.headerLogo {
   width: 20%;
}.headerContacsItem{
   margin-left: 10px;
}
.footerLogo{
   margin-bottom: 20px;
   width: 35%;
}
.footerLogo img{
   max-width: 100%;
   width: 100%;
}
.footerTop{
   display: flex;
   flex-direction: column;
   align-items: center;
}
}

@media(max-width: 830px) {
   .modalWrapper{
      flex-direction: column;
      height: auto;
      padding-bottom: 25px;
   }
   .modalImage{
      margin-right: 0px;
      margin-bottom: 30px;
      height: 250px;
      width: 100%;
   }
   .modalText{
      width: 100%;
      max-width: 100%;
      padding: 0 25px;
   }
   .modalText h1{
      font-size: 24px;
   }
   .modalText p{
      line-height: 22px;
   }
   .modalText hr{
      margin-top: 5px;
      margin-bottom: -25px;
   }
   .modalFormInputs{
      height: 60px;
      margin-bottom: 20px;
   }
   .modal_close, .typemodal_close{
      background-color: #fff;
      border-radius: 50%;
      width: 32px;
      height: 32px;
      top: 10px;
      right: 10px;
   }
   .modal_close img, .typemodal_close img{
      margin-top: -1px;
      margin-left: -6px;
   }
   .modalText{
      padding: 0 25px;
      width: 90%;
   }
   .next::before{
      right: 43%;
   }
   .prev::before{
      left: 43%;
   }
   .container{
      max-width: 600px;
   }
   .aboutWrapper{
      flex-direction: column;
   }
   .aboutImage{
      max-width: 100%;
      width: 100%;
      height: 300px;
      margin-bottom: 25px;
   }
   .aboutImage img{
      max-width: 100%;
      width: 100%;
      height: 100%;
      object-fit: cover;
   }
   .aboutText{
      max-width: 100%;
      width: 100%;
      text-align: left;
   }
   .whyusWrapper{
      grid-template-columns: repeat(2,1fr);
   }
   .typesWrapper{
      grid-template-columns: repeat(1,1fr);
   }
   .types::before{
      content: none;
   }
   .types_back{
      display: none;
   }
   .servicesWrapper{
      grid-template-columns: repeat(2,1fr);
   }
   .welcomeInfo{
      grid-template-columns: repeat(1,1fr);
   }
   .welcome::after{
      background-color: rgba(40, 40, 40, .8);
   }
   .formWrapper{
      width: 100%;
   }
   .footerNav a{
      font-size: 13px;
   }
   .burger{
      display: block;
      width: 30px;
      height: 20px;
      position: relative;
   }
   .burgerItem{
      width: 100%;
      border-radius: 12px;
      background-color: #040C34;
      height: 2px;
      position: absolute;
      transition: .3s;
   }
   .burgerItem:first-child{
      top: 0;
   }
   .burgerItem:nth-child(2){
      top: 50%;
      transform: translateY(-50%);
   }
   .burgerItem:last-child{
      bottom: 0;
   }
   .burger.active .burgerItem:first-child{
      transform: translateY(10px) rotate(45deg);
      transition: .3s;
   }
   .burger.active .burgerItem:nth-child(2){
      opacity: 0;
      transition: .3s;
   }
   .burger.active .burgerItem:last-child{
      transform: translateY(-8px) rotate(-45deg);
      transition: .3s;
   }
   .burger.active{
      margin-top: 10px;
   }
   .headerContacs, .headerContacs, .nav{
      opacity: 0;
      visibility: hidden;
      display: none;
   }
   .header.active{
      height: 100%;
   }
   .header.active .headerContacs , .header.active .headerContacs ,.header.active .nav {
      opacity: 1;
      visibility: visible;
      display: block;
   }
   .header.active .headerWrapper{
      height: 100%;
      align-items: flex-start;
      position: relative;
   }
   .header.active .nav{
      display: flex;
      flex-direction: column;
      text-align: center;

      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100%;
   }
   .header.active .navA{
      font-size: 32px;
      margin-bottom: 15px;
      font-weight: 500;
   }
   .header.active .headerContacts{
      left: 0;
      position: absolute;
      top: 75px;
      font-size: 18px;
   }
   .header.active .headerContacts h3{
      font-size: 18px !important;
   }
   .header.active .headerSocial{
      position: absolute;
      right: 0;
      top: 75px;
      display: flex;
   }
   .header.active .headerSocial .headerSocialItem{
      width: 35px;
      height: 35px;
   }
   .navA{
      margin-right: 0px !important;
   }
   .header.active .popupLink::after{
      content: url("../themes/demo/assets/images/pla.svg");
   }
   .headerLogo{
      width: 30%;
   }
   .header.active .headerContacs{
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: absolute;
      top: 70px;
      left: 0;
      width: 100%;
   }
   .headerContacsItem h2{
      font-size: 18px;
   }
   .navLink{
      margin-left: 0px;
      font-size: 28px;
      margin-bottom: 15px;
   }
   .modal_close, .typemodal_close{top: 275px; background: transparent;}
}

@media(max-width: 640px) {
   .modalFormInputs{
      height: 120px;
   }
   .formWrapperTop , .formWrapperBottom{
      display: flex;
      flex-direction: column;
   }
   .next::before{
      right: 41%;
   }
   .prev::before{
      left: 41%;
   }
   .container{
      max-width: 450px;
   }
   .servicesWrapper{
      grid-template-columns: repeat(1,1fr);
   }
   .whyusWrapper{
      grid-template-columns: repeat(1,1fr);
   }
   .title h1{
      line-height: 48px;
   }
   .stepsWrapper{
      grid-template-columns: repeat(1,1fr);
   }
   .contactsText {
      grid-template-columns: repeat(1,1fr);
   }
   .welcomeText h1{
      font-size: 42px;
      line-height: 48px;
   }
   .welcomeText h2{
      font-size: 24px;
      line-height: 30px;
   }
   .welcomeInfoItem h2{
      font-size: 16px;
      line-height: 24px;
   }
   .welcomeText{
      margin-top: -100px;
   }
   .title h1{
      font-size: 36px;
   }
   .servicesItem_image{
      width: 100%;
      height: 200px;
   }
   .servicesItem_image img{
      width: 100%;
      height: 100%;
      object-fit: cover;
   }
   .contactsWhatsapp{
      padding: 30px;
   }
   .footerBottom{
      flex-direction: column;
      align-items: flex-start;
   }
   .footer__foot{
      margin-bottom: 15px;
   }
   .formWrapperTop input:first-child{margin-right: 0px; margin-bottom: 10px;}
} 

@media(max-width: 475px) {   
   .modal_close, .typemodal_close{top: 175px; background: transparent;} 
   .modalImage{
      height: 150px;
   }
   .modal.active .container, .modalType.active .container{
      max-width: 85%;
   }
   .modalText p{
      font-size: 12px;
      line-height: 20px;
   }
   .modalText h1{
      font-size: 18px;
   }
   .modalFormInputs input{
      padding: 12px 16px;
      font-size: 14px;
   }
   .modalFormButton {
      font-size: 14px;
      padding: 14px 36px;
   }
   .next::before{
      right: 37%;
   }
   .prev::before{
      left: 37%;
   }
   .container{
      max-width: 320px;
   }
   .welcomeInfoItem h2{
      font-size: 14px;
      line-height: 22px;
   }
   .headerLogo{
      width: 37%;
   }
   .typesItem_text h1{
      font-size: 18px;
      line-height: 28px;
   }
   .title h1{
      font-size: 32px;
   }
   .whyusItem h3{
      font-size: 18px;
      line-height: 22px;
   }
   .header.active .headerContacs{
      flex-direction: column;
      align-items: flex-start;
   }
   .navLink{
      margin-bottom: 20px;
   }
   .footerTop{
      align-items: flex-start;
   }
   .footerNav a{
      margin-left: 0px;
      margin-bottom: 10px;
      font-size: 18px;
   }
   .footerLogo{
      width: 50%;
   }
   .footerNav{
      display: flex;
      align-items: flex-start;
      flex-direction: column;
   }
   .modal_feedback_text h1{
      font-size: 32px;
   }
   .modal_feedback_text p{
      font-size: 16px;
   }
   .modal_feedback_text .blueButton{
      margin-top: 20px;
   }
   .modal_feedback_text hr{
      margin-top: -10px;
   }
}