/*----------Variables----------*/
$font_general: ;
$font_heading: ;
$font_misc: ;

$font_size_slide_large: 60px;
$font_size_heading: 20px;
$font_size_banner: 30px;
$font_size_general: 14px;
$font_size_link: 13px;
$font_size_text: 12px;
$font_size_menu: 13px;

$font_weight_bold: 700;
$font_weight_normal: 400;
$font_weight_thin: 300;

$row_padding: 15px;

$line_height_general: 1.55em;

$margin_distance: 75px;
$margin_distance_mobile: 30px;
$margin_distance_small: 30px;

$transition-base: ease, all, 0.5s;
$transition-in-out: ease-in-out, all, 0.6s;


$color_text_general: ;
$color_hover_general: ;
$color_text_header: ;
$color_text_menu: ;

$color_text_title: ;
$color_text_heading: ;
$color_text_banner: ;

$shop_bg_color: ;
$bkg_top_header: ;
$bkg_main_header: ;
$bkg_nav_header: ;
$bkg_footer: ;
$bkg_logo_brand: ;
$bkg_breadcrumb: ;
$bkg_title: ;
$bg_block: #f1fcfd;



$border_general: ;
$border_title: ;
$border_submenu: ;
$border_header: ;


$color_text_button: ;
$color_border_button: ;
$bkg_button: ;
$color_text_button_hover: ;
$bkg_button_hover: ;
$color_border_button_hover: ;

$color_text_button1: ;
$color_border_button1: ;
$bkg_button1: ;
$color_text_button1_hover: ;
$bkg_button1_hover: ;
$color_border_button1_hover: ;

$color_text_button2: ;
$color_border_button2: ;
$bkg_button2: ;
$color_text_button2_hover: ;
$bkg_button2_hover: ;
$color_border_button2_hover: ;

/*----------End Variables----------*/

/*----------Mixin----------*/
@mixin prefix($property, $value, $prefixes) {
  @each $prefix in $prefixes {
    @if $prefix == webkit {
      -webkit-#{$property}: $value;
    } @else if $prefix == moz {
      -moz-#{$property}: $value;
    } @else if $prefix == ms {
      -ms-#{$property}: $value;
    } @else if $prefix == o {
      -o-#{$property}: $value;
    } @else if $prefix == spec {
      #{$property}: $value;
    } @else  {
      @warn 'Unrecognized prefix: #{$prefix}';
    }
  }
}
@mixin smooth_font() {
  font-smooth: always;
  font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
}
@mixin user-select($value: none) {
  @include prefix('user-select', #{$value}, moz ms webkit spec);
}

@mixin transform($transform) {
  @include prefix(transform, $transform, ms webkit spec);
}

@mixin transition($transition) {
  @include prefix(transition, $transition, ms webkit spec);
}
@mixin transition-delay($transition) {
  @include prefix(transition-delay, $transition, ms webkit spec);
}
@mixin animation($animation) {
  @include prefix(transition, $animation, moz webkit o);
}

@mixin backface-visibility($backface-visibility) {
  @include prefix(backface-visibility, $backface-visibility, webkit spec);
}

@mixin smooth_font() {
  font-smooth: always;
  @include prefix(font-smoothing, antialiased, ms webkit spec);  
}

@mixin appearance($appearance) {  
  @include prefix(appearance, $appearance, moz webkit spec);  
}

@mixin perspective($perspective){
  @include prefix(perspective, $perspective, webkit spec);  
}
@mixin transform-origin($transform-origin){
  @include prefix(transform-origin, $transform-origin, ms webkit spec);    
}
@mixin transform-style($transform-style){
  @include prefix(transform-style, $transform-style, ms webkit spec);    
}
@mixin border-radius($border-radius) {
  @include prefix(border-radius, $border-radius, ms webkit spec); 
}
@mixin backface_visibility($var) {
  @include prefix(backface_visibility, $var, moz webkit spec); 
}
@mixin display-flexbox() {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  flex-flow: row wrap;
  width: 100%; // necessary for ie10
}
//flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;
@mixin flex-wrap($value: nowrap) {
  @include prefix(flex-wrap, $value, webkit moz ms spec);
}

//flex-direction: row|row-reverse|column|column-reverse|initial|inherit;
@mixin flex-direction($value) {
  @include prefix(flex-direction, $value, webkit moz ms webkit);
}

//justify-content: center|left|right
@mixin justify-content($var) {
  @include prefix(justify-content, $value, moz ms spec);
}

//align-items: stretch|center|flex-start|flex-end|baseline|initial|inherit;
@mixin align-items($value: stretch) {
  $alt-value: $value;

  @if $value == 'flex-start' {
    $alt-value: start;
  } @else if $value == 'flex-end' {
    $alt-value: end;
  }

  // sass-lint:disable no-misspelled-properties
  -ms-flex-align: $alt-value;
  @include prefix(align-items, $value, webkit moz ms o spec);
}

//flex: flex-grow flex-shrink flex-basis|auto|initial|inherit;
@mixin flex($value) {
  @include prefix(flex, $value, webkit moz ms spec);
}

//flex-basis: number|auto|initial|inherit;
@mixin flex-basis($width: auto) {
  // sass-lint:disable no-misspelled-properties
  -ms-flex-preferred-size: $width;
  @include prefix(flex-basis, $width, webkit moz spec);
}

//align-self: auto|stretch|center|flex-start|flex-end|baseline|initial|inherit;
@mixin align-self($align: auto) {
  // sass-lint:disable no-misspelled-properties
  -ms-flex-item-align: $align;
  @include prefix(align-self, $align, webkit spec);
}


//justify-content: flex-start|flex-end|center|space-between|space-around|initial|inherit;
@mixin justify-content($justify: flex-start) {
  @include prefix(justify-content, $justify, webkit ms spec);
}

@mixin inline-block(){
  display: inline-block;
  *display: inline;
  zoom: 1;
}

@mixin inline-block-important(){
  display: inline-block !important;
  *display: inline !important;
  zoom: 1 !important;
}

@mixin placeholder($var){
  &::-webkit-input-placeholder {
    color: $var;
  }
  &:-moz-placeholder {
    color: $var;
  }
  &::-moz-placeholder {
    color: $var;
  }
  &:-ms-input-placeholder {
    color: $var;
  }
}
@mixin visually-hidden() {
  // sass-lint:disable no-important
  position: absolute !important;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}

@mixin visually-shown() {
  // sass-lint:disable no-important
  position: inherit !important;
  overflow: auto;
  clip: auto;
  width: auto;
  height: auto;
  margin: 0;
}

@mixin opacity($var1, $var2) {
  opacity: $var1;
  filter: alpha(opacity=$var2);
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=$var2)";
}

@mixin filtergray() {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}
@mixin grayscale($var) {
  -webkit-filter: grayscale($var); /* Chrome, Safari, Opera */
  filter: grayscale($var);
}

@mixin box-shadow($box-shadow){  
  @include prefix(box-shadow, $box-shadow, moz webkit spec); 
}

@mixin button_style($height_button,$color_button,$border_button,$bkg_button){
  font-family: $font_general; 
  @include box-shadow(0 0 0 transparent inset);
  @include inline-block();
  height:$height_button; 
  line-height:$height_button; 
  border:none; 
  margin:0; 
  padding:0 20px; 
  color: $color_button;
  border: 1px solid $border_button;
  background: $bkg_button;
}
@mixin button_style_hover($color_button_hover,$border_button_hover,$bkg_button_hover) {
  color: $color_button_hover; 
  border-color: $border_button_hover; 
  background-color: $bkg_button_hover; 
  -webkit-backface-visibility:hidden; 
}

@mixin effect_banner() {
  position: relative;
  @include transition($transition-base);
  &:before {
    pointer-events: none;
    position: absolute;
    z-index: -1;
    content: '';
    top: 100%;
    left: 5%;
    height: 10px;
    width: 90%;
    @include opacity(0,0);
    background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
    @include transition($transition-base);
  }
  &:hover {
    @include transform(translateY(-5px));
    @include opacity(0.5,50);
    &:before {
      @include opacity(1,100);
      @include transform(translateY(5px));
    }
  }
}
/*----------End Mixin----------*/


