File: /home/zwafgyp/dodolodge-net/wp-content/themes/hotel-wp/assets/sass/shortcodes/_testimonials.scss
.thim-testimonials-home1{
padding: 145px 0 130px 0;
.vc_column-inner{
padding-top: 0 !important;
}
@media(max-width: 1199px){
padding: 100px 0;
}
@media(max-width: 767px){
padding: 70px 0;
}
}
.thim-testimonials-wrap{
margin-bottom: 90px;
@media(max-width:767px){
margin-bottom: 50px;
}
&.layout-4{
.thim-testimonials{
max-width: 1024px;
margin-bottom: 80px;
@media(max-width:1199px){
margin-bottom: 30px;
}
.testimonials-item{
.content{
opacity: 1;
font-size: 18px;
margin-bottom: 25px;
line-height: 1.5;
@media(max-width: 767px){
margin-bottom: 15px;
}
}
.title{
color: #ffffff;
font-size: 22px;
margin-bottom: 20px;
@media(max-width: 767px){
margin-bottom: 10px;
}
}
.regency{
font-size: 18px;
font-weight: 600;
font-style: italic;
color: var(--thim-body-primary-color);
opacity: 1;
}
.rating{
margin-top: 90px;
margin-bottom: 0;
text-align: center;
position: relative;
font-size: 150px;
line-height: 1;
font-weight: bold;
@media(max-width:1199px){
margin-top: 30px;
font-size: 100px;
}
@media(max-width: 767px){
font-size: 70px;
margin-top: 10px;
}
&::before{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 28px;
font-weight: 900;
font-family: 'Line Awesome Free';
}
.number{
color: rgba(255,255,255,0.5);
}
}
}
}
.thim-testimonial-custom-dots{
position: relative;
.owl-nav{
display: flex;
justify-content: space-between;
position: absolute;
width: 100%;
top: 50%;
transform: translateY(-50%);
margin-top: 0;
pointer-events: none;
.owl-prev,.owl-next{
border: none;
background: transparent;
color: transparent;
position: relative;
padding: 0;
margin: 0;
pointer-events: auto;
&:hover{
&::before{
color: var(--thim-body-primary-color);
}
}
&::before{
position: absolute;
font-family: 'Line Awesome Free';
font-weight: 900;
font-size: 24px;
color: #ffffff;
}
}
.owl-prev{
left: -30px;
&::before{
content: '\f104';
}
}
.owl-next{
right: -40px;
&::before{
content: '\f105';
}
}
}
}
}
}
.thim-testimonials {
text-align: center;
color: #fff;
max-width: 50%;
margin: 25px auto 110px;
.rating{
margin-bottom: 35px;
&::before{
content: '\f005\f005\f005\f005\f005';
font-family: FontAwesome;
letter-spacing: 4px;
font-size: 12px;
color: #fdb913;
}
}
.testimonials-item {
.content{
opacity: 0.75;
}
.title{
font-size: 20px;
text-transform: capitalize;
font-weight: bold;
margin-bottom: 10px;
}
.regency{
font-size: 14px;
opacity: 0.45;
text-transform: uppercase;
}
}
&::after{
content: ' ';
height: 72px;
border: 1px solid;
border-color: rgba(255,255,255,0.15);
position: absolute;
top: 220px;
}
}
.thim-testimonial-custom-dots.owl-theme {
width: 192px;
margin: 0 auto;
position: relative;
.img-dot {
position: relative;
z-index: 1;
border-radius: 50%;
overflow: hidden;
cursor: pointer;
&::before {
position: absolute;
content: '';
width: 100%;
height: 100%;
background: #000;
opacity: 0.3;
left: 0;
right: 0;
}
}
.owl-item {
width: 64px !important;
margin-top: 4px;
&.center {
width: 72px !important;
z-index: 10;
opacity: 1 !important;
margin-top: 0px;
.img-dot {
z-index: 2;
&::before {
opacity: 1;
background: unset;
}
}
}
}
.item-left{
left: 8px;
}
.item-right{
right: 8px;
}
}
.thim-sc-testimonial {
text-align: center;
&.layout-1{
border: none !important;
&.left{
padding: 50px;
background: #fff;
position: relative;
max-width: 540px;
float: right;
@media(max-width:1199px){
float: none;
}
@media(max-width:375px){
padding: 30px !important;
}
&::before{
position: absolute;
content: '';
width: 0;
height: 0;
top: 99%;
left: 60px;
border-right: 50px solid transparent;
border-top: 50px solid #fff;
}
.block-title{
padding-left: 0;
&::before{
left: unset;
width: 45px;
right: -70px;
}
}
.testimonial-item{
padding-right: 0;
@media (max-width: 566px) and (min-width: 376px){
padding-right: 0 !important;
}
.testimonial-content{
font-style: inherit;
font-size: 18px;
margin-bottom: 30px;
@media (max-width: 959px) and (min-width: 768px){
max-width: 100% !important;
}
@media(max-width: 375px){
max-width: 100% !important;
}
}
}
.owl-dots{
top: unset;
bottom: 0;
.owl-dot{
display: inline-block;
margin-bottom: 0;
span{
width: 12px;
height: 12px;
background: #e0e0e0;
border: none;
border-radius: unset;
transform: rotate(45deg);
}
&.active{
span{
border: 1px solid var(--thim-body-primary-color);
}
}
}
}
}
.block-title{
color: #000000;
display: inline-block;
}
.testimonial-item{
.testimonial-content{
color: #565656;
}
.testimonial-rating{
&::before{
font-size: 18px;
}
}
.testimonial-name{
display: inline-block;
color: #565656;
font-size: 18px;
margin-top: 5px;
font-weight: 500;
}
}
}
.block-title {
position: relative;
font-size: 18px;
margin: 0;
text-transform: uppercase;
&:after {
position: absolute;
content: "";
width: 60px;
height: 2px;
left: 0;
right: 0;
bottom: -10px;
margin: auto;
}
}
.testimonial-item {
max-width: 620px;
margin: 0 auto;
.testimonial-content {
color: #fff;
display: inline-block;
font-size: 24px;
font-weight: 300;
margin: 68px 0 30px 0;
line-height: 28px;
}
.testimonial-rating {
margin: 0;
&:before {
content: '\f005\f005\f005\f005\f005';
font-family: FontAwesome;
letter-spacing: 4px;
font-size: 12px;
}
}
.testimonial-name {
font-size: 18px;
color: #fff;
text-transform: capitalize;
margin: 0;
}
}
.owl-dots {
margin-top: 50px !important;
.owl-dot {
span {
width: 8px;
height: 8px;
border: 2px solid #9B9B9B;
background: none;
@include opacity(1);
}
&.active span {
background: #fff;
border-color: #fff;
}
}
}
&.left {
position: relative;
text-align: left;
padding: 60px;
max-width: 661px;
.owl-carousel .owl-wrapper-outer {
max-width: 85%;
}
.block-title {
padding-left: 70px;
&:before {
width: 60px;
content: "";
display: inline-block;
vertical-align: middle;
position: absolute;
top: 50%;
left: 0;
@include translate(0%, -50%);
}
&:after {
display: none;
}
}
.testimonial-item {
padding-right: 80px;
.testimonial-content {
font-size: 18px;
margin: 18px 0;
font-style: italic;
line-height: 28px;
}
}
.owl-dots {
margin-top: 0 !important;
position: absolute;
right: 0;
top: 22px;
.owl-dot {
display: block;
margin-bottom: 25px;
&:last-child {
margin-bottom: 0;
}
span {
width: 8px;
height: 8px;
border: 2px solid #9B9B9B;
background: none;
@include opacity(1);
}
&.active span {
background: #fff;
border-color: #fff;
}
}
}
}
}
.testimonial-overlay {
&:after {
content: '';
width: 2000px;
height: 1000px;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: #1B4F8A;
@include opacity(.51);
}
}
@media (min-width: 768px) {
.testi-width.vc_column_container {
width: 57.66666667%;
}
}
.thim-sc-testimonials{
.testimonial-slider{
margin-left: -15px;
margin-right: -15px;
.testimonial-item-wrapper{
padding: 0 15px;
&.slick-current{
.testimonial-item{
margin-bottom: 50px;
&::before{
position: absolute;
content: '';
width: 0;
height: 0;
top: 99%;
left: 60px;
border-right: 50px solid transparent;
border-top: 50px solid #fff;
}
&::after{
position: absolute;
content: '';
background: url(./assets/images/quote.png);
width: 42px;
height: 35px;
top: 50px;
left: 40px;
}
}
}
.testimonial-item{
padding: 120px 40px 40px 40px;
background: #fff;
position: relative;
color: #565656;
&::after{
position: absolute;
content: '';
background: url(./assets/images/quote.png);
width: 42px;
height: 35px;
top: 50px;
left: 40px;
}
.testimonial-content{
margin-bottom: 25px;
}
.testimonial-rating {
margin-bottom: 10px;
&:before {
content: '\f005\f005\f005\f005\f005';
font-family: FontAwesome;
letter-spacing: 4px;
font-size: 18px;
color: #e7ad44;
}
}
.testimonial-name{
font-size: 18px;
font-weight: 500;
}
}
}
.slick-dots{
margin-left: 0;
margin-bottom: 0;
text-align: center;
li{
cursor: pointer;
display: inline-block;
display: inline-block;
line-height: 1;
width: 11px;
height: 11px;
background: #ffffff;
transform: rotate(45deg);
margin: 0 5px;
&.slick-active,&:hover{
border:1px solid #565656;
}
button{
font-size: 0;
position: relative;
line-height: 1;
border: none;
}
}
}
}
}
// Fix only for demo
.vc_custom_1476071949791 .thim-sc-testimonial.left {
border-color: #DDA32D !important;
}