@font-face {
    font-family: "Inter";
    src: local('Inter Regular'), local('Inter-Regular'), url(../fonts/Inter-Regular.woff2) format("woff2"),
    url(../fonts/Inter-Regular.woff) format("woff"),
    url(../fonts/Inter-Regular.ttf) format('truetype');
    font-weight: 400;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: "Inter";
    src: local('Inter Semi Bold'), local('Inter-Semi-Bold'), url(../fonts/Inter-SemiBold.woff2) format("woff2"),
    url(../fonts/Inter-SemiBold.woff) format("woff"),
    url(../fonts/Inter-SemiBold.ttf) format('truetype');
    font-weight: 600;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: "Inter";
    src: local('Inter Light BETA'), local('Inter-Light-BETA'), url(../fonts/Inter-LightBETA.woff2) format("woff2"),
    url(../fonts/Inter-LightBETA.woff) format("woff"),
    url(../fonts/Inter-Light.ttf) format('truetype');
    font-weight: 300;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: "Inter";
    src: local('Inter Medium'), local('Inter-Medium'), url(../fonts/Inter-Medium.woff2) format("woff2"),
    url(../fonts/Inter-Medium.woff) format("woff"),
    url(../fonts/Inter-Medium.ttf) format('truetype');
    font-weight: 500;
    font-display: swap;
    font-style: normal;
}

@font-face {
    font-family: "Inter";
    src: local('Inter Bold'), local('Inter-Bold'), url(../fonts/Inter-Bold.woff2) format("woff2"),
    url(../fonts/Inter-Bold.woff) format("woff"),
    url(../fonts/Inter-Bold.ttf) format('truetype');
    font-weight: 700;
    font-display: swap;
    font-style: normal;
}






*,
*::before,
*::after {
    padding: 0;
    margin: 0;
    border: 0;
    box-sizing: border-box;
}
html,body {
    height: 100%;
    overflow-x: hidden;
}



h1, h2, h3, h4, h5, h6, p {
    font-size: inherit;
 font-weight: inherit;
}

body {
    background-color: #121212;
}

.wrapper {
    min-height: 100%;
    /* display: flex; */
    /* flex-direction: column; */
    background-color: #121212;
    opacity: 0;
    transition: opacity 1s ease;

    /* overflow: hidden; */
}

.container {
    /* flex: 1 1 auto; */
    width: 100%;
    height: 100%;
    max-width: 1728px;
    margin: 0px auto;
    padding: 0px 94px;
}

.page {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.page2 {
    /* position: fixed; */
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
}

.page__wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.page__wrapper2 {
    display: flex;
    /* flex-direction: column; */
    width: 100%;
    height: 100%;
}

.screen {
    flex: 1 0 100%;
    position: relative;
}

.screen2 {
    flex: 1 0 100%;
    position: relative;
}

.screen__footer {
    flex: 1 0 8%;
    /* position: relative; */
}

.page__scroll {
    position: absolute;
    top: 0;
    right: 0;
    width: 7px;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
}

.page__drag-scroll {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    border: 2px solid rgba(0, 0, 0, 0.7);
    background-color: rgba(243, 112, 33, 0.7);
    cursor: pointer;
}



            /* Loader */


.preloader {
    position: fixed;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #121212;
    opacity: 1;
    transition: opacity 1s ease;


}

.preloader-main {
    width: 95px;
    max-width: 100%;
}

.preloader-main img {
    opacity: 0;
    max-width: 100%;
    animation-name: brandOpacity;
    animation-duration: 1.1s;
    animation-iteration-count: 4;
    animation-direction: alternate;
}

@keyframes brandOpacity {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.preloader.activeNone {
    display: none;
}


        /* Block Header */


.header {
    background-color: #121212;
}

.header__flex {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    justify-content: space-between;
    padding: 50px 0px;
}

.header__nav {
    display: flex;
    justify-content: space-between;
    /* align-items: center; */
}

.logo {
    /* width: 150px; */
    display: flex;
    max-width: 100%;
    /* align-items: flex-end; */
    /* align-self: flex-end; */
}



/* .header__nav img { */
    /* position: relative; */
    /* z-index: 4; */
    /* max-width: 100%; */
/* } */

.header__menu {
    display: flex;
    align-self: center;
}



.nav__list {
    display: flex;
    gap: 30px;
}

.nav__list {
    list-style: none;
}

.nav__list a {
    text-decoration: none;
    color: #FFFFFF;
    font-size: 18px;
    font-family: "Inter";
    letter-spacing: -0.03em;
    font-weight: 500;
}

.nav {
    align-self: flex-end;
}

.header_button {
    color: #FFFFFF;
    border: 2px solid #F37021;
    border-radius: 8px;
    padding: 17px 29px;
    align-self: center;
    text-decoration: none;
    font-family: "Inter";
    font-size: 20px;
    letter-spacing: -0.03em;
    font-weight: 500;
    /* z-index: 5; */
    transition: background-color 0.3s ease-in;
}

.button_modal:hover {
    background-color: #F37021;
    transition: background-color 0.3s ease-in;
}

.button_modal:active {
    background-color: #C56B34;
}

.burger {
    display: none;
    /* cursor: pointer; */
}

.line {
    width: 25px;
    height: 3px;
    margin: 5px;
    background-color: white;
    transition: all .4s ease;
}


.toggle .line1 {
    transform: rotate(-45deg) translate(-5px, 6px);    
}

.toggle .line2 {
    opacity: 0;
}

.toggle .line3 {
    transform: rotate(45deg) translate(-5px, -6px);
}

.header_button_mobile {
    display: none;
    color: #FFFFFF;
    border: 2px solid #F37021;
    border-radius: 8px;
    padding: 17px 29px;
    align-self: center;
    text-decoration: none;
    letter-spacing: -0.03em;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
}





.header__body {
    display: flex;
    justify-content: space-between;
}


.header__body__slogan h1 {
    font-family: "Inter";
    font-weight: 600;
    font-size: 80px;
    letter-spacing: -0.03em;
    color: #FFFFFF;
    white-space: nowrap;
}

.header__body__slogan {
    display: flex;
    flex-direction: column;
    gap: 50px;
    max-width: 100%;
}

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

.slogan__button a {
    color: #FFFFFF;
    text-decoration: none;
    font-family: "Inter";
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.03em;
    display: inline-block;
    /* cursor: pointer; */
}

.slogan__button {
    max-width: 100%;
}

.slogan__button_left {
    background-color: #F37021;
    border-radius: 15px;
    padding: 20px 44px;
    margin-right: 20px;
    border: 2px solid #F37021;
    max-width: 100%;
    cursor: pointer;
    transition: background-color 0.3s ease-out;

}

.slogan__button_left:hover {
    background-color: #FFFFFF;
    border: 2px solid #FFFFFF;
    color: #F37021;
    transition: all 0.3s ease-out;
}

.slogan__button_left:active {
    background-color: #DDDDDD;
}

.slogan__button_right {
    border-radius: 15px;
    border: 2px solid #FFFFFF;
    padding: 20px 79px 19px 85px;
    max-width: 100%;
    transition: all 0.3s ease-out;

}

.slogan__button_right:hover {
    background-color: #FFFFFF;
    color: #F37021;
    transition: all 0.3s ease-out;
}

.slogan__button_right:active {
    background-color: #DDDDDD;
}

.header__body__brend {
    max-width: 100%;
}

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



.header__footer {
    display: flex;
    justify-content: space-between;
    align-items: end;
    /* padding-bottom: 30px; */
}

.header__footer p {
    color: #FFFFFF;
    font-family: "Inter";
    font-size: 20px;
    letter-spacing: -0.03em;
    font-weight: 400;
}

.header__footer__right {
    display: flex;
    align-items: end;
    gap: 20px;
}

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




/* .nav__list li a { */
    /* display: inline-block; */
    /* padding-left: 5px; */
    /* position: relative; */
/* } */
/*  */
/* .nav__list li a:hover::after { */
    /* width: 90%; */
    /* right: 0; */
/* } */
/*  */
/* .nav__list li a::after { */
    /* content: ""; */
    /* display: block; */
    /* height: 2px; */
    /* margin-top: 3px; */
    /* position: absolute; */
    /* background: linear-gradient(to left, #f9dd94, #F37021 100%); */
    /* transition: width .3s ease 0s, linear .3s ease 0s; */
    /* width: 0; */
/* } */









        /* Block Modal */


.modal {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    /* justify-content: flex-end; */
    cursor: pointer;
    overflow-y: auto;
    display: none;
    z-index: 6;
}

.modal__container {
    width: 1728px;
    max-width: 100%;
    /* height: 100vh; */
    /* max-height: 100%; */
    /* background-color: rgba(0, 0, 0, 0.6); */

    display: flex;
    justify-content: flex-end;
    margin: 0px auto;
    padding: 0px 94px;
}

.modal__main {
    position: relative;
    width: 590px;
    height: 920px;
    max-width: 100%;
    max-height: 100%; 
    border: 1px solid #FFFFFF;
    border-radius: 20px;
    background-color: #000000;
    top: 160px;
    padding: 63px 55px;
    cursor: default;
    z-index: 10;
}



.modal_close {
    position: absolute;
    top: 42px;
    right: 44px;
    cursor: pointer;
}

.close_line1, .close_line2, .close_line3 {
    width: 40px;
    height: 3px;
    margin: 5px;
    background-color: white;
}

.close_line1 {
    transform: rotate(-45deg) translate(-5px, 6px);    
}

.close_line2 {
    opacity: 0;
}

.close_line3 {
    transform: rotate(45deg) translate(-5px, -6px);
}

form {
    display: flex;
    flex-direction: column;
}

form label {
    color: #FFFFFF;
    font-family: "Inter";
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 15px;
}

.form_row1 {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

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

.form_column1, .form_column2, .form_column3, .form_column4 {
    display: flex;
    flex-direction: column;
}



input {
    border-bottom: 1px solid #FFFFFF;
    margin-bottom: 35px;
    max-width: 240px;
    padding-bottom: 5px;
    outline: none;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 400;
    color: #FFFFFF;
}

[type="submit"] {
    margin-bottom: 0px;
    padding-bottom: 0px;
}

input[type="text"] {
    -webkit-appearance: none;
    border-radius: 0;
   }

input[type="tel"] {
    -webkit-appearance: none;
    border-radius: 0;
}

input[type="email"] {
    -webkit-appearance: none;
    border-radius: 0;
}

input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 15px;
}





/* input::placeholder { */
    /* color: #ffffffad; */
    /* font-family: "Inter"; */
    /* font-size: 16px; */
    /* font-weight: 400; */
/* } */

input, textarea {
    background-color: #000000;
}

input:focus {
    border-bottom: 2px solid #F37021;
}

textarea {
    border-radius: 5px;
    border: 1px solid #FFFFFF;
    margin-bottom: 30px;
    color: #FFFFFF;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 400;
    padding: 19px;
    height: 170px;
    resize: none;
}

/* textarea::placeholder { */
    /* color: #ffffffad; */
    /* font-family: "Inter"; */
    /* font-size: 16px; */
    /* font-weight: 400; */
/* } */

.form_button {
    color: #FFFFFF;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
    border: none;
    background-color: #F37021;
    height: 55px;
    /* padding: 18px 74px; */
    border-radius: 15px;
    position: relative;
    cursor: pointer;
    width: 200px;
    transition: background-color 0.5s ease;

}

.form_button:hover {
    background-color: #FFFFFF;
    color: #F37021;
    transition: background-color 0.5s ease;
}

.form_button:active {
    background-color: #DDDDDD;
}

._req._error {
    border-bottom: 2px solid red;
}

.form__body::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    background: rgba(51, 51, 51, 0.7) url(../images/Home/load.gif) center / 50px no-repeat;
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease 0s;
    z-index: 2;
}

.form__body._sending::after {
    opacity: 1;
    visibility: visible;
}

.required {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    background-color: rgba(51, 51, 51, 0.9);
    opacity: 0;
    visibility: hidden;
    transition: all 0.5s ease 0s;
    z-index: 2;
}

.required p {
    color: #FFFFFF;
    font-family: "Inter";
    font-size: 20px;
}

.required li {
    list-style: none;
}

.required.active-req  {
    opacity: 1;
    visibility: visible;
}















        /* Block AboutUs */


.aboutUs {
    /* min-height: 100vh; */
    background-color: #121212;

}

.aboutUs__flex {
    display: flex;
    height: 100%;
    max-height: 100%;
}

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


.aboutUs__content h2 {
    font-family: "Inter";
    color: #F37021;
    font-size: 48px;
    font-weight: 600;
    letter-spacing: -0.03em;
    margin-bottom: 90px;
}

.flex__h2 {
    display: none;
    font-family: "Inter";
    color: #F37021;
    font-size: 35px;
    font-weight: 600;
}

.aboutUs__content p {
    font-family: "Inter";
    font-size: 32px;
    font-weight: 400;
    color: #FFFFFF;
    margin-bottom: 60px;
    letter-spacing: -0.03em;
    line-height: 39px;
    /* white-space: nowrap; */
}

.aboutUs__content_p1 {
    max-width: 727px;
}

.aboutUs__content_p2 {
    max-width: 776px;
}

.aboutUs__content_p3 {
    max-width: 819px;
}


.aboutUs__content p:last-child {
    margin-bottom: 0;
}

.aboutUs__statistic {
   display: flex;
   gap: 60px;
}

.statistic__block_column1 {
    display: flex;
    flex-direction: column;
    gap: 95px;
}

.statistic__block_column2 {
    display: flex;
    flex-direction: column;
    gap: 95px;
}

.aboutUs__statistic span {
    font-family: "Inter";
    font-size: 96px;
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: -0.03em;
    margin-bottom: 14px;
} 

.aboutUs__statistic p {
    font-family: "Inter";
    font-size: 24px;
    font-weight: 400;
    color: #FFFFFF;
    letter-spacing: -0.03em;
    white-space: nowrap;
}

.statistic__block {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.statistic__block img {
    margin-bottom: 30px;
    max-width: 100%;
}




        /* Block Services */


.services {
    /* min-height: 100vh; */
    background-color: #F37021;
}

.services__flex {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 100%;
    max-height: 100%;
}

.services_h2 {
    color: white;
    font-family: "Inter";
    /* font-size: calc(32px + 32 * (100vw / 1728)); */
    font-size: 64px;
    letter-spacing: -0.03em;
    font-weight: 600;
    text-align: center;
}

.services__body p {
    font-family: "Inter";
    color: #FFFFFF;
    /* font-size: calc(15px + 21 * (100vw / 1728)); */
    font-size: 36px;
    font-weight: 400;
    letter-spacing: -0.03em;
    text-align: center;
    margin-bottom: 170px;
}

.services__body_a {
    font-family: "Inter";
    color: #FFFFFF;
    /* font-size: calc(20px + 16 * (100vw / 1728)); */
    font-size: 36px;
    font-weight: 500;
    letter-spacing: -0.03em;
    text-decoration: none;
    cursor: default;
}


.services__body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 190px;
}

.services__body__footer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.services__footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

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

.services__footer_mobile {
    display: none;
}

.mobile_img {
    max-width: 100%;
}






        /* Block Feauturing */


.feauturing {
    /* min-height: 100vh; */
    background-color: #246EB9;
    /* position: relative; */
}

.feauturing__flex {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    /* padding: 72px 0px; */
    height: 100%;
    max-height: 100%;
    /* min-height: 100vh; */
}

.feauturing__header {
    align-self: flex-start;
}

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

.feauturing__header p {
    font-family: "Inter";
    font-weight: 500;
    letter-spacing: -0.03em;
    font-size: 32px;
    color: #FFFFFF;
}

.feauturing_span {
    font-weight: 300;
}

.feauturing__body__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 96px;
    font-weight: 500;
    letter-spacing: -0.03em;
}

