// Testimonial Section area 
.testimonial-section-area {
    position: relative;

    &.home-five {
        margin-top: 120px;

        @media only screen and (max-width: 768px) {
            margin-top: 100px;
        }
    }

    &.home-six {
        margin-top: 120px;
        padding: 120px 0px !important;

        &.testimonial-bg {
            min-height: auto;
        }

        .section-title {
            margin-bottom: 0;

            .sub-title-02 {
                color: $white;
            }

            .title {
                text-transform: uppercase;
            }
        }
    }

    &.people-say {
        overflow: hidden;

        &::after {
            content: '';
            position: absolute;
            width: 60%;
            height: 100%;
            background: #F9F9FF;
            content: '';
            top: 0;
            right: -102px;
            transform: skew(12deg);
        }
    }

    &.testimonial-bg {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        min-height: 564px;
        padding: 120px 0px 0px;

        &::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: rgba(4, 7, 46, 0.7);
        }
    }

    &.testimonial-bg-02 {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        min-height: 564px;
        padding: 70px 0px;
    }

    .shapes {
        &.political-shape {
            .shape-01 {
                left: 92%;
                z-index: 1;
                opacity: 1;
            }

            .shape-02 {
                left: 77%;
                z-index: 1;
                opacity: 1;
            }

            .shape-03 {
                left: 82%;
                z-index: 1;
                opacity: 1;
            }

            .shape-04 {
                left: 80%;
                z-index: 1;
                opacity: 1;
            }
        }

        .shape-01 {
            position: absolute;
            top: 0;
            left: 19%;
            opacity: 0.5;
        }

        .shape-02 {
            position: absolute;
            bottom: 0;
            left: 18px;
            opacity: 0.5;
        }

        .shape-03 {
            width: 290px;
            height: 1px;
            background-color: var(--main-color-one);
            position: absolute;
            top: 260px;
            left: 9%;
            transform: rotate(120deg);
            opacity: 0.5;
            z-index: 0;
        }

        .shape-04 {
            width: 315px;
            height: 1px;
            background-color: var(--main-color-one);
            position: absolute;
            top: 175px;
            left: 7%;
            transform: rotate(120deg);
            opacity: 0.5;
            z-index: 0;
        }

        &.style-01 {
            .shape-01 {
                left: 92%;
            }

            .shape-02 {
                left: 75%;
            }

            .shape-03 {
                left: 81%;
            }

            .shape-04 {
                left: 80%;
            }
        }

        .people-img-shape {
            position: absolute;
            top: -125px;
            left: 100px;
        }
    }

    .testimonial-carousel-three {
        .owl-dots {
            padding-left: 20px;

            .owl-dot {
                display: inline-block;

                span {
                    width: 14px;
                    height: 14px;
                    margin: 5px 7px;
                    background: transparent;
                    border: 1px solid #fff;
                    display: block;
                    transition: opacity .2s ease;
                    border-radius: 1px;
                    position: relative;
                }
            }
        }

        .owl-dots .owl-dot.active span,
        .owl-theme .owl-dots .owl-dot:hover span {
            background: #fff;

            &::after {
                content: '';
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
                width: 6px;
                height: 6px;
                border-radius: 1px;
                background: red;
            }
        }
    }

    .testimonial-carousel-four {
        .owl-nav {
            .owl-prev {
                position: absolute;
                left: 4%;
                font-size: 25px;
                color: var(--main-color-one);
            }

            .owl-next {
                position: absolute;
                left: 10%;
                font-size: 25px;
                color: var(--main-color-one);
            }
        }
    }

    .testimonial-carousel-nine {
        .owl-nav {
            position: absolute;
            left: -105%;
            display: flex;
            top: 70%;

            .owl-prev,
            .owl-next {
                width: 40px;
                height: 40px;
                line-height: 40px;
                text-align: center;
                background: $white;
                color: var(--main-color-one);
                font-size: 20px;
                cursor: pointer;
                transition: .5s all ease;

                &:hover {
                    background: var(--main-color-one);
                    color: $white;
                }
            }

            .owl-prev {
                margin-right: 15px;
            }
        }
    }

    .owl-carousel .owl-item img {
        max-width: 60px;

        &.quotes-shape {
            max-width: 160px;
            position: absolute;
            right: 0;
            top: 28%;
        }

        &.style-01 {
            max-width: 100px;
        }
    }
}

