/*
Theme Name:   Simoniz ChildTheme 
URI: https://them.es/starter
Description:  Simoniz Child Theme
Author:       John DoeAuthor 
URI:   hhttps://www.eikondigital.com/
Template:     simoniz
Version:      1.0.7
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  simonizchild
*/
:root {
  --font-family-primary: "lufga", "Roboto";
  --font-family-secondary: "cutmark", "Roboto";
  --font-family-thirdly: "cutmark demi", "Roboto";
  --color-white: #fff;
  --color-black: #000;
  --color-main: #f5dc33;
  --color-secondary: #d1d1d1;
  --color-secondary-2: #646363;
  --color-thirdly: #494746;
  --color-fourth: #e6e5e5;
  --color-fifth: #9d9d9c;
  --color-starts: #ff7900;
  --paddin-menu-top: calc(100px + 2rem);
}
::-webkit-scrollbar {
  width: 20px;
}
::-webkit-scrollbar-track {
  background-color: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: var(--color-main);
  border-radius: 20px;
  border: 6px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumbver {
  background-color: var(--color-main);
}
html {
  scroll-behavior: smooth;
}
@font-face {
  font-family: "lufga";
  src: url(./font/LufgaRegular.woff2) format("woff2");
  font-weight: 400;
}
@font-face {
  font-family: "lufga";
  src: url(./font/LufgaBold.woff2) format("woff2");
  font-weight: 800;
}
@font-face {
  font-family: "cutmark";
  src: url(./font/Cutmark-Regular.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "cutmark";
  src: url(./font/Cutmark-Italic.woff2) format("woff2");
  font-weight: 400;
  font-style: italic;
}
@font-face {
  font-family: "cutmark demi";
  src: url(./font/Cutmark-Demi.woff2) format("woff2");
}
.font-primary {
  font-family: var(--font-family-primary);
}
.font-secondary {
  font-family: var(--font-family-secondary);
}
.font-thirdly {
  font-family: var(--font-family-thirdly);
}
.letter-spacing {
  letter-spacing: 0.25rem;
}
html body {
  font-family: var(--font-family-primary);
}
html img {
  height: auto;
  max-width: 100%;
}
.pt-menu-space {
  padding-top: var(--paddin-menu-top);
}
.title-big {
  font-size: clamp(4rem, 18vw, 16rem);
}
.title-big-medium {
  font-size: clamp(4rem, 11vw, 14rem);
}
.link-main a,
.text-main {
  color: var(--color-main);
}

.text-second {
  color: var(--color-secondary-2) !important;
}
.text-thrirty {
  color: var(--color-secondary-2) !important;
}
.bg-main {
  background-color: var(--color-main);
}
.bg-second {
  background-color: var(--color-secondary) !important;
}
.bg-thirdly {
  background-color: var(--color-thirdly) !important;
}
.bg-fourth {
  background-color: var(--color-fourth) !important;
}
.bg-fifth {
  background-color: var(--color-fifth) !important;
}
.text-thirdly {
  color: var(--color-thirdly) !important;
}
.btn.btn-main {
  background-color: var(--color-main);
}
.btn.btn-main:hover {
  background-color: var(--color-white);
}
.text-justify {
  text-align: justify;
}
.text-stroke {
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: var(--color-main);
}
.text-transparent {
  color: transparent;
}
.lh-085 {
  line-height: 0.85;
}
.btn.text-white:active,
.btn.text-white:hover {
  background: var(--color-black) !important;
}
.btn.text-black:active,
.btn.text-black:hover {
  background: var(--color-black) !important;
  color: var(--color-white) !important;
}
.btn.text-second:active,
.btn.text-second:hover {
  background: var(--color-thirdly) !important;
  color: var(--color-white) !important;
}
.btn.text-second:active i,
.btn.text-second:hover i {
  color: var(--color-white) !important;
}
.border-secondary {
  border-color: var(--color-secondary-2);
}
.border-orange {
  border-color: var(--color-starts);
}
.btn.btn-down i {
  transform: rotate(90deg);
}
.p-menu {
  padding-top: 8rem;
}
.last-p p:nth-last-child(1) {
  margin-bottom: 0;
}
.title-bandera-right {
  background-image: url(./img/title-bandera-right.png);
  background-position: right;
  background-repeat: no-repeat;
  background-size: auto 100%;
  padding-right: 12rem;
  padding-left: 2rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  line-height: 1;
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
.title-bandera-left {
  background-image: url(./img/title-bandera-left.png);
  background-position: left;
  background-repeat: no-repeat;
  background-size: auto 100%;
  padding-left: 12rem;
  padding-right: 2rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  line-height: 1;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}
swiper-slide li.product {
  list-style: none;
  display: inline-block;
}
.pb-100 {
  padding-bottom: 100%;
}
.cont-trama {
  background-image: url(./img/trama.png);
  background-position: top left;
  background-repeat: no-repeat;
  background-size: 40%;
}
.cont-trama-r {
  background-image: url(./img/trama-r.png);
  background-position: top right;
  background-repeat: no-repeat;
  background-size: 40%;
}
.parallelogram {
  clip-path: polygon(30% 0, 100% 0%, 70% 100%, 0% 100%);
  display: inline-block;
  height: 1rem;
  width: 1rem;
}
.accordion .accordion-button:focus {
  box-shadow: none;
}
.accordion .accordion-button {
  transition: 0.5s;
}
.accordion .accordion-button:not(.collapsed) {
  font-weight: bold;
  transition: 0.5s;
}
.swiper-button-prev.swiper-button-lock,
.swiper-button-next.swiper-button-lock {
  opacity: 0;
}
.cont-loader.active {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  visibility: visible;
  opacity: 1;
}
.cont-loader {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  position: absolute;
  z-index: 99;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  left: 0;
  top: 0;
}
.cont-open-filters {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  position: absolute;
  z-index: 99;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
  left: 0;
  top: 0;
}
.cont-open-filters.active {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  visibility: visible;
  opacity: 1;
}
.filter-gray-image:hover img {
  transition: 0.5s;
  filter: grayscale(0);
}
.filter-gray-image img {
  filter: grayscale(1);
  transition: 0.5s;
}
.link-white a {
  color: var(--color-white) !important;
}
.object-position-top {
  object-position: top;
}
.btn-circle {
  height: 100px;
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  border-radius: 50%;
}
.btn-circle i {
  position: absolute;
}
.btn-circle svg {
  fill: rgb(255, 255, 255);
  height: auto;
  max-width: 220px;
  transform-origin: center center;
  width: 16rem;
  display: block;
  font-size: 0.75rem;
}
.btn-circle svg text {
  letter-spacing: 150px;
  transition: all 0.5s ease 0s;
}
.btn-circle:hover svg text {
  letter-spacing: 0.15rem;
  transition: all 0.5s ease 0s;
}
header nav#header .navbar-brand img {
  position: absolute;
  left: 0;
  height: 45px;
  top: 0;
  z-index: 2;
}
header .offcanvas.offcanvas-top {
  height: 80vh;
}

body #navbar-top {
  background-image: url(img/franja-header-2.svg);
  background-repeat: repeat-x;
  background-size: auto 3px;
  background-position: bottom;
}

body header nav#header .buscador .dgwt-wcas-search-input {
  background: var(--color-black);
  color: var(--color-white);
  height: 38px;
  box-shadow: none;
  border: none;
}

