/*
Theme Name: Optical Store Pro
Description: Optical Store Pro WordPress Theme is the perfect choice for building Optical Store Pro website. This theme is packed with features designed to help you promote your business and attract new customers. With its clean and modern design, the Optical Store Pro WordPress Theme will make a lasting impression on your visitors. The WordPress Optical Store Pro theme can be used for any website. It’s a sleek, minimalist, contemporary theme that incorporates the latest technology. The industrial theme features an elegant and chic design that will help your site stand out among the rest of your competitors.
Author: wpelemento
Theme URI: https://www.wpelemento.com/products/optician-wordpress-theme
Author URI: https://www.wpelemento.com/
Version: 0.0.1
Tested up to: 6.0.3
Requires PHP: 7.4
Text Domain: optical-store-pro
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Tags: education, portfolio, blog, wide-blocks, one-column, two-columns, right-sidebar, left-sidebar, grid-layout, custom-background, custom-colors, custom-header, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, editor-style, theme-options, threaded-comments
Elementor Wptheme WordPress Theme has been created by wpelemento(https://www.wpelemento.com), 2023.
Elementor Wptheme WordPress Theme is released under the terms of GNU GPL
*/

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');

html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  overflow-x: hidden;
  font-family: "Sora", sans-serif;
}
html {
  overflow-x: hidden;
}
.bkr_container {
  /* max-width: 1350px;
  width: 100%; */
  padding-left:20px;
  padding-right: 20px;
  margin: 0 auto;
}
h1,h2,h3,h4,h5,h6 {
	font-family: "Sora", sans-serif;
  margin-bottom: 0;
}
p {
  font-family: "Sora", sans-serif;
  margin-bottom: 0;
}
a {
  text-decoration: none;
}
ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
img {
  max-width: 100% !important;
}

.sticky-header {
  position: fixed;
  width: 100%;
  z-index: 99999 !important;
  top: 0;
  left: 0;
  right: 0;
  padding: 18px 15px;
  animation: slideDown 0.75s ease-out;
  background-color: #FFEAEA;
  box-shadow: 0px 2px 6px #CCBABAF2;
}
@keyframes slideDown {
  0% {
    transform: translateY(-100%);
  }
  100% {
      transform: translateY(0);
  }
}

/*============================= Moving Image Start =========================*/

@keyframes floating {
  from {
    transform: translate(0, 0px);
  }
  65% {
    transform: translate(0, 15px);
  }
  to {
    transform: translate(0, -0px);
  }
}
.top-banner-right-col-box1 {
  transform: translate(84px, 10px);
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
.top-banner-right-col-box2 {
  transform: translate(84px, 10px);
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
.top-banner-right-col-box3 {
  transform: translate(84px, 10px);
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
.top-banner-review-box {
  transform: translate(84px, 10px);
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}


.why-choose-left-col img {
  overflow: hidden;
}
.why-choose-left-col img {
  width: 100%;
  height: auto;
  animation: zoomEffect 6s ease-in-out infinite;
}

@keyframes zoomEffect {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.08);
    }
    100% {
        transform: scale(1);
    }
}

.trending-product .product-item-card {
  overflow: hidden;
}
.trending-product .product-item-card img {
  width: 100%;
  height: auto;
  transition: transform 0.4s ease;
}
.trending-product .product-item-card:hover img {
  transform: scale(1.08);
}

.woocommerce-shop .product-item-card {
  overflow: hidden;
}
.woocommerce-shop .product-item-card img {
  width: 100%;
  height: auto;
  transition: transform 0.4s ease;
}
.woocommerce-shop .product-item-card:hover img {
  transform: scale(1.08);
}

.trending-product .product-item-card .card-footer {
  background-color: unset;
}

#instagram-post .elementor-image-carousel-wrapper figure img:hover {
  filter: brightness(0.5);
}

#yith-woocompare-preview-bar .compare-list .image-wrap img {
  height: auto;
}

/*============================= Moving Image End =========================*/



/*=============== Lensshop Start ===============*/


/*=============== Top Banner Start ===============*/

