@font-face {
    font-family: 'Aeroport';
    src: url("../fonts/Aeroport-bold.ttf");
    font-weight: 700;
    font-style: normal ;
}

@font-face {
    font-family: 'Aeroport';
    src: url("../fonts/Aeroport-regular.otf");
    font-weight: normal;
    font-style: normal ;
}

* {
    font-family: 'Aeroport', serif;
    color: #354151;
    font-size: 20px;
    line-height: 30px;
    outline: 0 !important;
}

a {
    text-decoration: none;
}

body {
    margin: 0;
    padding-top: 68px;
}

p {
    margin: 0;
}

section {
    border-top: 1px solid transparent;
}

nav {
    padding: 0 20px;
    background: #ffffff;
    position: fixed;
    width: 100%;
    box-sizing: border-box;
    z-index: 2;
    top: 0;
}

.top-bar {
    background: #ffffff;
    padding: 10px 0;
    position: relative;
}


.open nav {
    height: 100vh;
    overflow: scroll;
}

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

ul {
    list-style: none;
    padding-left: 0;
}

.logo {
    float: left;
    display: block;
    
}

.menu {
    margin-top: 60px;
}

.menu-button {
    background: url("../img/hamburger.svg") no-repeat;
    height: 14px;
    width: 30px;
    border: none;
    float: right;
    margin-top: 13px;
    top: 0;
}

.menu-button:hover {
    background-image: url("../img/hamburger-hover.svg");
}

body.open {
    overflow: hidden;
}


.open .menu-button {
    background-image: url("../img/close.svg");
    height: 23px;
    width: 23px;
    position: absolute;
    right: 0;
    z-index: 1;
}

.open .menu-button :hover {
    background-image: url("../img/close-hover.svg");
}

.menu-wrapper {
    display: none;
}

.open .menu-wrapper {
    display: block;
}

.icon-key {
    width: 20px;
    height: 8px;
    display: inline-block;
    background-image: url("../img/key.svg");
    background-repeat: no-repeat;
}

a:focus .icon-key {
    background-image: url("../img/key-focus.svg");
}


nav .menu li {
    margin-bottom: 20px;
}


nav .menu li a:hover,
nav .languages li a:not(.active):hover {
    color: #8FC3FF;
}


nav .menu li a:focus,
nav .languages li a:focus {
    color: #147EF9;
}

.city {
    color: #7C8C9D;
    display: block;
    margin-bottom: 10px;
}

.phone-number {
    font-size: 24px;
    line-height: 34px;
    display: block;
    margin-bottom: 10px;
}

.phone-number-footer:hover,
.phone-number:hover,
.email:hover {
    color: #463ACD;
}

.social-links {
    margin-bottom: 40px;
}

.social-links li,
.languages li {
    display: inline;
}

.social-icon.instagram {
    /*background-image: url("../img/instagram-icon.svg"),url("../img/instagram-icon-hover.svg");*/
    /*background-size: auto, auto;*/
    fill: #8FC3FF !important;
}

.social-icon.instagram:hover svg circle,
.social-icon.instagram:hover svg ellipse {
    /*background-image: url("../img/instagram-icon-hover.svg");*/
    fill: #8FC3FF;
}

.social-icon.facebook {
    background-image: url("../img/facebook-icon.svg");
}

.social-icon.facebook:hover svg ellipse {
    /*background-image: url("../img/facebook-icon-hover.svg");*/
    fill: #8FC3FF;
}

.social-icon {
    width: 26px;
    height: 26px;
    display: inline-block;
    margin-right: 10px;
}

.languages a.active {
    border-bottom: 1px solid #8FC3FF;;
}


section {
    padding: 0 20px;
}

h1 {
    margin: 30px 0 10px;
    margin-top: 100px;
}

p {
    font-size: 14px;
    line-height: 26px;
    color: #7C8C9D;
    margin-bottom: 10px;
}