.text_header_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.text_img_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.text_h2_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.text_button_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}



.text_mobile-button_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.fade_hidden {
    overflow: hidden;

}

.text_fade.active {
    transition: transform 2s ease-in-out;
    transform: translateY(0);
}



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

.feauturing__footer a {
    text-decoration: none;
    color: #246EB9;
    background-color: #FFFFFF;
    border-radius: 15px;
    border: 3px solid #FFFFFF;
    padding: 17px 50px;
    font-family: "Inter";
    font-size: 24px;
    letter-spacing: -0.03em;
    font-weight: 500;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

.feauturing__footer a:hover {
    color: #FFFFFF;
    background-color: #246EB9;
    transition: all 0.3s ease-in-out;
}

.feauturing__footer a:active {
    background-color: #184D82;
}

.button_mobile {
    color: #246EB9;
    background-color: #FFFFFF;
    border-radius: 8px;
    padding: 17px 50px;
    /* width: 190px; */
    /* height: 56px; */
    border: 3px solid #FFFFFF;
    font-family: "Inter";
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -0.03em;
    margin-top: 35px;
    text-decoration: none;
    display: none;
    transition: all 0.3s ease-in-out;

}

.featuring_button_flex {
    display: none;
    justify-content: flex-start;
}

.button_mobile:hover {
    color: #FFFFFF;
    background-color: #246EB9;
    transition: all 0.3s ease-in-out;
}

.button_mobile:active {
    background-color: #184D82;
}

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

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



.fraction__block {
    position: fixed;
    top: 0;
    left: 0;
    font-family: "Inter";
    font-size: 32px;
    font-weight: 400;
    color: #FBFBFB;
    display: none;
    overflow: hidden;
}

.fraction__block.active {
    display: block;
}

.fraction__flex {
    transform: translateY(-100%);
    transition: transform 0.3s ease-in-out;
    display: inline-flex;
}

.slider__current {
    overflow: hidden;
}

.current_change {
    transform: translateY(0%);
    transition: 1s;
    display: inline-block;
}
     







        /* Block Pepeline */


.pipeline-service {
    background-color: #7D8491;
}

.pipeline-service .button_mobile {
    color: #7D8491;
}

.pipeline-service .button_mobile:hover {
    color: #FFFFFF;
    background-color: #7D8491;
    transition: all 0.3s ease-in-out;
}

.pipeline-service .button_mobile:active {
    background-color: #50535A;
}

.pipeline-service .button_fulscreen {
    color: #7D8491;
}

.pipeline-service .button_fulscreen:hover {
    color: #FFFFFF;
    background-color: #7D8491;
    transition: all 0.3s ease-in-out;
}

.pipeline-service .button_fulscreen:active {
    background-color: #50535A;
}


.pipeline__text_header_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.pipeline__text_img_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.pipeline__text_h2_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.pipeline__text_button_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}


.pipeline__text_fade.active {
    transition: transform 2s ease-in-out;
    transform: translateY(0);
}





        /* Block Environment */


.environment {
    background-color: #4CB944;
}

.environment .button_mobile {
    color: #4CB944;
}

.environment .button_mobile:hover {
    color: #FFFFFF;
    background-color: #4CB944;
    transition: all 0.3s ease-in-out;
}

.environment .button_mobile:active {
    background-color: #3C8C36;
}

.environment .button_fulscreen {
    color: #4CB944;
}

.environment .button_fulscreen:hover {
    color: #FFFFFF;
    background-color: #4CB944;
    transition: all 0.3s ease-in-out;
}

.environment .button_fulscreen:active {
    background-color: #3C8C36;
}


.envi__text_header_fade {
    transform: translateY(115%);
    transition: 0.3s;
    display: inline-block;
    
}

.envi__text_img_fade {
    transform: translateY(115%);
    transition: 0.3s;
    display: inline-block;
    
}

.envi__text_h2_fade {
    transform: translateY(115%);
    transition: 0.3s;
    display: inline-block;
    
}

.envi__text_button_fade {
    transform: translateY(115%);
    transition: 0.3s;
    display: inline-block;
    
}

.envi__text_fade.active {
    transition: transform 2s ease-in-out;
    transform: translateY(0);
}






        /* Block Civil */

.civil {
    background-color: #FFFFFF;
}

.civil .button_mobile {
    color: #FFFFFF;
    background-color: #000000;
    border: 3px solid #000000;
    

}

.civil .button_mobile:hover {
    color: #181818;
    border: 3px solid #181818;
    background-color: #FFFFFF;
}

.civil .button_mobile:active {
    background-color: #DDDDDD;
}

.civil .feauturing__header p {
    color: #000000;
}

.civil .feauturing__body__left h2 {
    color: #000000;
}

.civil .feauturing__footer p {
    color: #000000;
}

.civil .feauturing__footer a {
    color: #FFFFFF;
    border: 3px solid #181818;
    background-color: #181818;
}

.civil .feauturing__footer a:hover {
    color: #181818;
    border: 3px solid #181818;
    background-color: #FFFFFF;
}

.civil .feauturing__footer button:active {
    background-color: #DDDDDD;
}



.civil__text_header_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.civil__text_img_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.civil__text_h2_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.civil__text_button_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.civil__text_fade.active {
    transition: transform 2s ease-in-out;
    transform: translateY(0);
}

   





    /* Block Oil */


.oil {
    background-color: #423629;
}

.oil .button_mobile {
    color: #423629;
}

.oil .button_mobile:hover {
    color: #FFFFFF;
    background-color: #423629;
    transition: all 0.3s ease-in-out;
}

.oil .button_mobile:active {
    background-color: #201B15;
}

.oil .button_fulscreen {
    color: #423629;
}

.oil .button_fulscreen:hover {
    color: #FFFFFF;
    background-color: #423629;
    transition: all 0.3s ease-in-out;
}

.oil .button_fulscreen:active {
    background-color: #201B15;
}



.oil__text_header_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.oil__text_img_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.oil__text_h2_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.oil__text_button_fade {
    transform: translateY(110%);
    transition: 0.3s;
    display: inline-block;
    
}

.text_fade.active {
    transition: transform 2s ease-in-out;
    transform: translateY(0);
}
    
        





        /* Block Map */


.map {
    background-color: #121212;
    position: relative;
}


.map__grid {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    height: 100%;
    max-height: 100%;
    /* min-height: 100vh; */
    /* padding: 20px 0px; */
}

.map__header {
    font-family: "Inter";
    font-size: 64px;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #FFFFFF;
}

.map__body {
    max-width: 100%;
    align-self: center;
    justify-self: center;
    /* position: relative; */
}

.map__body .svg {
    max-width: 100%;
    /* height: auto; */
    max-height: 73vh;
    /* position: relative; */
}

.map__footer p {
    font-family: "Inter";
    font-size: 40px;
    font-weight: 400;
    color: #F37021;
}

.map__modal {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
    cursor: pointer;
}

.map__modal img {
   max-width: 45vh;
   max-height: 40vw;
   cursor: default;
}

.scroll-up {
    position: fixed;
    right: 30px;
    bottom: 30px;
    cursor: pointer;
    opacity: 0.2;

    display: none;
    transition: all 0.3s ease-in-out;
}

.scroll-up.active {
    display: block;
    transition: all 0.3s ease-in-out;

}

.scroll-up:hover {
    opacity: 1;
}


.map-mobile__block {
    display: none;
}

.map-mobile__footer {
    display: none;
}


.map-mobile_img img {
    max-width: 100%;
}







/* .swiper-pagination { */
    /* position: fixed; */
    /* inset: 0; */
    /* left: 20px; */
/* } */




 /* .tooltip { */
    /* position: absolute; */
    /* left: 0; */
    /* top: 0; */
    /* padding: 5px; */
    /* background-color: #F37021; */
    /* border-radius: 5px; */
    /* display: none; */
    /* font-family: "Inter"; */
    /* font-size: 1px; */
    /* color: black; */
    /* font-weight: 600; */
/*  */
 /* } */


        /* SVG */


 g {
    cursor: pointer;
 }

 g:hover .part-blue {
    stroke:#246EB9;
    stroke-width: 4;
    transition:all 0.3s ease-in-out;
}

g:hover .part-grey {
    stroke:#7D8491;
    stroke-width: 3;
    transition:all 0.3s ease-in-out;
}

g:hover .part-white {
    stroke: white;
    stroke-width: 3;
    transition:all 0.3s ease-in-out;
}

g:hover .part-green {
    stroke: #4CB944;
    stroke-width: 5;
    transition:all 0.3s ease-in-out;
}

g:hover .part-black {
    stroke: #423629;
    stroke-width: 3;
    transition:all 0.3s ease-in-out;
}

g:hover .hq_small-circle {
    r: 4;
    transition:all 0.3s ease-in-out;

}

g:hover .hq_big-circle {
    r: 22;
    transition:all 0.3s ease-in-out;

}

g:hover .circle_small {
    r: 4;
    transition:all 0.3s ease-in-out
} 


g:hover .circle_small_left {
    r: 3;
    cx: 32.2;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_left1 {
    r: 3;
    cx: 90;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_left2 {
    r: 3;
    cx: 208.8;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_left3 {
    r: 3;
    cx: 647.5;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right {
    r: 4;
    cx: 38;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right1 {
    r: 4;
    cx: 32;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right2 {
    r: 4;
    cx: 49;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right3 {
    r: 4;
    cx: 426.5;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right4 {
    r: 4;
    cx: 973.5;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right5 {
    r: 4;
    cx: 953;
    transition: r 0.3s ease-in-out

}

g:hover .circle_small_right6 {
    r: 4;
    cx: 865;
    transition: r 0.3s ease-in-out

}

g:hover .small-circle_four-color {
    r: 4;
    cx: 81.5;
    transition: r 0.3s ease-in-out

}

g:hover .small-circle_five-color {
    r: 4;
    cx: 788.5;
    cy: 736.5;
    transition: r 0.3s ease-in-out

}

g:hover .big-circle_five-color {
    r: 23.5;
    transition: r 0.3s ease-in-out

}

g:hover .small-circle_five-color1 {
    r: 4;
    cx: 870;
    /* cy: 736.5; */
    transition: r 0.3s ease-in-out

}

g:hover .big-circle_five-color1 {
    r: 23.5;
    transition: r 0.3s ease-in-out

}

g:hover .small-circle_five-color2 {
    r: 4;
    cx: 1050.5;
    cy: 515;
    transition: r 0.3s ease-in-out

}

g:hover .big-circle_five-color2 {
    r: 23.5;
    transition: r 0.3s ease-in-out

}


g:hover .circle_big {
    r: 18;
    transition:all 0.3s ease-in-out
}




                                                        /* Map-Mobile Block */


.map-mobile_img {
    /* cursor: pointer; */
   
}





.dynamic-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 37px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}

.map-modal-mobile_close {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 35px;
}

.map-modal-mobile_close img {
    width: 45px;
    max-width: 100%;
}




.pipeline-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 37px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}

.envi-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 70px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}

.map-modal__p p {
    font-family: "Inter";
    font-size: 27px;
    color: #FFFFFF;
    font-weight: 400;
    line-height: 37px;
    margin-bottom: 45px;
}


/* .map-modal-mobile__p::after { */
    /* content: attr(data-last-words); */
    /* text-decoration: underline; */
/* } */
/*  */
/* .map-modal-mobile__p { */
    /* display: inline-block; */
/* } */

/* .map-modal-mobile__p:not(:last-child) { */
    /* margin-right: 10px; */
/* } */



/* .dynamic_span { */
    /* display: inline-block; */
    /* text-decoration: underline; */
    /* font-size: 12px; */
/* } */
/* .dynamic_span { */
    /* text-decoration: underline; */
    /* font-size: 12px; */
/* } */

/* .map-modal-mobile__p > span { */
    /* text-decoration: underline; */
    /* font-size: 1em; */
/* } */




.civil-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 37px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}

.oil-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 70px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}

.company-modal__mobile {
    position: fixed;
    inset: 0;
    /* display: flex; */
    background-color: #181818;
    flex-direction: column;
    padding: 50px 70px 37px 70px;
    gap: 25px;
    display: none;
    overflow: auto;
}
 



        /* Block Work */


.work {
    /* min-height: 100vh; */
    background-color: #121212;
}

.work__grid {
    display: flex;
    flex-direction: column;
    /* min-height: 93vh; */
    height: 100%;
    max-height: 100%;
    justify-content: space-around;
}

.work__header {
    justify-self: center;
    align-self: center;
}

.work__header h2 {
    font-family: "Inter";
    font-size: 64px;
    letter-spacing: -0.03em;
    font-weight: 600;
    color: #F37021;
    margin-bottom: 19px;
    text-align: center;
}

.work__header p {
    font-family: "Inter";
    font-size: 40px;
    letter-spacing: -0.03em;
    font-weight: 400;
    color: #FFFFFF;
}

.work__main p {
    font-family: "Inter";
    font-size: 32px;
    font-weight: 300;
    color: #FFFFFF;
    max-width: 427px;
    letter-spacing: -0.03em;
    line-height: 144%;
}

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

.work_image {
    max-width: 100%;
}

/* .work__images__block { */
    /* background-color: #121212; */
/* } */




        /* Block Footer */


.footer {
    padding: 50px 0px;
    /* flex: 1 0 20%; */
    /* background-color: #121212; */
}

.footer__grid {
    display: grid;
    grid-template-columns: auto auto auto auto;
    justify-content: space-between;
    align-items: center;
    /* height: 100%; */
    /* min-height: 20vh; */
    /* padding: 60px 0px; */
    
}


.footer__socials {
    align-self: stretch;
    /* padding-top: 22px; */
}

.socials_line {
    display: flex;
    gap: 49px;
}

address div {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -0.03em;
    margin-bottom: 27px;
    /* text-align: center; */

}

.footer p {
    font-family: "Inter";
    color: #FFFFFF;
    font-weight: 300;
    letter-spacing: -0.03em;
    font-size: 20px;
    line-height: 28px;
}

address {
    font-style: normal;
}

address a {
    text-decoration: none;
}

.tabPhone, .tabMail {
    text-decoration: none;
    font-family: "Inter";
    color: inherit;
    font-weight: 500;
    letter-spacing: -0.03em;
    font-size: 20px;
}

.footer__socials div {
    margin-bottom: 40px;
    text-align: center;
}

.footer__office p {
    width: 226px;
    max-width: 100%;
}

.footer__iquiries p {
    width: 280px;
    max-width: 100%;
}

/* .footer_img { */
    /* max-width: 100%; */
/* } */

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

.footer__company-name {
    display: none;
}

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





                                            /* Other pages */


        /* Page Dynamic */

.dynamic {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px 0px;
    background-image: linear-gradient(to right, #0E0E0E, #246EB9);
}

.dynamic__flex {
    display: flex;
    justify-content: space-between;
    padding: 100px 0px;
}

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

.dynamic__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 500;
    letter-spacing: -0.03em;
    max-width: 620px;
    margin-bottom: 60px;
}

.dynamic__left h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    font-weight: 400;
    letter-spacing: -0.03em;
    margin-bottom: 60px;
}

.dynamic__left p {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 300;
    letter-spacing: -0.03em;
    margin-bottom: 30px;
    max-width: 498px;
}

.dynamic__right {
   align-self: center;
}

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

/* .dynamic .screen__footer { */
    /* flex: none; */
/* } */

/* .dynamic .footer { */
    /* background-color: inherit; */
/* } */





        /* Page Pipeline */

.pipeline {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px 0px;
    background-image: linear-gradient(to right, #0E0E0E, #7D8491);
}

.pipeline__flex {
    display: flex;
    justify-content: space-between;
    padding: 100px 0px;
}

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

.pipeline__right {
    align-self: center;
    display: flex;
    justify-content: flex-end;
}

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

.pipeline__left_top {
    display: flex;
    height: 385px;
    max-height: 100%;
    margin-bottom: 50px;
    /* gap: 100px */
}

.pipeline__left_top1 {
    width: 585px;
    max-width: 100%;
}

.pepeline__left_p1 {
    max-width: 415px;
}

.pepeline__left_p2 {
    max-width: 395px;
}

.pipeline__left_top2 {
    align-self: flex-end;
}

.pipeline__left_bottom {
    display: flex;
    height: 385px;
    max-height: 100%;
    /* gap: 100px */
}

.pipeline__left_bottom2 {
    align-self: flex-end;
}

.pepeline__left_p3 {
    max-width: 415px;
}

.pipeline__left_bottom1 {
    width: 585px;
    max-width: 100%;
}

.pepeline__left_p4 {
    max-width: 385px;
}

.pipeline__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 48px;
    letter-spacing: -0.03em;
    font-weight: 500;
    margin-bottom: 60px;
}

.pipeline__left_top h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    letter-spacing: -0.03em;
    font-weight: 400;
    margin-bottom: 30px;
}

.pipeline__left_bottom h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    letter-spacing: -0.03em;
    font-weight: 400;
    margin-bottom: 30px;
}

.pipeline__left p {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    letter-spacing: -0.03em;
    font-weight: 300;
}


/* .pipeline .screen__footer { */
    /* flex: none; */
/* } */

/* .pipeline .footer { */
    /* background-color: inherit; */
/* } */




        /* Page Envi-service */


.envi-service {
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 50px 0px;
    background-image: linear-gradient(to right, #0E0E0E, #4CB944);
}

.envi-service__flex {
    display: flex;
    justify-content: space-between;
    /* min-height: 100vh; */
    padding: 100px 0px;
}

.envi-service__flex__left {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.envi-service__flex__right {
    align-self: center;
    display: flex;
    justify-content: flex-end;
}

.envi-service__flex__right img {
    max-width: 100%;
}

.envi-service__left_img {
    max-width: 100%;
}

.envi-service__lastblock {
    margin-bottom: 100px;
}

.envi-service__flex__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 48px;
    letter-spacing: -0.03em;
    font-weight: 500;
    margin-bottom: 50px;
}

.envi-service__flex__left h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    letter-spacing: -0.03em;
    font-weight: 400;
    margin-bottom: 20px;
}

.envi-service__flex__left p {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 300;
    letter-spacing: -0.03em;
    max-width: 520px;
    margin-bottom: 40px;
}

/* .envi-service .screen__footer { */
    /* flex: none; */
/* } */

/* .envi-service .footer { */
    /* background-color: inherit; */
/* } */





        /* Page Civil-service */


.civil__service {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px 0px;
    background: linear-gradient(90deg, #0E0E0E 13.54%, #C8C8C8 65.19%, #FBFBFB 81.25%);
}

.civil__service .button_modal {
    color: #0E0E0E;
}

.civil__service__flex {
    display: flex;
    justify-content: space-between;
    min-height: 70vh;
    align-items: center;
    padding: 100px 0px;
}

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

.civil__service__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 48px;
    letter-spacing: -0.03em;
    font-weight: 500;
    margin-bottom: 60px;
}

.civil__service__left h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    font-weight: 400;
    letter-spacing: -0.03em;
    margin-bottom: 22px;
    max-width: 750px;
}