/*----------Header----------*/
$height_header: 40px;
$height_button: 36px;
$font-size_header: 12px;
$font-size_header_mobile: 10px;
$height_input_search: 40px;
$bkg_search: #fff;
$height_menu: 40px;
$height_header_mobile: 80px;
$border_search: #e8e8e8;
$height_top_header: 100px;
$height_top_header_mobile: 40px;
$bg_shopy_collections: #0089c0;
$width_all_collection: 270px;
/*Top header*/
.top-header {
  background: $bkg_top_header;
  height: $height_header;
  border-bottom: 1px solid $border_header;
  @media(max-width: 991px) {
    height: auto;
  }
  @media(max-width: 767px) {
    display: none;
  }
  .top-header-wrapper{
    .top-header-inner-group {
      margin-left: -$row_padding;
      margin-right: -$row_padding;
      .top-header-inner{
        color: $color_text_header;
        line-height: $height_header;
        @include inline-block();
        width: 100%;
        >div{
          @include inline-block();
          width: 50%;
          @media(max-width: 991px) {
            width: 100%;
          }
          a{
            color: $color_text_header;
            font-weight: $font_weight_normal;
            font-size: $font-size_header;
            text-transform: uppercase;
            @media(max-width: 767px) {
              font-size: $font-size_header_mobile;
            }
            &:hover {
              color: $color_hover_general;
            }
          }
          &.left-area {
            text-align: left;
            @media(max-width: 991px) {
              text-align: center;
            }
            @media(max-width: 767px) {
              border-bottom: 1px solid $border_header;
            }
            >div {
              @include inline-block();
              font-size: $font-size_header;
              font-weight: $font_weight_normal;
              padding: 0 20px;
              border-left: 1px solid $border_header;
              vertical-align: top;
              @media(max-width: 1199px) {
                padding: 0 10px;
              }
              @media(max-width: 767px) {
                padding: 0 5px;
                font-size: $font-size_header_mobile;
              }
              i.fa{
                color: $color_text_header;
                padding-right: 10px;
                font-size: 17px;
                @media(max-width: 767px) {
                  padding-right: 5px;
                  font-size: 12px;
                }
              }
            }
            .contact-info{
              padding-right: 50px;
              @media(max-width: 1199px) {
                padding-right: 10px;
              }
            }
            @media(max-width: 767px) {
              text-align: center;
              width: 100%;
            }
          }
          &.right-area{
            text-align: right;
            float: right;
            @media(max-width: 991px) {
              text-align: center;
              float: none;
            }
            ul.customer_accounts{
              @include display-flexbox();
              @include flex-wrap(nowrap);
              @include justify-content(right);
              float: right;
              position: relative;
              width: auto;
              @media(max-width: 991px) {
                float: none;
                @include display-flexbox();
                @include flex-wrap(nowrap);
                @include justify-content(center);
              }
              >li{
                padding: 0 10px;
                height: $height_header;
                border-left: 1px solid $border_header;
                &.login-account {
                  position: relative;
                }
                i.fa{
                  padding-right: 10px;
                  font-size: $font-size_header;
                }
                &:last-child {
                  border-right: 1px solid $border_header;
                  position: relative;
                  i.fa{
                    padding-right: 0;
                  }
                }
                &.login-account {
                  #loginBox {
                    min-width: 250px;
                    padding: 0;
                    #bodyBox{
                      @include inline-block();
                      width: 100%;
                      >ul {
                        padding: 20px;
                        >li {
                          padding: 0;
                          width: 100%;
                          margin-bottom: 10px;
                          line-height: 1.55em;
                          &:last-child {
                            margin-bottom: 0;
                          }
                          a.btn, button {
                            color: $color_text_button;
                            background: $bkg_button;
                            border: 1px solid $color_border_button;
                            height: $height_button;
                            line-height: $height_button;
                            text-transform: uppercase;
                            &:hover {
                              color: $color_text_button_hover;
                              background: $bkg_button_hover;
                              border: 1px solid $color_border_button_hover;
                            }
                          }
                          label {
                            font-weight: $font_weight_thin;
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
            .currency_group{
              @include inline-block();
              height: $height_header;
              padding-right: $row_padding;
              .currency{
                &.btn-group {
                  height: $height_header;
                  vertical-align: top;
                  position: static;
                }
              }
            }
          }
        }
      }
    }
  }
}

/*Main header*/
$height_top_header_ipad: 60px;
.main-header{
  background: #fff;
  border-bottom: 0px solid $border_header;
  @media(max-width: 767px) {
    @include inline-block();
  }
  .main-header-wrapper {
/*     @include transition($transition-base); */
  }
  .main-header-inner{
    position: relative;
    .top_header_wrapper{
      margin-left: -$row_padding;
      margin-right: -$row_padding;
      height: $height_top_header;
      @media(max-width: 991px) {
        height: auto;
      }
      @media(max-width: 767px) {
        margin-left: 0;
        margin-right: 0;
      }
      .top_header{
        @include inline-block();
        width: 100%;
        height: $height_top_header;
        line-height: $height_top_header;
        @media(max-width: 991px) {
          height: auto;
          line-height: $height_top_header_ipad;
        }
        @media(max-width: 767px) {
          height: $height_top_header_mobile;
          line-height: $height_top_header_mobile;
          padding-left: 0;
          padding-right: 0;
          @include display-flexbox();
          @include justify-content(center);
        }
        .right-area{
          text-align: right;
          position: static;
          height: $height_top_header;
          line-height: $height_top_header;
          @media(max-width: 991px) {
            width: 100%;
            text-align: center;
            height: $height_top_header_ipad;
            line-height: $height_top_header_ipad;
          }
          @media(max-width: 767px) {
            text-align: center;
            line-height: $height_top_header_mobile;
            width: auto;
            padding-left: 0;
          }
        }
        .left-area{
          @media(max-width: 991px) {
            width: 100%;
            text-align: center;
          }
          @media(max-width: 767px) {
            width: auto;
            padding-right: 0;
            padding-left: 0;
            a{
              img{
                width: 80%;
              }
            }
          }
          @media(max-width: 420px) {
            padding-left: 0;
            width: 55%;
          }
        }
        .navi-group{
          @include inline-block();
          vertical-align: top;
        }
        .search_form {
          @include inline-block();
          padding: 0;
          position: relative;
          height: $height_menu;
          line-height: $height_menu;
          margin-right: 10px;
          vertical-align: top;
          @media(max-width: 991px) {
            height: $height_top_header_ipad;
            line-height: $height_top_header_ipad;
          }
          @media(max-width: 767px) {
            height: $height_top_header_mobile;
            line-height: $height_top_header_mobile;
            margin-right: 0;
          }
          i.fa{
            font-size: 18px;
            padding: 10px;
            cursor: pointer;
            vertical-align: middle;
            color: $color_text_menu;
          }

        }
        #cart-target {
          @include inline-block();
          position: relative;
          > a {
            .num-items-in-cart {
              position: relative;
              height: $height_menu;
              line-height: $height_menu;
              text-align: center;
              @media(max-width: 991px) {
                height: $height_top_header_ipad;
                line-height: $height_top_header_ipad;
              }
              @media(max-width: 767px) {
                height: $height_top_header_mobile;
                line-height: $height_top_header_mobile;
              }
              i.fa {
                color: $color_text_header;
              }
              .block-cart {
                float: left;
                background: url(//cdn.shopify.com/s/files/1/2059/3133/t/9/assets/icon_cart.png?9692) no-repeat 50% 50%;
                height: $height_menu;
                width: 36px;
                @media(max-width: 991px) {
                  height: $height_top_header_ipad;
                  line-height: $height_top_header_ipad;
                }
                @media(max-width: 767px) {
                  line-height: $height_top_header_mobile;
                  height: $height_top_header_mobile;
                }
                span.icon {
                  @include inline-block();
                  height: $height_menu;
                  line-height: $height_menu;
                  font-size: 18px;
                  color: #000;
                  @media(max-width: 991px) {
                    height: $height_top_header_ipad;
                    line-height: $height_top_header_ipad;
                  }
                  @media(max-width: 767px) {
                    height: $height_top_header_mobile;
                    line-height: $height_top_header_mobile;
                  }
                  span.number {
                    color: #000;
                  }
                }
              }
              >div{
                @include inline-block();
                &.number {
                  position: absolute;
                  top: 50%;
                  left: 0;
                  margin-top: -20px;
                  margin-left: 20px;
                  font-size: 12px;
                  color: #fff;
                  line-height: 12px;
                  width: 20px;
                  height: 20px;
                  background: #e74c3c;
                  text-align: center;
                  border-radius: 50%;
                  padding-top: 4px;
                }
                &.cart-total{
                  font-size: 18px;
                  color: #000;
                  font-weight: $font_weight_bold;
                }
              }
            }
          }
          #cart-info {
            left: auto;
            right: 0;
            width: 320px;
            height: auto;
            margin: 0;
            padding: 20px;
            line-height: 15px;
            border-radius: 0;
            @media(max-width: 320px) {
              width: 291px;
            }
            #cart-content {
              line-height: 15px;
              .items {
                position: relative;
                display: inline-block;
                width: 100%;
                line-height: 10px;
                vertical-align: top;
                .row {
                  position: relative;
                  margin: 20px 0;
                  padding-bottom: 20px;
                  border-bottom: 1px solid $border_submenu;
                  a.cart-close {
                    @include inline-block();
                    text-align: left;
                    float: none;
                    position: absolute;
                    top: 0px;
                    left: 0px;
                    margin: 0;
                    line-height: 10px;
                    width: 18px;
                    height: 18px;
                    background-color: #272727;
                    border-radius: 50%;
                    i.fa {
                      color: #fff;
                      text-align: center;
                      vertical-align: middle;
                      line-height: 18px;
                      padding: 0 5px;
                      font-size: $font_size_text;
                    }
                  }
                  .cart-left {
                    @include inline-block();
                    float: left;
                    width: 30%;
                    a {
                      display: block;
                      line-height: 10px;
                    }
                  }
                  .cart-right {
                    @include inline-block();
                    width: 70%;
                    padding-left: 20px;
                    vertical-align: top;
                    .cart-title {
                      line-height: 20px;
                      margin-bottom: 5px;
                      a {
                        color: $color_text_general;
                        font-family: $font_general;
                        &:hover {
                          color: $color_hover_general;
                        }
                      }
                    }
                    .cart-price {
                      line-height: 20px;
                      span {
                        font-size: 16px;
                        color: $color_text_general;
                        font-weight: $font_weight_bold;
                      }
                    }
                  }
                  &:first-child {
                    margin-top: 0;
                  }
                }
              }
              .subtotal {
                margin-bottom: 20px;
                line-height: 15px;
                span {
                  color: #666666;
                  text-transform: uppercase;
                  font-weight: $font_weight_bold;
                  &.cart-total-right {
                    float: right;
                    font-size: 18px;
                    color: $color_text_heading;
                  }
                }
              }
              .action {
                line-height: 15px;
                margin-left: -20px;
                margin-right: -20px;
                margin-bottom: -20px;
                height: 60px;
                line-height: 60px;
                text-align: center;
                button {
                  background: $bkg_button;
                  border: 1px solid $color_border_button;
                  color: $color_text_button;
                  padding: 0 28px;
                  text-transform: uppercase;
                  @include transition($transition-base);
                  &:hover {
                    background: $bkg_button_hover;
                    border-color: $color_border_button_hover;
                    color: $color_text_button_hover;
                  }
                  &.float-right {
                    margin-right: 10px;
                  }
                  i.fa {
                    padding-left: 5px;
                  }
                }
              }
              .empty {
                a.btn {
                  margin-top: 10px;
                  color: $color_text_button;
                  border-color: $color_border_button;
                  background: $bkg_button;
                  text-transform: uppercase;
                  font-style: normal;
                  height: 36px;
                  line-height: 36px;
                  &:hover{
                    color: $color_text_button_hover;
                    border-color: $color_border_button_hover;
                    background: $bkg_button_hover;
                  }
                }
              }
            }
          }
        }
      }
    }    
  }
}

/*Menu*/
.site-nav {
  height: $height_menu;
  line-height: $height_menu;
  position: fixed;
  width: 100%;
  text-align: center;
  display:block;
  background:#fff;
  @media(max-width: 767px) {
    display: none;
  }
  >li {
    @include inline-block();
    vertical-align: middle;
    height: $height_menu;
    line-height: $height_menu;
    padding: 0 $row_padding;
    @media(max-width: 1199px) {
      padding: 0 10px;
    }
    &:hover {
    }
    >a{
      font-size: $font_size_menu;
      text-transform: uppercase;
      color: $color_text_menu;
      font-weight: $font_weight_bold;
/*       @include transition($transition-base); */
      &:hover {
        color: $color_hover_general;
      }
      i.fa{
        padding-left: 5px;
      }
      @media(max-width: 1199px) {
        font-size: 15px;
      }
      @media (max-width: 991px) {
        padding: 0 8px;
        font-size: 12px;
      }
    }
  }
}
$transition3var: visibility 0s ease-in-out 0.4s, transform 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s;
.dropdown {
  &.mega-menu {
    position: static;
    .megamenu-container {
      .sub-mega-menu{
        @include display-flexbox();
        @include flex-wrap(nowrap);
        @include justify-content(left);
        background: #f2f2f2;
        @media(max-width: 767px) {
          display: block;
        }
        >li {
          width: 25%;
          padding: 2*$row_padding;
          &.col-sampletext {
            img{
              margin-bottom: 20px;
            }
          }
          .li-sub-mega {
            a{
              color: rgba($color_text_general,0.7);
              text-transform: capitalize;
              padding: 0;
              position: relative;
              @include transition($transition-base);
              font-weight: $font_weight_normal;
              @media(max-width: 767px) {
                padding-left: 10px;
              }
              &:before {
                font-family: FontAwesome;
                content: '\f105';
                position: absolute;
                top: -4px;
                left: 0;
                @include transform(scale(0,0));
                @include transition($transition-base);
                @media(max-width: 767px) {
                  @include transform(scale(1,1));
                  top: 0;
                }
              }
            }
            &:hover {
              a {
                color: $color_hover_general;
                padding-left: 10px;
                &:before {
                  @include transform(scale(1,1));
                }
              }
            }
          }
        }
      }
      &.dropdown-menu {
        padding: 0;
        margin-top: 1px;
        line-height: $line_height_general;
        @include border_radius(0);
        @media(max-width: 767px) {
          width: 100% !important;
          background-image: none !important;
        }
      }
    }
  }
  .dropdown-menu {
    min-width: 250px;
    padding: 2*$row_padding;
    border: none;
    margin-top: 0;
    @include border_radius(0);
    @media(max-width: 1199px) {
      min-width: 200px;
      right: 0;
      left: auto;
    }
    li.active {
      a{
        background: transparent;
      }
    }
    .li-sub-mega {
      ul.dropdown-menu {
        visibility: hidden;
        left: 100%;
        top: 0;
        @include opacity(0,0);
        @include transform(translateY(20px));
        @include transition($transition3var);
      }
      &:hover {
        ul.dropdown-menu {
          visibility: visible;
          @include transform(translate3d(0,0,0));
          @include transform(translateY(0));
          @include transition-delay(0s);
          @include opacity(1,100);
        }
      }
    }
  }
  .list-title{
    font-size: 12px;
    line-height: $line_height_general;
    text-transform: capitalize;
    font-weight: 700;
    border-bottom: 1px solid #dfdfdf;
    padding: 10px 0;
    margin-bottom: 10px;
  }
  .li-sub-mega {
    padding: 10px 0;
    >a{
      color: #000;
      text-transform: capitalize;
      padding: 0;
      @include transition($transition-base);
      position: relative;
      font-size: 12px;
      @media(max-width: 767px) {
        padding-left: 10px;
      }
      &:before {
        font-family: FontAwesome;
        content: '\f105';
        position: absolute;
        top: -2px;
        left: 0;
        @include transform(scale(0,0));
        @include transition($transition-base);
        @media(max-width: 767px) {
          @include transform(scale(1,1));
          top: 0;
        }
      }
      i.fa {
        position: absolute;
        right: 0;
        bottom: 0;
        @include transition($transition-base);
      }
    }
    &:hover {
      >a {
        color: $color_hover_general;
        padding-left: 10px;
        background: transparent;
        &:before {
          @include transform(scale(1,1));
        }
        i.fa{
          @include transform(rotate(-90deg));
        }
      }
    }
    &:last-child {
      border-bottom: 0;
    }
  }
}

/*Menu mobile*/
.mobile-nav-header {
  @media(max-width: 767px) {
    height: auto;
    background: $bkg_nav_header;
    .mobile-nav-header-wrapper {
      height: auto;
      .mobile-nav-header-inner {
        height: auto;
        #showLeftPush {
          float: left;
          border: none;
          width: 40px;
          height: 40px;
          padding: 0;
          background: #000;
          i.fa {
            font-size: 20px;
            line-height: 20px;
            color: #fff;
          }
        }
        .is-mobile-nav-menu {
          height: 0;
          background: $bkg_nav_header;
          color: $color_text_menu;
          @include transition($transition-base);
          clear: both;
          &.leftnavi-open {
            height: auto;
            .navbar-nav {
              display: block;
            }
          }
          .navbar-nav {
            margin: 0 $row_padding 2*$row_padding;
            @include box-shadow(0 0 1px 0 rgba(255,255,255,0.3));
            @include transition($transition-base);
            display: none;
            border: 1px solid $color_text_menu;
          } 
          ul {
            > li {
              list-style: none;
              width: 100%;
              padding-left:15px;
              &.col-sampletext {
                p {
                  margin: 0;
                  @media(max-width: 767px) {
                    color: $color_text_menu;
                  }
                }
                color:red;
              }
              a {
                color: #fff;
                &:hover {
                  color: #78b043;
                }
              }
              &.open {
                > a {
                  color: $color_text_menu;
                }
              }
              &.list-title {
                text-transform: uppercase;
                color: $color_text_menu;
                font-weight: 700;
              }
              &.active {
                a {
                  background-color: transparent;
                }
              }
            }
            &.dropdown-menu {
              li.li-sub-mega {
                > ul.dropdown-menu {
                  margin-left: 0;
                  display: block;
                  visibility: visible;
                  @include opacity(1,100);
                  padding-top: 0;
                }
              }
            }
          }
        }
        ul.list-inline {
          float: right;
          margin: 0;
          padding-top: 0;
          display: none;
          .is-mobile-currency {
            margin: 0;
            width: 50px;
            text-align: center;
            .currency {
              padding-right: 15px;
              cursor: pointer;
              i.fa {
                position: absolute;
                right: 0;
                top: 50%;
                margin-top: -5px;
              }
              .dropdown-menu {
                left: auto;
                right: 0;
                min-width: 30px;
              }
            }
          }
          .is-mobile-login {
            margin: 0;
            cursor: pointer;
            padding: 0;
            i.fa {
              padding: 2px;
              color: #fff;
              font-size: 16px;
            }
            .dropdown-menu {
              left: auto;
              right: 0;
            }
          }
          .is-mobile-cart {
            margin: 0;
            width: 50px;
            text-align: center;
            display: none;
          }
        }
        .mobile-top-navigation {
          padding: $row_padding;
          float: left;
          width: 100%;
        }
      }
    }
    .dropdown-menu {
      a {
        color: $color_hover_general;
      }
    }
  }
}
.navbar-nav {
  .open {
    .dropdown-menu {
      >li{
        >a{
          @media(max-width: 767px) {
            padding: 0 0 0 10px;
          }
        }
      }
    }
  }
}
.header-wrapper{
  @media(max-width: 767px) {
    position: relative;
    border-bottom: 1px solid $border_header;
    .main-header{
      position: absolute;
      top: 0;
      right: 0;
      border-bottom: 0;
      width: calc(100% - 70px);
    }
  }
  &.affix {
    width: 100%;
    z-index: 9;
    top: 0;
    &+ .fix-sticky{
      height: 155px;
    }
    .top-header{
      display: block;
    }
    .main-header-wrapper{
      background: $bkg_nav_header;
    }
    .main-header-inner{
      .top_header_wrapper{
        height: $height_top_header_mobile;
        .top_header{
          height: $height_top_header_mobile;
          line-height: $height_top_header_mobile;
          .search_form{
            height: $height_top_header_mobile;
            line-height: $height_top_header_mobile;
          }
          #cart-target{
            >a {
              .num-items-in-cart{
                height: $height_top_header_mobile;
                line-height: $height_top_header_mobile;
                .block-cart {
                  height: $height_top_header_mobile;
                }
              }
            }
          }
        }
      }
    }
    .site-nav{
      height: $height_top_header_mobile;
      line-height: $height_top_header_mobile;
      >li{
        height: $height_top_header_mobile;
        line-height: $height_top_header_mobile - 4px;
      }
    }
  }
}

/*Currencies*/
.dropdown-menu {
  margin: 0;
  &.currencies {
    min-width: 70px;
    right: 0;
    left: auto;
    >li{
      &.active,
      &:hover {
        a{
          background: $color_hover_general;
          color: #fff !important;
        }
      }
      &.active {
        cursor: text;
      }
    }
  }
}

/*Lightbox search*/
#lightbox-search {
  .modal-header{
    text-align: center;
    padding: 20px;
    i.fa{
      font-size: 24px;
    }
  }
  .modal-body{
    padding: 40px;
    form {
      @include display-flexbox();
      @include justify-content(center);
      input {
        height: $height_input_search;
        line-height: $height_input_search;
        width: calc(100% - 40px);
        border: 1px solid $color_border_button;
        border-right: 0;

      }
      button{
        height: $height_input_search;
        width: $height_input_search;
        line-height: $height_input_search;
        padding: 0;
        box-shadow: none;
        border: 1px solid $color_border_button;
        color: $color_text_button;
        background: $bkg_button;
        &:hover {
          border-color: $color_border_button_hover;
          color: $color_text_button_hover;
          background: $bkg_button_hover;
        }
      }
      .search-results{
        margin-left: -$row_padding;
        margin-right: -$row_padding;
        >li{
          margin-bottom: 2*$row_padding;
          a{
            display: block;
            .thumbnail{
              margin-bottom: 10px;
            }
            .title{
              line-height: 1em;
              display: block;
            }
            &:hover {
              .thumbnail{
                border-color: $color_border_button;
              }
            }
          }
          &.last-item{
            padding-left: $row_padding;
            padding-right: $row_padding;
          }
        }
      }
    }
  }
}

/*----------End Header----------*/

/*----------Home content----------*/
/*Scroll top top*/
#scroll-to-top {
  @include transition($transition-base);
  width: 50px;
  height: 50px;
  background-color: $color_hover_general;
  text-align: center;
  line-height: 46px;
  cursor: pointer;
  position: fixed;
  i.fa {
    color: #fff;
    font-size: 20px;
  }
  &:hover {
    background-color: $border_general;
  }
  &.off {
    display: none;
    bottom: 0;
    right: 0;
    @include transition($transition-base);
  }
  &.on {
    @include transition($transition-base);
    display: block;
    right: 20px;
    bottom: 20px;
    z-index: 5;
  }
}

/*Ajax cart*/
.popup-pro-wrapper {
  z-index: 9999;
  .ajax-cart-modal-wrapper {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    top: 20%;
    width: 930px;
    height: 350px;
    .ajax-cart-overlay {
      background-color: rgba(0,0,0,0.5);
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }
    .ajax-cart-box {
      position: relative;
      background-color: #ffffff;
      height: 350px;
      .ajax-cart-left, .ajax-cart-right {
        width: 50%;
        float: left;
        padding: 30px;
      }
      .ajax-cart-note {
        position: relative;
        padding-left: 70px;
        margin-bottom: 25px;
        line-height: 26px;
        font-size: 16px;
        text-transform: uppercase;
        font-weight: $font_weight_bold;
        color: $color_hover_general;
        @media(max-width: 768px){
          font-size: 13px;
        }
        .cirle {
          position: absolute;
          top: 0;
          left: 0;
          background-color: rgba(128, 168, 111, 0.3);
          padding: 10px;
          display: block;
          border-radius: 50%;
          width: 50px;
          height: 50px;
          text-align: center;
          line-height: 23px;
          border: 1px solid rgba(128, 168, 111, 0.5);
        }
        a {
          color: $color_hover_general;
          font-size: 16px;
          text-transform: uppercase;
          font-weight: 600;
          @media(max-width: 768px){
            font-size: 13px;
          }
        }
      }
      .ajax-cart-right {
        border-left: 1px solid $border_general;
        height: 100%;
        .ajax-cart-number-product {
          margin-bottom: 30px;
          font-size: 16px;
          text-transform: uppercase;
          font-weight: $font_weight_bold;
        }
        .ajax-cart-subtotal{
          span {
            font-weight: $font_weight_bold;
          }
        }
        .ajax-cart-group-actions {
          margin-top: 135px;
          .ajax-cart-continue {
            float: left;
            .btn {
              margin-right: 20px;
              color: $color_text_button;
              border: 1px solid $color_border_button;
              background: $bkg_button;
              line-height: 36px;
              &:hover {
                color: $color_text_button_hover;
                border: 1px solid $color_border_button_hover;
                background: $bkg_button_hover;
              }
              i.fa {
                margin-right: 10px;
                margin-left: 0px;
              }
            }
          }
          .ajax-cart-next {
            .btn {
              color: $color_text_button;
              border: 1px solid $color_border_button;
              background: $bkg_button;
              line-height: 36px;
              &:hover {
                color: $color_text_button_hover;
                border: 1px solid $color_border_button_hover;
                background: $bkg_button_hover;
              }
              i.fa {
                margin-left: 10px;
              }
            }
          }
          .btn {
            padding-left: 15px;
            padding-right: 15px;
            i.fa {
              line-height: 1.55em;
            }
          }
        }
        .countDiv {
          margin-top: 10px;
          span {
            color: $color_hover_general;
            font-weight: $font_weight_bold;
          }
        }
      }
      .ajax-cart-close {
        position: absolute;
        top: 0;
        left: 100%;
        width: 30px;
        height: 30px;
        text-align: center;
        border: 2px solid #fff;
        margin-left: 5px;
        cursor: pointer;
        i.fa {
          color: #fff;
          line-height: 24px;
          cursor: pointer;
        }
      }
      @media(max-width: 768px) {
        .ajax-cart-left {
          .ajax-cart-product {
            .ajax-cart-image {
              width: 50%;
              height: auto;
              text-align: center;
              margin: 0 auto;
            }
          }
        }
      }
    }
  }
  .ajax-cart-product-title {
    font-size: $font_size_general;
    margin-bottom: 10px;
    margin-top: 15px;
  }
  .ajax-cart-price {
    font-size: 20px;
    margin-bottom: 25px;
    strong {
      font-weight: $font_weight_normal;
    }
  }
  .ajax-cart-variant {
    margin-bottom: 3px;
  }

}

