@import "../../scss_components/base_variables";
@import "../../scss_components/mixins";

.stm_testimonials_wrapper_style_2 {
    .stm_lms_testimonials_single {
        padding: 75px 0 70px;
        background-size: cover;
        background-position: 50% 50%;
        &__content {
            position: relative;
            max-width: 737px;
            min-height: 525px;
            padding: 80px 90px 79px;
            background-color: #fff;
            &:after {
                position: absolute;
                top: 50%;
                right: -24px;
                margin-top: -17px;
                content: '';
                display: block;
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 17.5px 0 17.5px 24px;
                border-color: transparent transparent transparent #fff;
            }
            h3 {
                font-size: 36px;
            }
        }
        &__excerpt {
            margin-bottom: 34px;
            font-size: 18px;
            line-height: 28px;
            p {
                font-weight: 300;
                line-height: 32px;
            }
        }
        &__testimonial_user {
            font-weight: 600;
            font-size: 18px;
        }
        &__testimonial_profession {

        }
    }
}

@include breakpoint(tabletonly) {
    .stm_testimonials_wrapper_style_2 {
        .stm_lms_testimonials_single {
            background-position: 63% 50% !important;
            &__content {
                max-width: 80%;
                padding: 30px;
                background-color: rgba(255,255,255,0.8);
                &:after {
                    border-left-color: rgba(255,255,255,0.8);
                }
            }
        }
    }
}

@include breakpoint(mobile) {
    .stm_testimonials_wrapper_style_2 {
        .stm_lms_testimonials_single {
            padding: 30px 0;
            &__content {
                max-width: 100%;
                min-height: 665px;
                padding: 50px 30px;
                &:after {
                    display: none;
                }
            }
        }
    }
}