.civil__service__left li {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    font-weight: 300;
    letter-spacing: -0.03em;
    max-width: 520px;
    list-style: disc inside;
    padding-left: 20px;
}

.civil__service__right {
    display: flex;
    justify-content: flex-end;
}

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

/* .civil__service .screen__footer { */
    /* flex: none; */
/* } */

/* .civil__service .footer { */
    /* background-color: inherit; */
/* } */

.civil__service .footer__iquiries div {
    color: #181818;
}

.civil__service .footer__iquiries p {
    color: #181818;
}

.civil__service .logo {
    position: relative;
}

/* .logo_after { */
    /* position: absolute; */
    /* top: 3px; */
    /* left: 53px; */
    /* font-family: "Inter"; */
    /* font-size: 16px; */
    /* color: #FFFFFF; */
    /* display: none; */
/* } */
/*  */
/* .logo_after.active { */
    /* display: block; */
/* } */




        /* Page Oil-service */


.oil-service {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px 0px;
    background-image: linear-gradient(to right, #0E0E0E, #423629);
}

.oil-service__flex {
    display: flex;
    justify-content: space-between;
    min-height: 100vh;
    align-items: center;
    /* padding: 100px 0px; */
}

.oil-service__left h2 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 48px;
    letter-spacing: -0.03em;
    font-weight: 500;
    margin-bottom: 60px;
}

.oil-service__left h3 {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 36px;
    letter-spacing: -0.03em;
    font-weight: 400;
    margin-bottom: 22px;
}

.oil-service__left li {
    font-family: "Inter";
    color: #FFFFFF;
    font-size: 24px;
    letter-spacing: -0.03em;
    font-weight: 300;
    max-width: 520px;
    list-style: disc inside;
    padding-left: 20px;
    margin-bottom: 15px;
}


.oil-service__right {
    display: flex;
    justify-content: flex-end;
}

.oil-service__right img {
    max-width: 100%;
}

/* .oil-service .footer { */
    /* background-color: inherit; */
/* } */








@media only screen and (max-width: 1680px) {
    
    .header__body__brend img {
        max-width: 90%;
    }

    .header__body__brend {
        display: flex;
        justify-content: flex-end;
    }

    .slogan__button a {
        font-size: 18px;
    }

    .header__footer p {
        font-size: 19px;
    }

    




    .services_h2 {
        font-size: 61px;
    }

    .services__body p {
        font-size: 34px;
    }

    .services__body_a {
        font-size: 35px;
    }





    .feauturing__header p {
        font-size: 31px;
    }

    .feauturing__body__left h2 {
        font-size: 90px;
    }

    .fraction__block {
        font-size: 30px;
    }

    .feauturing__footer a {
        font-size: 23px;
        padding: 21px 56px;
    }

    


    .footer__office p {
        width: 226px;
        max-width: 100%;
    }

    

    .footer__iquiries p {
        width: 280px;
        max-width: 100%;
    }




    .dynamic__left h2 {
        font-size: 46px;
    }

    .dynamic__left h3 {
        font-size: 34px;
    }



    

    .envi-service__flex__left h2 {
        font-size: 47px;
    }

    .envi-service__flex__left h3 {
        font-size: 35px;
    }





    .civil__service__left h2 {
        font-size: 47px;
    }

    .civil__service__left h3 {
        font-size: 35px;
    }





    .oil-service__left h2 {
        font-size: 47px;
    }

    .oil-service__left h3 {
        font-size: 35px;
    }
}







@media only screen and (max-width: 1588px) {
    

    .feauturing__body__left h2 {
        font-size: 90px;
    }

    .feauturing__header p {
        font-size: 30px;
    }

    .feauturing__footer a {
        font-size: 22px;
    }

    .feauturing__body__right img {
        max-width: 98%;
    }





    .work__main p {
        font-size: 30px;
    }

    .work__header p {
        font-size: 38px;
    }

    

}





@media only screen and (max-width: 1536px) {
    .header__body__slogan h1 {
        font-size: 68px;
        line-height: 71px;
    }

    .header__body__brend img {
        max-width: 86%;
    }

    .slogan__button a {
        font-size: 16px;
    }

    .header__footer p {
        font-size: 18px;
    }

    .header__body__slogan {
        gap: 40px;
    }





    .aboutUs__content p {
        font-size: 28px;
        line-height: 34px;
        margin-bottom: 45px;
    }


    .aboutUs__content_p1 {
        max-width: 637px;
    }
    
    .aboutUs__content_p2 {
        max-width: 670px;
    }
    
    .aboutUs__content_p3 {
        max-width: 722px;
    }

    .aboutUs__content h2 {
        font-size: 44px;
        margin-bottom: 54px;
    }

    .aboutUs__statistic span {
        font-size: 78px;
        margin-bottom: 11px;
    }

    .aboutUs__statistic p {
        font-size: 20px;
    }

    .statistic__block__img {
        display: flex;
        justify-content: center;
    }

    .statistic__block img {
        max-width: 81%;
        margin-bottom: 25px;
    }

    .statistic__block_column1 {
        gap: 80px;
    }

    .statistic__block_column2 {
        gap: 80px;
    }






    .services_h2 {
        font-size: 56px;
    }

    .services__body p {
        font-size: 32px;
    }

    .services__body_a {
        font-size: 32px;
    }

    






    .feauturing__header p {
        font-size: 28px;
    }

    .feauturing__body__left h2 {
        font-size: 80px;
    }

    .fraction__block {
        font-size: 28px;
    }

    .feauturing__footer a {
        font-size: 20px;
        padding: 20px 54px;
    }

    .feauturing__body__right {
        display: flex;
        justify-content: flex-end;
    }

    .feauturing__body__right img {
        max-width: 85%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 86%;
    }

    .environment .feauturing__body__right img {
        max-width: 83%;
    }

    .civil .feauturing__body__right img {
        max-width: 82%;
    }

    .oil .feauturing__body__right img {
        max-width: 86%;
    }

    







    .map__header {
        font-size: 56px;
    }

    .map__footer p {
        font-size: 36px;
    }






    .work__header h2 {
        font-size: 56px;
    }

    .work__header p {
        font-size: 34px;
    }

    .work__main p {
        font-size: 28px;
        max-width: 375px;
    }

    




    .footer__office p {
        width: 226px;
        max-width: 100%;
    }

    address div {
        font-size: 22px;
        /* margin-bottom: 10px; */
    }

    .footer p {
        font-size: 18px;
        line-height: 26px;
    }

    .tabPhone, .tabMail {
        font-size: 18px;
    }

    .footer__iquiries p {
        width: 260px;
        max-width: 100%;
    }

    






    .dynamic__left h2 {
        font-size: 44px;
    }

    .dynamic__left h3 {
        font-size: 33px;
    }

    .dynamic__left p {
        font-size: 22px;
    }





    .pipeline__left h2 {
        font-size: 44px;
    }

    .pipeline__left_top h3 {
        font-size: 33px;
    }

    .pipeline__left_bottom h3 {
        font-size: 33px;
    }


    .pipeline__left p {
        font-size: 22px;
    }





    

    .envi-service__flex__left h2 {
        font-size: 44px;
    }

    .envi-service__flex__left h3 {
        font-size: 32px;
    }

    .envi-service__flex__left p {
        font-size: 22px;
    }






    .civil__service__left h2 {
        font-size: 44px;
    }

    .civil__service__left h3 {
        font-size: 32px;
    }

    .civil__service__left li {
        font-size: 22px;
    }








    .oil-service__left h2 {
        font-size: 44px;
    }

    .oil-service__left h3 {
        font-size: 32px;
    }

    .oil-service__left li {
        font-size: 22px;
    }

    .oil-service__right img {
        max-width: 87%;
    }

    .oil-service__flex {
        /* padding: 0px 0px; */
    }

    
}


@media only screen and (max-width: 1500px) {
    .header__body__brend {
        display: flex;
        justify-content: flex-end;
    }

    .header__body__slogan h1 {
        font-size: 75px;
    }

    .header__body__brend img {
        max-width: 94%;
    }
}


@media only screen and (max-width: 1440px) {

    /* .header__nav img { */
        /* max-width: 11%; */
        /* align-self: flex-end; */
    /* } */

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

    .logo {
        width: 132px;
        max-width: 100%;
    }

    .nav__list a {
        font-size: 15px;
    }

    .header_button {
        font-size: 17px;
    }

    .header__body__slogan h1 {
        font-size: 62px;
        line-height: 66px;
    }

    .slogan__button_left {
        padding: 17px 40px;
    }

    .slogan__button_right {
        padding: 17px 76px 17px 83px;
    }
    
    .header__body__brend img {
        max-width: 79%;
    }

    .header__footer p {
        font-size: 16px;
    }

    .slogan__button a {
        font-size: 16px;
    }

    .header__footer__right img {
        max-width: 13%;
    }

    .header__flex {
        padding: 60px 0px;
    }

    

    

    

    



    .aboutUs__content h2 {
        font-size: 40px;
        margin-bottom: 30px;
        /* padding-bottom: 74px; */
    }

    .aboutUs__content p {
        font-size: 24px;
        margin-bottom: 30px;
        /* line-height: 30px; */
    }
    
    .aboutUs__statistic span {
        font-size: 67px;
        margin-bottom: 9px;
    }

    .aboutUs__statistic p {
        font-size: 17px;
    }

    .statistic__block img {
        max-width: 76%;
        margin-bottom: 21px;
    }

    .statistic__block_column1 {
        gap: 70px;
    }

    .statistic__block_column2 {
        gap: 70px;
    }

    .aboutUs__content_p1 {
        max-width: 546px;
    }
    
    .aboutUs__content_p2 {
        max-width: 580px;
    }
    
    .aboutUs__content_p3 {
        max-width: 632px;
    }











    .services_h2 {
        font-size: 50px;
    }

    .services__body p {
        font-size: 28px;
    }

    .services__body_a {
        font-size: 28px;
    }




    .feauturing__header p {
        font-size: 26px;
    }

    .feauturing__body__left h2 {
        font-size: 70px;
    }

    .feauturing__body__left img {
        max-width: 48%;
    }

    .fraction__block {
        font-size: 26px;
    }

    .feauturing__footer a {
        font-size: 19px;
        padding: 19px 50px;
    }



    .feauturing__body__right img {
        max-width: 78%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 71%;
    }

    .environment .feauturing__body__right img {
        max-width: 80%;
    }

    .civil .feauturing__body__right img {
        max-width: 77%;
    }

    .oil .feauturing__body__right img {
        max-width: 80%;
    }




    .map__header {
        font-size: 50px;
    }

    .map__footer p {
        font-size: 32px;
    }




    .work__header h2 {
        font-size: 48px;
    }

    .work__header p {
        font-size: 31px;
    }

    .work__main p {
        font-size: 24px;
        max-width: 419px;
    }

    




    .footer__socials {
        align-self: flex-start;
        padding-top: 0px;
    }

    .footer__logo img {
        max-width: 92%;
    }

    address div {
        font-size: 21px;
    }

    .footer p {
        font-size: 17px;
        line-height: 24px;
    }

    .tabPhone, .tabMail {
        font-size: 17px;
    }

    .footer__office p {
        width: 194px;
        max-width: 100%;
    }

    .footer__iquiries p {
        width: 240px;
        max-width: 100%;
    }




    



    .dynamic__left h2 {
        font-size: 40px;
    }

    .dynamic__left h3 {
        font-size: 28px;
    }

    .dynamic__left p {
        font-size: 20px;
    }

    .dynamic__right img {
        max-width: 85%;
    }

    .dynamic__right {
        display: flex;
        justify-content: flex-end;
    }




    .pipeline__left h2 {
        font-size: 40px;
    }

    .pipeline__left_top h3 {
        font-size: 28px;
    }

    .pipeline__left_bottom h3 {
        font-size: 28px;
    }

    .pipeline__left p {
        font-size: 20px;
    }

    .pipeline__left_top1 {
        width: 465px;
        max-width: 100%;
    }

    .pipeline__left_top {
        height: 300px;
        max-height: 100%;
    }

    .pipeline__left_bottom1 {
        width: 465px;
        max-width: 100%;
    }

    .pipeline__left_bottom {
        height: 310px;
        max-height: 100%;
    }

    .pipeline__right img {
        max-width: 85%;
    }




    .envi-service__flex__left h2 {
        font-size: 40px;
    }

    .envi-service__flex__left h3 {
        font-size: 28px;
    }

    .envi-service__flex__left p {
        font-size: 20px;
    }

    .envi-service__flex__right img {
        max-width: 85%;
    }




    .civil__service__left h2 {
        font-size: 40px;
    }

    .civil__service__left h3 {
        font-size: 28px;
    }

    .civil__service__left li {
        font-size: 20px;
    }

    .civil__service__right img {
        max-width: 85%;
    }






    .oil-service__left h2 {
        font-size: 40px;
    }

    .oil-service__left h3 {
        font-size: 28px;
    }

    .oil-service__left li {
        font-size: 20px;
    }

    .oil-service__right img {
        max-width: 85%;
    }
}