.img-small {
    width: 100%;
    height: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

.blue-btn {
    background: #8FC3FF;
    border-radius: 5px;
    color: #FFFFFF;
    border: none;
    padding: 10px 35px;
    margin: 10px 0 0;
    width: 100%;
    cursor: pointer;
}

*:not(.slick-track):not(.slick-list) {
    -webkit-transition: all 0.4s ease;;
    -moz-transition: all 0.4s ease;;
    -o-transition: all 0.4s ease;;
    transition: all 0.4s ease;
}

.blue-btn:hover {
    background-color: #459BFF;
}

.blue-btn:active {
    background-color: #147EF9 !important;
}

h2 {
    font-size: 28px;
    margin-top: 80px;
    text-align: center;
    margin-bottom: 30px;
    width: 100%;
}

@media (max-width: 768px) {
    #page-3 h2 {
        margin-top: 60px;
    }

    .opportunities .slick-dots {
        position: absolute;
        bottom: -15px;
    }

    #page-3 h2 {
        margin-bottom: 20px;
    }

    #page-4 h2 {
        margin-top: 50px;
    }

    .img-service {
        height: 230px;
    }

    #page-7 h6 {
        margin-top: 60px;
    }

    #page-7 .page-inner img {
        margin: 20px auto 40px;
    }
}

.slick-dots {
    position: static;
}

.slick-arrow:before {
    content: "";
    display: inline-block;
    width: 25px;
    height: 25px;
    opacity: 1 !important;
    background-repeat: no-repeat;
    background-size: contain;
}

.slick-prev {
    left: 15px;
}

.slick-next {
    right: 15px;
}

.slick-prev, .slick-next {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    z-index: 1;
    top: 50%;
}


.slick-prev:before {
    background-image: url("../img/left-arrow.svg");
    background-color: #fff;
    border-radius: 50%;
}

.slick-prev.slick-disabled:before {
    background-image: url("../img/left-arrow-disabled.svg") !important;
}

.slick-prev:hover:before {
    background-image: url("../img/left-arrow-hover.svg");
}

.slick-prev:active:before {
    background-image: url("../img/left-arrow-active.svg");
}

.slick-next:before {
    background-image: url("../img/right-arrow.svg");
    background-color: #fff;
    border-radius: 50%;
}

.slick-next.slick-disabled:before {
    background-image: url("../img/right-arrow-disabled.svg") !important;
}

.slick-next:hover:before {
    background-image: url("../img/right-arrow-hover.svg");
}

.slick-next:active:before {
    background-image: url("../img/right-arrow-active.svg");
}

.slick-dots li button:before {
    color: rgba(196, 196, 196, 0.5);
    opacity: 1;
}

.slick-dots li.slick-active button:before {
    color: #C4C4C4;
    opacity: 1;
}

.opportunity {
    padding: 0 40px;
}

.opportunity img,
.cost img,
.service img {
    margin: 0 auto;
}

.opportunity img {
    height: 70px;
}

/*.component {
    padding: 0 38px;
}*/


.opportunity img,
.opportunity svg,
.component-body img,
.component-body svg {
    display: block;
    margin: 0 auto;
}

.svg-wrapper {
    height: 55px;
}

.service:hover svg *,
.opportunity:hover svg *,
.component.slick-current .component-body:hover svg * {
    stroke: #8FC3FF !important;
}

.component-body:active svg * {
    stroke: #147EF9 !important;
}

.opportunity *,
.component-body *,
.services * {
    text-align: center;
}

.opportunity h4 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.component-body {
    background: #FFFFFF;
    box-shadow: 0 0 16px rgba(196, 196, 196, 0.5);
    border-radius: 10px;
    padding: 0px;
    margin-bottom: 10px;
    text-align: center;
}

.component-body span {
    width: 100%;
    text-align: center;
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: #7C8C9D;

}

#page-3 .slick-next,
#page-3 .slick-prev {
    top: 25%;
}

.components .slick-list,
.costs .slick-list {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

#page-3 h2 {
    /*margin-bottom: 5px;*/
}

.component:not(.slick-current) {
    opacity: 0;
}

.component-footer {
    border: 2px solid #E7E7E7;
    border-radius: 10px;
}

.component-footer li {
    padding: 20px 10px;
    background: #fff;
}

