/*
Theme Name: MrTheme
Description: Custom Wordpress Theme
Author: Miguel J. Romero
Version: 1.1
*Required: mtheme.variables.css & mtheme.base.css
*/

/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------------- Header -----------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
header {
  overflow: visible;
  z-index: 1000;
}

header.header-content {
  min-height: 130px;
}

header .box-content,
header .header-logo {
  overflow: visible;
}

header .header-logo a {
  width: auto;
  height: auto;
  max-width: 140px;
  display: inline-block;
  overflow: hidden;
  margin: 0 auto;
}

header .header-logo a.header-logo-float {
  position: absolute;
  z-index: 1001;
  top: 0;
  left: 20px;
}

header a img {
  transform: scale(1);
}

header a:hover img {
  transform: scale(.8);
}

/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------------- Nav Menu ---------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
header .nav-content-menu {
  height: auto;
  position: relative;
  z-index: 1003;
}

header nav ul li {
  text-align: left;
  display: inline-block;
  position: relative;
  margin-bottom: 0;
}

header nav ul li a {
  display: inline-block;
  margin: 0;
  padding: 5px 10px;
  font-size: 14px;
  font-weight: normal;
  word-spacing: -1px;
  border-radius: 3px;
}

/*------- menu link call action -------*/
header nav>ul>li.menuimportant a {
  color: var(--LightColor) !important;
  background: var(--BrandColor);
  background-position: right center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 5px 10px !important;
}

header nav>ul>li.menuimportant a:hover {
  background: var(--DarkColor);
}

/*------- current link -------*/
header nav ul li.current-menu-item a {
  opacity: .5;
  cursor: default;
}

/*------- Define links colours -------*/
.box-content-light nav>ul>li>a {
  color: var(--DarkColor);
}

.box-content-light nav>ul>li>a:hover {
  color: var(--BrandColor);
}

.box-content-brand nav>ul>li>a,
.box-content-dark nav>ul>li>a {
  color: var(--LightColor);
}

.box-content-brand nav>ul>li>a:hover,
.box-content-brand nav>ul>li>a:hover {
  color: var(--SecondaryColor);
}

.box-content-brand nav>ul>li:last-child a {
  background: var(--DarkColor);
}

.box-content-brand nav>ul>li:last-child a:hover {
  background: var(--BrandColor);
}

@media (min-width: 720px) {

  nav,
  header,
  header .box-content {
    overflow: visible;
  }

  /*------- Hidden -------*/
  header span#nav-mobile {
    display: none;
  }

  header #nav-mobile-close {
    display: none;
  }

  header #nav-menu {
    display: block;
  }

  /*------------------------------------------------------*/
  /*---------------------- Sub menu ----------------------*/
  /*------------------------------------------------------*/
  /*-------- base --------*/
  header .sub-menu {
    display: none;
  }

  .sub-menu li {
    display: block;
    margin: 0;
  }

  /*-------- Add selector --------*/
  .menu-hidden-simple .menu>.menu-item-has-children {
    margin-right: 2px;
  }

  .menu-hidden-simple .menu>.menu-item-has-children a {
    padding-right: 22px;
  }

  .menu-hidden-simple .menu>.menu-item-has-children>a::after {
    font-family: "Genericons";
    content: "\f431";
    font-size: 20px;
    vertical-align: baseline;
    position: absolute;
    right: 0;
    bottom: 1px;
  }

  .menu-hidden-simple .menu>.menu-item-has-children:hover>a::after {
    bottom: -1px;
    transform: rotate(180deg);
  }

  /*------- Open Menu -------*/
  .menu-hidden-simple li:hover>.sub-menu {
    display: block;
  }

  /*----------------- Simple Hidden Menu -----------------*/
  .menu-hidden-simple .sub-menu {
    padding: 0 2px;
    position: absolute;
    width: 150px;
  }

  .menu-hidden-simple .menu-item-has-children>ul li ul {
    right: -150px;
    top: 0px;
  }

  .menu-hidden-simple .menu-item-has-children:last-child>ul li ul {
    right: 150px;
  }

  .menu-hidden-simple .sub-menu a {
    width: 100%;
    display: block;
    padding: 10px 12px;
    margin-bottom: 2px;
    font-size: 12px;
    color: var(--LightColor) !important;
    background-color: var(--DarkColor);
    border-left: 3px solid var(--BrandColor);
  }

  .menu-hidden-simple .sub-menu a:hover {
    color: var(--LightColor) !important;
    background-color: var(--BrandColor);
  }

  .menu-hidden-simple nav ul li.current-menu-item a:hover {
    background-color: var(--DarkColor);
  }

  .menu-hidden-simple .menu-item-has-children>a:hover {
    color: var(--DarkColor) !important;
    cursor: default;
  }

  .menu-hidden-simple .sub-menu>.menu-item-has-children>a:hover {
    color: var(--MediumColor) !important;
    background-color: var(--DarkColor);
    cursor: default;
  }
}

