.mask_1_M .image, .mask_1_M .mask {
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s
}

.mask_1_M .et_pb_button_module_wrapper {
    position: absolute;
    bottom: 0;
    right: 0;
    line-height: 100% !important
}

.mask_1_M .image {
    transform: scale(1);
    transition: all .4s
}

.mask_1_M img {
    display: block !important
}

.mask_1_M .mask {
    position: absolute;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    -ms-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1);
    width: 1079px;
    height: 510px;
    transition: all .4s
}

.mask_2_M .image, body #page-container .mask_1_M .team_button {
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s
}

.mask_1_M .mask .mask-border-bottom, .mask_1_M .mask .mask-border-top {
    position: absolute;
    background: #fff;
    width: 100vw;
    height: calc(50vh - 255px);
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.mask_1_M .mask .mask-border {
    font-size: 0 !important;
    margin: 0 !important
}

.mask_1_M .mask .mask-border-top {
    bottom: 100%
}

.mask_1_M .mask .mask-border-bottom {
    top: 100%
}

.mask_1_M .mask .mask-border-left, .mask_1_M .mask .mask-border-right {
    height: 100vh;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    background: #fff
}

.mask_1_M .mask .mask-border-right {
    width: calc(50vw - 510px);
    right: calc(100% - 1px)
}

.mask_1_M .mask .mask-border-left {
    width: calc(50vw - 404.5px);
    left: calc(100% - 1px)
}

body.clicked_button #page-container .mask_1_M .image {
    transform: scale(1)
}

body #page-container .mask_1_M .team_button {
    transition: all .4s
}

body.clicked_button #page-container .mask_1_M .team_button {
    opacity: 0;
    transform: translate(0, 30px)
}

body.clicked_button .et_pb_section.mask_1_M {
    position: absolute;
    width: 100%;
    overflow: hidden;
    top: 0
}

body.clicked_button .et_pb_section:not(.mask_1_M ) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    display: none;
    bottom: 0;
    margin: auto
}

html.clicked, html.clicked_mask_1 {
    margin-top: 0 !important;
    padding-top: 0 !important
}

body.clicked_button .mask {
    transform: translateX(-50%) translateY(-50%) scale(6);
    opacity: 0;
    -webkit-transition: opacity .3s .3s, -webkit-transform .6s 0s;
    transition: opacity .3s .3s, -webkit-transform .6s 0s;
    transition: transform .6s 0s, opacity .3s .3s;
    transition: transform .6s 0s, opacity .3s .3s, -webkit-transform .6s 0s;
    -webkit-transition-timing-function: cubic-bezier(.59, .05, .82, .13);
    transition-timing-function: cubic-bezier(.59, .05, .82, .13)
}

.mask_1_M .et_pb_button_module_wrapper .et_pb_button:hover:before {
    -webkit-animation: slideRightLeft 1s infinite;
    animation: slideRightLeft 1s infinite;
    animation-iteration-count: 1;
    -webkit-animation-duration: .4s;
    animation-duration: .4s
}

@-webkit-keyframes slideRightLeft {
    0%, 100% {
        opacity: 1;
        transform: translate(0, 0)
    }
    25% {
        opacity: 0;
        transform: translate(100%, 0)
    }
    74% {
        opacity: 0
    }
    75% {
        opacity: 1;
        transform: translate(-100%, 0)
    }
}

@keyframes slideRightLeft {
    0%, 100% {
        opacity: 1;
        transform: translate(0, 0)
    }
    25% {
        opacity: 0;
        transform: translate(100%, 0)
    }

    74% {
        opacity: 0
    }

    75% {
        opacity: 1;
        transform: translate(-100%, 0)
    }
}

.slideRightLeft {
    -webkit-animation-name: slideRightLeft;
    animation-name: slideRightLeft
}

body.clicked_button .mask_1_M .et_pb_blurb.image {
    height: 100%
}

@media only screen and (min-width: 1920px) {
    .mask_1_M .mask .mask-border-top {
        bottom: calc(100% - 2px) !important;
        height: calc(50vh - 247px);
    }

    .mask_1_M .mask .mask-border-right {
        right: calc(100% - 2px) !important;
    }

    .mask_1_M .mask .mask-border-bottom {
        top: calc(100% - 2px) !important;
        height: calc(50vh - 230px);
    }

    .mask_1_M .mask .mask-border-left {
        left: calc(100% - 2px);
    }
}
@media only screen and (max-width: 1390px) {
    .mask_1_M .et_pb_blurb.image {
        top: 50% !important;
        transform: translate(0, -50%) !important;
        height: 440px
    }

    .mask_1_M .mask {
        width: 830px;
        height: 392px
    }

    .mask_1_M .mask .mask-border-bottom, .mask_1_M .mask .mask-border-top {
        height: calc(50vh - 195px)
    }

    .mask_1_M .mask .mask-border-right {
        width: calc(50vw - 400px)
    }
}

