.m-hero .m-hero-inner {
    position: relative;
    display: block;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.m-hero .m-hero-inner.hide-lg {
    display: none;
}

.m-hero .m-hero-inner .inner {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}

.m-hero .m-hero-inner .inner .background {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.m-hero .m-hero-inner .inner .background .background-inner {
    width: 100%;
    height: 100%;
    transform: scale(1.05);
}

.m-hero .m-hero-inner .inner .boxed-media {
    position: relative;
    display: block;
    width: 21.41vw; /*370px*/
    height: 28.24vw; /*488px*/
    transform: rotate(2.5deg);
    z-index: 2;
    top: 2vw;
}

.m-hero .m-hero-inner .inner .boxed-media-inner {
    width: 100%;
    height: 100%;
}

.m-hero .m-hero-inner .inner .boxed-media-inner.reveal {
    display: block;
    transform: scale(.8);
    opacity: 0;
	transition: transform .6s cubic-bezier(0.645, 0.045, 0.355, 1), opacity .6s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.m-hero .m-hero-inner .inner .boxed-media-inner.reveal.revealed {
    transform: scale(1);
    opacity: 1;
}

.m-hero .m-hero-inner .inner .boxed-media img {
    border: .57vw solid var(--beige);
}

.m-hero .m-hero-inner .inner .columns-display-text {
    position: absolute;
    display: flex;
    top: 50%;
    left: 0px;
    transform: translate(0,-50%);
    width: 100%;
    height: fit-content;
    justify-content: center;
    column-gap: var(--column-gap);
    padding: 0 var(--lateralMargin);
    z-index: 3;
}

.m-hero .m-hero-inner .inner .columns-display-text .left,
.m-hero .m-hero-inner .inner .columns-display-text .right {
    position: relative;
    display: inline-block;
    width: 50%;
    padding-bottom: 1vw;
    overflow: hidden;
}

.m-hero .m-hero-inner .inner .columns-display-text .left {
    text-align: right;
}

.m-hero .m-hero-inner .inner .columns-display-text .left .left-inner {
    transform: translate(100%,0);
    display: block;
    opacity: 0;
	transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 1s cubic-bezier(0.645, 0.045, 0.355, 1) .4s;
}

.m-hero .m-hero-inner .inner .columns-display-text .left.reveal.revealed .left-inner {
    transform: translate(0%,0);
    display: block;
    opacity: 1;
}

.m-hero .m-hero-inner .inner .columns-display-text .right .right-inner {
    transform: translate(-100%,0);
    display: block;
    opacity: 0;
	transition: transform 1s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 1s cubic-bezier(0.645, 0.045, 0.355, 1) .4s;
}

.m-hero .m-hero-inner .inner .columns-display-text .right.reveal.revealed .right-inner {
    transform: translate(0%,0);
    display: block;
    opacity: 1;
}

.m-hero .m-hero-inner .inner .display-text {
    position: absolute;
    display: block;
    top: 50%;
    left: 0px;
    z-index: 2;
    transform: translate(0,-50%);
    width: 100%;
    height: fit-content;
    justify-content: center;
}

.m-hero .m-hero-inner .inner .lg {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.m-hero .m-hero-inner .inner .sm {
	display: none;
}

.m-hero .m-hero-inner .inner video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}


@media only screen and (max-width: 740px) {
    .m-hero .m-hero-inner .inner .lg {
        display: none;
    }

    .m-hero .m-hero-inner .inner .sm {
        position: relative;
        display: block;
        width: 100%;
        height: 100%;
    }

    .m-hero .m-hero-inner .inner .boxed-media {
        width: 60vw; /*234px*/
        height: 76.92vw; /*300px*/
        top: 0vw;
    }

    .m-hero .m-hero-inner.hide-lg:not(.hide-sm) {
        display: block;
    }

    .m-hero .m-hero-inner.hide-sm {
        display: none;
    }

    .m-hero .m-hero-inner .inner .boxed-media img {
        border: 2.05vw solid var(--beige); /*8px*/
    }

    .m-hero .m-hero-inner .inner .columns-display-text { 
        flex-flow: column;
        align-items: center;
    }

    .m-hero .m-hero-inner .inner .columns-display-text .left,
    .m-hero .m-hero-inner .inner .columns-display-text .right {
        width: 100%;
        max-width: 98.46vw; /*384px*/
    }

    .m-hero .m-hero-inner .inner .columns-display-text .left {
        text-align: left;
    }

    .m-hero .m-hero-inner .inner .columns-display-text .right {
        text-align: right;
    }
}


@media only screen and (max-width: 550px) {
    .m-hero .m-hero-inner .inner .boxed-media {
        width: 234px;
        height: 300px;
    }

    .m-hero .m-hero-inner .inner .boxed-media img {
        border: 8px solid var(--beige);
    }
}