/*------------------------------------------------------*/
/*-------------------- Menu mobile ---------------------*/
/*------------------------------------------------------*/
@media(max-width: 720px) {
  header #nav-menu {
    display: none;
  }

  span#nav-mobile {
    width: 34px;
    height: 34px;
    overflow: hidden;
    clear: both;
    float: right;
  }

  span#nav-mobile i:hover {
    opacity: 0.5;
  }

  header.box-content-light nav>ul>li>a,
  header.box-content-brand nav>ul>li>a,
  header.box-content-dark nav>ul>li>a,
  header.box-content-light a,
  header.box-content-brand a,
  header.box-content-dark a {
    color: var(--DarkColor);
  }

  header.box-content-light nav>ul>li>a:hover,
  header.box-content-brand nav>ul>li>a:hover,
  header.box-content-brand nav>ul>li>a:hover,
  header.box-content-light a:hover,
  header.box-content-brand a:hover,
  header.box-content-brand a:hover {
    color: var(--BrandColor);
  }

  header nav ul li {
    display: block;
    margin: 5px auto;
    text-align: center;
  }

  header nav ul li a {
    font-size: 18px;
    padding: 2px 10px;
  }

  header nav ul li:last-child a,
  header nav ul li a:hover {
    background-image: none;
  }

  header .sub-menu {
    margin-bottom: 5px;
  }

  header .sub-menu li {
    margin: 5px auto;
  }

  header .sub-menu li a {
    font-size: 14px;
    padding: 0px 10px;
  }

  /*------- Menu mobile expand -------*/
  header .menu-mobile-expand nav {
    width: 100%;
    height: 100%;
    background: var(--LightColor);
    display: table;
    vertical-align: middle;
    overflow: hidden;
    clear: both;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 999;
  }

  header .menu-mobile-expand nav>ul {
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    clear: both;
    padding: 0;
  }

  header .menu-mobile-expand nav ul li {
    display: block;
    margin: 10px auto;
    text-align: center;
  }

  /*------- Menu mobile blind -------*/
  header .menu-mobile-blind span#nav-mobile {
    width: 100%;
  }

  header .menu-mobile-blind nav {
    display: block;
    overflow: hidden;
    clear: both;
  }

  header .menu-mobile-blind nav>ul {
    display: block;
    clear: both;
    padding: 0;
    padding-top: 10px;
  }

  header .menu-mobile-blind nav ul li {
    display: block;
    margin: 10px auto;
    text-align: center;
  }

  header .menu-mobile-blind .nav-menu {
    display: block;
  }

  header .menu-mobile-blind nav ul li a,
  header .menu-mobile-blind .sub-menu li a {
    display: block;
    padding: 0px 10px 8px;
    border-bottom: 1px solid var(--MediumColor);
  }

  /*------- Menu mobile slide -------*/
  header .menu-mobile-slide nav {
    width: 80%;
    height: 100%;
    background: var(--LightColor);
    overflow: hidden;
    clear: both;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 999;
  }

  header .menu-mobile-slide nav>ul {
    display: block;
    overflow: hidden;
    clear: both;
    padding: 20px;
    padding-top: 60px;
  }

  header .menu-mobile-slide nav ul li {
    display: block;
    margin: 10px auto;
    text-align: left;
  }

  header .menu-mobile-slide .nav-menu {
    display: block;
  }

  header .menu-mobile-slide nav ul li a,
  header .menu-mobile-slide .sub-menu li a {
    display: block;
    padding: 0px 10px 8px;
    border-bottom: 1px solid var(--MediumColor);
  }

  header .menu-mobile-slide .icon-close-float {
    top: 10px;
    right: auto;
    left: 30px;
    color: var(--MediumColor) !important;
  }
}