.component-footer li:first-child {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.component-footer li:last-child {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}


.component-footer li:not(:last-child) {
    border-bottom: 2px solid #E7E7E7;
}

.component-footer li span {
    font-size: 14px;
    line-height: 20px;
    color: #7C8C9D;
    position: relative;
    padding-left: 25px;
    display: inline-block;
}


.component-footer li span:before {
    background-image: url("../img/check-mark.svg");
    width: 20px;
    height: 15px;
    display: inline-block;
    content: '';
    position: absolute;
    top: 7px;
    left: 0;
}

.img-service {
    max-height: 268px;
}

#page-4 {
    background-image: url("../img/service-bg-2.svg"), url("../img/service-bg-3.svg");
    background-repeat: no-repeat;
    background-position: right bottom, right bottom;
    background-size: 65%;
}

.component h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    border-bottom: 0px solid rgba(53, 65, 81, 0.3);
    display: inline-block;
    transition: none !important;
}


.component.slick-current .component-body:hover h3 {
    border-bottom: none;
    margin-bottom: 11px;
}

#page-5 {
    background-image: url("../img/application-bg-1.svg");
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: 20px bottom;
}

.tabs {
    font-size: 0;
}

.tabs li {
    display: inline-block;
    background: #FFFFFF;
    width: 50%;
}

.tabs li a {
    font-size: 18px;
    line-height: 28px;
    color: #747474;
    border: 1px solid #C4C4C4;
    padding: 5px 40px;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;

}


.d-none {
    display: none !important;
}

.application {
    text-align: center;
}


.application h5 {
    margin-top: 20px;
    margin-bottom: 10px;
}

.application p {
    margin-bottom: 20px;
}

.application a {
    font-size: 14px;
    line-height: 22px;
    color: #463ACD;
    border-bottom: 1px solid rgba(70, 58, 205, 0.3);
    margin-bottom: 20px;
    display: inline-block;
    transition: none;
}

.applications .show-screenshots:hover {
    border: none
}

.applications .show-screenshots:active {
    color: #1600FF;
}

.application-image {
    width: 100%;
}

.costs .slick-prev {
    left: 0;
}

.costs .slick-next {
    right: 0;
}

.cost-wrapper {
    padding: 0 35px;
}

.cost {
    background: #FFFFFF;
    box-shadow: 0 0 20px #E0E0E0;
    padding: 20px;
}

#page-6 h2 {
    /*margin-bottom: 5px;*/
}

.cost h5 {
    text-align: center;
    font-size: 24px;
    line-height: 34px;
    margin-top: 10px;
    margin-bottom: 20px;

}

.arenda {
    background: url("../img/arenda.svg") no-repeat top right;
}

.arenda2 {
    background: url("../img/arenda2.svg") no-repeat top right;
}

.dorogo {
    background: url("../img/dorogo.svg") no-repeat top right;
}

.ask {
    background: url("../img/ask.svg") no-repeat top right;
}

.cost ul {
    list-style: disc;
    padding-left: 20px;
}

.cost li {
    color: #463ACD;;
    margin-bottom: 10px;
}

.cost li span {
    color: #7C8C9D;
    font-size: 14px;
    line-height: 22px;
}

h6 {
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
}

form span a {
    border-bottom: 1px solid rgba(196, 196, 196, 0.4);
}

form input {
    padding: 10px 20px;
    border: 1px solid #C4C4C4;
    border-radius: 100px;
    margin-bottom: 10px;
    box-sizing: border-box;
    width: 100%;
    background: transparent;
    box-shadow: none;
}

form select {
    padding: 10px 20px;
    border: 1px solid #C4C4C4;
    border-radius: 100px;
    margin-bottom: 10px;
    box-sizing: border-box;
    width: 100%;
    background: transparent;
    box-shadow: none;
}


form .blue-btn {
    margin: 10px 0 0;
    width: 100%;
}

form span a,
form span {
    font-size: 14px;
    line-height: 20px;
    color: #7C8C9D;
}

.invalid {
    border-color: #FF7373 !important;
}

.invalid::placeholder {
    color: #FF7373;
}

input:active,
input:focus {
    border-color: #354151;
}


#page-7 {
    padding: 0;
}

#page-7 .page-inner {
    background-image: url("../img/contact-bg-2.svg");
    background-repeat: no-repeat;
    background-position: -80px bottom;
    background-size: 125%;
    padding: 0 20px;
}