@media only screen and (max-width: 1366px) {

    .container {
    padding: 0px 80px;
    }

    .modal__container {
        padding: 0px 80px;
    }

    .header__flex {
        padding: 50px 0px;
    }




    /* .header__nav img { */
        /* max-width: 10%; */
    /* } */

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

    .logo {
        width: 117px;
    }

    .logo__block {
        /* display: flex; */
        align-self: end;
    }

    .nav__list a {
        font-size: 14px;
    }

    .header_button {
        font-size: 15px;
        padding: 13px 22px;
    }

    .header__body__slogan h1 {
        font-size: 54px;
        line-height: 60px;
    }

    .header__body__slogan {
        gap: 20px;
    }

    .slogan__button a {
        font-size: 14px;
    }

    .header__body__brend img {
        max-width: 65%;
    }

    .slogan__button_left {
        padding: 14px 32px;
        border-radius: 10px;
    }

    .slogan__button_right {
        padding: 14px 65px;
        border-radius: 10px;
    }

    .header__footer__right img {
        max-width: 13%;
    }

    

    

    .header__footer {
        /* padding-bottom: 33px; */
    }

    .header__footer p {
        font-size: 16px;
    }

    




    .aboutUs__content h2 {
        font-size: 36px;
    }

    .aboutUs__content p {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 40px;
    }

    .aboutUs__statistic span {
        font-size: 59px;
    }

    .aboutUs__statistic p {
        font-size: 15px;
    }

    .statistic__block img {
        max-width: 62%;
        margin-bottom: 19px;
    }

    .statistic__block_column1{
        gap: 65px;
    }

    .statistic__block_column2{
        gap: 65px;
    }

    .aboutUs__content_p1 {
        max-width: 455px;
    }
    
    .aboutUs__content_p2 {
        max-width: 480px;
    }
    
    .aboutUs__content_p3 {
        max-width: 525px;
    }





    .services_h2 {
        font-size: 44px;
    }

    .services__body p {
        font-size: 24px;
        max-width: 950px;
    }

    .services__body_a {
        font-size: 24px;
    }




    .feauturing__header p {
        font-size: 24px;
    }

    .feauturing__body__left h2 {
        font-size: 60px;
    }

    .fraction__block {
        font-size: 24px;
    }

    .feauturing__footer a {
        font-size: 17px;
        padding: 15px 39px;
        border-radius: 10px;
    }

    .feauturing__body__right img {
        max-width: 73%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 72%;
    }

    .environment .feauturing__body__right img {
        max-width: 74%;
    }

    .civil .feauturing__body__right img {
        max-width: 70%;
    }

    .oil .feauturing__body__right img {
        max-width: 64%;
    }





    .dynamic__left h2 {
        font-size: 36px;
    }

    .dynamic__left h3 {
        font-size: 24px;
    }

    .dynamic__right img {
        max-width: 80%;
    }

    .dynamic__left h3 {
        margin-bottom: 45px;
    }

    .dynamic__left p:nth-child(5) {
        margin-bottom: 45px;
    }





    .pipeline__left h2 {
        font-size: 36px;
    }

    .pipeline__left_top h3 {
        font-size: 24px;
    }

    .pipeline__left_bottom h3 {
        font-size: 24px;
    }

    .pipeline__right img {
        max-width: 80%;
    }



    


    .envi-service__flex__left h2 {
        font-size: 36px;
    }

    .envi-service__flex__left h3 {
        font-size: 24px;
    }

    .envi-service__flex__left p {
        font-size: 20px;
    }

    .envi-service__flex__right img {
        max-width: 80%;
    }




    .civil__service__left h2 {
        font-size: 36px;
    }

    .civil__service__left h3 {
        font-size: 24px;
    }

    .civil__service__left li {
        font-size: 20px;
    }

    .civil__service__right img {
        max-width: 80%;
    }

    .civil__service__flex {
        padding: 50px 0px;
    }








    .oil-service__left h2 {
        font-size: 36px;
    }

    .oil-service__left h3 {
        font-size: 24px;
    }

    .oil-service__left li {
        font-size: 20px;
    }

    .oil-service__right img {
        max-width: 80%;
    }


    .map__header {
        font-size: 50px;
    }

    .map__footer p {
        font-size: 24px;
    }



    .work__header h2 {
        font-size: 44px;
    }

    .work__header p {
        font-size: 28px;
    }

    .work__main p {
        font-size: 22px;
        max-width: 367px;
    }

    

    


    address div {
        font-size: 20px;
    }

    .footer p {
        font-size: 16px;
        line-height: 23px;
    }

    .tabPhone, .tabMail {
        font-size: 16px;
    }

    .footer__office p {
        width: 182px;
        max-width: 100%;
    }

    .footer__office div {
        margin-bottom: 15px;
    }

    .footer__iquiries p {
        width: 225px;
        max-width: 100%;
    }

    .footer__socials div {
        margin-bottom: 25px;
    }

    .footer__iquiries div {
        margin-bottom: 15px;
    }

    
}


@media only screen and (max-width: 1280px) {

    .feauturing__body__right img {
        max-width: 70%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 63%;
    }

    .environment .feauturing__body__right img {
        max-width: 68%;
    }

    .civil .feauturing__body__right img {
        max-width: 68%;
    }

    .oil .feauturing__body__right img {
        max-width: 60%;
    }







    
    .dynamic__right img {
        max-width: 70%;
    }



    .pipeline__right img {
        max-width: 70%;
    }



    .envi-service__flex__right img {
        max-width: 70%;
    }



    .oil-service__right img {
        max-width: 70%;
    }

}





@media only screen and (max-width: 1148px) {
    


    .pipeline__right {
        display: none;
    }

    .pipeline {
        background-image: none;
        background-color: #7E8491;
    }

    .pipeline__flex {
        justify-content: center;
    }



    .envi-service__flex__right {
        display: none;
    }

    .envi-service__flex {
        justify-content: center;
    }

    .envi-service {
        background-image: none;
        background-color: #4CB944;
    }




    .civil__service__right {
        display: none;
    }

    .civil__service__flex {
        justify-content: center;
    }

    .civil__service {
        background-image: none;
        background-color: #FFFFFF;
    }
    
    .civil__service__left h2 {
        color: #181818;
        padding-top: 30px;
    }

    .civil__service__left h3 {
        color: #181818;
    }

    .civil__service__left li {
        color: #181818;
    }

    .civil__service__left {
        align-self: flex-start;
    }

    .civil__service .nav__list a {
        color: #181818;
    }

    .civil__service address div {
        color: #181818;
    }

    .civil__service .footer p {
        color: #181818;
    }

    .civil__service .logo img {
        max-width: 100%;
    }

}




@media only screen and (max-width: 1126px) {
    /* .aboutUs__content p { */
        /* font-size: 22px; */
    /* } */

    /* .aboutUs__content h2 { */
        /* font-size: 39px; */
        /* padding-bottom: 64px; */
    /* } */

    /* .aboutUs__statistic span { */
        /* font-size: 64px; */
    /* } */

    /* .aboutUs__statistic p { */
        /* font-size: 16px; */
    /* } */

    /* .feauturing__header p { */
        /* font-size: 24px; */
    /* } */

    /* .feauturing__body__left h2 { */
        /* font-size: 69px; */
    /* } */

    .feauturing__body__left img {
        max-width: 55%;
    }

    
    /* .feauturing__footer p { */
        /* font-size: 23px; */
    /* } */
}

@media only screen and (max-width: 1084px) {
    
    .header__body__slogan h1 {
        font-size: 53px;
    } 





    


}

@media only screen and (max-width: 1051px) {
    
    .work__main p {
        font-size: 20px;
        max-width: 310px;
    }

    .aboutUs__statistic {
        gap: 30px;
    }

    .statistic__block_column1 {
        gap: 51px;
    }

    .statistic__block_column2 {
        gap: 51px;
    }

}





@media only screen and (max-width: 1024px) {

    .header__flex {
        padding: 60px 0px;
    }

    /* .header__nav img { */
        /* max-width: 11%; */
    /* } */

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

    .logo {
        width: 96px;
    }

    .nav__list a {
        font-size: 14px;
    }

    .header_button {
        font-size: 13px;
        padding: 11px 18px;
    }

    .header__body__slogan h1 {
        font-size: 42px;
        line-height: 47px;
    }

    .slogan__button a {
        font-size: 11px;
    }

    .slogan__button_left {
        padding: 12px 26px;
    }

    .slogan__button_right {
        padding: 12px 50px;
    }

    .header__body__brend img {
        max-width: 52%;
    }

    .header__footer p {
        font-size: 14px;
    }

    
    

    

    

    
    .aboutUs__content h2 {
        font-size: 32px;
        margin-bottom: 30px;
    }

    .aboutUs__content p {
        font-size: 16px;
        margin-bottom: 30px;
        line-height: 20px;
    }

    .aboutUs__statistic span {
        font-size: 50px;
        margin-bottom: 7px;
    }

    .aboutUs__statistic p {
        font-size: 13px;
    }

    .statistic__block img {
        max-width: 52%;
        margin-bottom: 15px;
    }

    .aboutUs__content_p1 {
        max-width: 365px;
    }
    
    .aboutUs__content_p2 {
        max-width: 385px;
    }
    
    .aboutUs__content_p3 {
        max-width: 410px;
    }




    .services_h2 {
        font-size: 34px;
    }

    .services__body p {
        font-size: 20px;
    }

    .services__body_a {
        font-size: 20px;
    }




    .feauturing__header p {
        font-size: 20px;
    }

    .feauturing__body__left h2 {
        font-size: 48px;
    }

    .fraction__block {
        font-size: 20px;
    }

    .feauturing__footer a {
        font-size: 12px;
        padding: 11px 29px;
        border-radius: 7px;
    } 

    .feauturing__body__right img {
        max-width: 51%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 48%;
    }

    .environment .feauturing__body__right img {
        max-width: 52%;
    }

    .civil .feauturing__body__right img {
        max-width: 51%;
    }

    .oil .feauturing__body__right img {
        max-width: 51%;
    }







    .map__header {
        font-size: 40px;
    }

    .map__footer p {
        font-size: 20px;
    }





    .work__header h2 {
        font-size: 40px;
    }

    .work__header p {
        font-size: 24px;
    }

    .work__main p {
        font-size: 20px;
        /* max-width: 495px; */
    }









    address div {
        font-size: 16px;
    }

    .footer__socials div {
        margin-bottom: 25px;
    }

    /* .footer__socials img { */
        /* max-width: 83%; */
    /* } */

    .civil__service .footer__socials img {
        max-width: 100%;
    }

    .footer p {
        font-size: 14px;
        line-height: 20px;
    }

    .tabPhone, .tabMail {
        font-size: 14px;
    }

    .footer__logo img {
        max-width: 68%;
    }

    .footer__office p {
        width: 160px;
        max-width: 100%;
    }

    .footer__office div {
        margin-bottom: 10px;
    }

    .footer__socials div {
        margin-bottom: 15px;
    }

    .footer__iquiries p {
        width: 197px;
        max-width: 100%;
    }

    .footer__iquiries div {
        margin-bottom: 10px;
    }

    .socials_line {
        justify-content: center;
        gap: 42px;
    }







    
    .dynamic__left h2 {
        font-size: 32px;
    }

    .dynamic__left h3 {
        font-size: 22px;
    }

    .dynamic__left p {
        font-size: 18px;
    }


 




    .pipeline__left h2 {
        font-size: 32px;
    }

    .pipeline__left_top h3 {
        font-size: 20px;
    }

    .pipeline__left_bottom h3 {
        font-size: 20px;
    }

    .pipeline__left p {
        font-size: 18px;
    }

    .pipeline__left_top1 {
        width: 320px;
        max-width: 100%;
    }

    .pipeline__left_top2 {
        width: 270px;
        max-width: 100%;
    }

    .pipeline__left_top {
        height: 250px;
        max-height: 100%;
    }

    .pipeline__left_bottom1 {
        width: 310px;
        max-width: 100%;
    }

    .pipeline__left_bottom2 {
        width: 270px;
        max-width: 100%;
    }

    .pipeline__left_bottom {
        height: 275px;
        max-height: 100%;
    }

    .pipeline__flex {
        /* padding: 0px 0px; */
    }






    .envi-service__flex__left h2 {
        font-size: 32px;
    }

    .envi-service__flex__left h3 {
        font-size: 20px;
        margin-bottom: 15px;
    }

    .envi-service__flex__left p {
        font-size: 18px;
    }

    .envi-service__lastblock {
        margin-bottom: 35px;
    }





    .civil__service__left h2 {
        font-size: 42px;
    }

    .civil__service__left h3 {
        font-size: 30px;
    }





    .oil-service__left h2 {
        font-size: 32px;
    }

    .oil-service__left h3 {
        font-size: 20px;
    }

    .oil-service__left li {
        font-size: 18px;
    }

    .oil-service__right img {
        max-width: 55%;
    }
}





@media only screen and (max-width: 960px) {

    .aboutUs__statistic{
        gap: 10px;
    }

    



  
  
    .dynamic {
        background-image: none;
        background-color: #246EB9;
    }

    .dynamic__right {
        display: none;
    }





    .civil__service__left h2 {
        font-size: 40px;
    }

    .civil__service__left h3 {
        font-size: 28px;
    }




    .footer__socials img {
        max-width: 74%;
    }

    .socials_line {
        gap: 23px;
    }
}




@media only screen and (max-width: 865px) {



    .work__header h2 {
        font-size: 32px;
    }

    .work__header p {
        font-size: 20px;
    }

    .work__main p {
        font-size: 16px;
        max-width: 232px;
    }




    

}




