/* ------------------------
    Theme Button
------------------------*/
.themeht-btn { position: relative; overflow: hidden; z-index: 9;     
	padding: 12px 20px;
    display: inline-block;
    border-radius: 6px; border: none; color: var(--themeht-white-color); font-weight: 700; font-size: 16px; line-height: 22px; }
.themeht-btn.primary-btn { background: var(--themeht-primary-color); color: var(--themeht-white-color); }
.themeht-btn.secondary-btn { background: var(--themeht-secondary-color); color: var(--themeht-white-color); }
.themeht-btn.dark-btn { background: var(--themeht-bg-dark-color); color: var(--themeht-white-color); background-size: inherit;border-radius:50px }

.themeht-btn:before { content: ""; position: absolute; top: 0px; right: 0px; width: 0; height: 100%; opacity: 1; transition: 0.6s; z-index: -1; }
.themeht-btn.primary-btn:before { background: var(--themeht-secondary-color); }
.themeht-btn.secondary-btn:before { background: var(--themeht-primary-color); }
.themeht-btn.dark-btn:before { background: var(--themeht-primary-color); }
.themeht-btn.white-btn:before { background: var(--themeht-primary-color); }
.themeht-btn.outline-btn:before { background: var(--themeht-primary-color); }
.themeht-btn.white-outline-btn:before { background: var(--themeht-white-color); }
.themeht-btn:hover:before, .themeht-btn:focus:before { width: 100%; }

.themeht-btn.white-btn {     /* background: var(--themeht-white-color); */
    color: #3dbb89;
    background-size: inherit;
    border: 1px solid #3dbb89;
    border-radius: 50px; }
.themeht-btn.white-btn:hover, .themeht-btn.white-btn:focus { color: var(--themeht-white-color); }
.themeht-btn.outline-btn { border: 1px solid var(--themeht-text-color); color: var(--themeht-text-color); background-size: inherit; }
.themeht-btn.outline-btn:hover, .themeht-btn.outline-btn:focus { border-color: var(--themeht-primary-color); color: var(--themeht-white-color); }
.themeht-btn.white-outline-btn { border: 1px solid var(--themeht-white-color); color: var(--themeht-white-color); background-size: inherit; }
.themeht-btn.white-outline-btn:hover, .themeht-btn.white-outline-btn:focus { background: var(--themeht-primary-color); border-color: var(--themeht-primary-color); color: var(--themeht-white-color); }

.arrow-btn, a.arrow-btn { background: linear-gradient(90deg, var(--themeht-primary-color)  20%, var(--themeht-secondary-color) 100%); display: inline-block; color: var(--themeht-white-color); z-index: 500; width: 50px; height: 50px; border-radius: 100%; font-size: 20px; text-align: center; line-height: 50px; }
.arrow-btn:hover, a.arrow-btn:hover { color: var(--themeht-white-color); background: linear-gradient(90deg, var(--themeht-primary-color)  20%, var(--themeht-secondary-color) 100%) }


/* ------------------------
    Social Icons
------------------------*/
.social-icons ul { padding: 0; margin: 0; line-height: 0; }
.social-icons li { display: inline-block; list-style: none; padding: 0; margin: 0 8px 0 0; }
.social-icons li a { position: relative; display: flex; align-items: center; justify-content: center; height: 40px; width: 40px; line-height: 1; font-size: 14px; text-align: center; margin: 0; border-radius: 50%; background: var(--themeht-bg-light-color); color: var(--themeht-text-color); overflow: hidden; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; z-index: 9;  }
.social-icons li a:hover { color: var(--themeht-white-color); }
.social-icons li a:before { border-radius: 50%; transform: scale(0); content: ""; position: absolute; top: 0px; right: 0px; width: 100%; height: 100%; background: var(--themeht-primary-color); opacity: 1; transition: 0.6s; z-index: -1; }
.social-icons li a:hover:before { transform: scale(1); }


