h1,h2,h3,h4,h5,h6 {
    font-family: 'Montserrat' !important
}

.section-headline h2 {
    font-size: 48px;
    color: #000;
    font-weight: 600 !important;
    text-transform: uppercase;
    line-height: 1;
    font-family: "Montserrat" !important
}

.section-headline h4 {
    font-size: 20px;
    text-transform: uppercase;
    color: #6e1fd0;
    margin-bottom: 10px;
    font-family: "Montserrat" !important;
    font-weight: 500 !important
}

.section-headline span.span-1 {
    text-transform: lowercase;
    font-size: 30px;
    font-style: italic
}

.img-border-block:before {
    content: '';
    background: transparent;
    position: absolute;
    height: 100%;
    width: 100%;
    border: 3px solid #6e1fd0;
    bottom: -3%;
    left: -3%;
    z-index: -1
}

.ry-text p {
    line-height: 28px;
    color: #3d3730;
    font-family: 'Montserrat' !important
}

.img-border-block.relative img,.img-border-block.relative {
    z-index: 2
}

.info-block span {
    font-size: 48px;
    color: #6e1fd0;
    font-weight: 600;
    font-family: 'Montserrat' !important
}

.info-block {
    display: flex;
    flex-direction: column;
    gap: 2em 0;
    margin-top: 2em
}

.info-block div#flex-content:nth-child(1) {
    border-bottom: 1px solid rgb(0 0 0 / 31%);
    padding-bottom: 2em
}

.info-block div#flex-content {
    gap: 0 1.5em;
    flex-direction: row
}

.info-block div#flex-content .ry-each:nth-child(odd) {
    background: transparent
}

.video-section {
    padding: 5em 0;
    position: relative;
    background: #f5f1fc
}

.video-section .ry-iframe {
    margin-top: 20px;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%
}

.video-section .ry-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.video-section iframe {
    border: 3px solid #6e1fd0;
    filter: drop-shadow(0 17px 25.5px rgba(0,0,0,0.08));
    padding: 15px;
    background: #fff
}

.video-section:before {
    content: '';
    background: #6e1fd0;
    height: 55%;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

div#power-optilift {
    flex-wrap: wrap;
    margin-top: 5em;
    gap: 4em 1em
}

div#power-optilift .ry-each {
    display: flex;
    gap: 2em;
    width: 45%
}

.powerlift-image {
    width: auto
}

.power-optilift-icon-verbiage {
    width: 65%
}

div.power-optilift-icon-verbiage p strong {
    font-size: 21px;
    line-height: 1.3;
    margin-bottom: 10px;
    display: block;
    color: #3d3730
}

div#power-of-optilift-section {
    background: #f5f1fc;
    padding-top: 6em !important
}

div#lid-function .ry-text span {
    background: #6e1fd0;
    width: 40px;
    height: 40px;
    display: flex;
    margin: auto;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700 !important;
    border-radius: 100%;
    margin-bottom: 10px
}

.optilift-before-after .gallery-title p {
    color: #fff;
    font-family: 'Montserrat' !important;
    font-weight: 500 !important;
    letter-spacing: 0
}

.optilift-before-after.ry-each {
    width: 50%;
    position: relative
}

.optilift-before-after .gallery-title {
    position: relative;
    right: 0;
    left: 0;
    top: 0
}

div#optilift-gallery-section:before {
    background: #6e1fd0;
    content: '';
    right: 0;
    width: 47%;
    height: 57%;
    position: absolute;
    top: 13%
}

div#optilift-gallery-section .swiper-pagination-bullet {
    width: 18px !important;
    height: 18px !important;
    border-radius: 100%;
    background-color: #000 !important;
    opacity: .2;
    margin: 0 4px !important
}

div#optilift-gallery-section .swiper-pagination-bullet-active {
    opacity: 1
}

.optilift-before-after {
    position: relative
}

div#optilift-gallery-section .swiper-pagination-block {
    margin-top: 6em !important
}

div#optilift-gallery-section {
    background: #f5f1fc
}

div#optilift-section {
    background: #f5f1fc
}

div.with-icon .ry-each {
    width: 100% !important
}

div.with-icon {
    margin-top: 2em;
    display: flex;
    flex-direction: column;
    gap: 2em 0
}

div.with-icon .ry-each {
    display: flex;
    align-items: center
}

div.with-icon .ry-each .ry-icon {
    background: #6e1fd0;
    width: 30%;
    height: 75px;
    max-width: 75px;
    margin-right: 1em
}

div.with-icon .ry-each .ry-icon img {
    object-fit: contain;
    height: 40px;
    width: 40px;
    object-fit: scale-down
}

div.with-icon .ry-each .ry-text strong {
    text-transform: uppercase;
    font-size: 22px;
    color: rgb(61 55 48 / 80%);
    font-weight: 600 !important
}

div#optilift-section .ry-content {
    display: flex;
    flex-direction: column;
    gap: 10vw 0
}

div#testimonials-section .ry-text strong {
    margin: 20px 0 0;
    display: block;
    font-size: 23px
}

div#testimonials-section {
    border-bottom: 1px solid rgb(110 31 208 / 14%);
    padding-bottom: 9em
}

div#testimonials-section .ry-each,div#optilight-flex .ry-each {
    width: 50%
}

div#testimonials-section .ry-flex {
    gap: 8em;
    display: flex;
    flex-wrap: wrap
}

div#testimonials-section {
    display: flex;
    gap: 8em;
    flex-direction: row-reverse;
    align-items: center
}

div#optilight-flex {
    display: flex;
    gap: 8em;
    align-items: center
}