.variation-select-group select {
  border-radius: 30px;
}
.track-order-content button {
  background-color: #FF5557 !important;
  color: #FFFFFF !important;
  border-radius: 60px !important;
  padding: 14px 25px !important;
  margin-top: 15px !important;
  &:hover {
    background-color: #3B2A62 !important;
  }
}
#top-banner {
  position: relative;
}
.top-banner-review-box {
  width: 49%;
  transform: translate(138px, 89px);
}
.top-banner-right-col {
  position: relative;
}
.top-banner-right-col-box1 {
  width: 164px;
  height: 164px;
  background-color: #FFFFFF;
  border-radius: 100px;
  position: absolute;
  top: 23%;
  transform: translate(60px, 10px);
}
.col20 {
  text-transform: uppercase;
  font:700 40px/40px "Sora";
  color: #FFFFFF;
}
.off {
  text-transform: uppercase;
  font:700 16px/16px "Sora";
  color: #FFFFFF;
}
.top-banner-right-col-box2 {
  width: auto;
  height: auto;
  border-radius: 20px;
  position: absolute;
  right: 0;
  bottom: 28%;
  transform: translate(-52px, 10px);
  backdrop-filter: blur(16px)
}
.top-banner-right-col-box2-offer-text {
  padding: 10px 30px;
  background-color: #FF5557;
  border-radius: 0 0 30px 30px;
}
.top-banner-right-col-box3 {
  position: absolute;
  right: 0;
  bottom: 7%;
  width: auto;
  height: auto;
  transform: translate(33px, 10px);
}


/*=============== Top Banner End ===============*/

/*=============== Trending Product Section Start ===============*/

.woocommerce-Price-amount {
  color: #FF5557;
  font: 800 14px/20px "Sora";
}
.yith-woocompare-popup-container {
  top: 8% !important;
}
.trending-product .variation-select-group span, .woocommerce-shop .variation-select-group span, .single-product .variation-select-group span {
  text-transform: capitalize;
}
.trending-product .product-cart-btn {
  background-color: #FF5557;
  color: #FFFFFF;
  border-radius: 60px;
  font: 400 14px/16px "Sora";
  padding: 14px 25px;
  border: unset;
}
.trending-product .yith-add-to-wishlist-button-block {
  margin: 0px auto;
}
.trending-product .product-title a {
  font: 600 15px/15px "Sora";
  color: #221943;
}
.trending-product .card-body {
  flex: unset;
}
.trending-product .compare-button a {
  font-size: 0;
}
.trending-product .add-to-cat-wishlist-wrapper {
  display: -webkit-inline-box !important;
}
.trending-product .compare-button a::before {
  content: '';
  background-image: url(assets/images/compare.svg);
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top:0;
  bottom: 0;
  font-size: 40px;
  width: 40px;
  height: 40px;
  color: #FF5557;
  transform: translate(-8px, -10px);
}
.trending-product .wishlist-btn .yith-wcwl-add-to-wishlist-button--added .yith-wcwl-add-to-wishlist-button__label {
  font-size: 0;
}
.trending-product .add-to-cat-wishlist-wrapper .wishlist-btn {
  margin: 0 10px;
}
.trending-product .yith-wcwl-add-to-wishlist-button svg {
  width: 22px !important;
}
.trending-product .yith-wcwl-add-to-wishlist-button svg path {
  stroke: #FF5557;
}
.trending-product .yith-wcwl-add-to-wishlist-button--added svg path {
  fill: #FF5557;
}
.trending-product .yith-wcwl-add-to-wishlist-button {
  display: block;
  background-color: #FFEEEE;
  border-radius: 60px;
  padding: 7px;
  width: 50px;
  height: 42px;
  text-align: center;
}
.trending-product .compare-button {
  display: block;
  background-color: #FFEEEE;
  border-radius: 60px;
  padding: 7px;
  width: 50px;
  height: 42px;
  text-align: center;
}
.trending-product .product-item-box-grid {
  margin-bottom: 15px;
}
.trending-product-slider .slick-dots {
  display: flex !important;
  justify-content: center;
  margin-top: 20px;
}
.trending-product-slider .slick-dots {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 12px;               
  margin-top: 20px;
  padding: 0;
  list-style: none;
}
.trending-product-slider .slick-dots li {
  width: 12px;
  height: 12px;
}
.trending-product-slider .slick-dots li button {
  width: 12px;
  height: 12px;
  padding: 0;
  border: none;
  background: #FF5557;       
  border-radius: 30px;
  opacity: 0.4;
  cursor: pointer;
  font-size: 0px;
}
.trending-product-slider .slick-dots li button:before {
  display: none;
}
.trending-product-slider .slick-dots li.slick-active button {
  opacity: 1;
}