/*Slideshow*/
$color_text_slideshow: #fff;
.slideshow__text-content {
  >div{
    margin-left: 10%;
    margin-right: 10%;
  }
}
.slideshow__title {
  font-size: 120px;
  line-height: 120px;
  color: $color_text_slideshow;
  text-transform: capitalize;
  font-weight: $font_weight_thin;
  font-family: $font_misc;
  font-style: italic;
  a{
    display: block;
  }
}
.slideshow__subtitle {
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
  color: $color_text_slideshow;
  display: block;
}
.slideshow__link {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  &:active,
  &:focus {
    opacity: 1;
  }
}
.slideshow__text-wrap {
  &.postion-right {
    .slideshow__text-content {
      text-align: right;
      .slideshow__subtitle {
        float: right;
      }
      >div{
        @media(max-width: 1023px) {
          float: right;
        }
      }
    }
  }
  &.postion-left {
    .slideshow__text-content{
      text-align: left;
    }
  }
  &.postion-middle {
    .slideshow__text-content{
      text-align: center;
      .slideshow__subtitle {
        margin: 0 auto;
      }
      >div{
        @media(max-width: 1023px) {
          margin: 0 auto;
        }
      }
    }
  }
}
 .slideshow {
  .slick-dots {
    bottom: 50px;
    position: relative;
    z-index: 3;
    @media(max-width: 767px) {
      bottom: 30px;
    }
    li {
      button{
        &:before {
          width: 10px;
          height: 10px;
          border: 2px solid $color_text_slideshow;
          color: transparent;
        }
      }
    }
  }
}

/*Slick Slider SCSS*/
$slideshow-height-small: 430px;
$slideshow-height-medium: 550px;
$slideshow-height-large: 775px;
$slideshow-loader: #fff;
$z-index-slideshow-image: 1;
$z-index-slideshow-video: 2;
$z-index-slideshow-text: 3;
$z-index-slideshow-controls: 4;
$color-slideshow-close-bg: #fff;
$color-slideshow-close-text: #000;
$gutter-site: 55px;
$slick-dot-size-small: 10px;
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;

  &:focus {
    outline: none;
  }

  &.dragging {
    cursor: pointer;
    cursor: hand;
  }
}
.slick-slider .slick-track,
.slick-slider .slick-list {
  @include transform(translate3d(0,0,0));
}
.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;

  &:before,
  &:after {
    content: "";
    display: table;
  }

  &:after {
    clear: both;
  }

  .slick-loading & {
    visibility: hidden;
  }
}
.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  [dir="rtl"] & {
    float: right;
  }
  &.slick-loading img {
    display: none;
  }

  display: none;

  &.dragging img {
    pointer-events: none;
  }

  .slick-initialized & {
    display: block;
  }

  .slick-loading & {
    visibility: hidden;
  }

  .slick-vertical & {
    display: block;
    height: auto;
    border: 1px solid transparent;
  }
}
.slick-arrow.slick-hidden {
  display: none;
} 
.slideshow__text-wrap {
  height: 100%;
  .slideshow__link & {
    cursor: inherit;
  }

  .slideshow__slide--has-background-video & {
    padding-top: $gutter-site * 3;
  }

  .video-is-playing & {
    display: none;
  }

  .slideshow__slide.video-is-paused & {
    display: none;
  }
}
.slideshow__text-content {
  position: absolute;
  width: 100%;
  top: 50%;
  @include transform(translateY(-40%));
  opacity: 0;
  @include transition($transition-base);
  transition-delay: 0.3s;
  z-index: 3;
  >div{
    @media(max-width: 1023px) {
      width: 35%;
    }
  }
  .slick-active &,
  .no-js & {
    @include transform(translateY(-50%));
    @include opacity(1,100);
  }
  @mixin spinner($size: 20px, $color: $color_text_button) {
    content: '';
    display: block;
    width: $size;
    height: $size;
    position: absolute;
    margin-left: - $size / 2;
    margin-top: - $size / 2;
    border-radius: 50%;
    border: 3px solid $border_general;
    border-top-color: transparent;
  }
  &::after {
    content: '';
    @include spinner(40px, $color_text_button);
    @include animation(spin 0.65s infinite linear normal);
    opacity: 1;
    transition: all 1s cubic-bezier(0.29, 0.63, 0.44, 1);
    bottom: -$gutter-site;
    left: 50%;
  }

  .slick-initialized &,
  .no-js & {
    &::after {
      opacity: 0;
      visibility: hidden;
      content: none;
    }
  }
}
.slideshow-wrapper {
  position: relative;
}
.slideshow {
  overflow: hidden;
  height: $slideshow-height-small - 150;
  margin-bottom: 0;
  @media(min-width: 1024px) {
    height: $slideshow-height-small;
  }

  &.slideshow--medium {
    height: $slideshow-height-medium - 450;
    @media(min-width: 1024px) {
      height: $slideshow-height-medium;
    }
  }

  &.slideshow--large {
    height: $slideshow-height-large - 200;
    @media(min-width: 1024px) {
      height: $slideshow-height-large;
    }
  }

  // Make sure slides fill full height
  .slideshow__slide,
  .slick-list,
  .slick-track {
    height: 100%;
  }

  .slick-prev,
  .slick-next {
    top: 0;
    height: 100%;
    margin-top: 0;
    width: 40px;
  }

  .slick-prev {
    left: 0;
  }

  .slick-next {
    right: 0;
  }

  .slick-dots {
    text-align: center;
    width: 100%;
  }
}
.slideshow__image {
  @include transition($transition-base);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
/*   background-size: cover; */
  background-position: top center;
  z-index: 1;
  .slick-initialized &,
  .no-js & {
    opacity: 1;
  }

  .slideshow__slide--background-video & {
    opacity: 0;
  }

  .no-autoplay & {
    opacity: 1;
  }
}

// z-index stacking issues in oldIE
.ie9 {
  .slideshow__slide {
    // sass-lint:disable no-important
    z-index: 1 !important;
  }

  .slick-dots {
    z-index: 2;
  }
}

/*Slick Slider Theme*/
.slick-list {
  .slick-loading & {
    background: #fff slick-image-url("ajax-loader.gif") center center no-repeat;
  }
}

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  @include transform(translate(0,-50%));
  padding: 0;
  border: none;
  &:hover, &:focus {
    background: transparent;
    color: transparent;
    &:before {
      @include opacity(0.5,50);
    }
  }
  &.slick-disabled:before {
    @include opacity(0.5,50);
  }
  &:before {
    font-family: $font_general;
    font-size: 20px;
    line-height: 1;
    color: $color_text_general;
    @include opacity(0.5,50);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}
.slick-dots {
  position: absolute;
  bottom: -25px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
  li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
    button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer;
      &:hover, &:focus {
        &:before {
          @include opacity(0.5,50);
        }
      }
      &:before {
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        width: 20px;
        height: 20px;
        font-family: $font_general;
        font-size: $font_size_general;
        line-height: 20px;
        text-align: center;
        color: $color_text_general;
        @include opacity(0.5,50);
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
    }
    &.slick-active button:before {
      color: $color_text_general;
      @include opacity(0.5,50);
      background: #fff;
    }
  }
} 
.slick-dotted.slick-slider {
  margin-bottom: 0;
}

/*Slick dots and prev/next pagination*/
.slick-slider .slick-dots {
  margin: 0;

  li {
    // sass-lint:disable SelectorDepth
    margin: 0;
    vertical-align: middle;

    &:first-of-type {
      margin-left: 0;
    }
    button {
      position: relative;
      padding: 0;
      width: $slick-dot-size-small;
      height: $slick-dot-size-small;
    }

    button::before {
      text-indent: -9999px;
      border-radius: 100%;
      opacity: 0.4;
      transition: all 0.2s;
    }

    &.slick-active button::before {
      opacity: 1;
    }

    button:active::before {
      opacity: 0.7;
    }
  }
}

/*End Slideshow*/

/*Distance block*/
.index-section {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  &.home-slideshow{
    margin-top: 0;
  }
  &.banners-section{
    margin-top: 25px;
  }
}
/*End Distance block*/

/*Banner*/
.banner_group {
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  text-align:center;
  @media(max-width: 767px) {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
  }
  .banner-with-col-3 {
    @include inline-block();
    width: 100%;
    >div{
      @media(max-width: 767px) {
        text-align: center;
        margin-bottom: 30px;
        &:last-child {
          margin-bottom: 0;
        }
      }
      a{
        @include effect_banner();
      }
    }
  }
  .banner-with-col-5 {
    @include display-flexbox();
    @include flex-wrap(nowrap);
    @include justify-content(left);
    >div{
      width: 20%;
    }
  }
  >div{
    @include inline-block();
    >div{
      padding-left: 0;
      padding-right: 0;
      position: relative;
      &.middle-area,
      &.right-area {
        @media(max-width: 767px) {
          padding-left: $row_padding;
          padding-right: $row_padding;
        }
      }
      @media(max-width: 767px) {
        text-algin: center;
        margin-bottom: 20px;
        &:last-child {
          margin-bottom: 0;
        }
      }
      &.right-area {
        text-align: right;
        @media(max-width: 767px) {
          text-align: center;
        }
      }
      &.left-area{
        .top-area{
          margin-bottom: 40px;
        }
      }
      a{
        display: block;
        @include transition($transition-base);
        @include effect_banner();
        img {
          @media(max-width: 420px) {
            width: 100%;
          }
        }
        &:hover {
          @include opacity(0.5,50);
        }
      }
      .banner-caption {
        text-align: center;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 25% 0;
        background: rgba(219,1,17,0.5);
        @include transition($transition-base);
        @include opacity(0,0);
        a {
          font-size: 60px;
          line-height: 56px;
          font-style: italic;
          font-weight: $font_weight_bold;
          color: $color_text_banner;
          display: block;
          font-family: $font_misc;
          margin-bottom: 20px;
          @include opacity(1,100);
          @media(max-width: 991px) {
            font-size: 30px;
            line-height: 30px;
          }
        }
      }
      &:hover {
        .banner-caption {
          @include opacity(1,100);
          top: 10px;
          left: 10px;
          right: 10px;
          bottom: 10px;
        }
      }
    }
    &.padding-true {
      >div{
        padding-left: $row_padding;
        padding-right: $row_padding;
        @media(max-width: 767px) {
          margin-bottom: $row_padding;
          &:last-child {
            margin-bottom: 0;
          }
        }
      }
    }
  }
  .padding-false{
    margin-left: $row_padding;
    margin-right: $row_padding;
  }
}
/*End Banner*/

/*Next/pre icon slider*/
$bg_next_pre: #fff;
.owl-buttons {
  >div {
    position: absolute;
    top: 50%;
    margin-top: -20px;
    text-align: center;
    border: 1px solid $color_text_heading;
    width: 40px;
    height: 40px;
    line-height: 40px;
    @include opacity(0,0);
    i.fa {
      font-size: 26px;
      line-height: 38px;
      font-weight: $font_weight_bold;
      color: $color_text_heading;
      vertical-align: top;
    }
    &.owl-prev {
      left: 0;
      margin-left: -35px;
      @media(max-width: 1024px) {
        margin-left: $row_padding;
      }
    }
    &.owl-next {
      right: 0;
      margin-right: -35px;
      @media(max-width: 1024px) {
        margin-right: $row_padding;
      }
    }
  }
}
/*End Next/pre icon slider*/

/*Heading block*/
.section-header {
  overflow: hidden;
  margin-bottom: 27px;
  text-transform: uppercase;
  text-align: center;
  @media(max-width: 767px) {
    padding: 0 $row_padding;
    margin-bottom: $row_padding;
  }
  h2 {
    font-size: 28px;
    font-family: $font_general;
    position: relative;
    font-weight: $font_weight_bold;
    margin-bottom: 0;
    padding: 0 $row_padding 19px;
    @include inline-block();
    color: $color_text_heading;
    @media(max-width: 767px) {
      font-size: 20px;
      padding: 0 $row_padding 10px;
    }
    &:before {
      width: 100px;
      height: 3px;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      text-align: center;
      margin: 0 auto;
      content: '';
      background: $border_general;
    }
  }
}
/*End Heading block*/