@media only screen and (max-width: 800px) {

    .container {
        padding: 0px 50px;
    }

    .modal__container {
        padding: 0px 50px;
    }

    .header__flex {
        padding: 50px 0px;
    }

    /* .header__nav img { */
        /* max-width: 13%; */
    /* } */

    .header__nav {
        align-items: flex-end;
    }

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

    .logo {
        width: 100px;
    }

    .nav__list a {
        font-size: 13px;
    }

    .nav__list {
        gap: 18px;
    }

    .header_button {
        font-size: 12px;
        padding: 11px 18px;
        border-radius: 5px;
    }

    .header__body__slogan h1 {
        font-size: 38px;
        line-height: 40px;
    }

    .slogan__button a {
        font-size: 10px;
    }

    .slogan__button_left {
        padding: 11px 24px;
        border-radius: 8px;
        margin-right: 5px;
    }

    .slogan__button_right {
        padding: 11px 46px;
        border-radius: 8px;
    }

    .header__body__slogan {
        gap: 16px;
    }

    .header__body__brend img {
        max-width: 66%;
    }

    .header__footer p {
        font-size: 12px;
    }

    



    
   

       

    


    .aboutUs__content h2 {
        font-size: 28px;
        margin-bottom: 18px;
    }

    .aboutUs__content p {
        font-size: 14px;
        line-height: 17px;
        margin-bottom: 34px;
    }

    .aboutUs__statistic span {
        font-size: 43px;
        margin-bottom: 6px;
    }

    .aboutUs__statistic p {
        font-size: 11px;
    }

    .statistic__block img {
        max-width: 45%;
        margin-bottom: 13px;
    }

    .statistic__block_column1 {
        gap: 45px;
    }

    .statistic__block_column2 {
        gap: 45px;
    }

    .aboutUs__content_p1 {
        max-width: 320px;
    }
    
    .aboutUs__content_p2 {
        max-width: 335px;
    }
    
    .aboutUs__content_p3 {
        max-width: 360px;
    }







    .services_h2 {
        font-size: 28px;
    }

    .services__body p {
        font-size: 18px;
    }

    .services__body_a {
        font-size: 18px;
    }




    .feauturing__header p {
        font-size: 16px;
    }

    .feauturing__body__left h2 {
        font-size: 40px;
    }

    .fraction__block {
        font-size: 16px;
    }

    .feauturing__footer a {
        font-size: 11px;
        padding: 10px 26px;
    }

    .feauturing__body__left img {
        max-width: 45%;
    }

    .feauturing__body__right img {
        max-width: 44%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 41%;
    }

    .environment .feauturing__body__right img {
        max-width: 44%;
    }

    .civil .feauturing__body__right img {
        max-width: 42%;
    }

    .oil .feauturing__body__right img {
        max-width: 43%;
    }









    .map__header {
        font-size: 32px;
    }

    .map__footer {
        font-size: 16px;
    }




    .work__header h2 {
        font-size: 32px;
    }

    .work__header p {
        font-size: 20px;
    }

    .work__main p {
        font-size: 16px;
    }

    




    address div {
        font-size: 12px;
    }

    .footer p {
        font-size: 10px;
        line-height: 14.5px;
    }

    .tabPhone, .tabMail {
        font-size: 10px;
    }

    .socials_line {
        gap: 29px;
        justify-content: center;
    }

    .footer__socials div {
        margin-bottom: 15px;
    }

    .footer__logo img {
        max-width: 54%;
    }

    .footer__office p {
        width: 116px;
        max-width: 100%;
    }

    .footer__office div {
        margin-bottom: 10px;
    }

    .footer__iquiries p {
        width: 141px;
        max-width: 100%;
    }

    .footer__iquiries div {
        margin-bottom: 10px;
    }

    /* .footer__socials img { */
        /* max-width: 17%; */
        /* aspect-ratio: 3/3; */
    /* } */




    .dynamic__left h2 {
        font-size: 28px;
    }

    .dynamic__left h3 {
        font-size: 18px;
    }

    .dynamic__left p {
        font-size: 16px;
    }





    .pipeline__left_bottom {
        flex-direction: column;
        gap: 0px;
        height: auto;
    }

    .pipeline__left_top {
        flex-direction: column;
        gap: 0px;
        height: auto;
    }

    .pipeline__left_top2 {
        align-self: stretch;
    }

    .pipeline__left_bottom2 {
        align-self: stretch;
    }

    .pipeline__left h2 {
        font-size: 28px;
    }

    .pipeline__left h3 {
        font-size: 18px;
    }

    .pipeline__left p {
        font-size: 16px;
    }

    .pepeline__left_p1 {
        margin-bottom: 10px;
    }

    .pepeline__left_p3 {
        margin-bottom: 10px;
    }




    .envi-service__flex__left h2 {
        font-size: 28px;
    }

    .envi-service__flex__left h3 {
        font-size: 18px;
    }

    .envi-service__flex__left p {
        font-size: 16px;
    }




    .oil-service__right {
        display: none;
    }

    .oil-service__flex {
        justify-content: center;
    }

    .oil-service {
        background-image: none;
        background-color: #423629;
    }


    .oil-service__left h2 {
        font-size: 28px;
    }

    .oil-service__left h3 {
        font-size: 18px;
    }

    .oil-service__left li {
        font-size: 16px;
    }


}