#page-7 img {
    height: 268px;
    display: block;
    margin: 0 auto 40px;
}

.copyright {
    float: left;
}

.developer {
    float: right;

}

.developer-icon {
    width: 38px;
    height: 15px;
    background-image: url("../img/developer-icon.svg");
    border-bottom: none !important;
    display: inline-block;
}

footer {
    padding: 0 20px 20px;

}

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

.service h4 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.show-768 {
    display: none;
}

.cost {
    padding-bottom: 40px;
}

.services .slick-prev {
    left: 5px;
    top: 33%;
}

.services .slick-next {
    right: 5px;
    top: 33%;
}

.component svg {
    /*overflow: visible*/
}


.right-block {
    padding: 20px 100px;
    cursor: pointer;
    position: relative;
    z-index: 1;
}


section {
    height: auto;
}

@media (max-width: 480px) {
    .right-block {
        padding: 0;
    }
}


.opportunity img {
    height: 55px;
}

.opportunities .slick-prev,
.components .slick-prev {
    left: 0;
}

.components .slick-prev,
.opportunities .slick-next {
    right: 0;
}

object {
    height: 50px;
}


form input {
    font-size: 14px;
    /* Remove First */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

form select {
    font-size: 14px;
    /* Remove First */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/*.svg-wrapper {
    display: none;
}*/

.emb {
    display: block;
    margin: auto;
}

@media (min-width: 768px) {

    .svg-wrapper {
        display: block;
    }

    .component-body .emb {
        display: none;
    }

    .right-block {
        padding: 0;
    }


    #page-1 {
        position: relative;
    }

    .left-block {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;

        padding-right: 0px;
        box-sizing: border-box;
        
        z-index: 0;
    }

    .right-block {
        width: 21%;
        margin-left: 78%;
    }

    .hide-768 {
        display: none;
    }

    .show-768 {
        display: block;
    }

    .blue-btn {
        margin-left: 0;
        width: auto;
    }

    .img-small {
        height: 340px;
    }

    body.open {
        overflow: auto;
    }

    .open nav {
        background: transparent;
    }


    nav .menu {
        margin-top: 30px;
    }

    .menu-wrapper {
        height: 100vh;
        background: #ffffff;
        position: absolute;
        right: -20px;
        width: 50%;
        padding-left: 30px;
        top: 0;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    }

    .blue-btn {
        margin-top: 20px;
    }

    h2 {
        margin-bottom: 40px;
        margin-top: 60px;
    }

    #page-3 h2,
    #page-6 h2 {
        margin-bottom: 25px;
    }

    .opportunity img,
    .opportunity svg,
    .service img {
        margin: 0;
    }

    .opportunity *,
    .service * {
        text-align: left;
    }

    .opportunity {
        padding: 0 50px;
    }

    .opportunity img {
        height: 80px;
    }

    .application h5 {
        margin-top: 40px;
    }

    #page-3 {
        padding: 0;
        overflow: hidden;
    }

    .components {
        margin: 0 -240px;
    }

    .component {
        margin-right: 38px;
        margin-left: 38px;
        position: relative;
    }

    .component:not(.slick-current) {
        opacity: 1;
    }

    .white-stub {
        position: absolute;
        width: 100%;
        height: 100%;
        background: #FFFFFF;
        opacity: 0.4;
    }

    .component.slick-current + .component .white-stub {
        height: 0;
    }

    #page-3 .slick-prev {
        left: 34%;
    }

    #page-3 .slick-next {
        right: 34%;
    }

    #page-4 {
        position: relative;
        background-position: right bottom, right -20px bottom;
        background-size: 30%;
    }

    .services {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .service {
        float: left;
        width: 33%;
        margin-bottom: 40px;
        padding-right: 30px;
        box-sizing: border-box;

        -ms-flex: 0 0 33%;
        flex: 0 0 33%;
        max-width: 33%;
    }

    .service img {
        display: block;
    }

    .img-service {
        position: absolute;
        right: 60px;
        bottom: 0;
    }

    .tabs {
        text-align: center;
    }

    .tabs li {
        width: auto;
    }

    .tabs li a {
        padding: 5px 85px;
    }


    .cost-wrapper {
        padding: 0 10px;
    }


    .costs .slick-list {
        padding: 15px 30px;
    }

    .cost-wrapper:not(.slick-active) {
        opacity: 0;
    }

    h6 {
        margin-top: 60px;
        margin-bottom: 30px;
    }

    form {
        width: 350px;
        margin: 0 auto;
    }

    form input {
        padding: 20px 15px 20px 30px;
    }

    form select {
        padding: 20px 15px 20px 30px;
    }

    #page-7 {
        position: relative;
    }


    #page-7 img {
        position: absolute;
        bottom: 0;
        margin: 0;
    }

    #page-7 .page-inner {
        position: relative;
        background-size: 43%;
    }

    footer {
        margin-top: 80px;
    }

    footer .social-links {
        float: left;
        margin-top: 0;
        margin-right: 50px;
        margin-bottom: 0;
        margin-left: 100px;
    }

    .cost {
        padding-bottom: 55px;
        box-sizing: content-box;
    }

    .img-service {
        max-height: 160px;
    }

    .opportunity img {
        height: 60px;
    }

}