/*------- Icon Close -------*/
.icon-close-float {
  top: 20px;
  right: 30px;
}

/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------------- Footer ------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.footer-logo {
  max-width: 140px;
}

footer p {
  font-size: 12px;
  color: #ccc;
  margin-bottom: 5px;
}

footer ul li {
  display: inline-block;
  margin-bottom: 5px;
}

footer a {
  padding: 0 5px;
  font-size: 12px;
  font-weight: normal;
}

footer ul.menu ul.children {
  display: inline-block;
}

footer ul.menu ul.children a {
  font-size: 12px;
  font-style: italic;
}

footer ul.menu ul.children a::before {
  content: '>';
  margin-right: 3px;
}

/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------------- Social ------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.social-header li {
  height: 20px;
}

.social-link {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 5px;
  background-size: cover;
  background-repeat: no-repeat;
}

.social-link-small {
  width: 18px;
  height: 18px;
  margin: 0 2px;
}

.social-content li:last-child .social-link,
.social-content li:last-child .social-link-small {
  margin-right: 0px;
}

.social-content li:first-child .social-link,
.social-content li:first-child .social-link-small {
  margin-left: 0px;
}

.social-mail {
  background-image: url(../../images/social/mail.svg);
}

.social-facebook {
  background-image: url(../../images/social/facebook.svg);
}

.social-twitter {
  background-image: url(../../images/social/twitter.svg);
}

.social-instagram {
  background-image: url(../../images/social/instagram.svg);
}

.social-linked {
  background-image: url(../../images/social/linkedin.svg);
}

.social-tiktok {
  background-image: url(../../images/social/tiktok.svg);
}

@supports (-webkit-mask: url("")) or (mask: url("")) {
  .social-link {
    mask-size: cover;
    background: var(--LightColor);
  }

  .social-link:hover {
    background: var(--BrandColor);
  }

  .social-dark {
    background: var(--DarkColor);
  }

  .social-dark:hover {
    background: var(--BrandColor);
  }

  .social-brand {
    background: var(--BrandColor);
  }

  .social-brand:hover {
    background: var(--DarkColor);
  }

  .social-mail {
    -webkit-mask: url(../../images/social/mail.svg);
    mask: url(../../images/social/mail.svg);
  }

  .social-facebook {
    -webkit-mask: url(../../images/social/facebook.svg);
    mask: url(../../images/social/facebook.svg);
  }

  .social-twitter {
    -webkit-mask: url(../../images/social/twitter.svg);
    mask: url(../../images/social/twitter.svg);
  }

  .social-instagram {
    -webkit-mask: url(../../images/social/instagram.svg);
    mask: url(../../images/social/instagram.svg);
  }

  .social-linked {
    -webkit-mask: url(../../images/social/linkedin.svg);
    mask: url(../../images/social/linkedin.svg);
  }

  .social-tiktok {
    -webkit-mask: url(../../images/social/tiktok.svg);
    mask: url(../../images/social/tiktok.svg);
  }
}

