@import url("https://fonts.googleapis.com/css2?family=Jura:wght@300;400;500;600;700&family=Rubik+Distressed&display=swap");
/******************* Mixin ********************/
/******************* Extend ******************/
.flexColumn, .showRoom .rightSide .infoProduct .color, .sectionPlaceOrder .unionOrder .delivery .deliveryContact, .sectionPlaceOrder .unionOrder .delivery, .containerStore .sectionStore .sectionCard .cardProducts .article .info, .sectionWishlist, .bestSellers .sectionCardBlock .cardProducts .article .info, .header .headerContainer .menuIcons ul .menuSection .landingMenu ul, .header .headerContainer .menuIcons ul .menuSection {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.flexColumnBetween, .skullSocialMedia .socialMedia ul, .skullSocialMedia .socialMedia, .sectionFilter .menuFilterSide .menuFilter .choiceFilter, .sectionFilter .menuFilterSide .headLine .filter, .sectionPlaceOrder, .containerStore .skullSocialMedia .socialMedia ul, .containerStore .skullSocialMedia .socialMedia, .sectionShop {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.flexRowBetween, .footerContainer .containerFooter .footer, .showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion, .showRoom .rightSide .infoProduct .addToCart, .showRoom .rightSide .infoProduct .productRating, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .priceOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .priceTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .priceThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .priceOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .priceTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .priceThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .priceOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .priceTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .priceThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .priceOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .priceTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .priceThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .labelOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .labelTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability .labelThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .labelOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .labelTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing .labelThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .labelOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .labelTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability .labelThree, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .labelOne, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .labelTwo, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing .labelThree, .sectionFilter .menuFilterSide, .sectionPlaceOrder .unionOrder .delivery .deliveryContact .fullName, .sectionPlaceOrder .unionOrder, .headerSignIn .menuSide .top, .sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct, .heroSection .containerHeroSection .heroSectionCentered, .header .menuSide .top, .header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding p, .header .headerContainer, .header, .sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList, .sectionShop .menuCart .menuCartlist .choiceCartlist .cart .category {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.flexColumnFlexEnd, .advertising .advertisingMood, .advertising {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.flexColumnCenter, .footerContainer .containerFooter .footer .payments, .footerContainer .containerFooter .footer .socialMediaFooter, .sectionFilter .menuFilterSide .menuFilter, .container .logInCreateAccount .tags .formCreateAccount .formFloating, .container .logInCreateAccount .tags .formLogIn .formFloating, .giftCards .containerGetOff .containerMessage, .giftCards {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.flexColumnCenterCenter, .containerError .pageError, .footerContainer .containerFooter .footer .brand, .footerContainer, .showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBodyDos, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .btnFilter, .sectionPlaceOrder .unionOrder .formPayment .btnPlaceOnOrder, .headerSignIn .menuIcons ul, .container .logInCreateAccount .tags .formLogIn, .container .logInCreateAccount .tags .formCreateAccount, .heroSection, .sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.flexColumnEvenlyCenter, .getOffShowRoom .bannerGetOff, .getOffSignIn .bannerGetOff, .containerStore .getOffStore .bannerGetOff, .getOffHoddy .bannerGetOff {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: center;
}

.flexRowEvenlyCenter, .getOffShowRoom .bannerGetOff .slideGetOff, .getOffSignIn .bannerGetOff .slideGetOff, .headerSignIn .menuIcons ul li, .containerStore .getOffStore .bannerGetOff .slideGetOff, .getOffHoddy .bannerGetOff .slideGetOff {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}

.flexRowCenterStart {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
}

/******************* ctoStore ******************/
.ctaStoreFeatures, .newArrivals .ctaStore, .bestSellers .ctaStore {
  display: flex;
  justify-content: center;
  margin: 70px auto 0px;
  width: 200px;
  padding: 20px 40px;
  color: #ffffff;
  font-family: "Jura", sans-serif;
  font-weight: 700;
  background-color: #3d3d3d;
  text-decoration: none;
  transition: all 0.3s ease;
}
.ctaStoreFeatures:hover, .newArrivals .ctaStore:hover, .bestSellers .ctaStore:hover {
  background-color: #BC2327;
  box-shadow: 0 0 4px 2px #707070;
  text-decoration: underline;
}

.toast, #out-of-stock-message div .soldOutProduct, #messageContainer div .messageWishlist, #messageContainer div .stockProduct, #messageNewProduct div .messageWishlist, #messageNewProduct div .stockProduct {
  width: 135px;
  height: auto;
  font-size: 0.6rem;
  font-family: "Jura", sans-serif;
  font-weight: 700;
  padding: 10px;
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  filter: drop-shadow(12px 12px 5px rgba(0, 0, 0, 0.6431372549));
}

/******************* Include ******************/
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

body {
  background-color: #ffffff;
  overflow-x: hidden;
}

html {
  scroll-behavior: smooth;
}
html .mainContainer {
  width: 100%;
  height: 100%;
}
html .mainContainer .bannerShipping {
  width: 100%;
  margin-top: 70px;
}
html .mainContainer .bannerShipping .shipping {
  width: fit-content;
  height: auto;
  margin: auto;
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 700;
  font-family: "Jura", sans-serif;
  text-transform: uppercase;
  background-color: #000000;
  animation: shipping 4000ms linear;
}
@keyframes shipping {
  0% {
    transform: translateX(-250%);
  }
  20% {
    transform: translateX(-200%);
  }
  40% {
    transform: translateX(-150%);
  }
  60% {
    transform: translateX(-100%);
  }
  80% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}
html .mainContainer .tagGetOff {
  position: fixed;
  top: 35%;
  right: 0%;
  transform: rotate(180deg);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 8;
  text-decoration: none;
}
html .mainContainer .tagGetOff .discount {
  animation: getOff 0.5s linear;
}
html .mainContainer .tagGetOff .discount .title {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  text-align: center;
  writing-mode: vertical-rl;
  text-orientation: right;
  transform: rotate(180deg);
  font-weight: 600;
  cursor: pointer;
  background-color: #000000;
  padding: 40px 15px;
  transition: 0.3s ease-in-out;
}
html .mainContainer .tagGetOff .discount .title:hover {
  background-color: #bc2327;
}
@keyframes getOff {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0%);
  }
}
html .mainContainer .arrowUp {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 8;
}
html .mainContainer .arrowUp .directionUp .arrowUpIcon {
  width: 32px;
  border-radius: 50%;
  background-color: #6b6b6b;
  border: 2px solid #6b6b6b;
  transition: 0.3s ease-in-out;
}
html .mainContainer .arrowUp .directionUp .arrowUpIcon:hover {
  background-color: #bc2327;
  border: 2px solid #bc2327;
}

.newArrivals, .bestSellers, .containerStore {
  max-width: 1300px;
  margin: 0px auto;
  padding: 0px 30px;
}

#cart {
  display: none;
}
#cart:checked ~ .sectionShop {
  transform: translate(0%);
}

