*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-size: 16px;
    font-weight: 300;
    line-height: 23px;
    font-family: 'Poppins', sans-serif;
}
ul{
    list-style-type:none;
}
a,a:hover{
    text-decoration: none;
}
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700');
body{
    font-family: 'Montserrat', sans-serif;
    .testimonial{
        padding: 100px 0;
        .row{
            .tabs{
                all: unset;
                margin-right: 50px;
                display: flex;
                flex-direction: column;
                li{
                    all:unset;
                    display: block;
                    position: relative;
                    &.active{
                        &::before{
                            position: absolute;
                            content: "";
                            width: 50px;
                            height: 50px;
                            background-color: #71b85f;
                            border-radius: 50%;
                        }
                    }
                    &.active{
                        &::after{
                            position: absolute;
                            content: "";
                            width: 30px;
                            height: 30px;
                            background-color: #71b85f;
                            border-radius: 50%;
                        }
                    }
                    &:nth-child(1){
                       align-self: flex-end;
                       &::before{
                            left: 64%;
                            bottom: -50px;
                       }
                       &::after{
                            left: 97%;
                            bottom: -81px;                           
                       }
                       figure{
                            img{
                                margin-left:auto;
                            }
                       }
                    }
                    &:nth-child(2){
                        align-self: flex-start;
                        &::before{
                            right: -65px;
                            top: 50%;                    
                        }
                        &::after{
                            bottom: 101px;
                            border-radius: 50%;
                            right: -120px;
                        }
                        figure{
                            img{
                                margin-right:auto;
                                max-width: 300px;
                                width: 100%;
                                margin-top: -50px;
                            }
                        }
                    }
                    &:nth-child(3){
                        align-self: flex-end;
                        &::before{
                            right: -10px;
                            top: -66%;                  
                        }
                        &::after{
                            top: -130px;
                            border-radius: 50%;
                            right: -46px;
                        }
                        figure{
                            img{
                                margin-left:auto;
                                margin-top: -50px;
                            }
                        }
                        &:focus{
                            border: 10px solid red;
                        }
                    }
                    figure{
                        position: relative;
                        img{
                            display: block;
                        }
                        &::after{
                            content: "";
                            position: absolute;
                            top:0;
                            z-index: -1;
                            width: 100%;
                            height: 100%;
                            border: 4px solid #dff9d9;
                            border-radius: 50%;
                            -webkit-transform: scale(1);
                            -ms-transform: scale(1);
                            transform: scale(1);
                            -webkit-transition: 0.3s;
                            -o-transition: 0.3s;
                            transition: 0.3s;
                        }
                        &:hover{
                            &::after{
                                -webkit-transform: scale(1.1);
                                -ms-transform: scale(1.1);
                                transform: scale(1.1);
                            }
                        }
                    }
                }
                &.carousel-indicators{
                    li.active{
                        figure{
                            &::after{
                                -webkit-transform: scale(1.1);
                                -ms-transform: scale(1.1);
                                transform: scale(1.1);
                            }
                        }
                    }
                }
            }
            .carousel{
                > h3{
                    font-size: 20px;
                    line-height: 1.45;
                    color: rgba(0,0,0,.5);
                    font-weight: 600;
                    margin-bottom: 0;
                }
                h1{
                    font-size: 40px;
                    line-height: 1.225;
                    margin-top: 23px;
                    font-weight: 700;
                    margin-bottom: 0;
                }
                .carousel-indicators{
                    all: unset;
                    padding-top: 43px;
                    display: flex;
                    list-style: none;
                    li{
                        background: #000;
                        background-clip: padding-box;
                        height: 2px;
                    }
                }
                .carousel-inner{
                   .carousel-item{
                        .quote-wrapper{
                            margin-top: 42px;
                            p{
                                font-size: 18px;
                                line-height: 1.72222;
                                font-weight: 500;
                                color: rgba(0,0,0,.7);
                            }
                            h3{
                                color: #000;
                                font-weight: 700;
                                margin-top: 37px;
                                font-size: 20px;
                                line-height: 1.45;
                                text-transform: uppercase;
                            }
                        }
                   }
                }
            }
        }
    }
}
@media only screen and (max-width: 1200px) {
    body{
        .testimonial{
            .row{
                .tabs{
                    margin-right: 25px;
                }
            }
        }
    }
}
@media only screen and (max-width: 567px) {
    
}