.show-1024 {
    display: none;
}

.bottom-arrow {
    display: none;
}

@media (min-width: 1200px) {

    body {
        overflow: hidden;
    }

    .opportunities-wrapper {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        width: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .hide-1024 {
        display: none;
    }

    .show-1024 {
        display: block;
    }

    h1 {
        font-size: 18px;
        line-height: 30px;
        margin-top: 100px;
    }

    .img-big {
        height: 100%;
        max-width: 100%;
    }

    .blue-btn {
        margin-top: 10px;
    }

    .menu-wrapper {
        display: block;
        width: auto;
        height: auto;
        background: none;
        position: static;
        box-shadow: none;
        float: right;
    }

    nav .menu {
        margin-right: 20px;
    }

    nav .languages,
    nav .menu {
        margin-top: 5px;
        margin-bottom: 0;
    }


    nav .menu li {
        margin-top: 0;
        display: inline-block;
        padding-right: 20px;
        margin-bottom: 0;
    }

    nav .languages li {
        padding-right: 10px;
        margin-bottom: 0;
    }

    nav .menu,
    nav .languages,
    nav .languages li {
        display: inline-block;

    }

    nav .menu li a,
    nav .languages li a {
        font-size: 16px;
        line-height: 26px;
    }

    .top-bar {
        padding: 20px 0 0;
    }

    h2 {
        font-size: 40px;
        line-height: 48px;
    }

    section {
        position: relative;
    }

    .right-block {
        height: 100%;
        padding-bottom: 50px;
        box-sizing: border-box;
    }

    #page-2 {
        position: relative;
    }


    .opportunity img {
        height: 75px;
    }

    .bottom-arrow {
        /*background-image: url("../img/bottom-arrow.svg");*/
        cursor: pointer;
        height: 30px;
        width: 30px;
        display: block;
        position: absolute;
        bottom: 30px;
        left: 50%;
        transform: translateX(-50%);
        background-size: 80%;
        background-repeat: no-repeat;
    }

    .bottom-arrow svg {
        height: 100%;
    }

    .bottom-arrow:hover svg * {
        stroke: #8FC3FF;
        /*background-image: url("../img/bottom-arrow-hover.svg");*/

    }


    .bottom-arrow:active * {
        stroke: #147EF9;
        /*background-image: url("../img/bottom-arrow-focus.svg");*/
    }

    #page-3 {
        padding: 0 !important;
        background-image: url("../img/component-bg-1.svg"), url("../img/component-bg-2.svg"), url("../img/component-bg-3.svg"), url("../img/component-bg-4.svg");
        background-repeat: no-repeat;
        background-position: 0 0, 50px 0, right bottom, right bottom;
    }


    .components h3 {
        font-size: 24px;
        line-height: 34px;
    }

    .component-body {
        padding: 30px;
    }

    .component-body span {
        font-size: 18px;
        line-height: 28px;
    }

    #page-4 {
        background-image: url("../img/service-bg-1.svg"), url("../img/service-bg-2.svg"), url("../img/service-bg-3.svg");
        background-repeat: no-repeat;
        background-position: 0 0, right bottom, right bottom;
        background-size: 15%, 15%, 30%;
    }

    .application-wrapper {
        display: flex;
        flex-flow: row-reverse;
    }

    .application,
    .application-image {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .application-image {
        margin-top: -40px;
    }

    .tabs {
        width: 50%;
        margin-left: 50%;
    }

    .application h5 {
        font-size: 30px;
        line-height: 40px;
        text-align: left;
    }

    .application p {
        font-size: 18px;
        line-height: 28px;
        text-align: left;
    }

    .link-wrapper {
        text-align: left;
    }

    .application a {
        font-size: 16px;
        line-height: 26px;
    }

    .cost li span {
        font-size: 16px;
        line-height: 26px;
    }

    h6 {
        font-size: 24px;
        line-height: 34px;
    }

    .applications,
    .costs,
    .services {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
        padding: 20px;
        box-sizing: border-box;
    }

    #page-7 {
        padding-bottom: 130px;
        box-sizing: border-box;
    }

    #page-7 .page-inner {
        height: 100%;
    }

    footer .contacts {
        float: left;
        margin: 0 0 0 50px;
    }

    footer .contacts li {
        display: inline-block;
        margin-right: 50px;
    }

    footer .contacts li:last-child {
        margin-right: 0;

    }

    footer {
        position: absolute;
        width: 100%;
        bottom: 0;
        box-sizing: border-box;
    }

    #page-5 {
        background-image: url("../img/application-bg-1.svg"), url("../img/application-bg-2.svg");
        background-repeat: no-repeat;
        background-position: 0 0, right bottom;
        background-size: 40%, 30%;
    }


    .cost {
        padding-bottom: 65px;
    }

    #page-7 form {
        top: 50%;
        transform: translate(-50%, -50%);
        left: 50%;
        position: absolute;
    }

    .services-wrapper,
    .costs-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
    }

    .costs,
    .services {
        position: static;
        transform: none;
    }

    .costs {
        position: relative;
    }


    .opportunity img {
        height: 65px;
    }

    .costs .slick-prev {
        left: 15px;
    }

    .costs .slick-next {
        right: 15px;
    }

    object {
        height: 70px;
    }

    .img-service {
        max-height: 258px;
    }

    form input {
        font-size: 18px;
    }

    form select {
        font-size: 18px;
    }

    .applications .tabs li:first-child {
        padding-left: 40px;
    }

    .applications .tabs {
        box-sizing: border-box;
    }

    .application {
        padding-left: 40px;
        box-sizing: border-box;
    }

    .tabs li a {
        padding: 5px 75px;
    }

    .applications .tabs li:first-child {
        padding-left: 0;
    }

    nav .menu li a.active {
        color: #147EF9;
    }

    .components-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
    }

}

