@import "./mixin.scss";
@import "./owl/owl-carousel.scss";
@import "./owl/owl-theme-default.scss";

$colorOne:rgb(241, 241, 241);

.wptrove-testimonials-form{

    width: 100%;
    position: relative;
    background: $colorOne;
    min-height: 400px;
    box-sizing: border-box;
    overflow: auto;

    & *{
        box-sizing: border-box;
    }

    &-overlay{

        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        display:none;
        background: $colorOne;
        z-index: 5;

        &-content{

            display: none;

            .wptrove-spinner{

                padding: 40px 20px 20px 20px;
                text-align: center;
                margin: 0;

                &__span{
                    @include wptrove-frontend-spinner($size: 48px, $border: #000, $borderTop: #fff, $borderSize: 6px);
                }

            }

            .wptrove-message{
                margin: 0;
                text-align: center;
                padding: 0 20px;
            }
            
        }

    }

    &-message{

        width: 80%;
        margin: 20px 10% 0 10%;
        display: none;
        padding: 5px 10px;
        border: 1px dotted #000;

    }

    &-content{

        width: 100%;
        padding: 10%;

    }

    &-item{

        width: 100%;
        margin: 0 0 40px 0;

        &__label{
            display: block;
            margin: 0 0 10px 0;
            font-weight: bold;
        }

        &__message{
            display: block;
            margin: 10px 0 0 0;
        }
        
        &__input{

            width: 100%;
            padding: 0.36rem 0.66rem;

            &--upload{
                background: rgba(0, 0, 0, 0.05);
                padding: 0.5rem 1.0rem;
            }

        }

    }
    
    &-submit{

        width: 100%;

        &__button{

            @include wptrove-frontend-rounded-button(20px, #000, #fff, 12px, 36px);
    
        }

    }
    
}

.wptrove-testimonials-display, .wptrove-testimonials-display *,
.wptrove-testimonials-two-display, .wptrove-testimonials-two-display *{
    box-sizing: border-box;
}

.wptrove-testimonials-display{
    width: 100%;
    max-width: 100% !important;
    position: relative;
    background: #F4F3F3;
}
.wptrove-testimonials-two-display{
    width: 100%;
    max-width: 100% !important;
    position: relative;
    padding: 10% 15%;
}
.owl-stage-outer{
    overflow: hidden;
}
.owl-item{
    float:left;
}
.owl-theme .owl-nav.disabled + .owl-dots{
    margin-top: 30px;
}
.wptrove-testimonial{
    padding: 10%;
}
.wptrove-testimonials-two-display .wptrove-testimonial{
    padding: 10%;
    background: #fff;
    width: 80%;
    margin: 0 10%;
}
.wptrove-testimonial-heading{
    font-size: 2.0rem;
    margin: 0 0 1.0em 0;
    font-weight: bold;
}
.wptrove-testimonial-content{
    font-size: 1.6rem;
    line-height: 1.4em;
    margin: 0 0 1.2em 0;
}
.wptrove-testimonial-avatar{

    width: 100%;
    padding: 0 0 0 120px;
    position: relative;
    min-height: 100px;

    &__name{
        margin: 0 !important;
        font-size: 1.2rem;
        font-weight: bold;
        padding: 5px 0 0 0;
    }

    &__designation{
        margin: 0 !important;
        font-size: 1.2rem;        
    }

    &__image{
        position: absolute;
        top: 0;
        left:0;
        display: inline-block;
        max-width: 90px !important;
        height: 90px !important;
        border-radius: 50%;
    }

}