@import url('https://fonts.googleapis.com/css2?family=Quintessential&family=Roboto+Condensed:wght@700&display=swap');


.carousel-wrap {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    position: relative;
	background:#ffffff;
}

.carousel-wrap2 {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    position: relative;
}

/* fix blank or flashing items on carousel */
.owl-carousel .item, .owl-carousel2 .item {
  position: relative;
  margin:0;
  z-index: 100; 
  text-align:center;
}

.owl-carousel .item2 {
  position: relative;
  margin:0;
  z-index: 100;
  padding:10px;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

  border:dotted 2px #70b0e0;
}

.owl-carousel .item strong {
    position: absolute;
    z-index: 2000;
    bottom: 18%;
    left: 0;
    margin: auto;
    text-align: left;
    color: #ffffff;
    font-size: 39px;
    display: block;
    width: 80%;
    padding: 0 0 0 20px;
    font-family: 'Quintessential', cursive;
    background: -moz-linear-gradient(-45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 60%, rgba(255,255,255,1) 61%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(-45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 60%,rgba(255,255,255,1) 61%,rgba(255,255,255,0) 100%);
    background: linear-gradient(135deg, rgb(0 0 0 / 64%) 0%,rgb(0 0 0 / 48%) 60%,rgb(23 18 18 / 31%) 61%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
}


.owl-carousel .item > .img, .owl-carousel .item2 > .img{width:100%; height:auto;}
.owl-carousel .item > .img2, .owl-carousel .item2 > a .img2{width:95%; height:250px; margin:0 auto;}
.owl-carousel .item > span, .owl-carousel .item2 > span {display:block; text-align:justify; font-size:18px; padding:70px 80px 70px 60px;}
.owl-carousel .item > span:before, .owl-carousel .item2 > span:before {content:""; padding:50px 50px; background:url(../images/quote.png) no-repeat left top;}

.owl-carousel .item > span > h1, .owl-carousel .item2 > span > h1{font-size:22px; font-family:arial; font-weight:bold; text-align:right;}

.owl-carousel .item > img, .owl-carousel .item2 > img{width:180px; height:362px; margin:0 auto;}

.owl-carousel .item > .img_testimonial{width:90px; height:90px; border-radius:50%; margin-top:20px; margin-bottom:10px;}

.owl-carousel .item > .content_testimonial{width:80%; margin:auto; font-size:18px; position:relative; padding:10px 0 0 40px;}
.owl-carousel .item > .content_testimonial > i:nth-child(1){position:absolute; z-index:1000; left:0; top:0; font-size:44px; color:#ffb10c;}



/* end fix */
.owl-nav > div {
  margin-top: -26px;
  position: absolute;
  top: 40%;
  color: #ffffff;
}

.owl-nav i {
  font-size: 62px!important;
}

.owl-nav .owl-prev {
  left: 10px;
}

.owl-nav .owl-next {
  right: 10px;
}

.owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    margin: 5px 7px;
    background: #D6D6D6;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
}

@media (max-width: 800px) {
.carousel-wrap {
    margin: 0 auto;
}

.owl-nav > div {
  top:60%;
}

.owl-nav .owl-prev {
  left: 3%;
}

.owl-nav i {
  font-size: 29px!important;
}

.owl-carousel .item strong{width:95%; font-size:26px;}

.owl-carousel .item > .content_testimonial{width:95%; margin:auto; font-size:16px; position:relative; padding:10px 0 0 40px; text-align:center;}

}

@media (max-width: 580px) {
.carousel-wrap {
    margin: 0 auto;
}

}

@media (max-width: 450px) {
.carousel-wrap {
    margin: 0 auto;
}

.owl-carousel .item strong{font-size:26px;}

}

@media (max-width: 320px) {
.owl-carousel .item strong{font-size:20px;}
}