:root{
    --nb-single-banner-17-text-color: var(--nb-color-white);
}
.nb-single-banner-17{

    .nb-img{
        width: 100%;
    }

    > .nb-content-wrapper{

        &.center{
            left: 50%;
            transform: translateX(-50%);
            text-align: center;
            .btn-wrapper{
                justify-content: center;
            }
        }
        &.right{
            left: unset;
            right: 50px;
            text-align: right;
            .btn-wrapper{
                justify-content: flex-end;
            }
        }

        position: absolute;
        bottom: 50px;
        left: 50px;
        max-width: 600px;

        .nb-display{
            line-height: 1;
            color: var(--nb-single-banner-17-text-color);
        }
        .nb-sub-heading{
            color: var(--nb-single-banner-17-text-color);
        }

        > * + *{
            margin-top: 30px;
        }

        .btn-wrapper{
            display: flex;
            gap: 30px;

            .nb-btn{
                height: 72px;
                line-height: 70px;
                min-width: 210px;
                padding-block: 0;
                background: var(--nb-color-gray-100);
                color: var(--nb-btn-light-color);
                border-color: var(--nb-color-gray-100);
                font-size: var(--nb-font-size-18);

                &:hover{
                    background: var(--nb-btn-light-hover-bg);
                    color: var(--nb-btn-light-hover-color);
                    border-color: var(--nb-btn-light-hover-border-color);
                }
            }
        }
    }

}

@media screen and (max-width: 992px) {
    .nb-single-banner-17{
        > .nb-content-wrapper{
            &.right{
                left: unset;
                right: 20px;
            }

            bottom: 40px;
            left: 20px;

            > * + *{
                margin-top: 15px;
            }

            .btn-wrapper{
                display: flex;
                gap: 15px;

                .nb-btn{
                    height: 44px;
                    line-height: 42px;
                    min-width: 150px;
                }
            }
        }
    }
}

@media screen and (max-width: 576px) {
    .nb-single-banner-17{
        .nb-btn{
            font-size: var(--nb-font-size-16) !important;
        }

        .nb-sub-heading.nb-sub-heading-l{
            font-size: var(--nb-font-size-16);
        }

    }

}