/* ------------------------
    Testimonials
------------------------*/
.testimonial { position: relative; }
.testimonial p { font-size: 20px; line-height: 32px; margin: 30px 0; position: relative; }
.testimonial .testimonial-caption { z-index: 9; position: relative; }
.testimonial .testimonial-caption label { margin-bottom: 0; font-weight: 500; color: var(--themeht-text-color); display: block; }
.testimonial .testimonial-caption h5 { color: var(--themeht-primary-color); display: inline-block; margin-bottom: 5px; }
.testimonial .testimonial-quote i { position: relative; display: inline-block; z-index: 9; color: #f3f3f3; font-size: 70px; line-height: 1;}
.testimonial-img img { border-radius: 24px; position: relative; z-index: 9; width: 100%; }
.testimonial-media { display: flex; align-items: center; }
.testimonial.style-1 { background-color: var(--themeht-white-color); text-align: center; border-radius: 24px; width: 100%; padding: 70px; box-shadow: none; margin-bottom: 150px; }
.testimonial.style-1::before { z-index: -1; content: ""; background-color: rgba(255, 255, 255, .5); box-shadow: 0 8px 250px rgba(24, 29, 88, .05); width: 92%; height: 100px; position: absolute; left: 4%; bottom: -30px; border-radius: 24px; }
.testimonial.style-1::after { z-index: -1; content: ""; background-color: rgba(255, 255, 255, .5); width: 84%; height: 100px; position: absolute; left: 8%; bottom: -60px; box-shadow: 0 8px 250px rgba(24, 29, 88, .05); border-radius: 24px; }
.testimonial-author { display: flex; align-items: center; justify-content: center; }
.testimonial.style-1 .testimonial-img { border-radius: 100%; position: relative; flex-shrink: 0; display: inline-block; width: 120px; height: 120px; margin-right: 20px }
.testimonial .testimonial-img img { border-radius: 100%; position: relative; z-index: 9; width: 100%; }
.testimonial p { margin-bottom: 1rem; }


.testimonial.style-1 .testimonial-quote { position: absolute; left: 0; top: -80px; }
.testimonial.style-1 .testimonial-quote.right { position: absolute; left: inherit; right: 80px; top: inherit; bottom: 60px; width: 100px; }

.testimonial.style-2 { background: var(--themeht-white-color); padding: 40px; border-radius: 24px ; box-shadow: 0 10px 35px 5px rgba(137, 173, 255, .15); margin: 30px}
.testimonial.style-2 .testimonial-img { width: 100px; }
.testimonial.style-2 .testimonial-quote i { position: relative; display: inline-block; z-index: 9; color: var(--themeht-primary-color); font-size: 40px; line-height: 1; opacity: 1; }
.testimonial-footer { display: flex; justify-content: space-between; align-items: center; }
.testimonial.style-2 p { font-size: 18px; line-height: 28px; }

.testimonial-rating i { color: #ffb300; margin-right: 2px; font-size: 14px; line-height: 1; }
.testimonial-side-img li {transform: scale(0.8); position: absolute; animation: leftRight 1.2s infinite; animation-duration: 5s; width: 100px; border-radius: 100%; cursor: pointer;}
.testimonial-side-img li img {transform: scale(0.8); border-radius: 100%}
.testimonial-side-img li.active img {transform: scale(1);}
.testimonial-side-img li:nth-child(1) { left: 10%; top: 15%; }
.testimonial-side-img li:nth-child(2) { left: 5%; bottom: 30%; }
.testimonial-side-img li:nth-child(3) { right: 15%; top: 5%; }
.testimonial-side-img li:nth-child(4) { right: 10%; bottom: 40%; }

.testimonial-marquee { overflow-y: hidden; max-height: 500px; padding-right: 50px; }
.testimonial-marquee-inner { will-change: transform; animation: marquee-verticle 10s linear infinite; }
.testimonial.style-3 { background: var(--themeht-white-color); padding: 50px; border-radius: 24px; margin: 50px 0; }
.testimonial.style-3 .testimonial-img { border-radius: 100%; position: relative; flex-shrink: 0; display: inline-block; width: 70px; height: 70px; margin-right: 15px }
.testimonial.style-3 p { margin: 30px 0 0; }


input.form-product { -moz-appearance: textfield; height: 40px !important; border: none; background: var(--themeht-white-color); text-align: center; width: 150px; border-top: 1px solid var(--themeht-border-light-color) !important; border-bottom: 1px solid var(--themeht-border-light-color) !important; color: var(--themeht-text-color); vertical-align: middle; }
.btn-product { background: none; color: var(--themeht-text-color); border: 1px solid var(--themeht-border-light-color); height: 40px; width: auto; padding: 0 10px; font-size: 13px; cursor: pointer; }
.cart-table td { padding: 20px; text-align: center; vertical-align: middle; color: var(--themeht-text-color); }
.themeht-btn i{margin-left: 7px}