@font-face {

  font-family: 'Ama';

  src: url('Ama-Ember-Bold.ttf') format('truetype');

  font-style: normal;

  font-weight: 700;

}



@font-face {

  font-family: 'Ama';

  src: url('Ama-Ember-Medium.ttf') format('truetype');

  font-style: normal;

  font-weight: 400;

}



@font-face {

  font-family: 'Ama';

  src: url('Ama-Ember.ttf') format('truetype');

  font-style: normal;

  font-weight: 400;

}



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



#content2,

#content3 {

  display: none;

}



.burgerMenuIcon {

  display: none;

  width: 30px;

  height: 30px;

  cursor: pointer;

  margin-right: 16px;

}



.header {

  display: flex;

  align-items: center;

  color: #fff;

  justify-content: center;

  height: 60px;

  padding: 20px 16px;

  background-color: #131921;

  font-family: 'Ama';

}



.subheader {

  background-color: #232f3e;

  height: 50px;

  color: #fff;

  font-family: 'Arial';

}



.subheader__wrapper {

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto;

  height: 100%;

}



.timer {

  display: flex;

  align-items: center;

}



.timer__title {

  color: #fff;

  margin-right: 10px;

  font-weight: 600;

}



.header__logo {

  width: 100px;

}



.header__logo_small {

  display: none;

  width: 36px;

}



.header__left {

  display: flex;

  align-items: center;

}



.header__delivery {

  display: flex;

  margin-left: 20px;

  cursor: pointer;

}



.header__deliveryIcon {

  width: 18px;

  height: 20px;

  margin-right: 2px;

  align-self: end;

}



.header__deliveryTitle {

  font-size: 12px;

  color: #ccc;

  line-height: 14px;

  white-space: nowrap;

}



.header__deliveryTitle b {

  width: 100%;

  display: block;

  font-size: 14px;

  color: #fff;

}



.header__search {

  position: relative;

  margin-left: 16px;

  flex: 1 1 auto;

  margin-right: 20px;

}



.header__searchFilter {

  position: absolute;

  top: 0;

  left: 0;

  width: 52px;

  height: 40px;

  background-color: #f3f3f3;

  border-top-left-radius: 4px;

  border-bottom-left-radius: 4px;

  cursor: pointer;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #555;

  font-size: 12px;

  line-height: 33px;

}



.header__searchIconWrapper {

  width: 45px;

  height: 100%;

  background-color: #febd69;

  position: absolute;

  top: 0;

  right: 0;

  cursor: pointer;

  border-top-right-radius: 4px;

  border-bottom-right-radius: 4px;

}



.header__searchIcon {

  width: 22px;

  height: 22px;

  color: #000;

  position: relative;

  top: 10px;

  left: 10px;

}



.header__searchInput {

  height: 40px;

  width: 100%;

  padding-left: 60px;

  font-family: 'Ama', 'Neue', 'Helvetica', 'Arial', sans-serif;

  font-size: 16px;

  background-color: rgb(255, 255, 255);

  border: none;

  border-radius: 4px;

  transition: all 0.12s ease-in 0s;

}



.header__searchInput:focus {

  outline: none;

}



.header__search .icon-arrow-bottom {

  width: 16px;

  height: 16px;

  color: #555;

  margin-left: 2px;

}



.header__nav {

  display: flex;

  align-items: center;

}



.header__navItem {

  list-style: none;

  display: flex;

  align-items: center;

  height: 48px;

  padding: 0 16px;

  transition: all 100ms cubic-bezier(0.77, 0, 0.175, 1);

  cursor: pointer;

  border-radius: 2px;

  border: 1px solid transparent;

}



.header__navItem:hover {

  border-color: #fff;

}



.header__navItemIcon {

  width: 16px;

  height: 16px;

  margin-right: 8px;

}



.header__navItem .fflag {

  margin-right: 4px;

  align-items: end;

}



.header__navItem .icon-arrow-bottom {

  width: 16px;

  height: 16px;

  color: #ccc;

  margin-left: -3px;

  margin-bottom: -3px;

}



.shopping-cart {

  position: relative;

}



.shopping-cart-count {

  position: absolute;

  left: 18px;

  top: -5px;

  font-size: 16px;

  color: #f08804;

  font-weight: 700;

}



.header__navItemIcon:last-child {

  margin-right: 0;

}