/*Product layout*/
$color_icon_spr: $color_text_heading;
.row-container{
  padding-left: $row_padding;
  padding-right: $row_padding;
  margin-bottom: 2*$row_padding;
  .row-left{
    position: relative;
    .hoverBorder {
      display: block;
      .hoverBorderWrapper{
        position: relative;
        overflow: hidden;
        img {
          margin: 0 auto;
          @include border_radius(0);
        }
        span.back{
          @include transition($transition-base);
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          @include transform(scale(0,0));
          @include opacity(0,0);
        }
      }
    }
    .product-label{
      position: absolute;
      top: 0;
      left: 0;
      margin-top: 10px;
      margin-left: 10px;
      .label-element{
        margin-bottom: 10px;
        span {
          @include inline-block();
          height: 40px;
          line-height: 40px;
          width: 40px;
          border: 1px solid $color_text_heading;
          @include border_radius(50%);
          text-align: center;
        }
      }
    }
    .hover-mask {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: 0 auto;
      text-align: center;
      @include transition($transition-base);
      @include transform(scale(1,0));
      margin: 10px auto 0;
      text-align: center;
      @media(max-width: 1024px) {
        position: static;
        @include transform(scale(1,1));
        padding-top: 10px;
      }
      .group-mask{
        .inner-mask{
          text-align: center;
          form {
            margin-bottom: 5px;
            @include inline-block();
            vertical-align: top;
            button {
              font-size: 11px;
              background: $bkg_button;
              border: 1px solid $color_border_button;
              color: $color_text_button;
              @include transition($transition-base);
              @include border_radius(0);
              height: 30px;
              line-height: 30px;
              text-transform: uppercase;
              font-weight: $font_weight_bold;
              @media(max-width: 767px) {
                font-size: 10px;
              }
              i.fa {
                padding-right: 5px;
              }
              &:hover {
                background: $bkg_button_hover;
                border: 1px solid $color_border_button_hover;
                color: $color_text_button_hover;
              }
            }
          }
          .group_qv {
            @include inline-block();
            vertical-align: middle;
            .quickview-wishlist-wrapper {
              margin-bottom: 5px;
              >li {
                @include inline-block-important();
                vertical-align: top;
                a{
                  width: 30px;
                  height: 30px;
                  background: $bkg_button;
                  border: 1px solid $color_border_button;
                  display: block;
                  text-align: center;
                  padding: 0;
                  vertical-align: middle;
                  @include transition($transition-base);
                  @include border_radius(0);
                  i.fa {
                    color: $color_text_button;
                    line-height: 30px;
                    font-weight: $font_weight_bold;
                  }
                  &:hover {
                    background: $bkg_button_hover;
                    border-color: $color_border_button_hover;
                    cursor: pointer;
                    i.fa{
                      color: $color_text_button_hover;
                    }
                  }
                }
                &.wishlist {
                  button {
                    width: 30px;
                    height: 30px;
                    padding: 0;
                    text-align: center;
                    vertical-align: middle;
                    i.fa{
                      padding: 0;
                    }
                  }
                  a.wl-added {
                    color: $color_text_button_hover;
                    border-color: $color_border_button_hover;
                    background: $bkg_button_hover;
                    i.fa{
                      color: $color_text_button_hover;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .row-right {
    text-align: center;
    padding: 20px 0 0;
    @media(max-width: 767px) {
      padding: 10px 0 0;
    }
    .collec-title {
      margin-bottom: 2px;
      display: none;
      a{
        color: #afafaf;
      }
    }
    .product-title{
      font-size: $font_size_general;
      color: $color_text_general;
      @include transition($transition-base);
      font-weight: $font_weight_normal;
      text-overflow: ellipsis;
      overflow: hidden;
      margin-bottom: 2px;
      @media(max-width: 767px) {
        color: $color_text_heading;
      }
      a{
        color: $color_text_general;
        text-transform: capitalize;
        white-space: nowrap;
        font-weight: $font_weight_normal;
        &:hover {
          color: $color_hover_general;
        }
        @media(max-width: 767px) {
          color: $color_text_heading;
        }
      }
      &:hover {
        color: $color_hover_general;
      }
    }
    .rating-star {
      margin-bottom: 5px;
      .spr-badge{
        .spr-badge-starrating {
          .spr-icon {
            font-size: 10px;
            color: $color_icon_spr;
            padding: 1px;
          }
        }
        .spr-badge-caption {
          display: none;
        }
      }
    }
    .product-price{
      font-size: 16px;
      font-weight: $font_weight_bold;
      color: $color_text_heading;
      .price_compare{
        font-size: $font_size_general;
      }
    }
  }
  &:hover {
    .row-left{
      .hoverBorder {
        .hoverBorderWrapper{
          span.back{
            @include transform(scale(1,1));
            @include opacity(1,100);
          }
        }
      }
      .hover-mask {
        @include transform(scale(1,1));
      }
    }
  }
}
/*End Product layout*/

/*Tab products*/
.home-tabs-wrapper {
  margin-right: -$row_padding;
  margin-left: -$row_padding;
  position: relative;
  @media(max-width: 767px) {
    margin-left: 0;
    margin-right: 0;
  }
  .section-content{
    @include inline-block();
    width: 100%;
    @media(max-width: 767px) {
      @include display-flexbox();
      @include justify-content(center);
    }
    .problock-element{
      @media(max-width: 768px) {
        width: 50% !important;
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      @media(max-width: 420px) {
        width: 100% !important;
        &+ .problock-element{
          margin-top: 2*$row_padding;
        }
      }
    }
  }
}
.section-content {
  #tabpanel {
    .home-tabs-title{
      border-bottom: 0;
      text-align: center;
      @include display-flexbox();
      @include justify-content(center);
      margin-bottom: 40px;
      >li{
        float: none;
        margin: 0 7px;
        >a {
          font-size: 16px;
          text-transform: uppercase;
          color: $color_text_title;
          padding: 7px 22px;
          @include border_radius(0);
          border: 2px solid $border_title;
          @media(max-width: 767px) {
            font-size: 13px;
            padding: 7px 5px;
          }
        }
        &.active,
        &:hover {
          a{
            background: $shop_bg_color;
            color: $color_text_heading;
            border: 2px solid $color_text_heading;
          }
        }
      }
    }
    .tab-content {
      margin-bottom: 35px;
      @media(max-width: 767px) {
        margin-bottom: 0;
      }
      .section-tab-content{
        .content {
          @include display-flexbox();
          @include justify-content(left);
          .grid__item {
            width: 25%;
            @media(max-width: 767px) {
              width: 33.3% !important;
            }
            @media(max-width: 480px) {
              width: 50% !important;
            }
            &:nth-last-child(-n + 4) {
              .row-container {
                margin-bottom: 0;
                @media(max-width: 767px) {
                  margin-bottom: 2*$row_padding;
                }
              }
            }
            &:nth-last-child(-n + 2) {
              .row-container {
                @media(max-width: 767px) {
                  margin-bottom: 0;
                }
              }
            }
          }
        }
      }
    }
  }
}
/*End Tab products*/

/*Problock*/
.problock-title {
  font-size: 18px;
  text-transform: uppercase;
  color: $color_text_heading;
  font-weight: $font_weight_bold;
  margin-bottom: 30px;
}
.problock-content{
  .row-container{
    padding-left: 0;
    padding-right: 0;
    .row-inner{
      @include inline-block();
      margin-left: -$row_padding;
      margin-right: -$row_padding;
      @media(max-width: 767px) {
        @include display-flexbox();
        @include justify-content(left);
      }
      .row-right{
        text-align: left;
        @media(max-width: 767px) {
          padding: 0;
        }
      }
      >div {
        @media(max-width: 767px) {
          width: 50%;
        }
      }
    }
  }
  >div{
    &:last-child {
      .row-container{
        margin-bottom: 0;
      }
    }
  }
}
/*End Problock*/

/*Banner with text*/
.banner-with-text {
  margin-top: $margin_distance;
  overflow: hidden;
  @media(max-width: 767px) {
    padding: 0 $row_padding;
    margin-top: $margin_distance_mobile;
  }
  .banner-element {
    position: relative;
    .banner-bkg{
      display: block;
      position: relative;
      overflow: hidden;
      @include transition($transition-base);
    }
    .banner-caption {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      text-align: center;
      color: $color_text_banner;
      text-transform: uppercase;
      letter-spacing: 1px;
      height: 370px;
      display: table;
      width: 100%;
      @include transition($transition-base);
      @media(max-width: 991px) {
        height: auto;
        padding-top: 40px;
      }
      @media(max-width: 480px) {
        padding-top: 20px;
      }
      .banner-caption-inner{
        display: table-cell;
        vertical-align: middle;
        padding-left: 200px;
        padding-right: 200px;
        position: relative;
        @include transition($transition-base);
        @media(max-width: 991px) {
          padding-left: 0;
          padding-right: 0;
        }
        .mega-title {
          font-size: 50px;
          line-height: 50px;
          font-weight: $font_weight_bold;
          margin: 0 0 5px;
          position: relative;
          @media(max-width: 991px) {
            font-size: 20px;
            line-height: 20px;
          }
          @media(max-width: 480px) {
            font-size: 15px;
            line-height: 15px;
          }
          @media(max-width: 600px) {
            font-size: 8px;
            line-height: 8px;
            margin-bottom: 5px;
          }
        }
        .mega-subtitle {
          font-size: $font_size_general;
          text-transform: initial;
          position: relative;
          p {
            color: $color_text_banner;
          }
          @media(max-width: 991px) {
            font-size: $font_size_general;
          }
          @media(max-width: 600px) {
            font-size: 7px;
          }
        }
        a.btn {
          height: 50px;
          line-height: 50px;
          padding: 0 100px;
          @include border_radius(0);
          border: 2px solid $color_border_button2;
          background: $bkg_button2;
          color: $color_text_button2;
          margin-top: 30px;
          position: relative;
          @media(max-width: 767px) {
            height: 30px;
            line-height: 30px;
            padding: 0 30px;
            margin-top: 15px;
          }
          @media(max-width: 320px) {
            height: 20px;
            line-height: 20px;
            padding: 0 20px;
            margin-top: 10px;
            font-size: 10px;
          }
        }
        &:before {
          position: absolute;
          content: '';
          top: 60px;
          left: 60px;
          right: 60px;
          bottom: 60px;
          background: #fff;
          @include transform(scale(0,0));
          @include transition($transition-base);
          z-index: 0;
          @media(max-width: 1199px) {
            display: none;
          }
        }
      }
    }
    &:hover {
      .banner-caption {
        .banner-caption-inner {
          color: $color_text_title;
          @media(max-width: 1199px) {
            color: $color_text_banner;
          }
          &:before {
            @include transform(scale(1,1));
          }
          .mega-subtitle {
            p {
              color: $color_text_title;
              @media(max-width: 1199px) {
                color: $color_text_banner;
              }
            }
          }
          a.btn {
            border-color: $color_border_button2_hover;
            background: $bkg_button2_hover;
            color: $color_text_button2_hover;
          }
        }
      }
      .banner-bkg{
        @include transform(scale(1.1,1.1));
      }
    }
  }
}
/*End Banner with text*/

/*Product slider block*/
.home-productslider-wrapper {
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  @media(max-width: 767px) {
    margin-left: 0;
    margin-right: 0;
  }
  &:hover {
    .owl-buttons{
      >div{
        @include opacity(1,100);
      }
    }
  }
  .row-container {
    margin-bottom: 0;
  }
}
/*End Product slider block*/

/*Home blog*/
.blog-item-group {
  .article-grid-image{
    display: block;
    @include effect_banner();
  }
  .blog-des{
    padding: 18px 20px;
    .article-title{
      font-size: 16px;
      text-transform: initial;
      margin: 0;
      margin-bottom: 15px;
      a{
        font-size: 16px;
      }
    }
    >ul{
      @include display-flexbox();
      @include justify-content(space-between);
      >li {
        font-size: 10px;
        color: #a9a9a9;
        text-transform: uppercase;
        i.fa{
          color: $color_text_heading;
          padding-right: 5px;
          font-size: $font_size_general;
        }
      }
    }
  }
}
/*End Home blog*/

/*Top Loading*/
#loader-div {
  text-align: center;
  position: fixed;
  top: 0 !important;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.9);
  z-index: 99999;
  #loader-wrapper {
    display: table;
    width: 100%;
    height: 100%;
    .loading-div-logo {
      margin-top: 0 !important;
      display: table-cell;
      width: 100%;
      height: 100%;
      vertical-align: middle;
    }
  }
}
/*End Top Loading*/

/*Loading svg icon*/
$green: #008744;
$blue: #0057e7;
$red: #d62d20;
$yellow: #ffa700;
$white: #eee;

$width: 100px;
$zoom: 1.7;

#main-content {
  background-color: $shop_bg_color;
}
.loader {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  margin: 0 auto;
  width: $width;
  height: $width;
  zoom: $zoom;
}
.circular {
  animation: rotate 2s linear infinite;
  height: $width;
  position: relative;
  width: $width;
}
.path {
  stroke-dasharray: 1,200;
  stroke-dashoffset: 0;
  animation: dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;
  stroke-linecap: round;
}

@keyframes rotate{
  100%{
    transform: rotate(360deg);
  }
}
@keyframes dash{
  0%{
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }
  50%{
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }
  100%{
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}
@keyframes color{
  100%, 0%{
    stroke: $red;
  }
  40%{
    stroke: $blue;
  }
  66%{
    stroke: $green;
  }
  80%, 90%{
    stroke: $yellow;
  }
}
/*End Loading svg icon*/

/*Popup Newsletter*/
#newsletter-popup {
  .nl-wraper-popup {
    width: 730px;
    padding-right: 280px;
    padding-left: 30px;
    padding-top: 38px;
    padding-bottom: 60px;
    height: 370px;
    margin: 0px auto;
    background-color: #ECEAEB;
    color: $color_text_heading;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    margin-top: -185px;
    z-index: 999;
    @media(max-width: 767px) {
      width: 80%;
      padding: 30px $row_padding;
    }
    p{
      margin-top: $row_padding;
    }
    .group_input {
      position: relative;
      margin-top: 20px;
      button.btn {
        position: absolute;
        right: 0;
        top: 0;
        height: 40px;
        line-height: 40px;
        background-color: $color_hover_general;
        border: 1px solid $color_border_button_hover;
        color: $color_text_button_hover;
        background: $bkg_button_hover;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        &:hover {
          border-color: $color_border_button;
          color: $color_text_button;
          background: $bkg_button;
        }
      }
      .form-control {
        height: 40px;
        line-height: 40px;
      }
    }
    .nl-popup-close {
      position: absolute;
      top: -15px;
      right: -15px;
      width: 30px;
      height: 30px;
      cursor: pointer;
      background-color: #000;
      border-radius: 50%;
      border: 2px solid #fff;
      text-align: center;
      i.fa {
        margin-top: 5px;
        color: #fff;
      }
    }
    #popup-hide {
      margin-top: 20px;
      #mc-popup-hide {
        vertical-align: -4px;
      }
    }
  }
}
/*End Popup Newsletter*/

/*----------End Home content----------*/

/*----------Subpages content----------*/

/*Breakcrumb*/
$height_breadcrumb: 50px;
$color_text_breadcrumb: #a9a9a9;
@mixin background_breadcrumb(){
  height: $height_breadcrumb;
  line-height: $height_breadcrumb;
  margin-bottom: 5px;
  background-color: $bkg_breadcrumb;
}
@mixin height_breadcrumb() {
  text-align: center;
  width: 100%;
  height: $height_breadcrumb;
  line-height: $height_breadcrumb;
  @media(max-width: 767px) {
    height: auto;
    padding-top: $row_padding;
    padding-bottom: $row_padding;
  }
}
.page-title {
  @include inline-block();
  float: left;
  line-height: $height_breadcrumb;
  display: none;
  @media(max-width: 767px) {
    line-height: $line_height_general;
    float: none;
    text-align: center;
    width: 100%;
  }
}
.breadcrumb {
  @include inline-block();
  line-height: $height_breadcrumb;
  padding: 0;
  margin: 0;
  background: transparent;
  @media(max-width: 767px) {
    line-height: $line_height_general;
    float: none;
    text-align: center;
    width: 100%;
  }
  span {
    font-size: 13px;
    text-transform: uppercase;
    color: $color_text_breadcrumb;
    padding: 0 2px;
    font-weight: $font_weight_normal;
    a{
      color: $color_text_breadcrumb;
      font-size: 13px;
      font-weight: $font_weight_normal;
    }
  }
  strong {
    color: $color_text_general;
  }
}
/*End Breakcrumb*/

/*Collection*/
.list-collection-heading {
  .list-collection-heading-wrapper{
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .list-collection-heading-inner{
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 10px;
        padding-top: 10px;
      }
    }
  }
}
.list-collection-content {
  .list-collections-wrapper{
    .products {
      background: $shop_bg_color;
      @include display-flexbox();
      @include flex-wrap(nowrap);
      @include justify-content(left);
      >div {
        margin-bottom: 20px;
        text-align: center;
        .details {
          margin-top: 10px;
        }
        .image {
          a {
            display: block;
            overflow: hidden;
            img {
              @include transition($transition-base);
            }
          }
        }
        &:hover {
          .image {
            a {
              img {
                @include opacity(0.5,50);
                @include transform(scale(1.1,1.1));
              }
            }
          }
        }
      }
    }
  }
}
/*End Collection*/

/*Collection all*/
$bg_toolbar: transparent;
$bg_icon_gridlist: transparent;
$bg_icon_gridlist_active: #000;
$color_icon_gridlist: #b2b2b2;
$color_icon_gridlist_active: #fff;
$height_sort: 40px;
$color_button_listmode: #818181;
$color_sort_button: #464646;
$border_grid_list: #DAD4D4;
$border_right_tag: #e1e1e1;
$border_swatch_tag: #3f3f3d;
$border_des_grid: #c8c8c8;
$bg_paging: #fff;
$bg_check: url(//cdn.shopify.com/s/files/1/2059/3133/t/9/assets/bg_check.png?9692);
$bg_none_check: url(//cdn.shopify.com/s/files/1/2059/3133/t/9/assets/bg_none_check.png?9692);
$bg_filter: #323232;
.collection-heading {
  .collection-heading-wrapper{
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .collection-heading-inner{
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 10px;
        padding-top: 10px;
      }
    }
  }
}
$height_sort: 40px;
$color_text_button_list: #818181;
.collection-content {
  .collection-content-wrapper{
    .collection-content-group {
      margin-right: -$row_padding;
      margin-left: -$row_padding;
      @media(max-width: 767px) {
        margin-left: 0;
        margin-right: 0;
      }
      .collection-content-inner{
        @include inline-block();
        background: $shop_bg_color;
        width: 100%;
        .main-content {
          float: right;
          .collection-banner {
            margin-bottom: 40px;
          }
        }
        .left-sidebar{
          @media(max-width: 767px) {
            @include inline-block();
            width: 100%;
          }
          .sidebar-block{
            margin-bottom: 38px;
            .sidebar-title{
              font-size: 20px;
              color: $color_text_heading;
              text-transform: uppercase;
              font-weight: $font_weight_bold;
              margin-bottom: 23px;
            }
            .sidebar-content {
              ul.links{
                margin-left: $row_padding;
                >li{
                  padding: 5px 0;
                  list-style-type: square;
                  &:first-child {
                    padding-top: 0;
                  }
                  
                }
              }
              .sidebar-product{
                .row-container{
                  padding-left: 0;
                  padding-right: 0;
                  .row-right{
                    text-align: left;
                    @media(max-width: 1024px) {
                      padding: 10px 0;
                    }
                  }
                  .row-inner {
                    margin-left: -$row_padding;
                    margin-right: -$row_padding;
                  }
                }
              }
            }
            &.filter-block{
              &.tag-group{
                ul {
                  list-style: none;
                  margin: 0;
                  > li {
                    padding: 5px 0;
                    span {
                      width: 26px;
                      height: 26px;
                      @include inline-block();
                      float: left;
                      cursor: pointer;
                      background-position: center center;
                      @include transition($transition-base);
                      &.fe-checkbox {
                        width: 16px;
                        height: 16px;
                        background-image: $bg_none_check;
                        background-repeat: no-repeat;
                        background-position: center center;
                        margin: 2px 15px 0 0;
                      }
                    }
                    &.active {
                      span.fe-checkbox {
                        background-image: $bg_check;
                      }
                    }
                    a {
                      font-size: $font_size_general;
                      display: block;
                      width: 100%;
                      height: 100%;
                    }
                    &:hover {
                      a {
                        color: $color_hover_general;
                      }
                    }
                    &:first-child {
                      padding-top: 0;
                    }
                  }
                }
                &.color {
                  ul > li{
                    @include inline-block();
                    width: 30px !important;
                    height: 30px;
                    overflow: hidden;
                    padding: 0 0 5px;
                    span {
                      border: 2px solid rgba(0,0,0,0.1);
                    }
                    &:hover span {
                      border-color: $border_swatch_tag;
                    }
                    &.active {
                      &:hover {
                        span {
                          a{
                            cursor: text;
                          }
                        }
                      }
                      span {
                        border-color: $border_swatch_tag;
                      }
                    }
                  }
                }
              }
            }
          }
        }
        #tags-load {
          text-align: center;
          position: fixed;
          width: 100%;
          height: 100%;
          background-color: rgba(0,0,0,0.3);
          left: 0;
          right: 0;
          z-index: 9;
          top: 0;
          z-index: 9999;
          i.fa {
            position: absolute;
            top: 50%;
            color: $color_hover_general;
          }
        }
        #collection {
          display: block;
          float: none;
          .collection-toolbar {
            margin-left: -$row_padding;
            margin-right: -$row_padding;
            margin-bottom: 25px;
            div.list-inline {
              margin: 0;
              @include inline-block();
              width: 100%;
              .grid_list{
                text-align: left;
                >ul{
                  margin: 0;
                  li{
                    width: $height_sort;
                    height: $height_sort;
                    line-height: $height_sort;
                    border: 1px solid $border_general;
                    text-align: center;
                    padding: 0;
                    i.fa{
                      color: $color_text_title;
                    }
                    &#goList{
                      margin-left: 5px;
                    }
                    &:hover,
                    &.active {
                      cursor: pointer;
                      border-color: $color_border_button_hover;
                      background: $bkg_button_hover;
                      i.fa{
                        color: $color_text_button_hover;
                      }
                    }
                    &.active {
                      cursor: text;
                    }
                  }
                }
              }
              .sortBy {
                text-align: right;
                .sortBy_group{
                  position: relative;
                  #sortButton{
                    width: 220px;
                    text-align: left;
                    padding: 0 10px;
                    position: relative;
                    color: $color_text_heading;
                    height: $height_sort;
                    line-height: $height_sort;
                    background: transparent;
                    border: 1px solid $border_general;
                    box-shadow: none;
                    i.fa{
                      position: absolute;
                      top: 50%;
                      right: 0;
                      margin-right: 10px;
                      margin-top: -7px;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
.collection-items {
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  .products {
    @include display-flexbox();
    @include justify-content(left);
    width: 100%;
  }
  .product-item-wrapper {
    @media(max-width: 767px) {
      width: 50%;
    }
    .row-container {
      padding-left: 0;
      padding-right: 0;
      @include border_radius(0);
      &:hover {
        overflow: inherit;
        .row-right {
          .grid-mode-description {
            @include transform(scale(1,1));
            height: 100%;
            @include opacity(1,100);
          }
        }
      }
      .row-right {
        padding-bottom: 0;
        .list-mode-description {
          display: none;
        }
        .grid-mode-description {
          display: none;
          @include transform(scale(1,0));
          @include transition($transition-base);
          @include backface_visibility(hidden);
          height: 0;
          @include opacity(0,0);
          margin-top: 25px;
          position: relative;
          &:after {
            position: absolute;
            content: '';
            left: 0;
            right: 0;
            top: -10px;
            margin: 0 auto;
            text-align: center;
            width: 40px;
            height: 1px;
            background: $border_des_grid;
          }
        }
        .hover-mask{
          .inner-mask {
            form{
              width: auto;
              margin-bottom: 2px;
              button.btn{
                padding: 0 10px;
              }
            }
            .quickview-wishlist-wrapper {
              form{
                button.btn{
                  padding: 0;
                }
              }
            }
          }
        }
        .list-action{
          display: none;
        }
      }
    }
  }
  &.full_width {
    .product-item-wrapper {
      width: 100%;
      .row-container {
        height: auto;
        .row-left {
          width: 31%;
          padding: 0;
          float: left;
          .hover-mask{
            display: none;
          }
        }
        .row-right {
          width: 69%;
          float: left;
          position: static;
          text-align: left;
          padding-left: 30px !important;
          box-shadow: none;
          .left-area{
            float: left;
            width: 60%;
            text-align: left;
            .product-title {
              a {
                font-size: 20px;
                color: $color_text_heading;
                font-weight: $font_weight_bold;
                &:hover {
                  color: $color_hover_general;
                }
              }
            }
          }
          .right-area {
            float: right;
            width: 40%;
            text-align: right;
          }
          .grid-mode-description, .descript_product {
            display: none;
          }
          .descript_hover_product {
            width: 75%;
            position: static;
            height: auto;
            text-align: left;
            @include opacity(1,100);
          }
          .list-mode-description  {
            @include inline-block();
            width: 100%;
            color: $color_text_heading;
            padding-top: 10px;
            margin-top: 10px;
            margin-bottom: 22px;
            clear: both;
            border-top: 1px solid $border_general;
          }
          .avaibale-variants {
            display: block;
          }
          .hover-mask {
            position: static;
            height: auto;
            @include opacity(1,100);
            @include transform(scale(1,1));
            text-align: left;
            .group-mask{
              float: left;
              .inner-mask{
                @include display-flexbox();
                @include justify-content(left);
              }
            }
          }
          .list-action{
            @include display-flexbox();
            @inclue justify-content(space-between);
            form {
              margin-right: 60px;
              @media(max-width: 1199px) {
                margin-right: 10px;
              }
              .effect-ajax-cart{
                button {
                  height: auto;
                  line-height: $line_height_general;
                  padding: 0;
                  border: none;
                  background: transparent;
                  color: $color_text_button_list;
                  text-transform: uppercase;
                  vertical-align: top;
                  i.fa{
                    padding-right: 10px;
                  }
                  &:hover {
                    color: $color_text_button;
                  }
                }
              }
            }
            .group_qv{
              ul.quickview-wishlist-wrapper{
                @include display-flexbox();
                @inclue justify-content(space-between);
                li{
                  a{
                    color: $color_text_button_list;
                    text-transform: uppercase;
                    font-weight: $font_weight_normal;
                    &:hover {
                      cursor: pointer;
                      color: $color_text_button;
                    }
                    i.fa{
                      padding-right: 10px;
                    }
                  }
                  &:first-child {
                    margin-right: 60px;
                    @media(max-width: 1199px) {
                      margin-right: 10px;
                    }
                  }
                }
              }
            }
          }
        }
        &:hover {
          .row-right {
            box-shadow: none;
            .descript_hover_product {
              box-shadow: none;
            }
          }
        }
      }
    }
  }
}
.pagination {
  li {
    color: $color_text_general;
    >div {
      padding: 0;
    }
    a {
      font-weight: normal;
      padding: 0 $row_padding;
      background: $bg_paging;
      border: 1px solid $border_general;
      color: $color_text_heading;
      font-size: 15px;
      margin: 0;
      height: 40px;
      line-height: 40px;
      border-left: 0;
      position: relative;
      @include border_radius(0);
      &:hover {
        text-decoration: none; 
        background-color: $bkg_button_hover; 
        color: $color_text_button_hover; 
        border-color: $color_border_button_hover;
      }
    }
    &.active {
      a, a:hover {
        text-decoration: none; 
        background-color: $bkg_button_hover; 
        color: $color_text_button_hover; 
        border-color: $color_border_button_hover;
      }
    }
    &:first-child {
      a {
        border-left: 1px solid $border_general;
      }
    }
    &.prev,
    &.next {
      a{
        width: 85px;
        text-align: left;
        @include border_radius(0);
        &:before {
          content: 'PREV';
          position: absolute;
          right: 0;
          top: 0;
          margin-right: 15px;
        }
      }
    }
    &.next {
      a{
        text-align: right;
        &:before {
          content: 'NEXT';
          right: auto;
          left: 0;
          margin-right: 0;
          margin-left: 15px;
        }
      }
    }
  }
}
#showBox {
  margin: -8px 0 0;
  border-radius: 7px;
  padding: 0;
  #showForm {
    margin:  0;
    padding: 15px;
    > li {
      margin: 0 0 15px;
      font-size: $font_size_general;
      line-height: 15px;
      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}
#sortBox {
  margin: 0;
  padding: 0;
  right: 0;
  left: auto;
  width: 220px;
  @include border_radius(0);
  #sortForm {
    margin:  0;
    padding: 15px;
    > li {
      margin: 0 0 15px;
      font-size: $font_size_general;
      line-height: 15px;
      &:last-child {
        margin-bottom: 0;
      }
    }
  }
}
.collection-banner{
  .collection-banner-wrapper{
    .collection-banner-inner{
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
    }
  }
}
/*End Collection all*/

/*Not found page*/
.main-content{
  min-height: 300px;
  .search-page,
  .wishlist-page,
  .empty-page-content{
    margin-top: $margin_distance;
    @media(max-width: 767px) {
      margin-top: $margin_distance_mobile;
    }
  }
}

/*Detail product*/
.detail-heading {
  .detail-heading-wrapper{
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .detail-heading-inner{
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 10px;
        padding-top: 10px;
      }
    }
  }
}
$height_button_productdetail: 32px;
.product-detail-content {
  .detail-content-wrapper {
    .detail-content-inner{
      background: $shop_bg_color;
      .detail-content {
        padding-left: 0;
        padding-right: 0;
        @include inline-block();
        width: 100%;
        .info-detail-pro {
          padding-left: 0;
          padding-right: 0;
          @media(max-width: 767px) {
            padding-left: $row_padding;
            padding-right: $row_padding;
          }
          #product-image {
            padding-left: 0;
            @media(max-width: 991px) {
              padding-right: 0;
            }
            .thumbs {
              margin-left: -$row_padding;
              margin-right: -$row_padding;
              margin-top: 20px;
              @media(max-width: 767px) {
                margin-left: 0;
                margin-right: 0;
              }
              .owl-theme {
                .owl-wrapper-outer {
                  .owl-item {
                    .image {
                      padding-left: $row_padding;
                      padding-right: $row_padding;
                      @media(max-width: 767px) {
                        padding-left: 5px;
                        padding-right: 5px;
                      }
                    }
                  }
                }
              }
              .owl-buttons{
                >div{
                  &.owl-prev{
                    margin-left: 0;
                  }
                  &.owl-next{
                    margin-right: 0;
                  }
                }
              }
              &:hover {
                .owl-buttons{
                  >div{
                    @include opacity(1,100);
                  }
                }
              }
            }
          }
          #product-information {
            padding-right: 0;
            @media(max-width: 991px) {
              padding-left: 0;
              margin-top: 20px;
            }
            @media(max-width: 767px) {
              width: 100%;
            }
            h1.title {
              font-size: 30px;
            }
            .inventory_management{
              span {
                font-size: 20px;
                color: $color_text_title;
                padding-left: 33px;
              }
            }
            .title {
              font-size: 20px;
              margin-bottom: 20px;
              line-height: 30px;
              font-weight: $font_weight_bold;
              color: $color_text_heading;
              text-transform: capitalize;
              @include inline-block();
            }
            .inventory_management{
              margin-bottom: 20px;
              .title {
                margin-bottom: 0;
              }
            }
            .rating-star {
              margin-bottom: 20px;
              .spr-badge-caption {
                text-transform: uppercase;
                color: $color_text_title;
              }
              i.spr-icon {
                color: $color_icon_spr;
                font-size: 20px;
                padding-right: 2px;
              }
            }
            .description {
              margin-bottom: 20px;
              p{
                color: $color_text_heading;
              }
              .quick_overview {
                text-transform: uppercase;
                margin-bottom: 10px;
                font-size: 16px;
              }
            }
            #add-item-form {
              .purchase {
                margin-bottom: 20px;
                .price {
                  font-size: 40px;
                  color: $color_text_heading;
                  font-weight: $font_weight_bold;
                  span.money {
                    font-size: 40px;
                    font-family: $font_general;
                    color: $color_text_heading;
                  }
                  del .money {
                    font-size: 20px;
                  }
                }
              }
              .quantity-wrapper {
                width: 260px;
                margin-bottom: 20px;
                @media(max-width: 767px) {
                  width: 220px;
                }
                .wrapper-title {
                  display: none;
                }
                .wrapper {
                  height: $height_button_productdetail;
                  border: 1px solid $color_border_button;
                  position: relative;
                  span {
                    height: $height_button_productdetail - 1px;
                    width: $height_button_productdetail;
                    line-height: $height_button_productdetail - 1px;
                    padding: 0 15px;
                    cursor: pointer;
                    position: absolute;
                    text-align: center;
                    top: 0;
                    i.fa{
                      color: $color_text_heading;
                    }
                    &.qty-up {
                      right: 0;
                      border-left: 1px solid $color_border_button;
                    }
                    &.qty-down {
                      left: 0;
                      border-right: 1px solid $color_border_button;
                    }
                  }
                  input {
                    height: $height_button_productdetail;
                    line-height: $height_button_productdetail;
                    width: 100%;
                    border: none;
                    box-shadow: none;
                    text-align: center;
                    background: transparent;
                    color: $color_text_heading;
                    font-weight: $font_weight_bold;
                  }
                }
              }
              .purchase-section {
                float: left;
                margin-right: $row_padding;
                .btn {
                  font-size: 125%;
                  text-transform: uppercase;
                  padding: 0 60px;
                  color: $color_text_button;
                  border: 1px solid $color_border_button;
                  background: $bkg_button;
                  height: $height_button_productdetail;
                  line-height: $height_button_productdetail;
                  @include border_radius(0);
                  font-weight: $font_weight_bold;
                  &:hover {
                    color: $color_text_button_hover;
                    border: 1px solid $color_border_button_hover;
                    background: $bkg_button_hover;
                    @include opacity(1,100);
                  }
                  @media(max-width: 767px) {
                    padding: 0 40px;
                  }
                  i.fa {
                    padding-right: 9px;
                  }
                }
              }
              .product-options  {
                margin-top: 20px;
                .select {
                  @include display-flexbox();
                  @include justify-content(left);
                  margin-bottom: 22px;
                  .selector-wrapper {
                    width: 50%;
                    padding-right: $row_padding;
                    label {
                      font-size: 20px;
                      font-weight: $font_weight_bold;
                      color: $color_text_heading;
                      display: block;
                      line-height: 36px;
                      padding-bottom: 10px;
                    }
                    select{
                      width: 100%;
                      height: 40px;
                      line-height: 40px;
                      border: 2px solid $border_general;
                      box-shadow: none;
                      color: $color_text_heading;
                    }
                  }
                }
                /*color swatch*/
                .swatch {
                  margin-bottom: 20px;
                  .header {
                    font-size: 20px;
                    font-weight: $font_weight_bold;
                    color: $color_text_heading;
                    @include inline-block();
                    width: 100px;
                    line-height: 36px;
                    padding-bottom: 10px;
                    float: left;
                  }
                  .swatch-element {
                    padding: 0px;
                    cursor: pointer;
                    width: 36px;
                    height: 36px;
                    float: left;
                    margin-right: 8px;
                    margin-bottom: 10px;
                    border-radius: 0%;
                    border-width: 1px;
                    border-style: solid;
                    border-color: rgba(0,0,0,0.1);
                    @include transition($transition-base);
                    background-position: -1px -1px;
                    position: relative;
                    .tooltip {
                      position: absolute;
                      bottom: 100%;
                      left: 0;
                      padding: 5px 10px;
                      color: #fff;
                      background-color: #000;
                      border-radius: 3px;
                      margin-bottom: 8px;
                      &:after {
                        content: '';
                        bottom: auto;
                        border-left: 4px solid transparent;
                        border-right: 4px solid transparent;
                        border-top: 8px solid #000;
                        top: 100%;
                        margin-top: -2px;
                        position: absolute;
                        display: block;
                      }
                    }
                    .crossed-out, input {
                      display: none;
                    }
                    label {
                      width: 100%;
                      height: 100%;
                      border: 1px solid $border_general;
                      background-color: $border_general;
                      font-weight: $font_weight_normal;
                      text-align: center;
                      line-height: 30px;
                      background-position: -1px -1px;
                      overflow: hidden;
                    }
                    &:hover {
                      cursor: pointer;
                      .tooltip {
                        @include opacity(1,100);
                      }
                    }
                    &.hovered, &.active {
                      border-color: #000;
                    }
                    &.active {
                      cursor: text;
                    }
                  }
                }
              }
            }
            .need-to-wishlist{
              height: 50px;
              width: 50px;
              line-height: 50px;
              @include inline-block();
              text-align: center;
              border: 1px solid $color_border_button;
              color: $color_text_button;
              background: $bkg_button;
              &:hover {
                cursor: pointer;
                border-color: $color_border_button_hover;
                color: $color_text_button_hover;
                background: $bkg_button_hover;
              }
              i.fa {
                height: 50px;
                width: 50px;
                line-height: 50px;
                vertical-align: top;
              }
            }
            .wishlist-button{
              float: left;
            }
            .product-detail-tag {
              display: block;
              width: 100%;
              margin-bottom: 20px;
              padding-bottom: 20px;
              margin-top: 25px;
              border-bottom: 2px solid $border_general;
              clear: both;
              .tags{
                span {
                  color: $color_text_heading;
                  font-size: 20px;
                  font-weight: $font_weight_bold;
                }
              }
            }
            .add-to-wishlist {
              height: 50px;
              width: 50px;
              line-height: 50px;
              @include inline-block();
              text-align: center;
              border: 1px solid $color_border_button;
              color: $color_text_button;
              background: $bkg_button;
              &:hover {
                cursor: pointer;
                border-color: $color_border_button_hover;
                color: $color_text_button_hover;
                background: $bkg_button_hover;
              }
              i.fa {
                height: 50px;
                width: 50px;
                line-height: 50px;
                vertical-align: top;
              }
            }
            .wishlist-added {
              height: 50px;
              width: 50px;
              line-height: 50px;
              text-align: center;
              border: 1px solid $color_border_button;
              color: $color_text_button;
              background: $bkg_button;
              a{
                color: $color_text_button;
              }
              &:hover {
                cursor: text;
                border-color: $color_border_button_hover;
                color: $color_text_button_hover;
                background: $bkg_button_hover;
                a{
                  color: $color_text_button_hover;
                }
              }
              i.fa {
                height: 50px;
                width: 50px;
                line-height: 50px;
                vertical-align: top;
              }
            }
            .social-sharing {
              >a{
                background: transparent;
                color: $color_text_heading;
                border: 2px solid $border_general;
                @include border_radius(0);
                height: 40px;
                line-height: 40px;
                margin-right: 5px;
                &:hover {
                  background: $color_hover_general;
                  color: #fff;
                }
              }
            }
          }
        }
        #tabs-information {
          padding-left: 0;
          padding-right: 0;
          border: 1px solid $border_general;
          margin-top: $margin_distance;
          margin-bottom: $margin_distance;
          @media(max-width: 767px) {
            margin-left: $row_padding;
            margin-right: $row_padding;
            margin-top: $margin_distance_mobile;
            margin-bottom: $margin_distance_mobile;
          }
          .tabs-title {
            padding-left: 0;
            padding-right: 0;
            ul.nav-tabs {
              margin-left: 0;
              padding-right: 0;
              border-bottom: 0;
              @include display-flexbox();
              @include justify-content(flex-start);
              border-bottom: 1px solid $border_general;
              > li {
                padding: 0 $row_padding;
                border-right: 1px solid $border_general;
                a {
                  font-size: 16px;
                  color: $color_text_title;
                  text-transform: uppercase;
                  font-weight: $font_weight_bold;
                  border-radius: 0;
                  margin-bottom: 2px;
                  border: 0;
                  &:hover {
                    border-bottom-color: $border_general !important;
                  }
                }
                &.active a {
                  color: $color_hover_general;
                  border-top: 0;
                  border-left: 0;
                  border-right: 0;
                  background: transparent;
                }
                &:hover a {
                  background: transparent;
                  color: $color_hover_general;
                  border-top: 0;
                  border-left: 0;
                }
              }
            }
          }
          .tabs-content {
            padding: 50px;
            @media(max-width: 767px) {
              padding: $row_padding;
            }
            iframe {
              width: 100%;
              margin-bottom: 20px;
            }
            .spr-form-review-rating {
              a {
                color: $color_icon_spr;
              }
            }
            input.spr-button {
              background: $bkg_button;
              color: $color_text_button;
              border: 1px solid $color_border_button;
              &:hover {
                background: $bkg_button_hover;
                color: $color_text_button_hover;
                border: 1px solid $color_border_button_hover;
              }
            }
            .spr-icon-star-empty {
              color: $color_icon_spr;
            }
          }
          #shopify-product-reviews {
            margin: 0;
            .spr-container {
              padding: 0;
              border: none;
              .spr-icon {
                font-size: 100%;
                color: $color_icon_spr;
              }
              .spr-summary-caption, label {
                color: $color_text_title;
              }
              .spr-summary-actions{
                a {
                  @include button_style($height_button, $color_text_button, $color_border_button, $bkg_button);
                  &:hover {
                    @include button_style_hover($color_text_button_hover, $color_border_button_hover, $bkg_button_hover);
                  }
                }
              }
              .spr-review-header{
                .spr-review-header-starratings{
                  margin-bottom: 1em;
                }
              }
              .spr-review-footer{
                .spr-review-reportreview{
                  text-transform: uppercase;
                  color: $color_text_title;
                }
              }
            }
          }
        }
        .related-products {
          @include inline-block();
          width: 100%;
          .rp-slider {
            margin-left: -$row_padding;
            margin-right: -$row_padding;
            width: auto;
            @media(max-width: 767px) {
              margin-left: 0;
              margin-right: 0;
            }
            .owl-wrapper-outer {
              .owl-item {
                .product-item-wrapper {
                  border-right: 0;
                  margin-bottom: 0;
                  .row-container {
                    margin-bottom: 0;
                    .row-right {
                      padding-bottom: 0;
                      .list-mode-description, 
                      .grid-mode-description  {
                        display: none;
                      }
                      .hover-mask {
                        .inner-mask {
                          form {
                            width: auto;
                            margin-bottom: 2px;
                            button.btn{
                              padding: 0 10px;
                            }
                          }
                        }
                      }
                    }
                  }		
                }
              }
            }
          }
          &:hover {
            .owl-buttons{
              >div{
                @include opacity(1,100);
              }
            }
          }
        }
      }
    }
  }
}
/*End Detail product*/

/*Quickshop*/
#quick-shop-modal {
  .modal-content {
    padding-top: 30px;
    z-index: 999;
    .modal-header {
      padding: 0px;
      position: absolute;
      top: 10px;
      right: 10px;
      width: 30px;
      height: 30px;
      border: 2px solid #000;
      opacity: 1;
      border-radius: 50%;
      text-align: center;
      line-height: 20px;
      .close {
        color: #000;
        @include opacity(1,100);
        height: 100%;
        width: 100%;
        text-align: center;
        line-height: 28px;
      }
    }
    .modal-body {
      .product-information {
        #quick-shop-container {
          .description {
            color: $color_text_title;
          }
          #quick-shop-product-actions {
            .detail-price {
              font-size: 40px;
              line-height: 40px;
              font-family: $font_general;
              color: $color_text_heading;
              .price_compare {
                font-size: 20px
              }
              .price_sale {
                float: left;
              }
            }
            .quantity-wrapper {
              width: 165px;
              margin-top: 20px;
              margin-bottom: 20px;
              .wrapper-title {
                display: none;
              }
              .wrapper {
                height: 40px;
                border: 1px solid $border_general;
                span {
                  height: 39px;
                  line-height: 38px;
                  padding: 0 15px;
                  cursor: pointer;
                  &.qty-down {
                    float: left;
                    border-right: 1px solid $border_general;
                  }
                  &.qty-up {
                    float: right;
                    border-left: 1px solid $border_general;
                  }
                }
                input {
                  height: 38px;
                  line-height: 37px;
                  width: 79px;
                  border: none;
                  box-shadow: none;
                  text-align: center;
                }
              }
            }
            #quick-shop-variants-container {
              .selector-wrapper {
                margin-bottom: 15px;
                text-align: left;
                float: left;
                display: block;
                width: 100%;
                label {
                  font-weight: $font_weight_normal;
                  font-family: $font_heading;
                  color: $color_text_title;
                  width: 100px;
                  float: left;
                  line-height: 36px;
                }
                .single-option-selector {
                  height: 30px;
                  line-height: 30px;
                  width: 100px;
                  padding: 0 10px;
                }
              }
            }
            .others-bottom {
              display: block;
              float: left;
              input.btn {
                text-transform: uppercase;
                padding: 0 60px;
                border-radius: 5px;
                color: $color_text_button;
                border: 1px solid $color_border_button;
                background: $bkg_button;
                height: 40px;
                line-height: 40px;
                &:hover {
                  color: $color_text_button_hover;
                  border-color: $color_border_button_hover;
                  background: $bkg_button_hover;
                }
              }
            }
          }
        }
      }
      .product-image-wrapper {
        .product-image-thumb {
          margin-top: 30px;
          .qs-vertical-slider{
            .owl-wrapper-outer{
              .owl-wrapper{
                >div {
                  .image-thumb {
                    display: block;
                    padding: 0 5px;
                  }
                }
              }
            }
          }
          .owl-buttons {
            >div{
              width: 20px;
              height: 20px;
              line-height: 20px;
              margin-top: -10px;
              i.fa{
                font-size: 13px;
                line-height: 20px;
              }
            }
          }
        }
      }
    }
  }
  iframe {
    width: 100%;
  }
} 
/*End Quickshop*/