@media (min-height: 768px) {
    section {
        height: auto !important;
    }
}

@media (max-height: 768px) and  (max-width: 768px) {
    section {
        height: auto !important;
    }
}

@media (min-width: 1200px) and (min-height: 768px) {
    section {
        height: calc(100vh - 68px) !important;
        position: relative;
    }
}


@media (min-width: 1280px) {

    .opportunities {
        box-sizing: border-box;
        padding: 0;
    }

    .services {
        padding: 0 40px;
    }


    .svg-wrapper {
        height: 65px;
    }

    nav .menu li a.active,
    nav .menu li a:focus {
        color: #147EF9;
    }

    footer * {
        font-size: 16px;
        line-height: 26px;
    }


    nav,
    section {
        padding: 0 40px;
    }


    h1 {
        font-size: 20px;
        line-height: 30px;
        margin-top: 100px;
    }

    #page-1 p {
        font-size: 18px;
        line-height: 28px;
    }

    h2 {
        font-size: 48px;
        line-height: 56px;
        margin-top: 80px;
    }


    .opportunities {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        /*position: static;*/
        /*transform: none;*/
    }

    .opportunity {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 40px;
        padding: 0 10px;
    }


    /*  .opportunity img {
          height: 80px;
      }*/
    .component-footer li span {
        font-size: 16px;
        line-height: 26px;
    }

    .cost h5 {
        font-size: 30px;
        line-height: 40px;
    / / margin-top: 75 px;
    }

    .cost-wrapper:not(.slick-active) {
        opacity: 1;
    }

    .costs {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }


    .cost-wrapper {
        box-sizing: border-box;
        -ms-flex: 0 0 33%;
        flex: 0 0 33%;
        max-width: 33%;
        width: 100%;
    }

    .cost {
        position: relative;
    }

    .cost img {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    .application h5 {
        margin-top: 80px;
    }

    form {
        width: 450px;
    }

    form .blue-btn {
        margin: 30px 0 0;
    }

    .cost h5 {
        font-size: 36px;
        line-height: 42px;
    }

    footer .contacts {
        margin-left: 70px;
    }

    footer .contacts li {
        margin-right: 70px;
    }

    .cost {
        padding-bottom: 50px;
    }

    .cost-wrapper {
        padding: 0 15px;
    }

    #page-4 {
        background-size: 10%, 15%, 20%;
    }

    .tabs {
        text-align: left;
    }

    .tabs li {
        width: auto;
    }

    .tabs li a {
        padding: 10px 90px;
    }


    .services-wrapper,
    .costs-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
    }

    .costs,
    .services {
        position: static;
        transform: none;
    }

    .costs {
        position: relative;
    }

    .services {
        padding: 0 40px;

    }

    .opportunity {
        padding-right: 20px;
        padding-left: 0;
    }

    .applications {
        padding: 0 40px;
    }

    .opportunities-wrapper {
        padding: 0 60px;
    }


    /* .opportunity img {
         height: 70px;
     }*/
    .img-service {
        max-height: 373px;
    }

    .applications .tabs li:first-child {
        padding-left: 40px;
    }
}

