@font-face {
  font-family: "Myriad Pro Bold";
  src: url(assets/fonts/MYRIADPRO-BOLD.woff) format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Myriad Pro Regular";
  src: url(assets/fonts/MYRIADPRO-REGULAR.woff) format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: Inter, "Work Sans", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}
.normal-font {
  font-family: "Myriad Pro Bold", sans-serif !important;
}
html {
  scroll-behavior: smooth;
}
.ribbon-left {
  position: absolute;
  left: -7px;
  top: -4px;
  z-index: 1;
  overflow: hidden;
  width: 161px;
  height: 158px;
  text-align: center;
}
.ribbon-left span {
  font-family: myriad-pro, sans-serif;
  font-style: normal;
  font-weight: 800;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  line-height: 30px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  width: 180px;
  display: block;
  background: linear-gradient(#f70505 0, #8f0808 100%);
  box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
  position: absolute;
  top: 37px;
  left: -33px;
}
.ribbon-left span::after,
.ribbon-left span::before {
  content: "";
  position: absolute;
  top: 100%;
  z-index: -1;
  border: 3px solid transparent;
  border-top: 3px solid #8f0808;
}
.ribbon-left span::before {
  left: 0;
  border-left: 3px solid #8f0808;
}
.ribbon-left span::after {
  right: 0;
  border-right: 3px solid #8f0808;
}
.bold-font {
  font-family: "Myriad Pro Bold", sans-serif;
}
#hoverLink:hover ~ #moneyBackImage {
  transform: rotate(12deg);
}
.liked {
  color: #385898;
  font-weight: 700;
}