/*-----------------------------------------------------------------------------------------------*/
/*---------------------------------------- Slider -----------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.logo-white {
  filter: contrast(0) brightness(100);
}

.logo-black {
  filter: contrast(0) brightness(0);
}

.logo-whiteblack {
  filter: grayscale(100%) invert(100%) brightness(1.1);
}

/*-------- Header & Menu HOMEPAGE --------*/
.home header.slider-add {
  position: absolute;
  background: transparent;
  border-color: transparent !important;
}

.home header.slider-add a img {
  filter: contrast(0) brightness(100);
}

.home header.slider-add i {
  color: var(--LightColor) !important;
}

.home header.slider-add #nav-mobile-close i {
  color: var(--DarkColor) !important;
}

@media (min-width: 720px) {

  .home header.slider-add .menu>ul>li>a,
  .home header.slider-add .menu>li>a,
  .home header.slider-add nav ul li.current-menu-item a,
  .home header.slider-add nav ul li.current-menu-item a:hover {
    color: var(--LightColor) !important;
  }

  .home header.slider-add .menu>ul>li>a:hover,
  .home header.slider-add .menu>li>a:hover {
    color: var(--BrandColor) !important;
  }

  .home header.slider-add .menu-item-has-children a::after {
    filter: contrast(0) brightness(100);
  }
}

.theme-slider-add {
  padding-top: 100px;
}

@media (max-width: 720px) {
  .theme-slider-add {
    padding-top: 160px;
  }
}

/*-------- Slider Big --------*/
.theme-slider,
.theme-slider-content {
  min-height: 700px;
}

.theme-slider h1 {
  text-shadow: 2px 2px 10px rgba(var(--LightColorRGB), .4);
}

.theme-slider p {
  letter-spacing: .5px;
}

@media (min-width: 720px) {
  .theme-slider p {
    margin: 0 auto;
  }
}

@media (max-width: 720px) {

  .theme-slider,
  .theme-slider-content {
    min-height: inherit;
  }

  .theme-slider h1 {
    font-size: 36px !important;
  }
}

/*-----------------------------------------------------------------------------------------------*/
/*------------------------------------- Lang Options --------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*-------- Lang --------*/
.lang {
  padding: 5px;
  padding-right: 15px;
  position: relative;
}

.lang::after {
  width: 12px;
  height: 12px;
  border-radius: 20px;
  vertical-align: baseline;
  position: absolute;
  right: 0;
  bottom: 7px;
  background-size: 12px 12px;
  content: "";
}

.lang-es::after {
  background-image: url(../../images/lang/icon-lang-es.png);
}

.lang-en::after {
  background-image: url(../../images/lang/icon-lang-en.png);
}

.lang-fr::after {
  background-image: url(../../images/lang/icon-lang-fr.png);
}

.lang-pt::after {
  background-image: url(../../images/lang/icon-lang-pt.png);
}

.lang-zh::after {
  background-image: url(../../images/lang/icon-lang-zh.png);
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- Breadcrumb ---------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#breadcrumb {
  padding: 10px 0;
  min-height: 37px;
}

#breadcrumb li {
  display: inline-block;
  margin-right: 5px;
  margin-bottom: 0;
}

#breadcrumb,
#breadcrumb a {
  color: var(--LightColor);
}

#breadcrumb a:hover {
  color: var(--DarkColor);
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- BASIC LIST FORMATS -------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*-------- LIST FAQS --------*/
.list-faq li {
  margin-bottom: 10px;
}

.list-faq li:last-child {
  margin-bottom: 0;
}

.list-faq li a {
  border: 1px solid var(--DarkColor);
  padding: 8px 15px;
  border-radius: 20px;
  display: inline-block;
}

.list-faq-dark li a {
  border-color: var(--LightColor);
}

/*-------- LIST FORMATS --------*/
.list-text-bg {
  color: var(--DarkColor) !important;
}

.list-text li {
  margin: 0;
  padding: 5px 0px;
}