body header nav#header .buscador .dgwt-wcas-search-input::placeholder{
  color: var(--color-white);
}

body #mega-menu-wrap-main-menu {
  display: flex;
}

body #mega-menu-wrap-main-menu #mega-menu-main-menu,
body #navbar #mega-menu-second-menu {
  margin: 0 auto;
}

body
  #mega-menu-wrap-second-menu
  #mega-menu-second-menu
  li.mega-menu-item.mega-menu-megamenu
  ul.mega-sub-menu
  .mega-menu-row
  > ul.mega-sub-menu {
  display: flex;
  justify-content: center;
}

body
  #mega-menu-wrap-second-menu
  #mega-menu-second-menu
  li.mega-menu-item.mega-menu-megamenu
  ul.mega-sub-menu
  .mega-menu-row
  > ul.mega-sub-menu
  > li {
  width: auto;
}

body
  #mega-menu-wrap-second-menu
  #mega-menu-second-menu
  > li.mega-menu-megamenu
  > ul.mega-sub-menu
  li.mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item
  > a.mega-menu-link {
  font-size: clamp(1.15rem, 1.5vw, 1.5rem);
}

#mega-menu-wrap-second-menu
  #mega-menu-second-menu
  li.mega-menu-megamenu:last-child
  > ul.mega-sub-menu
  > li.mega-menu-row
  .mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item {
  padding: 5px 15px 5px 15px;
}

#mega-menu-wrap-second-menu
  #mega-menu-second-menu
  li.mega-menu-megamenu:last-child
  > ul.mega-sub-menu
  > li.mega-menu-row
  .mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item
  > a {
  margin-bottom: 0;
}

#mega-menu-wrap-second-menu
  #mega-menu-second-menu
  > li.mega-menu-megamenu
  > ul.mega-sub-menu
  li.mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item
  li.mega-menu-item.mega-menu-item-has-children {
  margin-bottom: 10px;
}

#mega-menu-wrap-second-menu
  #mega-menu-second-menu
  > li.mega-menu-megamenu
  > ul.mega-sub-menu
  li.mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item
  li.mega-menu-item.mega-menu-item-has-children
  > ul.mega-sub-menu
  a.mega-menu-link {
  margin-bottom: 5px;
}

