
:root {
    --light-gray: #E5E5E5;
    --dark-gray: #CCCCCC;
    --blue-text: rgb(23, 41, 58);
}


body.scrollLock { overflow-y: hidden; }
/* --------------------------------- */

.containerWrapper { width: 100%; max-width: 1540px; min-width: 540px; padding: 0 84px; box-sizing: border-box; margin: 0 auto; position: relative; }
.containerContent { padding: 25px 0 50px 0; overflow: hidden; position: relative; }
.containerPage { scroll-behavior: smooth; min-width: 540px; box-sizing: border-box; overflow: hidden; }
.containerServices { width: 100%; position: relative; display: inline-block; padding:  0;}
h1 a, h2 a { display: inline-block; transform: scale(1); transition: transform 300ms; }
h1 a:hover, h2 a:hover { transform: scale(1.05); }
h1 { line-height: 28px; }
h2 { line-height: 26px; }
ul li {margin: 10px 0;}
a img{ transform: scale(1); transition: transform 300ms; }
.imgZoomBox { overflow: hidden; }
a.imgZoomBox { display: inline-block; height: 100%;}
canvas { position: absolute; display: block; }
canvas.rotated { transform: rotate(180deg); top: -140px; }
canvas.short { transform: rotate(180deg); top: 0; }
.banner-img { position: relative; margin-bottom: -16px; }
.banner-img img { width: 100%;}
.banner-wrapper { height: 100%; display: flex; align-items: end; justify-content: space-evenly; }
.banner-content { margin-bottom: 214px;}
.coloredBg { background-color: rgba(20, 37, 51, 0.81); height: 140px; }