@media only screen and (max-width: 744px) {

    .modal__container {
        padding: 0px 0px;
        justify-content: center;
    }

    .header__flex {
        padding: 0px 0px;
        justify-content: space-around;
    }


    
    .nav {
        display: flex;
        width: 100%;
        height: 100%;
        top: 0;
        left: -100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        background-color: #121212;
        transition: left .5s ease-in;
        margin: 0;
        padding: 0;
        padding-top: 80px;
    }

       .nav_active {
        left: 0%;
    }

    .burger {
        display: inline-block;
        z-index: 5;
        justify-items: flex-end;
    }

    .line {
        width: 35px;
    }

    .header__nav {
        display: flex;
        justify-content: space-between;
        align-items: center;
        /* padding-top: 60px; */
    }

    /* .header__nav img { */
        /* max-width: 19%; */
    /* } */

    .header__footer p {
        font-size: 14px;
    }


    .nav__list {
        flex-direction: column;
        align-items: center;
        gap: 60px;
        padding-top: 30px;
        margin-bottom: 60px;
    }

    .nav__list a {
        font-size: 24px;
        cursor: default;
    }

    .logo {
        position: relative;
        z-index: 5;
    }

    .main-logo img {
        position: relative;
        z-index: 5;
    }

    .logo {
        width: 120px;
    }

    .header_button {
        display: none;
    }

     .header_button_mobile {
        display: block;
        cursor: default;
    }

    .slogan__button_left {
        padding: 14px 28px;
        border-radius: 9px;
        margin-right: 10px;
        cursor: default;
    }

    .slogan__button_right {
        padding: 14px 50px;
        border-radius: 9px;
        cursor: default;
    }

    .header__body__slogan {
        gap: 25px;
    }

    .header__body__brend img {
        max-width: 60%;
    }

    .header__body {
        flex-direction: column-reverse;
        align-items: center;
        justify-content: center;
        gap: 60px;
    }

    .header__body__brend {
        justify-content: center;
    }

    .header__body__slogan h1 {
        font-size: 48px;
        text-align: center;
        line-height: 51px;
    }

    .slogan__button {
        text-align: center;
    }

    .slogan__button a {
        font-size: 12px;
    }

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

    .logo {
        cursor: default;
    }

    .modal_close {
        cursor: default;
    }

    .form_button {
        cursor: default;
    }

    .form_button {
        width: 200px;
        /* padding: 18px 74px; */
    }






    .aboutUs__content h2 {
        display: none;
    }

    .flex__h2 {
        display: block;
        font-size: 44px;
    }

    .flex {
        display: flex;
        flex-direction: column-reverse;
        justify-content: space-evenly;
    }

    .statistic__block_column1 {
        gap: 70px;
    }

    .statistic__block_column2 {
        gap: 70px;
    }

    .statistic__block div {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .aboutUs__content p {
        font-size: 20px;
        margin-bottom: 18px;
        text-align: center;
        line-height: 24px;
    }

    .aboutUs__statistic span {
        font-size: 69px;
    }

    .aboutUs__statistic {
        gap: 60px;
    }

    .aboutUs__statistic p {
        font-size: 17px;
    }

    .statistic__block img {
        max-width: 73%;
        margin-bottom: 18px;
    }

    .aboutUs__content_p1 {
        max-width: 527px;
    }
    
    .aboutUs__content_p2 {
        max-width: 527px;
    }
    
    .aboutUs__content_p3 {
        max-width: 526px;
    }






    

    .services__body {
        gap: 0px;
        height: 76%;
    }

    .services__flex {
        justify-content: space-evenly;
    }
    
    .services_h2 {
        font-size: 44px;
    }

    .services__body p {
        font-size: 21px;
        max-width: 520px;
        margin-bottom: 0px;
    }

    .services__body_a {
        font-size: 28px;
        
    }  

    .services__body__footer {
        height: 100%;
        justify-content: space-evenly;
    }

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

    .services__footer {
        display: none;
    }




   

    .feauturing__body {
        flex-direction: column-reverse;
        gap: 0px;
        /* gap: 145px; */
        height: 53%;
    }

    .feauturing__body.gap_change {
        height: 60%;
    }

    .button_fulscreen {
        display: none;
    }

    .feauturing__footer {
        justify-content: center;
    }

    .featuring_button_flex {
        display: flex;
        /* justify-content: flex-start; */
    }

    .button_mobile {
        display: block;
        align-self: flex-start;
        font-size: 19px;
        padding: 14px 41px;
        border-radius: 12px;
    }

    .feauturing__body__right {
        justify-content: center;
    }

    .feauturing__body__right img {
        max-width: 75%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 73%;
    }

    .environment .feauturing__body__right img {
        max-width: 73%;
    }

    .civil .feauturing__body__right img {
        max-width: 68%;
    }

    .oil .feauturing__body__right img {
        max-width: 66%;
    }

    .feauturing__body__left {
        display: flex;
        flex-direction: column;
        align-self: flex-start;
    }

    .feauturing__body__left img {
        max-width: 48%;
    }

    .fraction__block {
        font-size: 22px;
    }

    .feauturing__body__left h2 {
        font-size: 50px;
    }

    .feauturing__footer p {
        font-size: 22px;
    }

    .fraction__flex {
        width: 100vw;
        justify-content: center;
    }

   



    .map__header {
        font-size: 44px;
        text-align: center;
    }

    .svg {
        display: none;
    }

    .map-mobile__block {
        /* display: -webkit-box-; */
        /* display: -ms-flexbox; */
        display: flex;
        gap: 15px;
        width: 485px;
        max-width: 100%;
        flex-wrap: wrap;

        
        justify-content: center;
    }

    .map__footer {
        display: none;
    }
    
    .map-mobile__footer {
        display: block;
        text-align: center;
        margin: 0 auto;
    }

    .map-mobile__footer p {
        font-family: 'Inter';
        font-weight: 300;
        font-size: 22px;
        color: #FFFFFF;
        max-width: 500px;

    }

    .map-mobile__footer span {
        font-weight: 500;
    }

    .modal__mobile_flex {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }





    .work__main {
        flex-direction: column-reverse;
        height: 63%;
    }

    .work__grid {
        /* min-height: 100vh; */
    }

    .work__header h2 {
        font-size: 44px;
    }

    .work__header p {
        font-size: 26px;
    }
/*  */
    .work__main p {
        font-size: 26px;
        text-align: center;
        max-width: 468px;
        /* text-align: justify; */
    }

    .work__images__block {
        /* background-color: #000000; */
       /* mix-blend-mode: color-burn; */
    }





    .footer {
        /* padding: 0px 0px; */
    }


    .footer__grid {
        grid-template-columns: auto auto;
        justify-content: center;
        align-items: center;
        column-gap: 70px;
        row-gap: 50px;
        /* gap: 50px; */
        /* padding-bottom: 40px; */
        grid-template-areas:
            "logo logo"
            "office inquiries"
            "social social"
    }

    .footer__logo {
        grid-area: logo;
        padding-right: 25px;
        /* align-self: center; */
        display: flex;
        justify-content: center;
    }


    .footer__office {
        grid-area: office;
        /* align-self: center; */
    }

    .footer__iquiries {
        grid-area: inquiries;
    }

    .footer__socials {
        grid-area: social;
        padding-right: 30px;

        /* text-align: center; */
    }

    .footer__socials img {
        max-width: 100%;
        cursor: default;
    }

    address div {
        font-size: 24px;
        text-align: center;
    }

    .footer p {
        font-size: 20px;
        text-align: center;
        line-height: 28px;
        /* width: 450px; */
    }

    .tabPhone, .tabMail {
        font-size: 20px;
        cursor: default;
    }

    .socials_line {
        gap: 50px;
    }

    .footer__iquiries p {
        width: 300px;
        max-width: 100%;
    }

    .footer__office p {
        width: 300px;
        max-width: 100%;
    }





    .dynamic__left h2 {
        font-size: 44px;
    }

    .dynamic__left h3 {
        font-size: 32px;
        margin-bottom: 38px;
    }

    .dynamic__left p {
        font-size: 22px;
    }

    




    .pipeline__left h2 {
        font-size: 44px;
    }

    .pipeline__left h3 {
        font-size: 32px;
    }

    .pipeline__left p {
        font-size: 22px;
    }

    .pipeline__left_top1 {
        width: 470px;
        max-width: 100%;
    }

    .pipeline__left_top2 {
        width: 470px;
        max-width: 100%;
    }

    .pipeline__left_bottom1 {
        width: 470px;
        max-width: 100%;
    }

    .pipeline__left_bottom2 {
        width: 470px;
        max-width: 100%;
    }

    .pepeline__left_p1 {
        margin-bottom: 45px;
    }

    .pepeline__left_p3 {
        margin-bottom: 45px;
    }





    .envi-service__flex__left h2 {
        font-size: 44px;
    }

    .envi-service__flex__left h3 {
        font-size: 32px;
    }

    .envi-service__flex__left p {
        font-size: 22px;
    }




    .oil-service__left h2 {
        font-size: 44px;
    }

    .oil-service__left h3 {
        font-size: 32px;
    }

    .oil-service__left li {
        font-size: 22px;
    }




    .civil__service .line1 {
        background-color: #181818;
    }

    .civil__service .line2 {
        background-color: #181818;
    }

    .civil__service .line3 {
        background-color: #181818;
    }

    .civil__service .nav.nav_active .nav__list a {
        color: #FFFFFF;
    }

    .civil__service .nav.nav_active .button_modal {
        color: #FFFFFF;
    }

    .burger.toggle .line1 {
        background-color: #FFFFFF;
    }

    .burger.toggle .line2 {
        background-color: #FFFFFF;
    }

    .burger.toggle .line3 {
        background-color: #FFFFFF;
    }



    /* .logo:after { */
        /* position: absolute; */
        /* content: "Ynanch"; */
    /* } */
/*  */
    /* .logo:after { */
        /* position: absolute; */
        /* content: "HYZMAT"; */
    /* } */

}


@media only screen and (max-width: 744px) and (max-height: 940px) {

    /* .map-mobile_img { */
        /* width: 200px; */
        /* max-width: 38%; */
    /* } */

}

@media only screen and (max-width: 744px) and (max-height: 765px) {

    /* .map-mobile_img { */
        /* width: 200px; */
        /* max-width: 32%; */
    /* } */

}

@media only screen and (max-width: 744px) and (max-height: 670px) {

    /* .map-mobile_img { */
        /* width: 200px; */
        /* max-width: 30%; */
    /* } */

}







@media only screen and (max-width: 390px) and (max-height: 840px) {
    .feauturing__body {
        /* gap: 64px; */
    }
}



@media only screen and (max-width: 700px) {
    .footer__grid {
        column-gap: 0px;
    }

    .header__body__slogan h1 {
        font-size: 42px;
    }
}



@media only screen and (max-width: 626px) {


    .civil__service__left h2 {
        font-size: 38px;
    }

    .civil__service__left h3 {
        font-size: 26px;
    }

}


@media only screen and (max-width: 600px) {


    .container {
        padding: 0px 40px;
    }

    .header__body__slogan h1 {
        font-size: 40px;
        line-height: 45px;
    }

    .slogan__button a {
        font-size: 11px;
    }

    .header__body__brend img {
        max-width: 54%;
    }

    .nav__list a {
        font-size: 20px;
    }

    .nav__list {
        gap: 45px;
    }



    .flex__h2 {
        font-size: 36px;
    }

    .aboutUs__statistic span {
        font-size: 59px;
    }

    .aboutUs__statistic p {
        font-size: 14px;
    }

    .statistic__block img {
        max-width: 62%;
    }

    .aboutUs__content p {
        font-size: 16px;
        line-height: 19px;
    }

    .statistic__block_column1 {
        gap: 40px;
    }

    .statistic__block_column2 {
        gap: 40px;
    }

    .aboutUs__content_p1 {
        max-width: 476px;
    }
    
    .aboutUs__content_p2 {
        max-width: 477px;
    }
    
    .aboutUs__content_p3 {
        max-width: 476px;
    }




    .services_h2 {
        font-size: 40px;
    }

    .services__body p {
        font-size: 18px;
    }

    .services__body_a {
        font-size: 24px;
    }




    .feauturing__header p {
        font-size: 18px;
    }

    .feauturing__body__left h2 {
        font-size: 44px;
    }

    .button_mobile {
        font-size: 15px;
        padding: 10px 32px;
        margin-top: 25px;
    }

    .fraction__block {
        font-size: 18px;
    }

    .feauturing__body__right img {
        max-width: 64%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 62%;
    }

    .environment .feauturing__body__right img {
        max-width: 64%;
    }

    .civil .feauturing__body__right img {
        max-width: 58%;
    }

    .oil .feauturing__body__right img {
        max-width: 56%;
    }








    .map__header {
        font-size: 36px;
    }

    .map-mobile__footer p {
        font-size: 18px;
    }

    .map-modal-mobile__p {
        font-size: 22px;
        line-height: 34px;
    }

    .map-modal-mobile_close img {
        width: 38px;
    }

    .map-modal__p p {
        font-size: 22px;
        line-height: 32px;
    }

    .map-modal__p u {
        font-size: 22px;
    }

    /* .column1 { */
        /* display: flex; */
        /* justify-content: flex-end; */
    /* } */




    .work__header h2 {
        font-size: 36px;
    }

    .work__header p {
        font-size: 22px;
    }

    .work__main p {
        font-size: 22px;
        max-width: 430px;
    }


    .work__grid {
        /* padding: 20px 0px; */
    }




    .footer {
        flex: 1 0 100%;
        padding: 0px 0px;
        /* min-height: 100vh; */
    }

    .footer__grid {
        /* align-items: center; */
        column-gap: 0px;
        /* min-height: 100vh; */
        height: 100%;
        max-height: 100%;
        grid-template-areas:
            "logo"
            "office"
            "social"
            " inquiries";

            padding-top: 0px;
            padding: 0px 0px;
        row-gap: 0;
    }

    .footer__grid {
        /* align-items: center; */
       
        
    }

    .footer__logo {
        padding-right: 0;
    }

    .footer__socials {
        padding-right: 0;
        align-self: center;
    }

    .footer__socials div {
        margin-bottom: 25px;
    }

    .footer__office p {
        width: 311px;
        max-width: 100%;
    }

    .footer__iquiries p {
        width: 311px;
        max-width: 100%;
    }

    .footer__iquiries div {
        margin-bottom: 14px;
    }

    .footer__office div {
        margin-bottom: 14px;
    }

    .dynamic {
        padding: 50px 0px 20px 0px;
    }

    .pipeline {
        padding: 50px 0px 20px 0px;
    }

    .envi-service {
        padding: 50px 0px 20px 0px;
    }

    .civil__service {
        padding: 50px 0px 20px 0px;
    }

    .oil-service {
        padding: 50px 0px 20px 0px;
    }

    



    .dynamic__left h2 {
        font-size: 40px;
    }

    .dynamic__left h3 {
        font-size: 29px;
        margin-bottom: 38px;
    }

    .dynamic__left p {
        font-size: 21px;
    }




    .pipeline__left h2 {
        font-size: 40px;
    }

    .pipeline__left h3 {
        font-size: 29px;
    }

    .pipeline__left p {
        font-size: 21px;
    }

    .pipeline__left_top1 {
        width: 360px;
        max-width: 100%;
    }

    .pipeline__left_top2 {
        width: 360px;
        max-width: 100%;
    }

    .pipeline__left_bottom1 {
        width: 360px;
        max-width: 100%;
    }

    .pipeline__left_bottom2 {
        width: 360px;
        max-width: 100%;
    }




    .envi-service__flex__left h2 {
        font-size: 40px;
    }

    .envi-service__flex__left h3 {
        font-size: 29px;
    }

    .envi-service__flex__left p {
        font-size: 21px;
    }





    .oil-service__left h2 {
        font-size: 40px;
    }

    .oil-service__left h3 {
        font-size: 29px;
    }

    .oil-service__left li {
        font-size: 21px;
    }







    .form_row1 {
        flex-direction: column;
        gap: 0px;
    }
    
    .form_row2 {
        flex-direction: column;
    }
    
    
    form label {
        font-size: 16px;
        
    }

    input::placeholder {
        font-size: 13px;
    }

    input {
        margin-bottom: 25px;
    }

    textarea::placeholder {
        font-size: 13px;
    }

    textarea {
        padding: 10px;
        height: 88px;
        max-height: 100%;
    }

    /* textarea { */
        /* height: 83px; */
        /* max-height: 100%; */
    /* } */

    .modal__main {
        width: 480px;
        max-width: 100%;
        padding: 50px 45px;
        height: 720px;
        max-width: 100%;
    }

    .form_button {
        width: 190px;
        max-width: 100%;
        /* padding: 17px 0px; */
        border-radius: 12px;
    }


}


@media only screen and (max-width: 600px) and (max-height: 775px) {

    /* .map-mobile_img { */
        /* width: 168px; */
        /* max-width: 100%; */
    /* } */

}



@media only screen and (max-width: 568px) {
    

    .aboutUs__content {
        padding-left: 0px;
    } 

    .header__body__slogan h1 {
        font-size: 36px;
    }

    

}


@media only screen and (max-width: 556px) {

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


}





@media only screen and (max-width: 516px) {


    .line {
        width: 30px;
    }


    .page__scroll {
        width: 3px;
    }

    .container {
        padding: 0px 30px;
    }
    
    .header__body__slogan h1 {
        font-size: 34px;
        text-align: left;
        white-space: normal;
        line-height: 39px;

    }

    /* .header__nav img { */
        /* max-width: 27%; */
    /* } */

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

    /* .logo { */
        /* justify-content: flex-start; */
    /* } */

    .header__body {
        gap: 45px;
    }

    .header__body__brend img {
        max-width: 52%;
    }

    .slogan__button {
        text-align: left;
    }

    .slogan__button_left {
        margin-right: 5px;
        padding: 9px 19px;
        border-radius: 8px;
    }

    .slogan__button_right {
        padding: 9px 42px;
        border-radius: 8px;
    }

    

    .header__footer__right {
        gap: 10px;
        justify-content: end;
    }

    .header__footer p {
        font-size: 11px;
    }

    .brend__picture img {
        max-width: 96%;
    }

    .required p {
        font-size: 16px;
    }

    







    .aboutUs__content p {
        font-size: 16px;
    }

    .aboutUs__statistic span {
        font-size: 50px;
    }

    .aboutUs__statistic p {
        font-size: 14px;
    }

    .aboutUs__statistic img {
        max-width: 53%;
    }

    .aboutUs__statistic {
        gap: 25px;
    }

    /* .flex { */
        /* justify-content: space-around; */
    /* } */

    .flex__h2 {
        font-size: 32px;
    }

    .aboutUs__content p {
        font-size: 15px;
        text-align: center;
        /* white-space: nowrap; */
    }

    .aboutUs__content_p1 {
        max-width: 393px;
    }
    
    .aboutUs__content_p2 {
        max-width: 393px;
    }
    
    .aboutUs__content_p3 {
        max-width: 393px;
    }

    

   



    .dynamic__left h2 {
        font-size: 36px;
    }

    .dynamic__left h3 {
        font-size: 24px;
    }

    .dynamic__left p {
        font-size: 20px;
    }





    .pipeline__left h2 {
        font-size: 36px;
    }

    .pipeline__left h3 {
        font-size: 24px;
    }

    .pipeline__left p {
        font-size: 20px;
    }

    .pipeline__left_top1 {
        width: 330px;
        max-width: 100%;
    }

    .pipeline__left_top2 {
        width: 330px;
        max-width: 100%;
    }

    .pipeline__left_bottom1 {
        width: 330px;
        max-width: 100%;
    }

    .pipeline__left_bottom2 {
        width: 330px;
        max-width: 100%;
    }




    .envi-service__flex__left h2 {
        font-size: 36px;
    }

    .envi-service__flex__left h3 {
        font-size: 24px;
    }

    .envi-service__flex__left p {
        font-size: 20px;
    }








    .civil__service__left h2 {
        font-size: 36px;
    }

    .civil__service__left h3 {
        font-size: 24px;
    }

    .civil__service__left li {
        font-size: 20px;
        padding-left: 16px;
        
    }

    

    .oil-service__left h2 {
        font-size: 36px;
    }

    .oil-service__left h3 {
        font-size: 24px;
    }

    .oil-service__left li {
        font-size: 20px;
        padding-left: 15px;

    }



    .services_h2 {
        font-size: 32px;
    }

    .services__body p {
        font-size: 15px;
    }

    .services__body_a {
        font-size: 20px;
    }



    .map-modal__p p {
        font-size: 16px;
        line-height: 25px;
    }

    .map-modal__p u {
        font-size: 16px;
    }

    



    /* .map-mobile_img img { */
        /* max-width: 92%; */
    /* } */

    
}




@media only screen and (max-width: 462px) {


    .aboutUs__content p {
        font-size: 13px;
    }

    .nav__list a {
        font-size: 18px;
    }

    .nav__list {
        gap: 35px;
        margin-bottom: 40px;
        padding-top: 0;
    }

    .nav {
        padding-top: 30px;
    }









    .aboutUs__content_p1 {
        max-width: 334px;
    }
    
    .aboutUs__content_p2 {
        max-width: 332px;
    }
    
    .aboutUs__content_p3 {
        max-width: 334px;
    }









    .feauturing__body {
        /* height: 63%; */
    }

    .feauturing__header p {
        font-size: 16px;
    }

    .button_mobile {
        font-size: 13px;
        padding: 9px 29px;
        margin-top: 20px;
        border-radius: 8px;
    }

    .feauturing__body__left h2 {
        font-size: 32px;
    }


    .feauturing__body__right img {
        max-width: 52%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 50%;
    }

    .environment .feauturing__body__right img {
        max-width: 49%;
    }

    .civil .feauturing__body__right img {
        max-width: 50%;
    }

    .oil .feauturing__body__right img {
        max-width: 49%;
    }

    .fraction__block {
        font-size: 16px;
    }




    .dynamic__left h2 {
        font-size: 33px;
    }

    .dynamic__left h3 {
        font-size: 24px;
    }

    .dynamic__left p {
        font-size: 18px;
    }




     /* .column1 { */
        /* width: 150px; */
        /* max-width: 100%; */
    /* } */
/*  */
    /* .column2 { */
        /* display: flex; */
        /* align-items: end; */
        /* width: 150px; */
        /* max-width: 100%; */
    /* } */

    .dynamic-modal__mobile {
        padding: 35px 30px 37px 30px;
    }

    .pipeline-modal__mobile {
        padding: 35px 30px 37px 30px;
    }

    .envi-modal__mobile {
        padding: 35px 30px 37px 30px;
    }

    .civil-modal__mobile {
        padding: 35px 30px 37px 30px;
    }

    .oil-modal__mobile {
        padding: 35px 30px 60px 30px;
    }

    .company-modal__mobile {
        padding: 35px 30px 37px 30px;
    }

    .oil-modal__mobile p {
        font-size: 16px;
    }

    .envi-modal__mobile p {
        font-size: 16px;
    }






    .map-modal-mobile__p {
        font-size: 16px;
        line-height: 25px;
        margin-bottom: 20px;
    }

    .map-modal-mobile_close img {
        width: 25px;
    }

    .map-modal-mobile_close {
        margin-bottom: 0px;
    }

    .map-mobile__block {
        column-gap: 10px;
        row-gap: 7px;
    }





    .work__main p {
        font-size: 19px;
        width: 334px;
        max-width: 100%;
    }

    .work__header p {
        font-size: 20px;
    }

    .work__header h2 {
        font-size: 32px;
    }



    .oil-service__left li {
        font-size: 20px;
        padding-left: 11px;
    }

    .map-mobile_img {
        max-width: 37%;
    }






    .footer p {
        font-size: 18px;
        line-height: 26px;
    }

    .footer__office div {
        margin-bottom: 10px;
    }

    .footer__iquiries div {
        margin-bottom: 10px;
    }

    .footer__socials div {
        margin-bottom: 15px;
    }

    .tabMail, .tabPhone {
        font-size: 18px;
    }
}

@media only screen and (max-width: 414px) and (min-height: 896px) {
    .flex {
        justify-content: space-around;
    }

}

@media only screen and (max-width: 390px) {

    

    .line {
        width: 30px;
    }


    .page__scroll {
        width: 3px;
    }

    .container {
        padding: 0px 30px;
    }
    
    .header__body__slogan h1 {
        font-size: 34px;
        text-align: left;
        white-space: normal;
        line-height: 39px;
    }

    /* .header__nav img { */
        /* max-width: 27%; */
    /* } */

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

    /* .logo { */
        /* justify-content: flex-start; */
    /* } */

    .header__body__brend img {
        max-width: 52%;
    }

    .slogan__button {
        text-align: left;
    }

    .header__footer p {
        font-size: 11px;
    }

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

    





    .flex {
        justify-content: space-around;
    }

    .flex__h2 {
        font-size: 32px;
    }

    .aboutUs__content p {
        font-size: 12px;
        text-align: left;
        line-height: 18px;
        /* white-space: nowrap; */
    }




    

    

    .services__body {
        /* height: 80%; */
    }




    .feauturing__body__left h2 {
        font-size: 32px;
    }

    .fraction__block {
        font-size: 16px;
    }




    .map__header {
        font-size: 32px;
    }

    .map-modal-mobile__p {
        font-size: 16px;
        line-height: 25px;
    }


    .map-mobile__footer p {
        font-size: 15px;
    }

    .map-mobile_img {
        /* opacity: 0; */
    }





    .work__main p {
        font-size: 18px;
    }





    .footer__grid {
        /* align-items: center; */
        column-gap: 0px;
        /* min-height: 100vh; */
        grid-template-areas:
            "logo"
            "office"
            "social"
            " inquiries";

    }

    

    .footer__socials div {
        margin-bottom: 17px;
    }















    .dynamic__left h2 {
        font-size: 33px;
    }

    .dynamic__left h3 {
        font-size: 22px;
        margin-bottom: 32px;
    }

    .dynamic__left p {
        font-size: 17px;
        margin-bottom: 18px;
    }

    .dynamic__left_p3 {
        padding-bottom: 40px;
    }

    .dynamic__flex {
        /* padding: 0px 0px; */
    }




    .pipeline__left p {
        /* font-size: 17px; */
    }
}



@media only screen and (max-width: 395px) and (max-height: 700px) {
    
    .aboutUs__statistic img {
        max-width: 48%;
    }

    .feauturing__body.gap_change {
        height: 63%;
    }

    .feauturing__body {
        height: 57%;
    }

    .aboutUs__statistic span {
        font-size: 43px;
    }

    .aboutUs__statistic p {
        font-size: 12px;
    }

    .statistic__block_column1 {
        gap: 25px;
    }

    .statistic__block_column2 {
        gap: 25px;
    }
    
    .flex__h2 {
        font-size: 29px;
    }

    .aboutUs__content p {
        line-height: 19px;
    }





    .services__body {
        gap: 15px;
    }





    /* .column1 { */
        /* width: 130px; */
    /* } */
/*  */
    /* .column2 { */
        /* width: 130px; */
    /* } */

    /* .map-mobile__block { */
        /* gap: 11px; */
    /* } */

    /* .map-mobile_img img { */
        /* max-width: 85%; */
    /* } */




    /* .fraction__block { */
        /* bottom: 40px; */
    /* } */



}



@media only screen and (max-width: 395px) and (max-height: 650px) {


    .header__flex {
        justify-content: space-evenly;
    }

    .brend__picture img {
        max-width: 88%;
    }

    .header__body__slogan h1  {
        font-size: 32px;
        line-height: 36px;
    }
   

    .services__footer_mobile picture {
        display: flex;
        justify-content: center;
    }

    .feauturing__body__right img {
        /* max-width: 44%; */
    }

    .feauturing__body.gap_change {
        height: 66%;
    }

    .feauturing__body {
        height: 60%;
    }
}






@media only screen and (max-width: 389px) {

    .header__body__slogan h1 {
        font-size: 30px;
    }

    /* .feauturing__body__left h2 { */
        /* font-size: 30px; */
    /* } */

    /* .feauturing__header p { */
        /* font-size: 14px; */
    /* } */
/*  */
    /* .button_mobile { */
        /* font-size: 12px; */
    /* } */

    /* .feauturing__body__right img { */
        /* max-width: 53%; */
    /* } */


    /* .map-mobile_img { */
        /* max-width: 100%; */
    /* } */

}

@media only screen and (max-width: 380px) {
    .header__body__slogan h1 {
        font-size: 26px;
        line-height: 30px;
    }

    .header__footer p {
        font-size: 11px;
    }

    .slogan__button_left {
         margin-right: 5px;
     }

     .slogan__button_right {
        padding: 8px 42px;
    }

    .slogan__button_left {
        padding: 8px 20px;
    }








    .aboutUs__statistic span {
        font-size: 43px;
    }

    .aboutUs__statistic p {
        font-size: 11px;
    }

    .aboutUs__statistic {
        gap: 15px;
    }

    .aboutUs__content p {
        line-height: 16px;
    }

    .aboutUs__statistic img {
        max-width: 47%;
        margin-bottom: 14px;
    }

    .flex__h2 {
        font-size: 26px;
    }

    .statistic__block_column1 {
        gap: 24px;
    }

    .statistic__block_column2 {
        gap: 24px;
    }




    .services__body p {
        font-size: 13px;
    }

    .mobile_img {
        max-width: 95%;
    }

    .services_h2 {
        font-size: 26px;
    }





    .feauturing__header p {
        font-size: 14px;
    }

    .feauturing__body__left h2 {
        font-size: 30px;
    }

    .button_mobile {
        font-size: 12px;
        padding: 7px 26px;
    }

    .fraction__flex {
        font-size: 14px;
    }

    .feauturing__body__right img {
        max-width: 48%;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 46%;
    }

    .environment .feauturing__body__right img {
        max-width: 47%;
    }

    .civil .feauturing__body__right img {
        max-width: 45%;
    }

    .oil .feauturing__body__right img {
        max-width: 46%;
    }








    .map-mobile_img {
        width: 118px;
    }

    .map-mobile__footer p {
        font-size: 14px;
    }






    .work__header h2 {
        font-size: 29px;
        margin-bottom: 10px;
    }

    .work__header p {
        font-size: 18px;
    }

    .work__main p {
        font-size: 14px;
        max-width: 292px;
    }





    .dynamic__left h2 {
        font-size: 30px;
    }

    .dynamic__left h3 {
        font-size: 20px;
    }

    .dynamic__left p {
        font-size: 16px;
        line-height: 19px;
    }


    .pipeline__left h2 {
        font-size: 30px;
    }

    .pipeline__left h3 {
        font-size: 20px;
    }

    .pipeline__left p {
        font-size: 16px;
        line-height: 19px;
    }
    

    .envi-service__flex__left h2 {
        font-size: 30px;
    }

    .envi-service__flex__left h3  {
        font-size: 20px;
    }

    .envi-service__flex__left p {
        font-size: 16px;
        line-height: 19px;
    }


    .civil__service__left h2 {
        font-size: 30px;
    }

    .civil__service__left h3 {
        font-size: 20px;
    }

    .civil__service__left li {
        font-size: 16px;
    }


    .oil-service__left h2 {
        font-size: 30px;
    }

    .oil-service__left h3 {
        font-size: 20px;
    }

    .oil-service__left li {
        font-size: 16px;
        margin-bottom: 8px;
    }

    .map-modal-mobile_close img {
        width: 22px;
    }

    .map-modal-mobile__p {
        font-size: 14px;
        line-height: 21px;
    }

    .envi-modal__mobile p {
        font-size: 14px;
    }

    .oil-modal__mobile p {
        font-size: 14px;
    }





    .socials_line {
        gap: 45px;
    }

    
}



@media only screen and (max-width: 380px) and (max-height: 555px) {

    .main-logo img {
        max-width: 88%;
    }

    .line {
        width: 23px;
    }



    .brend__picture {
        justify-content: center;
    }
    
    
    .brend__picture img {
        max-width: 79%;
    }

    .header__body__slogan h1 {
        line-height: 29px;
    }

    .header__body__slogan {
        gap: 20px;
    }

    .slogan__button_left {
        padding: 9px 19px;
    }

    .slogan__button_right {
        padding: 9px 41px;
    }


    .nav__list a {
        font-size: 16px;
    }

    .nav__list {
        gap: 28px;
        margin-bottom: 32px;
    }

    .header_button_mobile {
        font-size: 14px;
        padding: 13px 22px;
    }







    .flex__h2 {
        font-size: 20px;
    }

    .aboutUs__statistic img {
        max-width: 41%;
        margin-bottom: 12px;
    }

    .aboutUs__statistic span {
        font-size: 39px;
    }

    .aboutUs__statistic p {
        font-size: 10px;
    }

    .aboutUs__statistic {
        gap: 30px;
    }

    .aboutUs__content p {
        font-size: 11px;
    }

    .flex {
        justify-content: space-evenly;
    }





    .services_h2 {
        font-size: 20px;
    }

    .mobile_img {
        max-width: 85%;
    }

    .services__body p {
        font-size: 11px;
        line-height: 13px;
    }

    .services__body__footer {
        justify-content: space-around;
    }




    .feauturing__body__right img {
        max-width: 44%;
    }

    .button_mobile {
        margin-top: 20px;
    }

    .fraction__block {
        font-size: 14px;
    }




    .pipeline-service .feauturing__body__left h2 {
        font-size: 32px;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 43%;
    }

    .environment .feauturing__body__right img {
        max-width: 44%;
    }

    .environment .feauturing__body__left h2 {
        font-size: 32px;
    }

    .civil .feauturing__body__right img {
        max-width: 41%;
    }

    .civil .feauturing__body__left h2 {
        font-size: 32px;
    }

    .oil .feauturing__body__right img {
        max-width: 39%;
    }

    .oil .feauturing__body__left h2 {
        font-size: 32px;
    }





    .map-mobile__footer p {
        font-size: 14px;
    }

    .map__header {
        font-size: 24px;
    }





    .work__header h2 {
        font-size: 24px;
        margin-bottom: 5px;
    }

    .work__header p {
        font-size: 14px;
        line-height: 17px;
    }

    .work__main p {
        font-size: 14px;
        line-height: 20px;
        width: 290px;
    }




    .footer__logo img {
        max-width: 44%;
    }

    address div {
        font-size: 20px;
    }

    .footer p {
        font-size: 16px;
        line-height: 23px;
    }

    .footer__office div {
        margin-bottom: 5px;
    }

    .footer__iquiries div {
        margin-bottom: 5px;
    }

    .footer__grid {
        /* padding: 20px 0px; */
    }

    .tabPhone, .tabMail {
        font-size: 16px;
    }

    



}





@media only screen and (max-width: 345px) {

    .container {
        padding: 0px 20px;
    }


    .nav__list a {
        font-size: 15px;
    }

    .header_button_mobile {
        font-size: 14px;
        padding: 12px 19px;
    }


    .main-logo img {
        max-width: 85%;
    }

    .line {
        width: 25px;
    }

    .header__body__slogan h1 {
        font-size: 22px;
        line-height: 26px;
    }

    .header__body__slogan {
        align-self: flex-start;
        gap: 14px;
    }

    .slogan__button a {
        font-size: 10px;
    }

    .slogan__button_left {
        padding: 7px 14px;
    }

    .slogan__button_right {
        padding: 7px 37px;
    }

    .header__footer p {
        font-size: 10px;
    }






    .services__body_a {
        font-size: 15px;
    }






    .feauturing__header p {
        font-size: 12px;
    }

    .feauturing__body__left h2 {
        font-size: 27px;
    }

    .button_mobile {
        margin-top: 11px;
        font-size: 10px;
    }

    .fraction__flex {
        font-size: 12px;
    }





    .map-mobile__footer p {
        font-size: 12px;
    }



    .work__main p {
        font-size: 12px;
        line-height: 19px;
        width: 250px;
    }





    .footer__logo img {
        max-width: 43%;
    }

    address div {
        font-size: 18px;
    }

    .footer p {
        font-size: 14px;
    }

    .tabPhone, .tabMail {
        font-size: 14px;
    }

    .footer__office p {
        width: 260px;
    }

    .footer__iquiries p {
        width: 260px;
    }

    .socials_line {
        gap: 35px;
    }




}



@media only screen and (max-width: 345px) and (max-height: 520px) {
    .aboutUs__statistic img {
        max-width: 34%;
        margin-bottom: 8px;
    }

    .aboutUs__statistic span {
        font-size: 32px;
        margin-bottom: 2px;
    }

    .statistic__block_column1 {
        gap: 17px;
    }

    .statistic__block_column2 {
        gap: 17px;
    }

    .aboutUs__content p {
        font-size: 10px;
    }




    .feauturing__body__right img {
        max-width: 41%;
    }

    .feauturing__body__left h2 {
        font-size: 24px;
    }


    .pipeline-service .feauturing__body__right img {
        max-width: 41%;
    }

    .pipeline-service .feauturing__body__left h2 {
        font-size: 27px;
    }


    .environment .feauturing__body__right img {
        max-width: 41%;
    }

    .environment .feauturing__body__left h2 {
        font-size: 27px;
    }



    .civil .feauturing__body__right img {
        max-width: 37%;
    }

    .civil .feauturing__body__left h2 {
        font-size: 27px;
    }


    .oil .feauturing__body__right img {
        max-width: 34%;
    }

    .oil .feauturing__body__left h2 {
        font-size: 27px;
    }


    address div {
        font-size: 16px;
    }

    .footer p {
        font-size: 12px;
    }


    .footer__office p {
        width: 230px;
    }

    .footer__iquiries p {
        width: 230px;
    }

    .footer__socials img {
        max-width: 87%;
    }

    .socials_line {
        gap: 29px;
    }
}










                                    /* Adaptive Modal block */




@media only screen and (max-height: 1045px) {

    .modal__main {
        top: 50px;
    }
    /* .modal__main { */
        /* width: 655px; */
        /* max-width: 100%; */
        /* height: 585px; */
        /* max-height: 100%; */
    /* } */
/*  */
    /* .form_row1 { */
        /* flex-direction: row; */
        /* justify-content: space-between; */
    /*  */
    /* } */
/*  */
    /* .form_row2 { */
        /* flex-direction: row; */
        /* justify-content: space-between; */
    /* } */
/*  */
    /* .form_row1 input { */
        /* width: 240px; */
        /* max-width: 100%; */
    /* } */
/*  */
    /* .form_row2 input { */
        /* width: 240px; */
        /* max-width: 100%; */
    /* } */
/*  */
    /* input#subject { */
        /* width: 545px; */
        /* max-width: 100%; */
    /* } */
    /*  */
    /* .form_button { */
        /* font-size: 14px; */
        /* width: 170px; */
        /* padding: 19px 50px; */
    /* } */
/*  */
/*  */
    /*  */
}


@media only screen and (max-height: 1000px) {
      .modal__main {
        width: 655px;
        max-width: 100%;
        height: 627px;
        max-height: 100%;
        top: 130px;
    }

    textarea {
        height: 110px;
    }

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

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

    .form_row1 input {
        width: 240px;
        max-width: 100%;
    }

    .form_row2 input {
        width: 240px;
        max-width: 100%;
    }

    input#subject {
        width: 545px;
        max-width: 100%;
    }
    
    .form_button {
        font-size: 14px;
        width: 200px;
        /* padding: 19px 50px; */
    }
}