body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-item
  > a.mega-menu-link {
  font-style: italic;
  font-size: clamp(1.2rem, 2.25vw, 3.5rem);
  position: relative;
}
body #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item {
  position: relative;
}
body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-item
  > a.mega-menu-link::after {
  content: "/";
  position: relative;
  display: inline-block;
  margin-left: clamp(1rem, 2.5vw, 2rem);
  margin-right: clamp(1rem, 2.5vw, 2rem);
}
body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-item:nth-last-child(1)
  > a.mega-menu-link::after {
  display: none;
}
body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-item.mega-toggle-on::after {
  content: "";
  position: absolute;
  display: inline-block;
  clip-path: polygon(15% 0, 100% 0%, 85% 100%, 0% 100%);
  display: inline-block;
  height: 0.75rem;
  width: 2.5rem;
  background-color: var(--color-main);
  top: calc(100% + 0.5rem);
}
body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-megamenu
  > ul.mega-sub-menu
  li.mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item.main-link
  > a.mega-menu-link {
  font-size: clamp(1.25rem, 1.5vw, 2rem);
  line-height: 1;
}
body
  #mega-menu-wrap-main-menu
  #mega-menu-main-menu
  > li.mega-menu-megamenu
  > ul.mega-sub-menu
  li.mega-menu-column
  > ul.mega-sub-menu
  > li.mega-menu-item.main-link {
  margin-bottom: 1rem;
}
body #navbar li.mega-menu-item a {
  line-height: 1 !important;
}
body #navbar li.mega-menu-item a::before {

  filter: brightness(0) invert(1);
  /* transition: 0.5s; */
}
body #navbar li.mega-menu-item:hover a::before  {
  filter: none;
  /* transition: 0.5s; */
}
body #navbar li.menu-item a {
  padding: 0.3rem 1rem;
  transition: 0.5s;
}
/* body #navbar-top .nav-item:hover a, */
body #navbar .offcanvas-btn-menu:hover > *,
body #navbar #mega-menu-second-menu > li.mega-menu-item:hover > a {
  color: var(--color-main) !important;
  transition: 0.25s;
}

body .navbar #navbar-top .buscador {
  width: clamp(9rem, 18vw, 15rem);
}

body .offcanvas .close-cont button:hover span {
  font-weight: bold;
  transition: 0.15s;
  opacity: 1;
}
body .is-search-form {
  border: 1px solid var(--color-main);
  border-radius: var(--bs-border-radius-pill) !important;
  overflow: hidden;
  background: var(--color-fifth);
  padding: 3px !important;
}
body .is-search-form .is-search-submit {
  float: left;
  background: var(--color-fifth);
}
body .is-search-form input.is-search-input {
  border: none !important;
  background: var(--color-fifth);
  color: var(--color-white);
  height: 30px;
}
body .is-search-form button.is-search-submit {
  width: 30px;
  height: 30px;
}
body .is-search-form .is-search-submit .is-search-icon {
  background: var(--color-fifth);
  color: var(--color-main);
  border-radius: 50%;
  border: 1px solid var(--color-main);
  height: 30px;
  width: 30px;
  padding-top: 4px !important;
}
body .is-form-style .is-search-submit path {
  fill: var(--color-main);
}
body .is-ajax-search-details a,
body .is-ajax-search-result a {
  color: #000;
  font-weight: 800;
}
#footer .menu-item a {
  padding-left: 0;
}
#footer .menu-item a[aria-current="page"] {
  font-weight: bold;
}
#footer p {
  margin-top: 0 !important;
}
@media (max-width: 767px) {
  :root {
    --paddin-menu-top: calc(50px + 2rem);
  }
  html {
    font-size: 15px;
  }

  header nav#header .navbar-brand img {
    height: 100%;
  }

  .title-bandera-left {
    background-image: url(./img/title-bandera-left.png);
    background-repeat: repeat-y;
    background-size: 20%;
    padding-left: 4rem;
    padding-right: 1.5rem;
    word-break: break-all;
  }
  .title-bandera-right {
    background-image: url(./img/title-bandera-right.png);
    background-repeat: repeat-y;
    background-size: 20%;
    padding-right: 4rem;
    padding-left: 1.5rem;
    word-break: break-all;
  }
  header .offcanvas.offcanvas-top {
    height: 100svh;
  }
  body #mega-menu-wrap-main-menu {
    display: block;
  }
  body
    #mega-menu-wrap-main-menu
    #mega-menu-main-menu
    > li.mega-menu-item
    > a.mega-menu-link::after,
  body
    #mega-menu-wrap-main-menu
    #mega-menu-main-menu
    > li.mega-menu-item.mega-toggle-on::after {
    display: none !important;
  }
  body
    #mega-menu-wrap-main-menu
    #mega-menu-main-menu
    > li.mega-menu-item
    > a.mega-menu-link {
    font-style: italic;
    font-size: 1.5rem;
  }
  body
    #mega-menu-wrap-main-menu
    #mega-menu-main-menu
    > li.mega-menu-megamenu
    > ul.mega-sub-menu
    li.mega-menu-column
    > ul.mega-sub-menu
    > li.mega-menu-item.main-link {
    margin-bottom: 0.5rem;
    margin-top: 1rem;
  }
  body
    #mega-menu-wrap-main-menu
    #mega-menu-main-menu
    > li.mega-menu-megamenu
    > ul.mega-sub-menu
    li.mega-menu-column:nth-child(1)
    > ul.mega-sub-menu
    > li.mega-menu-item.main-link {
    margin-top: 0;
  }
  body .title-bandera-left,
  body .title-bandera-right {
    font-size: 1.15rem !important;
  }
}
