@font-face {
  font-family: SFUIDisplay;
  src: local(SFUIDisplay-Semibold),
    url(../fonts/SFUIDisplay-Bold.woff2) format("woff2"),
    url(../fonts/SFUIDisplay-Bold.woff) format("woff");
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: SFUIDisplay;
  src: local(SFUIDisplay-Bold),
    url(../fonts/SFUIDisplay-Heavy.woff2) format("woff2"),
    url(../fonts/SFUIDisplay-Heavy.woff) format("woff");
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: 'SFRounded';
  src: url(../fonts/SFRounded-Medium.woff2) format('woff2'),
      url(../fonts/SFRounded-Medium.woff) format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'SFRounded';
  src: url(../fonts/SFRounded-Regular.woff2) format('woff2'),
      url(../fonts/SFRounded-Regular.woff) format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  --defaultTextColor: #000;
  --white: rgba(255, 255, 255, 1);
  --white-48: rgba(255, 255, 255, 0.48);
  --white-40: rgba(255, 255, 255, 0.40);
  --white-32: rgba(255, 255, 255, 0.32);
  --white-24: rgba(255, 255, 255, 0.24);
  --white-16: rgba(255, 255, 255, 0.16);
  --white-8: rgba(255, 255, 255, 0.08);
  --primary-900: #981A33;
  --primary-800: #B21F3B;
  --primary-700: #CB2344;
  --primary-600: #E5284D;
  --primary-500: #FE2C55;
  --primary-400: #FFCDD6;
  --primary-300: #FFDDE4;
  --primary-200: #FFEFF2;
  --primary-100: #F8F8F8;
  --primary-48: rgba(254, 44, 85, 0.48);
  --primary-40: rgba(254, 44, 85, 0.40);
  --primary-32: rgba(254, 44, 85, 0.32);
  --primary-24: rgba(254, 44, 85, 0.24);
  --primary-16: rgba(254, 44, 85, 0.16);
  --primary-8: rgba(254, 44, 85, 0.08);
  --secondary-900: #151A30;
  --secondary-800: #192038;
  --secondary-700: #222B45;
  --secondary-600: #2E3A59;
  --secondary-500: #737276;
  --secondary-400: #C5CEE0;
  --secondary-350: #C4C3C3;
  --secondary-300: #E4E9F2;
  --secondary-200: #EDF1F7;
  --secondary-100: #F8F8F8;
  --secondary-48: rgba(143, 155, 179, 0.48);
  --secondary-40: rgba(143, 155, 179, 0.40);
  --secondary-32: rgba(143, 155, 179, 0.32);
  --secondary-24: rgba(143, 155, 179, 0.24);
  --secondary-16: rgba(143, 155, 179, 0.16);
  --secondary-14: rgba(34, 229, 224, 0.14);
  --secondary-8: rgba(143, 155, 179, 0.08);
  --teal-500: #22e5e0;
  --teal-18: rgba(0, 176, 185, 0.18);
  --text: #77838f;
  --grey-500: #737276;
  --grey-300: #F1F3FC;
  --grey-100: #DFE2E8;
  --border: #eaecf1;
  --success-500: #03D07D;
  --success-100: #D1F2E5;
  --warning-500: #A99467;
  --warning-500: #A99467;
  --warning-300: #F2AC23;
  --warning-15: rgba(208, 139, 3, 0.15);
  --progress-500: #2961FF;
  --progress-10: rgba(35, 103, 252, 0.1);
  --danger-100: #FFE7E7;
  --bg-disable: rgba(228, 231, 237, 0.24);
  --bg-btn-disable:rgba(143, 155, 179, 1);
  --color-disable: #C0C7D5;
  --black: #000;
  /* tipografy */
  --fotnFamily: "Manrope", sans-serif;
  --fotnFamilySfuid: "SFUIDisplay", sans-serif;
  --fotnFamilyMontserrat: 'Montserrat', sans-serif;
  --defaultFontSize: 14px;
  --defaultLineHeight: 18px;
  --h1Size: 36px;
  --h2Size: 32px;
  --h3Size: 30px;
  --h4Size: 26px;
  --h5Size: 22px;
  --h6Size: 18px;
  --defaultRaduis: 5px;
  --defaultRadius2: 8px;
  --header-fixed-padding: 70px;

  --5-transparent-fill-2-basic-24: rgba(143, 155, 179, 1);
}

body {
  font-size: 100%;
  font-weight: normal;
  font-family: var(--fotnFamily);
  font-weight: 400;
  font-size: var(--defaultFontSize);
  line-height: var(--defaultLineHeight);
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color: var(--defaultTextColor);
}


body.lock {
  overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: bold;
  font-family: var(--fotnFamily);
  line-height: 120%;
}

h1 {
  font-size: var(--h1Size);
}

h2 {
  font-size: var(--h2Size);
}

h3 {
  font-size: var(--h3Size);
}

h4 {
  font-size: var(--h4Size);
}

h5 {
  font-size: var(--h5Size);
}

h6 {
  font-size: var(--h6Size);
}

.input,
.textarea {
  opacity: 1;
  color: var(--black);
  font-weight: 400;
  font-style: normal;
  padding: 10px 0;
  font-size: var(--defaultFontSize);
  width: 100%;
  background-color: transparent;
}
input,
button,
textarea {
  font-family: var(--fotnFamily);
}

.radius-5 {
  border-radius: var(--defaultRaduis);
}
.wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  overflow: hidden;
}
.header-fixed {
  padding-top: var(--header-fixed-padding);
}
.content {
  flex: auto;
  display: flex;
  flex-direction: column;
}
.container {
  max-width: 1280px;
  margin: 0 auto;
  width: 100%;
  padding: 0 15px;
}

/* colors */

.color-primary {
  color: var(--primary);
}
.color-danger {
  color: var(--danger);
}
.color-warning {
  color: var(--warning);
}
.color-secondary {
  color: var(--secondary);
}

/* bg-colors */

.bg-primary {
  background-color: var(--primary);
}
.bg-danger {
  background-color: var(--danger);
}
.bg-warning {
  background-color: var(--warning);
}
.bg-secondary {
  background-color: var(--secondary);
}

.scroll-hidden{
  overflow: hidden;
}