body {
  --main-accent-color: #e11b11;
  --seondary-accent-color: #ae1603;
  --active-accent-color: #961500;
  --main-background-color: #ffffff;
  --main-text-color: #1e2228;
  --logo-text-color: #3b434f;
  --main-border-color: #d7dae1;
  --border-accent-enabled: #e11b11;
  --border-accent-hover: #ae1603;
  --border-accent-pressed: #961500;
  --secondary-background-color: #f3f5f7;
  --secondary-background-color-hover: #fcfcfd;
  --secondary-background-color-presed: #f9f9fa;
  --hover-text-color: #444c59;
  --hover-border-color: #c8ccd6;
  --secondary-background-hover-color: #e6e8ed;
  --light-background-color: #fcfcfd;
  --light-background-active-color: #f9f9fa;
  --active-background-color: #d7dae1;
  --dark-secondary-color: #9ca3b6;
  --input-focus-color: #bcc1ce;
  --main-disabled-color: #bcc1ce;
  --placeholder-color: #667387;
  --link-text-color: #1284ff;
  --warn-color: #ff8a0c;
  --success-green: #00842f;
  --message-buble: #e6f2ff;
  --dark-message-buble: #d7e5f5;
  --skeleton-background-color: #f3f3f6;
  --skeleton-item-color: #d7dae1;
  --secondary-text-color: #667387;
  --content-secondary-enabled: #667387;
  --background-secondary-hover: #e6e8ed;
  --background-secondary-pressed: #d7dae1;
  --content-tertiary-enabled: #abb0c1;
  --content-tertiary-hover: #abb0c1;
  --content-tertiary-pressed: #7a879d;
  --content-accent-enabled: #e11b11;
  --content-accent-hover: #ae1603;
  --background-accent-hover: #ae1603;
  --background-accent-pressed: #961500;
  background-color: var(--main-background-color);
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  -webkit-font-smoothing: antialiased;
  font-family: "Proxima Nova", system-ui;
  color: var(--main-text-color);
}

.no-transition {
  --transition-multiplier: 0;
}

.main-container {
  display: block;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
}

.inline-link {
  color: var(--link-text-color);
  text-decoration: underline;
  text-decoration-color: transparent;
  transition: text-decoration-color .1s linear;
}

.inline-link:hover {
  color: var(--link-text-color);
  text-decoration: underline;
  text-decoration-color: var(--link-text-color);
}

.input {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding: 12px 16px;
  border-width: 1px;
  border-style: solid;
  border-radius: 10px;
  background-color: var(--main-background-color);
  width: 100%;
  min-width: 100px;
  transition: border-color .1s linear;
  border-color: var(--main-border-color);
}

.input::placeholder {
  color: var(--placeholder-color);
  user-select: none;
}

.input:focus {
  border-color: var(--input-focus-color);
}

.input_error {
  border-color: var(--main-accent-color);
}

.input_error:focus {
  border-color: var(--main-accent-color);
}

.checkbox {
  border: 2px solid;
  border-color: var(--placeholder-color);
  border-radius: 6px;
  width: 24px;
  height: 24px;
  transition-property: background-size, border-color, background-color;
  transition-timing-function: ease;
  transition-duration: .1s;
  background-color: transparent;
  background-image: url("/images/icons/check-white.svg");
  background-size: 0;
  background-position: center;
  cursor: pointer;
  flex-shrink: 0;
}

.checkbox:checked {
  background-color: var(--main-accent-color);
  border-color: var(--main-accent-color);
  background-size: calc(100% + 4px);
}

.checkbox:disabled {
  border-color: var(--main-disabled-color);
}

.checkbox:checked:disabled {
  border-color: var(--main-disabled-color);
  background-color: var(--main-disabled-color);
}

@media screen and (max-width: 1280px) {
  .container {
    padding: 0 40px;
    max-width: unset;
  }
}

@media screen and (max-width: 680px) {
  .container {
    padding: 0 16px;
  }
}