/*=============== Trending Product Section End ===============*/

/*=============== Discount Offer Section Start ===============*/

#discount-offer {
  margin-top: 80px;
}
.discount-offer-countdown-container {
  width: max-content;
  margin: auto;
}
#discount-offer .discount-offer-right-col .product-item-card {
  margin: 0px 10px;
}

/*=============== Discount Offer Section End ===============*/

/*=============== Shop by Categories Start ===============*/

.finds-by-categories-content .ht-category-wrap {
  border: 1px solid #252343;
  border-radius: 10px;
  height: 188px;
  transition: 0.3s ease-in-out;
}
.finds-by-categories-content .ht-category-wrap:hover {
  background-color: #FF5557 !important;
}
.finds-by-categories-content .ht-category-wrap .ht-category-image-zoom {
  width: 80px;
  margin: 0 auto;
}
.finds-by-categories-content .ht-category-wrap .ht-category-content-5 h3 a {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.finds-by-categories-content .ht-category-wrap .ht-category-content-5 h3 a:hover {
  border-bottom: unset;
}

/*=============== Shop by Categories End ===============*/

/*=============== Featured Lens Start ==============*/

.product-image {
  background-color: #F8F8F8;
  height: 322px;
  border-radius: 6px;
}

/*=============== Featured Lens End ==============*/

/*=============== Why Choose Start ===============*/

#why-choose {
  margin-top: 100px;
}
.why-choose-bottom-row {
  width: 1220px;
  margin: auto;
}
.why-choose-bottom-box:hover h4 {
  color: #12102F !important;
}
.why-choose-bottom-box:hover p {
  color: #12102F !important;
}

/*=============== Why Choose End ===============*/


/*=============== Newsletter Start ===============*/

#newsletter-section {
  margin: 100px auto 0px auto;
}
.newsletter-contact-box {
  width: fit-content;
  height: auto;
  margin: 0 auto;
  z-index: 1;
}
#newsletter-section {
  position: relative;
  height: 500px;
  overflow: visible;
}
.newsletter-section-left-col img {
  position: relative;
  z-index: 2;
}
/* .newsletter-section-right-col::before {
  content: '';
  position: absolute;
  left: -170px;
  bottom: 0;
  height: 100%;
  width: 185px;
  background-color: #FF5557;
  border-radius: 800px 0 0 800px;
} */
.newsletter-section-right-col::after {
  content: '';
  position: absolute;
  left: -210px;
  bottom: 0;
  height: 100%;
  width: 245px;
  background-color: #FF5557;
  border-radius: 800px 0 0 800px;
}
 


/*=============== Newsletter End ===============*/



/*=============== Blog Section Start ===============*/