.header__navItemTitle {

  font-size: 16px;

  font-weight: 700;

  color: #fff;

  font-family: 'Ama', 'Neue', Helvetica, 'Arial', sans-serif;

  white-space: nowrap;

  line-height: 1;

}



.header__navItemTitleSub {

  font-size: 12px;

  font-weight: 400;

}



.content {

  font-family: 'Inter', Arial, sans-serif !important;

  padding: 0.5rem 1.25rem 0.25rem;

}



.title {

  font-family: 'Ubuntu', Verdana, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans',

    'Cantarell', 'Helvetica Neue', sans-serif;

  font-size: 1.75rem;

  font-weight: 700;

  line-height: 1.25;

  color: rgb(33, 37, 41);

  margin-bottom: 1rem;

  margin-top: 0.5rem;

}



.text {

  font-family: Tahoma, 'Geneva', sans-serif;

  font-size: 14px;

  line-height: 18px;

  color: rgb(33, 37, 41);

  margin-bottom: 0.75rem;

}



.gallery {

  margin-bottom: 0.75rem;

  text-align: center;

}



.gallery__slide {

/*  max-height: 600px;*/

  width: 25%;

  object-fit: contain;

  margin: 0 auto;

}



.rating__img {

  display: block;

}



.rating__img_num {

  width: 20%;

  margin-left: -5px;

}



.rating__img_stars {

  margin-left: -3px;

  width: 171px;

  margin-bottom: 10px;

}



.questions {

  background-color: rgb(248, 249, 250);

  box-shadow: rgb(0 0 0 / 14%) 0px 8px 10px 1px, rgb(0 0 0 / 12%) 0px 3px 14px 2px,

    rgb(0 0 0 / 20%) 0px 5px 5px -3px;

  border-radius: 1rem;

  border: 1px solid rgb(248, 249, 250);

}



.question {

  padding: 0.75rem;

  display: none;

}



.question:first-child {

  display: block;

}



.questions__title {

  font-size: 1.25rem;

  line-height: 1.25;

  color: rgb(0, 0, 0);

  font-family: 'Ubuntu', Verdana, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans',

    'Cantarell', 'Helvetica Neue', sans-serif;

  font-weight: 700;

  margin-bottom: 1rem;

}



.questions__text {

  font-family: 'Open Sans', Arial, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans',

    'Ubuntu', 'Cantarell', 'Helvetica Neue', sans-serif;

  font-weight: 400;

  color: rgb(33, 37, 41);

  font-size: 1rem;

  margin-bottom: 0.75rem;

}



.questions__btn {

  width: 100%;

  margin-bottom: 0.5rem;

  color: rgb(255, 255, 255);

  background-color: #febd69;

  font-family: 'Ubuntu', Verdana, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen-Sans',

    'Cantarell', 'Helvetica Neue', sans-serif;

  min-width: 3.5rem;

  min-height: 3rem;

  position: relative;

  display: inline-flex;

  -webkit-box-align: center;

  align-items: center;

  -webkit-box-pack: center;

  justify-content: center;

  font-size: 0.875rem;

  font-weight: 700;

  letter-spacing: 0.03125rem;

  text-align: center;

  text-transform: uppercase;

  border: 0px;

  border-radius: 0.25rem;

  padding: 0.5rem;

  transition: all 0.3s ease 0s;

  cursor: pointer;

  width: 100%;

}



.questions__btn:last-child {

  margin-bottom: 0;

}



.notifications {

  top: 1rem;

  right: 1rem;

  z-index: 9999;

  position: fixed;

  padding: 4px;

  width: 310px;

}



.notification {

  box-shadow: 0 1px 10px 0 rgb(0 0 0 / 10%), 0 2px 15px 0 rgb(0 0 0 / 5%);

  position: relative;

  min-height: 64px;

  max-height: 800px;

  cursor: pointer;

  font-family: sans-serif;

  overflow: hidden;

  z-index: 9999;

  margin-bottom: 1rem;

  border-radius: 4px;

  width: 310px;

  user-select: none;

  background-color: #fff;

}



.notification_showed {

  animation-name: showNoty;

  animation-duration: 1.5s;

  animation-timing-function: linear;

  -webkit-animation-name: showNoty;

  -webkit-animation-duration: 1.5s;

  -webkit-animation-timing-function: linear;

}