@media (min-width: 1440px) {


    nav,
    section {
        padding: 0 60px;
    }

    nav .menu li {
        padding-right: 30px;
    }

    nav .menu li a, nav .languages li a {
        font-size: 18px;
        line-height: 0px;
    }

    h1 {
        font-size: 20px;
        line-height: 30px;
        margin-top: 100px;
    }

    h2 {
        font-size: 56px;
        line-height: 64px;
        margin-bottom: 80px;
        margin-top: 80px;
    }


    .opportunity h4 {
        font-size: 24px;
        line-height: 34px;
    }

    p {
        font-size: 18px;
        line-height: 28px;
    }

    .components h3 {
        font-size: 30px;
        line-height: 40px;
    }

    .component-body span {
        font-size: 20px;
        line-height: 30px;
    }

    .component-footer li span {
        font-size: 18px;
        line-height: 26px;
    }


    .service h4 {
        font-size: 24px;
        line-height: 34px;
    }

    .application h5 {
        font-size: 48px;
        line-height: 56px;
    }

    .application p {
        font-size: 20px;
        line-height: 30px;
        width: 80%;
    }

    footer .contacts {
        margin-left: 95px;
    }

    footer .contacts li {
        margin-right: 95px;
    }

    .cost {
        padding-bottom: 70px;
    }

    .cost-wrapper {
        padding: 0 20px;
    }

    .opportunities {
        padding: 0;
        box-sizing: border-box;
    }

    h2 {
        margin-top: 0;
    }

    .components-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
    }

    .services-wrapper,
    .costs-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
    }

    .costs,
    .services {
        position: static;
        transform: none;
    }

    .services {
        padding: 0 60px;

    }

    .applications {
        padding: 0 60px;
    }

    .costs {
        padding: 0 40px;
    }

    footer {
        padding: 0 60px 20px;
    }

    /* .opportunity img {
         height: 75px;
     }*/
    .img-service {
        max-height: 350px;
    }

    #page-7 img {
        height: 400px;
    }

    .left-block {
        padding-right: 40px;
    }

    .opportunity {
        padding-right: 30px;
    }

    /*    .applications .tabs {
            padding-left: 40px;
        }

        .application {
            padding-left: 40px;
            box-sizing: border-box;
        }*/
}