.sectionShop {
  width: 40vw;
  height: 100vh;
  position: fixed;
  top: 0;
  right: 0;
  background-color: #ffffff;
  overflow: hidden;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 10;
  padding-top: 30px;
  align-items: flex-start;
  transform: translate(105%);
  transition: 0.3s ease-in-out;
}
.sectionShop .menuCart {
  width: 100%;
}
.sectionShop .menuCart .cartShop .closeCross {
  width: 15px;
  cursor: pointer;
  position: absolute;
  top: 20px;
  left: 20px;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.sectionShop .menuCart .cartShop .closeCross:hover {
  transform: rotate(90deg);
}
.sectionShop .menuCart .menuCartlist {
  align-items: flex-start;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist {
  width: 100%;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cartlistWord {
  width: 100%;
  align-items: flex-start;
  font-size: 1.2rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  padding-left: 20px;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart {
  width: 95%;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .category {
  width: 100%;
  padding: 20px 45px 0px 20px;
  border-bottom: none;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .category .titleCartlist {
  align-self: self-start;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles {
  width: 90%;
  height: 310px;
  margin: 0px 20px;
  padding: 0px 20px 0px 0px;
  overflow: scroll;
  position: fixed;
  top: 140px;
  left: 0px;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList {
  padding: 20px 0px;
  border-bottom: 1px solid #e4e4e4;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .total {
  font-size: 1rem;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .itemProduct {
  width: 14%;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .description .price {
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #191919;
  font-weight: 600;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .description .icons img {
  width: 20px;
  cursor: pointer;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .itemNumber .counter {
  background-color: #f0f0f0;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .itemNumber .counter .minusBtn, .sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .itemNumber .counter .plusBtn {
  width: 35px;
  height: 35px;
  font-size: 1.2rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 700;
  border: none;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .itemNumber .counter .counterValue {
  width: 40px;
  padding: 2px;
  font-weight: 700;
}
.sectionShop .menuCart .menuCartlist .choiceCartlist .cart .containerArticles .cartList .total {
  width: 50px;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  overflow: hidden;
}
.sectionShop .menuCart .menuCartlist .outcomeCard {
  width: 65%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  bottom: 70px;
  left: 20px;
}
.sectionShop .menuCart .menuCartlist .outcomeCard .outcome #cartTotal {
  margin: 0px auto 10px;
  width: inherit;
  font-size: 1.2rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
}
.sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout {
  width: 100%;
  height: 40.39px;
  padding: 10px 20px;
  margin: 0px;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #ffffff;
  border: 1px solid transparent;
  background-color: #000000;
  transition: 0.3s ease-in-out;
}
.sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
  font-weight: 600;
}

.header {
  width: 100%;
  height: 60px;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #1b1b1b;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 9;
}
.header #menuSide {
  display: none;
}
.header #menuSide:checked ~ .menuSide {
  transform: translate(0%);
}
.header .headerContainer {
  width: 95%;
  max-width: 1300px;
  margin: auto;
}
.header .headerContainer label .drawerIcon {
  width: 30px;
  cursor: pointer;
}
.header .headerContainer .logo {
  position: relative;
}
.header .headerContainer .logo .brand {
  position: absolute;
  top: -22px;
  left: 50px;
  width: 45px;
  border-radius: 50%;
  transition: 0.3s ease-in-out;
}
.header .headerContainer .logo .brand:hover {
  transform: translateY(0%) scale(105%);
  filter: drop-shadow(0 0 6px #696061);
  animation: skull 1s linear;
}
@keyframes skull {
  0% {
    filter: drop-shadow(0 0 2px #696061);
  }
  100% {
    filter: drop-shadow(0 0 6px #696061);
  }
}
.header .headerContainer .menuIcons ul {
  display: flex;
  flex-direction: row;
  margin: 0px;
}
.header .headerContainer .menuIcons ul li {
  list-style-type: none;
}
.header .headerContainer .menuIcons ul li a {
  padding: 0px 5px;
}
.header .headerContainer .menuIcons ul li a .icon {
  cursor: pointer;
  transform: scale(100%);
  transition: 0.3s ease-in-out;
}
.header .headerContainer .menuIcons ul li a .icon:hover {
  transform: scale(120%);
  filter: drop-shadow(0 0 10px #696061);
}
.header .headerContainer .menuIcons ul .menuSection {
  align-items: none;
  position: relative;
}
.header .headerContainer .menuIcons ul .menuSection #newMenu {
  display: none;
}
.header .headerContainer .menuIcons ul .menuSection #newMenu:checked ~ .landingMenu {
  visibility: visible;
  opacity: 1;
  clip-path: circle(141.2% at 100% 0);
}
.header .headerContainer .menuIcons ul .menuSection .landingIcon .menuLandingIcon {
  width: 25px;
  margin: 0px 0px 0px 5px;
  cursor: pointer;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu {
  width: 140px;
  height: auto;
  position: absolute;
  top: 40px;
  right: 0px;
  filter: drop-shadow(12px 12px 5px rgba(0, 0, 0, 0.6431372549));
  opacity: 0;
  visibility: hidden;
  background-color: #1b1b1b;
  overflow: hidden;
  clip-path: circle(1% at 99% 0);
  transition: 0.3s ease-in-out;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul {
  margin-left: -32px;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li {
  width: 100%;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding {
  width: 100%;
  height: auto;
  display: block;
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  padding: 0px;
  margin: 0px;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding:hover {
  background-color: rgba(188, 35, 40, 0.3490196078);
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding p {
  padding: 10px;
  margin: 0;
  transition: 0.3s ease-in-out;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding p span {
  opacity: 0;
  visibility: hidden;
}
.header .headerContainer .menuIcons ul .menuSection .landingMenu ul li .linksLanding p:hover > span {
  opacity: 1;
  visibility: visible;
}
.header .headerContainer .menuIcons ul .wishHeadLine .wishlistIcon, .header .headerContainer .menuIcons ul .wishHeadLine .cartIcon, .header .headerContainer .menuIcons ul .cartShop .wishlistIcon, .header .headerContainer .menuIcons ul .cartShop .cartIcon {
  cursor: pointer;
  margin: 0px 5px;
  transform: scale(100%);
  transition: 0.3s ease-in-out;
}
.header .headerContainer .menuIcons ul .wishHeadLine .wishlistIcon:hover, .header .headerContainer .menuIcons ul .wishHeadLine .cartIcon:hover, .header .headerContainer .menuIcons ul .cartShop .wishlistIcon:hover, .header .headerContainer .menuIcons ul .cartShop .cartIcon:hover {
  transform: scale(120%);
  filter: drop-shadow(0 0 10px #696061);
}
.header .menuSide {
  width: 20vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  background-color: #1b1b1b;
  overflow: hidden;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 10;
  transform: translate(-105%);
  transition: 0.3s ease-in-out;
}
.header .menuSide .top {
  width: 100%;
  background-color: #191919;
  padding: 10px 10px 10px 30px;
}
.header .menuSide .top .brand {
  width: 32px;
}
.header .menuSide .top label .close {
  width: 25px;
  cursor: pointer;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.header .menuSide .top label .close:hover {
  transform: rotate(90deg);
}
.header .menuSide .menu {
  width: 100%;
}
.header .menuSide .menu ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: 0;
}
.header .menuSide .menu ul li {
  width: 100%;
  list-style-type: none;
  cursor: pointer;
  background-color: #191919;
}
.header .menuSide .menu ul li .link {
  display: block;
  width: inherit;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  padding-right: 100px;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
}
.header .menuSide .menu ul li .link:hover {
  background-color: rgba(188, 35, 40, 0.3490196078);
}
.header .menuSide .menu ul li .cartShop {
  width: 100%;
  cursor: pointer;
}
.header .menuSide .menu ul li .cartShop .link {
  display: block;
  width: 100%;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  margin: 0px auto 0px 0px;
  padding-bottom: 15px;
  border-bottom: 1px solid #3d3d3d;
  transition: 0.3s ease-in-out;
}
.header .menuSide .menu ul li .cartShop .link:hover {
  background-color: rgba(188, 35, 40, 0.3490196078);
}
.header .menuSide .contactUs {
  width: 100%;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-start;
  background-color: #191919;
  padding-top: 10px;
}
.header .menuSide .contactUs p {
  width: 100%;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  padding-left: 30px;
  border-bottom: 1px solid #3d3d3d;
  padding-bottom: 15px;
}
.header .menuSide .contactUs ul {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: 30px;
  padding-right: 30px;
}
.header .menuSide .contactUs ul li {
  display: block;
  list-style-type: none;
}
.header .menuSide .contactUs ul li .item {
  text-decoration: none;
}
.header .menuSide .contactUs ul li .item .itemSocial {
  width: 32px;
  filter: grayscale(0%);
  transform: scale(100%, 100%);
  transition: 0.3s ease-in-out;
}
.header .menuSide .contactUs ul li .item .itemSocial:hover {
  transform: scale(110%, 110%);
  filter: drop-shadow(0 0 10px #000000) grayscale(100%);
}

.heroSection {
  width: 100%;
  height: auto;
  background-image: url(../img/background_Hero.webp);
  background-position: cover;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
  margin: 0px auto;
  padding-bottom: 150px;
}
.heroSection .containerHeroSection {
  width: 90%;
  max-width: 1300px;
  margin: 50px auto 300px;
}
.heroSection .containerHeroSection .heroSectionCentered {
  height: 100%;
  z-index: 1;
}
.heroSection .containerHeroSection .heroSectionCentered .info {
  width: 45%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  animation: info 0.75s linear;
  text-align: left;
  z-index: 2;
}
.heroSection .containerHeroSection .heroSectionCentered .info .break {
  font-size: 4.5rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  margin: 0;
}
.heroSection .containerHeroSection .heroSectionCentered .info .subtitle {
  font-size: 2.5rem;
  font-family: "Jura", sans-serif;
  color: #6b6b6b;
  font-weight: 600;
}
.heroSection .containerHeroSection .heroSectionCentered .info .cta {
  width: 90%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 15px;
}
.heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
  width: 50%;
  text-align: center;
  padding: 17px;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  font-size: 1.2rem;
  color: #191919;
  background-color: #9a9a9a;
  text-decoration: none;
  box-shadow: 1px 5px 6px 2px #363636;
  transform: scale(100%);
  transition: 0.5s ease;
}
.heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount:hover, .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals:hover {
  color: #ffffff;
  background-color: #3d3d3d;
  box-shadow: 0 0 6px 2px #BC2327;
  text-decoration: underline;
}
.heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
  color: #ffffff;
  background-color: #bc2327;
}
@keyframes info {
  0% {
    transform: translateX(-30%);
    opacity: 0;
  }
  25% {
    transform: translateX(-15%);
    opacity: 0.5;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}
.heroSection .containerHeroSection .heroSectionCentered .info .promo {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #9a9a9a;
}
.heroSection .containerHeroSection .heroSectionCentered .info .promo .ctaShowRoom {
  color: #bc2327;
  text-decoration: none;
  transition: all 0.3s ease;
}
.heroSection .containerHeroSection .heroSectionCentered .info .promo .ctaShowRoom:hover {
  color: #9a9a9a;
  text-decoration: underline;
}
.heroSection .containerHeroSection .laptop {
  width: 55%;
  height: auto;
  display: block;
  -webkit-max-width: 100%;
  -moz-max-width: 100%;
  filter: drop-shadow(2px 9px 5px rgb(44, 44, 44)) blur(0px);
  animation: motion 1.3s linear alternate;
}
@keyframes motion {
  0% {
    filter: drop-shadow(0 0 95px #bc2327) blur(8px) brightness(0%);
    transform: translate(-1800px, -1100px) scale(0%);
    opacity: 0;
  }
  25% {
    filter: drop-shadow(0 0 85px #bc2327) blur(6px) brightness(250%);
    transform: translate(-900px, -500px) scale(0%, 10%);
    opacity: 0.2;
  }
  50% {
    filter: drop-shadow(0 0 75px #bc2327) blur(5px) brightness(550%);
    transform: translate(-800px, -100px) scale(35%, 45%);
    opacity: 0.3;
  }
  75% {
    filter: drop-shadow(0 0 25px rgb(0, 0, 0)) blur(4px) brightness(200%);
    transform: translate(-300px, 0px) scale(70%, 70%);
    opacity: 0.7;
  }
  100% {
    filter: drop-shadow(0 0 5px rgb(44, 44, 44)) blur(0px) brightness(100%);
    transform: scale(100%, 100%);
    opacity: 1;
  }
}

.getOffHoddy {
  width: 100%;
  height: 100%;
  background-image: url("../img/background_Gift.webp");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-color: #131313;
  margin: 200px auto;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.getOffHoddy .containerGetOff {
  width: 90%;
  max-width: 1300px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 50px;
  padding-top: 100px;
  padding-bottom: 100px;
}
.getOffHoddy .containerGetOff .info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.getOffHoddy .containerGetOff .info .title {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
}
.getOffHoddy .containerGetOff .info .paragraph {
  margin-top: 50px;
}
.getOffHoddy .containerGetOff .info .paragraph .subtitle, .getOffHoddy .containerGetOff .info .paragraph .sentence, .getOffHoddy .containerGetOff .info .paragraph .cta {
  font-size: 1.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #f1f1f1;
}
.getOffHoddy .containerGetOff .info .paragraph .sentence {
  font-size: 1.5rem;
}
.getOffHoddy .containerGetOff .info label {
  align-self: self-end;
}
.getOffHoddy .containerGetOff .info label .ctaSentence {
  text-align: right;
  cursor: pointer;
  margin-top: 20px;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #f1f1f1;
  transition: color 0.3s ease-in-out;
}
.getOffHoddy .containerGetOff .info label .ctaSentence:hover {
  color: #bc2327;
  text-decoration: underline;
}
.getOffHoddy .containerGetOff .hoddy {
  width: fit-content;
  animation: hoddy 2s linear 2s infinite;
}
@keyframes hoddy {
  0% {
    filter: drop-shadow(0 0 1px #BC2327);
  }
  25% {
    filter: drop-shadow(0 1px 2px #BC2327);
  }
  50% {
    filter: drop-shadow(0 2px 3px #BC2327);
  }
  75% {
    filter: drop-shadow(0 3px 5px #BC2327);
  }
  100% {
    filter: drop-shadow(0 4px 6px #BC2327);
  }
}
.getOffHoddy #cross {
  display: none;
}
.getOffHoddy #cross:checked ~ .bannerGetOff {
  transform: translateY(0%);
}
.getOffHoddy .bannerGetOff {
  width: 65vw;
  max-width: fit-content;
  height: auto;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.0745098039);
  box-shadow: 0 0 10px 6px #070707;
  position: fixed;
  top: 20%;
  left: 0%;
  right: 0px;
  margin: auto;
  z-index: 2;
  transform: translateY(500%);
  overflow: hidden;
  transition: 0.3s ease-in-out;
}
.getOffHoddy .bannerGetOff .title {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  margin-top: 20px;
}
.getOffHoddy .bannerGetOff label {
  width: auto;
  align-self: self-end;
}
.getOffHoddy .bannerGetOff label .crossCloseWhite {
  width: 25px;
  cursor: pointer;
  z-index: 3;
  background-color: #000000;
  border-radius: 50%;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.getOffHoddy .bannerGetOff label .crossCloseWhite:hover {
  transform: rotate(90deg);
}
.getOffHoddy .bannerGetOff .slideGetOff {
  padding: 20px 20px 0px;
  backdrop-filter: blur(10px);
}
.getOffHoddy .bannerGetOff .slideGetOff .hoddy {
  padding: 10px;
}
.getOffHoddy .bannerGetOff .slideGetOff .hoddy img {
  width: 100%;
  height: fit-content;
  object-fit: cover;
}
.getOffHoddy .bannerGetOff .slideGetOff .hoddy h3 {
  margin-top: 30px;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
}
.getOffHoddy .bannerGetOff .slideGetOff .hoddy p {
  padding: 10px auto;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #f1f1f1;
}
.getOffHoddy .bannerGetOff::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8980392157);
  backdrop-filter: blur(10px);
  filter: blur(10px);
  z-index: -1;
  border-radius: 10px;
}
.getOffHoddy .bannerGetOff > * {
  position: relative;
}

.advertising {
  width: 100%;
  height: 900px;
  background-image: url(../img/background_Advertising.webp);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  object-fit: cover;
  margin: 200px 0px;
  padding: 100px;
}
.advertising .advertisingMood {
  width: 100%;
  max-width: 1300px;
}
.advertising .advertisingMood .subtitle {
  font-size: 3.5rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #f1f1f1;
}
.advertising .advertisingMood .subtitle:nth-child(1) {
  opacity: 1;
}
.advertising .advertisingMood .subtitle:nth-child(2) {
  opacity: 0.65;
}
.advertising .advertisingMood .subtitle:nth-child(3) {
  opacity: 0.35;
}

.giftCards {
  width: 80%;
  max-width: 1300px;
  height: auto;
  margin: 0px auto 150px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.giftCards .subtitle {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  margin-bottom: 100px;
}
.giftCards .containerGetOff {
  display: flex;
  flex-direction: row;
}
.giftCards .containerGetOff .containerCards {
  width: 60%;
  height: auto;
}
.giftCards .containerGetOff .containerCards .sectionCards {
  padding: 35px 15px;
}
.giftCards .containerGetOff .containerCards .sectionCards .card1, .giftCards .containerGetOff .containerCards .sectionCards .card2, .giftCards .containerGetOff .containerCards .sectionCards .card3, .giftCards .containerGetOff .containerCards .sectionCards .card4 {
  width: 100%;
  padding: 20px 20px 0px;
  border-radius: 10px;
}
.giftCards .containerGetOff .containerCards .sectionCards .card1 .subtitleGift, .giftCards .containerGetOff .containerCards .sectionCards .card2 .subtitleGift, .giftCards .containerGetOff .containerCards .sectionCards .card3 .subtitleGift, .giftCards .containerGetOff .containerCards .sectionCards .card4 .subtitleGift {
  font-size: 2.7rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  padding: 25px 0px;
  font-weight: 500;
}
.giftCards .containerGetOff .containerCards .sectionCards .card1 .paragraph, .giftCards .containerGetOff .containerCards .sectionCards .card2 .paragraph, .giftCards .containerGetOff .containerCards .sectionCards .card3 .paragraph, .giftCards .containerGetOff .containerCards .sectionCards .card4 .paragraph {
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  color: #000000;
  font-weight: 600;
}
.giftCards .containerGetOff .containerCards .sectionCards .card1:nth-child(1) {
  background-color: #f1f1f1;
}
.giftCards .containerGetOff .containerCards .sectionCards .card2:nth-child(2) {
  background-color: #1b1b1b;
}
.giftCards .containerGetOff .containerCards .sectionCards .card2:nth-child(2) .paragraph {
  color: #9a9a9a;
}
.giftCards .containerGetOff .containerCards .sectionCards .card3:nth-child(3) {
  background-color: #E0B24D;
}
.giftCards .containerGetOff .containerCards .sectionCards .card4:nth-child(4) {
  background-color: #bc2327;
}
.giftCards .containerGetOff .containerCards .sectionCards .card4:nth-child(4) .subtitleGift {
  color: #f1f1f1;
  font-weight: 500;
}
.giftCards .containerGetOff .containerMessage {
  width: 40%;
  height: max-content;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  margin: auto 50px auto 50px;
}
.giftCards .containerGetOff .containerMessage .subtitleMessage {
  font-size: 2.5rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  text-align: left;
  font-weight: 400;
}
.giftCards .containerGetOff .containerMessage .paragraph {
  font-size: 1.5rem;
  font-family: "Jura", sans-serif;
  color: #9a9a9a;
  text-align: left;
  font-weight: 400;
}
.giftCards .containerGetOff .containerMessage .paragraph .higthlighter {
  color: #bc2327;
  font-weight: 600;
}

.bestSellers {
  width: 100%;
  max-width: 1300px;
  height: auto;
  margin: 0px auto;
}
.bestSellers .subtitle {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  text-align: center;
  margin-bottom: 100px;
}
.bestSellers .sectionCardBlock {
  width: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 20px;
}
.bestSellers .sectionCardBlock .cardProducts {
  width: 100%;
  height: 400px;
  cursor: pointer;
  overflow: hidden;
  transition: 0.3s ease-in-out;
}
.bestSellers .sectionCardBlock .cardProducts:hover {
  box-shadow: 0 0 4px 2px #707070;
}
.bestSellers .sectionCardBlock .cardProducts .article {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.bestSellers .sectionCardBlock .cardProducts .article:hover > .outFit {
  transform: scale(110%);
  filter: grayscale(100%);
  box-shadow: 0 0 4px 2px #707070;
}
.bestSellers .sectionCardBlock .cardProducts .article .info {
  width: 101%;
  margin-top: 20px;
  padding: 10px;
  background-color: #ffffff;
  transform: translateY(110%);
  transition: transform 0.3s ease;
}
.bestSellers .sectionCardBlock .cardProducts .article .info:hover {
  transform: translateY(-110%);
}
.bestSellers .sectionCardBlock .cardProducts .article .info .nameOutfit {
  color: #bc2327;
  font-size: 1.8rem;
  font-weight: 400;
  font-family: "Rubik Distressed", cursive;
}
.bestSellers .sectionCardBlock .cardProducts .article .info .price {
  color: #191919;
  font-weight: 600;
  font-family: "Jura", sans-serif;
}
.bestSellers .sectionCardBlock .cardProducts .article .outFit {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  vertical-align: middle;
  filter: grayscale(10%);
  box-shadow: 0 0 4px 2px 0 0 4px 2px #707070;
  transition: 0.3s ease-in-out;
}
.bestSellers .sectionCardBlock .cardProducts .article .outFit:hover ~ .info {
  transform: translateY(-110%);
}
#wishlistSide {
  display: none;
}
#wishlistSide:checked ~ .sectionWishlist {
  transform: translate(0%);
}

.sectionWishlist {
  width: 30vw;
  height: 100vh;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10px;
  align-items: flex-start;
  background-color: #ffffff;
  overflow: hidden;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 10;
  padding-top: 30px;
  transform: translate(105%);
  transition: 0.3s ease-in-out;
}
.sectionWishlist .wishHeadLine .closeCross {
  width: 15px;
  cursor: pointer;
  position: absolute;
  top: 20px;
  left: 20px;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.sectionWishlist .wishHeadLine .closeCross:hover {
  transform: rotate(90deg);
}
.sectionWishlist .menuWishlist {
  width: 100%;
}
.sectionWishlist .menuWishlist .choiceWishlist {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  margin: 0px auto;
}
.sectionWishlist .menuWishlist .choiceWishlist .wishlistWord {
  width: 100%;
  font-size: 1.2rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  padding: 25px 0px 20px 20px;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish {
  width: 100%;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .category {
  width: 100%;
  border-bottom: 0;
  padding-left: 20px;
  margin-right: 0px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .category .titleWishlist {
  width: 100%;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist {
  width: 90%;
  height: 440px;
  overflow-y: scroll;
  position: absolute;
  top: 140px;
  left: 20px;
  padding: 0px 50px 0px 0px;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct {
  padding: 20px 0px;
  border-bottom: 1px solid #e4e4e4;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct .itemProduct {
  width: 18%;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct .description {
  display: flex;
  flex-direction: column;
  margin-left: -40px;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct .description .wishPrice {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct .description .icons img {
  width: 20px;
  cursor: pointer;
}
.sectionWishlist .menuWishlist .choiceWishlist .wish .containerWishlist .wishlist .blockProduct .itemWishlist {
  width: 20px;
  cursor: pointer;
}

.containerStore {
  margin: 100px auto 150px;
}
.containerStore .tagGetoff {
  position: fixed;
  top: 35%;
  right: 0%;
  transform: rotate(180deg);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 8;
  text-decoration: none;
}
.containerStore .tagGetoff .discount {
  animation: getOff 0.5s linear;
}
.containerStore .tagGetoff .discount .title {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  text-align: center;
  writing-mode: vertical-rl;
  text-orientation: right;
  transform: rotate(180deg);
  font-weight: 600;
  cursor: pointer;
  background-color: #000000;
  padding: 40px 15px;
  transition: all 0.3s ease;
}
.containerStore .tagGetoff .discount .title:hover {
  background-color: #BC2327;
}
@keyframes getOff {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0%);
  }
}
.containerStore .getOffStore {
  width: 100%;
  height: 100%;
}
.containerStore .getOffStore #cross {
  display: none;
}
.containerStore .getOffStore #cross:checked ~ .bannerGetOff {
  transform: translateY(0%);
}
.containerStore .getOffStore .bannerGetOff {
  width: 65vw;
  max-width: fit-content;
  height: auto;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.0745098039);
  box-shadow: 0 0 6px 4px black;
  position: fixed;
  top: 20%;
  left: 0%;
  right: 0px;
  margin: auto;
  z-index: 8;
  transform: translateY(500%);
  overflow: hidden;
  transition: 0.3s ease-in-out;
}
.containerStore .getOffStore .bannerGetOff label {
  width: auto;
  align-self: self-end;
}
.containerStore .getOffStore .bannerGetOff label .crossCloseWhite {
  width: 25px;
  cursor: pointer;
  z-index: 10;
  background-color: #000000;
  border-radius: 50%;
  transform: rotate(0deg);
  transition: all 0.3s ease-in-out;
}
.containerStore .getOffStore .bannerGetOff label .crossCloseWhite:hover {
  transform: rotate(90deg);
}
.containerStore .getOffStore .bannerGetOff .title {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #BC2327;
  margin-top: 20px;
}
.containerStore .getOffStore .bannerGetOff .slideGetOff {
  padding: 20px 20px 0px;
  backdrop-filter: blur(10px);
}
.containerStore .getOffStore .bannerGetOff .slideGetOff .hoddy {
  padding: 10px;
}
.containerStore .getOffStore .bannerGetOff .slideGetOff .hoddy img {
  width: 100%;
  height: fit-content;
  object-fit: cover;
}
.containerStore .getOffStore .bannerGetOff .slideGetOff .hoddy h3 {
  margin-top: 30px;
  font-size: 1.1rem;
  font-family: "Jura", sans-serif;
  color: #BC2327;
}
.containerStore .getOffStore .bannerGetOff .slideGetOff .hoddy p {
  padding: 10px auto;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #d9d9d9;
}
.containerStore .getOffStore .bannerGetOff::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8980392157);
  backdrop-filter: blur(10px);
  filter: blur(10px);
  z-index: -1;
  border-radius: 10px;
}
.containerStore .getOffStore .bannerGetOff > * {
  position: relative;
}
.containerStore .sectionStore {
  width: 100%;
  max-width: 1225px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
}
.containerStore .sectionStore .sectionCard {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(1, 1fr);
  gap: 20px;
}
.containerStore .sectionStore .sectionCard .cardProducts {
  width: 100%;
  height: auto;
  transition: 0.3s ease-in-out;
}
.containerStore .sectionStore .sectionCard .cardProducts:hover {
  box-shadow: 0 0 4px 2px #707070;
}
.containerStore .sectionStore .sectionCard .cardProducts .article {
  width: 100%;
  height: auto;
  overflow: hidden;
  position: relative;
}
.containerStore .sectionStore .sectionCard .cardProducts .article:hover > .outFit {
  transform: scale(110%);
  filter: grayscale(100%);
  box-shadow: 0 0 4px 2px #707070;
}
.containerStore .sectionStore .sectionCard .cardProducts .article:hover > .soldOutLabel {
  background-color: #bc2327;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .soldOutLabel {
  transform: skew(-15deg, 0deg);
  position: absolute;
  top: 0px;
  right: -5px;
  padding: 5px 10px;
  background-color: #000000;
  color: #ffffff;
  font-weight: 500;
  font-family: "Jura", sans-serif;
  transition: 0.3s ease-in-out;
  z-index: 1;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .info {
  width: 101%;
  color: #191919;
  font-weight: 500;
  font-family: "Jura", sans-serif;
  padding: 10px;
  background-color: #ffffff;
  gap: 5px;
  transform: translateY(0%);
  transition: transform 0.3s ease-in-out;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .info .heartIcon {
  width: 20px;
  align-self: self-end;
  cursor: pointer;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .info .linkStore {
  width: 100%;
  text-align: center;
  padding: 10px;
  color: #ffffff;
  font-weight: 600;
  font-family: "Jura", sans-serif;
  background-color: #bc2327;
  border: 1px solid #bc2327;
  text-decoration: none;
  transition: 0.3s ease-in-out;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .info .linkStore:hover {
  color: #ffffff;
  background-color: #000000;
  border: 1px solid #000000;
  cursor: pointer;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .info .price {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
}
.containerStore .sectionStore .sectionCard .cardProducts .article .outFit {
  width: 100%;
  max-width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  vertical-align: middle;
  filter: grayscale(10%);
  box-shadow: 0 0 4px 2px #707070;
  transition: all 0.3s ease;
}
.containerStore .arrowUp {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 8;
}
.containerStore .arrowUp .directionUp .arrowUpIcon {
  width: 32px;
  border-radius: 50%;
  background-color: #6b6b6b;
  border: 2px solid #6b6b6b;
  transition: all 0.3s ease;
}
.containerStore .arrowUp .directionUp .arrowUpIcon:hover {
  background-color: #bc2327;
  border: 2px solid #bc2327;
}
.containerStore .skullSocialMedia {
  position: fixed;
  bottom: 30px;
  left: 30px;
}
.containerStore .skullSocialMedia .socialMedia #socialSkull {
  display: none;
}
.containerStore .skullSocialMedia .socialMedia #socialSkull:checked ~ ul {
  opacity: 1;
  visibility: visible;
  transform: translateY(-100px);
}
.containerStore .skullSocialMedia .socialMedia .label .skullIcon {
  width: 32px;
  cursor: pointer;
  position: fixed;
  bottom: 30px;
  left: 30px;
  z-index: 8;
  transition: 0.3s ease-in-out;
}
.containerStore .skullSocialMedia .socialMedia .label .skullIcon:hover {
  transform: translateY(0%) scale(105%);
  filter: drop-shadow(0 0 6px #696061) grayscale(100%);
}
.containerStore .skullSocialMedia .socialMedia ul {
  position: relative;
  bottom: 30px;
  left: -30px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(35%);
  transition: 0.3s ease-in-out;
}
.containerStore .skullSocialMedia .socialMedia ul li {
  list-style-type: none;
}
.containerStore .skullSocialMedia .socialMedia ul li .item .itemSocial {
  width: 32px;
  text-decoration: none;
  margin: 5px 0px;
  filter: grayscale(0%);
  transform: scale(100%, 100%);
  transition: 0.3s ease-in-out;
}
.containerStore .skullSocialMedia .socialMedia ul li .item .itemSocial:hover {
  transform: scale(110%, 110%);
  filter: drop-shadow(0 0 6px #696061) grayscale(100%);
}

.newArrivals {
  width: 100%;
  max-width: 1300px;
  height: auto;
}
.newArrivals .subtitle {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #BC2327;
  text-align: center;
  margin-bottom: 100px;
}
.newArrivals .sectionCardContainer {
  width: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(1, 1fr);
  row-gap: 70px;
  margin-bottom: 70px;
}
.newArrivals .sectionCardContainer .cardProducts {
  width: 100%;
  position: relative;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article2 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article3 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article4 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article5 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article6 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article7 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article8 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article9 .smallCard, .newArrivals .sectionCardContainer .cardProducts .article10 .smallCard {
  display: none;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article2 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article3 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article4 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article5 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article6 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article7 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article8 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article9 .smallCard .outFit, .newArrivals .sectionCardContainer .cardProducts .article10 .smallCard .outFit {
  width: 100%;
  height: auto;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article2 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article3 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article4 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article5 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article6 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article7 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article8 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article9 .nameOut, .newArrivals .sectionCardContainer .cardProducts .article10 .nameOut {
  color: #bc2327;
  font-size: 1.8rem;
  font-weight: 400;
  font-family: "Rubik Distressed", cursive;
  position: absolute;
  top: 20px;
  left: 5%;
  z-index: -1;
}
.newArrivals .sectionCardContainer .cardProducts .article1 #outFit, .newArrivals .sectionCardContainer .cardProducts .article2 #outFit, .newArrivals .sectionCardContainer .cardProducts .article3 #outFit, .newArrivals .sectionCardContainer .cardProducts .article4 #outFit, .newArrivals .sectionCardContainer .cardProducts .article5 #outFit, .newArrivals .sectionCardContainer .cardProducts .article6 #outFit, .newArrivals .sectionCardContainer .cardProducts .article7 #outFit, .newArrivals .sectionCardContainer .cardProducts .article8 #outFit, .newArrivals .sectionCardContainer .cardProducts .article9 #outFit, .newArrivals .sectionCardContainer .cardProducts .article10 #outFit {
  width: 100%;
  height: auto;
  transition: 0.3s ease-in-out;
}
.newArrivals .sectionCardContainer .cardProducts .article1 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article2 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article3 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article4 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article5 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article6 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article7 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article8 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article9 #outFit:hover, .newArrivals .sectionCardContainer .cardProducts .article10 #outFit:hover {
  content: "";
  transform: translateY(40px);
  filter: blur(2px) grayscale(60%);
}
.newArrivals .sectionCardContainer .cardProducts .article1 .new, .newArrivals .sectionCardContainer .cardProducts .article2 .new, .newArrivals .sectionCardContainer .cardProducts .article3 .new, .newArrivals .sectionCardContainer .cardProducts .article4 .new, .newArrivals .sectionCardContainer .cardProducts .article5 .new, .newArrivals .sectionCardContainer .cardProducts .article6 .new, .newArrivals .sectionCardContainer .cardProducts .article7 .new, .newArrivals .sectionCardContainer .cardProducts .article8 .new, .newArrivals .sectionCardContainer .cardProducts .article9 .new, .newArrivals .sectionCardContainer .cardProducts .article10 .new {
  display: none;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article2 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article3 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article4 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article5 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article6 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article7 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article8 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article9 .new:checked + .smallCard, .newArrivals .sectionCardContainer .cardProducts .article10 .new:checked + .smallCard {
  display: flex;
  flex-direction: column;
  width: 85%;
  height: auto;
  padding: 10px;
  background-color: #f3f3f3;
  border-radius: 5px;
  text-decoration: none;
  position: absolute;
  top: 70px;
  right: 30px;
  box-shadow: 0 0 3px 1px #474747;
  z-index: 1;
  transition: 0.3s ease-in-out;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article2 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article3 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article4 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article5 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article6 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article7 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article8 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article9 .new:checked + .smallCard:hover, .newArrivals .sectionCardContainer .cardProducts .article10 .new:checked + .smallCard:hover {
  box-shadow: 0 0 4px 3px #474747;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article2 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article3 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article4 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article5 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article6 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article7 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article8 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article9 .new:checked + .smallCard .price, .newArrivals .sectionCardContainer .cardProducts .article10 .new:checked + .smallCard .price {
  height: 20px;
  color: #bc2327;
  font-size: 1rem;
  font-weight: 700;
  font-family: "Jura", sans-serif;
  text-align: left;
  margin-top: 10px;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article2 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article3 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article4 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article5 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article6 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article7 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article8 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article9 .fadeAway .skull, .newArrivals .sectionCardContainer .cardProducts .article10 .fadeAway .skull {
  width: 35px;
  position: absolute;
  top: 30px;
  right: 10px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  cursor: pointer;
  z-index: 1;
  cursor: help;
  animation: skull 2s linear infinite;
  transform: scale(100%);
  transition: transform 0.3s ease;
}
.newArrivals .sectionCardContainer .cardProducts .article1 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article2 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article3 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article4 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article5 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article6 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article7 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article8 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article9 .fadeAway .skull:hover, .newArrivals .sectionCardContainer .cardProducts .article10 .fadeAway .skull:hover {
  transform: scale(103%);
}
@keyframes skull {
  0% {
    box-shadow: 0 0 1px 1px #ffffff;
  }
  25% {
    box-shadow: 0 0 3px 2px #f0f0f0;
  }
  50% {
    box-shadow: 0 0 5px 4px #e4e4e4;
  }
  80% {
    box-shadow: 0 0 6px 6px #d1d1d1;
  }
  100% {
    box-shadow: 0 0 7px 8px #b4b4b4;
  }
}
.container {
  width: 100vh;
  height: auto;
}
.container .logInCreateAccount {
  width: 100vw;
  display: grid;
  grid-template-columns: repeat(2, 1fraction);
  grid-template-rows: repeat(1, 1fraction);
  align-items: center;
  z-index: 9;
}
.container .logInCreateAccount .tags {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
}
.container .logInCreateAccount .tags #navBarMenu {
  display: none;
}
.container .logInCreateAccount .tags #navBarMenu:checked ~ .formCreateAccount {
  transform: translate(0%);
}
.container .logInCreateAccount .tags #navBarMenu:checked ~ .formLogIn {
  transform: translate(-100%);
  z-index: 10;
}
.container .logInCreateAccount .tags .formCreateAccount {
  width: 50vw;
  height: 100vh;
  background-color: #ffffff;
  margin: 0px auto;
  position: fixed;
  top: 0;
  left: 0;
  transform: translate(-100%);
  transition: 0.3s ease-in-out;
  z-index: 1;
}
.container .logInCreateAccount .tags .formCreateAccount .tag {
  position: fixed;
  top: -10px;
  right: -49px;
  transform: rotate(180deg);
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  z-index: 9;
}
.container .logInCreateAccount .tags .formCreateAccount .tag .tagCreateAccount {
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  text-align: center;
  writing-mode: vertical-rl;
  text-orientation: right;
  transform: rotate(180deg);
  font-weight: 600;
  cursor: pointer;
  background-color: #000000;
  padding: 20px 15px;
  transition: 0.3s ease-in-out;
}
.container .logInCreateAccount .tags .formLogIn {
  width: 50%;
  height: 100vh;
  gap: 15px;
  background-color: #ffffff;
  margin: 0px auto;
  position: fixed;
  top: 0;
  left: 0;
  transform: translate(0%);
  transition: 0.3s ease-in-out;
  z-index: 1;
}
.container .logInCreateAccount .tags .formLogIn .tag {
  position: fixed;
  top: -10px;
  right: -49px;
  transform: rotate(180deg);
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  z-index: 9;
}
.container .logInCreateAccount .tags .formLogIn .tag .tagLogIn {
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  text-align: center;
  writing-mode: vertical-rl;
  text-orientation: right;
  transform: rotate(180deg);
  font-weight: 600;
  cursor: pointer;
  background-color: #000000;
  padding: 20px 15px;
  transition: 0.3s ease-in-out;
}
.container .logInCreateAccount .tags .formLogIn legend {
  font-size: 3rem;
  color: #bc2327;
  font-family: "Rubik Distressed", cursive;
  text-align: center;
}
.container .logInCreateAccount .tags .formLogIn .formFloating {
  width: 60%;
  max-width: 426px;
  color: #000000;
  font-family: "Jura", sans-serif;
  font-size: 0.9rem;
  font-weight: 400;
  padding: 0px auto;
}
.container .logInCreateAccount .tags .formLogIn .formFloating .formControl {
  width: 100%;
  color: #9a9a9a;
  font-size: 0.8rem;
  font-weight: 300;
  font-family: "Jura", sans-serif;
  padding: 10px 0px 10px 10px;
  border-top: transparent;
  border-right: transparent;
  border-left: transparent;
  border-bottom: 1px solid #9c9c9c;
}
.container .logInCreateAccount .tags .formLogIn .ctaToSignIn {
  width: 60%;
  max-width: 426px;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 30px;
  gap: 10px;
}
.container .logInCreateAccount .tags .formLogIn .ctaToSignIn .btnSignIn {
  width: 100%;
  font-size: 1rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
  padding: 10px;
  background-color: #000000;
  border: 1px solid #000000;
  transition: 0.3s ease-in-out;
}
.container .logInCreateAccount .tags .formLogIn .ctaToSignIn .btnSignIn:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
}
.container .logInCreateAccount .tags .formLogIn .ctaToSignIn p {
  color: #9a9a9a;
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 500;
  margin-top: 15px;
  margin-bottom: -25px;
  text-align: center;
}
.container .logInCreateAccount .tags .formLogIn label .ctaFormCreateAccount {
  font-size: 0.8rem;
  font-weight: 700;
  color: #191919;
  font-family: "Jura", sans-serif;
  text-decoration: none;
}
.container .logInCreateAccount .tags .formLogIn label .ctaFormCreateAccount:hover {
  text-decoration: underline;
  color: #bc2327;
}
.container .logInCreateAccount .tags .formLogIn .skullIcon {
  width: 32px;
  margin-top: -20px;
}
.container .logInCreateAccount .tags .formCreateAccount legend {
  font-size: 3rem;
  color: #bc2327;
  font-family: "Rubik Distressed", cursive;
  text-align: center;
  padding-bottom: 10px;
}
.container .logInCreateAccount .tags .formCreateAccount .formFloating {
  width: 60%;
  max-width: 426px;
  color: #000000;
  font-size: 0.9rem;
  font-weight: 400;
  font-family: "Jura", sans-serif;
  padding: 0px auto;
}
.container .logInCreateAccount .tags .formCreateAccount .formFloating .formControl {
  width: 100%;
  color: #9a9a9a;
  font-size: 0.8rem;
  font-weight: 300;
  font-family: "Jura", sans-serif;
  padding: 10px 0px 10px 10px;
  border-top: transparent;
  border-right: transparent;
  border-left: transparent;
  border-bottom: 1px solid #9c9c9c;
}
.container .logInCreateAccount .tags .formCreateAccount .ctaToCreateAccount {
  width: 60%;
  max-width: 426px;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 30px;
  gap: 10px;
}
.container .logInCreateAccount .tags .formCreateAccount .ctaToCreateAccount .btnCreateAccount {
  width: 100%;
  font-size: 1rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
  padding: 10px;
  background-color: #000000;
  border: 1px solid #000000;
  transition: 0.3s ease-in-out;
}
.container .logInCreateAccount .tags .formCreateAccount .ctaToCreateAccount .btnCreateAccount:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
}
.container .logInCreateAccount .tags .formCreateAccount .ctaToCreateAccount p {
  color: #9a9a9a;
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 500;
  margin-top: 15px;
  margin-bottom: -10px;
  text-align: center;
}
.container .logInCreateAccount .tags .formCreateAccount label .ctaFormLogIn {
  font-size: 0.8rem;
  font-weight: 700;
  color: #191919;
  font-family: "Jura", sans-serif;
  text-decoration: none;
}
.container .logInCreateAccount .tags .formCreateAccount label .ctaFormLogIn:hover {
  text-decoration: underline;
  color: #bc2327;
}
.container .logInCreateAccount .tags .formCreateAccount .skullIcon {
  width: 32px;
  margin-top: -5px;
}
.container .logInCreateAccount .bannerCreateAccount {
  width: 50%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
}
.container .logInCreateAccount .bannerCreateAccount .background {
  width: 100%;
  height: 100vh;
  object-fit: cover;
  transition: 0.3s ease-in-out;
  animation: background 7s linear infinite alternate-reverse;
}
@keyframes background {
  0% {
    filter: grayscale(0%);
  }
  25% {
    filter: grayscale(25%);
  }
  50% {
    filter: grayscale(50%);
  }
  75% {
    filter: grayscale(75%);
  }
  100% {
    filter: grayscale(100%);
  }
  100% {
    filter: grayscale(100%);
  }
  75% {
    filter: grayscale(75%);
  }
  50% {
    filter: grayscale(50%);
  }
  25% {
    filter: grayscale(25%);
  }
  0% {
    filter: grayscale(0%);
  }
}

.headerSignIn {
  width: 20vw;
  height: 100vh;
  position: relative;
}
.headerSignIn .menuIcons {
  width: 49.19px;
  height: 100vh;
  position: fixed;
  top: 0px;
  right: 0%;
  z-index: 8;
  background-color: #000000;
  animation: getoff 0.5s linear;
}
@keyframes getoff {
  0% {
    transform: translate(100%);
  }
  100% {
    transform: translate(0%);
  }
}
.headerSignIn .menuIcons ul {
  padding: 5px 0px;
  position: relative;
}
.headerSignIn .menuIcons ul li {
  list-style-type: none;
  padding: 10px 0px;
}
.headerSignIn .menuIcons ul li .wishHeadLine .wishlistIcon, .headerSignIn .menuIcons ul li .wishHeadLine .cartIcon, .headerSignIn .menuIcons ul li .cartShop .wishlistIcon, .headerSignIn .menuIcons ul li .cartShop .cartIcon {
  cursor: pointer;
  transform: scale(100%);
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuIcons ul li .wishHeadLine .wishlistIcon:hover, .headerSignIn .menuIcons ul li .wishHeadLine .cartIcon:hover, .headerSignIn .menuIcons ul li .cartShop .wishlistIcon:hover, .headerSignIn .menuIcons ul li .cartShop .cartIcon:hover {
  transform: scale(120%);
  filter: drop-shadow(0 0 10px #696061);
}
.headerSignIn .menuIcons ul li .menu, .headerSignIn .menuIcons ul li .wishHeadLine, .headerSignIn .menuIcons ul li .cartShop {
  cursor: pointer;
  order: 2;
}
.headerSignIn .menuIcons ul li .menu:hover + .toolTip, .headerSignIn .menuIcons ul li .wishHeadLine:hover + .toolTip, .headerSignIn .menuIcons ul li .cartShop:hover + .toolTip {
  opacity: 1;
  visibility: visible;
  transform: translate(0%);
}
.headerSignIn .menuIcons ul li .toolTip {
  width: auto;
  height: auto;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: -80px;
  background-color: rgb(0, 0, 0);
  transform: translate(-100%);
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuIcons ul li .toolTip .toolTipMessage {
  margin: 5px 10px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
}
.headerSignIn .menuIcons ul li .toolTip .clipPath {
  width: 30px;
  height: 30px;
  background-color: #000000;
  clip-path: polygon(30% 50%, 0 70%, 0 30%);
  position: absolute;
  top: -2px;
  right: -30px;
}
.headerSignIn #menuSide {
  display: none;
}
.headerSignIn #menuSide:checked ~ .menuSide {
  transform: translate(0%);
}
.headerSignIn .menuSide {
  width: 20vw;
  height: 100vh;
  position: fixed;
  top: 0%;
  right: 0%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  background-color: #1b1b1b;
  overflow: hidden;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 10;
  transform: translate(105%);
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuSide .top {
  width: 100%;
  background-color: #191919;
  padding: 10px 10px 10px 30px;
}
.headerSignIn .menuSide .top .brand {
  width: 32px;
  order: 2;
}
.headerSignIn .menuSide .top label .close {
  width: 25px;
  cursor: pointer;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuSide .top label .close:hover {
  transform: rotate(90deg);
}
.headerSignIn .menuSide .menu {
  width: 100%;
}
.headerSignIn .menuSide .menu ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: 0;
}
.headerSignIn .menuSide .menu ul li {
  width: 100%;
  list-style-type: none;
  cursor: pointer;
  background-color: #191919;
}
.headerSignIn .menuSide .menu ul li .link {
  display: block;
  width: inherit;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  padding-right: 100px;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  text-decoration: none;
}
.headerSignIn .menuSide .menu ul li .link:hover {
  background-color: rgba(188, 35, 40, 0.3490196078);
}
.headerSignIn .menuSide .menu ul li .cartShop {
  width: 100%;
  cursor: pointer;
}
.headerSignIn .menuSide .menu ul li .cartShop .link {
  display: block;
  width: 100%;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  margin: 0px auto 0px 0px;
  padding-bottom: 15px;
  border-bottom: 1px solid #3d3d3d;
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuSide .menu ul li .cartShop .link:hover {
  background-color: rgba(188, 35, 40, 0.3490196078);
}
.headerSignIn .menuSide .contactUs {
  width: 100%;
  margin-bottom: 80px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-start;
  background-color: #191919;
  padding-top: 10px;
}
.headerSignIn .menuSide .contactUs p {
  width: 100%;
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  font-weight: 600;
  padding-left: 30px;
  border-bottom: 1px solid #3d3d3d;
  padding-bottom: 15px;
}
.headerSignIn .menuSide .contactUs ul {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding-left: 30px;
  padding-right: 30px;
}
.headerSignIn .menuSide .contactUs ul li {
  display: block;
  list-style-type: none;
}
.headerSignIn .menuSide .contactUs ul li .item {
  text-decoration: none;
}
.headerSignIn .menuSide .contactUs ul li .item .itemSocial {
  width: 32px;
  filter: grayscale(0%);
  transform: scale(100%, 100%);
  transition: 0.3s ease-in-out;
}
.headerSignIn .menuSide .contactUs ul li .item .itemSocial:hover {
  transform: scale(110%, 110%);
  filter: drop-shadow(0 0 10px black) grayscale(100%);
}

.getOffSignIn {
  width: 100%;
  height: 100%;
}
.getOffSignIn #cross {
  display: none;
}
.getOffSignIn #cross:checked ~ .bannerGetOff {
  transform: translateY(0%);
}
.getOffSignIn .bannerGetOff {
  width: 65vw;
  max-width: fit-content;
  height: auto;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.0745098039);
  box-shadow: 0 0 10px 6px #070707;
  position: fixed;
  top: 20%;
  left: 0%;
  right: 0px;
  margin: auto;
  z-index: 8;
  transform: translateY(500%);
  overflow: hidden;
  transition: 0.3s ease-in-out;
}
.getOffSignIn .bannerGetOff .title {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  margin-top: 20px;
}
.getOffSignIn .bannerGetOff label {
  width: auto;
  align-self: self-end;
}
.getOffSignIn .bannerGetOff label .crossCloseWhite {
  width: 25px;
  cursor: pointer;
  z-index: 10;
  background-color: #000000;
  border-radius: 50%;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.getOffSignIn .bannerGetOff label .crossCloseWhite:hover {
  transform: rotate(90deg);
}
.getOffSignIn .bannerGetOff .slideGetOff {
  padding: 20px 20px 0px;
  backdrop-filter: blur(10px);
}
.getOffSignIn .bannerGetOff .slideGetOff .hoddy {
  padding: 10px;
}
.getOffSignIn .bannerGetOff .slideGetOff .hoddy img {
  width: 100%;
  height: fit-content;
  object-fit: cover;
}
.getOffSignIn .bannerGetOff .slideGetOff .hoddy h3 {
  margin-top: 30px;
  font-size: 1.1rem;
  font-family: "Jura", sans-serif;
  color: #BC2327;
}
.getOffSignIn .bannerGetOff .slideGetOff .hoddy p {
  padding: 10px auto;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #d9d9d9;
}
.getOffSignIn .bannerGetOff::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8980392157);
  backdrop-filter: blur(10px);
  filter: blur(10px);
  z-index: -1;
  border-radius: 10px;
}
.getOffSignIn .bannerGetOff > * {
  position: relative;
}

#order {
  display: none;
  font-family: "Jura", sans-serif;
}
#order:checked ~ .sectionPlaceOrder {
  transform: translateY(0%);
}

.sectionPlaceOrder {
  width: 65vw;
  max-width: fit-content;
  height: auto;
  position: fixed;
  top: 22%;
  left: 0%;
  right: 0px;
  margin: auto;
  background-color: rgba(243, 243, 243, 0.1098039216);
  box-shadow: 0 0 4px 2px #525252;
  padding-top: 0px;
  padding-bottom: 20px;
  font-family: "Jura", sans-serif;
  z-index: 99;
  transform: translateY(-260%);
  border-radius: 10px;
  transition: 0.3s ease-in-out;
  overflow: hidden;
}
.sectionPlaceOrder .orderCross {
  width: auto;
  align-self: self-end;
}
.sectionPlaceOrder .orderCross .crossCloseWhite {
  width: 25px;
  cursor: pointer;
  background-color: black;
  border-radius: 50%;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.sectionPlaceOrder .orderCross .crossCloseWhite:hover {
  transform: rotate(90deg);
}
.sectionPlaceOrder .unionOrder {
  width: 92%;
  height: 100%;
  overflow: hidden;
  gap: 20px;
}
.sectionPlaceOrder .unionOrder .delivery {
  width: 50%;
  height: 350px;
  padding: 15px;
  background-color: #ffffff;
  border-radius: 10px;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact {
  width: 100%;
  gap: 4px;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact fieldset {
  width: 100%;
  height: auto;
  padding: 0px;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact fieldset label {
  width: 100%;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact fieldset label input {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 15px;
  font-size: 0.8rem;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  color: #9a9a9a;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact .contactTitle, .sectionPlaceOrder .unionOrder .delivery .deliveryContact .deliveryTitle {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #bc2327;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact .deliveryTitle {
  margin-top: 5px;
}
.sectionPlaceOrder .unionOrder .delivery .deliveryContact .fullName {
  width: 100%;
  gap: 10px;
}
.sectionPlaceOrder .unionOrder .delivery .creditCards {
  margin: 10px 0px 5px 15px;
}
.sectionPlaceOrder .unionOrder .delivery .creditCards .transactions {
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #bc2327;
}
.sectionPlaceOrder .unionOrder .delivery .creditCards .paymentCards {
  width: 75%;
}
.sectionPlaceOrder .unionOrder .formPayment {
  width: 50%;
  height: 350px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  background-color: #ffffff;
  padding: 15px;
  border-radius: 10px;
  row-gap: 4px;
}
.sectionPlaceOrder .unionOrder .formPayment .paymentTitle {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #bc2327;
}
.sectionPlaceOrder .unionOrder .formPayment fieldset {
  width: 100%;
  height: auto;
  padding: 0px;
}
.sectionPlaceOrder .unionOrder .formPayment fieldset label {
  width: 100%;
}
.sectionPlaceOrder .unionOrder .formPayment fieldset label input {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 15px;
  font-size: 0.8rem;
  color: #9a9a9a;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
}
.sectionPlaceOrder .unionOrder .formPayment fieldset select {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  font-size: 0.8rem;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
}
.sectionPlaceOrder .unionOrder .formPayment fieldset .cardNumbers {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}
.sectionPlaceOrder .unionOrder .formPayment .expirateDateCvc {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}
.sectionPlaceOrder .unionOrder .formPayment .btnPlaceOnOrder {
  width: 100%;
  padding: 10px 20px;
  margin: 75px auto 0px;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #ffffff;
  border: 1px solid #000000;
  background-color: #000000;
  transition: 0.3s ease-in-out;
}
.sectionPlaceOrder .unionOrder .formPayment .btnPlaceOnOrder:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
  font-weight: 600;
}

.sectionPlaceOrder::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5058823529);
  backdrop-filter: blur(25px);
  filter: blur(10px);
  z-index: -1;
  border-radius: 10px;
}

.sectionPlaceOrder > * {
  position: relative;
}

#messageContainer, #messageNewProduct {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: fixed;
  top: 10%;
  right: 3%;
  z-index: 99;
}
#messageContainer div .messageWishlist, #messageContainer div .stockProduct, #messageNewProduct div .messageWishlist, #messageNewProduct div .stockProduct {
  background-color: rgba(241, 241, 241, 0.8196078431);
  color: #000000;
}
#messageContainer div .stockProduct, #messageNewProduct div .stockProduct {
  color: #ffffff;
  background-color: rgba(107, 107, 107, 0.8196078431);
}

#out-of-stock-message {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: fixed;
  bottom: 10%;
  right: 3%;
  z-index: 99;
}
#out-of-stock-message div .soldOutProduct {
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.8196078431);
  animation: slideUp 11000ms linear 0.4s;
}
@keyframes slideUp {
  0% {
    transform: translateY(0%);
  }
  25% {
    transform: translateY(-150%);
  }
  50% {
    transform: translateY(-350%);
  }
  75% {
    transform: translateY(-550%);
  }
  100% {
    transform: translateY(-750%);
  }
}

.swal2-container .swal2-popup {
  width: 30vw;
  height: auto;
  background-color: #ffffff;
  border-radius: 10px;
}
.swal2-container .swal2-popup .swal2-title {
  font-size: 1.8rem;
  font-weight: 600;
  color: #bc2327;
  font-family: "Jura", sans-serif;
}
.swal2-container .swal2-popup .swal2-html-container {
  font-size: 0.9rem;
  font-weight: 400;
  color: #6b6b6b;
  font-family: "Jura", sans-serif;
}
.swal2-container .swal2-actions {
  width: 80%;
}
.swal2-container .swal2-actions .swal2-confirm {
  width: 100%;
  font-size: 1rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
  background-color: #000000;
  padding: 10px;
  border: 1px solid #000000;
  box-shadow: none;
  border-radius: 0%;
  transition: 0.3s ease-in-out;
}
.swal2-container .swal2-actions .swal2-confirm:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
}

.sectionFilter .menuFilterSide {
  width: 100%;
}
.sectionFilter .menuFilterSide #filterSide {
  display: none;
}
.sectionFilter .menuFilterSide #filterSide:checked ~ .menuFilter {
  transform: translate(0%);
}
.sectionFilter .menuFilterSide .headLine {
  position: relative;
}
.sectionFilter .menuFilterSide .headLine .filter {
  position: fixed;
  top: 70px;
  left: 20px;
  z-index: 5;
  padding: 5px;
  cursor: pointer;
}
.sectionFilter .menuFilterSide .headLine .filter .filterIcon {
  width: 35px;
  background-color: #f1f1f1;
  border-radius: 50%;
  padding: 5px;
  margin: 5px;
  box-shadow: 0 0 4px 2px #707070;
}
.sectionFilter .menuFilterSide .headLine .filter .filterIcon:hover + .filterWord {
  opacity: 1;
  visibility: visible;
  transform: translateY(100%);
}
.sectionFilter .menuFilterSide .headLine .filter .filterWord {
  opacity: 0;
  visibility: hidden;
  font-size: 0.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #ffffff;
  background-color: #000000;
  padding: 5px 15px;
  position: absolute;
  top: 33px;
  left: -5px;
  transform: translateY(50%);
  transition: all 0.3s ease-in-out;
}
.sectionFilter .menuFilterSide .headLine .filter .filterWord .clipPath {
  width: 30px;
  height: 30px;
  background-color: #000000;
  clip-path: polygon(50% 70%, 20% 100%, 80% 100%);
  position: absolute;
  top: -29px;
  left: 18px;
}
.sectionFilter .menuFilterSide .subtitle {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #9a9a9a;
  font-weight: 400;
  padding: 5px;
  margin: 50px 0px;
}
.sectionFilter .menuFilterSide .menuFilter {
  width: 20vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #ffffff;
  overflow: hidden;
  box-shadow: 0 0 10px 6px #070707;
  z-index: 10;
  transform: translate(-105%);
  transition: 0.3s ease-in-out;
}
.sectionFilter .menuFilterSide .menuFilter label .closeCross {
  width: 15px;
  cursor: pointer;
  position: absolute;
  top: 20px;
  right: 25px;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.sectionFilter .menuFilterSide .menuFilter label .closeCross:hover {
  transform: rotate(90deg);
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter {
  width: 90%;
  margin: 0px auto;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .filterWord {
  width: inherit;
  font-size: 1.2rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  margin: 0px auto;
  padding-bottom: 30px;
  border-bottom: 1px solid #e4e4e4;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing {
  width: inherit;
  margin: 0px auto;
  padding: 30px 0px;
  border-bottom: 1px solid #e4e4e4;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .titleAvailability, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .titlePricing, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .titleAvailability, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .titlePricing {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  font-weight: 600;
  margin: 15px 0px;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing {
  font-size: 0.9rem;
  font-family: "Jura", sans-serif;
  color: #191919;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .availability input, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionAvailability .pricing input, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .availability input, .sectionFilter .menuFilterSide .menuFilter .choiceFilter .sectionPricing .pricing input {
  width: 16px;
  height: 16px;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .btnFilter {
  width: 90%;
  padding: 10px 20px;
  margin: 30px auto;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  font-weight: 600;
  color: #ffffff;
  border: 1px solid transparent;
  background-color: #000000;
  transition: 0.3s ease-in-out;
}
.sectionFilter .menuFilterSide .menuFilter .choiceFilter .btnFilter:hover {
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #000000;
  font-weight: 600;
}

.bannerShipping {
  width: 100%;
  margin-top: -30px;
}
.bannerShipping .shipping {
  width: fit-content;
  height: auto;
  margin: auto;
  color: #ffffff;
  font-size: 0.8rem;
  font-weight: 700;
  font-family: "Jura", sans-serif;
  text-align: 700;
  text-transform: uppercase;
  background-color: #000000;
  animation: shipping 4000ms linear;
}
@keyframes shipping {
  0% {
    transform: translateX(-250%);
  }
  20% {
    transform: translateX(-200%);
  }
  40% {
    transform: translateX(-150%);
  }
  60% {
    transform: translateX(-100%);
  }
  80% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0%);
  }
}

.showRoom {
  width: 90%;
  max-width: 1225px;
  height: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  margin: 50px auto 150px;
  font-family: "Jura", sans-serif;
  gap: 20px;
}
.showRoom .leftSide, .showRoom .rightSide {
  width: 100%;
  height: auto;
}
.showRoom .leftSide {
  width: 40%;
  position: sticky;
  top: 80px;
  left: 0;
}
.showRoom .leftSide .itemProduct {
  width: 100%;
  height: auto;
  object-fit: cover;
  transition: 0.3s ease-in-out;
}
.showRoom .leftSide .itemProduct:hover {
  filter: contrast(115%);
}
.showRoom .rightSide {
  width: 60%;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.showRoom .rightSide .infoProduct {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  gap: 20px;
}
.showRoom .rightSide .infoProduct .productRating {
  width: 100%;
  padding: 15px;
  background-color: #f1f1f1;
}
.showRoom .rightSide .infoProduct .productRating .product {
  font-size: 1rem;
  font-weight: 700;
  color: #000000;
  margin: 0px;
}
.showRoom .rightSide .infoProduct .productRating .rating {
  width: 90px;
}
.showRoom .rightSide .infoProduct .color {
  width: 100%;
  height: auto;
  margin: 10px auto;
}
.showRoom .rightSide .infoProduct .color .titleColor {
  font-size: 1.2rem;
  font-weight: 700;
  color: #000000;
  margin-bottom: 20px;
}
.showRoom .rightSide .infoProduct .color .containerColor {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
  position: relative;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic {
  position: relative;
  cursor: pointer;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .toolTip {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: -40%;
  left: 10px;
  transform: translateY(100%);
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .toolTip p {
  background-color: #000000;
  padding: 5px 10px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .toolTip .clipPath {
  width: 30px;
  height: 30px;
  background-color: #000000;
  clip-path: polygon(49% 30%, 20% 0, 80% 0);
  position: absolute;
  top: 25px;
  left: 10px;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .itemProduct {
  width: 70px;
  height: auto;
  object-fit: cover;
  border: 1px solid #f1f1f1;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .itemProduct:hover {
  border: 1px solid #000000;
}
.showRoom .rightSide .infoProduct .color .containerColor .smallPic .itemProduct:hover + .toolTip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0%);
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite {
  cursor: pointer;
  width: 70px;
  height: 104px;
  position: relative;
  background-color: #3d3d3d;
  border: 1px solid #f1f1f1;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack:hover, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite:hover {
  border: 1px solid #000000;
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack:hover > .toolTip, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite:hover > .toolTip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0%);
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack .toolTip, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite .toolTip {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: -40%;
  left: 10px;
  transform: translateY(100%);
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack .toolTip p, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite .toolTip p {
  background-color: #000000;
  padding: 5px 10px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
}
.showRoom .rightSide .infoProduct .color .containerColor .colorBlack .toolTip .clipPath, .showRoom .rightSide .infoProduct .color .containerColor .colorWhite .toolTip .clipPath {
  width: 30px;
  height: 30px;
  background-color: #000000;
  clip-path: polygon(49% 30%, 20% 0, 80% 0);
  position: absolute;
  top: 25px;
  left: 10px;
}
.showRoom .rightSide .infoProduct .color .containerColor .colorWhite {
  background-color: #ffffff;
}
.showRoom .rightSide .infoProduct .size {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  margin: 10px auto;
}
.showRoom .rightSide .infoProduct .size .titleSize {
  font-size: 1.2rem;
  font-weight: 700;
  color: #000000;
  margin-bottom: 20px;
}
.showRoom .rightSide .infoProduct .size .containerSize {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
}
.showRoom .rightSide .infoProduct .size .containerSize .itemSize {
  width: 80px;
  height: 60px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  color: #000000;
  background-color: #f1f1f1;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .size .containerSize .itemSize:hover {
  border: 1px solid #000000;
}
.showRoom .rightSide .infoProduct .addToCart {
  width: 100%;
  gap: 20px;
  margin: 20px auto;
  position: relative;
}
.showRoom .rightSide .infoProduct .addToCart .btnAddToCart {
  width: 100%;
  height: 50px;
  color: #f1f1f1;
  padding: 15px;
  font-size: 1rem;
  font-weight: 700;
  border: 1px solid black;
  background-color: #000000;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .addToCart .btnAddToCart:hover {
  color: #000000;
  border: 1px solid #000000;
  background-color: #ffffff;
}
.showRoom .rightSide .infoProduct .addToCart .wishlistIcon {
  width: 50px;
  cursor: pointer;
  padding-top: 11px;
  padding-right: 11px;
  padding-left: 11px;
  padding-bottom: 11px;
  border: 1px solid #f1f1f1;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .addToCart .wishlistIcon:hover {
  border: 1px solid #000000;
}
.showRoom .rightSide .infoProduct .addToCart .wishlistIcon:hover + .toolTip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0%);
}
.showRoom .rightSide .infoProduct .addToCart .toolTip {
  width: auto;
  height: auto;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: -80%;
  right: -10px;
  background-color: #000000;
  transform: translateY(100%);
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .addToCart .toolTip .toolTipMessage {
  margin: 5px 10px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #ffffff;
  font-family: "Jura", sans-serif;
}
.showRoom .rightSide .infoProduct .addToCart .toolTip .clipPath {
  width: 30px;
  height: 30px;
  background-color: #000000;
  clip-path: polygon(49% 30%, 20% 0, 80% 0);
  position: absolute;
  top: 25px;
  left: 18px;
}
.showRoom .rightSide .infoProduct .complementInfo {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
  color: #000000;
  font-size: 0.8rem;
  font-weight: 700;
  text-align: center;
  margin: 20px auto 0px;
}
.showRoom .rightSide .infoProduct .complementInfo .delivery, .showRoom .rightSide .infoProduct .complementInfo .creditCard, .showRoom .rightSide .infoProduct .complementInfo .return {
  width: 100%;
  height: auto;
  cursor: pointer;
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .infoProduct .complementInfo .delivery:hover > .deliveryIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard:hover > .deliveryIcon, .showRoom .rightSide .infoProduct .complementInfo .return:hover > .deliveryIcon {
  transform: scale(109%);
}
.showRoom .rightSide .infoProduct .complementInfo .delivery:hover > .creditCardIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard:hover > .creditCardIcon, .showRoom .rightSide .infoProduct .complementInfo .return:hover > .creditCardIcon {
  transform: scale(109%);
}
.showRoom .rightSide .infoProduct .complementInfo .delivery:hover > .returnIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard:hover > .returnIcon, .showRoom .rightSide .infoProduct .complementInfo .return:hover > .returnIcon {
  transform: scale(109%);
}
.showRoom .rightSide .infoProduct .complementInfo .delivery .deliveryIcon, .showRoom .rightSide .infoProduct .complementInfo .delivery .creditCardIcon, .showRoom .rightSide .infoProduct .complementInfo .delivery .returnIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard .deliveryIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard .creditCardIcon, .showRoom .rightSide .infoProduct .complementInfo .creditCard .returnIcon, .showRoom .rightSide .infoProduct .complementInfo .return .deliveryIcon, .showRoom .rightSide .infoProduct .complementInfo .return .creditCardIcon, .showRoom .rightSide .infoProduct .complementInfo .return .returnIcon {
  width: 35px;
  padding-bottom: 10px;
  transform: scale(100%);
  transition: 0.3s ease-in-out;
}
.showRoom .rightSide .containerAccordion .accordionItem .title .btnCollapse {
  width: 100%;
  font-weight: 500;
  color: #000000;
  background-color: #ffffff;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse {
  border: 1px solid #f1f1f1;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) {
  height: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  gap: 5px;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-end;
  cursor: pointer;
  background-color: #f1f1f1;
  padding: 10px;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case:hover {
  background-color: #f8f8f8;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .message {
  font-size: 0.7rem;
  font-weight: 400;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .message span {
  color: #bc2327;
  font-weight: 700;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion {
  width: 100%;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .itemProduct {
  width: auto;
  height: 70px;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .info {
  align-items: flex-end;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .info .rating {
  width: 50px;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .info .name, .showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .info .date {
  font-size: 0.6rem;
  font-weight: 700;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody:nth-child(1) .case .opinion .info .date {
  color: #bc2327;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBodyDos p {
  font-size: 0.8rem;
  font-weight: 400;
  align-self: self-start;
}
.showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBodyDos p span {
  color: #bc2327;
  font-weight: 700;
}

.skullSocialMedia {
  position: fixed;
  bottom: 30px;
  left: 30px;
  z-index: 8;
}
.skullSocialMedia .socialMedia #socialSkull {
  display: none;
}
.skullSocialMedia .socialMedia #socialSkull:checked ~ ul {
  opacity: 2;
  visibility: visible;
  transform: translateY(-100%);
}
.skullSocialMedia .socialMedia .label .skullIcon {
  width: 32px;
  cursor: pointer;
  position: fixed;
  bottom: 30px;
  left: 30px;
  z-index: 8;
  transition: 0.3s ease-in-out;
}
.skullSocialMedia .socialMedia .label .skullIcon:hover {
  transform: translateY(0%) scale(105%);
  filter: drop-shadow(0 0 6px #696061);
}
.skullSocialMedia .socialMedia ul {
  position: relative;
  bottom: -80px;
  left: -30px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-15%);
  transition: 0.3s ease-in-out;
}
.skullSocialMedia .socialMedia ul li {
  list-style-type: none;
}
.skullSocialMedia .socialMedia ul li .item .itemSocial {
  width: 32px;
  text-decoration: none;
  margin: 5px 0px;
  filter: grayscale(0%);
  transition: 0.3s ease-in-out;
}
.skullSocialMedia .socialMedia ul li .item .itemSocial:hover {
  transform: scale(110%, 110%);
  filter: drop-shadow(0 0 6px #696061) grayscale(100%);
}

#containerNewArrivals {
  width: 95%;
  max-width: 1300px;
  margin-bottom: 150px;
}
#containerNewArrivals .title {
  font-size: 2.5rem;
  font-weight: 600;
  font-family: "Jura", sans-serif;
  color: #bc2327;
  text-align: center;
  margin-bottom: 100px;
}

.tagGetOff {
  position: fixed;
  top: 35%;
  right: 0px;
  transform: rotate(180deg);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 8;
  text-decoration: none;
}
.tagGetOff .discount {
  animation: getOff 0.5s linear;
}
.tagGetOff .discount .title {
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #ffffff;
  text-align: center;
  writing-mode: vertical-rl;
  text-orientation: right;
  transform: rotate(180deg);
  font-weight: 600;
  cursor: pointer;
  background-color: #000000;
  padding: 40px 15px;
  transition: 0.3s ease-in-out;
}
.tagGetOff .discount .title:hover {
  background-color: #bc2327;
  transform: translateX(15%) rotate(180deg);
}
@keyframes getOff {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0%);
  }
}

.getOffShowRoom {
  width: 100%;
  height: 100%;
}
.getOffShowRoom #cross {
  display: none;
}
.getOffShowRoom #cross:checked ~ .bannerGetOff {
  transform: translateY(0%);
}
.getOffShowRoom .bannerGetOff {
  width: 65vw;
  max-width: fit-content;
  height: auto;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.0745098039);
  box-shadow: 0 0 10px 6px #070707;
  position: fixed;
  top: 20%;
  left: 0%;
  right: 0px;
  margin: auto;
  z-index: 8;
  transform: translateY(500%);
  overflow: hidden;
  transition: 0.3s ease-in-out;
}
.getOffShowRoom .bannerGetOff .title {
  font-size: 4rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
  margin-top: 20px;
}
.getOffShowRoom .bannerGetOff label {
  width: auto;
  align-self: self-end;
}
.getOffShowRoom .bannerGetOff label .crossCloseWhite {
  width: 25px;
  cursor: pointer;
  z-index: 10;
  background-color: #000000;
  border-radius: 50%;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}
.getOffShowRoom .bannerGetOff label .crossCloseWhite:hover {
  transform: rotate(90deg);
}
.getOffShowRoom .bannerGetOff .slideGetOff {
  padding: 20px 20px 0px;
  backdrop-filter: blur(10px);
}
.getOffShowRoom .bannerGetOff .slideGetOff .hoddy {
  padding: 10px;
}
.getOffShowRoom .bannerGetOff .slideGetOff .hoddy img {
  width: 100%;
  height: fit-content;
  object-fit: cover;
}
.getOffShowRoom .bannerGetOff .slideGetOff .hoddy h3 {
  margin-top: 30px;
  font-size: 1.1rem;
  font-family: "Jura", sans-serif;
  color: #BC2327;
}
.getOffShowRoom .bannerGetOff .slideGetOff .hoddy p {
  padding: 10px auto;
  font-size: 1rem;
  font-family: "Jura", sans-serif;
  color: #d9d9d9;
}
.getOffShowRoom .bannerGetOff::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8980392157);
  backdrop-filter: blur(10px);
  filter: blur(10px);
  z-index: -1;
  border-radius: 10px;
}
.getOffShowRoom .bannerGetOff > * {
  position: relative;
}

.footerContainer {
  width: 100%;
  height: 100%;
  background-color: #1b1b1b;
  box-shadow: 0 0 10px 6px #070707;
}
.footerContainer .containerFooter {
  width: 95%;
  max-width: 1300px;
}
.footerContainer .containerFooter .footer {
  width: 100%;
  padding: 50px 0px;
  position: relative;
}
.footerContainer .containerFooter .footer .socialMediaFooter .contactUs {
  font-family: "Jura", sans-serif;
  font-weight: 600;
  font-size: 0.9rem;
  color: #9a9a9a;
  padding: 0px 0px;
  align-items: flex-start;
}
.footerContainer .containerFooter .footer .socialMediaFooter ul {
  display: flex;
  margin-bottom: 0px;
  padding-top: 10px;
  padding-left: 0px;
  border-top: 1px solid #3d3d3d;
  gap: 10px;
}
.footerContainer .containerFooter .footer .socialMediaFooter ul li {
  list-style-type: none;
  align-items: flex-start;
}
.footerContainer .containerFooter .footer .socialMediaFooter ul li .item {
  text-decoration: none;
}
.footerContainer .containerFooter .footer .socialMediaFooter ul li .item .itemSocial {
  width: 32px;
  filter: grayscale(0%);
  transform: scale(100%, 100%);
  transition: 0.3s ease-in-out;
}
.footerContainer .containerFooter .footer .socialMediaFooter ul li .item .itemSocial:hover {
  transform: scale(110%, 110%);
  filter: drop-shadow(0 0 10px #000000) grayscale(100%);
}
.footerContainer .containerFooter .footer .brand {
  position: absolute;
  top: 50px;
  left: 43.5%;
}
.footerContainer .containerFooter .footer .brand .nameLogo {
  font-size: 1.8rem;
  font-family: "Rubik Distressed", cursive;
  color: #bc2327;
}
.footerContainer .containerFooter .footer .brand .skull {
  width: 32px;
}
.footerContainer .containerFooter .footer .payments h3 {
  font-family: "Jura", sans-serif;
  font-weight: 600;
  font-size: 0.9rem;
  color: #9a9a9a;
  padding: 0px 0px;
  align-self: flex-start;
}
.footerContainer .containerFooter .footer .payments .paymentCards {
  width: 303px;
  align-self: flex-start;
  padding-top: 10px;
  border-top: 1px solid #3d3d3d;
}
.footerContainer .containerFooter .development {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 10px;
}
.footerContainer .containerFooter .development .raccoon {
  width: 35px;
  padding-bottom: 5px;
}
.footerContainer .containerFooter .development .developer {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  padding-bottom: 5px;
  border-top: 1px solid #3d3d3d;
}
.footerContainer .containerFooter .development .developer .em-flag-co, .footerContainer .containerFooter .development .developer .em-flag-ca {
  width: 12px;
  margin: 0px 5px;
}
.footerContainer .containerFooter .development .developer p {
  font-family: "Jura", sans-serif;
  font-weight: 400;
  font-size: 0.5rem;
  color: #9a9a9a;
  margin: 0px 0px;
}
.footerContainer .containerFooter .development .developer p .raccoon {
  color: #bc2327;
  font-weight: 600;
  font-family: "Jura", sans-serif;
}

@media (max-width: 1350px) {
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: flex-start;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .break {
    font-size: 3.5rem;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .subtitle {
    font-size: 1.5rem;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    font-size: 1rem;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .promo {
    font-size: 0.9rem;
  }
}
@media (max-width: 1230px) {
  .header .menuSide {
    width: 25vw;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta {
    width: 100%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    width: 100%;
    padding: 20px !important;
  }
  .bestSellers .sectionCardBlock {
    gap: 20px;
  }
}
@media (max-width: 1120px) {
  .header .menuSide {
    width: 30vw;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .break {
    font-size: 3rem;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    width: 100%;
    font-size: 0.9rem;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .promo {
    font-size: 0.8rem;
  }
  .mainContainer .sectionShop {
    width: 50vw;
  }
  .mainContainer .sectionWishlist {
    width: 35vw;
  }
  .mainContainer .bestSellers .sectionCardBlock {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(1, 1fr);
    gap: 20px;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer, .mainContainer #containerNewArrivals .sectionCardContainer {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
  .mainContainer .getOffHoddy .containerGetOff .info {
    margin: auto;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 40vw;
    height: 100vh;
    top: 0%;
    left: 0%;
    margin-left: 0;
    z-index: 11;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  .mainContainer .getOffHoddy .bannerGetOff .title {
    font-size: 2.5rem;
    padding-left: 20px;
    padding-right: 20px;
  }
  .mainContainer .getOffHoddy .bannerGetOff .slideGetOff {
    width: 100%;
    height: 80vh;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px 0px;
  }
  .mainContainer .getOffHoddy .bannerGetOff .slideGetOff .hoddy {
    width: 100%;
  }
  .mainContainer .giftCards {
    width: 90vw;
    max-width: 100%;
  }
  .mainContainer .giftCards .containerGetOff {
    width: 100%;
  }
}
@media (max-width: 1000px) {
  .header .menuSide {
    width: 35vw;
  }
  .mainContainer .heroSection {
    height: auto;
  }
  .mainContainer .heroSection .containerHeroSection {
    margin: 50px auto 50px;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered {
    display: flex;
    flex-direction: column-reverse;
    gap: 50px;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info {
    width: 60%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    flex-grow: 1;
  }
  .mainContainer .heroSection .containerHeroSection .laptop {
    width: 70vw;
  }
  .mainContainer .getOffHoddy .containerGetOff {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: flex-start;
    align-items: center;
  }
  .mainContainer .getOffHoddy .containerGetOff .info {
    margin-top: 0px;
    text-align: left;
  }
  .mainContainer .getOffHoddy .containerGetOff .info .title {
    width: 100%;
    text-align: center;
  }
  .mainContainer .getOffHoddy .containerGetOff .hoddy {
    width: 70vw;
  }
  .mainContainer .getOffHoddy .ctaSentence {
    display: none;
  }
  .mainContainer .giftCards .containerGetOff {
    width: 100vw;
    display: flex;
    flex-direction: column-reverse;
    justify-content: space-between;
    align-items: center;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage {
    width: 50%;
  }
  .footerContainer .containerFooter {
    width: 100%;
    height: auto;
  }
  .footerContainer .containerFooter .footer {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
  }
  .footerContainer .containerFooter .footer .brand {
    position: static;
    text-align: center;
    display: block;
  }
  .footerContainer .containerFooter .footer .socialMediaFooter {
    order: 2;
    text-align: center;
    display: block;
  }
  .footerContainer .containerFooter .footer .socialMediaFooter ul {
    display: flex;
    justify-content: center;
  }
  .footerContainer .containerFooter .footer .payments {
    order: 3;
    display: block;
    text-align: center;
    align-self: center;
  }
}
@media (max-width: 950px) {
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info {
    width: 70%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    flex-grow: 1;
  }
  .mainContainer .bestSellers .sectionCardBlock .cardProducts .article .info .nameOutfit {
    font-size: 1.5rem;
  }
  .mainContainer .bestSellers .sectionCardBlock .cardProducts .article .info .price {
    font-size: 0.9rem;
  }
  .mainContainer .sectionShop {
    width: 55vw;
  }
  .mainContainer .sectionWishlist {
    width: 40vw;
  }
  .mainContainer .showRoom {
    gap: 40px;
  }
  .mainContainer .showRoom .leftSide .itemProduct {
    width: 55%;
    display: flex;
    margin: 0 auto;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 2.5rem;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article1 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article2 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article3 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article4 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article5 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article6 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article7 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article8 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article9 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article10 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article1 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article2 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article3 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article4 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article5 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article6 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article7 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article8 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article9 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article10 .smallCard .price {
    font-size: 0.9rem;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article1 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article2 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article3 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article4 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article5 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article6 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article7 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article8 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article9 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article10 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article1 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article2 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article3 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article4 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article5 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article6 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article7 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article8 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article9 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article10 .nameOut {
    font-size: 1.5rem;
  }
}
@media (max-width: 850px) {
  .header .menuSide {
    width: 40vw;
  }
  .mainContainer .heroSection {
    width: 100vw;
  }
  .mainContainer .bestSellers .sectionCardBlock {
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer, .mainContainer #containerNewArrivals .sectionCardContainer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    row-gap: 30px;
  }
  .mainContainer .giftCards .containerGetOff {
    width: 100%;
  }
  .mainContainer .giftCards .containerGetOff .containerCards {
    width: 80%;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .card1, .mainContainer .giftCards .containerGetOff .containerCards .card2, .mainContainer .giftCards .containerGetOff .containerCards .card3, .mainContainer .giftCards .containerGetOff .containerCards .card4 {
    width: 100%;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage {
    width: 70%;
  }
}
@media (max-width: 750px) {
  .header .menuSide {
    width: 50vw;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered {
    width: 90%;
    margin: auto;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info {
    width: 100%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .laptop {
    width: 100%;
  }
  .mainContainer .sectionShop {
    width: 60vw;
  }
  .mainContainer .sectionWishlist {
    width: 60vw;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 1.8rem;
  }
  .mainContainer .bestSellers .sectionCardBlock .cardProducts .article .info .nameOutfit {
    font-size: 1.2rem;
  }
  .mainContainer .bestSellers .sectionCardBlock .cardProducts .article .info .price {
    font-size: 0.8rem;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article1 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article2 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article3 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article4 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article5 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article6 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article7 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article8 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article9 .smallCard .price, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article10 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article1 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article2 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article3 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article4 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article5 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article6 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article7 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article8 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article9 .smallCard .price, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article10 .smallCard .price {
    font-size: 0.8rem;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article1 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article2 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article3 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article4 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article5 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article6 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article7 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article8 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article9 .nameOut, .mainContainer #newArrivalsUno .sectionCardContainer .cardProducts .article10 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article1 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article2 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article3 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article4 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article5 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article6 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article7 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article8 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article9 .nameOut, .mainContainer #containerNewArrivals .sectionCardContainer .cardProducts .article10 .nameOut {
    font-size: 1.2rem;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 45vw;
  }
  .mainContainer .giftCards {
    width: 100vw;
    max-width: 100%;
  }
  .mainContainer .giftCards .containerGetOff {
    width: 100%;
  }
}
@media (max-width: 650px) {
  .mainContainer .giftCards {
    width: 100vw;
  }
  .mainContainer .giftCards .containerGetOff .containerCards {
    width: 90%;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage {
    width: 75%;
    text-align: center;
  }
}
@media (max-width: 600px) {
  .header .menuSide {
    width: 60vw;
  }
  .mainContainer .bestSellers .sectionCardBlock {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .mainContainer .sectionShop {
    width: 80vw;
  }
  .mainContainer .sectionWishlist {
    width: 80vw;
  }
  .mainContainer #newArrivalsUno .title, .mainContainer #containerNewArrivals .title {
    font-size: 1.8rem;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer, .mainContainer #containerNewArrivals .sectionCardContainer {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .mainContainer .showRoom .rightSide .infoProduct .size .containerSize {
    gap: 10px;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 1.5rem;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 55vw;
  }
}
@media (max-width: 510px) {
  .header .logo {
    left: -50px;
  }
  .mainContainer .heroSection {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered {
    display: flex;
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    width: 85vw;
    margin: auto;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info {
    width: 100%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta {
    width: 100%;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .containerHeroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    width: auto;
  }
  .mainContainer .heroSection .containerHeroSection .heroSectionCentered .laptop {
    width: 100%;
  }
  .mainContainer .bestSellers .subtitle {
    font-size: 2.5rem;
  }
  .mainContainer .newArrivals .subtitle, .mainContainer .bestSellers .subtitle, .mainContainer .giftCards .subtitle {
    font-size: 2.5rem;
  }
  .mainContainer .getOffHoddy .containerGetOff .info .title {
    font-size: 2.5rem;
    place-self: center;
  }
  .mainContainer .getOffHoddy .containerGetOff .info .paragraph .subtitle, .mainContainer .getOffHoddy .containerGetOff .info .paragraph .sentence {
    font-size: 1.2rem;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 65vw;
  }
  .mainContainer .giftCards .containerGetOff {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
  }
  .mainContainer .giftCards .containerGetOff .containerCards {
    width: 100%;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards {
    width: 100%;
    padding: 0px;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card1 #icon, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card2 #icon, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card3 #icon, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card4 #icon {
    width: 35%;
    height: auto;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card1 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card2 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card3 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card4 .subtitleGift {
    font-size: 2rem;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card1 .socialMedia .itemSocial, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card2 .socialMedia .itemSocial, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card3 .socialMedia .itemSocial, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card4 .socialMedia .itemSocial {
    width: 5%;
    height: auto;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card1 .paragraph, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card2 .paragraph, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card3 .paragraph, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card4 .paragraph {
    font-size: 0.6rem;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage {
    width: 90%;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage .subtitleMessage {
    font-size: 1.8rem;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage .paragraph {
    font-size: 1.2rem;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 1.2rem;
    transform: scale(180%);
    margin: 10px auto;
  }
}
@media (max-width: 460px) {
  .mainContainer .heroSection .heroSectionCentered {
    width: 87vw;
  }
  .mainContainer .advertising .advertisingMood {
    width: 100%;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 1rem;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 80vw;
  }
}
@media (max-width: 425px) {
  .header .menuSide {
    width: 100vw;
  }
  .mainContainer .advertising .advertisingMood {
    width: 100%;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 0.9rem;
  }
  .mainContainer .getOffHoddy .containerGetOff .hoddy {
    width: 95%;
  }
  .mainContainer .getOffHoddy .bannerGetOff {
    width: 100vw;
  }
}
@media (max-width: 400px) {
  .mainContainer .heroSection .heroSectionCentered {
    width: 85vw;
  }
  .mainContainer .heroSection .heroSectionCentered .info .cta {
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  .mainContainer .heroSection .heroSectionCentered .info .cta .ctaDiscount, .mainContainer .heroSection .heroSectionCentered .info .cta .ctaNewArrivals {
    width: 100%;
  }
  .mainContainer .sectionShop {
    width: 100vw;
  }
  .mainContainer .sectionWishlist {
    width: 100vw;
  }
  .mainContainer .bestSellers .sectionCardBlock {
    grid-template-columns: repeat(1, 1fr);
  }
  .mainContainer .bestSellers .ctaStore {
    width: 100%;
  }
  .mainContainer #newArrivalsUno, .mainContainer #containerNewArrivals {
    width: 100vw;
  }
  .mainContainer #newArrivalsUno .sectionCardContainer, .mainContainer #containerNewArrivals .sectionCardContainer {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
  }
  .mainContainer #newArrivalsUno .ctaStore, .mainContainer #containerNewArrivals .ctaStore {
    width: 100%;
  }
  .mainContainer .advertising .advertisingMood .subtitle {
    font-size: 0.7rem;
  }
  .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card1 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card2 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card3 .subtitleGift, .mainContainer .giftCards .containerGetOff .containerCards .sectionCards .card4 .subtitleGift {
    font-size: 1.5rem;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage {
    width: 90%;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage .subtitleMessage {
    font-size: 1.8rem;
  }
  .mainContainer .giftCards .containerGetOff .containerMessage .paragraph {
    font-size: 1.2rem;
  }
  .mainContainer .footer .payments .paymentCards {
    width: 203px;
  }
}
@media (max-width: 360px) {
  .footerContainer .containerFooter .development .developer {
    display: flex;
    flex-direction: column;
  }
}
/*************** Media queries SignIn & CreateAccount, Store, & ShowRoom ******************/
@media (max-width: 1230px) {
  .headerSignIn .menuSide {
    width: 25vw;
  }
  .containerStore .sectionStore {
    gap: 20px;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
}
@media (max-width: 1230px) {
  .sectionPlaceOrder {
    width: 100%;
    left: 10%;
    right: 10%;
  }
}
@media (max-width: 1230px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 25vw;
  }
}
@media (max-width: 1120px) {
  .headerSignIn .menuSide {
    width: 30vw;
  }
  .container .sectionShop {
    width: 50vw;
  }
  .container .sectionWishlist {
    width: 35vw;
  }
  .container .getOffSignIn .bannerGetOff {
    width: 40vw;
    height: 100vh;
    top: 0%;
    left: 0%;
    margin-left: 0px;
    z-index: 11;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  .container .getOffSignIn .bannerGetOff .title {
    font-size: 2.5rem;
  }
  .container .getOffSignIn .bannerGetOff .slideGetOff {
    width: 100%;
    height: 80vh;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px 0px;
  }
  .container .getOffSignIn .bannerGetOff .slideGetOff .hoddy {
    width: 100%;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 40vw;
    height: 100vh;
    top: 0%;
    left: 0%;
    margin-left: 0px;
    z-index: 11;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  .mainContainer .getOffShowRoom .bannerGetOff .title {
    font-size: 2.5rem;
  }
  .mainContainer .getOffShowRoom .bannerGetOff .slideGetOff {
    width: 100%;
    height: 80vh;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px 0px;
  }
  .mainContainer .getOffShowRoom .bannerGetOff .slideGetOff .hoddy {
    width: 100%;
  }
}
@media (max-width: 1120px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 30vw;
  }
  .containerStore .sectionShop {
    width: 50vw;
  }
  .containerStore .sectionWishlist {
    width: 35vw;
  }
  .containerStore .getOffStore .bannerGetOff {
    width: 40vw;
    height: 100vh;
    top: 0%;
    left: 0%;
    margin-left: 0;
    z-index: 11;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  .containerStore .getOffStore .bannerGetOff .title {
    font-size: 2.5rem;
    padding-left: 30px;
    padding-right: 30px;
  }
  .containerStore .getOffStore .bannerGetOff .slideGetOff {
    width: 100%;
    height: 80vh;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px 0px;
  }
  .containerStore .getOffStore .bannerGetOff .slideGetOff .hoddy {
    width: 100%;
  }
}
@media (max-width: 1120px) {
  .swal2-container .swal2-popup {
    width: 40vw;
  }
}
@media (max-width: 1000px) {
  .headerSignIn .menuSide {
    width: 35vw;
  }
}
@media (max-width: 1000px) {
  .mainContainer .showRoom .leftSide .itemProduct {
    width: 100%;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
}
@media (max-width: 1000px) {
  .sectionPlaceOrder {
    width: 100%;
    left: 5%;
    right: 5%;
  }
}
@media (max-width: 1000px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 35vw;
  }
}
@media (max-width: 950px) {
  .container .sectionWishlist {
    width: 40vw;
  }
}
@media (max-width: 950px) {
  .containerStore .sectionWishlist {
    width: 40vw;
  }
}
@media (max-width: 850px) {
  .headerSignIn .menuSide {
    width: 40vw;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
}
@media (max-width: 850px) {
  .sectionPlaceOrder {
    width: 50vw;
    height: 100vh;
    top: 0%;
    left: 0%;
    right: 0%;
    border-radius: 0%;
  }
  .sectionPlaceOrder .unionOrder {
    flex-direction: column;
    justify-content: space-evenly;
    gap: 10px;
  }
  .sectionPlaceOrder .unionOrder .delivery {
    margin: -30px auto;
  }
  .sectionPlaceOrder .unionOrder .delivery, .sectionPlaceOrder .unionOrder .formPayment {
    width: 100%;
    height: auto;
  }
  .sectionPlaceOrder .unionOrder .delivery .deliveryContact, .sectionPlaceOrder .unionOrder .formPayment .deliveryContact {
    gap: 1px;
  }
  .sectionPlaceOrder .unionOrder .delivery .deliveryContact .contactTitle, .sectionPlaceOrder .unionOrder .delivery .deliveryContact .deliveryTitle, .sectionPlaceOrder .unionOrder .formPayment .deliveryContact .contactTitle, .sectionPlaceOrder .unionOrder .formPayment .deliveryContact .deliveryTitle {
    font-size: 0.8rem;
    margin: 0px auto;
  }
  .sectionPlaceOrder .unionOrder .delivery .deliveryContact fieldset label input, .sectionPlaceOrder .unionOrder .formPayment .deliveryContact fieldset label input {
    padding-top: 2px;
    padding-bottom: 2px;
    font-size: 0.6rem;
  }
  .sectionPlaceOrder .unionOrder .delivery .creditCards, .sectionPlaceOrder .unionOrder .formPayment .creditCards {
    margin: 5px 0px 2px 15px;
  }
  .sectionPlaceOrder .unionOrder .delivery .creditCards .transactions, .sectionPlaceOrder .unionOrder .formPayment .creditCards .transactions {
    font-size: 0.7rem;
  }
  .sectionPlaceOrder .unionOrder .formPayment {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1px;
  }
  .sectionPlaceOrder .unionOrder .formPayment .paymentTitle {
    font-size: 0.8rem;
    margin: 0px auto;
  }
  .sectionPlaceOrder .unionOrder .formPayment fieldset label input {
    padding-top: 2px;
    padding-bottom: 2px;
    font-size: 0.6rem;
  }
  .sectionPlaceOrder .unionOrder .formPayment fieldset select {
    font-size: 0.6rem;
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .sectionPlaceOrder .unionOrder .formPayment fieldset .cardNumbers {
    margin-top: 4px;
  }
  .sectionPlaceOrder .unionOrder .formPayment .btnPlaceOnOrder {
    margin-top: 10px;
  }
}
@media (max-width: 850px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 40vw;
  }
}
@media (max-width: 850px) {
  .swal2-container .swal2-popup {
    width: 50vw;
  }
}
@media (max-width: 850px) {
  .mainContainer .showRoom .rightSide .containerAccordion .accordionItem .accordionCollapse .accordionBody {
    flex-direction: column;
  }
  .mainContainer .showRoom .rightSide .infoProduct .complementInfo {
    flex-direction: column;
    align-items: center;
  }
  .mainContainer .showRoom .rightSide .infoProduct .complementInfo .delivery, .mainContainer .showRoom .rightSide .infoProduct .complementInfo .creditCard, .mainContainer .showRoom .rightSide .infoProduct .complementInfo .return {
    width: 45%;
  }
}
@media (max-width: 750px) {
  .headerSignIn .menuSide {
    width: 50vw;
  }
  .container .logInCreateAccount .tags .formCreateAccount, .container .logInCreateAccount .tags .formLogIn {
    width: 100vw;
  }
  .container .logInCreateAccount .bannerCreateAccount .background {
    display: none;
  }
  .container .sectionShop {
    width: 60vw;
  }
  .container .sectionWishlist {
    width: 60vw;
  }
  .container .getOffSignIn .bannerGetOff {
    width: 45vw;
  }
}
@media (max-width: 750px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 50vw;
  }
  .containerStore .sectionShop {
    width: 60vw;
  }
  .containerStore .sectionWishlist {
    width: 60vw;
  }
  .containerStore .getOffStore .bannerGetOff {
    width: 45vw;
  }
  .mainContainer .showRoom .rightSide .infoProduct .size .containerSize {
    gap: 5px;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 45vw;
  }
}
@media (max-width: 750px) {
  .sectionPlaceOrder {
    width: 65vw;
  }
}
@media (max-width: 750px) {
  .swal2-container .swal2-popup {
    width: 60vw;
  }
}
@media (max-width: 600px) {
  .headerSignIn .menuSide {
    width: 60vw;
  }
  .container .sectionShop {
    width: 80vw;
  }
  .container .sectionWishlist {
    width: 80vw;
  }
  .container .getOffSignIn .bannerGetOff {
    width: 55vw;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
  .containerStore .getOffStore .bannerGetOff {
    width: 55vw;
  }
}
@media (max-width: 600px) {
  .sectionPlaceOrder {
    width: 80vw;
  }
}
@media (max-width: 600px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 60vw;
  }
  .containerStore .sectionShop {
    width: 80vw;
  }
  .containerStore .sectionWishlist {
    width: 80vw;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 55vw;
  }
}
@media (max-width: 500px) {
  .mainContainer .showRoom .leftSide .itemProduct {
    width: 100%;
    margin: 0px 0px;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 65vw;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
  .containerStore .getOffStore .bannerGetOff {
    width: 65vw;
  }
  .container .logInCreateAccount .tags .formLogIn legend, .container .logInCreateAccount .tags .formCreateAccount legend {
    font-size: 1.8rem;
  }
  .container .logInCreateAccount .tags .formCreateAccount .ctaToCreateAccount {
    margin-top: 15px;
  }
  .container .getOffSignIn .bannerGetOff {
    width: 65vw;
  }
  .mainContainer .bannerShipping .shipping, .containerStore .bannerShipping .shipping {
    font-size: 0.6rem !important;
    padding: 5px;
  }
}
@media (max-width: 500px) {
  .swal2-container .swal2-popup {
    width: 80vw;
  }
}
@media (max-width: 500px) {
  .sectionPlaceOrder {
    width: 100vw;
  }
}
@media (max-width: 460px) {
  .containerStore .getOffStore .bannerGetOff {
    width: 80vw;
  }
  .container .getOffSignIn .bannerGetOff {
    width: 80vw;
  }
  .mainContainer .showRoom {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
  }
  .mainContainer .showRoom .leftSide {
    position: static;
    width: 85vw;
  }
  .mainContainer .showRoom .leftSide .itemProduct {
    width: 100%;
    height: auto;
    display: flex;
    margin: auto;
  }
  .mainContainer .showRoom .rightSide {
    width: 85vw;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 85vw;
  }
}
@media (max-width: 425px) {
  .header .menuSide {
    width: 100vw;
  }
  .headerSignIn .menuSide {
    width: 100vw;
  }
  .container .sectionShop, .containerStore .sectionShop, .mainContainer .sectionShop {
    width: 100vw;
  }
  .container .sectionShop .menuCart .menuCartlist .outcomeCard, .containerStore .sectionShop .menuCart .menuCartlist .outcomeCard, .mainContainer .sectionShop .menuCart .menuCartlist .outcomeCard {
    width: 100%;
  }
  .container .sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout, .containerStore .sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout, .mainContainer .sectionShop .menuCart .menuCartlist .outcomeCard .btnCheckout {
    width: 90%;
  }
  .container .sectionWishlist, .containerStore .sectionWishlist, .mainContainer .sectionWishlist {
    width: 100vw;
  }
  .containerStore .sectionStore .sectionCard {
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(1, 1fr);
  }
  .container .getOffSignIn .bannerGetOff {
    width: 100vw;
  }
  .mainContainer .getOffShowRoom .bannerGetOff {
    width: 100vw;
  }
}
@media (max-width: 425px) {
  .swal2-container .swal2-popup {
    width: 85vw;
  }
}
@media (max-width: 425px) {
  .containerStore .sectionFilter .menuFilterSide .menuFilter {
    width: 100vw;
  }
  .containerStore .sectionWishlist {
    width: 100vw;
  }
  .containerStore .getOffStore .bannerGetOff {
    width: 100vw;
  }
}
@media (max-width: 400px) {
  .swal2-container .swal2-popup {
    width: 90vw;
  }
}
.containerError {
  width: 100%;
  height: 100vh;
  background-color: #ffffff;
}
.containerError .pageError {
  width: 100%;
  height: auto;
  margin: 0px auto;
  gap: 0px;
}
.containerError .pageError .imgBreakALeg {
  animation: bounceDown 1.6s ease-in-out;
}
@keyframes bounceDown {
  0% {
    transform: translateY(-40%);
  }
  20% {
    transform: translateY(0%);
  }
  40% {
    transform: translateY(-20%);
  }
  60% {
    transform: translateY(0%);
  }
  70% {
    transform: translateY(-15%);
  }
  80% {
    transform: translateY(0%);
  }
  90% {
    transform: translateY(-5%);
  }
  100% {
    transform: translateY(0%);
  }
}
.containerError .pageError .imgBreakALeg .tag .tagBreakALeg {
  width: 85%;
  min-width: 600px;
  height: auto;
  margin: 0px auto;
  display: flex;
  filter: drop-shadow(0 0 5px #9a9a9a) contrast(102%);
  animation: tags 2s linear;
}
@keyframes tags {
  0% {
    opacity: 0;
    filter: drop-shadow(0 0 5px #9a9a9a) contrast(85%);
  }
  50% {
    opacity: 0.5;
    filter: drop-shadow(0 0 5px #9a9a9a) contrast(95%);
  }
  100% {
    opacity: 1;
    filter: drop-shadow(0 0 5px #9a9a9a) contrast(102%);
  }
}
.containerError .pageError .sentenceBreakALeg {
  width: 75vw;
}
.containerError .pageError .sentenceBreakALeg .returnSentence {
  color: #6b6b6b;
  font-size: 1.8rem;
  font-family: "Jura", sans-serif;
  font-weight: 400;
  text-align: center;
}
.containerError .pageError .sentenceBreakALeg .returnSentence span, .containerError .pageError .sentenceBreakALeg .returnSentence .intro {
  color: #bc2327;
  font-size: 1.8rem;
  font-family: "Rubik Distressed", cursive;
  font-weight: 500;
}
.containerError .pageError .sentenceBreakALeg .returnSentence .intro {
  font-family: "Jura", sans-serif;
  font-weight: 600;
}
.containerError .pageError .sentenceBreakALeg .returnSentence .emojiIcon {
  font-size: 16px;
}
.containerError .pageError .btnBreakALeg {
  margin: 35px auto;
}
.containerError .pageError .btnBreakALeg .btnReturn {
  width: 100%;
  color: #ffffff;
  font-size: 1.2rem;
  font-family: "Rubik Distressed", cursive;
  font-weight: 500;
  text-align: center;
  padding: 15px 50px;
  background-color: #000000;
  text-decoration: none;
  cursor: pointer;
  position: relative;
}
.containerError .pageError .btnBreakALeg .btnReturn:hover > .skullBrand {
  content: "";
  opacity: 1;
  visibility: visible;
  color: #000000;
  background-color: #ffffff;
  box-shadow: 1px 5px 6px 2px #363636;
  transform: scale(105%, 105%);
}
.containerError .pageError .btnBreakALeg .skullBrand {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  padding: 12px 5px;
  transform: scale(0%, 0%);
  transition: 0.3s ease-in-out;
}

@media (max-width: 600px) {
  .containerError {
    width: 100vw;
    height: 100vh;
  }
  .containerError .pageError .sentenceBreakALeg .returnSentence {
    font-size: 1rem;
  }
  .containerError .pageError .sentenceBreakALeg .returnSentence span,
  .containerError .pageError .sentenceBreakALeg .returnSentence span.intro {
    font-size: 1.2rem;
  }
  .containerError .pageError .btnBreakALeg .skullBrand {
    width: 100%;
  }
}

/*# sourceMappingURL=main.css.map */