.blog-section-content .pp-posts-container .pp-posts .pp-post-wrap .pp-post-thumbnail img {
  height: 246px;
  object-fit: cover;
}
.blog-section-content .pp-posts-container .pp-posts .pp-post-content-wrap {
  position: relative;
}
.blog-section-content .pp-posts-container .pp-posts .pp-post-date {
  position: absolute;
  top: 0;
  left: 20px;
}
.blog-section-content .pp-posts-container .pp-posts .pp-post-title {
  padding-top: 15px;
}
.blog-section-content .pp-posts-container .pp-posts .pp-post-date .pp-meta-text {
  font: 600 16px/20px "Sora";
  color: #FF5557;
}
.blog-section-content .pp-posts-container .pp-posts .pp-post-meta a {
  color: #7373A5;
}
.blog-section-content .pp-posts-container .pp-post-title a {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  display: -webkit-box;
}
.blog-section-content .pp-carousel-item:hover .pp-post-meta svg path {
  fill: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-post-title a {
  color: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-post-excerpt p {
  color: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-post-author {
  color: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-post-comments {
  color: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-meta-text a {
  color: #FFF;
}
.blog-section-content .pp-carousel-item:hover .pp-post-date .pp-meta-text {
  color: #FFF;
}

/*=============== Blog Section End ===============*/




/*=============== Testimonial Section Start ===============*/


/* .ekit-main-swiper {
    overflow: visible !important;
}

.ekit-main-swiper .swiper-slide {
    transition: all 0.4s ease;
    opacity: 0.4;
    transform: scale(0.25); 
}

.ekit-main-swiper .swiper-slide-prev,
.ekit-main-swiper .swiper-slide-next {
    transform: scale(0.25);
    opacity: 0.5;
}

.ekit-main-swiper .swiper-slide-active {
    transform: scale(1);
    opacity: 1;
    z-index: 3;
}

.ekit-main-swiper .swiper-slide-active + .swiper-slide {
    transform: scale(1);
    opacity: 1;
    z-index: 2;
}

.ekit-main-swiper .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev):not(.swiper-slide-next):not(.swiper-slide-active + .swiper-slide) {
    opacity: 0;
} */

/* .testimonial-content .swiper-slide .swiper-slide-active {
  width: 10%;
}
.testimonial-content .swiper-slide-next .swiper-slide-inner .elementskit-single-testimonial-slider {
  width: 40%;
}
.testimonial-content .swiper-slide-next+div .swiper-slide-inner .elementskit-single-testimonial-slider {
  width: 40%;
} */

.testimonial-content .swiper-wrapper {
  align-items: center;
}
.testimonial-content .swiper-slide-active {
  width: 250px !important;
  opacity: 0.78;
}
.testimonial-content .swiper-slide-active .elementskit-single-testimonial-slider {
  border-radius: 0 10px 10px 0 !important;
}
.testimonial-content .swiper-slide-next+div+div {
  opacity: 0.78;
}
.testimonial-content .swiper-slide-active .elementskit-commentor-content p {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  display: -webkit-box;
}
.testimonial-content .swiper-slide-active .elementskit-commentor-header {
  display: none !important;
}
.testimonial-content .swiper-slide-active .elementskit-single-testimonial-slider {
  padding-top: 30px !important;
}
.testimonial-content .swiper-slide-active .elementskit-single-testimonial-slider .elementskit-author-name {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  display: -webkit-box;
}
.testimonial-content .swiper-slide-next {
  max-width: 550px !important;
  width: 100% !important;
}
.testimonial-content .swiper-slide-next .elementskit-commentor-content p {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  display: -webkit-box;
}
.testimonial-content .swiper-slide-next+div {
  max-width: 550px !important;
  width: 100% !important;
}
.testimonial-content .swiper-slide-next+div .elementskit-commentor-content p {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
  display: -webkit-box;
}
.testimonial-content .swiper-slide-next+div+div .elementskit-commentor-content p {
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  display: -webkit-box;
}
.testimonial-content .swiper-slide-next+div+div .elementskit-commentor-header {
  display: none;
}
.testimonial-content .swiper-slide-next+div+div .elementskit-single-testimonial-slider {
  padding-top: 30px !important;
}
.testimonial-content .elementskit-stars {
  transform: translate(89px, 210px);
}
.testimonial-content .elementskit-author-name {
  transform: translateY(-6px);
}
.testimonial-content .ekit-wid-con .elementskit-single-testimonial-slider:hover {
  background-color:#FF5557;
}
.testimonial-content .ekit-wid-con .elementskit-single-testimonial-slider:hover .elementskit-commentor-content p {
  color: #FFFFFF !important;
}
.testimonial-content .ekit-wid-con .elementskit-single-testimonial-slider:hover .elementskit-author-name {
  color: #FFFFFF !important;
}
.testimonial-content .ekit-wid-con .elementskit-single-testimonial-slider:hover li a svg path {
  fill: #FFFFFF !important;
}
.testimonial-content .ekit-wid-con .elementskit-single-testimonial-slider:hover svg path {
  fill: #FFFFFF !important;
}

/*=============== Testimonial Section End ===============*/

/*=============== Lensshop End ===============*/




@media (min-width:1024px) {
  .woocommerce-shop .shop-page-product-box img, .tax-product_cat .shop-page-product-box img {
    transition: transform 0.5s ease-in-out;
  }
  .woocommerce-shop .shop-page-product-box:hover img, .tax-product_cat .shop-page-product-box:hover img {
    transform: scale(1.1);
  }
  .woocommerce-shop .shop-page-product-box:hover .product-content-box {
    background-color: #0F0F2E;
  }
  .woocommerce-shop .shop-page-product-box:hover .add-to-cart-btn a::before {
    background-color: #FFFFFF;
    color: #0F0F2E;
  }
  .tax-product_cat .shop-page-product-box img, .tax-product_cat .shop-page-product-box img {
    transition: transform 0.5s ease-in-out;
  }
  .tax-product_cat .shop-page-product-box:hover img, .tax-product_cat .shop-page-product-box:hover img {
    transform: scale(1.1);
  }
  .tax-product_cat .shop-page-product-box:hover .product-content-box {
    background-color: #0F0F2E;
  }
  .tax-product_cat .shop-page-product-box:hover .add-to-cart-btn a::before {
    background-color: #FFFFFF;
    color: #0F0F2E;
  }
}


.header-menu-col3 .elementor-icon:hover {
  background-color: #0F0F2E;
}
.header-menu-col3 .elementor-icon:hover svg path {
  fill: #FFF;
}
.header-menu-col3 .elementor-icon-box-wrapper:hover .elementor-icon-box-icon .elementor-icon {
  background-color: #0F0F2E;
}
.header-menu-col3 .elementor-icon-box-wrapper:hover .elementor-icon-box-icon .elementor-icon svg path {
  fill: #FFF;
}
.header-primary-menu-col3:hover .hfe-menu-cart__toggle .elementor-button {
  background-color: #000000 !important;
}


/*=============== Pharmacy End ===============*/



/*========== Star Rating CSS Start ============*/

.star-rating {
  color: #FEC004;
  margin-top: 0;
  overflow: hidden;
  position: relative;
  height: 1em;
  line-height: 1;
  font-size: 1em;
  width: 5.4em;
  font-family: star;
  float: unset !important;
}
.star-rating:before {
  content: "\73\73\73\73\73";
  color: #dab7b7bf !important;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}
.star-rating span {
  overflow: hidden;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  padding-top: 1.5em;
}
.star-rating span:before {
  content: "\53\53\53\53\53";
  top: 0;
  position: absolute;
  left: 0;
}

/*========== Star Rating CSS End ============*/


/*========== Return to Top Start ============*/

#return-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #0F0F2E;
  width: 50px;
  height: 50px;
  display: block;
  text-decoration: none;
  -webkit-border-radius: 35px;
  -moz-border-radius: 35px;
  border-radius: 35px;
  display: none;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 999;
  cursor: pointer;
}
#return-to-top div {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
#return-to-top:hover {
  background-color: #000000;
}

/*========== Return to Top End ============*/


/*============= Preloader Start =============*/

.spinner-loading-box {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  cursor: pointer;
  z-index: 999999;
  background: #FFEAEA;
  justify-content: center;
  align-items: center;
  display: flex;
}
.spinner-loading-box img {
  max-width: 200px !important;
}
.spinner-loading-box img, .ets-theme-header-section :is(.ets-topabr-address, .ets-topabr-email) li {
  width: 100%;
}
.demo {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

/*============= Preloader End =============*/


.loader {
  width: 20px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #000;
  box-shadow: 0 0 0 0 #0004;
  animation: l2 1.5s infinite linear;
  position: relative;
}
.loader:before,
.loader:after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: 0 0 0 0 #0004;
  animation: inherit;
  animation-delay: -0.5s;
}
.loader:after {
  animation-delay: -1s;
}
@keyframes l2 {
    100% {box-shadow: 0 0 0 40px #0000}
}