@media only screen and (max-height: 795px) {

    form label {
        font-size: 18px;
        
    }

    input::placeholder {
        font-size: 14px;
    }

    textarea::placeholder {
        font-size: 14px;
    }

    textarea {
        height: 110px;
        max-height: 100%;
    }

    .modal__main {
        padding: 57px 49px;
        width: 580px;
        max-width: 100%;
        height: 575px;
        max-height: 100%;
    }

    .form_row1 input {
        width: 215px;
        max-width: 100%;
    }

    .form_row2 input {
        width: 215px;
        max-width: 100%;
    }

    input {
        margin-bottom: 28px;
    }

    /* [type="submit"] { */
        /* margin-bottom: 0px; */
    /* } */

    .close_line1, .close_line2, .close_line3 {
        width: 30px;
    }

    .form_button {
        font-size: 14px;
        /* padding: 17px 66px; */
        width: 179px;
        height: 49px;
        max-width: 100%;
        border-radius: 12px;
    }

    input[type="submit"] {
        -webkit-appearance: none;
        border-radius: 13px;
    }

}




@media only screen and (max-height: 672px) {
    form label {
        font-size: 14px;
        
    }

    input::placeholder {
        font-size: 11px;
    }

    textarea::placeholder {
        font-size: 11px;
    }

    textarea {
        height: 83px;
        max-height: 100%;
        margin-bottom: 20px;
    }

    .modal__main {
        padding: 50px 45px;
        height: 515px;
        max-width: 100%;
    }
}


@media only screen and (max-width: 1536px) and (max-height: 982px) {
    .modal__main {
        top: 120px;
    }
}


@media only screen and (max-width: 1536px) and (max-height: 710px) {

    .modal__main {
        top: 70px;
    }


}



@media only screen and (max-width: 1440px) and (max-height: 900px) {
    .modal__main {
        top: 130px;
    }


    textarea {
        height: 90px;
        margin-bottom: 19px;
    }
}



@media only screen and (max-width: 1366px) and (max-height: 768px) {
    .modal__main {
        top: 51px;
    }


}





@media only screen and (max-width: 1280px) and (max-height: 835px) {
    .modal__main {
        top: 125px;
    }
}




@media only screen and (max-width: 1024px) and (max-height: 768px) {
    .modal__main {
        top: 120px;
    }
}

@media only screen and (max-width: 800px) and (max-height: 600px) {

    .form_row1 input {
        width: 160px;
        max-width: 100%;
    }

    .form_row2 input {
        width: 160px;
        max-width: 100%;
    }

    .modal__main {
        width: 425px;
        height: 470px;
        padding: 45px 38px;
        top: 100px;
    }

    .form_button {
        font-size: 12px;
        /* padding: 11px 48px; */
        width: 132px;
    }

    textarea {
        margin-bottom: 20px;
    }

    input {
        margin-bottom: 20px;
    }

    .modal_close {
        top: 33px;
        right: 29px;
    }
}



