:root {
  --font-family: "Source Sans Pro";
  --font-size: 16px;
  --font-weight: 400;
  --font-style: normal;
  --line-height: 1.625;
  --heading-font-family: "Montserrat";
  --heading-font-size: 2.5rem;
  --heading-line-height: 1.3;
  --heading-font-weight: 700;
  --accent-color: #186adc;
  --el-gradient-start: #1859b4;
  --el-gradient-end: #0467f1;
  --background-color: #ffffff;
  --background-secondary-color: #f0f4f8;
  --text-primary: #181818;
  --text-secondary: #63636b;
  --border-color: #d4d4e1;
  --placeholder-color: #6f6f76;
  --error-color: #ff3d0d;
  --alert-primary: #0065d1;
  --alert-success: #1cab55;
  --alert-danger: #e91c1c;
  --alert-warning: #c79c00;
  --el-border-radius: 10px;
  --el-border-radius-min: 6px;
  --el-box-shadow: 2px 4px 20px 1px rgba(45, 45, 45, 0.13);
  --header-box-shadow: 0px 0px 14px 0px rgba(77, 82, 94, 0.15);
}

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/source-sans-pro-v21-latin/source-sans-pro-v21-latin-regular.woff2")
    format("woff2");
}

@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/source-sans-pro-v21-latin/source-sans-pro-v21-latin-700.woff2")
    format("woff2");
}

* {
  box-sizing: border-box;
}

*:before,
*:after {
  box-sizing: border-box;
}

html {
  font-size: var(--font-size);
}

html,
body {
  min-height: 100%;
}

body {
  font-size: 1rem;
  width: 100%;
  min-width: 320px;
  line-height: var(--line-height);
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  font-style: var(--font-style);
  overflow-x: hidden;
  color: var(--text-primary);
  margin: 0;
  padding: 0;
  opacity: 1;
  background: linear-gradient(180deg, #35695c 75%, #80805B);
}
.section {
  position: relative;
  text-align: -webkit-center;
  color: var(--text-primary);
}

.btn-w350 {
  max-width: 25rem;
  max-height: 4rem;
  min-width: 20rem;
  min-height: 4rem;
  background-color: white;
  letter-spacing: 2px;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: var(--text-primary);
  position: relative;
  transition: all 0.4s ease;
  cursor: pointer;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border: 0;
}
.btn-w350 span {
  z-index: 1;
  text-align: center;
}
.btn-w350::before,
.btn-w350::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 100%;
  top: 0;
  transition: all 0.4s ease;
  background-color: #b8b884;
}
.btn-w350::before {
  left: 0;
}
.btn-w350::after {
  right: 0;
}
.btn-w350:hover {
  transition: all 0.4s ease;
  letter-spacing: 2px;
  color: white;
}
.btn-w350:hover::before,
.btn-w350:hover::after {
  width: 51%;
}

body.overflow-hidden {
  overflow: hidden;
}

*::-webkit-input-placeholder,
*::placeholder {
  color: var(--placeholder-color);
  opacity: 1;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime-local"],
input[type="file"],
select,
textarea {
  display: block;
  font-size: 1rem;
  font-family: var(--font-family);
  font-weight: var(--font-weight);
  width: 100%;
  padding: calc(0.75em - 1px) 1rem;
  margin-bottom: 1rem;
  line-height: var(--line-height);
  border-radius: var(--el-border-radius-min);
  border: 1px solid var(--border-color);
  background-color: transparent;
  outline: none;
  color: var(--text-primary);
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  transition: all 0.2s;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
input[type="file"]:focus,
select:focus,
textarea:focus {
  border-color: var(--accent-color);
  box-shadow: 0 0 0 .2rem rgb(53 105 92 / 48%) !important;
}

input[type="text"]:disabled,
input[type="email"]:disabled,
input[type="tel"]:disabled,
input[type="password"]:disabled,
input[type="number"]:disabled,
input[type="search"]:disabled,
input[type="url"]:disabled,
input[type="date"]:disabled,
input[type="month"]:disabled,
input[type="week"]:disabled,
input[type="time"]:disabled,
input[type="datetime-local"]:disabled,
input[type="file"]:disabled,
select:disabled textarea:disabled {
  background-color: var(--background-secondary-color);
}

textarea {
  height: auto;
  resize: none;
}

.form-fields {
  margin-bottom: -1.25rem;
}

.form-field {
  position: relative;
  margin-bottom: 1.25rem;
}

.form-field.error input,
.form-field.error textarea {
  border-color: var(--error-color);
}

.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="tel"],
.form-field input[type="password"],
.form-field input[type="number"],
.form-field input[type="search"],
.form-field input[type="url"],
.form-field input[type="date"],
.form-field input[type="month"],
.form-field input[type="week"],
.form-field input[type="time"],
.form-field input[type="datetime-local"],
.form-field input[type="file"],
.form-field textarea,
.form-field select,
.form-field .form-field-label {
  margin: 0;
}

.form-field.form-field-m0 {
  margin: 0;
}

.form-field.focus .form-field-label {
  opacity: 0;
  visibility: hidden;
  transform: translateX(1rem);
}

.form-field div.error {
  position: absolute;
  right: 0.3125rem;
  top: 0.3125rem;
  color: var(--error-color);
  font-size: 0.75rem;
  line-height: 1;
}

.form-field.form-field-checkbox div.error {
  position: absolute;
  right: initial;
  left: 0;
  top: -0.875rem;
  color: var(--error-color);
  font-size: 0.75rem;
  line-height: 1;
}

.form-field input.error,
.form-field textarea.error {
  border-color: var(--error-color);
}

.form-field small {
  color: var(--text-secondary);
}

.input-states-labelled {
  display: block;
}

.form-field-group {
  position: relative;
}

.form-field-group.focus .form-field-label {
  opacity: 0;
  visibility: hidden;
  transform: translateX(1rem);
}

.required {
  color: var(--error-color);
}

.form-field-label {
  font-size: 1rem;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  pointer-events: none;
  color: var(--placeholder-color);
  padding: calc(0.75em - 1px) 1rem;
  transition: all 0.2s;
  border: 1px solid transparent;
  opacity: 1;
  visibility: visible;
  transform: none;
}

.form-btn {
  display: flex;
}

.form-btn.form-btn-wide .btn {
  width: 100%;
}

.form-btn .btn {
  display: block;
}

input.error {
  border-color: var(--bs-form-invalid-border-color);
  padding-right: calc(1.5em + 0.75rem);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right calc(0.375em + 0.1875rem) center;
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

label.error {
  border: 1px red;
  font-weight: 400;
  color: red;
}

input.error:focus {
  border-color: var(--bs-form-valid-border-color);
  box-shadow: 0 0 0 0.25rem rgba(var(--bs-danger-rgb), 0.25);
}