:root {
  --gray1: #323b4b;
  --gray2: #5b647b;
  --gray3: #828282;
  --gray4: #e7e7e7;
  --gray5: #323232;
  --gray6: #5a6b7b;
  --gray7: #676767;
  --gray8: #4b5368;
  --gray9: #2c3037;
  --gray10: #3b3e40;
  --gray11: rgba(183, 177, 177, 0.5);
  --gray12: #686868;
  --gray13: #b7b1b1;
  --gray14: #570d25;
  --gray15: #706a6a;
  --gray16: #f0f0f0;
  --gray17: #323b4b;
  --gray18: #162a3a;
  --gray19: #eff5fa;

  --wine1: #90143c;
  --wine2: #89143a;
  --wine3: #811337;
  --wine4: #570d25;
  --wine5: #90143c;
  --wine6: #560d24;
  --wine7: rgba(218, 41, 28, 0.3);
  --wine8: #da291c;
  --wine9: #a72b43;
  --wine10: #911941;
  --wine11: rgba(187, 16, 72, 0.36);
  --wine12: #bb1048;

  --button--gradient1: linear-gradient(
    90deg,
    rgba(255, 7, 87, 0.18) 5.04%,
    #ff0757 108.64%
  );
  --button--gradient2: linear-gradient(90deg, #ff0757 5.04%, #ff0757 108.64%);
  --button--gradient3: linear-gradient(90deg, #e81f60 -6.43%, #ff0052 108.64%);
  --button--gradient4: linear-gradient(
    269.52deg,
    #fd0493 16.86%,
    #ea1d65 108.9%
  );

  --background-gradient: linear-gradient(180deg, #8a143a 0%, #671832 100%);
  --background-gradient2: linear-gradient(180deg, #8a143a 0%, #000000 100%);

  --lightbrown: #d9a863;
  --lightred: #fc0455;
  --orange: #feaa3f;
  --orange2: #eb5c5d;

  --white: #fff;
  --black: #000;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

html::-webkit-scrollbar {
  display: none;
}

* {
  margin: 0;
  padding: 0;
  border: none;
  box-sizing: border-box;
  list-style: none;
  outline: none;
  text-decoration: none;

  font-size: 1.8rem;
}

img {
  max-width: 100%;
  display: block;
}

button {
  background-color: transparent;
  cursor: pointer;
}

ul,
ol {
  margin: 0;
}

/* GRID */
.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.container-fav {
  width: 100%;
  max-width: calc(1200px + 30px);
  margin: 0 auto;
  padding: 0 15px;
}

@media (max-width: 992px) {
}

@media only screen and (max-width: 600px) {
  html {
    font-size: 40%;
  }

  /* .row{
    margin: 0!important;
  } */
}
