.noo-testimonial {
    .owl-dots {
        position: absolute;
        left: 50%;
        .translate(-50%,0);
        bottom: 10px;
        margin-right: 30px;
        > div {
            width: 10px;
            height: 10px;
            background: fade(gray, 50%);
            .border-radius-all(50%);
            margin: 0 2px;
            display: inline-block;
            float: right;
            &.active,
            &:hover {
                background: @primary_color;
            }
        }
    }
    &.style-1 {
        ul {
            list-style: none;
            padding: 0 0 45px;
            position: relative;
            &:before {
                content: '\f10e';
                font-family: "FontAwesome";
                font-size: 40px;
                line-height: 24px;
                color: @primary_color;
                position: absolute;
                right: 60px;
                top: -10px;
                z-index: 9;
            }
            &:after {
                content: '';
                position: absolute;
                right: 48px;
                top: -10px;
                z-index: 8;
                background: @white;
                width: 60px;
                height: 30px;
            }
            li {
                border: 1px solid #e5e4e4;
                padding: 22px;
                .noo-header {
                    &:after {
                        clear: both;
                        display: table;
                        content: '';
                    }
                }
                .noo-thumb {
                    float: left;
                    width: 80px;
                    height: 80px;
                    overflow: hidden;
                    background: #fff;
                    margin-right: 13px;
                    .rounded(50%);
                    img {
                        width: 80px;
                        height: 80px;
                    }
                }
                .noo-content {
                    color: @secondary_color;
                    font-size: 14px;
                    line-height: 24px;
                }
                .stars {
                    margin: 10px 0;
                }
                .noo-title {
                    color: @heading_color;
                    font-size: 14px;
                    line-height: 24px;
                    letter-spacing: .5px;
                    font-weight: 700;
                    margin: 15px 0 0;
                    span {
                        color: @text_color;
                        font-weight: 500;
                        font-style: italic;
                    }
                }
            }
        }
        .owl-nav {
            position: absolute;
            bottom: 0;
            right: 0;
            &:after {
                clear: both;
                display: table;
                content: '';
            }
            .owl-prev, .owl-next {
                float: left;
                margin: 11px;
                background: #666;
                width: 20px;
                height: 20px;
                line-height: 20px;
                text-align: center;
                .rounded(50%);
                i {
                    font-size: 20px;
                    color: #fff;
                }
                &:hover {
                    background: @primary_color;
                }
            }
        }
    }
    &.style-2 {
        padding: 50px 0;
        text-align: center;
        max-width: 830px;
        margin: auto;
        .noo-heading {
            .noo-title {
                color: #fff;
                font-weight: 700;
                text-transform: uppercase;
                font-size: 30px;
                line-height: 26px;
                letter-spacing: 1px;
                margin: 0 0 13px;
                padding: 0;
            }
            .noo-content {
                color: #fff;
                font-size: 16px;
                font-style: italic;
                line-height: 26px;
                font-weight: 500;
            }
        }
        .style-slick-top {
            .noo-content {
                color: #fff;
                font-size: 16px;
                line-height: 26px;
                font-style: italic;
                position: relative;
                margin-top: 45px;
                padding: 0 15px;
                &:before {
                    position: absolute;
                    top: 0;
                    left: 0;
                    content: '\f10d';
                    font-family: "FontAwesome";
                    color: @primary_color;
                }
                &:after {
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    content: '\f10e';
                    font-family: "FontAwesome";
                    color: @primary_color;
                }
            }
            .noo-title {
                text-transform: uppercase;
            }
            .noo-title, .noo-position {
                color: @white;
            }
        }
        .style-slick-list {
            max-width: 440px;
            margin: 0 auto;
            .noo-thumb {
                height: 70px !important;
                width: 70px !important;
                overflow: hidden;
                position: relative;
                .translate(0, 10px);
                .rounded(50%);
                cursor: pointer;
                img {
                    height: 70px;
                    width: 70px;
                }
                &:before {
                    position: absolute;
                    left: 0;
                    top: 0;
                    bottom: 0;
                    right: 0;
                    content: '';
                    background: fade(@heading_color, 73%);
                }
                &.slick-current {
                    height: 90px !important;
                    width: 90px !important;
                    overflow: hidden;
                    .translate(0, 0);
                    .rounded(50%);
                    img {
                        height: 90px;
                        width: 90px;
                    }
                    &:before {
                        content: none;
                    }
                }
            }
            .slick-list {
                overflow: visible;
            }
        }
    }
    &.style-3 {
        .noo-testimonial-grid {
            @media screen and (min-width: 768px) {
                .noo-item {
                    text-align: left;
                    display: table;
                    >* {
                        display: table-cell;
                        vertical-align: middle;
                    }
                }
                .slick-dots {
                    max-width: 230px;
                }
            }
            .noo-item {
                &:hover {
                    background: transparent;
                    .box-shadow(none);
                }
                .noo-thumb {
                    width: 200px;
                    height: auto;
                    text-align: center;
                    .border-radius-all(0);
                    img {
                        display: block;
                        margin: 0 auto 10px;
                        .border-radius-all(100%);
                    }
                }
                .noo-title, .noo-position, .noo-content {
                    color: @white;
                }
                .noo-content {
                    font-style: italic;
                    font-size: 16px;
                    line-height: 30px;
                }
            }
            
        }
    }
    .slick-slider .slick-track {
        padding: 2px 0;
    }
    .stars {
        background: url("../images/stars.png") repeat-x 0 0;
        width: 95px;
        margin: 0 auto;
        label {
            display: block;
            width: 19px;
            height: 19px;
            margin: 0!important;
            padding: 0!important;
            text-indent: -999em;
            float: left;
            position: relative;
            z-index: 10;
            background: transparent!important;
            cursor: pointer;
            &.star-5~span {
                width: 100%;
            }
            &.star-4_5~span {
                width: 90%;
            }
            &.star-4~span {
                width: 80%;
            }
            &.star-3_5~span {
                width: 70%;
            }
            &.star-3~span {
                width: 60%;
            }
            &.star-2_5~span {
                width: 50%;
            }
            &.star-2~span {
                width: 40%;
            }
            &.star-1_5~span {
                width: 30%;
            }
            &.star-1~span {
                width: 20%;
            }
            &.star-0_5~span {
                width: 10%;
            }
            &:hover~span {
                background-position: 0 -19px;
            }
            &.star-5:hover~span {
                width: 100% !important;
            }
            &.star-4:hover~span {
                width: 80% !important;
            }
            &.star-3:hover~span {
                width: 60% !important;
            }
            &.star-2:hover~span {
                width: 40% !important;
            }
            &.star-1:hover~span {
                width: 20% !important;
            }
        }
        span {
            display: block;
            width: 0;
            position: relative;
            top: 0;
            left: 0;
            height: 19px;
            background: url("../images/stars.png") repeat-x 0 -38px;
            -webkit-transition: -webkit-width 0.5s;
            -moz-transition: -moz-width 0.5s;
            -ms-transition: -ms-width 0.5s;
            -o-transition: -o-width 0.5s;
            transition: width 0.5s;
        }
    }
}
.noo-testimonial-grid {
    margin-bottom: 10px;
    .slick-dots {
        bottom: -10px;
        li {
            width: 10px;
            height: 10px;
            &.slick-active, &:hover {
                button {
                    background: @primary_color;
                }
            }
            button {
                padding: 0;
                width: 10px;
                height: 10px;
                display: block;
                background: @white;
                .border-radius-all(100%);
                .transition(all .4s ease-in-out);
                &:before {
                    content: none;
                }
            }
        }
    }
    .slick-arrow {
        z-index: 1;
        top: 50%;
        position: absolute;
        .translate(0, - 50%);
        opacity: 0;
        .transition(all 0.35s ease);
        &.pull-right {
            right: 0;
        }
        &.pull-left {
            left: 0;
        }
        i {
            font-size: 20px;
            font-weight: 900;
            color: @white;
            padding: 10px;
            background: @primary_color;
        }
    }
    &:hover{
        .slick-arrow{
            opacity: 1;
        }
    }
    .noo-item {
        text-align: center;
        padding-top: 20px;
        .transition(all .4s ease-in-out);
        .noo-thumb {
            height: 110px;
            width: 110px;
            overflow: hidden;
            display: inline-block;
            img {
                .rounded(50%);
                height: 110px;
                width: 110px;
            }
        }
        .noo-title {
            font-size: 16px;
            line-height: 26px;
            letter-spacing: 1px;
            font-weight: 700;
            margin: 5px 0 0;
        }
        .noo-position {
            color: #666666;
            font-size: 14px;
            line-height: 26px;
            font-style: italic;
            margin-bottom: 5px;
        }
        .noo-content {
            color: #444444;
            font-size: 14px;
            line-height: 24px;
            padding: 0 25px 30px;
        }
        &:hover {
            background: @white;
            .box-shadow(0 5px 20px 0 fade(#000, 20%));
        }
    }
}