.political-testimonial-section {
    margin-top: 85px;
    background: #FCFCFC;
    position: relative;
    z-index: 0;
    padding: 116px 0px 100px 0px;

    .section-title {
        margin-bottom: 40px;
    }

    .pt-shape {
        position: absolute;
        left: 5%;
        top: 15%;
        opacity: 0.15;
        animation: updown-three 3.5s both linear alternate infinite;
    }

    .pt-shape-02 {
        position: absolute;
        right: 35%;
        top: 10%;
        opacity: 0.15;
        animation: updown-three 3.5s both linear alternate infinite;
    }

    .pt-shape-03 {
        position: absolute;
        right: 39%;
        bottom: 10%;
        opacity: 0.15;
        animation: updown-three 3.5s both linear alternate infinite;
    }

    .pt-shape-04 {
        position: absolute;
        bottom: 15%;
        left: 5%;
        opacity: 0.15;
        animation: updown-three 3.5s both linear alternate infinite;
    }

    .pt-shape-05 {
        position: absolute;
        bottom: 25%;
        left: 3%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }

    .pt-shape-06 {
        position: absolute;
        top: 25%;
        left: 25%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }

    .pt-shape-07 {
        position: absolute;
        top: 5%;
        left: 35%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }

    .pt-shape-08 {
        position: absolute;
        top: 5%;
        right: 5%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }

    .pt-shape-09 {
        position: absolute;
        top: 25%;
        right: 25%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }

    .pt-shape-10 {
        position: absolute;
        bottom: 20%;
        right: 32%;
        opacity: 0.15;
        animation: spin 3s both linear alternate infinite;
    }


    .pt-single-item {
        .icon {
            text-align: center;
            font-size: 60px;
            color: var(--main-color-one);
        }

        .author-name {
            text-align: center;
            font-size: 20px;
            line-height: 35px;
            font-family: var(--body-font);
            font-weight: 700;
            color: #505050;
            margin-bottom: 5px;
        }

        .description {
            text-align: center;
            font-size: 18px;
            line-height: 35px;
            font-family: var(--body-font);
            font-weight: 400;
            color: #505050;
        }
    }

    .political-slider-two {
        max-width: 310px;
        margin: auto;
        position: relative;

        &::before {
            content: '';
            position: absolute;
            left: -80px;
            top: 85px;
            width: 80px;
            height: 1px;
            background: var(--main-color-one);
        }

        &::after {
            content: '';
            position: absolute;
            right: -93px;
            top: 85px;
            width: 80px;
            height: 1px;
            background: var(--main-color-one);
        }

        .slick-slide {
            &.slick-center {
                img {
                    transform: scale(1.2);
                    border-color: var(--main-color-one);
                }
            }

            img {
                width: auto !important;
                display: block;
                border: 4px solid #fff;
                border-radius: 50%;
                box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
                margin: 50px 0px 30px 20px;
                transition: .5s all ease;

                &:hover {
                    border-color: var(--main-color-one);
                }
            }
        }

        .slide-arrow {
            &.prev-arrow {
                position: absolute;
                left: -45%;
                top: 47%;
                background: transparent;
                border: 0px;
                font-size: 18px;
                color: var(--main-color-one);
                padding: 0;

                &:focus {
                    outline: none;
                }
            }

            &.next-arrow {
                position: absolute;
                right: -45%;
                top: 47%;
                background: transparent;
                border: 0px;
                font-size: 18px;
                color: var(--main-color-one);
                padding: 0;

                &:focus {
                    outline: none;
                }
            }
        }
    }
}


@keyframes updown-three {
    0% {
        transform: translateX(100px);
    }

    100% {
        transform: translateX(0px);
    }
}

@keyframes spin {
    0% {
        transform: translateX(50px) rotate(0deg);
    }

    100% {
        transform: translateX(0px) rotate(360deg);
    }
}

@keyframes pt {
    0% {
        width: 0px;
    }

    100% {
        width: 80px;
    }
}