@media only screen and (max-width: 980px) {
    .mask_1_M .et_pb_blurb.image {
        height: 400px
    }

    .mask_1_M .mask {
        width: 720px;
        height: 340px
    }

    .mask_1_M .mask .mask-border-bottom, .mask_1_M .mask .mask-border-top {
        height: calc(50vh - 170px)
    }

    .mask_1_M .mask .mask-border-left, .mask_1_M .mask .mask-border-right {
        width: calc(50vw - 357px)
    }
}

@media only screen and (max-width: 767px) {
    .mask_1_M .et_pb_blurb.image {
        height: 260px
    }

    .mask_1_M .mask {
        width: 450px;
        height: 212px
    }

    .mask_1_M .mask .mask-border-bottom, .mask_1_M .mask .mask-border-top {
        height: calc(50vh - 106px)
    }

    .mask_1_M .mask .mask-border-left, .mask_1_M .mask .mask-border-right {
        width: calc(50vw - 220px)
    }

    .mask_1_M .et_pb_button_module_wrapper {
        bottom: -40px;
        right: 0;
        left: 0
    }
}

@media only screen and (max-width: 480px), screen and (max-height: 480px) {
    .mask_1_M .et_pb_blurb.image {
        height: 200px
    }

    .mask_1_M .mask {
        width: 300px;
        height: 140px
    }

    .mask_1_M .mask .mask-border-bottom, .mask_1_M .mask .mask-border-top {
        height: calc(50vh - 70px)
    }

    .mask_1_M .mask .mask-border-left, .mask_1_M .mask .mask-border-right {
        width: calc(50vw - 146px)
    }

    .mask_1_M .et_pb_button_module_wrapper {
        bottom: -40px;
        right: 0;
        left: 0
    }
}

@media only screen and (max-width: 767px) and (min-height: 601px) {
    .mask_1_M .mask img {
        height: 400px
    }

    .mask_1_M .et_pb_blurb.image {
        height: 405px
    }

    .mask_1_M .mask {
        height: 400px
    }
}

@media only screen and (max-width: 767px) and (max-height: 600px) {
    .mask_1_M .mask img {
        height: 200px
    }

    .mask_1_M .et_pb_blurb.image {
        height: 205px
    }

    .mask_1_M .mask {
        height: 200px
    }
}

.mask_2_M .image {
    transform: scale(1);
    transition: all .4s
}

.mask_2_M .project_content img {
    z-index: 3;
    position: relative
}

.mask_2_M img {
    display: block !important
}

.mask_2_M .mask {
    position: absolute;
    left: 43%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    -ms-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1);
    width: 809px;
    height: 538px;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s
}

.mask_2_M .mask .mask-border-bottom, .mask_2_M .mask .mask-border-top {
    position: absolute;
    background: #fff;
    width: 100vw;
    height: calc(50vh - 265px);
    left: 0;
    left: 67%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.mask_2_M .mask .mask-border-top {
    bottom: 100%
}

.mask_2_M .mask .mask-border-bottom {
    top: calc(100% - 1px)
}

.mask_2_M .mask .mask-border-left, .mask_2_M .mask .mask-border-right {
    height: 100vh;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    background: #fff
}

.mask_2_M .mask .mask-border {
    margin: 0 !important
}

.mask_2_M .mask .mask-border-right {
    width: calc(50vw - 404.5px);
    right: calc(100% - 1px)
}

.mask_2_M .mask .mask-border-left {
    width: calc(57vw - 404.5px);
    left: calc(100% - 1px)
}

.mask_2_M .mask .et_pb_button_module_wrapper {
    z-index: 9;
    position: absolute;
    bottom: -36px;
    right: -14vw;
    width: 100px;
    height: 100px;
    display: table;
    border-width: 0 !important;
    border-radius: 100px
}

body.clicked_mask #wprmenu_bar, body.clicked_mask iframe[name=google_conversion_frame] {
    display: none !important
}

.mask_2_M .et_pb_button_module_wrapper a:hover:before {
    transform: rotate(-112deg)
}

body.clicked_mask .et_pb_section:not(.mask_2_M ) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    display: none
}

body.clicked_mask .mask {
    transform: translateX(-50%) translateY(-50%) scale(6);
    opacity: 0;
    -webkit-transition: opacity .3s .3s, -webkit-transform .6s 0s;
    transition: opacity .3s .3s, -webkit-transform .6s 0s;
    transition: transform .6s 0s, opacity .3s .3s;
    transition: transform .6s 0s, opacity .3s .3s, -webkit-transform .6s 0s;
    -webkit-transition-timing-function: cubic-bezier(.59, .05, .82, .13);
    transition-timing-function: cubic-bezier(.59, .05, .82, .13)
}