.list-text-bg li,
.list-text-bg-two-col li {
  margin: 0;
  margin-bottom: 5px;
  padding: 10px 15px;
  background-color: var(--MediumLightColor);
}

.list-text-bg li:nth-child(odd) {
  background-color: #f9fbfb;
}

.list-text-bg-two-col li:nth-child(2n+2) {
  background-color: #f9fbfb;
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- Hover Changue Color ------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.hover-changue-color {
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.hover-changue-color:hover,
.hover-changue-color:hover i,
.hover-changue-color:hover h3,
.hover-changue-color:hover p .hover-changue-color:hover .text-color-brand,
.hover-changue-color:hover .text-color-secondary,
.hover-changue-color:hover .text-color-dark,
.hover-changue-color:hover .text-color-medium-dark,
.hover-changue-color:hover .text-color-medium,
.hover-changue-color:hover .text-color-medium-light,
.hover-changue-color:hover .text-color-light {
  color: var(--LightColor) !important;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.hover-changue-color:hover .icon-border {
  -webkit-text-stroke-color: transparent !important;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.hover-changue-color::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 0px;
  background-color: rgba(var(--DarkColorRGB), .8) !important;
  z-index: 111;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.hover-changue-color:hover::before {
  height: 100%;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.hover-changue-color:not(:hover) .button {
  background-color: var(--BrandColor) !important;
  border-color: var(--BrandColor) !important;
}

/*-----------------------------------------------------------------------------------------------*/
/*----------------------------------------- Feature Icons ---------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.feature-icons .center-content {
  min-height: 400px;
}

.figure-card-thumbnail-height-big img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.figure-card-thumbnail-height img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  object-position: bottom;
}

.figure-card-thumbnail-height-small img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: bottom;
}

.figure-card-thumbnail-widht img {
  width: auto;
  max-width: 300px;
  height: 250px;
  object-fit: cover;
  object-position: bottom;
}

.figure-card-thumbnail-widht-small img {
  width: auto;
  max-width: 300px;
  height: 200px;
  object-fit: cover;
  object-position: bottom;
}

.figure-card-thumbnail-all img {
  max-width: 250px;
  max-height: 250px;
  object-fit: cover;
  object-position: bottom;
}

.figure-card-thumbnail-all-small img {
  max-width: 250px;
  max-height: 200px;
  object-fit: cover;
  object-position: bottom;
}

@media(max-width: 720px) {
  .figure-card-thumbnail-widht img {
    width: 100%;
    max-width: 100%;
  }

  .figure-card-thumbnail-widht-small img {
    width: 100%;
    max-width: 100%;
  }
}

/*-------- NEWS --------*/
.box-content-gradient-news {
  background: -webkit-linear-gradient(rgba(var(--LightColorRGB), .1) 15%, rgba(var(--LightColorRGB), .95) 60%);
  background: -o-linear-gradient(rgba(var(--LightColorRGB), .1) 15%, rgba(var(--LightColorRGB), .95) 60%);
  background: linear-gradient(rgba(var(--LightColorRGB), .1) 15%, rgba(var(--LightColorRGB), .95) 60%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(var(--LightColorRGB),.1)', endColorstr='rgba(var(--LightColorRGB),.95) ', GradientType=1);
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- Product ------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/*-------- List --------*/
.deco-left-alert-product-list::after,
.deco-right-alert-product-list::after {
  content: "";
  width: 15px;
  height: 9px;
  justify-self: end;
  position: absolute;
  bottom: -8.5px;
}

.deco-left-alert-product-list::after {
  background-color: var(--MediumDarkColor);
  clip-path: polygon(85% 0%, 25% 0%, 75% 100%);
  left: 0;
}

.deco-right-alert-product-list::after {
  background-color: var(--MediumDarkColor);
  clip-path: polygon(85% 0%, 25% 0%, 25% 100%);
  right: 0;
}

.box-content-gradient-product {
  background: -webkit-linear-gradient(rgba(var(--DarkColorRGB), .1) 50%, rgba(var(--DarkColorRGB), .95) 80%);
  background: -o-linear-gradient(rgba(var(--DarkColorRGB), .1) 50%, rgba(var(--DarkColorRGB), .95) 80%);
  background: linear-gradient(rgba(var(--DarkColorRGB), .1) 50%, rgba(var(--DarkColorRGB), .95) 80%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(var(--DarkColorRGB),.1)', endColorstr='rgba(var(--DarkColorRGB),.95) ', GradientType=1);
}

/*-----------------------------------------------------------------------------------------------*/
/*-------------------------------------- WORDPRESS ----------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
blockquote {
  display: block;
  font-style: italic;
  padding: var(--BasicPadding);
}

/*-------- Sidebar --------*/
.textwidget,
.textwidget p {
  font-size: 14px;
}

.post-date {
  display: block;
  overflow: hidden;
  font-size: 12px;
  text-transform: capitalize;
  color: var(--MediumColor);
}

/*--------- Menu ---------*/
.sidebar ul li {
  margin-bottom: 10px;
}

.sidebar ul li a {
  font-weight: normal;
  font-size: 14px;
  display: block;
}

.sidebar ul li a::before {
  content: '\f510';
  font-family: "Genericons";
  color: var(--DarkColor);
  line-height: 1;
  vertical-align: middle;
  margin-right: 5px;
}

.sidebar .menu li a {
  background: var(--LightColor);
  padding: 5px 10px;
  padding-left: 0;
}

.sidebar .menu li a::before {
  content: '\f452';
  color: var(--LightColor);
  background: var(--BrandColor);
  margin-right: 10px;
  padding: 9px;
}

.sidebar .sub-menu {
  margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 10px;
}

.sidebar .children li a::before {
  content: '\f421';
}

.sidebar .children {
  margin-top: 5px;
  padding-left: var(--BasicPadding);
}

/*--------- Menu Custom ---------*/
.submenu>li {
  margin-bottom: 20px;
}

.submenu li a {
  font-weight: bold;
}

.submenu li a::before {
  content: '\f452';
  color: var(--BrandColor);
  font-family: "Genericons";
  line-height: 1;
  vertical-align: middle;
  margin-right: 5px;
}

.submenu li .sub-menu {
  margin-top: 10px;
  padding-left: 10px;
}

.submenu .sub-menu a {
  color: var(--DarkColor)
}

/*-------- Images --------*/
figcaption {
  text-align: center;
  font-size: 10px;
  font-style: italic;
}

/*-----------------------------------------------------------------------------------------------*/
/*------------------------------------------ PAGINATION -----------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.pagination {
  font-size: 12px;
  font-weight: bold;
}

.pagination li a {
  padding: 10px 15px;
  margin: 5px;
  border-radius: 25px;
  color: var(--LightColor);
  background-color: rgba(var(--DarkColorRGB), .3);
  display: inline-block;
}

.pagination li a:hover {
  background-color: var(--SecondaryColor);
  color: var(--LightColor);
}

.pagination-inactive {
  background-color: rgba(var(--DarkColorRGB), .1);
}

/*-----------------------------------------------------------------------------------------------*/
/*----------------------------------..------- TABS ----------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.tabs {
  border-bottom: 1px solid var(--MediumColor);
}

.tabs li {
  display: flex;
  margin-bottom: -1px;
}

.tabs li a {
  color: rgba(var(--DarkColorRGB), .3);
  background-color: rgba(var(--DarkColorRGB), .1);
  background: -moz-linear-gradient(0deg, rgba(var(--DarkColorRGB), .025) 15%, rgba(var(--DarkColorRGB), .10) 85%);
  background: -webkit-linear-gradient(0deg, rgba(var(--DarkColorRGB), .025) 15%, rgba(var(--DarkColorRGB), .10) 85%);
  background: linear-gradient(0deg, rgba(var(--DarkColorRGB), .025) 15%, rgba(var(--DarkColorRGB), .10) 85%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='rgba(var(--DarkColorRGB),.025)', endColorstr='rgba(var(--DarkColorRGB),.10) ', GradientType=1);
  border: 1px solid rgba(var(--DarkColorRGB), .3);
  border-bottom: 0;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  padding: var(--BasicPadding);
  padding-bottom: 20px;
}

.tabs li.active-tab a {
  color: var(--DarkColor);
  background-color: var(--LightColor);
  background: -moz-linear-gradient(0deg, var(--LightColor) 15%, var(--MediumLightColor) 85%);
  background: -webkit-linear-gradient(0deg, var(--LightColor) 15%, var(--MediumLightColor) 85%);
  background: linear-gradient(0deg, var(--LightColor) 15%, var(--MediumLightColor) 85%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--LightColor)', endColorstr='var(--MediumLightColor) ', GradientType=1);
  border: 1px solid var(--MediumColor);
  border-bottom: none;
  padding-bottom: 21px;
}

/*-----------------------------------------------------------------------------------------------*/
/*----------------------------------------- TABLAS ----------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
table {
  border-collapse: collapse;
  font-size: 14px;
  font-weight: 500;
  margin: 0 auto;
  word-wrap: break-word;
}

table a {
  color: var(--DarkColor) !important;
  font-weight: 400;
}

table a:hover {
  color: var(--LightColor) !important;
}

table a .table-edit {
  color: var(--SecondaryColor) !important;
}

table a .table-edit:hover {
  color: var(--LightColor) !important;
}

table a .table-delete {
  color: var(--AlertColor) !important;
}

table a .table-delete:hover {
  color: var(--LightColor) !important;
}

.table-ref,
table .table-ref,
table .table-ref a {
  color: dodgerblue !important;
}

.table-code,
table .table-code,
table .table-code a {
  color: goldenrod !important;
}

.table-price,
table .table-price,
table .table-price a {
  color: mediumseagreen !important;
}

.table-note,
table .table-note,
table .table-note a {
  color: darkgray !important;
}

td,
th {
  padding: 10px 5px;
  border: 1px solid var(--MediumLightColor);
}

thead tr:first-child {
  font-weight: 700;
  text-align: center;
}

thead tr:last-child {
  font-size: 10px;
  text-align: center;
}

tbody th,
tbody th a {
  font-weight: 600 !important;
}

@media (min-width: 800px) {
  thead.first-without-content tr th:first-child {
    background-color: var(--MediumLightColor);
    border: none;
  }

  thead tr:nth-child(odd) {
    background-color: rgba(var(--BrandColorRGB), .1);
  }

  thead tr:nth-child(even) {
    background-color: rgba(var(--BrandColorRGB), .2);
  }

  tbody tr:nth-child(odd) td {
    background-color: #f5f5f5;
  }

  tbody tr:nth-child(even) td {
    background-color: #f9f9f9;
  }

  tbody tr:nth-child(odd) th {
    background-color: rgba(var(--BrandColorRGB), .2);
    padding-right: 15px;
  }

  tbody tr:nth-child(even) th {
    background-color: rgba(var(--BrandColorRGB), .1);
    padding-right: 15px;
  }

  tbody td,
  tbody th {
    /*border-bottom: 5px solid #fff;*/
  }

  tbody tr:hover td {
    background-color: rgba(var(--BrandColorRGB), .05);
    color: var(--BrandColor);
  }

  tbody tr:hover th,
  tbody th:hover {
    background-color: var(--DarkColor) !important;
  }

  tbody tr:hover th,
  tbody th:hover,
  tbody tr:hover th a,
  tbody th:hover a {
    color: #fff !important;
  }

  tbody tr td:hover {
    background-color: var(--BrandColor);
  }

  tbody tr td:hover,
  tbody tr td:hover a {
    color: #fff !important;
  }

  .table-max-width-100 {
    max-width: 100px;
  }

  .table-max-width-150 {
    max-width: 150px;
  }

  .table-max-width-200 {
    max-width: 200px;
  }

  .table-max-width-300 {
    max-width: 300px;
  }

  .table-max-width-500 {
    max-width: 500px;
  }

  .table-max-width-800 {
    max-width: 800px;
  }

  .align-center-desktop {
    text-align: center;
  }
}

@media (max-width: 800px) {
  table {
    width: 100%;
  }

  table td,
  table th {
    border: none;
    word-wrap: anywhere;
  }

  table tr {
    display: flex;
    flex-direction: column;
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 10px;
  }

  table td[data-titulo],
  table th[data-titulo] {
    display: flex;
  }

  table td[data-titulo]::before,
  table th[data-titulo]::before {
    content: attr(data-titulo);
    min-width: 49%;
    max-width: 50%;
    text-transform: capitalize !important;
    font-weight: 400;
    color: var(--MediumColor);
  }

  table thead {
    display: none;
  }

  tbody td:nth-child(odd) {
    background-color: #f1f1f1;
  }

  tbody td:nth-child(even) {
    background-color: #f9f9f9;
  }
}

/*-----------------------------------------------------------------------------------------------*/
/*----------------------------------------- nicEdit ---------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.nicEdit-panelContain {
  margin: 0 !important;
  border: 1px solid var(--SecondaryColor) !important;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  background: var(--SecondaryColor) !important;
  padding: 5px;
}

.textarea {
  border-top-width: 0 !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  min-height: 300px;
}

.nicEdit-panel>div {
  margin-right: 5px !important;
  border-radius: 3px;
  overflow: hidden;
}



/*--------------------------------------------------- Limpiando ------------------------------------------------*/


/*---------------------------------------- List ------------------------------------------------*/
.productListIconLi li {
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover {
  opacity: 1;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi:hover li:not(:hover) {
  opacity: .4;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover .box-content-secondary {
  background-color: var(--DarkColor) !important;
}

.productListIcon {
  position: absolute;
  top: -40px;
  left: 0;
  right: 0;
  margin: 0 auto;
  box-shadow: 0 0 0 5px #f2f3f3;
  z-index: 1001;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconExtra {
  position: absolute;
  top: -40px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 1000;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover .productListIcon {
  top: -100px;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover .productListIconExtra {
  top: 0;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover .theme-image-color {
  filter: none;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.productListIconLi li:hover input {
  background-color: var(--AlertColor);
}

.productListButton {
  position: absolute;
  bottom: -25px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.iconDiscount {
  padding: 5px 10px;
  position: absolute;
  top: 15px;
  right: -5px;
  z-index: 1003;
}

.iconNew {
  padding: 5px 10px;
  position: absolute;
  top: 15px;
  left: -5px;
  z-index: 1003;
}

/*---------------------------------------- MORE ------------------------------------------------*/
/*-------- Customers Section --------*/
.customers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.customers li {
  margin: 0 2% 40px;
  z-index: 1;
  overflow: hidden;
  /*filter:saturate(0%);*/
  opacity: .5;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

.customers img {
  max-height: 40px;
  max-width: 180px;
  margin-bottom: 15px;
  color: var(--BrandColor);
}

.customers li:hover {
  opacity: 1;
  filter: none;
}

.customers:hover li:not(:hover) {
  opacity: .1;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
}

/*-------- Title --------*/
.titleContent {
  min-height: 170px;
}

/*---------------------------------------- HOME PAGE ------------------------------------------------*/
/*------- Objects -------*/
.bubble {
  display: inline-block;
  padding: 10px 25px;
  color: var(--LightColor);
  border-radius: 30px;
  background: var(--BrandColor);
}

.layer-image-zoom {
  cursor: pointer;
}