div.qr-section {
    padding: 2em 0 16em 0;
    background: #f5f1fc;
}

div.qr-section .ry-flex {
    gap: 0 4em
}

div#qr-sec-info p {
    font-size: 14px;
    line-height: 1.4
}

div#qr-sec-info a {
    color: #6e1fd0
}

div#qr-sec-info {
    flex-direction: column;
    gap: 2em;
    display: flex
}

div#qr-sec-info .ry-text p strong {
    margin-bottom: 15px;
    display: block;
    font-size: 17px;
    font-weight: 500 !important
}

div#qr-image img {
    max-width: 260px
}

@media(max-width: 1080px) {
    div#power-of-optilift-section {
        padding:2em 0 !important
    }

    .video-section:before {
        height: 100% !important
    }

    .video-section {
        padding: 2em 0 2em !important;
        margin: 3em 0 2em !important
    }

    .video-section .ry-iframe {
        margin-top: 0 !important
    }

    .video-section iframe {
        padding: 5px !important
    }

    .ry-text-image-flex-section.ry-padding-section .ry-text {
        max-width: 100% !important
    }

    div.img-border-block.relative {
        max-width: 300px;
        margin: auto;
        width: 90%;
        float: none;
        display: block
    }

    div.optilift-before-after.ry-each {
        width: 100%;
        max-width: 600px
    }

    .img-border-block.relative {
        position: relative;
        left: 9px;
        margin-top: 1em !important
    }

    .ry-text-image-flex-section .img-border-block:before {
        left: -13px !important;
        width: 94%
    }

    div#testimonials-section .ry-each,div#optilight-flex .ry-each {
        width: 100%
    }

    .power-optilift-icon-verbiage {
        width: 100% !important
    }

    div.ry-hero-banner-wrap {
        padding: 2.5em 0 !important
    }

    .ry-text-image-flex-section .ry-content .ry-flex {
        flex-direction: column !important;
        gap: 2em 0 !important
    }

    .ry-section-headline *,.ry-text * {
        text-align: center;
        max-width: 100% !important
    }

    .ry-section-headline:before {
        left: 50%;
        transform: translateX(-50%)
    }

    .ry-text-image-flex-section .ry-btn-wrap {
        justify-content: center
    }

    div.ry-btn-wrap {
        justify-content: center;
        align-items: center
    }

    .ry-hero-banner-wrap .ry-hero-title img {
        filter: brightness(0);
        margin: 0 auto 1em;
        max-width: 300px
    }

    .ry-each.ry-img-wrap {
        max-width: 500px;
        margin: auto
    }

    .info-block div#flex-content {
        gap: 0 !important;
        justify-content: center !important;
        align-items: center
    }

    .info-block span {
        font-size: 40px
    }

    div.section-headline h2,div.section-headline h4 {
        text-align: center
    }

    div#power-optilift {
        flex-direction: column !important
    }

    div#power-optilift .ry-each {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center
    }

    div#power-optilift .ry-text p,div#power-optilift .ry-text p strong {
        text-align: left !important
    }

    div#power-optilift .before-after:after {
        width: 100%;
        height: 40%;
        position: absolute;
        left: 0;
        bottom: 0;
        top: initial
    }

    div#gallery-content-wrp {
        margin-top: 2em
    }

    div.with-icon .ry-each {
        flex-direction: column;
        gap: 1em 0;
        width: 48%
    }

    div.with-icon {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 3em 0;
        margin-top: 2em !important
    }

    div#testimonials-section {
        padding-bottom: 3em !important
    }

    div.qr-section .ry-flex {
        flex-direction: column !important;
        gap: 3em 0 !important
    }

    div.qr-section {
        padding: 0 0 10em 0;
    }

    div#qr-image img {
        margin: auto
    }

    .optilift-hero-banner-wrap .flex {
        justify-content: center;
        display: flex;
        align-items: center
    }

    .optilift-hero-banner-wrap .flex img {
        filter: brightness(0);
        max-width: 300px
    }

    div.ry-text-image-flex-section .flex {
        flex-direction: column !important
    }

    div.optilift-hero-banner-wrap.place-content-center {
        padding: 2em 0 !important
    }

    div#lid-function .ry-each {
        width: 45% !important
    }

    div#optilift-gallery-section div#before-after-block {
        flex-direction: column;
        gap: 3em
    }

    div#optilift-gallery-section:before {
        top: initial;
        bottom: 0;
        width: 100%;
        height: 50%
    }
}

@media(max-width: 767px) {
    div#power-optilift .ry-each {
        flex-direction:column !important
    }

    div#power-optilift .ry-each p,div#power-optilift .ry-each p strong {
        text-align: center !important
    }
}

@media(max-width: 500px) {
    .ry-hero-background img {
        height:300px;
        object-fit: cover;
        object-position: 90%
    }

    div.ry-hero-banner-wrap {
        padding: 2em !important
    }

    div.ry-btn-wrap {
        flex-direction: column
    }

    .ry-btn-wrap a.ry-btn.ry-btn-primary {
        min-width: 100%
    }

    div.ry-each.ry-text-wrap h4 {
        font-size: 20px !important;
        line-height: 1.3
    }

    div.section-headline h2 {
        font-size: 28px !important;
        line-height: 1.2 !important
    }

    .before-after:after {
        height: 26%
    }

    div.qr-section {
        padding: 2em 0 4em 0 !important
    }

    div#lid-function .ry-each {
        width: 100% !important
    }

    div#power-optilift .ry-each p strong {
        font-size: 18px !important
    }
}