.notification_hidden {

  animation-name: hiddenNoty;

  animation-duration: 1.5s;

  animation-timing-function: linear;

  -webkit-animation-name: hiddenNoty;

  -webkit-animation-duration: 1.5s;

  -webkit-animation-timing-function: linear;

}



.notification__wrapper {

  padding: 12px 6px;

  display: flex;

  align-items: flex-start;

}



.notification__body {

  display: flex;

  align-items: center;

  margin-right: 6px;

  padding-left: 6px;

}



.notification__img {

  width: 3.25rem;

  flex-shrink: 0;

  margin: 0 auto;

}



.notification__info {

  margin-left: 12px;

}



.notification__title {

  font-size: 1.1rem;

  font-weight: 500;

  color: rgb(19, 64, 148);

}



.notification__subtitle {

  font-weight: 400;

  font-size: 0.875rem;

  color: rgb(0, 0, 0);

  padding-bottom: 0.25rem;

}



.notification__subtitle:last-child {

  padding-bottom: 0;

}



.notification__close {

  background-color: transparent;

  border: none;

  cursor: pointer;

  opacity: 0.3;

}



.notification__closeIcon {

  width: 14px;

  height: 16px;

}



.notification__checkmark {

  width: 100%;

  max-width: 1.25rem;

  margin-left: 0.5rem;

  height: 15px;

}



.notification__city {

  text-decoration: underline;

}



.results {

  display: flex;

  flex-direction: column;

  align-items: center;

}



.results__inner {

  display: flex;

  flex-direction: column;

  align-items: center;

}



.result {

  font-size: 14px;

  line-height: 18px;

  padding: 0.25rem;

  font-weight: 700;

  display: none;

}



.spinner {

  display: block;

  line-height: 1;

  position: relative;

  color: rgb(17, 17, 17);

  width: 124px;

  height: 124px;

  margin: 24px 0;

}



.spinner::before {

  font-size: 1.75rem;

  content: '';

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  font-style: normal;

  font-family: strata-icons !important;

  font-weight: normal !important;

}



.spinner::after {

  content: '';

  height: 100px;

  width: 100px;

  position: absolute;

  top: 0px;

  left: 0px;

  animation: 0.6s linear 0s infinite normal none running spinnerRotation;

  border-radius: 100%;

  text-indent: -9999px;

  border-width: 12px;

  border-style: solid;

  border-color: rgb(191, 214, 49) rgba(40, 50, 90, 0.15) rgba(40, 50, 90, 0.15);

  border-image: initial;

}



.boxes {

  margin: 10px auto;

  max-width: 800px;

  background-size: cover;

  border-radius: 20px;

  position: relative;

  text-align: center;

  display: grid;

  grid-template-columns: repeat(4, 1fr);

}



.boxes,

.boxes .box img {

  width: 100%;

}



.boxes > .box {

  position: relative;

  display: inline-block;

  -webkit-transition-duration: 0.2s;

  transition-duration: 0.2s;

  cursor: pointer;

}



.box:hover {

  animation: temblor 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;

  transform: translate3d(0, 0, 0);

  backface-visibility: hidden;

  perspective: 1000px;

}



.gift {

  width: 100%;

  text-align: center;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 5;

  display: none;

  align-items: center;

  justify-content: center;

}



.gift__img {

  display: none;

  width: 90%;

  -webkit-animation-duration: 1s;

  animation-duration: 1s;

  -webkit-animation-fill-mode: both;

  animation-fill-mode: both;

  -webkit-animation-name: rotateIn;

  animation-name: rotateIn;

  margin: 0 auto;

}



@-webkit-keyframes rotateIn {

  0% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, -200deg);

    transform: rotate3d(0, 0, 1, -200deg);

    opacity: 0;

  }

  100% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}



.box {

  position: relative;

  margin: 20px 0;

}



.box > div {

  position: absolute;

}



.box .box__wrapper {

  position: relative;

}



.box__inner {

  z-index: 1;

}



.box__lid {

  z-index: 3;

}



.box__wrapper {

  z-index: 2;

}



.box__gift {

  z-index: 1;

    padding-top: 63px;

padding-left: 70px;

}



.boxes .box.opened > .box__lid {

  animation: tapa_superior 2s forwards;

}



.boxes .box.gifted > .box__gift {

  animation: tapa_superior 4s infinite alternate;

}



