#testimonials {
    position: relative;
overflow: hidden;}
#testimonials .container {
    z-index: 2;
}
#testimonials .text-wrapper {
    width:50%;
    margin-top: 3.25em;
    margin-right: 11.5%;
}

#testimonial_slider + .button {display: none;}
    
#testimonials .background {
  position: absolute;
  top:0; left:0;
  width:100%; height:100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
#testimonials .background::after {
    position: absolute;
    top:0; left:0;
    content:"";
    width:100%;
    height:100%;
    background:hsla(0,0%,0%,0.15)
}

#testimonials h3 {
    font-size: clamp(1.325rem, 1rem + .5vw, 1.425rem);
    margin:0 0 0.5em;
    color:var(--light-gold-color)
}
#testimonials h2 {
    margin-top:0;
}

#testimonials .ico-star {margin-right: .25em;}

#testimonial_slider {
    display:flex;
    flex-direction: column;
    align-items:center;
    position: relative;
    background:white;
    width:70%;
    min-width: 26em;
    max-width: 35em;
    text-align: center;
    margin:3.25em 0 1em;
    margin-right: 1.75em;
    padding: 0 4.5em 2.25em;
    border-radius: .425em;
    min-height: 29em;
    box-shadow: 0 0 20px hsla(0,0%,0%, .25);
}

#testimonial_slider::after {
    content:"";
    position: absolute;
    top:50%;
    width:calc(100% + 6.5em);
    z-index: -1;
    height:90%;
    background:white;
    border-radius: .425em;
    transform:translate3d(0,-50%,0)

}

#testimonial_slider .portrait-wrapper {
    position: relative;
    top:-3.25em;
    width: 7.5em;
    height:7.5em;
    border-radius: 50%;
    overflow:hidden;
    border:.425em solid white;
    background-color: white;
    box-shadow:0 0 10px hsla(0,0%,0%,.25)
}
#testimonial_slider .portrait {
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height:100%;
    position: absolute;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    transition: opacity .35s cubic-bezier(0,0,0.3,1), visibility .35s cubic-bezier(0,0,0.3,1);
}
#testimonial_slider .portrait.active{
    opacity: 1;
    visibility: visible;
}

#testimonial_slider .slide {
    opacity: 0;
    z-index: -1;
    visibility: hidden;
    position: absolute;
    top:0; left:0; right:0;
}

#testimonial_slider .slide.active {
    z-index: 1;
    position: relative;
    opacity: 1;
    visibility: visible;
}

#testimonial_slider h3 {
    opacity: 0;
    visibility: hidden;
    position: absolute;
	font-family:"Playfair Display", Georgia, Garamond, serif;
    color: var(--gold-color);
    margin-top: 0;
    margin-bottom:0.75em;
    font-size: 1.425em;
    font-weight: 500;
    letter-spacing: .025em;
    transform:translate3d(0,0.5em, 0);
    transition: opacity .35s cubic-bezier(0,0,0.3,1), visibility .35s cubic-bezier(0,0,0.3,1), transform .35s cubic-bezier(0,0,0.3,1);
}
#testimonial_slider p {
    opacity: 0;
    visibility: hidden;
    position: relative;
    font-size: .9375rem;
    line-height: 2;
    margin: 0 auto 5em;
    max-height:8em;
    transition: opacity .35s cubic-bezier(0,0,0.3,1), visibility .35s cubic-bezier(0,0,0.3,1);
}
#testimonial_slider .active p {
    opacity: 1;
    visibility: visible;
    transform:none
}

#testimonial_slider p::before, #testimonial_slider p::after {
    font-family:"mandala";
    content:"\62";
    position: absolute;  
    left: -.75em;
    top: -1.75em;
    font-size: 1.75em;
    color: var(--gold-color);
}
#testimonial_slider p::after {
    left: auto;
    top: auto;
    right: -.75em;
    bottom: -1.75em;
    transform:rotate(180deg)
}
#testimonial_slider small {
    opacity: 0;
    display: block;
    font-size: .875em;
    font-weight: 700;
    color:var(--brown-color);    
    transform:translate3d(0,0.5em, 0);
    transition: opacity .35s .15s cubic-bezier(0,0,0.3,1),  transform .35s .15s cubic-bezier(0,0,0.3,1);
}
#testimonial_slider .slide.active h3, #testimonial_slider .slide.active small {
    opacity: 1;
    visibility: visible;
    position: relative;
    transform:translate3d(0,0,0);
}
#testimonial_slider .navigation {
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 50%;
    transform: translate3d(0,-50%,0);
    width: calc( 100% + 5em);
    height:90%;
    margin:0;
}
#testimonial_slider button {
    color:var(--gold-color);
    font-size: 1.75em;
    line-height: 0;
    background:none;
    border:none;
    cursor:pointer;
    transition: transform .35s cubic-bezier(0,0,0.3,1)
}

#testimonial_slider .prev {
    transform:rotate(180deg)
}
#testimonial_slider .next:hover {
    transform: translate3d(.25em,0,0);
}
#testimonial_slider .prev:hover {
    transform: rotate(180deg) translate3d(.25em,0,0);
}

#testimonial_slider .bullets {
    display: flex;
    position: absolute;
    bottom: 2em;
}
#testimonial_slider .bullets span {
    width:6px; height:6px; border-radius: 6px;
    margin: 0 .25em;
    background-color: #D9D9D9;
    cursor: pointer;
    transition: width .35s cubic-bezier(0,0,0.3,1), background-color .35s cubic-bezier(0,0,0.3,1);
}
#testimonial_slider .bullets span.active {
    border-radius: 1.25em;
    width: 1.25em;
    background-color: var(--gold-color);
    cursor:default;
}

@media only screen and (max-width: 64rem) {
    #testimonials .button:last-child {
        display: block;
        margin: 3.5em 0 1.5em;
    }
    #testimonial_slider { margin-right: 0;    }
    #testimonial_slider .navigation, #testimonial_slider::after,#testimonials .text-wrapper .button {display: none;}
    #testimonials .container {
        flex-direction: column;
    }

    #testimonials .text-wrapper {
        text-align: center;
        width: 100%;
        max-width: 35em;
        margin:0 auto;
        margin-bottom:calc(3em + 2vw)
    }


    #testimonial_slider {width:100%;}
}

@media only screen and (max-width: 32.5rem) {

    #testimonial_slider p::before, #testimonial_slider p::after {
        display:none
    }
    #testimonial_slider {
        min-width: 0;
        padding: 0 2.5em 3.5em;
    }
    #testimonial_slider .slide {
        top: -1.5em
    }
}
@media only screen and (max-width: 26.25rem) {
    #testimonial_slider {
        min-height: 31em;
    } 
}