body.clicked_mask #page-container #et-main-area {
    padding-top: 0
}

body.clicked_mask .project_content {
    -webkit-overflow-scrolling: touch;
    opacity: 1;
    visibility: visible;
    -webkit-transition: opacity 0s, visibility 0s;
    transition: opacity 0s, visibility 0s
}

body .et_pb_promo.about_title .et_pb_promo_description {
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s
}

body.clicked_mask .et_pb_promo.about_title .et_pb_promo_description {
    opacity: 0 !important
}

body.clicked_mask .et_pb_promo.about_title .et_pb_promo_description h2 {
    margin-bottom: -24px;
    margin-right: 0
}

body #page-container .mask_2_M .mask-top .et_pb_button_module_wrapper:last-child {
    margin: 0;
    position: absolute;
    right: 80px;
    top: 110px;
    line-height: 100% !important;
    z-index: 9999;
    opacity: 0
}

body.clicked_mask #page-container .mask_2_M .read-our-news {
    transform: scale(0)
}

body.clicked_mask #page-container .mask_2_M .mask-top .et_pb_button_module_wrapper:last-child {
    opacity: 1;
    -webkit-transition-duration: .7s;
    -webkit-transition-delay: .3s;
    transition-duration: .7s;
    transition-delay: .3s
}

body.clicked_mask .mask_2_M .image {
    transform: scale(1.1)
}

body.unclicked_mask #page-container .mask_2_M .read-our-news, body.unclicked_mask .et_pb_promo.about_title .et_pb_promo_description {
    opacity: 0;
    -webkit-transition: opacity 0s;
    transition: opacity 0s
}

@media only screen and (max-width: 1390px) {
    .mask_2_M .mask {
        width: 655px;
        height: 435px
    }

    .mask_2_M .mask .mask-border-bottom, .mask_2_M .mask .mask-border-top {
        height: calc(50vh - 216px)
    }

    .mask_2_M .mask .mask-border-right {
        width: calc(50vw - 328px);
        height: 101vh
    }

    .mask_2_M .mask .mask-border-left {
        width: calc(57vw - 320px)
    }

    body .mask_2_M .et_pb_promo.about_title .et_pb_promo_description {
        right: -200px
    }
}

@media only screen and (max-width: 980px) {
    .mask_2_M .mask {
        width: 571px;
        height: 380px
    }

    .mask_2_M .mask .mask-border-bottom, .mask_2_M .mask .mask-border-top {
        height: calc(50vh - 188px)
    }

    .mask_2_M .mask .mask-border-left {
        width: calc(57vw - 282px)
    }

    body .mask_2_M .et_pb_promo.about_title .et_pb_promo_description {
        right: -120px
    }

    body .mask_2_M .project_content .et_pb_promo_description {
        padding: 5vw 20%
    }

    body .mask_2_M .et_pb_promo.about_title .et_pb_promo_description h2 {
        margin-bottom: -17px
    }
}

@media only screen and (max-width: 767px) {
    .mask_2_M .mask {
        width: 390px;
        height: 260px
    }

    .mask_2_M .mask .mask-border-bottom, .mask_2_M .mask .mask-border-top {
        height: calc(50vh - 129px);
        left: 60%
    }

    .mask_2_M .mask .mask-border-left {
        width: calc(57vw - 193px)
    }

    .mask_2_M .mask .mask-border-right {
        width: calc(50vw - 227px)
    }

    body .mask_2_M .et_pb_promo.about_title .et_pb_promo_description {
        right: -60px
    }

    body .mask_2_M .et_pb_button.read-our-news:before {
        width: 160px;
        top: 41px;
        left: -29px
    }

    body .mask_2_M .project_content .et_pb_promo_description {
        padding: 5vw 10%
    }

    body #page-container .mask_2_M .mask-top .et_pb_button_module_wrapper:last-child a:before {
        display: none !important
    }

    body #page-container .mask_2_M .mask-top .et_pb_button_module_wrapper:last-child {
        top: 60px;
        right: 40px
    }
}

@media only screen and (max-width: 480px), screen and (max-height: 480px) {
    .mask_2_M .mask {
        width: 270px;
        height: 180px
    }

    .mask_2_M .mask .mask-border-bottom, .mask_2_M .mask .mask-border-top {
        height: calc(50vh - 89px);
        left: 59%
    }

    .mask_2_M .mask .mask-border-left {
        width: calc(57vw - 131px)
    }

    .mask_2_M .mask .mask-border-right {
        width: calc(50vw - 107px)
    }

    body .mask_2_M .et_pb_promo.about_title .et_pb_promo_description {
        right: -40px
    }

    .mask_2_M .mask .et_pb_button_module_wrapper {
        bottom: -100px
    }
}