/*
Theme Name: Gota
Theme URI: https://demo.lion-themes.net/gota/
Author: Lion-Themes
Author URI: https://lion-themes.net/
Description: Gota is a new WordPress theme for Online Shopping. With this theme, we have presets and different layouts. With drag and drop home page layout manager, we can build many variations of home page layout. We also have ajax cart, wishlist, compare, zoom and fancybox to bring into a modern look of website. Some of amazing features like Revolution Slider, Mega Menu, Elementor, Product Tabs & Carousel, Contact Form with Google map will makes your website more attractive.
Version: 1.0.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, right-sidebar, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready
Text Domain: gota

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

*/

/*------------------------------------------------------------------
[Table of contents]

This theme compiles .less files into .css files. Please open "less" folder to see all LESS file.

1. Theme variables
    1.1 Fonts
    1.2 Colors
    1.3 Defined colors
2. Reset style
    - Body / body
    - Anchor tag / a
    - Image / img
    - Heading / h1, h2, h3, h4, h5, h6
    - Button / .button, .buttonMixin()
    - List / ul, ol
    - Table / table
3. Global CSS
    3.1 Page layout / .box-layout
    3.2 button / .buttonMixin()
    3.3 Tooltip / .tooltip
    3.4 page-content / .page-content
    3.5 page title / .widget-title
    3.6 Header Default / .header-container
	3.7 Footer Default / .footer
	3.7 Content / .main-wrapper
		3.7.1 Sidebar / #secondary
		3.7.2 Back To Top / #back-top
		3.7.3 Page 404 / .page-404
4. Woocommerce CSS
	4.1 WooCommerce Breadcrumbs / .woocommerce-breadcrumb
	4.2 WooCommerce onsale label / .onsale
	4.3 WooCommerce ratings / .ratings
	4.4 WooCommerce toolbar / .toolbar
	4.5 WooCommerce List Gird / .shop-products
	4.6 WooCommerce Product List Widget / .product_list_widget
	4.7 WooCommerce Product View / .product-view
	4.8 WooCommerce Check Out / .woocommerce-checkout
	4.9 WooCommerce View Cart / .shop_table
	4.10 WooCommerce Wishlist Table / .wishlist_table
	4.11 WooCommerce Quick View / .quickview-wrapper
	4.12 WooCommerce Top Cart / .topcart      
5. Blog CSS
	5.1 Blog Posts / .blog-posts
	5.1 Blog Page Posts / .post  
6. Megamenu CSS
	6.1	Default WP menu / .nav-menu
	6.2	Default WP Menu With Selected Location / .primary-menu-container
	6.3	Megamenu Main Menu / #mega_main_menu
7. Mobile Menu CSS
8. Projects CSS	
9. Home Blocks Layout
10. Responsive CSS
-------------------------------------------------------------------*/

.alignnone {
  margin: 5px 20px 15px 0;
}
.aligncenter,
div.aligncenter {
  display: block;
  margin: 15px auto 15px auto;
  text-align: center;
}
.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}
.wp-block-media-text {
  margin-bottom: 20px;
}
.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}
a img.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}
a img.alignnone {
  margin: 5px 20px 20px 0;
}
a img.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}
a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.bypostauthor {
  display: inline-block;
}
.wp-caption {
  color: #666;
  font-size: 13px;
  font-size: 0.92rem;
  font-style: italic;
  margin-bottom: 1.5em;
  max-width: 100%;
}
.wp-caption.alignnone {
  margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
  margin: 5px 20px 20px 0;
}
.wp-caption.alignright {
  margin: 5px 0 20px 20px;
}
.wp-caption img {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 98.5%;
  padding: 0;
  width: auto;
}
.wp-caption p.wp-caption-text {
  margin: 0.8075em 0;
}
.wp-caption .wp-caption-text,
.gallery-caption,
.entry-caption {
  font-style: italic;
  color: #757575;
  font-size: 0.92rem;
  line-height: 1.6153846154;
  padding-top: 0.5384615385em;
}
/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000; /* Above WP toolbar. */
}







.product_features_section{
    position: relative;
    min-height: 500px;
}
.product_feature_image_box{
    text-align: center;
}
.product_feature_image_box img{
    width: auto;
    margin:0 auto;
    height: 500px;
}
.product_feature_tabs {
    width: 140px;
    margin: 0 0 0 auto;
    background-color: #d8d8d8;
}
.product_feature_tabs ul {
    padding: 0;
    list-style: none;
    width: 100%;
}
.product_feature_tabs ul li{
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
    cursor: pointer;
}
.product_feature_tabs ul li.active{
    background-color: #bdbdbd;
}
.product_feature_tabs ul li a{
    display: block;
    text-align: center;
    font-size: 10px;
    text-transform: uppercase;
}
.product_feature_tabs ul li a img {
  max-width: 50px;
  width: 100%;
}
.product_feature_tabs ul li a span {
  display: block;
  margin-top: 8px;
}
.product_feature_tabs ul li.active a{
    color: #000;
}
.product_features_section .carousel-control-prev, .carousel-control-next{
    top: 91% !important;
    bottom: unset !important;
    opacity: 1 !important;
    background-color: #000;
    width: 40px !important;
    height: 40px;
}
.product_features_section  .carousel-control-next {
  right: unset !important;
  left: 43px !important;
}
.feature-module-loading {
  background-color: transparent;
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0; left: 0;
  display: flex;
  align-items: center;
  align-content: center; 
  justify-content: center;  
  z-index: 100000;
}

