:root {
  --bgclrdark: hsl(0, 0%, 39%);
  --bgclrcontentdark: hsl(0, 0%, 80%);
  --navbar: hsl(0, 0%, 1%);
  --textclrprimary: hsl(0, 0%, 10%);
  --textclrsecondary: hsl(0, 0%, 17%);
  --footer-border: hsl(0, 0%, 50%);
  --sold-out: hsl(0, 100%, 71%);
  --primary: hsl(214, 74%, 53%);
  --primary-dark: hsl(83, 97%, 26%);
  --primary-dark-trnslcnt: hsla(214, 45%, 25%, 0.75);
  --secondary1: hsl(137, 100%, 18%);
  --secondary2: hsl(290, 50%, 50%);
  --secondary3: hsl(210, 40%, 50%);
  --accent: hsl(40, 100%, 55%);
  --success: hsl(140, 60%, 40%);
  --warning: hsl(30, 100%, 50%);
  --danger: hsl(0, 80%, 55%);
  --muted: hsl(0, 0%, 50%);
  --bgsecondary:hsl(0, 100%, 94%);
  --paddingbasic: 20px;
  --marginbasic: 10px;
  --navbar-height: 75px;
  --border-radius: 45px;
  --border-radius-small: 15px;
  /* --border-radius-small: 25px; */
}

@font-face {
  font-family: "milven";
  src: url("fonts/Milven-Regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "moela";
  src: url("fonts/MOELA.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "coolvetica";
  src: url("fonts/Coolvetica\ Rg.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "roboto";
  src: url("fonts/Roboto-Regular.ttf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "somer";
  src: url("fonts/SOMER.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}