/* Begin : testimonials  */
.slider.testimonials {
    margin-top: 45px; /* 80px */
    margin-bottom: 85px
}

.flexslider.testimonials {
    margin: 0;
    padding: 10px 40px 20px 0;
}
.flexslider.testimonials {
    -moz-box-shadow: 0 0 39px -17px #aaa;
    -webkit-box-shadow: 0 0 39px -17px #aaa;
    box-shadow: 0 0 39px -17px #aaa;
}

.flexslider.testimonials .slides img {
    width: auto;
}

span.triangle_speech_tip {
    background-image: url(/_frontend_output/images/testimonialTriangle.png);
    display: block;
    z-index: 1000;
    position: relative;
    top: -58px; /* This need amend when padding-top on #slider-testimonials is amended */
    right: -85%;
    width: 72px;
    height: 45px;
    border: 0px solid red;
}

ul.testimonials {
    /*padding: 65px 105px;*/
    /*display: flex*/
}
    ul.testimonials span.quote-left {
        /*background-image: url(/_frontend_output/images/testimonialQuotesTopLeft.png);*/
        display: block;
        float: left;
        position: relative;
        z-index: 1000;
        margin-left: 55px;
        /*width: 111px;
        height: 78px;*/
        border: 0px solid red;
    }

    ul.testimonials span.quote-right {
        /*background-image: url(/_frontend_output/images/testimonialQuotesTopLeft.png);*/
        display: block;
        float: right;
        position: relative;
        z-index: 1000;
        margin-right: 20px;
        /*width: 111px;
        height: 78px;*/
        border: 0px solid red;
    }


    ul.testimonials span.wording {

        display: block;
        float:left;
        position: relative;
        width: 84%;
        padding-top: 45px;
        padding-left: 50px;
        border: 0px solid red;
    }
        ul.testimonials span.wording p {
            font-family: Montserrat,Arial,Helvetica,sans-serif;
            font-size: 1.2em;
        }

    ul.testimonials .quotee {
        font-family: Montserrat,Arial,Helvetica,sans-serif;
        font-size: 1.2em;        
        font-weight: bold;
        color: #702F8A;
    }

/* End : testimonials  */



ul.slides.testimonials li {
    /*display: inline-flex !important*/
}


.flexslider.testimonials .loading, #carousel .loading {
    display: none
}

.testimonials .flex-control-nav {
    bottom: -70px;
    -webkit-margin-before: 0 !important;
    margin-block-start: 0 !important;
    -webkit-margin-after: 0 !important;
    margin-block-end: 0 !important;
    -webkit-padding-start: 0 !important;
    padding-inline-start: 0 !important;
}

.testimonials .flex-control-paging li a.flex-active {
    width: 15px;
    height: 15px;
    background: rgba(0,0,0,0);
}

.testimonials .flex-control-paging li a {
    width: 15px;
    height: 15px;
    background: rgba(0,0,0,.2);
    -webkit-box-shadow: inset 0 0 2px rgb(0 0 0 / 30%);
    -moz-box-shadow: inset 0 0 2px rgba(0,0,0,.3);
    -o-box-shadow: inset 0 0 2px rgba(0,0,0,.3);
    box-shadow: inset 0 0 2px rgb(0 0 0 / 30%);
}

@media screen and (max-width: 940px) {


    span.triangle_speech_tip {
        top: -49px !important; /* This need amend when padding-top on #slider-testimonials is amended */
    }

    /* Make the quotes smaller too */
    .flexslider .slides img {
        /*width: 60% !important;*/ /*  xyz */
    }

    .flexslider.testimonials {
        padding: 0 10px 30px 0 !important;
    }


    ul.testimonials li  {
       display: flex !important;
       flex-direction: column;
       padding-bottom: 20px;
    }

    ul.testimonials span.quote-left {
        float: none;
        margin-left: 55px;        
    }

    ul.testimonials span.quote-right {   
        margin-top: 25px;
        margin-right: 50px;
        align-self: flex-end
    }


    ul.testimonials span.wording {
        width: 93% !important;
        padding-left: 55px;
        padding-top: 30px;
    }

        ul.testimonials span.wording p {
            font-size: 1.1em !important;
        }

    ul.testimonials .quotee {
        font-size: 1.1em !important;
    }

    .flex-direction-nav {
        display: none !important;
    }


}

@media screen and (max-width: 770px) {

}

@media screen and (max-width: 450px) {
    ul.testimonials span.wording {
        width: 85% !important;
    }

        ul.testimonials span.wording p {
            font-size: 1.0em !important;
        }

    ul.testimonials .quotee {
        font-size: 1.0em !important;
    }

}