.modal {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1050;

  display: none;

  width: 100%;

  height: 100%;

  overflow: hidden;

  outline: 0;

}



.modal_open {

  overflow: hidden;

  display: block;

}



.modal_open .modal {

  overflow-x: hidden;

  overflow-y: auto;

}



.modal__dialog {

  position: relative;

  width: auto;

  margin: 0.5rem;

  pointer-events: none;

}



.fade {

  transition: opacity 0.15s linear;

}



.modal_open.fade {

  background-color: rgba(0, 0, 0, 0.5);

}



.modal.fade .modal__dialog {

  transition: -webkit-transform 0.3s ease-out;

  transition: transform 0.3s ease-out;

  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;

  -webkit-transform: translate(0, -50px);

  transform: translate(0, -50px);

}



.modal.modal_open .modal__dialog {

  -webkit-transform: none;

  transform: none;

}



.modal__content {

  position: relative;

  display: -ms-flexbox;

  display: flex;

  -ms-flex-direction: column;

  flex-direction: column;

  width: 100%;

  pointer-events: auto;

  background-color: #fff;

  background-clip: padding-box;

  border: 1px solid rgba(0, 0, 0, 0.2);

  border-radius: 0.3rem;

  outline: 0;

}



.modal__body {

  position: relative;

  -ms-flex: 1 1 auto;

  flex: 1 1 auto;

  padding: 1rem;

  display: flex;

  align-items: center;

  flex-direction: column;

}



.modal__img {

  animation: temblor_inf 2s;

  animation-iteration-count: infinite;

  max-width: 100%;

  max-height: 20vh;

}



.modal__title {

  color: #575757;

  font-size: 25px;

  text-align: center;

  text-transform: none;

  position: relative;

  padding: 0;

  display: block;

  margin-bottom: 20px;

  font-weight: 700;

}



.modal__body p {

  font-size: 14px;

  font-weight: 300;

  line-height: 18px;

  color: #797979;

  text-align: center;

  position: relative;

  float: none;

  margin: 0;

  padding: 0;

  margin: 10px 0;

}



.modal__button {

  display: inline-block;

  box-shadow: rgb(140 212 245 / 80%) 0 0 2px, rgb(0 0 0 / 5%) 0 0 0 1px inset;

  background-color: #0150aa;

  color: white;

  border: 0;

  box-shadow: none;

  font-size: 17px;

  font-weight: 500;

  border-radius: 5px;

  padding: 10px 32px;

  margin: 26px 5px 0 5px;

  cursor: pointer;

}



.checkmark {
  display: none;
}

.checkmark {
  cursor: pointer;
  position: absolute;
  top: 3.3em;
  left: 1em;
}

.checkmark:before,
.checkmark:after {
  content: "";
  position: absolute;
  width: 5em;
  height: 4px;
  background: #c71700;
}

.checkmark:before {
  transform: rotate(45deg);
}

.checkmark:after {
  transform: rotate(-45deg);
}



@-moz-keyframes showNoty {

  0% {

    opacity: 0;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 1;

  }

}



@-webkit-keyframes showNoty {

  0% {

    opacity: 0;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 1;

  }

}



@keyframes showNoty {

  0% {

    opacity: 0;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 1;

  }

}



@-moz-keyframes hiddenNoty {

  0% {

    opacity: 1;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 0;

  }

}



@-webkit-keyframes hiddenNoty {

  0% {

    opacity: 1;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 0;

  }

}



@keyframes hiddenNoty {

  0% {

    opacity: 1;

  }

  50% {

    opacity: 0.5;

  }

  100% {

    opacity: 0;

  }

}



@keyframes checkmark {

  0% {

    height: 0;

    width: 0;

    opacity: 1;

  }

  20% {

    height: 0;

    width: 1.75em;

    opacity: 1;

  }

  40% {

    height: 3.5em;

    width: 1.75em;

    opacity: 1;

  }

  100% {

    height: 3.5em;

    width: 1.75em;

    opacity: 1;

  }

}



.circle-loader {

  border: 1px solid rgba(0, 0, 0, 0.2);

  border-left-color: #5cb85c;

  animation: loader-spin 1.2s infinite linear;

  position: relative;

  display: inline-block;

  vertical-align: top;

  border-radius: 50%;

  width: 7em;

  height: 7em;

  margin-bottom: 20px;

}



