:root{
    --color-blue:#008da6;
    --color-dark-blue:#005375;
    --color-white:#FFFFFF;
    --color-light:#f8f8f8;
    --color-black:#000000;
    --color-light-grey:#efefef;
    --color-grey:#888686;
    --color-red:#be3137;
    --color-yellow:#f4c146;
}
html,
body {
    position: relative;
    height: 100%;
}
body {
    margin: 0;
    padding: 0;
}
.swiper {
    width: 100%;
    height: 700px;

}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.section-title-span{
    text-decoration: none;
    color: var(--color-blue);
}
.section-subtitle{
    color: var(--color-blue);
}
.testimonial-header-thumb{
    flex:0 0 100px;
    max-width:100px;
    height:100px;
    border-radius:50%;
    overflow:hidden;
    position:relative;
}
.testimonial-header-thumb:before{
    content:"“";
    font-family:nunito,sans-serif;
    font-weight:700;
    color:var(--color-white);
    position:absolute;
    line-height:1;
    font-size:95px;
    left:50%;
    top:100%;
    transform:translate(-50%,-45%);    
}
.testimonial-carousel-content-two{
    width: 90%;
    border:1px dashed var(--color-blue);
    transform:scale(1);
    position:relative;
    padding:20px;
    margin-top: 10px;
    text-align: start;
}
.testimonial-carousel-content-two:before{
    content:"";
    width:20px;
    height:20px;
    background-color:transparent;
    border-left:1px dashed var(--color-blue);
    border-top:1px dashed var(--color-blue);
    position:absolute;
    top:-11px;
    right:40px;
    transform:rotate(45deg);
    background:var(--color-white);
}
.text-secondary{
    font-size: 15px;
}
.bg-line{
    width: 40%;
    position: absolute;
    left: 3%;
    top: 15%;
    z-index: 0;
}
.animation-tab-none-first{
    position: absolute;
    left: 10%;
    top: 40%;
    z-index: 0;
    animation:verticalMove 4s linear infinite;
}
.animation-tab-none-second{
    position: absolute;
    left: 35%;
    top: 30%;
    z-index: 0;
    transform-origin: left top;
    animation:rotateAround 4s linear infinite;
}
.animation-tab-none-third{
    position: absolute;
    left: 60%;
    top: 25%;
    z-index: 0;
    animation:horizontalMove 4s linear infinite;
}
.animation-tab-none-last{
    position: absolute;
    left: 70%;
    top: 20%;
    z-index: 0;
    animation:verticalMove 4s linear infinite;
}

@keyframes verticalMove{
    0%{
       transform:translateY(0);
    }
    25%{
        transform:translateY(20px);
    }
    50%{
        transform:translateY(0);
    }
    75%{
        transform:translateY(-20px);
    }
    100%{
        transform:translateY(0);
    }
}
@keyframes horizontalMove {
    0%{
        transform: translateX(0);
    }
    50%{
        transform: translateX(70px);
    }
    100%{
        transform: translateX(0);
    }
}
@keyframes rotateAround{
    0%{
        transform:rotate(0deg);
    }
    100%{
        transform:rotate(360deg);
    }
}

.swiper-first-item,
.swiper-second-item,
.swiper-third-item,
.swiper-fourth-item{
    margin-top: -300px;
}
.px-20{
    padding-inline: 20px;
}

.swiper-pagination-bullet{
    width: 10px;
    height: 10px;
    border: 5px dotted var(--color-blue);
    border-radius: 100%;
    --swiper-pagination-color:var(--color-blue);
    --swiper-pagination-padding:10px;
}
@media screen and (max-width:992px){
    .animation-tab-none-first,
    .animation-tab-none-second,
    .animation-tab-none-third,
    .animation-tab-none-last{
        display: none;
    }
    .bg-line{
    width: 50%;
    position: absolute;
    left: 20%;
    top: 25%;
    z-index: 0;
    }
}
@media screen and (max-width:768px) {
    .swiper-first-slide .swiper-second-item{
        display: none;
    }
    .swiper-second-slide .swiper-fourth-item {
        display: none;
    }
    .swiper-third-slide .swiper-first-item{
        display: none;
    }
    .bg-line{
        width: 90%;
        position: absolute;
        left: 7%;
        top: 25%;
        z-index: 0;
    }
}