/*-------------------reset----------------------*/
html, body, div, span, h1, h2, h3, h4, h5, h6, p,
a, em, img, small, strike, sub, sup,
b, u, i, center,
dl, dt, dd, ol, ul, li,
form, label, table, caption, tr, th, td,
article, figure, figcaption, footer, header,
menu, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

* { 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/*-------------------reset end----------------------*/

/*-------------------global presets end----------------------*/
body {
    font-family: 'Exo 2', sans-serif;
    font-size:14px;
    line-height: 25px;
    letter-spacing: 0.02em;
    font-weight: normal;
    position: relative;
    color: #111;
}
.wrap {
    width:100%;
    max-width: 1200px;
    margin-left:auto;
    margin-right:auto;
}

.common_head {
    text-align: center;
    padding-top: 70px;
    padding-bottom: 70px;
}
.common_head>h2 {
    font-size: 28px;
    line-height: 1;
    font-weight: bold;
    text-transform: uppercase;
}
.common_head>p {
    margin-top: 16px;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    color: #454545;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
@media only screen and (min-width:768px) {
    .common_head {
        text-align: center;
        padding-top: 130px;
        padding-bottom: 110px;
        padding-left:20px;
        padding-right:20px;
    }
    .common_head>h2 {
        font-size: 40px;
    }
    .common_head>p {
        margin-top: 40px;
        font-size: 20px;
        line-height: 30px;
    }
}

.to_top{box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16); transition: 1s;}


/*-------------------global presets end----------------------*/


/*-------------------header----------------------*/
header {
    height: 90px;
    position:fixed;
    top:0px;
    left:0;
    right:0;
    background: white; 
    z-index: 30;
}
header .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.wrap_mobile_menu {
    position: fixed;
    top: 0;
    bottom: 0;
    left: -100%;
    width: 100%;
    transition: 0.3s;
}
.wrap_mobile_menu.opened {
    left: 0;
}
.wrap_mobile_menu_content {
    width: 240px;
    height: 100%;
    background: #F39765;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.wrap_mobile_menu .logo_in_mobile_menu {
padding: 15px 0 0 20px;
}
.wrap_mobile_menu .menu {
    padding-left: 40px;
}
.wrap_mobile_menu .menu li a {
    color: white;
    font-size: 14px;
    font-weight: 600;
    line-height: 50px;
    text-decoration: none;
    display: inline-block;
    width: 100%;
    height: 100%;
}
.wrap_mobile_menu .lang {
    margin-bottom: 20px;
    /* width: 150px; */
    
    display: inline-block;
    
    width: unset;
    max-width: unset;
}
.wrap_mobile_menu .lang .wrap_in {
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    background: white;
    padding: 20px 20px 20px 40px;
}

.menu .title {
    cursor: pointer;
}

header .lang {
    display: none;
}
header .lang span {
    display: inline-block;
    width: 30px;
    height: 20px;
}
header .lang span a:hover {
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
header .lang span.en.on {background: url(../img/lang/lang_en_on.svg);}
header .lang span.en.off {background: url(../img/lang/lang_en_off.svg);}
header .lang span.ua.on {background: url(../img/lang/lang_ua_on.svg);}
header .lang span.ua.off {background: url(../img/lang/lang_ua_off.svg);}
header .lang span.fr.on {background: url(../img/lang/lang_fr_on.svg);}
header .lang span.fr.off {background: url(../img/lang/lang_fr_off.svg);}
header .lang span.ru.on {background: url(../img/lang/lang_ru_on.svg);}
header .lang span.ru.off {background: url(../img/lang/lang_ru_off.svg);}
header .lang span a {
    display: inline-block;
    width: 100%;
    height: 100%;
}
header .btn_contact {
    display: none;
    background: #F39765;
    border-radius: 2px;
    width: 260px;
    height: 100%;
}
header .btn_contact a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-weight: bold;
    font-size: 20px;
    line-height: 30px;
    letter-spacing: -0.015em;
    text-decoration: none;
    color: white;
    transition: 0.2s;
    border: 2px solid #F39765;
}
header .btn_contact a:hover {
    background: white;
    color: #F39765;
}
@media only screen and (min-width:720px) {
    header .wrap .wrap_mobile_menu .wrap_mobile_menu_content {
        background: white;
        width: 100%;
        flex-direction: row;
        align-items: center;
    }
    header .wrap .wrap_mobile_menu .logo_in_mobile_menu {
        display: none;
    }
    .wrap_mobile_menu .menu {
        padding-left: 0;
        justify-content: space-around;
        width: 100%;
    }
    .wrap_mobile_menu .menu ul {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
    .wrap_mobile_menu .menu li {
        margin-right: 14px;
    }
    .wrap_mobile_menu .menu li:last-child {
        margin-right: 0;
    }
    .wrap_mobile_menu .menu li a {
        color: #111;
        font-size: 14px;
        line-height: 17px;
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
        display: inline-block;
        padding: 7px 10px;
        transition: 0.1s;
    }
    .wrap_mobile_menu .menu li a:hover {
        color: #F39765;
    }
    .wrap_mobile_menu .lang {
        margin: 0;
        padding: 0 40px 0 0;
        width: unset;
        flex: none;
        display: inline-flex;
        align-items: center;
    }
    .wrap_mobile_menu .lang .wrap_in {
        padding: 0;
    }
    .wrap_mobile_menu .lang span {
        /* margin-right: 10px; */
    }
    .wrap_mobile_menu .lang span:last-child {
        /* margin-right: 0; */
    }
    .wrap_mobile_menu .menu_ul {
        display: block;
    }

    header .wrap .logo,
    header .wrap .btn_contact {
        flex: none;
    }
    .wrap_mobile_menu {
        position: unset;
        width: 100%;
    }

    header .wrap .menu_hamburger {
        display: none;
    }
}
@media only screen and (min-width:1100px) {
    header .btn_contact {
        display: block;
    }
}
/*-------------------header end----------------------*/

/*-------------------main----------------------*/
.main {
    margin-top: 90px;
    padding-top: 50px;
    padding-bottom: 40px;
    padding-left: 20px;
    padding-right: 20px;
}
.main .wrap {
    background: url(../img/bg_main_light.jpg) center no-repeat;
    background-size: contain;
}
.main .wrap h1 {
    font-size: 28px;
    line-height: 35px;
    font-weight: 600;
    margin-bottom: 30px;
    color: #111;
}
.main .wrap .fly1,
.main .wrap .fly2,
.main .wrap .fly3 {
    display: none;
}
@media
    (-webkit-min-device-pixel-ratio: 2), 
    (min-resolution: 2dppx) {
    .main .wrap{
        background: url(../img/bg_main_light_2x.jpg) center no-repeat;
        background-size: contain;
    }
}
@media only screen and (min-width:768px) {
    .main {
        background: url(../img/bg_main1.jpg) center no-repeat;
        background-size: cover;
        padding-top: 100px;
        padding-bottom: 175px;
        margin-top: 220px;
        padding-left: 0;
        padding-right: 0;
    }
    .main .wrap {
        background: none;
        position: relative;
        padding-left: 20px;
        padding-right: 20px;
    }
    .main .wrap h1 {
        font-size: 46px;
        line-height: 1;
        /* font-weight: 700; */
        max-width: 570px;
    }
    .main .wrap p {
        font-size: 20px;
        line-height: 35px;
        max-width: 570px;
    }
}
@media
    (-webkit-min-device-pixel-ratio: 2) and (min-width:768px), 
    (min-resolution: 2dppx) and (min-width:768px) {
    .main {
        background: url(../img/bg_main2.jpg) center no-repeat;
    }
}
@media only screen and (min-width:900px) {
    .main .wrap .fly1 {
        position: absolute;
        width: 270px;
        height: 130px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        right: 80px;
        top: -40px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .main .wrap .fly2 {
        position: absolute;
        width: 270px;
        height: 130px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        right: 0;
        top: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .main .wrap .fly3 {
        position: absolute;
        width: 170px;
        height: 170px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        right: 60px;
        top: 240px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
@media only screen and (min-width:1100px) {
    .main .wrap .fly1 {
        right: 240px;
    }
    .main .wrap .fly2 {
        right: -60px;
    }
    .main .wrap .fly3 {
        right: 282px;
        top: 197px;
    }
}
/*-------------------main end----------------------*/

/*-------------------hero----------------------*/
.hero {
    margin-top: 90px;
    color: white;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.hero video {
    /* position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    margin: auto; */
    /* transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%; */

  position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}
.hero .inner {
    margin: 90px 0;
    padding: 20px 20px 30px;
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.hero .inner h1 {
    font-size: 28px;
    line-height: 35px;
    font-weight: 600;
    margin-bottom: 30px;
}
.hero .inner p {
    max-width: 860px;
    margin: 0 auto;
}
.hero .inner a {
    color: white;
    width: 240px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px auto 0;
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    border: 2px solid #F39765;
    text-decoration: none;
    transition: 0.3s;
    position: relative;
}
.hero .inner a:hover {
    background: white;
    color: #F39765;
}
/* .hero .inner a::before {
    position: absolute;
    content: "";
    width: 50px;
    height: 4px;
    background: white;
    left: -30px;
    top: calc(50% - 2px);
}
.hero .inner a::after {
    position: absolute;
    content: "";
    width: 50px;
    height: 4px;
    background: white;
    right: -30px;
    top: calc(50% - 2px);
} */
@media only screen and (min-width:768px) {
    .hero .inner {
        margin: 160px 0;
        padding: 50px 0 70px;
        height: 340px;
    }
    .hero .inner h1 {
        font-size: 46px;
    }
    .hero .inner p {
        font-size: 20px;
        line-height: 35px;
    }
}
/*-------------------hero end----------------------*/

/*-------------------parthner----------------------*/
.parthner {
    background: url(../img/shadow_reverse.png) bottom no-repeat;
    padding-bottom: 60px;
}
.parthner .wrap {
    background: url(../img/pic_08.png) center no-repeat;
    background-size: contain;
    padding-left: 20px;
    padding-right: 20px;
}
/* @media
    (-webkit-min-device-pixel-ratio: 2), 
    (min-resolution: 2dppx) {
    .parthner .wrap {
        background: url(../img/pic_08_2x.png) center no-repeat;
        background-size: contain;
    }
} */
.parthner .wrap .fly_img {
    display: none;
}
.parthner .wrap p.capt {
    font-size: 28px;
    line-height: 35px;
    font-weight: 600;
    margin-bottom: 30px;
}
.parthner .wrap p.text span {
    color: #F39765;
    font-weight: 700;
}
.parthner .wrap .fly1,
.parthner .wrap .fly2,
.parthner .wrap .fly3 {
    display: none;
}
@media only screen and (min-width:768px) {
    .parthner {
        padding-bottom: 0;
    }
    .parthner .wrap {
        background: url(../img/pic_08_.png) left top no-repeat;
        text-align: right;
        display: flex;
        align-items: flex-end;
        flex-direction: column;
        padding: 100px 20px;
        position: relative;
        position: relative;
    }
    

    .parthner .wrap p.capt {
        font-size: 46px;
        line-height: 1;
        font-weight: 700;
        max-width: 480px;
    }
    .parthner .wrap p.text {
        font-size: 20px;
        line-height: 35px;
        max-width: 600px;
    }
}
@media only screen and (min-width:900px) {
    .parthner .wrap .fly1 {
        position: absolute;
        width: 270px;
        height: 130px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        left: 8%;
        top: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .parthner .wrap .fly2 {
        position: absolute;
        width: 270px;
        height: 130px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        left: 1.57%;
        top: 37%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .parthner .wrap .fly3 {
        position: absolute;
        width: 270px;
        height: 130px;
        background: white;
        box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.16);
        left: 5%;
        top: 66%;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}
@media only screen and (min-width:1100px) {
    .parthner .wrap {
        background: none;
    }
    .parthner .wrap .fly_img {
        display: block;
        position: absolute;
        top: -65px;
        left: -70px;
        /* z-index: -1; */
    }
    .parthner .wrap .fly1 {
        top: 15px;
        left: 330px;
    }
    .parthner .wrap .fly2 {
        top: 186px;
        left: 30px;
    }
    .parthner .wrap .fly3 {
        top: 380px;
        left: 190px;
    }
    .parthner .wrap p.capt,
    .parthner .wrap p.text {
        z-index: 1;
    }
}
/*-------------------parthner end----------------------*/

/*-------------------services----------------------*/
.services .wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-left: 20px;
    padding-right: 20px;
}
.services .wrap figure {
    position: relative;
    width: 100%;
    max-width: 360px;
    margin: 40px 0 0;
    padding: 0 30px 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.services .wrap figure .img {
    width: 240px;
    height: 240px;
}
.services .wrap figure.services1 .img {
    background: url(../img/services/serv1.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure.services2 .img {
    background: url(../img/services/serv2.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure.services3 .img {
    background: url(../img/services/serv3.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure.services4 .img {
    background: url(../img/services/pic_PBS.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure.services5 .img {
    background: url(../img/services/pic_A.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure.services6 .img {
    background: url(../img/services/pic_BSS.svg) no-repeat center;
    background-size: contain;
}
.services .wrap figure h3 {
    margin-top: 35px;
    margin-bottom: 60px;
    font-size: 28px;
    line-height: 30px;
    position: relative;
}
.services .wrap figure:nth-child(1) h3::after {
    position: absolute;
    bottom: -30px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #F39765;
}
.services .wrap figure:nth-child(2) h3::after {
    position: absolute;
    bottom: -30px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #41A3D2;
}
.services .wrap figure:nth-child(3) h3::after {
    position: absolute;
    bottom: -30px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #88CDD3;
}
.services .wrap figure > a {
    width: 100%;
    max-width: 300px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    background: #F39765;
    color: white;
    font-weight: bold;
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border: 2px solid #F39765;
    /* margin-top: 30px; */
    transition: 0.3s;
    position: absolute;
    bottom: 0;
}
.services .wrap figure > a:hover {
    background: white;
    color: #F39765;
}
.services .wrap figure p {
    color: #454545;
}
.services .wrap figure p > a {
    text-decoration: underline;
    color: black;
}
.services .wrap figure p > a:hover {
    color: #F39765;
    text-decoration: none;
}
@media only screen and (min-width:768px) {
    .services {
        padding-top: 140px;
        padding-bottom: 140px;
    }
    .services .wrap {
        /* justify-content: space-between; */
        display: grid;
        grid-template-columns: repeat(auto-fill,minmax(320px, 1fr));
        justify-content: center;
        gap: 40px;
    }
    .services .wrap figure {
        margin: 60px auto 0;
    }
    .services .wrap figure h3 {
        margin-top: 50px;
        /* margin-bottom: 60px; */
        font-size: 32px;
        line-height: 36px;
    }
    .services .wrap figure > a {
        margin-top: 40px;
    }
}
/*-------------------services end----------------------*/

/*-------------------contact_us----------------------*/
.contact_us {
    background: url(../img/bg_contact_us.jpg) center/cover;
    padding: 45px 20px 60px;
    text-align: center;
}
.contact_us p {
    font-size: 24px;
    line-height: 30px;
    color: white;
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}
.contact_us a {
    color: white;
    width: 240px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px auto 0;
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
    border: 2px solid white;
    text-decoration: none;
    transition: 0.3s;
    position: relative;
}
.contact_us a:hover {
    background: white;
    color: #F39765;
}
.contact_us a::before {
    position: absolute;
    content: "";
    width: 50px;
    height: 4px;
    background: white;
    left: -30px;
    top: calc(50% - 2px);
}
.contact_us a::after {
    position: absolute;
    content: "";
    width: 50px;
    height: 4px;
    background: white;
    right: -30px;
    top: calc(50% - 2px);
}
@media only screen and (min-width:768px) {
    .contact_us {
        padding: 90px 20px 100px;
    }
    .contact_us p {
        font-size: 36px;
        line-height: 50px;
    }
    .contact_us a {
        margin-top: 30px;
        width: 300px;
    }
    .contact_us.big_between a {
        margin-top: 50px;
    }
}
/*-------------------contact_us end----------------------*/

/*-------------------our_clients----------------------*/
.our_clients .wrap {
    padding-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.our_clients .wrap div {
    width: 130px;
    height: 100px;
    margin: 0 10px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media only screen and (min-width:768px) {
    .our_clients .wrap {
        padding-top: 60px;
    }
    .our_clients .wrap div {
        width: 180px;
        height: 120px;
    }
}
/*-------------------our_clients end----------------------*/

/*-------------------our_clients_lenta----------------------*/
.our_clients_lenta {
    padding-top: 30px;
    padding-bottom: 30px;
    
    /* gap: 110px; */
    border-bottom: 1px solid rgba(17, 17, 17, 0.4);
    display: flex;
    overflow-x: hidden;
    /*  */
}
.our_clients_lenta .wrap_div {
    display: inline-flex;
    /* overflow: hidden;
    width: 100%; */
    /* gap: 110px; */
    /* animation: marquee 15s infinite linear; */
}
.our_clients_lenta .wrap_div div {
    width: 210px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.our_clients_lenta .div1 {
    animation: marquee1 100s infinite linear;
    animation-delay: -100s;
}
.our_clients_lenta .div2 {
    animation: marquee2 100s infinite linear;
    animation-delay: -50s;
}
@keyframes marquee1 {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

@keyframes marquee2 {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-200%);
    }
}

@media only screen and (min-width:768px) {
    /* .our_clients .wrap {
        padding-top: 60px;
    }
    .our_clients .wrap div {
        width: 180px;
        height: 120px;
    } */
}
/*-------------------our_clients_lenta end----------------------*/

/*-------------------advantages----------------------*/
.advantages {
    background: url(../img/bg_grad.jpg) top no-repeat;
}
.second_page {
    background: none;
}
.advantages .wrap {
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.advantages .wrap>div {
    padding: 40px 20px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
.advantages .wrap>div:last-child {
    margin-bottom: 0;
}
.advantages .wrap>div h3 {
    font-size: 24px;
    line-height: 30px;
    /* font-weight: 700; */
    position: relative;
}
.advantages .wrap>div p {
    margin-top: 30px;
}

.advantages .wrap>div {
    border: 2px solid #1B1B1B;
    background: #1B1B1B;
    color: white;
}

@media only screen and (min-width:768px) {
    .advantages {
        padding-bottom: 170px;
    }
    .advantages .wrap {
        padding-top: 80px;
    }
    .advantages .wrap>div {
        padding: 40px 60px;
        margin-bottom: 30px;
        border: 2px solid #F39765;
        border-image: linear-gradient(to right, #8D540D 0%, #F39765 100%);
        border-image-slice: 2;
        background: white;
        color: #111;
        cursor: pointer;
        transition: 0.2s;
    }
    .advantages .wrap>div h3 {
        font-size: 32px;
        line-height: 1;
        transition: 0.1s;
    }
    .advantages .wrap>div h3:hover {
        color: #F39765;
    }
    .advantages .wrap>div p {
        font-size: 20px;
        line-height: 30px;
        margin-top: 40px;
        display: none;
    }

    .advantages .wrap>div.open {
        padding: 40px 60px;
        margin-bottom: 30px;
        border: 2px solid #1B1B1B;
        background: #1B1B1B;
        color: white;
    }
    .advantages .wrap>div.open p {
        display: block;
    }
    .advantages .wrap>div.open h3:hover {
        color: unset;
    }

    .advantages .wrap>div h3::after {
        position: absolute;
        content: "+";
        right: 0;
        color: #111;
    }
    .advantages .wrap>div.open h3::after {
        position: absolute;
        content: "-";
        right: 0;
        color: white;
    }
    .second_page {
        padding-bottom: 130px;
    }
}
/*-------------------advantages end----------------------*/

/*-------------------adv_platrorm----------------------*/
.adv_platrorm {
    background: url(../img/shadow.png) top no-repeat;
}
.adv_platrorm .wrap {
    padding-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.adv_platrorm .wrap div {
    width: 260px;
    height: 130px;
    display: flex;
    justify-content: center;
    align-items: center;
}
@media only screen and (min-width:768px) {
    .adv_platrorm {
        padding-bottom: 130px;
    }
    .adv_platrorm .wrap {
        padding-top: 80px;
    }
    .adv_platrorm .wrap div {
        height: 170px;
        margin-left: 20px;
        margin-right: 20px;
    }
}
/*-------------------adv_platrorm end----------------------*/

/*-------------------our_focus----------------------*/
.our_focus {
    background: url(../img/bg_grad.jpg) top no-repeat;
}
.our_focus .wrap.bgmap {
    margin-top: 30px;
    padding-top: 20px;
    background: url(../img/pic_map.jpg) center no-repeat;
    background-size: contain;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
}
@media
    (-webkit-min-device-pixel-ratio: 2), 
    (min-resolution: 2dppx) {
    .our_focus .wrap.bgmap {
        background: url(../img/pic_map_2x.jpg) center no-repeat;
        background-size: contain;
    }
}
.our_focus .wrap.bgmap p {
    font-size: 24px;
    line-height: 30px;
    font-weight: 600;
    text-shadow: -3px 0 0 white, 0 -3px 0 white, -3px -3px 0 white,
        3px 0 0 white, 0 3px 0 white, 3px 3px 0 white,
        -3px 3px 0 white, 3px -3px 0 white;
}
.our_focus .wrap.bgmap p span {
    color: #F39765;
    font-weight: 700;
}

.our_focus .wrap_country {
    padding-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}
.our_focus .wrap_country p {
    width: 135px;
    height: 50px;
    background: #F39765;
    border-radius: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px;
    color: white;
}
@media only screen and (min-width:768px) {
    .our_focus {
        padding-bottom: 150px;
    }
    .our_focus .wrap {
        padding-top: 60px;
    }
    .our_focus .wrap.bgmap {
        width: 100%;
        max-width: 1000px;
        height: 448px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    .our_focus .wrap.bgmap p {
        font-size: 24px;
        line-height: 30px;
        font-weight: 600;
        text-shadow: -5px 0 0 white, 0 -5px 0 white, -5px -5px 0 white,
        5px 0 0 white, 0 5px 0 white, 5px 5px 0 white,
        -5px 5px 0 white, 5px -5px 0 white;
    }
    
    .our_focus .wrap.bgmap .text_left,
    .our_focus .wrap.bgmap .text_right {
        font-weight: bold;
        font-size: 40px;
        line-height: 1;
    }
    .our_focus .wrap.bgmap .text_left {
        align-self: flex-start;
        margin-bottom: 50px;
    }
    .our_focus .wrap.bgmap .text_right {
        align-self: flex-end;
    }
    .our_focus .wrap.bgmap p span {
        font-weight: bold;
        font-size: 88px;
        line-height: 1;
        color: #F39765;
        text-shadow: -10px 0 0 white, 0 -10px 0 white, -10px -10px 0 white,
        10px 0 0 white, 0 10px 0 white, 10px 10px 0 white,
        -10px 10px 0 white, 10px -10px 0 white;
    }

    .our_focus .wrap_country {
        padding-top: 60px;
    }
    .our_focus .wrap_country p {
        width: unset;
        height: 50px;
        padding: 0 30px;
        background: #F39765;
        border-radius: 2px;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 5px;
        color: white;
        font-size: 20px;
        line-height: 30px;
    }
}
@media only screen and (min-width:960px) {
    .our_focus .wrap.bgmap .text_right {
        margin-top: 50px;
        position: relative;
        top: -95px;
    }
}
/*-------------------our_focus end----------------------*/

/*-------------------team----------------------*/
.team {
    background: url(../img/bg_grad.jpg) top no-repeat;
}
.team .wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.team .wrap figure {
    width: 100%;
    max-width: 400px;
    display: flex;
    align-items: center;
    flex-direction: column;
    margin: 0 auto;
    margin-top: 45px;
}
.team .wrap figure div {
    width: 240px;
    height: 240px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}
.team .wrap figure div span {
    display: block;
    width: 200px;
    height: 200px;
    border-radius: 50%;
}
.team .wrap figure p.fio {
    margin-bottom: 10px;
    font-size: 28px;
    line-height: 1;
}

.team .wrap figure.team1 .img {
    border: 2px solid #2EBCE3;
}
.team .wrap figure.team2 .img {
    border: 2px solid #F39765;
}
.team .wrap figure.team3 .img {
    border: 2px solid #84CBC9;
}
.team .wrap figure.team4 .img {
    border: 2px solid #FED900;
}
.team .wrap figure.team5 .img {
    border: 2px solid #2EBCE3;
}
.team .wrap figure.team6 .img {
    border: 2px solid #F39765;
}
.team .wrap figure.team1 .img span {
    background: url(../img/photo/01_Vika_1x.jpg) no-repeat center;
    background-size: cover;
}
.team .wrap figure.team2 .img span {
    background: url(../img/photo/03_Denis_1x.jpg) no-repeat center;
    background-size: cover;
}
.team .wrap figure.team3 .img span {
    background: url(../img/photo/04_Sveta_1x.jpg) no-repeat center;
    background-size: cover;
}
.team .wrap figure.team4 .img span {
    background: url(../img/photo/05_Sergey_1x.jpg) no-repeat center;
    background-size: cover;
}
.team .wrap figure.team5 .img span {
    background: url(../img/photo/06_Anya_1x.jpg) no-repeat center;
    background-size: cover;
}
.team .wrap figure.team6 .img span {
    background: url(../img/photo/02_Vova_1x.jpg) no-repeat center;
    background-size: cover;
}
@media
    (-webkit-min-device-pixel-ratio: 2), 
    (min-resolution: 2dppx) {
    .team .wrap figure.team1 .img span {
        background: url(../img/photo/01_Vika_2x.jpg) no-repeat center;
        background-size: cover;
    }
    .team .wrap figure.team2 .img span {
        background: url(../img/photo/03_Denis_2x.jpg) no-repeat center;
        background-size: cover;
    }
    .team .wrap figure.team3 .img span {
        background: url(../img/photo/04_Sveta_2x.jpg) no-repeat center;
        background-size: cover;
    }
    .team .wrap figure.team4 .img span {
        background: url(../img/photo/05_Sergey_2x.jpg) no-repeat center;
        background-size: cover;
    }
    .team .wrap figure.team5 .img span {
        background: url(../img/photo/06_Anya_2x.jpg) no-repeat center;
        background-size: cover;
    }
    .team .wrap figure.team6 .img span {
        background: url(../img/photo/02_Vova_2x.jpg) no-repeat center;
        background-size: cover;
    }
}
@media only screen and (min-width:768px) {
    .team .wrap figure div {
        margin-left: 20px;
        margin-right: 20px;
        margin-bottom: 15px;
    }
    .team .wrap figure {
        margin-top: 50px;
    }
    .team .wrap figure p.fio {
        font-size: 32px;
    }
}
/*-------------------team end----------------------*/

/*-------------------wrap_foot----------------------*/
.wrap_foot {
    background: #0F0F0F url(../img/bg_foot.png) right no-repeat;
}
/*-------------------wrap_foot end----------------------*/

/*-------------------contact----------------------*/
.contact {
    /* background: #75777A; */
    color: white;
}
.contact>p {
    color: white;
}
.contact .wrap {
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.contact .wrap form input {
    font-family: 'Exo 2', sans-serif;
    width: 100%;
    max-width: 460px;
    height: 60px;
    border: 1px solid rgba(255,255,255,0.2);
    background: transparent;
    margin-bottom: 10px;
    padding: 0 20px;
    /* color: rgba(255,255,255,0.6); */
    color: white;
    font-size: 16px;
    line-height: 1;
}
.contact .wrap form input::placeholder,
.contact .wrap form textarea::placeholder {
    color: rgba(255, 255, 255, 0.6);
}
.contact .wrap form textarea {
    font-family: 'Exo 2', sans-serif;
    width: 100%;
    max-width: 460px;
    height: 160px;
    border: 1px solid rgba(255,255,255,0.2);
    background: transparent;
    padding: 17px 20px 0;
    /* color: rgba(255,255,255,0.6); */
    color: white;
    font-size: 16px;
    line-height: 1;
}
.contact .wrap form button {
    font-family: 'Exo 2', sans-serif;
    margin-top: 20px;
    background: #F39765;
    color: white;
    font-size: 16px;
    font-weight: 700;
    height: 60px;
    width: 100%;
    max-width: 460px;
    box-shadow: none;
    /* border: 2px solid white; */
    transition: 0.2s;
    cursor: pointer;
    outline: none;
    border: none;
}
.contact .wrap form button:hover {
    background: white;
    color: #F39765;
}
@media only screen and (min-width:768px) {
    .contact {
        /* background: #75777A url(../img/bg_contact.jpg) top no-repeat; */
    }
    .contact .wrap {
        padding-top: 60px;
    }
    .contact .wrap form {
        width: 100%;
        max-width: 960px;
        margin-left: auto;
        margin-right: auto;
    }
    .contact .wrap form .wrap_input {
        width: 100%;
        display: grid;
        grid-template-rows: 1fr 1fr 1fr 1fr;
        grid-column-gap: 40px;
        grid-auto-flow: column;
    }
    .contact .wrap form textarea {
        grid-column: 1 / -1;
        max-width: unset;
        margin-top: 30px;
    }
    .contact .wrap form button {
        max-width: 440px;
        grid-column: 1 / -1;
        justify-self: center;
    }
}
/*-------------------contact end----------------------*/

/*-------------------maps----------------------*/
.maps {
    border-top: 1px solid rgba(255,255,255,0.3);
    border-bottom: 1px solid rgba(255,255,255,0.3);
    color: white;
}
.maps__text img {
    width: 153px;
}
.maps__text h2 {
    font-size: 28px;
    line-height: 1;
    margin: 36px 0 60px;
    position: relative;
}
.maps__text h2::after {
    position: absolute;
    bottom: -30px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #F39765;
}
.maps__text p {
    color: rgba(255,255,255,0.6);
    font-weight: 300;
}
.maps__img img {
    margin-top: 40px;
    width: 100%;
    max-width: 560px;
}
@media only screen and (min-width:768px) {
    .maps .wrap {
        display: flex;
        justify-content: space-between;
        flex-direction: row-reverse;
        gap: 100px;
    }
    .maps__text {
        text-align: left;
    }
    .maps__text img {
        width: 260px;
    }
    .maps__text h2 {
        font-size: 40px;
        margin: 40px 0 65px;
    }
    .maps__text h2::after {
        bottom: -35px;
        left: 0;
    }
    .maps__text p {
        font-size: 20px;
        line-height: 30px;
        margin-top: 40px;
    }
    .maps__img img {
        margin-top: 0;
    }
}
/*-------------------maps end----------------------*/

/*-------------------link_block----------------------*/
.link_block {
    text-align: center;
    padding: 30px 0;
}
.link_block img {
    display: inline-block;
    vertical-align: top;
}
@media only screen and (min-width:768px) {
    .link_block {
        padding: 50px 0;
    }
}
/*-------------------link_block end----------------------*/

/*-------------------footer----------------------*/
footer {
    background: #F39765;
    color: white;
    text-align: center;
    padding: 30px;
    /* height: 100px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}
footer p {
    max-width: 160px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
}
footer .bold {
    font-weight: 600;
}
@media only screen and (min-width:768px) {
    footer {
        min-height: 150px;
    }
    footer p {
        max-width: 960px;
        font-size: 14px;
        line-height: 18px;
    }
}
/*-------------------footer end----------------------*/







/*-------------------contact2----------------------*/
.contact2 {
    margin-top: 90px;
    background: #75777A;
    color: white;
}
.contact2 h1 {
    font-size: 28px;
    line-height: 35px;
    font-weight: 600;
    margin-bottom: 30px;
    padding: 0 20px;
}
.contact2>p {
    color: white;
}
.contact2 .wrap {
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.contact2 .wrap form .wrap_input {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
/* .contact2 .wrap form .wrap_input .item {
    display: flex;
    flex-direction: column;
    text-align: left;
    gap: 8px;
    position: relative;
} */
.contact2 .wrap form .wrap_input {
    display: grid;
    /* grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); */
    grid-template-columns: 1fr;
    grid-template-rows: min-content min-content min-content min-content min-content min-content;
    gap: 16px;
}
.contact2 .wrap form .wrap_input .item {
    /* display: flex;
    flex-direction: column;
    gap: 8px; */
    text-align: left;
}
.contact2 .wrap form .wrap_input .item p {
    font-size: 11px;
    opacity: 0.8;
}
.contact2 .wrap form .wrap_input .item label {
    font-size: 16px;
    margin-bottom: 8px;
    display: block;
}
.contact2 .wrap form .wrap_input .item p {
    font-size: 11px;
    opacity: 0.7;
}
.contact2 .wrap form input {
    font-family: 'Exo 2', sans-serif;
    width: 100%;
    /* max-width: 460px; */
    height: 60px;
    border: 2px solid white;
    background: transparent;
    padding: 0 20px;
    color: white;
    font-size: 16px;
    line-height: 1;
    outline: none;
}
.contact2 .wrap form input::placeholder,
.contact2 .wrap form textarea::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.contact2 .wrap form select {
    font-family: 'Exo 2', sans-serif;
    width: 100%;
    /* max-width: 460px; */
    height: 60px;
    border: 2px solid white;
    background: transparent;
    padding: 0 20px;
    color: white;
    font-size: 16px;
    line-height: 1;
    outline: none;
}
.contact2 .wrap form select option {
    font-family: 'Exo 2', sans-serif;
    font-size: 16px;
    line-height: 1;
    border: 2px solid white;
    background: transparent;
    color: black;
    outline: none;
}

.contact2 .wrap form input[type="range"] {
    height: unset;
    appearance: none;
    height: 5px;
    padding: 0;
    background: white;
}
.contact2 .wrap form input[type="range"]::-webkit-slider-runnable-track {
    box-sizing: border-box;
    height: 5px;
    background-color: white;
}
.contact2 .wrap form input[type="range"]::-moz-range-track {
    box-sizing: border-box;
    background-color: white;
  }
.contact2 .wrap form input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    margin-top: -7.5px;
    border: none;
    border-radius: 50%;
    background: white;
    box-shadow: 0 0 0 4px inset #F39765;
    transition: 300ms;
}
.contact2 .wrap form input[type="range"]::-moz-range-thumb {
    width: 20px;
    height: 20px;
    margin-top: 0;
    border: none;
    border-radius: 50%;
    background: white;
    box-shadow: 0 0 0 4px inset #F39765;
    transition: 300ms;
}
.contact2 .wrap form input[type="range"] + .scale-labels {
    display: flex;
    justify-content: space-between;
}

.contact2 .wrap form textarea {
    font-family: 'Exo 2', sans-serif;
    width: 100%;
    /* max-width: 460px; */
    height: 160px;
    border: 2px solid white;
    background: transparent;
    padding: 17px 20px 0;
    color: white;
    font-size: 16px;
    line-height: 1;
    outline: none;
}
/* .contact2 .wrap form label.input-file */

/* .contact2 .wrap form input[type="file"] {
    position: absolute;
	z-index: -1;
	opacity: 0;
	display: block;
	width: 0;
	height: 0;
}
.contact2 .wrap form .wrap_input .item.upload {
    padding-top: 33px;
}
.contact2 .wrap form .wrap_input .item.upload label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: 'Exo 2', sans-serif;
    min-width: 50%;
    max-width: 460px;
    height: 60px;
    border: 2px solid white;
    background: transparent;
    padding: 0 20px;
    color: white;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: 0.2s;
}
.contact2 .wrap form .wrap_input .item.upload label:hover {
    background: white;
    color: black;
}
.contact2 .wrap form .input-file-btn {
    display: none;
}
.contact2 .wrap form .desc {
    padding-top: 16px;
    text-align: left;
} */
.contact2 .wrap form .wrap_input .item .label {
    display: block;
    margin-bottom: 8px;
}
.contact2 .wrap form input[type="file"] {
    display: none;
}
.contact2 .wrap form .wrap_input .item.upload label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: 'Exo 2', sans-serif;
    /* min-width: 50%; */
    /* max-width: 460px; */
    height: 60px;
    border: 2px solid white;
    background: transparent;
    padding: 0 20px;
    color: white;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: 0.2s;
}
.contact2 .wrap form .wrap_input .item.upload label:hover {
    background: white;
    color: black;
}
.contact2 .wrap form .wrap_input .item.upload label span {
    display: inline-block;
    margin-left: 8px;
    font-size: 11px;
    opacity: 0.6;
}
.contact2 .wrap form .wrap_input .item.upload .upload_file {
    display: none;
    gap: 16px;
    justify-content: center;
    align-items: center;
    font-family: 'Exo 2', sans-serif;
    /* max-width: 460px; */
    height: 60px;
    border: 2px solid white;
    background: transparent;
    padding-left: 20px;
    color: white;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    transition: 0.2s;
}
.contact2 .wrap form .wrap_input .item.upload .upload_file .upload_close {
    flex: none;
    position: relative;
    width: 60px;
    height: 60px;
}
.contact2 .wrap form .wrap_input .item.upload .upload_file .upload_close:hover {
    opacity: 0.7;
}
.contact2 .wrap form .wrap_input .item.upload .upload_file .upload_close::before {
    position: absolute;
    content: "";
    top: calc(50% - 1px);
    right: calc(50% - 15px);
    width: 50%;
    height: 2px;
    background: white;
    transform: rotate(45deg);
}
.contact2 .wrap form .wrap_input .item.upload .upload_file .upload_close::after {
    position: absolute;
    content: "";
    top: calc(50% - 1px);
    right: calc(50% - 15px);
    width: 50%;
    height: 2px;
    background: white;
    transform: rotate(-45deg);
}
.contact2 .wrap form .wrap_input .item.upload .alert {
    display: none;
}
.contact2 .wrap form .wrap_input .item.upload .alert span {
    display: inline-block;
    padding: 0 10px;
    color: red;
    background: white;
}

.contact2 .wrap form button {
    font-family: 'Exo 2', sans-serif;
    margin-top: 20px;
    background: white;
    color: #F39765;
    font-size: 16px;
    font-weight: 700;
    height: 60px;
    width: 100%;
    max-width: 460px;
    box-shadow: none;
    border: 2px solid white;
    transition: 0.2s;
    cursor: pointer;
}
.contact2 .wrap form button:hover {
    background: #F39765;
    color: white;
}
@media only screen and (min-width:768px) {
    .contact2 {
        background: #75777A url(../img/bg_contact.jpg) top no-repeat;
        background-size: cover;
    }
    .contact2 h1 {
        font-size: 46px;
        line-height: 1;
        font-weight: 700;
        max-width: 600px;
        margin: 0 auto;
    }
    .contact2 .wrap {
        padding-top: 60px;
    }
    .contact2 .wrap form {
        width: 100%;
        max-width: 960px;
        margin-left: auto;
        margin-right: auto;
    }
    /* .contact2 .wrap form .wrap_input {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px,1fr));
        gap: 16px;
    } */
    .contact2 .wrap form .wrap_input {
        /* display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: min-content min-content min-content min-content min-content;
        gap: 16px; */
        grid-template-columns: 1fr 1fr;
    }
    .contact2 .wrap form .wrap_input .item.x2 {
        grid-column: 1/-1;
    }
    .contact2 .wrap form textarea {
        /* grid-column: 1 / -1;
        max-width: unset; */
        /* margin-top: 30px; */
    }
    .contact2 .wrap form .desc {
        padding-top: 0;
        text-align: center;
    }
    .contact2 .wrap form button {
        max-width: 440px;
        grid-column: 1 / -1;
        justify-self: center;
    }
}
/*-------------------contact2 end----------------------*/


/*-------------------approach----------------------*/
.approach {
    background: url(../img/bg_approach.png) center no-repeat;
    background-size: cover;
    color: white;
    padding-top: 70px;
    padding-bottom: 70px;
}
.approach .wrap {
    margin-top: 60px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px;
    padding-left: 20px;
    padding-right: 20px;
}
.approach .wrap figure {
    position: relative;
    width: 100%;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.approach .wrap figure .img {
    width: 230px;
    height: 230px;
}
.approach .wrap figure h3 {
    margin-top: 35px;
    margin-bottom: 60px;
    font-size: 28px;
    line-height: 30px;
    position: relative;
}
.approach .wrap figure h3::after {
    position: absolute;
    bottom: -30px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #FFD800;
}
.services .wrap figure p {
    font-size: 14px;
    line-height: 25px;
}
@media only screen and (min-width:768px) {
    .approach {
        padding-top: 130px;
        padding-bottom: 110px;
    }
    .approach .wrap {
        margin-top: 70px;
    }
    .approach .wrap figure h3 {
        margin-top: 60px;
        margin-bottom: 80px;
        font-size: 32px;
        line-height: 1;
    }
    .approach .wrap figure h3::after {
        bottom: -40px;
    }
}
@media only screen and (min-width:960px) {
    .approach .wrap {
        justify-content: space-between;
    }
}
/*-------------------approach end----------------------*/

/*-------------------capabilities----------------------*/
.capabilities {
    padding-left: 20px;
    padding-right: 20px;
}
.capabilities .wrap {
    margin-top: 60px;
}
.capabilities .wrap .item {
    display: flex;
    flex-direction: column;
    margin-top: 40px;
}
.capabilities .wrap .item .img img {
    width: 100%;
    max-width: 460px;
}
.capabilities .wrap .item .text {
    margin-top: 40px;
}
.capabilities .wrap .item .text h3 {
    margin-bottom: 50px;
    position: relative;
    font-size: 28px;
    line-height: 1;
}
.capabilities .wrap .item .text h3::after {
    position: absolute;
    bottom: -20px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #F39765;
}
@media only screen and (min-width:768px) {
    .capabilities .wrap {
        margin-top: 100px;
    }
    .capabilities .wrap .item {
        margin-top: 90px;
        flex-direction: row;
        justify-content: space-between;
        gap: 40px;
    }
    .capabilities .wrap .item:nth-child(even) {
        flex-direction: row-reverse;
    }
    .capabilities .wrap .item > div {
        width: 50%;
    }
    .capabilities .wrap .item .text {
        margin-top: 0;
        text-align: left;
    }
    .capabilities .wrap .item .text h3 {
        margin-bottom: 90px;
        font-size: 32px;
    }
    .capabilities .wrap .item .text h3::after {
        bottom: -40px;
        left: 0;
    }
}
@media only screen and (min-width:960px) {
    .capabilities .wrap .item {
        gap: 100px;
    }
    .capabilities .wrap .item:nth-child(odd) .img {
        width: 460px;
    }
    .capabilities .wrap .item:nth-child(odd) .text {
        flex-grow: 1;
    }
    .capabilities .wrap .item:nth-child(odd) .text p {
        max-width: 500px;
    }
    .capabilities .wrap .item:nth-child(even) .img {
        flex-grow: 1;
        display: flex;
        justify-content: flex-end;
    }
    .capabilities .wrap .item:nth-child(even) .text {
        width: 460px;
    }
}
/*-------------------capabilities end----------------------*/


/*-------------------support----------------------*/
.support {
    padding-left: 20px;
    padding-right: 20px;
    text-align: center;
    background: url(../img/shadow_reverse.png) bottom no-repeat;
}
.support .capt {
    font-size: 28px;
    line-height: 35px;
    margin-bottom: 30px;
    background-image: linear-gradient(to right, #21546C 0%, #41A3D2 82%);
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-align: left;
}
.support .wrap p.text {
    max-width: 880px;
    text-align: left;
}
@media only screen and (min-width:768px) {
    .support .capt {
        font-size: 46px;
        line-height: 56px;
        margin-bottom: 35px;
        text-align: center;
    }
    .support .wrap p.text {
        font-size: 20px;
        line-height: 35px;
        text-align: center;
        margin: 0 auto;
    }
}
/*-------------------support end----------------------*/

/*-------------------service_models----------------------*/
.service_models {
    padding: 70px 20px;
}
.service_models .wrap {
    margin-top: 70px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.service_models .item .img {
    aspect-ratio: 440/300;
    max-width: 440px;
    margin: 0 auto;
}
.service_models .item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.service_models .item h3 {
    margin: 50px 0 65px;
    font-size: 28px;
    position: relative;
}
.service_models .item h3::before {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    background: #41A3D2;
    bottom: -30px;
    left: calc(50% - 50px);
}
.service_models .item p {
    font-size: 14px;
    line-height: 24px;
    max-width: 360px;
    margin: 0 auto;
}
@media only screen and (min-width:768px) {
    .service_models {
        padding: 120px 20px 90px;
    }
    .service_models .wrap {
        max-width: 1040px;
        margin-top: 90px;
        flex-direction: row;
        justify-content: space-between;
    }
    .service_models .item h3 {
        font-size: 32px;
    }
}
/*-------------------service_models end----------------------*/

/*-------------------roles----------------------*/
.roles {
    padding: 70px 20px;
    background: url(../img/bg_blue.jpg) top center no-repeat;
    background-size: cover;
    color: white;
}
.roles .wrap {
    margin-top: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
}
.roles .item {
    max-width: 500px;
    width: 100%;
}
.roles .item .img {
    width: 230px;
    height: 230px;
    margin: 0 auto;
}
.roles .item .img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.roles .item h3 {
    margin: 50px 0 80px;
    font-size: 28px;
    position: relative;
}
.roles .item h3::before {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    background: #88CDD3;
    bottom: -40px;
    left: calc(50% - 50px);
}
.roles .item p {
    font-size: 14px;
    line-height: 24px;
    /* max-width: 360px; */
    margin: 0 auto;
}
@media only screen and (min-width:768px) {
    .roles {
        padding: 120px 20px 90px;
        background: url(../img/bg_blue.jpg) top right no-repeat;
        background-size: cover;
    }
    .roles .wrap {
        max-width: 1120px;
        margin-top: 100px;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 70px 80px;
    }
    .roles .item h3 {
        font-size: 32px;
    }
}
/*-------------------roles end----------------------*/

/*-------------------how----------------------*/
.how {
    padding: 70px 20px;
    background: url(../img/shadow_reverse.png) bottom no-repeat;
}
.how .wrap {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 45px;
}
.how .wrap .item {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.how .wrap .item .step {
    font-size: 28px;
}
.how .wrap .item .img {
    width: 100px;
    height: 100px;
    margin: 27px 0 22px;
    position: relative;
}
.how .wrap .item .img .dot {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.how .wrap .item .img .dot_mobile {
    position: absolute;
    width: 230px;
    top: calc(50% - 9px);
    left: calc(50% - 115px);
}
.how .wrap .item .img .dot_desktop,
.how .wrap .devider {
    display: none;
}
.how .wrap .item .desc {
    font-size: 16px;
    line-height: 28px;
    color: #454545;
}
.how .br_hide {
    display: none;
}
@media only screen and (min-width:768px) {
    .how {
        padding: 120px 20px 110px;
    }
    .how .wrap {
        margin-top: 90px;
        /* flex-direction: row; */
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        align-items: stretch;
        gap: 30px;
        position: relative;
        max-width: 1160px;
    }
    .how .wrap .item {
        flex-direction: column-reverse;
        justify-content: space-between;
    }
    .how .wrap .item .step {
        font-size: 32px;
        line-height: 1;
        flex: none;
    }
    .how .wrap .item .img {
        margin: 100px 0 30px;
        flex: none;
    }
    .how .wrap .item .img .dot_mobile {
        display: none;
    }
    .how .wrap .item .img .dot_desktop {
        display: block;
        position: absolute;
        left: calc(50% - 9px);
        bottom: 100%;
    }
    .how .wrap .devider {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        bottom: 110px;
        width: 100%;
    }
    .how .wrap .item .desc {
        font-size: 20px;
        line-height: 35px;
        flex-grow: 1;
    }
    .how .br_hide {
        display: block;
    }
}
/*-------------------how end----------------------*/

/*-------------------how_green----------------------*/
.how_green {
    padding: 70px 20px;
    background: url(../img/bg_green_mobile.jpg) top center no-repeat;
    background-size: cover;
    color: white;
}
.how_green .wrap {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 45px;
}
.how_green .wrap .item {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.how_green .wrap .item .step {
    font-size: 28px;
}
.how_green .wrap .item .img {
    width: 100px;
    height: 100px;
    margin: 27px 0 22px;
    position: relative;
}
.how_green .wrap .item .img .dot {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.how_green .wrap .item .img .dot_mobile {
    position: absolute;
    width: 230px;
    top: calc(50% - 9px);
    left: calc(50% - 115px);
}
.how_green .wrap .item .img .dot_desktop,
.how_green .wrap .devider {
    display: none;
}
.how_green .wrap .item .desc {
    font-size: 16px;
    line-height: 28px;
}
.how_green .br_hide {
    display: none;
}
@media only screen and (min-width:768px) {
    .how_green {
        padding: 120px 20px 110px;
        background: url(../img/bg_green.jpg) top center no-repeat;
        background-size: cover;
    }
    .how_green .wrap {
        margin-top: 90px;
        /* flex-direction: row; */
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        align-items: stretch;
        gap: 30px;
        position: relative;
        max-width: 1160px;
    }
    .how_green .wrap .item {
        flex-direction: column-reverse;
        justify-content: space-between;
    }
    .how_green .wrap .item .step {
        font-size: 32px;
        line-height: 1;
        flex: none;
    }
    .how_green .wrap .item .img {
        margin: 100px 0 30px;
        flex: none;
    }
    .how_green .wrap .item .img .dot_mobile {
        display: none;
    }
    .how_green .wrap .item .img .dot_desktop {
        display: block;
        position: absolute;
        left: calc(50% - 9px);
        bottom: 100%;
    }
    .how_green .wrap .devider {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        bottom: 110px;
        width: 100%;
    }
    .how_green .wrap .item .desc {
        font-size: 20px;
        line-height: 35px;
        flex-grow: 1;
    }
    .how_green .br_hide {
        display: block;
    }
}
/*-------------------how_green end----------------------*/

/*-------------------why----------------------*/
.why {
    /* padding: auto 20px; */
    padding-left: 20px;
    padding-right: 20px;
}
.why .wrap {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
}
.why .wrap.gradient_blue .item {
    padding: 50px 20px;
    border: 2px solid red;
    border-image: linear-gradient(#41A3D2 0%, #235771 100%);
    border-image-slice: 2;
    width: 100%;
    max-width: 360px;
}
.why .wrap.gradient_green .item {
    padding: 50px 20px;
    border: 2px solid red;
    border-image: linear-gradient(#88CDD3 0%, #25666F 100%);
    border-image-slice: 2;
    width: 100%;
    max-width: 360px;
}
.why .wrap .item .img {
    width: 136px;
    height: 136px;
    margin: 0 auto;
}
.why .wrap .item .img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.why .wrap .item h3 {
    margin: 20px 0 30px;
    font-size: 28px;
}
@media only screen and (min-width:768px) {
    .why {
        padding: 130px 20px 210px;
    }
    .why .wrap {
        margin-top: 100px;
    }
    .why .wrap.gradient_blue .item {
        padding: 40px 60px;
        display: flex;
        align-items: center;
        gap: 60px;
        max-width: 960px;
        border-image: linear-gradient(to right, #41A3D2 0%, #235771 100%);
        border-image-slice: 2;
    }
    .why .wrap.gradient_green .item {
        padding: 40px 60px;
        display: flex;
        align-items: center;
        gap: 60px;
        max-width: 960px;
        border-image: linear-gradient(to right, #88CDD3 0%, #25666F 100%);
        border-image-slice: 2;
    }
    .why .wrap .item .img {
        flex: none;
    }
    .why .wrap .item h3 {
        margin: 0;
        font-size: 32px;
    }
    .why .wrap .item .desc {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        gap: 40px;
        text-align: left;
    }
    .why .wrap .item p {
        font-size: 20px;
        line-height: 35px;
    }
}
/*-------------------why end----------------------*/

/*-------------------solutions----------------------*/
.solutions {
    padding: 75px 20px 95px;
}
.solutions .wrap {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    gap: 70px;
    max-width: 960px;
}
.solutions .wrap .item {
    display: flex;
    flex-direction: column;
    /* margin-top: 40px; */
}
.solutions .wrap .item .img img {
    width: 100%;
    max-width: 460px;
    display: block;
}
.solutions .wrap .item .text h3 {
    margin: 35px 0 70px;
    position: relative;
    font-size: 28px;
    line-height: 1;
}
.solutions .wrap .item .text h3::after {
    position: absolute;
    bottom: -40px;
    left: calc(50% - 50px);
    content: "";
    width: 100px;
    height: 2px;;
    background: #88CDD3;
}
.solutions .wrap .item .text p {
    font-size: 14px;
    line-height: 25px;
    color: #454545;
    max-width: 400px;
}
.solutions .wrap .item .text a {
    margin-top: 40px;

}
.solutions .wrap .item a {
    margin: 40px auto 0;
    width: 100%;
    max-width: 300px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #F39765;
    background: white;
    font-weight: bold;
    font-size: 20px;
    line-height: 25px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border: 2px solid #F39765;
    transition: 0.3s;
}
.solutions .wrap .item a:hover {
    color: white;
    background: #F39765;
}
@media only screen and (min-width:768px) {
    .solutions {
        padding: 120px 20px 180px;
    }
    .solutions .wrap {
        margin-top: 100px;
    }
    .solutions .wrap .item {
        flex-direction: row;
        gap: 50px;
        text-align: left;
    }
    .solutions .wrap .item .text h3 {
        margin: 0 0 80px;
        position: relative;
    }
    .solutions .wrap .item .text h3::after {
        left: 0;
    }
    .solutions .wrap .item > div {
        width: 50%;
    }
    
    .solutions .wrap .text {
        flex-grow: 1;
        align-items: flex-start;
    }
    .solutions .wrap .item a {
        margin: 45px 0 0;
    }
}
@media only screen and (min-width:1020px) {
    .solutions .wrap .item {
        gap: 100px;
    }
    .solutions .wrap .item > div {
        width: unset;
    }
    .solutions .wrap .item .img {
        flex: none;
    }
}
/*-------------------solutions end----------------------*/