.load-complete {

  -webkit-animation: none;

  animation: none;

  border-color: #c71700;

  transition: border 500ms ease-out;

}



@media (prefers-reduced-motion: reduce) {

  .fade {

    transition: none;

  }

}



@keyframes loader-spin {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}



@keyframes temblor {

  10%,

  90% {

    transform: translate3d(-1px, 0, 0);

  }

  20%,

  80% {

    transform: translate3d(2px, 0, 0);

  }

  30%,

  50%,

  70% {

    transform: translate3d(-4px, 0, 0);

  }

  40%,

  60% {

    transform: translate3d(4px, 0, 0);

  }

}



@keyframes temblor_inf {

  0% {

    transform: translate(1px, 1px) rotate(0deg);

  }

  10% {

    transform: translate(-1px, -2px) rotate(-1deg);

  }

  20% {

    transform: translate(-3px, 0px) rotate(1deg);

  }

  30% {

    transform: translate(3px, 2px) rotate(0deg);

  }

  40% {

    transform: translate(1px, -1px) rotate(1deg);

  }

  50% {

    transform: translate(-1px, 2px) rotate(-1deg);

  }

  60% {

    transform: translate(-3px, 1px) rotate(0deg);

  }

  70% {

    transform: translate(3px, 1px) rotate(-1deg);

  }

  80% {

    transform: translate(-1px, -1px) rotate(1deg);

  }

  90% {

    transform: translate(1px, 2px) rotate(0deg);

  }

  100% {

    transform: translate(1px, -2px) rotate(-1deg);

  }

}



@keyframes rotateIn {

  0% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, -200deg);

    transform: rotate3d(0, 0, 1, -200deg);

    opacity: 0;

  }

  100% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}



@keyframes tapa_superior {

  0% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, -200deg);

    transform: rotate3d(0, 0, 1, -200deg);

    opacity: 0;

  }

  100% {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}



@keyframes tapa_superior {

  from {

    top: 0;

  }

  to {

    top: -40px;

  }

}



@keyframes spinnerRotation {

  0% {

    -webkit-transform: rotate(0deg);

    transform: rotate(0deg);

  }

  to {

    -webkit-transform: rotate(359deg);

    transform: rotate(359deg);

  }

}



@media (max-width: 1024px) {

  .header {

    height: 72px;

  }



  .header__navItem:not(.header__navItem_showed) {

    display: none;

  }



  .header__navItemIcon {

    width: 28px;

    height: 28px;

  }



  .header__logo {

    display: none;

  }



  .header__logo_small {

    display: block;

  }

}



@media (max-width: 767px) {

  .boxes {

    grid-template-columns: repeat(3, 1fr);

  }



  .boxes > .box:nth-child(-n + 4) {

    display: none;

  }



  .subheader {

    padding-left: 16px;

    padding-right: 16px;

  }

}



@media (min-width: 576px) {

  .modal__dialog {

    max-width: 500px;

    margin: 1.75rem auto;

  }

  .modal__dialog-scrollable {

    max-height: calc(100% - 3.5rem);

  }

  .modal__dialog-scrollable .modal__content {

    max-height: calc(100vh - 3.5rem);

  }

  .modal__dialog-centered {

    min-height: calc(100% - 3.5rem);

  }

  .modal__dialog-centered::before {

    height: calc(100vh - 3.5rem);

  }

}



@media (max-width: 500px) {

  @keyframes tapa_superior {

    from {

      top: 0;

    }

    to {

      top: -30px;

    }

  }

}



@media (max-width: 420px) {

  .header__search {

    margin-right: 0;

  }



  .header__searchFilter {

    display: none;

  }



  .header__delivery {

    display: none;

  }

}



@media (max-width: 390px) {

  .header__navItem {

    margin: 0 8px;

  }



  .subheader {

    padding: 0 2px;

  }



  .timer__title {

    font-size: 12px;

  }

}



@media (max-width: 319px) {

  .boxes > .box:nth-child(-n + 5) {

    display: none;

  }

}

@media (min-width: 320px) and (max-width: 767px) {

.box__gift {

  z-index: 1;

    padding-top: 36px;

  padding-left: 35px;

  width: 57%;

}

.rating__img_num {

  width: 60%;

}

.gallery__slide {

  width: 50%;

}

}