.loader__element {
  border-radius: 100%;
  border: 5px solid #f03036;
  margin: calc(5px*2);
}

.loader__element:nth-child(1) {
  animation: preloader .6s ease-in-out alternate infinite;
}
.loader__element:nth-child(2) {
  animation: preloader .6s ease-in-out alternate .2s infinite;
}

.loader__element:nth-child(3) {
  animation: preloader .6s ease-in-out alternate .4s infinite;
}

@keyframes preloader {
  100% { transform: scale(2); }
}

.elementor-posts--skin-classic .elementor-post {
    overflow: hidden;
    position: relative;
    background: #fff;
    box-shadow: 1px 1px 1px 0px rgba(255,255,255,0.1);
    -webkit-box-shadow: 1px 1px 1px 0px rgba(255,255,255,0.1);
    -ms-box-shadow: 1px 1px 1px 0px rgba(255,255,255,0.1);
    -moz-box-shadow: 1px 1px 1px 0px rgba(255,255,255,0.1);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    border: 1px solid #e1e1e1;
    padding-top: 20px !important;
}
.elementor-posts--skin-classic .elementor-post:hover{
    z-index: 20;
    -moz-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.1);
    -webkit-transform: translateY(-4px);
    -moz-transform: translateY(-4px);
    transform: translateY(-4px);
}

.elementor-posts .elementor-post__text{
    display: block;
    position: relative;
    padding: 0px 20px 20px;
    margin-top: 20px;
}
.elementor-posts .elementor-post__title {
    border-top: 1px solid #e1e1e1;
    padding-top: 10px;
    margin-top: 10px;
}
#menu-protected-menu a{
    font-family: "Roboto Condensed", Sans-serif;
}
.button-switch a{
    font-family: "Roboto Condensed", Sans-serif;
}
.widget .widget-title {
    text-transform: uppercase;
    font-size: 1.48rem;
    font-weight: 600;
}
#menu-protected-menu{
    padding-left: 0;
}
.protected-content h1{
    text-transform: uppercase;
    font-weight: 600;
}
.protected-description{
    font-family: "Roboto Condensed", Sans-serif;
}
.protected-content form.cart button {
    box-shadow: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-family: Barlow Condensed, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    font-size: 1rem;
    text-transform: uppercase;
    border: 2px solid #ebebeb;
    background: #fff;
    font-weight: 600;
    color: #222;
    border-radius: 0;
    padding: 10px 30px;
    text-align: center;
    text-shadow: none;
    white-space: nowrap;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    line-height: inherit;
    margin-bottom: 5px;
    float: none;
    min-width: 200px;
}
.protected-content form.cart button:hover {
    background: #292929;
    border-color: #292929;
    color: #fff;
}
.product-left-side ul{
    list-style: none;
}
.product-left-side ul li a img{
    opacity: 0.5;
}
.product-left-side ul li.active a img{
    opacity: 1;
}
.product-main-image img {
    width: auto;
    height: 400px;
    max-width: unset;
}
.product-main .product-main-image{
    position: relative;
    text-align: center;
}
.product-main .product-main-image .woocommerce-product-gallery__trigger{
    position: absolute;
    top: .5em;
    right: .5em;
    font-size: 1.5em;
    z-index: 9;
    width: 36px;
    height: 36px;
    background: #fff;
    border-radius: 100%;
    box-sizing: content-box;
}
.elementor-posts-container .elementor-post__thumbnail {
  padding-bottom: 0 !important;
  text-align: center;
}
.elementor-posts-container.elementor-has-item-ratio .elementor-post__thumbnail img {
  position: unset !important;
  transform: unset !important;
  width: auto;
  height: 300px !important;
  margin: 0 auto;
}
.elementor-posts--skin-classic .elementor-post .elementor-post__thumbnail img.secondary_image{
    position: absolute !important;
    transition: all 0.5s ease;
    opacity: 0;
    top: 0;
    left: 0;
    margin: 0 auto;
    right: 0;
}
.elementor-posts--skin-classic .elementor-post:hover .secondary_image{
    opacity: 1 !important;
}
.body_container .shop-products.products .product .product-wrapper .product-image a img{
    max-width: unset !important;
    width: unset !important;
    height: 300px !important;
    margin: 0 auto !important;
}
.body_container .shop-products.products .product .product-wrapper .product-image a img.secondary_image {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    margin: 0 auto !important;
    right: 0;
}













@media (max-width: 767px){
    .product_feature_image_box img {
      width: 100%;
      height: auto;
    }
    .elementor-posts-container .elementor-post__thumbnail {
      padding-bottom: 0 !important;
    }
    .product_features_section .row .col-md-6{
        -ms-flex-order: 3;
        order: 3;
    }
    .product_feature_tabs {
      width: 100%;
    }
    .product_feature_tabs ul {
      width: 100%;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
    }
    .product_feature_tabs ul li{
        flex: 0 0 25%;
    }
    .product_feature_tabs ul li a{
        font-size: 9px;
    }
    .product_feature_tabs ul li a img {
        max-width: 35px;
    }
    .shop-products.col3-view .item-col{
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    .product-left-side ul{
        padding: 0;
    }
    .product-main-image img {
      width: 100%;
      height: unset;
      max-width: unset;
    }
    .shop-products.col4-view .item-col{
        -ms-flex: 0 0 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    .product_features_section .carousel-control-prev, .carousel-control-next {
          top: 95% !important;
    }
}






