@media screen and (max-width: 1024px){
    .ui-gradient--block > .wrapper {
        grid-template-columns: 100%;
    }

    .lm-mt-auto {margin-top: auto}
    .lm-mt-0 {margin-top: 0px}
    .lm-mt-5 {margin-top: 5px}
    .lm-mt-15 {margin-top: 15px}
    .lm-mt-20 {margin-top: 20px}
    .lm-mt-25 {margin-top: 25px}
    .lm-mt-30 {margin-top: 30px}
    .lm-mt-50 {margin-top: 50px}

    .lm-mb-auto {margin-bottom: auto}
    .lm-mb-0 {margin-bottom: 0px}
    .lm-mb-5 {margin-bottom: 5px}
    .lm-mb-15 {margin-bottom: 15px}
    .lm-mb-20 {margin-bottom: 20px}
    .lm-mb-25 {margin-bottom: 25px}
    .lm-mb-30 {margin-bottom: 30px}
    .lm-mb-40 {margin-bottom: 40px}
    .lm-mb-50 {margin-bottom: 50px}

    .lm-ml-auto {margin-left: auto}
    .lm-ml-0 {margin-left: 0px}
    .lm-ml-5 {margin-left: 5px}
    .lm-ml-15 {margin-left: 15px}
    .lm-ml-20 {margin-left: 20px}
    .lm-ml-25 {margin-left: 25px}
    .lm-ml-30 {margin-left: 30px}
    .lm-ml-50 {margin-left: 50px}

    .lm-mr-auto {margin-right: auto}
    .lm-mr-0 {margin-right: 0px}
    .lm-mr-5 {margin-right: 5px}
    .lm-mr-15 {margin-right: 15px}
    .lm-mr-20 {margin-right: 20px}
    .lm-mr-25 {margin-right: 25px}
    .lm-mr-30 {margin-right: 30px}
    .lm-mr-50 {margin-right: 50px}

    .lm-fs-16 {font-size: 16px;line-height: 140%;}
    .lm-fs-20 {font-size: 20px;}
    .lm-pb-0 {padding-bottom: 0 !important;}

    .lm-hide {display: none !important;}
    .lm-show, header > .wrapper > .col-right.lm-show {display: block}
    .ui-feature-block:before {
        content: '';
        width: 30px;
        height: 30px;
        display: block;
        background: #1e325b;
        position: absolute;
        bottom: -15px;
        right: -15px;
        transform: rotate(45deg);
    }

    .ui-section--start > .background [data-lazy].m-bg-left {
        background-position: left !important;
    }
    .lm-column{
        flex-direction: column !important;
    }
}

@media screen and (min-width: 460px) and (max-width: 1024px){
    .ui-feature-block > .wrapper {
        padding: 40px 25px 40px 40px;
        width: calc(100% - 65px);
    }

    .ui-feature-block > .wrapper > .title {
        font-size: 24px;
        line-height: 1.2;
    }

    section > * > .wrapper.grid-3 {
        grid-template-columns: 50% 50%;
        gap: 40px 100px;
        width: calc(100% - 100px);
    }

    #contact {
        padding-bottom: 0;
    }

    #contact > .container {
        padding: 0;
        width: 100%;
    }

    .ui-feature-block {
        background-size: cover;
        height: auto;
        position: relative;
    }

    section > * > .wrapper.grid-4 {
        grid-template-columns: 50% 50%;
        width: calc(100% - 50px);
        gap: 50px;
    }

    section > * > .wrapper.grid-3--auto {
        grid-template-columns: auto auto;
    }
    .ui-section--start > .background > .ui-video--element {
        width: 100%;
    }

    .ui-section--start > .background > .caption {
        font-size: 150px;
    }
}
@media screen and (max-width: 460px){

    .ui--label {
        font-size: 12px;
        line-height: 16px;
    }

    header > .wrapper {
        align-items: center;
        padding-top: 20px;
    }

    .ui--label:before {
        left: -40px;
        top: 3px;
    }

    section > * > .wrapper {
        grid-template-columns: 100%;
        display: flex;
        flex-direction: column-reverse;
        align-items: baseline;
    }

    .ui-section--1 .wrapper {
        grid-template-columns: 100%;
        gap: 25px;
    }

    section > * > .wrapper.grid-3 {
        grid-template-columns: 100%;
        width: 100%;
        gap: 15px;
        display: grid;
    }

    section {
        padding: 80px 0;
    }

    .ui-feature-block {
        height: auto;
        background: url(/assets/images/block-sm.png) no-repeat;
        background-size: cover;
        overflow: hidden;
    }

    .ui-feature-block > .wrapper {
        padding: 60px 40px;
        width: calc(100% - 80px);
    }

    .ui-feature-block > .wrapper > .title {
        font-size: 24px;
        line-height: 33px;
    }

    h2 {
        font-size: 24px;
        line-height: 110%;
        position: relative;
        z-index: 11;
    }

    .ui-gradient--block > .wrapper {
        padding: 50px 20px;
    }

    #contact {
        padding: 0;
    }

    #contact > .container {
        padding: 0;
        width: 100%;
    }

    footer > .wrapper {
        display: flex;
        flex-direction: column-reverse;
    }

    footer > .wrapper > .col:last-child {
        text-align: left;
        margin: 0;
    }

    .ui-social-items {
        margin-bottom: 30px;
        flex-direction: row-reverse;
    }

    .ui-social {
        margin-right: 13px;
        margin-left: 0;
    }

    section .wrapper > .col.border {
        padding-left: 15px;
        width: calc(100% - 15px);
    }

    .ui-text--1 {
        font-size: 18px;
    }

    header > .wrapper > .col:last-child {
        display: flex;
        justify-content: flex-end;
    }

    .ui-section--start {
        padding-top: 100px;
        padding-bottom: 40px;
        height: 75vh;
    }

    .ui-gradient--1 .wrapper .image {
        background-size: contain;
        left: -100px;
        bottom: -500px;
        transform: rotate(89deg) !important;
    }

    section > * > .wrapper.grid-4 {
        grid-template-columns: 100%;
        gap: 25px;
        width: 100%;
    }

    section > * > .wrapper.grid-3--auto {
        grid-template-columns: 100%;
    }

    .ui-section--3 {
        padding: 50px 0;
        margin-top: 50px;
    }

    .ui-section--3 > * > .wrapper {
        width: calc(100% - 50px) !important;
    }

    .ui-block--1.style--6 > .wrapper, .ui-block--1.style--7 > .wrapper {
        grid-template-columns: 100%;
        padding: 30px;
        width: calc(100% - 75px);
    }
    .ui-section--start > .background > .ui-video--element {
        width: 100%;
        overflow: hidden;
    }

    .ui-section--start > .background > .caption {
        height: 61%;
        font-size: 10vh;
    }

    .ui-video--element > video {
        width: 200%;
    }
    .ui-video--element.style--1 video {
        transform: rotate(45deg) translateY(140px);
    }

    .ui-gradient--1 > .wrapper iframe {
        width: 102%;
    }

}