@media (orientation: landscape) and (max-width: 790px) and (max-height: 400px)  {

    .services__body p {
        margin-bottom: 18px;
    }

    .header__flex {
        padding: 20px 0px;
    }

    .main-logo img {
        max-width: 85%;
    }

    .nav__list a {
        font-size: 11px;
    }

    .header_button {
        font-size: 11px;
        padding: 9px 13px;
    }

    .brend__picture img {
        max-width: 79%;
    }

    .brend__picture {
        justify-content: flex-end;
    }

    .header__body__slogan h1 {
        font-size: 28px;
        line-height: 30px;
    }

    .slogan__button_left {
        padding: 9px 16px;
    }

    .slogan__button_right {
        padding: 9px 43px;
    }

    .header__body__slogan {
        gap: 13px;
    }

    .header__footer p {
        font-size: 11px;
    }




    .modal__main {
        top: 22px;
        padding: 14px 20px 0px 20px;
        width: 330px;
        height: 282px;
    }

    form label {
        font-size: 11px;
        margin-bottom: 2px;
    }

    input {
        font-size: 11px;
        margin-bottom: 14px;
    }

    input[type="text"] {
        -webkit-appearance: none;
        border-radius: 0;
       }
    
    input[type="tel"] {
        -webkit-appearance: none;
        border-radius: 0;
    }
    
    input[type="email"] {
        -webkit-appearance: none;
        border-radius: 0;
    }
    

    .form_row1 input {
        width: 134px;
    }

    .form_row1 {
        gap: 0px;
    }

    .form_row2 {
        gap: 0px;
    }

    .form_row2 input {
        width: 134px;
    }

    textarea {
        height: 53px;
        font-size: 11px;
        padding: 4px;
        margin-bottom: 9px;
    }

    input[type="submit"] {
        -webkit-appearance: none;
        border-radius: 8px;
    }

    .form_button {
        font-size: 10px;
        width: 110px;
        height: 32px;
    }

    .modal_close {
        top: 7px;
        right: 17px;
    }

    .close_line1, .close_line2, .close_line3 {
        width: 20px;
    }








    .statistic__block img {
        max-width: 37%;
        margin-bottom: 9px;
    }

    .aboutUs__statistic span {
        font-size: 35px;
        margin-bottom: 2px;
    }

    .aboutUs__statistic p {
        font-size: 10px;
    }

    .statistic__block_column1 {
        gap: 32px;
    }

    .statistic__block_column2 {
        gap: 32px;
    }

    .aboutUs__content h2 {
        font-size: 24px;
        margin-bottom: 14px;
    }

    .aboutUs__content p {
        font-size: 12px;
        margin-bottom: 12px;
    }



    .services_h2 {
        font-size: 25px;
    }

    .services__body p {
        font-size: 13px;
        margin-bottom: 28px;
    }

    .services__body_a {
        font-size: 16px;
    }




    .feauturing__header p {
        font-size: 14px;
    }

    .feauturing__body__left h2 {
        font-size: 32px;
    }

    .feauturing__body__left img {
        max-width: 41%;
    }

    .fraction__block {
        font-size: 14px;
    }

    .feauturing__body__right img {
        max-width: 37%;
    }

    .feauturing__footer a {
        font-size: 10px;
        padding: 8px 23px;
    }

    .pipeline-service .feauturing__body__right img {
        max-width: 39%;
    }

    .environment .feauturing__body__right img {
        max-width: 37%;
    }

    .civil .feauturing__body__right img {
        max-width: 36%;
    }

    .oil .feauturing__body__right img {
        max-width: 34%;
    }




    .work__header h2 {
        font-size: 24px;
        margin-bottom: 5px;
    }

    .work__header p {
        font-size: 14px;
    }

    .work__main p {
        font-size: 13px;
        width: 189px;
    }

    .work__images__block img {
        max-width: 91%;
    }

    .work__images__block {
        display: flex;
        justify-content: flex-end;
    }






    .svg {
        display: none;
    }

    .map-mobile__block {
        display: flex;
        gap: 11px;
        width: 395px;
        max-width: 100%;
        flex-wrap: wrap;

        
        justify-content: center;
    }

    .map__header {
        font-size: 23px;
        text-align: center;
    }

    .map-mobile_img {
        max-width: 23%;
    }

    .map__footer {
        display: none;
    }
    
    .map-mobile__footer {
        display: block;
        text-align: center;
        margin: 0 auto;
    }

    .map-mobile__footer p {
        font-family: 'Inter';
        font-weight: 300;
        font-size: 14px;
        letter-spacing: -0.03em;
        color: #FFFFFF;
        /* max-width: 500px; */

    }

    .map-mobile__footer span {
        font-weight: 500;
    }






    .dynamic-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 28px 70px;
        gap: 0px;
    }

    .map-mobile-card {
        align-self: flex-start;
        /* margin: auto 0; */
        /* margin-top: 20px; */
        max-width: 32%;
        max-height: 100%;
    }

    .modal__mobile_flex {
        display: flex;
        /* max-height: 100%; */
        gap: 25px;
    }

    .pipeline_map-mobile-card {
        align-self: flex-start;
        max-width: 36%;
    }

    .envi_map-mobile-card {
        align-self: flex-start;
        max-width: 27%;
    }

    .civil_map-mobile-card {
        align-self: flex-start;
        max-width: 33%;
    }

    .oil_map-mobile-card {
        align-self: flex-start;
        max-width: 27%;
    }

    .company_map-mobile-card {
        align-self: flex-start;
        max-width: 27%;
    }

    .map-modal__p {
        position: absolute;
        top: 0;
    }

    .map-modal__p p {
        font-size: 13px;
        line-height: 35px;
        white-space: nowrap;
    }

    .map-modal__p u {
        font-size: 13px;
    }

    .map-modal-mobile__p span {
        /* font-size: 1em; */
    }

    .map-modal-mobile_close {
        position: absolute;
        left: 19px;
        top: 15px;
    }

    .map-modal-mobile_close img {
        width: 20px;
    }


    .pipeline-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 28px 70px;
        gap: 0px;
    }

    .envi-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 30px 70px;
        gap: 0px;
    }

    .civil-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 27px 70px;
        gap: 0px;
    }

    .oil-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 24px 70px;
        gap: 0px;
    }

    .company-modal__mobile {
        flex-direction: row;
        align-items: center;
        padding: 20px 70px;
        gap: 0px;
    }




    .oil-service__left h2 {
        margin-bottom: 40px;
    }

    .oil-service__flex {
        padding-top: 50px;
    }




}




@media (orientation: landscape) and (max-width: 700px) and (max-height: 400px)  {

    .burger {
        display: none;
    }

    .nav {
        position: static;
        padding-top: 0;
        width: auto;
        height: auto;
    }

    .main-logo img {
        max-width: 100%;
    }

    .main-logo {
        display: flex;
        align-items: flex-end;
        max-width: 14%;
    }


    .nav__list {
        flex-direction: row;
        padding-top: 0px;
        margin-bottom: 0;
        gap: 23px;
    }


    .dynamic .nav__list {
        background-color: #246EB9;
    }

    .header_button_mobile {
        display: none;
    }

    .header_button {
        display: block;
        font-size: 10px;
    }


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

    .header__body__slogan {
        align-items: flex-start;
    }

    .header__body__slogan h1 {
        font-size: 26px;
        text-align: left;
    }

    .slogan__button a {
        font-size: 8px;
    }

    .slogan__button_left {
        padding: 7px 11px;
        border-radius: 6px;
    }

    .slogan__button_right {
        padding: 7px 34px;
        border-radius: 6px;
    }

    .brend__picture img {
        max-width: 54%;
    }

    .header__flex {
        padding: 0px;
    }

    .modal__container {
        padding: 0px 30px;
        justify-content: flex-end;
    }





    .flex__h2 {
        display: none;
    }

    .aboutUs__content h2 {
        display: block;
        font-size: 20px;
        margin-bottom: 19px;
    }

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

    .aboutUs__content p {
        text-align: left;
        font-size: 10px;
        line-height: 13px;
        margin-bottom: 17px;
    }

    .aboutUs__content_p1 {
        width: 227px;
    }

    .aboutUs__content_p2 {
        width: 240px;
    }

    .aboutUs__content_p3 {
        width: 260px;
    }

    .statistic__block img {
        max-width: 33%;
    }

    .aboutUs__statistic span {
        font-size: 31px;
        margin-bottom: 4px;
    }

    .aboutUs__statistic p {
        font-size: 8px;
    }

    .aboutUs__statistic {
        gap: 25px;
    }

    .statistic__block_column1 {
        gap: 25px;
    }

    .statistic__block_column2 {
        gap: 25px;
    }





    .services__footer_mobile {
        display: none;
    }

    .services__footer {
        display: flex;
    }

    .services_h2 {
        font-size: 20px;
    }

    .services__body_a {
        font-size: 15px;
    }

    .services__flex {
        padding: 20px 0px;
    }





    .button_mobile {
        display: none;
    }

    .button_fulscreen {
        display: block;
    }

    .feauturing__footer {
        justify-content: flex-end;
    }

    .feauturing__body {
        flex-direction: row;
        justify-content: space-between;
        height: auto;
    }

    .feauturing__body__right {
        justify-content: flex-end;
    }

    .feauturing__body.gap_change {
        height: auto;
    }

    .featuring_button_flex {
        display: none;
    }

    .feauturing__body__left {
        align-self: flex-end;
    }

    .feauturing__footer a {
        font-size: 9px;
        padding: 5px 19px;
    }

    



    .container {
        padding: 0px 30px;
    }



    .map-mobile__footer p {
        max-width: 100%;
        font-size: 14px;
    }

    .map__header {
        font-size: 22px;
    }

    .map-mobile-card {
        max-width: 41%;
    }

    .pipeline_map-mobile-card {
        max-width: 44%;
    }

    .envi_map-mobile-card {
        max-width: 36%;
    }

    .civil_map-mobile-card {
        max-width: 42%;
    }

    .oil_map-mobile-card {
        max-width: 34%;
    }

    .company_map-mobile-card {
        max-width: 34%;
    }

    .map-modal-mobile__p {
        left: 69px;
    }

    .modal__mobile_flex {
        flex-direction: row;
    }








    .work__main {
        flex-direction: row;
        height: auto;
    }

    .work__main p {
        text-align: left;
        line-height: 18px;
        width: 218px;
    }

    .work__images__block img {
        max-width: 78%;
    }






    .footer__grid {
        grid-template-columns: auto auto auto auto;
        grid-template-areas: "logo office social inquiries";
        justify-content: space-between;
    }

    address div {
        font-size: 12px;
        text-align: left;
    }

    .footer p {
        font-size: 10px;
        line-height: 14.5px;
        text-align: left;
    }

    .tabPhone, .tabMail {
        font-size: 10px;
    }

    .footer__office p {
        width: 113px;
    }

    .footer__iquiries p {
        width: 140px;
    }

    .footer__socials img {
        max-width: 50%;
    }

    .socials_line {
        gap: 23px;
    }

    .footer__logo {
        padding-right: 0;
    }

    .footer__socials {
        padding-right: 0;
    }






    .fraction__flex {
        justify-content: flex-start;
        width: auto;
    }




    .dynamic__left h2 {
        font-size: 28px;
        margin-bottom: 50px;
    }

    .dynamic__left h3 {
        font-size: 18px;
    }

    .dynamic__left p {
        font-size: 16px;
    }




    .pipeline .nav__list {
        background-color: #7E8491;
    }

    .pipeline__left h2 {
        font-size: 28px;
    }

    .pipeline__left h3 {
        font-size: 18px;
    }

    .pipeline__left p {
        font-size: 16px;
    }



    .envi-service .nav__list {
        background-color: #4CB944;
    }

    .envi-service__flex__left h2 {
        font-size: 28px;
        margin-bottom: 40px;
    }

    .envi-service__flex__left h3 {
        font-size: 18px;
    }

    .envi-service__flex__left p {
        font-size: 16px;
    }



    .civil__service .nav__list {
        background-color: #FFFFFF;
    }

    .civil__service__left h2 {
        font-size: 28px;
    }

    .civil__service__left h3 {
        font-size: 18px;
    }

    .civil__service__left li {
        font-size: 16px;
    }


    .oil-service .nav__list {
        background-color: #423629;
    }

    .oil-service__left h2 {
        font-size: 28px;
    }

    .oil-service__left h3 {
        font-size: 18px;
    }

    .oil-service__left li {
        font-size: 16px;
    }


}



@media only screen and (max-width: 600px) and (max-height: 950px) {

    
    .form_row1 {
        flex-direction: column;
        gap: 0px;
    }
    
    .form_row2 {
        flex-direction: column;
    }
    
    
    form label {
        font-size: 16px;
        
    }

    input::placeholder {
        font-size: 13px;
    }

    input {
        margin-bottom: 25px;
    }

    textarea::placeholder {
        font-size: 13px;
    }

    textarea {
        padding: 10px;
        height: 88px;
        max-height: 100%;
    }

    /* textarea { */
        /* height: 83px; */
        /* max-height: 100%; */
    /* } */

    .modal__main {
        width: 480px;
        max-width: 100%;
        padding: 50px 45px;
        height: 720px;
        max-width: 100%;
    }

    .form_button {
        width: 160px;
        height: 44px;
        max-width: 100%;
        /* padding: 14px 0px; */
        border-radius: 12px;
    }

    input[type="submit"] {
        -webkit-appearance: none;
        border-radius: 12px;
    }

    .modal__container {
        padding: 0px 28px;
    }

}


@media only screen and (max-width: 450px) and (max-height: 844px) {
    form label {
        font-size: 14px;
        
    }

    input::placeholder {
        font-size: 12px;
    }

    textarea::placeholder {
        font-size: 12px;
    }

    .modal__main {
        width: 325px;
        max-width: 100%;
        padding: 43px 32px 0px 32px;
        height: 645px;
        max-width: 100%;
        top: 50px;
    }

    .form_button {
        margin: 0px auto;
        width: 134px;
        max-width: 100%;
        font-size: 11px;
        height: 37px;
        /* padding: 13px 0px; */
    }

    textarea {
        height: 71px;
        max-height: 100%;
        margin-bottom: 24px;
    }

    .modal_close {
        top: 35px;
        right: 20px;
    }

    .close_line1,
    .close_line2,
    .close_line3 {
        width: 30px;
    }


}


@media only screen and (max-width: 450px) and (max-height: 710px) {

    .modal__main {
        top: 30px;
    }


}


@media only screen and (max-width: 450px) and (max-height: 685px) {

    input {
        margin-bottom: 17px;
    }

    .modal__main {
        height: 600px;
        top: 30px;
    }



}




@media only screen and (max-width: 390px) and (max-height: 844px) {

    form label {
        font-size: 14px;
        
    }

    input::placeholder {
        font-size: 12px;
    }

    textarea::placeholder {
        font-size: 12px;
    }

    .modal__main {
        width: 325px;
        max-width: 100%;
        padding: 43px 32px 0px 32px;
        height: 635px;
        max-width: 100%;
        top: 65px;
    }

    .form_button {
        margin: 0px auto;
        width: 134px;
        height: 37px;
        max-width: 100%;
        font-size: 11px;
        border-radius: 10px;
        /* padding: 12px 0px; */
    }

    input[type="submit"] {
        -webkit-appearance: none;
        border-radius: 10px;
    }

    textarea {
        height: 71px;
        max-height: 100%;
        margin-bottom: 16px;
    }

    .modal_close {
        top: 35px;
        right: 20px;
    }

    .close_line1,
    .close_line2,
    .close_line3 {
        width: 30px;
    }





}


@media only screen and (max-width: 395px) and (max-height: 640px) {


    input {
        margin-bottom: 15px;
        font-size: 12px;
    }

    form label {
        font-size: 12px;
        margin-bottom: 10px;
    }


    .form_button {
        width: 113px;
        height: 34px;
        /* padding: 10px 0px; */
    }

    .modal__main {
        width: 300px;
        padding: 36px 32px 0px 32px;
        height: 504px;
        top: 37px;
    }

    textarea {
        font-size: 12px;
        margin-bottom: 13px;
    }

}