/*Search*/
.search_pager_wrapper{
  @include inline-block();
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  @media(max-width: 767px) {
    margin-left: 0;
    margin-right: 0;
  }
}
.search-page{
  .input-group{
    text-align: center;
  }
}

/*Shopping cart*/
.cart-heading {
  .cart-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .cart-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.cart-content {
  .cart-wrapper {
    .cart-inner {
      background: $shop_bg_color;
      padding: 0;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      #cart {
        .cart-form {
          margin-bottom: 20px;
          .image {
            text-align: left;
            padding-left: 20px;
            .product_name {
              @include inline-block();
              padding: 20px;
              a {
                color: $color_text_heading;
                p{
                  color: $color_text_heading;
                }
                &:hover {
                  color: $color_hover_general;
                  p{
                    color: $color_hover_general;
                  }
                }
              }
            }
            .product_image {
              @include inline-block();
              float: left;
            }
          }
          tr.summary {
            text-align: right;
            td.price {
              text-align: left;
              padding-left: 40px;
              border-right: 0;
              color: $color_hover_general;
            }
            .total_text {
              text-align: right;
              background: $bkg_breadcrumb;
            }
          }
          td {
            color: $color_text_heading;
            text-align: center;
            &.image {
              padding-top: 30px;
              padding-bottom: 30px;
            }
            &.price {
              font-size: 18px;
              text-align: center;
            }
            &.total {
              span.money {
                font-size: 18px;
              }
            }
            &.remove {
              a {
                font-size: 20px;
              }
            }
          }
          .qty {
            text-align: center;
            input {
              height: 30px;
              line-height: 18px;
              width: 70px;
              border-radius: 5px;
              color: #000;
              text-align: center;
            }
          }
          .group-bottom {
            @include inline-block();
            width: 100%;
            margin-bottom: 35px;
            .group-checkout-input {
              padding-left: 0;
              .checkout-buttons {
                label {
                  font-weight: $font_weight_normal;
                  margin-bottom: 8px;
                  width: 100%;
                  float: left;
                  color: $color_text_title;
                }
                #note {
                  min-width: 510px;
                  min-height: 120px;
                  background-color: transparent;
                  border-radius: 5px;
                  box-shadow: none;
                }
              }
            }
            .cart-buttons {
              text-align: right;
              padding-right: 0;
              .buttons {
                input {
                  font-size: $font_size_general;
                  text-transform: uppercase;
                  border-radius: 0;
                  color: $color_text_button;
                  border: 1px solid $color_border_button;
                  background-color: $bkg_button;
                  margin-left: 5px;
                  margin-bottom: 5px;
                  &:hover {
                    color: $color_text_button_hover;
                    border: 1px solid $color_border_button_hover;
                    background-color: $bkg_button_hover;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
table {
  width: 100%;
  border-spacing: 0;
  border: 1px solid $border_general;
  margin-bottom: 30px;
  thead {
    th {
      color: $color_text_title;
      padding: 10px;
      padding-left: 20px;
      border-bottom: 1px solid $border_general;
      border-right: 1px solid $border_general;
      text-align: center;
      text-transform: uppercase;
      font-size: 16px;
      background-color: transparent;
      &:first-child {
        border-left: 1px solid $border_general;
      }
      &:last-child {
        border-right: 1px solid $border_general;
      }
    }
  }
  tbody {
    td {
      padding: 10px;
      border-bottom: 1px solid $border_general;
      text-align: left;
      border-right: 1px solid $border_general;
      &.remove {
        text-align: center;
      }
    }
  }
  tfoot {
    td {
      display: grid;
      padding: 10px;
      border-bottom: 1px solid $border_general;
      text-align: left;
      border-right: 1px solid $border_general;
    }
  }
}
#cart {
  #cartform {
    @media(max-width: 767px) {
      table {
        thead {
          display: none;
        }
        td {
          width: 100%;
          float: left;
          display: block;
          height: auto;
          padding-left: 120px;
          padding-top: 0;
          padding-bottom: 0;
          position: relative;
          text-align: left;
          min-height: 70px;
          &:before {
            height: 100%;
            background-color: $shop_bg_color;
            content: '';
            position: absolute;
            left: 0;
            width: 100px;
            overflow: hidden;
          }
          &:after {
            height: 20px;
            top: 50%;
            margin-top: -10px;
            line-height: 20px;
            text-align: center;
            font-weight: bold;
            text-transform: uppercase;
            position: absolute;
            left: 0;
            width: 100px;
            overflow: hidden;
          }
          &.image {
            .product_image {
              margin-top: 20px;
              margin-bottom: 20px;
              display: block;
              width: 100%;
            }
            .product_name {
              display: block;
              width: 100%;
              padding: 0;
            }
            &:after {
              content: 'Images';
            }
          }
          &.price {
            &:after {
              content: 'Price';
            }
            span.money {
              margin-top: 20px;
              display: block;
            }
          }
          &.qty {
            .quantity-wrapper {
              margin-top: 20px;
              display: block;
            }
            &:after {
              content: 'Quantity';
            }
          }
          &.total {
            &:after {
              content: 'Total';
            }
            span.money {
              margin-top: 20px;
              display: block;
            }
          }
          &.remove {
            &:after {
              content: 'Remove';
            }
            a.cart {
              margin-top: 20px;
              display: block;
            }
          }
        }
        tr.summary {
          td.total_text {
            display: none;
          }
        }
      }
    }
  }
}
/*End Shopping cart*/

/*About us*/
.page-heading {
  .page-heading-wrapper{
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .page-heading-inner{
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 10px;
        padding-top: 10px;
      }
    }
  }
}
.page-content{
  .main-content{
    .content-text{
      @include inline-block();
      >div {
        margin-bottom: 2*$row_padding;
        padding-left: 0;
        padding-right: 0;
        .title{
          font-size: 30px;
          color: $color_text_heading;
          font-weight: $font_weight_bold;
          margin-top: 25px;
          margin-bottom: 33px;
        }
        .content {
          color: $color_text_heading;
          text-align: justify;
          @media(max-width: 767px) {
            margin-bottom: 2*$row_padding;
          }
        }

      }
    }
    .content-staff{
      &:hover {
        .owl-buttons{
          >div{
            @include opacity(1,100);
          }
        }
      }
      .staff-element{
        padding-left: $row_padding;
        padding-right: $row_padding;
        .staff-avatar{
          img {
            width: 100%;
            &:hover {
              @include opacity(0.5,50);
            }
          }
        }
        .staff-name{
          font-size: 20px;
          text-transform: uppercase;
          color: $color_text_heading;
          text-align: center;
          font-weight: $font_weight_bold;
          margin-top: 20px;
        }
        .staff-job {
          font-size: 16px;
          color: $color_text_title;
          text-align: center;
          margin-top: 5px;
        }
        ul.staff-links{
          @include display-flexbox();
          @include justify-content(center);
          border: 1px solid $border_general;
          height: 40px;
          line-height: 40px;
          margin-top: 18px;
          >li{
            padding: 0 $row_padding;
            a{
              font-size: 20px;
              color: $color_text_title;
              &:hover {
                color: $color_hover_general;
              }
            }
          }
        }
      }
    }
  }
}
/*End About us*/

/*FAQ page*/
.content-faqs{
  @media(max-width: 767px) {
    padding-left: $row_padding;
    padding-right: $row_padding;
  }
}

/*Lookbook page*/
.content-lookbook {
  @include inline-block();
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  >div{
    margin-bottom: 2*$row_padding;
    &:last-child {
      margin-bottom: 0;
    }
    a{
      display: block;
      @include effect_banner();
      img {
        width: 100%;
      }
    }
    .lb-element{
      &+ .lb-element{
        @media(max-width: 767px) {
          margin-top: $row_padding;
        }
      }
    }
  }
}
.fb-next span {
  background-position: 0 -70px;
}
.fb-prev span{
  background-position: 0 -35px;
}
/*End Lookbook page*/
/*Blog*/
.blog-heading {
  .blog-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .blog-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.sidebar {
  padding-left: 0;
  @media(max-width: 767px) {
    padding-right: 0;
    clear: both;
  }
  > div {
    padding: 0;
    margin-bottom: 30px;
    &.sb-sidebar-banner {
      padding: 0;
    }
    img {
      @include transition($transition-base);
    }
    &:hover {
      img {
        @include opacity(0.5,50);
      }
    }
    .sidebar-title {
      margin-bottom: 20px;
      background-color: $bkg_title;
      padding: 0;
      text-transform: uppercase;
      font-size: 20px;
      color: $color_text_heading;
    }
    .ra-item {
      border-bottom: 1px solid $border_general;
      padding-bottom: 25px;
      &+ .ra-item {
        padding: 25px 0;
      }
      h5 {
        margin-bottom: 5px;
        a {
          font-size: 16px;
          text-transform: capitalize;
          color: $color_text_title;
          font-weight: $font_weight_bold;
          font-family: $font_general;
          @include transition($transition-base);
          &:hover {
            color: $color_hover_general;
          }
        }
      }
      .article-info {
        margin: 0 0 5px;
        line-height: 1.44em;
        color: $color_text_general;
        >li {
          color: $color_text_title;
        }
      }
      &:last-child {
        padding-bottom: 0;
        border-bottom: 0;
      }
    }
    ul.tags {
      > li {
        a {

        }
      }
    }
    img {
      width: 100%;
    }
  }
}
$color_text_blog: #232323;
.blog-content {
  .blog-wrapper {
    .blog-inner {
      #blog {
        @include inline-block();
        width: 100%;
        background: $shop_bg_color;
        @media(max-width: 767px) {
          padding-left: $row_padding;
          padding-right: $row_padding;
        }
      }
    }
  }
}
.articles,
.article {
  padding-right: 0;
  float: right;
  @media(max-width: 767px) {
    float: none;
    padding-left: 0;
  }
  .group-articles{
    @include inline-block();
    margin-right: -$row_padding;
    margin-left: -$row_padding;
  }
  .group-blog-title {
    .article-name {
      font-size: 20px;
      color: $color_text_blog;
      margin-bottom: 5px;
      line-height: 20px;
      a {
        color: $color_text_blog;
        @include transition($transition-base);
        &:hover {
          color: $color_hover_general;
        }
      }
    }
  }
  .article-name{
    a{
      font-size: 20px;
      text-transform: initial;
      font-weight: $font_weight_bold;
    }
  }
  .article-info{
    margin: 10px 0px 20px;
    border-bottom: 1px solid $border_general;
    padding-bottom: 20px;
  }
  .article-content{
    color: $color_text_blog;
    text-align: justify;
  }
  .article-post-action {
    @include inline-block();
    width: 100%;
    text-align: left;
    margin-top: 20px;
    a {
      color: $color_text_button;
      border: 1px solid $color_border_button;
      background: $bkg_button;
      text-transform: uppercase;
      height: 40px;
      line-height: 40px;
      padding: 0 25px;
      @include inline-block();
      &:hover {
        color: $color_text_button_hover;
        border-color: $color_border_button_hover;
        background: $bkg_button_hover;
      }
    }
  }
  .article-tags{
    margin-top: 20px;
    border-bottom: 1px solid $border_general;
    padding-bottom: 35px;
    span {
      font-size: 20px;
      color: $color_text_blog;
      font-weight: $font_weight_bold;
    }
  }
  .top1-article{
    margin-bottom: $margin_distance;
    @media(max-width: 767px) {
      margin-bottom: $margin_distance_mobile;
    }
  }
}
.article-cmt, 
.article-author {
  font-size: 13px;
  color: #8b8b8b;
  font-weight: $font_weight_normal;
  text-transform: lowercase;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.group-blog-date {
  .article-date {
    p {
      position: absolute;
      top: 0;
      left: 0;
      font-size: 26px;
      line-height: 26px;
      color: #fff;
      font-weight: $font-weight_bold;
      background-color: #000;
      width: 70px;
      height: 70px;
      border-radius: 50%;
      text-align: center;
      vertical-align: middle;
      padding-top: 12px;
      padding-bottom: 12px;
      margin-left: 35px;
      margin-top: 20px;
      @include opacity(0.8,80);
      z-index: 8;
      small {
        display: block;
        font-size: $font_size_general;
        text-transform: uppercase;
      }
    }
  }
}
/*End Blog*/

/*Article*/
.article-heading {
  .article-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .article-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.article-content {
  .article-wrapper {
    .article-inner {
      @include inline-block();
      width: 100%;
      background: $shop_bg_color;
      padding: 0;
      @media(max-width: 767px){
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      .article {
        .comments {
          margin-top: 26px;
          margin-bottom: 26px;
          @include inline-block();
          width: 100%;
          .comment_form {
            .comment-title {
              margin-bottom: 14px;
              font-size: 20px;
              text-transform: initial;
            }
            label {
              color: $color_text_blog;
              margin-bottom: 6px;
            }
            input[type="text"] {
              height: 40px;
              line-height: 40px;
              width: 50%;
              display: block;
              box-shadow: none;
              background-color: transparent; 
              margin-bottom: 13px;
            }
            textarea {
              width: 100%;
              display: block;
              height: 145px;
              box-shadow: none;
              background-color: transparent;
            }
            #comment-submit {
              height: 40px;
              line-height: 40px;
              text-transform: uppercase;
              font-size: $font_size_general;
              color: $color_text_button1;
              border: 1px solid $color_border_button1;
              background: $bkg_button1;
              margin-top: 20px;
              float: right;
              @include border_radius(0);
              &:hover {
                color: $color_text_button1_hover;
                border: 1px solid $color_border_button1_hover;
                background: $bkg_button1_hover;
              }
            }
          }
          .comment-title {
            margin-bottom: 35px;
          }
          .comment {
            border: 1px solid $border_general;
            border-radius: 5px;
            padding: 20px 20px 0;
            margin-bottom: 40px;
          }
        }
        .article_post {
          margin-bottom: 20px;
        }
      }
    }
  }
}
/*End Article*/

/*Account*/
.login-heading {
  .login-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .login-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.login-content {
  .login-content-wrapper {
    .login-content-inner {
      background: $shop_bg_color;
      padding-bottom: 20px;
      #customer_login {
        width: 50%;
        padding: 0 $row_padding 50px;
        position: relative;
        label {
          width: 100%;
          padding: 0;
          display: block;
          font-weight: normal;
          text-align: left;
          margin-bottom: 8px;
          color: $color_text_title;
          font-size: 100%;
          line-height: 14px;
        }
        input.text {
          margin-bottom: 18px;
          height: 40px;
          width: 100%;
          border: 1px solid $border_general;
          padding: 10px;
        }
        .errors {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          padding: 0 15px;
          margin-top: -20px;
          > ul {
            margin: 0 0 30px 0;
            color: $color_hover_general;
          }
        }
        .action_bottom {
          margin-top: 10px;
          .btn {
            text-transform: uppercase;
            color: $color_text_button1;
            background: $bkg_button1;
            border: 1px solid $color_border_button1;
            &:hover {
              color: $color_text_button1_hover;
              background: $bkg_button1_hover;
              border: 1px solid $color_border_button1_hover;
            }
          }
        }
      }
      #recover-password {
        padding: 0;
        @media(max-width: 767px) {
          padding-left: $row_padding;
          padding-right: $row_padding;
        }
        form {
          width: 50%;
          label {
            width: 100%;
            padding: 0;
            display: block;
            font-weight: normal;
            text-align: left;
            margin-bottom: 8px;
            color: $color_text_title;
            font-size: 100%;
            line-height: 14px;
          }
          input.text {
            margin-bottom: 18px;
            height: 40px;
            width: 100%;
            border: 1px solid $border_general;
            padding: 10px;
          }
          .action_bottom {
            .btn {
              text-transform: uppercase;
              color: $color_text_button1;
              background: $bkg_button1;
              border: 1px solid $color_border_button1;
              &:hover {
                color: $color_text_button1_hover;
                background: $bkg_button1_hover;
                border: 1px solid $color_border_button1_hover;
              }
            }
          }
        }
      }
    }
  }
}
.errors ul {
  color: $color_hover_general;
}
#add_address {
  margin-top: 50px;
}
.register-heading {
  .register-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .register-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.register-content {
  .register-wrapper {
    .register-inner {
      background: $shop_bg_color;
      padding: 0;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      #register {
        width: 50%;
        padding-bottom: 50px;
        @media(max-width: 767px) {
          width: 100%;
        }
        label {
          width: 100%;
          padding: 0;
          display: block;
          font-weight: normal;
          text-align: left;
          margin-bottom: 8px;
          color: $color_text_title;
          font-size: 100%;
          line-height: 14px;
        }
        input.text {
          margin-bottom: 18px;
          height: 40px;
          width: 100%;
          border: 1px solid $border_general;
          padding: 10px;
        }
        .action_bottom {
          color: $color_text_general;
          .btn {
            text-transform: uppercase;
            color: $color_text_button;
            background: $bkg_button;
            border: 1px solid $color_border_button;
            &:hover {
              color: $color_text_button_hover;
              background: $bkg_button_hover;
              border: 1px solid $color_border_button_hover;
            }
          }
        }
      }
    }
  }
}
.account-heading {
  .account-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .account-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.account-content {
  .account-content-wrapper {
    .account-content-inner {
      display: block;
      float: left;
      width: 100%;
      padding: 50px 0;
      background: $shop_bg_color;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      #customer-account {
        @include inline-block();
        width: 100%;
        #customer_orders {
          padding-left: 0;
        }
        #customer_sidebar {
          padding-right: 0;
          .address {
            display: block;
            line-height: 46px;
          }
        }
      }
    }
  }
}
.address-heading {
  .address-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .address-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.address-content {
  .address-content-wrapper {
    .address-content-inner {
      @include inline-block();
      width: 100%;
      padding: 50px 0;
      background: $shop_bg_color;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      form {
        width: 50%;
        .h2 {
          color: #fff;
        }
        label {
          width: 100%;
          padding: 0;
          display: block;
          font-weight: normal;
          text-align: left;
          margin-bottom: 8px;
          color: $color_text_title;
          font-size: $font_size_general;
          line-height: $font_size_general;
          float: left;
        }
        input[type="text"],
        input[type="tel"] {
          margin-bottom: 18px;
          height: 40px;
          width: 100%;
          border: 1px solid $border_general;
          padding: 10px;
        }
        input[type="checkbox"],
        #address_default_address_new {
          @include inline-block();
          float: left;
          margin-top: 0;
        }
        label[for="address_default_address_new"]{
          @include inline-block();
          width: auto;
          padding-left: 10px;
          margin-bottom: 20px;
        }
        input[type="submit"]{
          clear: both;
          display: block;
          margin-bottom: 10px;
        }
        button {
          color: $color_text_button;
          border-color: $color_border_button;
          background: $bkg_button;
          padding: 0 20px;
          height: 36px;
          line-height: 36px;
          @include border_radius(5px);
          @include transition($transition-base);
          box-shadow: none;
          &:hover {
            color: $color_text_button_hover;
            border-color: $color_border_button_hover;
            background: $bkg_button_hover;
          }
        }
        select {
          width: 100%;
          height: 40px;
          line-height: 40px;
          border: 1px solid $border_general;
          margin-bottom: 18px;
        }
        .action_bottom {
          margin-top: 20px;
          .btn {
            text-transform: uppercase;
            color: $color_text_button1;
            background: $bkg_button1;
            border: 1px solid $color_border_button1;
            &:hover {
              color: $color_text_button1_hover;
              background: $bkg_button1_hover;
              border: 1px solid $color_border_button1_hover;
            }
          }
        }
        .customer_address{
          label {
            @include inline-block();
            width: auto;
            padding-left: 10px;
            margin-bottom: 20px;
          }
        }
      }
      a.add-new-address {
        padding: 10px 20px;
        color: $color_text_button1;
        border: 1px solid $color_border_button1;
        background: $bkg_button1;
        text-transform: uppercase;
        border-radius: 5px;
        &:hover {
          color: $color_text_button1_hover;
          border: 1px solid $color_border_button1_hover;
          background: $bkg_button1_hover;
        }
      }
      .address {
        >p{
          margin-top: 10px;
        }
      }
    }
  }
}
#customer-addresses {
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  .edit_address {
    padding: 20px;
    label {
      width: 100%;
      padding: 0;
      display: block;
      font-weight: normal;
      text-align: left;
      margin-bottom: 8px;
      color: $color_text_title;
      font-size: $font_size_general;
      line-height: $font_size_general;
      float: left;
    }
    input[type="text"] {
      margin-bottom: 18px;
      height: 40px;
      width: 100%;
      border: 1px solid $border_general;
      padding: 10px;
    }
    select {
      width: 100%;
      height: 40px;
      line-height: 40px;
      border: 1px solid $border_general;
    }
    .action_bottom {
      margin-top: 20px;
      .btn {
        text-transform: uppercase;
        color: $color_text_button1;
        background: $bkg_button1;
        border: 1px solid $color_border_button1;
        &:hover {
          color: $color_text_button1_hover;
          background: $bkg_button1_hover;
          border: 1px solid $color_border_button1_hover;
        }
      }
    }
  }
}
.address_table {
  width: 100%;
  float: left;
}
.group-form-address {
  width: 100%;
  float: left;
  > div {
    padding-left: 0;
  }
}
#address_tables {
  .address_table {
    margin-bottom: 30px;
    border: 1px solid $border_general;
    .group-title {
      position: relative;
      border-bottom: 1px solid $border_general;
      height: 40px;
      background-color: #e4e4e4;
      .address_title {
        margin: 0;
        margin-left: 20px;
        line-height: 40px;
        text-transform: uppercase;
        font-size: 16px;
        font-weight: $font_weight_bold;
      }
      .address_actions {
        position: absolute;
        top: 0;
        right: 20px;
        line-height: 40px;
        span {
          margin-right: 10px;
        }
        .action_edit {
          a {
            color: $color_hover_general;
          }
        }
        .action_delete {
          a {
            color: #f00;
          }
        }
      }
    }
  }
  .view_address {
    padding: 20px;
  }
}
#view_address,
button.btn.address-new-toggle,
button.btn.search__submit{
  color: $color_text_button1;
  border: 1px solid $color_border_button1;
  background: $bkg_button1;
  text-transform: uppercase;
  border-radius: 5px;
  height: $height_button;
  line-height: $height_button;
  @include inline-block;
  padding: 0 $row_padding;
  &:hover {
    color: $color_text_button1_hover;
    border: 1px solid $color_border_button1_hover;
    background: $bkg_button1_hover;
  }
}
.customer-heading {
  .customer-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .customer-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.customer-content {
  #customer-order {
    margin: 50px 0;
    > div:first-child {
      display: block;
      width: 100%;
      float: left;
    }
  }
}
/*End Account*/

/*Wishlist*/
.wishlist-heading {
  .wishlist-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .wishlist-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.wishlist-content {
  .wishlist-content-wrapper {
    #wish-list {
      @include inline-block();
      width: 100%;
      padding: 50px 0;
      background: $shop_bg_color;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      .table-cart {
        margin-left: -$row_padding;
        margin-right: -$row_padding;
        a.btn {
          text-transform: uppercase;
          color: $color_text_button1;
          background: $bkg_button1;
          border: 1px solid $color_border_button1;
          line-height: 36px;
          margin-top: 10px;
          &:hover {
            color: $color_text_button1_hover;
            background: $bkg_button1_hover;
            border: 1px solid $color_border_button1_hover;
          }
        }
      }
    }
  }
}
.wishlist-item {
  td.action {
    text-align: center;
    button {
      border-radius: 50%;
      box-shadow: none;
      border: none;
      width: 25px;
      height: 25px;
      &:hover {
        i.fa {
          color: $color_hover_general;
        }
      }
    }
  }
  td.title-1, td:last-child {
    text-align: center;
    color: $color_text_general;
  }
}
.wishlist-page {
  .title-under{
    text-align: center;
    margin: $row_padding 0;
  }
}
.wishlist-added { display:none;}
.wishlist-loading{
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 9999;
  display:none;
}
.wishlist-overlap{
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
  opacity: .5; 
  display:none;
}
/*End Wishlist*/

/*Contact*/
.blcontactog-heading {
  .contact-heading-wrapper {
    @include background_breadcrumb();
    @media(max-width: 767px) {
      height: auto;
      line-height: $line_height_general;
    }
    .contact-heading-inner {
      @include height_breadcrumb();
      @media(max-width: 767px) {
        height: auto;
        line-height: $line_height_general;
        padding-bottom: 20px;
      }
    }
  }
}
.contact-content {
  .contact-inner {
    #page {
      @include inline-block();
      width: 100%;
      background: $shop_bg_color;
      padding: 0;
      @media(max-width: 767px) {
        padding-left: $row_padding;
        padding-right: $row_padding;
      }
      .google-maps-wrapper {
        .google-maps-inner {
          width: 100%;
          float: left;
          #contact_map {
            min-height: 500px;
          }
        }
      }
      .page-with-contact-form {
        margin-top: 50px;
        @include inline-block();
        width: 100%;
        @media(max-width: 767px) {
          margin-top: $margin_distance_mobile;
        }
        .contact-page-content {
          padding-left: 0;
          padding-right: 0;
          margin-bottom: 45px;
          .page-form {
            padding-left: 0;
            padding-right: 0;
            #contact_form {
              margin-left: -$row_padding;
              margin-right: -$row_padding;
              #contactFormWrapper {
                margin-top: 20px;
                @include inline-block();
                width: 100%;
                label {
                  font-weight: $font_weight_normal;
                  color: $color_text_heading;
                  margin-bottom: 5px;
                }
                input {
                  width: 100%;
                  height: 40px;
                  line-height: 40px;
                  border-radius: 0;
                  border: 1px solid $border_general;
                }
                textarea {
                  width: 100%;
                  box-shadow: none;
                  border-radius: 0;
                  height: 130px;
                  border: 1px solid $border_general;
                }
                p.contact_button {
                  margin-top: 30px;
                  input {
                    width: 100%;
                    height: 40px;
                    line-height: 40px;
                    color: $color_text_button1;
                    border: 1px solid $color_border_button1;
                    background: $bkg_button1;
                    text-transform: uppercase;
                    @include border_radius(0);
                    &:hover {
                      color: $color_text_button1_hover;
                      border: 1px solid $color_border_button1_hover;
                      background: $bkg_button1_hover;
                    }
                  }
                }
                p {
                  margin-bottom: 14px;
                }
              }
            }
          }
          .page-input {
            padding-right: 0;
            @media(max-width: 767px) {
              padding-left:0;
              margin-top: 30px;
            }
            p {
              font-weight: $font_weight_normal;
              color: $color_text_title;
              margin-top: 25px;
            }
            .contact-action {
              margin: 0;
              li {
                list-style: none;
                font-weight: $font_weight_normal;
                color: $color_text_title;
                margin: 5px 0;
                span {
                  i.fa {
                    color: #fff;
                    font-size: 10px;
                    line-height: 30px;
                    &.fa-circle {
                      color: $color_hover_general;
                      font-size: 34px;
                      line-height: 34px;
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
}
/*End Contact*/

/*----------End Subpages content----------*/

/*----------Footer----------*/
$color_heading_newsletter: $color_text_heading;
$width_input_newsletter: 400px;
$height_input_newsletter: 46px;
$height_newsletter: 100px;
$color_text_footer: #000;
$width_icon_social: 33px;
$height_copyright: 50px;
$color_text_copyright: #818181;
.site-footer {
  padding-top: 0;
  color: $color_text_footer;
  font-size: $font_size_general;
  font-family: $font_general;
  position: relative;
  background: $bkg_footer;
  @media(max-width: 767px) {
    padding-top: $margin_distance_mobile;
  }
  i.fa{
    color: $color_heading_newsletter;
  }
  a{
    font-weight: $font_weight_normal;
  }
  .footer-wrapper{
    border: 1px solid $border_general;
    .footer_top-block{
      .fi-newsletter-group{
        @include display-flexbox();
        @include justify-content(space-between);
        @include align-items(center);
        height: $height_newsletter;
        padding: 0 40px;
        @media(max-width: 767px) {
          @include inline-block();
          width: 100%;
          height: auto;
          padding: 0 15px;
          margin-bottom: 2*$row_padding;
        }
        .footer-title{
          .newsletter_heading{
            text-transform: initial;
            font-size: 18px;
            line-height: $height_input_newsletter;
            i.fa{
              font-size: 24px;
              padding-left: 15px;
              vertical-align: middle;
            }
          }
        }
        .newsletter-form{
          input {
            width: $width_input_newsletter;
            height: $height_input_newsletter;
            line-height: $height_input_newsletter;
            border: 2px solid $color_text_heading;
            @include border_radius(5px);
            padding: 0 $row_padding;
            @media(max-width: 1199px) {
              width: 200px;
            }
            @media(max-width: 767px) {
              width: calc(100% - 120px);
            }
          }
          .input-group {
            @include display-flexbox();
            @include justify-content(space-between);
          }
          button.newsletter__submit{
            font-size: 18px;
            text-transform: uppercase;
            background: transparent;
            color: $color_text_heading;
            border: none;
            font-weight: $font_weight_bold;
            height: $height_input_newsletter;
            line-height: $height_input_newsletter;
          }
        }
        .newsletter-subtitle{
          font-size: 16px;
          color: $color_text_copyright;
          font-style: italic;
          @media(max-width: 767px) {
            margin-top: 10px;
          }
        }
      }
    }
    .footer_info-block{
      .footer_info_wrapper{
        .footer_info_inner{
          .footer_inf-content{
            @include display-flexbox();
            @include justify-content(space-between);
            @include align-items(stretch);
            width: 100%;
            border-top: 1px solid $border_general;
            border-bottom: 1px solid $border_general;
            >div{
              border-right: 1px solid $border_general;
              padding: 36px;
              @media(max-width: 767px) {
                padding: $row_padding;
                border-bottom: 1px solid $border_general;
                border-right: 0;
                width: 100%;
                a{
                  img{
                    width: 100%;
                  }
                }
              }
              &:last-child {
                border-right: 0;
                @media(max-width: 767px) {
                  border-bottom: 0;
                }
              }
              .fi-follow-content{
                margin-top: 25px;
                >a{
                  width: $width_icon_social;
                  height: $width_icon_social;
                  @include inline-block();
                  line-height: $width_icon_social;
                  border: 1px solid $color_text_footer;
                  @include border_radius(5px);
                  margin-right: 5px;
                  span {
                    width: $width_icon_social;
                    height: $width_icon_social;
                    vertical-align: top;
                    i.fa{
                      width: $width_icon_social;
                      height: $width_icon_social;
                      line-height: $width_icon_social;
                    }
                  }
                  &:hover {
                    background: $bkg_button_hover;
                    border-color: $color_border_button_hover;
                    span {
                      i.fa{
                        color: $color_text_button_hover;
                      }
                    }
                  }
                }
              }
              .fi-contact-content{
                padding-left: 0;
                padding-right: 0;
                >div{
                  margin-bottom: 25px;
                  &:last-child {
                    margin-bottom: 0;
                  }
                  i.fa{
                    padding-right: 10px;
                  }
                }
              }
              &.fi-links{
                .fi-usefullinks{
                  @include inline-block();
                  margin-right: -$row_padding;
                  margin-left: -$row_padding;
                  ul{
                    >li{
                      margin-bottom: 15px;
                      a{
                        position: relative;
                        &:before {
                          content: '\f105 ';
                          position: absolute;
                          font-family: fontAwesome;
                          top: 0;
                          left: 0;
                        }
                        span {
                          padding-left: 20px;
                          @media(max-width: 1199px) {
                            padding-left: 10px;
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
    .copy-right{
      .copy-right-wrapper{
        .copy-right-inner{
          height: $height_copyright;
          line-height: $height_copyright;
          text-align: center;
          color: $color_text_copyright;
          @media(max-width: 767px) {
            height: auto;
            line-height: $line_height_general;
            padding-top: 10px;
            padding-bottom: 10px;
          }
          a{
            color: $color_text_copyright;
            &:hover {
              color: $color_hover_general;
            }
          }
        }
      }
    }
  }
  .footer-title{
    font-size: 18px;
    text-transform: uppercase;
    color: $color_text_heading;
    .title {
      font-size: 18px;
      margin-bottom: 25px;
    }
  }
}

/*----------End Footer----------*/

/*----------Update for Collection block----------*/
.collection-grid{
  @media(max-width: 767px) {
    text-align: center;
  }
  .grid {
    @include inline-block();
    margin-right: -$row_padding;
    margin-left: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    .grid__item{
      margin-bottom: $row_padding;
      .product {
        .details{
          text-align: center;
          margin-top: 20px;
        }
      }
    }
  }
}
/*----------End Update for Collection block----------*/

/*----------Update for Feature block----------*/
.featured-collection {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .grid--view-items {
    @include display-flexbox();
    @include flex-wrap(nowrap);
    @include justify-content(left);
    margin-left: -$row_padding;
    margin-right: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    >div{
      margin-bottom: 2*$row_padding;
      .row-container {
        padding-left: 0;
        padding-right: 0;
      }
    }
  }
  .button_collection {
    a {
      height: $height_button;
      line-height: $height_button;
      text-transform: uppercase;
    }
  }
}
/*----------End Update for Feature block----------*/

/*----------Update for Gallery block----------*/
.gallery-block {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .grid {
    margin-right: -$row_padding;
    margin-left: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    .image-bar__item {
      min-height: 390px;
    }
  }

}
/*----------End Update for Gallery block----------*/

/*----------Update for Logo block----------*/
.logo-listing{
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .logo-bar{
    @include display-flexbox();
    @include flex-wrap(nowrap);
    @include justify-content(left);
    margin-left: -$row_padding;
    margin-right: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    >div {
      margin-bottom: $row_padding;
    }
  }
}
/*----------End Update for Logo block----------*/

/*------------------Load more block------------------*/
.grid--view-items{
  margin-left: -$row_padding;
  margin-right: -$row_padding;
  @media(max-width: 767px) {
    margin-left: 0;
    margin-right: 0;
    .grid__item{
      width: 50% !important;
    }
  }
  #loadmore {
    @include display-flexbox();
    @include justify-content(left);
  }
  #loadMore {
    display: block;
    text-align: center;
    span {
      font-size: 16px;
      text-transform: uppercase;
      height: $height_button;
      line-height: $height_button;
      border: 1px solid $color_border_button;
      color: $color_text_button;
      background: $bkg_button;
      @include inline-block();
      padding: 0 $row_padding;
      @include transition($transition-base);
      &:hover {
        cursor: pointer;
        border-color: $color_border_button_hover;
        color: $color_text_button_hover;
        background: $bkg_button_hover;
      }
    }
  }
}

/*----------Product block----------*/
.product-single{
  @include display-flexbox();
	padding-top:110px;
  @media(max-width: 991px) {
    padding-left: $row_padding;
    padding-right: $row_padding;
  }
  @media(max-width: 1199px) {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .product-single__photos{
    .thumbnails-wrapper{
      >button {
        width: 30px;
        height: 30px;
        line-height: 30px;
        margin: 10px 0;
        padding: 0;
      }
    }
  }
  .product-single__descript{
    @include align-self(center);
    @media(max-width: 767px) {
      margin-top: 2*$row_padding;
    }
    .product-single__meta{
      .product-single__title {
        margin-top: 0;
        margin-bottom: 28px;
        a{
          color: $color_text_heading;
          font-size: 36px;
          text-transform: capitalize;
          font-weight: $font_weight_bold;
          &:hover {
            color: $color_hover_general;
          }
        }
      }
      .product-single__description {
        p{
          color: #333;
        }
        .video-wrapper{
          margin-top: $row_padding;
        }
      }
      .button.readmore{
        text-transform: uppercase;
        color: $color_text_heading;
        margin-top: 27px;
        display: block;
        i.fa {
          padding-left: 5px;
          font-size: 20px;
          vertical-align: middle;
        }
      }
      .purchase{
        display: none;
      }
      .product-single__price {
        font-size: 30px;
        margin: $row_padding 0;
        .product-price__sale{
          color: $color_hover_general;
        }
        .product-price__sale-label{
          display: none;
        }
      }
      label {
        color: $color_text_title;
        width: 100px;
      }
      select {
        width: 70px;
        color: $color_text_heading;
        padding: 0;
      }
      .product-form__item--quantity {
        input {
          width: 70px;
          margin-left: -4px;
        }
      }
      .selector-wrapper {
        margin-bottom: $row_padding;
      }
      .product-form__item--submit {
        margin: $row_padding 0;
      }
    }
  }
}
/*----------End Product block----------*/

/*----------Update for Map block----------*/
.maps-section {
  position:relative;
  height:650px;
  width:100%;
  overflow:hidden;
  @media only screen and (min-width: 750px) {
    height:500px;
  }
  .page-width {
    height:100%;
    padding-left: 55px;
    padding-right: 55px;
    max-width: 1200px;
    margin: 0 auto;
    @media(max-width: 767px) {
      padding-left: $row_padding;
      padding-right: $row_padding;
    }
  }
}
.map-section--load-error {
  height:auto;
  .map-section__overlay {
    position:static;
    transform:translateY(0);
  }
}
.map-section__overlay-wrapper {
  position:relative;
  text-align:center;
  height:100%
}
.map-section__overlay {
  position:relative;
  display:inline-block;
  background-color:#fff;
  padding:35px;
  margin-top:22px;
  width:100%;
  text-align:center;
  z-index:3;
  @media only screen and (min-width: 750px) {
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    margin-top:0;
    width:33.33333%;
  }
  .rte-setting{
    p{
      margin-bottom: 20px;
    }
  }
}
.map-section__link {
  display:block; 
  position:absolute; 
  top:0; 
  left:0; 
  width:100%; 
  height:100%; 
  z-index:2;
}
.map-section__container {
  position:absolute; 
  top:0; 
  left:0; 
  width:100%; 
  height:150%; 
  margin-bottom:-50%;
  @media only screen and (min-width: 750px) {
    width:130%;
    height:100%; 
    margin:0 -30% 0 0;
  }
}
/*----------End Update for Map block----------*/

/*----------Update for Testimonials block----------*/
.quotes-listing {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .quotes-wrapper {
    @media(max-width: 767px) {
      margin-left: $row_padding;
      margin-right: $row_padding;
    }
    i.fa{
      color: $color_text_title;
    }
    .quote_author{
      color: $color_text_title;
    }
  }
}
/*----------End Update for Testimonials block----------*/

/*----------Update for Text columns with image block----------*/
.text-column-with-image {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .grid {
    @include inline-block();
    margin-left: -$row_padding;
    margin-right: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    >div{
      margin-bottom: $row_padding;
    }
    .h4 {
      color: $color_text_title;
    }
  }
}
/*----------End Update for Text columns with image block----------*/

/*----------Update for Custom block----------*/
.custom-block {
  margin-top: $margin_distance;
  @media(max-width: 767px) {
    margin-top: $margin_distance_mobile;
  }
  .custom-content {
    @include inline-block();
    margin-left: -$row_padding;
    margin-right: -$row_padding;
    @media(max-width: 767px) {
      margin-left: 0;
      margin-right: 0;
    }
    >div{
      margin-bottom: $row_padding;
    }
    .custom__item {
      h1, h2, h3, h4, h5, h6 {
        color: $color_text_title;
      }
    }
  }
}
/*----------End Update for Custom block----------*/