@media (min-width: 1920px) {
    .svg-wrapper {
        height: 70px;
    }

    h1 {
        font-size: 48px;
        line-height: 56px;
        margin-top: 80px;
    }

    #page-1 p {
        font-size: 20px;
        line-height: 32px;
    }

    h2 {
        font-size: 64px;
        line-height: 70px;
        margin-top: 0;
        margin-bottom: 100px;
    }

    .opportunity {
        margin-bottom: 70px;
    }

    .opportunity h4 {
        font-size: 30px;
        line-height: 40px;
    }

    p {
        font-size: 20px;
        line-height: 32px;
    }

    .components h3 {
        font-size: 48px;
        line-height: 56px;
    }

    .component-body span {
        font-size: 30px;
        line-height: 40px;
    }

    .component-footer li span {
        font-size: 20px;
        line-height: 30px;
    }


    .service h4 {
        font-size: 30px;
        line-height: 40px;
    }

    .cost h5 {
        font-size: 48px;
        line-height: 56px;
    }


    footer .contacts {
        margin-left: 170px;
    }

    footer .contacts li {
        margin-right: 170px;
    }


    nav .menu li a, nav .languages li a {
        font-size: 20px;
        line-height: 30px;
    }

    .components {
        margin: 0;
    }

    .component {
        margin-right: 60px;
        margin-left: 60px;
    }

    .services {
        padding: 0 60px;
    }


    #page-4 {
        background-size: 10%, 15%, 15%;
    }

    #page-5 {
        background-size: 40%;

    }

    .tabs {
        text-align: left;
    }

    .tabs li {
        width: auto;
    }

    .tabs li a {
        padding: 10px 90px;
    }

    .cost {
        padding-bottom: 140px;
    }

    .cost-wrapper {
        padding: 0 35px;
    }

    #page-7 img {
        height: 447px;
    }

    footer {
        padding: 0 60px 20px;
    }


    h2 {
        margin-bottom: 40px;
    }

    .components-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
    }

    .services-wrapper,
    .costs-wrapper {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 100%;
        left: 0;
    }

    .costs,
    .services {
        position: static;
        transform: none;
    }

    .applications {
        padding: 0 60px;
    }


    .costs {
        padding: 0;
    }

    .costs-wrapper {
        padding: 0 25px;
        box-sizing: border-box;
    }

    /*    .opportunity img {
            height: 80px;
        }*/
    object {
        height: 75px;
    }

    .img-service {
        max-height: 350px;
    }

    #page-7 .page-inner {
        background-size: 39%;
    }

    form input {
        font-size: 20px;
    }

    form select {
        font-size: 20px;
    }

}


@media (max-height: 767px) {
    .bottom-arrow {
        display: none;
    }

    section {
        height: auto;
    }

    body {
        overflow: visible;
    }

    /*
        .applications,
        .opportunities,
        .costs,
        .services {
            position: relative;
            transform: none;
        }*/
}

/*

body:before {
    content: url("../img/bottom-arrow-hover.svg") url("../img/hamburger-hover.svg") url("../img/instagram-icon-hover.svg") url("../img/facebook-icon-hover.svg");
}
*/


input:focus,
.cost-wrapper:focus {
    outline: none;
}

/*

svg:not(:root) {
    overflow: hidden;
    pointer-events: none;
}

object {
    display: block;
    margin: 0 auto;
}

svg {
    margin: 0 auto;
    max-width: 100%;
    display: block;
}

svg {
    height: 100% !important;
    width: 100% !important;
}

*/
svg {
    height: auto;
}

.imgs {
    width: 1px;
    height: 1px;
    background-repeat: no-repeat;
    background-image: url("../img/bottom-arrow-hover.svg"), url("../img/instagram-icon-hover.svg"), url("../img/facebook-icon-hover.svg"), url("../img/left-arrow-hover.svg"), url("../img/right-arrow-hover.svg");;
}

.applications .tabs li:hover a {
    background: #E8F2FF;
}

.applications .tabs li.active:hover a {
    background: #8FC3FF;
}

.applications .tabs li.active a {
    background: #8FC3FF;
    border: 1px solid #8FC3FF;
    color: #FFFFFF;
}

#preloader {
    display: none;
}

.svg-wrapper {
    position: relative;
}

.svg-wrapper object {
    width: 100%;
    height: 100%;
}

.svg-wrapper svg {
    height: 100%;
    width: auto;
}


@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true))
and (not (-moz-appearance:none)) {
    svg {
        filter: none !important;
    }

}