.main-text { display: none;  position: relative; font-size: 30px; line-height: 30px; color: #fff; }
.fade-text {
    position: relative;
    font-size: 15px;
    letter-spacing: 4.1px;
    color: rgba(255, 255, 255, 0.302);
}

.fade-text p { margin-top: 20px; }

.decode-text {
    position: relative;
    display: flex;
    font-size: 70px;
    font-weight: 700;
    line-height: 1.2;
}

.space {
    display: inline-block;
    width: 20px;
}
.text-animation {
    display: inline-block;
    position: relative;
    color: transparent;
}

.text-animation::before {
    content: "";
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    background: #142533;
    width: 0;
    height: 1.2em;
    transform: translate(-50%, -55%);
}

.text-animation.state-1:before {
    width: 1px;
}

.text-animation.state-2:before {
    width: 0.9em;
}

.text-animation.state-3 {
    color: #fff;
}
.text-animation.state-3:before {
    width: 0;
}
/* --------------------------------- */

.containerHeader { position: fixed; z-index: 100; width: 100%;  min-width: 540px; transition: all 1s;}
.containerHeader--content  { display: flex; align-items: center; height: 160px; }
.containerHeader .containerHeader--burger { display:none; width: 72px; box-sizing: border-box; padding: 16px 10px 16px 16px;  cursor: pointer; margin-top: 5px; margin-right: 40px; }
.containerHeader .containerHeader--burger:hover { opacity: 1; }
.containerHeader .containerHeader--burger .burger--element {  width: 35px; height: 2px; background: #fff; border-radius: 50px; float: right; }
.containerHeader .containerHeader--burger .burger--element:not(:last-child) { margin-bottom: 7px; }
.containerHeader .containerHeader--logotype { margin-left: 63px; }
.containerHeader .containerHeader--logotype .logotype { display: block;}

.containerHeader .containerHeader--menu  { margin-left: 123px; }
.containerHeader .containerHeader--menu  ul li { display: inline-block;margin-right: 20px; font-size: 17px; color: #ececec; padding: 7px 15px; font-weight: 300; position: relative;}
.containerHeader .containerHeader--menu  .main-link { font-size: 13px; letter-spacing: 2.2px; color: #fff; text-transform: uppercase; }
.containerHeader .containerHeader--menu  .main-link:hover { text-decoration: underline; }

.containerHeader .containerHeader--menu  ul li:hover > ul { display: grid;  }
.containerHeader .containerHeader--menu  ul li ul { position: absolute; top: 30px; left: 0; padding: 10px 0; display: none; color: white; border-bottom: none; transition: display 2s; background: #142533; grid-template-columns: repeat(2, 1fr); align-content: center;}
.containerHeader .containerHeader--menu  ul li ul li { position: relative; width: 220px; margin: 0 25px; box-sizing: border-box; border-bottom: 1px solid #d5d5d5; opacity: 0; transform: translateX(-30px); transition: opacity 0.5s ease, transform 0.5s ease; }
.containerHeader .containerHeader--menu  ul li ul li:last-of-type { border-bottom: none;}
.containerHeader .containerHeader--menu  ul li ul li.show {  opacity: 1; transform: translateX(0);}
.containerHeader .containerHeader--menu  ul li ul li::after { display: none; }
.containerHeader .containerHeader--menu  ul li ul li a { display: block; padding: 10px 0; line-height: 21px; font-size: 13px; text-decoration: none; color: #fff; transition: all .2s; }
.containerHeader .containerHeader--menu  ul li ul li a:hover { text-shadow: 0 0 15px #FFFFFF;  -moz-transform: scale(1.05); -webkit-transform: scale(1.05);  -o-transform: scale(1.05); transform: scale(1.05); }
.containerHeader .containerHeader--menu  ul li a.first--link { position: relative; color: #fff; padding: 5px 10px;  border-radius: 10px; }
.containerHeader .containerHeader--menu  ul li a.first--link:before { content: ""; display: block; position: absolute; top: 5px; left: -11px;  width: 6px;height: 6px;border-left: 1px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg);margin: 2px; }
.containerHeader--contacts a { display: flex; align-items: center; gap: 16px; }
.containerHeader--contacts img {     filter: invert(1); }
.containerHeader--contacts a:first-child { display: none; }
.containerHeader--contacts a span { font-size: 21px; font-weight: 400; color: #fff; }
.containerHeader--right--menu { display: flex; align-items: center; }
.containerHeader--right--menu .buttonBlack { margin-right: 30px;  border: 1px solid #fff; }
.containerHeader--right--menu span {  font-size: 10px; text-transform: uppercase; color: #fff; padding-right: 16px;}
.containerHeader .containerHeader--social { float: right; margin: 76px 30px 0 30px;}
.containerHeader .containerHeader--social a { margin: 0 10px 0 0;}
.containerHeader .containerHeader--social img { opacity: 0.4;}

/* ---- ---- ---- ---- ---- ---- ---- ---- */

.containerMenu { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; background: rgba(0,0,0,0.85); }
.containerMenu ul li { position: relative; }
.containerMenu .main-list { min-width: 400px; max-width: 80%; }
.containerMenu .sublist {  padding-left: 0; padding-top: 30px;}
.containerMenu--container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; display: inline-grid; justify-content: center; align-content: center; }
.containerMenu--close { position: absolute; top: 30px; right: 44px; font-size: 60px; cursor: pointer; color: #fff; }
.containerMenu--content { position: relative; display: inline-block; text-align: left; margin-bottom: -200px; opacity: 0; visibility: hidden; transition: all .3s; }
.containerMenu--content.active { margin-bottom: 0; opacity: 1; visibility: visible; }
.containerMenu--content a { display: block; color: #fff; font-size: 24px; font-weight: 600; padding: 10px 0; border-bottom: 2px solid #fff; }
.containerMenu--content ul li ul li a { font-size: 18px; padding: 7px 0 7px 30px; color: rgba(255,255,255,0.7); }
.containerMenu--content a:last-child { border-bottom: none; }

/* ---- ---- ---- ---- ---- ---- ---- ---- */
.containerServices--elem { height: auto; margin-block: 15px; margin-right: 10px; display: flex; flex-direction: column; cursor: pointer; box-sizing: border-box; transition: all .5s; }
.containerServices--elem:hover { transform: scale(1.03); filter: grayscale(1); }
.containerServices--elem .containerServices--elem-img { display: block; aspect-ratio: 1 / 1;}
.containerServices--elem .containerServices--elem-img img {  width: 100%; height: 100%; object-fit: cover;}
.containerServices--elem h3 {margin-top: 30px; font-weight: 900; font-size: 25px; line-height: 28px;}
.containerServices--elem h3 { overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;}
.containerServices--elem .containerServices--elem-details { min-height: 135px; padding: 26px 48px 22px 28px; box-sizing: border-box; font-size: 24px; line-height: 120%; font-weight: 200; color: var(--blue-text); background-color: #EDEDED; }
.containerServices--elem h3 span { display: block; font-weight: 400; font-size: 19px; line-height: 20px; }
.containerServices--next { display: flex; justify-content: end; margin-bottom: 40px; margin-right: 6px; }
.containerServices--next img { cursor: pointer; }


/* ---- ---- ---- ---- ---- ---- ---- ---- */
.aboutCompany { margin-bottom: 55px; }
.aboutCompany.inside { margin-top: 55px;}
.aboutCompany-container { display: flex; max-width: 1540px; margin: 100px auto;  align-items: center;}
.aboutCompany-image { width: 40%; }
.aboutCompany-image img {width: 100%;}
.aboutCompany-text { width: 60%; padding: 0 0 10px 85px; max-width: 600px; }
.aboutCompany-text p { margin-top: 13px;  font-size: 16px; color: #666666; line-height: 150%;}
.aboutCompany-text h2 { margin-top: 10px; margin-bottom: 23px; font-weight: 200; font-size: 41px;color: var(--blue-text);}

.about-service p { margin: 27px 0;}
.about-service .tariff {  margin: 40px 0 15px;}

.about-service table { border: none;border-spacing: 0;  }
.about-service table tr th { padding: 10px; border: none; text-align: left; background-color: var(--blue-text); color: #fff;}
.about-service table tr td {  border-left-color: #dddddd40; border-right-color: #dddddd40; border-top-color: #dddddd40; border-bottom-color: #dddddd40; padding: 20px 10px;line-height: 20px;}
.about-service table tr:last-of-type td { border-bottom-color: rgba(184, 184, 184, 0.35); }

.about-wrapper { display: flex;  gap: 100px;}
.about-title { display: flex; justify-content: space-between; align-items: center; margin-top: 100px; margin-bottom: 60px;}
.about-title h1 { font-size: 60px; line-height: 62px; ;}
.about-title img { filter: invert(0.9)}
.about-image { flex-basis: 45%; }
.about-image img { width: 100% }
.about-text { flex-basis: 45%; box-sizing: border-box;}
.about-text p { margin: 27px 0; color: #666666; font-size: 16px; line-height: 150%;}
.about-text .first strong { font-size: 28px; color: var(--blue-text); margin-bottom: 17px; margin-top: 0; }
.about-text .first { margin-top: 0;}
.about-text .directions .accent { margin-top: 15px; font-weight: 600; font-size: 18px; color: var(--blue-text); }
.about-text .directions ul { list-style: none; padding-left: 0; display: flex; flex-wrap: wrap; column-gap: 20px;  }
.about-text .directions ul li { flex-basis: 45%; display: flex; gap: 10px;  margin: 7px 0; color: #666666;}
.about-text .fas { font-size: 22px;}
.quote { margin-top: 40px; }
.quote p { font-size: 18px; margin-bottom: 8px; color: #666666; }
.quote p strong { color: var(--blue-text); }


    /* --------------------------------- */
.mainBlock { position: relative; display: flex; row-gap: 30px; flex-wrap: wrap; width: calc(100% + 40px); left: -20px; padding-top: 35px; z-index: 10;}
.mainBlock--text { color: #ffffffad; font-size: 16px; padding-bottom: 40px;}
.mainBlock--element { width: 30%; padding: 0 20px; box-sizing: border-box;}
.mainBlock--image { position: relative; }
.mainBlock--image::before { content: ''; position: absolute; right: 0; width: 100%; height: 1px; top: -13px; background: #ffffff7a; z-index: 1; }
.mainBlock--image img { width: 100%; object-fit: cover; object-position: center; transform: scale(1); transition: transform 300ms; aspect-ratio: 1 / 1; }
.mainBlock--image img:hover { transform: scale(1.05); }
.mainBlock--tile { padding-top: 35px; }
.mainBlock--tile h2 { font-weight: 200; font-size: 35px; line-height: 37px; transition: transform 400ms; color: var(--blue-text); margin-bottom: 20px;}
.mainBlock--tile p { font-size: 14px; color: #666666;}
.mainBlock--tile a { line-height: 120%; margin-bottom: 10px; }
.mainBlock--tile h2:hover { transform: scale(1.05);  -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); }
.mainBlock--tile h2:hover a { text-decoration: none; }
.arrowButton { padding: 15px 0 0 0; display: flex; justify-content: end; filter: brightness(0.2);}
.arrowButton img { width: 50px;transition: transform 300ms; }
.arrowButton img:hover { transform: scale(1.05);}

.containerView--content--present { padding: 60px;}
.containerView--content .mainBlock--element:nth-child(3n-1) { padding-top: 40px;}
.containerView--content .mainBlock--element:nth-child(3n) { padding-top: 60px;}
.containerView--content .mainBlock--image::before { background: #4646467a;}


/* --------------------------------- */
.containerValues { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
.containerValues .containerValues--element { padding: 30px; border: 1px solid #efefef; border-radius: 10px; background: #f7f7f7; }
.containerValues .containerValues--element .containerValues--title { font-weight: 600; font-size: 18px; line-height: 24px; margin-bottom: 15px;  }
.containerValues .containerValues--element .containerValues--text { font-size: 14px; color: #5d5d5d; }
/* --------------------------------- */


.containerBanner { position: relative; height: 800px;}
.containerBanner .overlay { width: 100%;height: 100%;inset: 0;position: absolute;opacity: 0.8;background-image: linear-gradient(359deg, rgba(0, 0, 0, 0) 54.25%, rgb(6 6 5) 100%);}
.containerBanner::before  { content: ''; position: absolute; bottom: -10px; right: 0; width: 100%; height: 10px; background-color: rgb(194 224 241 / 62%); z-index: 10; }
.containerBanner::after  { content: ''; position: absolute; bottom: -10px; left: 0; width: 50%; height: 10px; background-color: #117AB5; z-index: 11; }
.containerBanner.services  {height: 160px;}
.containerBanner.services::before,
.containerBanner.services::after { display: none;}


/* --------------------------------- */
.containerView { padding: 75px 0 50px 0; min-height: calc(100vh - 258px); box-sizing: border-box;}
/*.containerView.inside { padding: 0 0 50px;}*/
.containerView .containerView--title { margin-bottom: 10px; margin-top: 50px; }
.containerView .containerView--bread { margin: 20px 0;}
.containerView .containerView--title h1 { font-size: 40px; line-height: 46px; font-weight: 700; color: #000; }
.containerView .containerView--bread a { font-size: 13px; color: #999; }
.containerView .containerView--content { padding: 0; }
.containerView .containerView--content .containerView--content--left { float: left; width: 270px; position: relative; overflow: hidden; }
.containerView .containerView--content .containerView--content--right { margin-left: 300px; }


/* --------------------------------- */
.container--checkbox {display: block; position: relative; padding-left: 35px; margin-bottom: 12px;cursor: pointer; -webkit-user-select: none;-moz-user-select: none; -ms-user-select: none; user-select: none;}
.container--checkbox input {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #fff;  border: 1px solid #efefef; border-radius: 4px;}
.container--checkbox:hover input ~ .checkmark { border-color: #656565;}
.container--checkbox input:checked ~ .checkmark { background-color: #000000;}
.checkmark:after { content: ""; position: absolute; display: none;}
.container--checkbox input:checked ~ .checkmark:after { display: block;}
.container--checkbox .checkmark:after { left: 7px; top: 2px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}




/* --------------------------------- */
.imgLeft { max-width: 50%; float: left;  padding: 0 30px 30px 0;}
.imgLeft  img { max-width: 100%; }
.imgRight { max-width: 50%; float: right;  padding: 0 0 30px 30px;}
.imgRight img { max-width: 100%; }
.rightImage { float: right; padding: 0 0 30px 30px; }
/* --------------------------------- */
.containerFooter { width: 100%;  padding: 40px 0; overflow: hidden; color: #fff; background: #EDEDED; z-index: 5;  position: relative;}
.containerFooter .containerFooter--content { display: flex; flex-direction: column;  align-items: center; }
.containerFooter .containerFooter--top { display: flex; gap: 40px;}
.containerFooter--menu { display: flex; gap: 46px;  margin: 0 0 20px 0; padding: 0;  list-style: none; }
.containerFooter--menu a { font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: 2px; }
.footerMenu { margin-bottom: 20px; display: flex; gap: 120px; }
.footerMenu a { font-size: 25px; font-weight: 600; color: #000; }
.containerFooter--copyright { width: 100%; font-size: 13px; text-align: center; color: #666; margin-top: 10px; }
.containerFooter--conf-policy {width: 100%;font-size: 13px; text-align: center;margin-top: 20px;}
.containerFooter--conf-policy a { color: #666;}
.containerFooter .containerFooter--logotype { margin-bottom: 23px; margin-top: 14px; }
.containerFooter .containerFooter--logotype .containerFooter--logo { display: block; width: 246px; }
.containerFooter .containerFooter--logotype .containerFooter--logo img { width: 100%; filter: invert(1); }
.containerFooter .containerFooter--bottom { display: flex; justify-content: space-between; width: 100%; align-items: center; margin-top: 31px; margin-bottom: 90px;}
.containerFooter--contacts {  margin: 25px 0 0 0;  display: flex; gap: 60px;}
.containerFooter--contacts--list { display: flex; flex-direction: column; gap: 7px;}
.containerFooter--contacts--list .phone { font-size: 25px;  }
.containerFooter--contacts--list .email {  font-size: 17px; margin-top: 10px; text-align: right;}
.containerFooter--nav { display: flex; gap: 60px; }
.containerFooter--nav .nav-list a { font-size: 10px;color: rgb(0, 0, 0); text-transform: lowercase; letter-spacing: 2px; line-height: 25px; }

/* --------------------------------- */
.remind--form--block { display: inline-block; width: 100%; position: relative; }
.remind--form--block--content { display: none; height: auto; max-height: 158px; z-index: 3; overflow-x: hidden; overflow-y: auto;  color: #000;  width: 100%;  margin: 0;  position: absolute;  top: 50px; background: #fff; border: 1px solid #efefef; box-sizing: border-box; }
.remind--form--block--content label {    padding: 10px 5px; }
.remind--form--block .remind--form--block--title { width: 100%; position: relative; border: 1px solid #efefef; padding: 15px; box-sizing: border-box; border-radius: 4px; cursor: pointer; transition: transform 300ms; font-size: 15px; }
.remind--form--block--content label { width: 100%; display: inline-block; box-sizing: border-box; padding: 10px; cursor: pointer; text-align: center; }
.remind--form--block--content label:not(:last-child) { border-bottom: 1px solid #efefef; }
.remind--form--block--content label.checked { background-color: #efefef; }
.remind--form--block--content label:hover { background-color: #efefef;  }
.remind--form--block input { display: none; width: 20px;  height: 20px;  position: relative; border-radius: 2px; background: #fff;  border: 1px solid #ccc;box-sizing: border-box;  vertical-align: top; }
.remind--form--block label:checked { background-color: #3a602d; }
.remind--form--block .remind--form--block--arrow { position: absolute; top: 0; right: 0; width: 50px; height: 50px; cursor: pointer; }
.remind--form--block .remind--form--block--arrow .remind--form--arrow { border: 1px solid #bdbdbd; border-width: 0 3px 3px 0;  display: inline-block;   padding: 4px;  transform: rotate(45deg);  -webkit-transform: rotate(45deg); position: absolute; top: 16px;  right: 20px; cursor: pointer; }

/* --------------------------------- */
.seoBlock {  font-size: 12px; color: grey;  margin: 40px 0;  line-height: 100%;}
.seoBlock  p {margin-block-start: 0.5em;   margin-block-end: 0.5em;}
.seoBlock  a {color: grey; }
/*-------------------------------------*/

.mobile-category-heading {  display: flex; justify-content: space-between; align-items: center; font-weight: bold; font-size: 16px;  padding: 12px 16px; border-bottom: 1px solid #ccc; cursor: pointer; position: relative;}
.heading-text { flex: 1; color: var(--blue-text); }
.arrow-icon {width: 10px; height: 10px; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); transition: transform 0.3s ease; position: absolute; right: 16px; top: 50%; transform: translateY(-50%) rotate(45deg); }

.mobile-category-heading.opened .arrow-icon {
    transform: translateY(-50%) rotate(-135deg); /* Обертання вгору */
}
.mobile-category-heading.opened .arrow-icon {
    transform: rotate(-135deg); /* Повертаємо стрілку вгору */
}

@media screen and (max-width: 2300px) {
    .containerServices--elem .containerServices--elem-details { padding-right: 22px;  font-size: 22px; };

}

@media screen and (max-width: 1800px) {
    .banner-content { margin-left: 20px;}
}

@media screen and (max-width: 1600px) {
    .decode-text { font-size: 60px;}
    .about-wrapper { gap: 60px;}
    .aboutCompany-container { justify-content: left; gap: 60px; align-items: center; }
    .aboutCompany-text { padding-left: 0;}
    .about-image { flex-basis: 55%; }
    .mainBlock--element { width: 33.333%; }
}


@media screen and (max-width: 1440px) {
    .decode-text { font-size: 50px;}
}

@media screen and (max-width: 1280px){
    .decode-text { font-size: 40px;}
    .banner-content { margin-left: 20px;}
}

@media screen and (max-width: 1200px){
    .containerHeader .containerHeader--menu { margin-left: 70px;}
    .containerWrapper { padding: 0 50px; }
    .containerServices { margin-left: 150px;}
    .containerServices--elem { margin-inline: 15px;}
    .aboutCompany-text { max-width: 500px;}
    .aboutCompany-text p { font-size: 14px;}
    .mainBlock--tile h2 { font-size: 24px; line-height: 26px;}
}


@media screen and (max-width: 1024px){
    .containerBanner { height: 700px;}
    .aboutCompany-container { gap: 30px; }
    .containerFooter--contacts--list .phone { font-size: 20px;}
    .about-wrapper { flex-direction: column; }
    .decode-text { font-size: 30px;}
    .banner-content { width: 45%; }
}

@media screen and (max-width: 1000px){
    .containerHeader .containerHeader--menu { display: none;}
    .containerHeader .containerHeader--burger { display: block;}
    .containerHeader--content  { justify-content: space-between;}
    .banner-content { margin-bottom: 150px; }
    .mainBlock--element { width: 50%; }
    .containerView--content .mainBlock--element:nth-of-type(odd) { padding-top: 20px;}
    .containerView--content .mainBlock--element.four,
    .containerView--content .mainBlock--element.ten { padding-top: 60px; }
    .containerView .containerView--content .containerView--content--left { float: none; padding: 20px 0;  }
    .containerView .containerView--content .containerView--content--right { margin-left: 0; }
    .containerView--content--present { padding: 20px 0; }
}

@media screen and (max-width: 860px) {
    .containerBanner { height: 600px;}
    .banner-content { position: absolute; margin-bottom: 0; left: 0;bottom: 18%; max-width: 400px; z-index: 3; }
    .main-text { display: block; }
    .text-animation{ display: none; }
    .decode-text { display: none; }
    .banner-img { flex-basis: 60%;}
    .fade-text p { font-size: 13px; letter-spacing: 3px; max-width: 300px;}
    .banner-wrapper { justify-content: end;}
    .aboutCompany-container { flex-direction: column; padding: 0 40px; }
    .aboutCompany-image,
    .aboutCompany-text { max-width: 100%; width: 100%; }
    .containerFooter .containerFooter--bottom { flex-direction: column; gap: 50px; margin-bottom: 50px;  margin-top: 0;}
    .containerWrapper { padding: 0 40px;}

}

@media (max-width: 799px) {
    .containerCategories li > ul {display: none;}
    .containerView .containerView--content .containerView--content--left { width: 100%;}
}


@media screen and (max-width: 700px) {
    .containerServices { margin-left: 0; padding-top: 50px; }
    .containerServices--next { margin-right: 15px; }
    .containerServices--elem .containerServices--elem-details { min-height: 119px;}
    .containerFooter--menu { gap: 20px;}
    .containerFooter--menu a { font-size: 13px;}
    .mainBlock--element { width: 100%; }
    .containerView--content .mainBlock--element { padding-top: 20px!important;}
    .containerView .containerView--title h1 { font-size: 30px; line-height: 36px;}
}


@media screen and (max-width: 560px){
    .containerServices--elem { padding: 0 25px; height: 500px;}
    .containerServices--next { margin-right: 40px; margin-bottom: 60px;}
    .containerServices { padding-top: 0; }
    .containerHeader .containerHeader--logotype { margin-left: 40px;}
    .containerServices--elem .containerServices--elem-details { font-size: 25px;}
    .containerServices--elem .containerServices--elem-img { aspect-ratio: auto;}
    .containerServices--elem .containerServices--elem-img img { max-height: 381px; object-position: bottom;}
    .banner-img { flex-basis: 60%;margin-right: -50px;margin-bottom: -7px;}
    .containerBanner {height: 500px;}
    .aboutCompany-text p { font-size: 16px; }
    .about-text .first strong { font-size: 24px;}
    .mainBlock--image img { max-height: 500px; object-position: bottom;}
    .main-text { font-size: 26px; line-height: 25px; }
    .banner-content { max-width: 210px;}

}