* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  line-height: normal;
}

:root {
  --white: #FFFFFF;
  --off-white: #F5F5F6;
  --black: #5B6770;
  --gray: #98A4AE;
  --primary: #49C5B1;
  --primary-80: #A4E2D8;
  --primary-60: #DBF3EF;
}

@font-face {
  font-family: 'DIN';
  src: url('../font/DIN-BlackAlternate.ttf') format('opentype');
  font-weight: 900;
}

@font-face {
  font-family: 'DIN';
  src: url('../font/DIN-Bold.otf') format('opentype');
  font-weight: 700;
}

@font-face {
  font-family: 'DIN';
  src: url('../font/DIN-Medium.otf') format('opentype');
  font-weight: 500;
}

@font-face {
  font-family: 'DIN';
  src: url('../font/DIN-Regular.ttf') format('opentype');
  font-weight: 400;
}

@font-face {
  font-family: 'DIN';
  src: url('../font/DIN-LightAlternate.ttf') format('opentype');
  font-weight: 300;
}

html{
    scrollbar-width: none;
}

html::-webkit-scrollbar {
  display: none;
}

body {
  font-family: "DIN";
}

input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.container-fluid {
  padding: 0 6rem;
}

.f-40-7 {
  font-weight: 700;
  font-size: 2.5rem;
  line-height: 125%;
  color: var(--black);
}

.f-24-5 {
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 125%;
  color: var(--black);
}

.f-24-4 {
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 135%;
  color: var(--black);
}

.f-22-4 {
  font-weight: 400;
  font-size: 1.375rem;
  line-height: 140%;
  color: var(--black);
}

.f-20-5 {
  font-weight: 500;
  font-size: 1.25rem;
  line-height: 125%;
  color: var(--black);
}

.f-20-4 {
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 130%;
  color: var(--black);
}

.f-18-7 {
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 135%;
  letter-spacing: -0.025rem;
  color: var(--black);
}

.f-18-4 {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 140%;
  letter-spacing: -0.025rem;
  color: var(--black);
}  

.f-14-7 {
  font-weight: 700;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: var(--black);
}

.f-14-5 {
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: var(--black);
}

.f-14-4 {
  font-weight: 400;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  color: var(--black);
}

.btn {
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
  padding: 1.4688rem 2rem 1.3438rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  border-radius: 40px;
  position: relative;
  border: none;
  border-bottom: 2px solid var(--primary);
  background: var(--white);
  color: var(--black);
  overflow: hidden;
  transition: all .3s ease-in-out;
}

.btn span {
  position: relative;
  z-index: 1;
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.08em;
}

.btn:hover {
  color: var(--primary) !important;
  border-bottom: 2px solid var(--primary) !important;
  background: var(--white) !important;
}

.btn-primary.btn {
  border-color: var(--primary);
  color: var(--white);
  background: var(--primary);
}

.btn-primary.btn:hover {
  background: #3FBBA7 !important;
  color: var(--white) !important;
  border-bottom: 2px solid var(--primary) !important;
}