/*
    File Name: all-sections.scss

    Description:
    This is the all-secitons SCSS file that imports all sections SCSS files.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the necessary styles from the smaller SCSS files.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
.general-form .heading {
  margin-bottom: 30px;
}
.general-form .heading .title {
  margin-bottom: 15px;
}
.general-form .heading .title:last-child {
  margin-bottom: 0;
}
.general-form .heading .title h1,
.general-form .heading .title h2,
.general-form .heading .title h3,
.general-form .heading .title h4,
.general-form .heading .title h5,
.general-form .heading .title h6 {
  font-size: 3rem;
  line-height: 3.6rem;
}
.general-form .form-wrapper .input-wrapper {
  margin-bottom: 16px;
}
.general-form .form-wrapper .input-wrapper:last-child {
  margin-bottom: 0;
}
.general-form .form-wrapper .input-wrapper input {
  width: 100%;
}
.general-form .additional-text {
  text-align: center;
  margin-top: 24px;
  margin-bottom: 24px;
  font-size: 1.4rem;
  color: rgba(23, 23, 23, 0.6980392157);
}
.general-form .additional-text a {
  color: #AA182C;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  text-decoration: underline;
}
.general-form .additional-text a:hover {
  text-decoration: none;
}
.general-form .additional-text + .input-wrapper {
  margin-top: 32px;
}
.general-form .input-wrapper + .additional-text {
  margin-top: 8px;
}
.general-form .menu {
  font-size: 1.2rem;
  line-height: 1.8rem;
  font-family: "primary-regular", Arial, Helvetica, sans-serif;
  color: #78716C;
  margin-top: 20vh;
}
.general-form .menu nav ul {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 34px;
  padding-left: 12px;
  padding-right: 12px;
}
.general-form .menu nav ul li {
  position: relative;
  list-style: none;
  margin-bottom: 12px;
}
.general-form .menu nav ul li a {
  font-size: inherit;
  line-height: inherit;
  font-family: inherit;
  color: inherit;
}
.general-form .menu nav ul li:not(:last-child)::before {
  content: "";
  position: absolute;
  right: -17px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  background-color: #78716C;
}
.general-form button,
.general-form .button {
  padding-top: 10.5px;
  padding-bottom: 10.5px;
  width: 100%;
  line-height: 1.7rem;
  font-size: 1.4rem;
  font-family: "secondary-semi-bold", Arial, Helvetica, sans-serif;
  letter-spacing: 1.5px;
}
.general-form.extra-narrow .general-form__inner {
  max-width: 332px;
  margin: 0 auto;
}
.general-form.extra-narrow .heading .title {
  margin-bottom: 32px;
}
.general-form.extra-narrow .heading .title:last-child {
  margin-bottom: 0;
}
.general-form.extra-narrow .heading .subtitle {
  max-width: 100%;
  font-size: 1.4rem;
  line-height: 2.1rem;
}
.general-form.medium-narrow .general-form__inner {
  max-width: 763px;
  margin: 0 auto;
}
.general-form.change-password button[type=submit],
.general-form.change-password input[type=submit], .general-form.my-account button[type=submit],
.general-form.my-account input[type=submit] {
  display: flex;
  margin-left: auto;
  margin-right: 0;
  margin-top: 56px;
}
.general-form .additional-fields {
  padding: 20px;
  background-color: #fafafa;
}
.general-form .additional-fields .input-two-col-wrapper .input-wrapper {
  min-width: unset;
}
.general-form .additional-fields:not(:last-child) {
  margin-bottom: 16px;
}
.general-form .highlighted-fields {
  padding: 20px;
  background-color: #fafafa;
}
.general-form .highlighted-fields .highlighted-fields--title {
  margin-bottom: 16px;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
}
.general-form .highlighted-fields:not(:last-child) {
  margin-bottom: 16px;
}
.general-form .highlighted-fields .button-file-input {
  background-color: #FFFFFF;
}
.general-form .urls-input-wrapper .input-wrapper__inner input {
  padding-right: 45px;
}
.general-form .add-url-btn-wrapper {
  margin-bottom: 5px;
}
.general-form .remove-url-btn {
  position: absolute;
  right: 10px;
  top: 0;
  padding: 11px !important;
}
.general-form #urls_error:not(:empty) {
  margin-bottom: 16px;
}
.general-form .label-and-button {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.general-form .label-and-button .add-url-btn-wrapper {
  margin-bottom: 0;
}
.general-form .files-list {
  padding: 0;
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 15px;
}
.general-form .files-list:empty {
  display: none;
}
.general-form .files-list li {
  background: #AA182C;
  color: #FFFFFF;
  padding: 6px 50px 6px 12px;
  border-radius: 15px;
  list-style: none;
  margin: 0;
  font-size: 1.4rem;
  position: relative;
  max-width: 240px;
}
.general-form .files-list li button {
  position: absolute;
  right: 19px;
  top: 6px;
}
.general-form .files-list li button::before {
  background-image: url("../../../img/icons/xmark--white.svg") !important;
}
.general-form .input-wrapper--radio .input-wrapper__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 25px;
}
.general-form .input-wrapper--radio .checkbox-container .inner {
  position: initial;
}
.general-form .citizenship-choice .citizenship-choice__inner,
.general-form .citizenship-choice .member-type-choice__inner,
.general-form .member-type-choice .citizenship-choice__inner,
.general-form .member-type-choice .member-type-choice__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.general-form .citizenship-choice .citizenship-choice__inner .input-wrapper,
.general-form .citizenship-choice .member-type-choice__inner .input-wrapper,
.general-form .member-type-choice .citizenship-choice__inner .input-wrapper,
.general-form .member-type-choice .member-type-choice__inner .input-wrapper {
  margin-bottom: 0 !important;
}
.general-form .note {
  margin-top: 2px;
  font-size: 1.2rem;
  font-style: italic;
  color: #7C7C7C;
}
.general-form .note:not(:last-child) {
  margin-bottom: 20px;
}
.general-form [data-switch-by-member-type] {
  margin-bottom: 16px;
}

.label-and-link-wrapper {
  display: flex;
  gap: 5px 50px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.label-and-link-wrapper + .input-wrapper__inner {
  margin-top: 8px;
}
.label-and-link-wrapper .link {
  font-size: 1.3rem;
}

.label-and-tooltip-wrapper + .input-wrapper__inner {
  margin-top: 8px;
}

.input-wrapper--checkbox {
  font-size: 1.4rem;
}

.imask-wrapper {
  position: relative;
}

.placeholder-overlay {
  position: absolute;
  left: 1px;
  top: 50%;
  color: #A8A29E;
  pointer-events: none;
  font-family: inherit;
  font-size: 1.4rem;
  padding: 7px 15px;
  line-height: 2rem;
  transform: translateY(-50%);
}

@media (max-width: 575px) {
  .general-form .menu nav ul {
    display: block;
  }
  .general-form .menu nav ul li {
    text-align: center;
  }
  .general-form .menu nav ul li:not(:last-child) {
    margin-bottom: 10px;
  }
  .general-form .menu nav ul li:not(:last-child)::before {
    content: none;
  }
  .general-form .additional-fields .input-two-col-wrapper {
    flex-direction: column;
  }
  .general-form .additional-fields .input-two-col-wrapper .input-wrapper {
    width: 100%;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== GENERAL TABLE ====

    Description:
        General fortable section.

    Modificators:
        No modificators.
*/
.general-table .heading {
  max-width: 100%;
  border-bottom: 1px solid #D6D3D1;
  padding-bottom: 12px;
  margin-bottom: 15px;
}
.general-table .heading .title-and-cta {
  display: flex;
  align-items: flex-end;
  gap: 30px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.general-table .heading .title-and-cta .cta {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
.general-table .heading .title-and-cta .cta .button.export .icon {
  margin-right: 5px;
}
.general-table .heading .title-and-cta .cta .button.export:hover .icon {
  color: #FFFFFF;
  fill: #FFFFFF;
}
.general-table .heading .title {
  margin-bottom: 0;
}
.general-table .heading .title h1,
.general-table .heading .title h2,
.general-table .heading .title h3,
.general-table .heading .title h4,
.general-table .heading .title h5,
.general-table .heading .title h6 {
  font-size: 1.8rem;
  line-height: 2.4rem;
}
.general-table .heading .subtitle {
  margin-top: 25px;
}
.general-table .heading .cta .button {
  padding: 7px 16px;
  font-size: 1.3rem;
  line-height: 1.6rem;
  letter-spacing: 0.5px;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
}
.general-table .heading .cta .button.with-icon {
  padding-left: 32px !important;
  background-color: #F5F5F4;
}
.general-table .heading .cta .button.with-icon:hover {
  background-color: #E7E5E4;
  color: #131313;
}
.general-table .heading .cta .button.with-icon .icon {
  margin-right: 7px;
  left: 12px;
}
.general-table .heading.with-breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.general-table .heading.with-breadcrumbs .breadcrumbs ul {
  position: relative;
  padding-left: 30px;
}
.general-table .heading.with-breadcrumbs .breadcrumbs ul::before {
  content: "/";
  color: #D6D3D1;
  font-weight: bold;
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
}
.general-table .search-table {
  margin-bottom: 20px;
}
.general-table .search-table .search-table__inner {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 8px;
  align-items: flex-end;
}
.general-table .search-table .input-wrapper {
  margin-bottom: 0;
  flex: 1;
  min-width: 200px;
}
.general-table .search-table .input-wrapper-group {
  display: flex;
  align-items: center;
}
.general-table .search-table .input-wrapper-group input {
  border-left-color: transparent;
}
.general-table .search-table .input-wrapper-group input:focus {
  border-left-color: #171717;
}
.general-table .search-table .cta .button {
  padding: 7px 16px;
  font-size: 1.3rem;
  line-height: 1.6rem;
  letter-spacing: 0.5px;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
}
.general-table .search-table .cta .button.with-icon {
  padding-left: 32px !important;
  background-color: #F5F5F4;
}
.general-table .search-table .cta .button.with-icon:hover {
  background-color: #E7E5E4;
  color: #131313;
}
.general-table .search-table .cta .button.with-icon .icon {
  margin-right: 7px;
  left: 12px;
}
.general-table .table-wrapper {
  display: block;
  overflow-x: auto;
  white-space: nowrap;
}
.general-table .table-wrapper .table-wrapper__inner {
  padding-top: 13px;
}
.general-table .table-wrapper .table-wrapper__inner table {
  width: 100%;
}
.general-table .table-wrapper.horizontal-scrollbar-visible {
  padding-bottom: 20px;
}
.general-table .table-wrapper .os-viewport {
  padding: 35px 0 20px 0 !important;
}
.general-table .table-wrapper .os-scrollbar-track .os-scrollbar-handle {
  height: 8px;
  background-color: #D6D3D1;
  cursor: grab;
}
.general-table .table-wrapper .os-scrollbar-track .os-scrollbar-handle:active {
  cursor: grabbing;
}
.general-table .choices .choices__inner {
  min-height: 32px;
  padding: 6px 28px 6px 8px !important;
}
.general-table .choices .choices__item {
  font-size: 1.3rem;
}
.general-table .choices .choices__item.choices__placeholder {
  display: none;
}
.general-table .choices .choices__list--dropdown .choices__item {
  padding: 5px 8px;
  font-size: 1.3rem;
}
.general-table .choices[data-type*=select-one]::after {
  border-width: 4px;
}
.general-table .choices .choices__list.choices__list--single {
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
  font-weight: 500;
}
.general-table .choices .choices__list.choices__list--single .placeholder-and-value {
  display: flex;
  align-items: center;
  gap: 5px;
}
.general-table .choices .choices__list.choices__list--single .placeholder-and-value .selected-value {
  width: 100%;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.general-table .choices .choices__list.choices__list--single span {
  font-family: "primary-regular", Arial, Helvetica, sans-serif;
}
.general-table .input-wrapper input {
  padding: 6px 10px;
  font-size: 1.3rem;
  line-height: 1.8rem;
}
.general-table .actions-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.general-table .actions-wrapper .tooltip.flip .tooltip-content {
  top: unset;
  bottom: calc(-100% - 30px) !important;
}
.general-table .actions-wrapper .tooltip .tooltip-content {
  left: unset;
  transform: none;
  right: -10px;
}
.general-table .actions-wrapper .tooltip .tooltip-content::before {
  left: unset;
  transform: none;
  right: 13px;
}
.general-table .actions-wrapper .tooltip .tooltip-btn img {
  max-width: 16px;
}
.general-table .actions-wrapper .action-item a {
  display: inline-block;
  padding: 5px;
  line-height: 0;
  font-size: 0;
}
.general-table.interpretations-list .tooltip .tooltip-content, .general-table.projects-list .tooltip .tooltip-content {
  bottom: 30px;
  font-size: 1.3rem;
  line-height: 1.4rem;
  min-width: calc(100% + 82px);
}
.general-table.interpretations-list .delete-action-item.tooltip .tooltip-content, .general-table.projects-list .delete-action-item.tooltip .tooltip-content {
  min-width: 275px;
  padding: 13px 20px;
  left: unset;
  right: calc(100% + 10px);
  bottom: unset;
  top: 50%;
  transform: translateY(-50%);
}
.general-table.interpretations-list .delete-action-item.tooltip .tooltip-content::before, .general-table.projects-list .delete-action-item.tooltip .tooltip-content::before {
  left: unset;
  transform: none;
  right: -10px;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #131313;
  border-right: none;
  bottom: unset;
  transform: translateY(-50%);
  right: -10px;
  top: 50%;
}
.general-table.interpretations-list table tbody tr:first-child .delete-action-item.tooltip .tooltip-content, .general-table.projects-list table tbody tr:first-child .delete-action-item.tooltip .tooltip-content {
  top: -7px;
  transform: none;
}
.general-table.interpretations-list table tbody tr:first-child .delete-action-item.tooltip .tooltip-content::before, .general-table.projects-list table tbody tr:first-child .delete-action-item.tooltip .tooltip-content::before {
  top: 9px;
  transform: none;
}
.general-table.interpretations-list table tbody tr:last-child .delete-action-item.tooltip .tooltip-content, .general-table.projects-list table tbody tr:last-child .delete-action-item.tooltip .tooltip-content {
  top: unset;
  bottom: -7px;
  transform: none;
}
.general-table.interpretations-list table tbody tr:last-child .delete-action-item.tooltip .tooltip-content::before, .general-table.projects-list table tbody tr:last-child .delete-action-item.tooltip .tooltip-content::before {
  bottom: 9px;
  top: unset;
  transform: none;
}

/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== PAGE HEADER ====

    Description:
        Website page headers.

    Modificators:
        No modificators.
*/
.page-header {
  padding-bottom: 100px;
  padding-top: 236px;
}
.page-header .bg-image {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
}
.page-header .bg-image::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  background: linear-gradient(to bottom, transparent 0%, #181818 100%);
}
.page-header .bg-image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.page-header .container-fluid {
  position: relative;
  z-index: 2;
}
.page-header .container {
  position: relative;
}
.page-header .container::before {
  content: "";
  position: absolute;
  bottom: -70px;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background-color: #E7E5E4;
}
.page-header.padding-bottom-50 .container::before {
  bottom: -50px;
}
.page-header.padding-bottom-100 .container::before {
  bottom: -100px;
}
.page-header.padding-bottom-150 .container::before {
  bottom: -150px;
}
.page-header.padding-bottom-200 .container::before {
  bottom: -200px;
}
.page-header .page-header__inner {
  display: flex;
  align-items: flex-start;
  gap: 48px;
}
.page-header .page-header__inner .heading {
  width: 57%;
  flex: 1;
  margin-bottom: 0;
}
.page-header .page-header__inner .heading:only-child {
  margin-bottom: 0;
}
.page-header .page-header__inner .heading .title img {
  margin-bottom: 10px;
}
.page-header .page-header__inner .heading .title h1,
.page-header .page-header__inner .heading .title h2,
.page-header .page-header__inner .heading .title h3,
.page-header .page-header__inner .heading .title h4,
.page-header .page-header__inner .heading .title h5,
.page-header .page-header__inner .heading .title h6 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 5.6rem;
  line-height: 6.4rem;
}
.page-header .page-header__inner .heading .subtitle {
  max-width: 100%;
  color: rgba(23, 23, 23, 0.6980392157);
}
.page-header .page-header__inner .content {
  width: 43%;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
  font-size: 1.6rem;
  line-height: 2.6rem;
}
.page-header .page-header__inner .content .cta {
  margin-top: 32px;
}
.page-header .page-header__inner .content .cta:first-child {
  margin-top: 0;
}
.page-header .breadcrumbs {
  margin-bottom: 22px;
}
.page-header .breadcrumbs .list ul li {
  font-size: 1.6rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  line-height: 2.4rem;
  padding-right: 22px;
}
.page-header .breadcrumbs .list ul li::after {
  right: 9px;
  color: #78716C;
}
.page-header .breadcrumbs .list ul li a {
  color: #57534E;
  font-family: "primary-regular", Arial, Helvetica, sans-serif;
}
.page-header.with-bg-image {
  color: #FFFFFF;
}
.page-header.with-bg-image .page-header__inner .heading .subtitle {
  color: #FFFFFF;
}
.page-header.bg-dark-red .container::before, .page-header.bg-black .container::before, .page-header.with-bg-image .container::before {
  content: none;
}
.page-header.extra-slim {
  padding-top: 50px;
  padding-bottom: 50px;
}
.page-header.extra-slim .heading {
  max-width: 100%;
}
.page-header.extra-slim .heading .subtitle {
  max-width: 900px;
}
.page-header.slim {
  padding-top: 117px;
  padding-bottom: 70px;
}
.page-header.hero {
  min-height: calc(100dvh - var(--headerHeight) - 56px);
  display: flex;
  align-items: flex-end;
}
.page-header.bg-black .page-header__inner .heading .subtitle {
  color: #FFFFFF;
}
.page-header.bg-dark-red .page-header__inner .heading .subtitle {
  color: #FFFFFF;
}

@media (max-width: 991px) {
  .page-header {
    padding-top: 100px;
  }
  .page-header.slim {
    padding-top: 100px;
  }
  .page-header .page-header__inner {
    display: block;
  }
  .page-header .page-header__inner .heading,
  .page-header .page-header__inner .content {
    width: 100%;
  }
  .page-header .page-header__inner .heading:not(:last-child) {
    margin-bottom: 48px;
  }
}
@media (max-width: 575px) {
  .page-header {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .page-header.slim {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .page-header .container::before {
    bottom: -50px;
  }
  .page-header.padding-bottom-50 .container::before {
    bottom: -25px;
  }
  .page-header.padding-bottom-100 .container::before {
    bottom: -50px;
  }
  .page-header.padding-bottom-150 .container::before {
    bottom: -75px;
  }
  .page-header.padding-bottom-200 .container::before {
    bottom: -100px;
  }
  .page-header .page-header__inner .heading .title h1,
  .page-header .page-header__inner .heading .title h2,
  .page-header .page-header__inner .heading .title h3,
  .page-header .page-header__inner .heading .title h4,
  .page-header .page-header__inner .heading .title h5,
  .page-header .page-header__inner .heading .title h6 {
    font-size: 3.4rem;
    line-height: 4.4rem;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== INLINE BOXES ====

    Description: 
        Inline boxes section.

    Modificators:
        No modificators.
*/
.inline-boxes {
  padding-top: 100px;
  padding-bottom: 100px;
}
.inline-boxes .heading .title h1,
.inline-boxes .heading .title h2,
.inline-boxes .heading .title h3,
.inline-boxes .heading .title h4,
.inline-boxes .heading .title h5,
.inline-boxes .heading .title h6 {
  font-size: 5.6rem;
  line-height: 5.6rem;
}
.inline-boxes .inline-boxes__inner .boxes-holder {
  display: flex;
  justify-content: center;
  border-radius: 20px;
  flex-wrap: wrap;
  overflow: hidden;
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-dark-red {
  background-color: transparent;
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-dark-red .box {
  background-color: #AA182C;
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-dark-red .box:not(:last-child) .box__inner::before {
  background-color: rgba(255, 255, 255, 0.3215686275);
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-black {
  background-color: transparent;
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-black .box {
  background-color: #131313;
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-black .box:not(:last-child) .box__inner::before {
  background-color: rgba(255, 255, 255, 0.3215686275);
}
.inline-boxes .inline-boxes__inner .boxes-holder.bg-light-gray .box:not(:last-child) .box__inner::before {
  background-color: #f4f4f4;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box {
  padding: 56px 74px;
  flex: 1;
  text-align: center;
  position: relative;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box .box__inner {
  position: relative;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box:not(:last-child) .box__inner::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 100%;
  background-color: #131313;
  right: -74px;
  top: 0;
  bottom: 0;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box .title {
  font-size: 7.2rem;
  line-height: 8.2rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box .title:not(:last-child) {
  margin-bottom: 16px;
}
.inline-boxes .inline-boxes__inner .boxes-holder .box .content {
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  font-size: 1.8rem;
}

@media (max-width: 1199px) {
  .inline-boxes .inline-boxes__inner .boxes-holder .box .title {
    font-size: 5.6rem;
    line-height: 6.6rem;
  }
}
@media (max-width: 767px) {
  .inline-boxes {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .inline-boxes .heading .title h1,
  .inline-boxes .heading .title h2,
  .inline-boxes .heading .title h3,
  .inline-boxes .heading .title h4,
  .inline-boxes .heading .title h5,
  .inline-boxes .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
}
/*
    Description:
    This is file where all styles related to Articles list are imported.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the necessary styles from the smaller SCSS files.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== ARTICLES LIST ====

    Description: 
        Articles list section. This file contains scss that is common for all articles list types.

    Modificators:

    1. Dispaly type

        Description:             There are 2 possible display types:
                                    1. Grid
                                    2. Slider

        Hook element selector:   articles-list

        Class to add:            1. For Grid display type - class="grid"
                                 2. For Slider display type - class="slider"
*/
.articles-list {
  padding-top: 80px;
  padding-bottom: 80px;
}
.articles-list .slider-controls-container .slider-controls {
  display: flex;
  align-items: center;
  gap: 24px;
}
.articles-list .articles-card .articles-card__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.articles-list .articles-card .articles-card__inner .content {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.articles-list .articles-card .articles-card__inner .content .title {
  margin-bottom: auto;
}
.articles-list .articles-list__inner {
  position: relative;
}
.articles-list .articles-card-wrapper {
  align-items: stretch;
}
.articles-list .heading.text-center .title {
  margin-left: auto;
  margin-right: auto;
}
.articles-list .heading.text-right .title {
  margin-left: auto;
  margin-right: 0;
}
.articles-list .articles-card-wrapper.inner-grid {
  align-items: stretch;
}
.articles-list .articles-list__content {
  max-width: 1000px;
  margin-bottom: 70px;
}
.articles-list .articles-list__content:empty {
  display: none;
}
.articles-list .articles-list__content *:first-child {
  margin-top: 0;
}
.articles-list .articles-list__content *:last-child {
  margin-bottom: 0;
}
.articles-list .articles-list__content.text-center {
  margin-left: auto;
  margin-right: auto;
}
.articles-list .articles-list__content.text-right {
  margin-left: auto;
  margin-right: 0;
}
.articles-list .section-cta {
  margin-top: 50px;
}
.articles-list:last-child {
  margin-bottom: 60px;
}
.articles-list.search-results .text-block {
  padding-top: 70px;
}
.articles-list.search-results .search-input {
  max-width: 900px;
  margin: 0 auto;
  margin-bottom: 70px;
}
.articles-list.search-results .search-input .input-wrapper {
  margin-bottom: 0;
}

.articles-list.bg-black .heading .title h1,
.articles-list.bg-black .heading .title h2,
.articles-list.bg-black .heading .title h3,
.articles-list.bg-black .heading .title h4,
.articles-list.bg-black .heading .title h5,
.articles-list.bg-black .heading .title h6,
.bg-black .articles-list .heading .title h1,
.bg-black .articles-list .heading .title h2,
.bg-black .articles-list .heading .title h3,
.bg-black .articles-list .heading .title h4,
.bg-black .articles-list .heading .title h5,
.bg-black .articles-list .heading .title h6 {
  color: #FFFFFF;
}
.articles-list.bg-black .articles-card,
.bg-black .articles-list .articles-card {
  background-color: #131313;
}
.articles-list.bg-black .articles-card .date,
.bg-black .articles-list .articles-card .date {
  color: #FFFFFF;
}
.articles-list.bg-black .articles-card .content .title h1,
.articles-list.bg-black .articles-card .content .title h2,
.articles-list.bg-black .articles-card .content .title h3,
.articles-list.bg-black .articles-card .content .title h4,
.articles-list.bg-black .articles-card .content .title h5,
.articles-list.bg-black .articles-card .content .title h6,
.bg-black .articles-list .articles-card .content .title h1,
.bg-black .articles-list .articles-card .content .title h2,
.bg-black .articles-list .articles-card .content .title h3,
.bg-black .articles-list .articles-card .content .title h4,
.bg-black .articles-list .articles-card .content .title h5,
.bg-black .articles-list .articles-card .content .title h6 {
  color: #FFFFFF;
}
.articles-list.bg-black .articles-card .text,
.bg-black .articles-list .articles-card .text {
  color: #FFFFFF;
}

.articles-list.bg-dark-red .heading .title h1,
.articles-list.bg-dark-red .heading .title h2,
.articles-list.bg-dark-red .heading .title h3,
.articles-list.bg-dark-red .heading .title h4,
.articles-list.bg-dark-red .heading .title h5,
.articles-list.bg-dark-red .heading .title h6,
.bg-dark-red .articles-list .heading .title h1,
.bg-dark-red .articles-list .heading .title h2,
.bg-dark-red .articles-list .heading .title h3,
.bg-dark-red .articles-list .heading .title h4,
.bg-dark-red .articles-list .heading .title h5,
.bg-dark-red .articles-list .heading .title h6 {
  color: #FFFFFF;
}
.articles-list.bg-dark-red .articles-card,
.bg-dark-red .articles-list .articles-card {
  background-color: #AA182C;
}
.articles-list.bg-dark-red .articles-card .date,
.bg-dark-red .articles-list .articles-card .date {
  color: #FFFFFF;
}
.articles-list.bg-dark-red .articles-card .content .title h1,
.articles-list.bg-dark-red .articles-card .content .title h2,
.articles-list.bg-dark-red .articles-card .content .title h3,
.articles-list.bg-dark-red .articles-card .content .title h4,
.articles-list.bg-dark-red .articles-card .content .title h5,
.articles-list.bg-dark-red .articles-card .content .title h6,
.bg-dark-red .articles-list .articles-card .content .title h1,
.bg-dark-red .articles-list .articles-card .content .title h2,
.bg-dark-red .articles-list .articles-card .content .title h3,
.bg-dark-red .articles-list .articles-card .content .title h4,
.bg-dark-red .articles-list .articles-card .content .title h5,
.bg-dark-red .articles-list .articles-card .content .title h6 {
  color: #FFFFFF;
}
.articles-list.bg-dark-red .articles-card .text,
.bg-dark-red .articles-list .articles-card .text {
  color: #FFFFFF;
}

@media (min-width: 768px) {
  .articles-list.grid .inner-grid .inner-grid__item {
    flex: initial;
  }
}
@media (max-width: 767px) {
  .articles-list {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
.articles-list.grid .heading-and-controls {
  margin-bottom: 50px;
}
.articles-list.grid .heading-and-controls .heading {
  margin-bottom: 0;
}
.articles-list.grid .heading-and-controls .heading .subtitle {
  max-width: 900px;
}
.articles-list.grid .heading-and-controls .heading-and-controls__inner {
  display: flex;
  justify-content: space-between;
  gap: 50px;
  flex-wrap: wrap;
}
.articles-list.grid .articles-card .title h1,
.articles-list.grid .articles-card .title h2,
.articles-list.grid .articles-card .title h3,
.articles-list.grid .articles-card .title h4,
.articles-list.grid .articles-card .title h5,
.articles-list.grid .articles-card .title h6 {
  font-size: 2rem;
  line-height: 3.2rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
}

@media (min-width: 768px) {
  .articles-list.grid .articles-card-wrapper.inner-grid.items-3 .inner-grid__item {
    width: calc(33% - 30px);
  }
}
@media (max-width: 991px) {
  .articles-list.grid .articles-card-wrapper.inner-grid.items-3 .inner-grid__item,
  .articles-list.grid .articles-card-wrapper.inner-grid.items-4 .inner-grid__item {
    width: calc(50% - 24px);
  }
}
@media (max-width: 767px) {
  .articles-list.grid .articles-card-wrapper.inner-grid.items-2 .inner-grid__item, .articles-list.grid .articles-card-wrapper.inner-grid.items-3 .inner-grid__item, .articles-list.grid .articles-card-wrapper.inner-grid.items-4 .inner-grid__item {
    width: 100%;
  }
  .articles-list.grid .articles-card-wrapper.inner-grid.items-2 .inner-grid__item:not(:last-child), .articles-list.grid .articles-card-wrapper.inner-grid.items-3 .inner-grid__item:not(:last-child), .articles-list.grid .articles-card-wrapper.inner-grid.items-4 .inner-grid__item:not(:last-child) {
    margin-bottom: 50px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
.articles-list.slider .articles-card-wrapper.swiper-wrapper {
  align-items: stretch;
}
.articles-list.slider .articles-card-wrapper.swiper-wrapper .swiper-slide {
  height: auto;
}
.articles-list.slider .articles-card-wrapper.swiper-wrapper .swiper-slide .articles-card {
  height: 100%;
}
.articles-list.slider .articles-card-wrapper.swiper-wrapper .swiper-slide .articles-card__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.articles-list.slider .articles-list__inner {
  position: relative;
}
.articles-list.slider .heading.text-center .title,
.articles-list.slider .heading.text-center .subtitle {
  max-width: 100%;
}
.articles-list.slider .heading .title {
  max-width: calc(100% - 150px);
}
.articles-list.slider .heading.text-center ~ .slider-controls-container {
  display: block;
}
.articles-list.slider .heading.text-center ~ .slider-controls-container .slider-controls {
  position: static;
  justify-content: center;
}
.articles-list.slider .heading.text-center ~ .slider-controls-container .slider-controls button.slider-control.swiper-button-lock {
  display: none;
}
.articles-list.slider .heading.text-center ~ .slider-controls-container .slider-controls button.slider-control {
  margin-bottom: 60px;
}
.articles-list.slider .heading.text-right ~ .slider-controls-container .slider-controls {
  right: unset;
  left: 0;
}
.articles-list.slider .slider-controls {
  position: absolute;
  right: 0;
  top: 0;
}

@media (max-width: 400px) {
  .articles-list.slider .heading .title,
  .articles-list.slider .heading .subtitle {
    max-width: 100%;
  }
  .articles-list.slider .slider-controls-container {
    display: block;
  }
  .articles-list.slider .slider-controls-container .slider-controls {
    position: static;
    justify-content: center;
  }
  .articles-list.slider .slider-controls-container .slider-controls button.slider-control {
    margin-bottom: 60px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== HERO ARTICLES ====

    Description: 
        Hero articles slider type.

    Modificators:
        No modificators.
*/
.articles-list.hero {
  padding-top: 100px;
  padding-bottom: 100px;
}
.articles-list.hero .swiper-wrapper {
  align-items: stretch;
}
.articles-list.hero .swiper-slide {
  height: auto;
}
.articles-list.hero .heading .title h1,
.articles-list.hero .heading .title h2,
.articles-list.hero .heading .title h3,
.articles-list.hero .heading .title h4,
.articles-list.hero .heading .title h5,
.articles-list.hero .heading .title h6 {
  font-size: 2.8rem;
  line-height: 3.2rem;
  font-family: "primary-regular", Arial, Helvetica, sans-serif;
  color: #0B1B26;
}
.articles-list.hero .articles-card {
  height: 100%;
}
.articles-list.hero .articles-card .featured-image {
  height: 400px;
}
.articles-list.hero .articles-card .featured-image .featured-image__inner,
.articles-list.hero .articles-card .featured-image a {
  height: 100%;
}
.articles-list.hero .articles-card .featured-image a {
  display: block;
}
.articles-list.hero .articles-card .featured-image img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.articles-list.hero .content {
  padding-right: 200px;
}
.articles-list.hero .slider-controls-container {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 3;
}

@media (max-width: 767px) {
  .articles-list.hero .slider-controls-container {
    position: initial;
    margin-top: 25px;
  }
  .articles-list.hero .content {
    padding-right: 0;
  }
  .articles-list.hero .articles-card .featured-image {
    height: 300px;
  }
}
@media (max-width: 575px) {
  .articles-list.hero .articles-card .featured-image {
    height: 250px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== DEFAULT SECTION ====

    Description:
        Website default section.

    Modificators:
        No modificators.
*/
.default-section {
  padding-top: 100px;
  padding-bottom: 100px;
}
.default-section img {
  border-radius: 20px;
  margin-top: 24px;
  margin-bottom: 24px;
  display: block;
}
.default-section img:first-child {
  margin-top: 0;
}
.default-section img:last-child {
  margin-bottom: 0;
}
.default-section h2 {
  font-size: 4.4rem;
  line-height: 5.6rem;
}
.default-section .default-section__inner {
  display: flex;
  gap: 65px;
}
.default-section section .container,
.default-section section .container-fluid {
  padding: 0 !important;
  margin: 0 !important;
  max-width: unset !important;
}
.default-section .sidebar {
  margin-bottom: 65px;
}

@media (min-width: 1200px) {
  .default-section .sidebar {
    margin-bottom: 0;
  }
  .default-section .default-section__inner {
    display: flex;
    gap: 65px;
  }
}
@media (max-width: 1199px) {
  .default-section .default-section__inner {
    flex-direction: column-reverse;
    gap: 0;
  }
}
@media (max-width: 767px) {
  .default-section {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== ITEMS LIST ====

    Description:
        Items list.

    Modificators:
        No modificators.
*/
.items-list {
  padding-top: 100px;
  padding-bottom: 100px;
}
.items-list .heading .title h1,
.items-list .heading .title h2,
.items-list .heading .title h3,
.items-list .heading .title h4,
.items-list .heading .title h5,
.items-list .heading .title h6 {
  font-size: 5.6rem;
  line-height: 5.6rem;
}
.items-list .inner-grid,
.items-list .inner-grid.items-2,
.items-list .inner-grid.items-3,
.items-list .inner-grid.items-4 {
  gap: 0 !important;
  align-items: stretch;
}
.items-list .items-list__inner {
  border-width: 1px 0 0 1px;
}
.items-list .item {
  padding: 50px 30px;
  border: 1px solid #E7E5E4;
  text-align: center;
  align-items: center;
  margin: -1px 0 0 -1px;
  margin-bottom: 0 !important;
}
.items-list .item .item__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  text-align: center;
  color: #171717;
}
.items-list .item .item__inner .image {
  height: 70px;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.items-list .item .item__inner .image img {
  max-height: 100%;
}
.items-list .item .item__inner .content {
  margin-bottom: auto;
}

@media (max-width: 767px) {
  .items-list {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .items-list .heading .title h1,
  .items-list .heading .title h2,
  .items-list .heading .title h3,
  .items-list .heading .title h4,
  .items-list .heading .title h5,
  .items-list .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
  .items-list .items-list__inner .item .image {
    height: auto;
  }
}
.items-list.bg-black .item .item__inner,
.bg-black .items-list .item .item__inner {
  color: #FFFFFF;
}

.items-list.bg-dark-red .item .item__inner,
.bg-dark-red .items-list .item .item__inner {
  color: #FFFFFF;
}

/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== CONTACT SECTION ====

    Description:
        Contact with form section.

    Modificators:
        No modificators.
*/
.contact-with-form {
  padding-top: 100px;
  padding-bottom: 100px;
}
.contact-with-form .input-wrapper:not(:last-child) {
  margin-bottom: 30px;
}
.contact-with-form input,
.contact-with-form textarea {
  padding: 16px 24px;
}
.contact-with-form input:focus,
.contact-with-form textarea:focus {
  border: 1px solid #AA182C;
}
.contact-with-form label span {
  color: #AA182C;
}
.contact-with-form input::-moz-placeholder, .contact-with-form textarea::-moz-placeholder {
  font-size: 1.8rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  color: #A8A29E;
  opacity: 1;
}
.contact-with-form input::placeholder, .contact-with-form input:-moz-placeholder, .contact-with-form input::-moz-placeholder, .contact-with-form input::-webkit-input-placeholder,
.contact-with-form textarea::placeholder,
.contact-with-form textarea:-moz-placeholder,
.contact-with-form textarea::-moz-placeholder,
.contact-with-form textarea::-webkit-input-placeholder {
  font-size: 1.8rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  color: #A8A29E;
  opacity: 1;
}
.contact-with-form p {
  margin-bottom: 10px;
  margin-top: 10px;
}
.contact-with-form input,
.contact-with-form textarea {
  font-size: 1.8rem;
}
.contact-with-form .contact__inner {
  display: flex;
  gap: 50px;
}
.contact-with-form .contact-info {
  font-size: 2rem;
}
.contact-with-form .contact-form {
  width: 50%;
}
.contact-with-form .contact-form .alert {
  margin: 0 0 30px 0;
  width: 100%;
  max-width: 100%;
  position: relative;
  transform: none;
  left: unset;
}
.contact-with-form .contact-with-info {
  width: 50%;
}
.contact-with-form input {
  width: 100%;
  line-height: 2rem;
}
.contact-with-form .contact-form__cta button {
  width: 100%;
  font-family: "secondary-medium", Arial, Helvetica, sans-serif;
}
.contact-with-form .contact-info--addres {
  background: #F7F7F5;
  padding: 7px 20px 20px;
  border-radius: 12px;
}
.contact-with-form .contact-info--addres svg {
  margin-right: 6px;
  vertical-align: middle;
}
.contact-with-form .contact-info--working-hours,
.contact-with-form .contact-info--email,
.contact-with-form .contact-phone,
.contact-with-form .contact-link {
  padding: 20px;
}
.contact-with-form .input-group {
  padding-bottom: 30px;
}
.contact-with-form.bg-dark-red .contact-info--addres {
  color: #AA182C;
}
.contact-with-form.bg-black .contact-info--addres {
  color: #131313;
}
.contact-with-form.bg-light-gray .contact-info--addres {
  background-color: #FFFFFF;
}

@media (max-width: 767px) {
  .contact-with-form .contact-info--working-hours,
  .contact-with-form .contact-info--email,
  .contact-with-form .contact-phone,
  .contact-with-form .contact-link {
    padding-left: 0 !important;
  }
  .contact-with-form .contact__inner {
    flex-direction: column;
  }
  .contact-with-form .contact-with-info,
  .contact-with-form .contact-form {
    width: 100%;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== CONTACT MAP ====

    Description:
        Contact Map section.

    Modificators:
        No modificators.
*/
.contact-map {
  padding-top: 100px;
  padding-bottom: 100px;
}
.contact-map .heading:last-child {
  margin-bottom: 50px;
}
.contact-map .heading .title h1,
.contact-map .heading .title h2,
.contact-map .heading .title h3,
.contact-map .heading .title h4,
.contact-map .heading .title h5,
.contact-map .heading .title h6 {
  font-size: 4.4rem;
  line-height: 5.6rem;
}
.contact-map .map__inner {
  height: 556px;
  overflow: hidden;
}
.contact-map .map-wrapper {
  height: 100%;
}
.contact-map .map-wrapper .map {
  height: 100%;
}
.contact-map .map-wrapper .map .gm-style .gm-style-iw-c {
  flex-direction: row-reverse;
}
.contact-map .map-wrapper .map .info-window {
  margin-top: 8px;
}

@media (max-width: 991px) {
  .contact-map .map__inner {
    height: 300px;
  }
}
@media (max-width: 767px) {
  .contact-map {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .contact-map .heading .title h1,
  .contact-map .heading .title h2,
  .contact-map .heading .title h3,
  .contact-map .heading .title h4,
  .contact-map .heading .title h5,
  .contact-map .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
  .contact-map .map__inner {
    height: 300px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== ELEMENTS LIST ====

    Description:
        Elements list.

    Modificators:
        .element-card
*/
.elements-list {
  padding-top: 100px;
  padding-bottom: 100px;
}
.elements-list .container > .heading .title h1,
.elements-list .container > .heading .title h2,
.elements-list .container > .heading .title h3,
.elements-list .container > .heading .title h4,
.elements-list .container > .heading .title h5,
.elements-list .container > .heading .title h6 {
  font-size: 5.6rem;
  line-height: 6.4rem;
  margin-top: 0;
  margin-bottom: 0;
}
.elements-list .heading-and-content .heading {
  margin-bottom: 0;
}
.elements-list .heading-and-content .heading .title h1,
.elements-list .heading-and-content .heading .title h2,
.elements-list .heading-and-content .heading .title h3,
.elements-list .heading-and-content .heading .title h4,
.elements-list .heading-and-content .heading .title h5,
.elements-list .heading-and-content .heading .title h6 {
  font-size: 5.6rem;
  line-height: 6.4rem;
  margin-top: 0;
  margin-bottom: 0;
}
.elements-list .heading-and-content .heading .content {
  color: rgba(23, 23, 23, 0.6980392157);
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
}
.elements-list .elements-wrapper .elements-description {
  margin-bottom: 32px;
  color: rgba(23, 23, 23, 0.6980392157);
}
.elements-list .elements-wrapper .elements-description > * {
  margin-bottom: 24px;
}
.elements-list .elements-wrapper .elements-description > *:last-child {
  margin-bottom: 0;
}
.elements-list .elements-wrapper .elements-description .description-large {
  font-size: 2.8rem;
  line-height: 3.2rem;
}
.elements-list .elements-wrapper .elements-description .description-small {
  font-size: 1.6rem;
  line-height: 2.6rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
}
.elements-list .elements-wrapper .element {
  padding-bottom: 32px;
  border-bottom: 1px solid #E7E5E4;
}
.elements-list .elements-wrapper .element:not(:last-child) {
  margin-bottom: 32px;
}
.elements-list .elements-wrapper .element.no-icon .element__inner {
  padding-left: 0;
}
.elements-list .elements-wrapper .element .element__inner {
  position: relative;
  padding-left: 60px;
}
.elements-list .elements-wrapper .element .element__inner .icon {
  max-width: 48px;
  position: absolute;
  top: 0;
  left: 0;
}
.elements-list .elements-wrapper .element .title {
  margin-bottom: 16px;
  color: #171717;
}
.elements-list .elements-wrapper .element .title:last-child {
  margin-bottom: 0;
}
.elements-list .elements-wrapper .element .title h1,
.elements-list .elements-wrapper .element .title h2,
.elements-list .elements-wrapper .element .title h3,
.elements-list .elements-wrapper .element .title h4,
.elements-list .elements-wrapper .element .title h5,
.elements-list .elements-wrapper .element .title h6 {
  font-size: 2.8rem;
  line-height: 3.3rem;
  margin-top: 0;
  margin-bottom: 0;
  color: inherit;
}
.elements-list .elements-wrapper .element .title a {
  color: inherit;
}
.elements-list .elements-wrapper .element .content {
  color: rgba(23, 23, 23, 0.6980392157);
  line-height: 2.4rem;
  font-size: 1.4rem;
}
.elements-list.element-card .elements-list__inner .elements-wrapper {
  width: 100%;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .element:not(:last-child) {
  margin-bottom: 0;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner {
  display: flex;
  gap: 40px;
  flex-wrap: wrap;
  justify-content: center;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element {
  width: calc(33% - 24px);
  border: 1px solid #D6D3D1;
  border-radius: 20px;
  padding: 32px;
  background-color: #F7F7F5;
  min-height: 492px;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .element__inner {
  padding-left: 0;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .element__inner .icon {
  position: relative;
  padding-bottom: 25px;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content {
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  font-size: 2rem;
  line-height: 3.2rem;
  color: rgba(23, 23, 23, 0.6980392157);
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content ul,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content ol {
  padding-left: 0;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading {
  margin-bottom: 0;
}
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h1,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h2,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h3,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h4,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h5,
.elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element .content .heading .title h6 {
  font-family: "primary-bold", Arial, Helvetica, sans-serif;
  font-size: 2.8rem;
  line-height: 3.2rem;
  margin-top: 0;
  margin-bottom: 0;
}

.elements-list.bg-black .heading-and-content .heading .content,
.elements-list.bg-black .elements-wrapper .elements-description, .elements-list.bg-black:not(.element-card) .elements-wrapper .element .title,
.elements-list.bg-black .elements-wrapper .element .content {
  color: #FFFFFF;
}

.elements-list.bg-dark-red .heading-and-content .heading .content,
.elements-list.bg-dark-red .elements-wrapper .elements-description, .elements-list.bg-dark-red:not(.element-card) .elements-wrapper .element .title,
.elements-list.bg-dark-red .elements-wrapper .element .content {
  color: #FFFFFF;
}

@media (max-width: 1199px) {
  .elements-list .heading-and-content .heading .title h1,
  .elements-list .heading-and-content .heading .title h2,
  .elements-list .heading-and-content .heading .title h3,
  .elements-list .heading-and-content .heading .title h4,
  .elements-list .heading-and-content .heading .title h5,
  .elements-list .heading-and-content .heading .title h6 {
    font-size: 4.6rem;
    line-height: 5.6rem;
  }
}
@media (min-width: 992px) {
  .elements-list .elements-list__inner {
    display: flex;
    gap: 70px;
  }
  .elements-list .elements-list__inner .heading-and-content {
    margin-top: -8px;
  }
  .elements-list .elements-list__inner .heading-and-content,
  .elements-list .elements-list__inner .elements-wrapper {
    width: 50%;
  }
}
@media (max-width: 991px) {
  .elements-list .heading-and-content {
    margin-bottom: 50px;
  }
  .elements-list.element-card .elements-list__inner .elements-wrapper {
    width: 100%;
  }
  .elements-list.element-card .elements-list__inner .elements-wrapper .element:not(:last-child) {
    margin-bottom: 0px;
  }
  .elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner {
    display: flex;
    gap: 40px;
    flex-direction: column;
  }
  .elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element {
    width: 100%;
    min-height: auto;
  }
  .elements-list.element-card .elements-list__inner .elements-wrapper .elements-wrapper__inner .element:first-child .title {
    max-width: 100%;
  }
}
@media (max-width: 767px) {
  .elements-list {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .elements-list .container > .heading .title h1,
  .elements-list .container > .heading .title h2,
  .elements-list .container > .heading .title h3,
  .elements-list .container > .heading .title h4,
  .elements-list .container > .heading .title h5,
  .elements-list .container > .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
}
@media (max-width: 575px) {
  .elements-list .heading-and-content .heading .title h1,
  .elements-list .heading-and-content .heading .title h2,
  .elements-list .heading-and-content .heading .title h3,
  .elements-list .heading-and-content .heading .title h4,
  .elements-list .heading-and-content .heading .title h5,
  .elements-list .heading-and-content .heading .title h6 {
    font-size: 3.5rem;
    line-height: 4rem;
  }
  .elements-list .elements-wrapper .element .title h1,
  .elements-list .elements-wrapper .element .title h2,
  .elements-list .elements-wrapper .element .title h3,
  .elements-list .elements-wrapper .element .title h4,
  .elements-list .elements-wrapper .element .title h5,
  .elements-list .elements-wrapper .element .title h6 {
    font-size: 2rem;
    line-height: 2.4rem;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== DASHBOARD LIST ====

    Description:
        Dashboard list.

    Modificators:
        No modificators.
*/
.dashboard .dashboard__inner {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.dashboard .dashboard__inner .card {
  background-color: #F5F5F4;
  padding: 6px 9px 4px 9px;
  flex: 1;
  min-width: 200px;
  text-align: left;
}
.dashboard .dashboard__inner .card .font-12 {
  font-size: 12px;
  margin-left: 3px;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
  color: rgba(23, 23, 23, 0.7);
}
.dashboard .dashboard__inner .filters {
  display: flex;
  gap: 10px;
  width: 100%;
  padding-top: 30px;
}
.dashboard .dashboard__inner .filters .input-wrapper {
  width: 33%;
}
.dashboard .dashboard__inner .stats {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 10px;
  justify-content: center;
}
.dashboard .dashboard__inner .stat {
  background-color: #F5F5F4;
  padding: 10px 12px 10px 12px;
  text-align: left;
  width: calc(25% - 10px);
}
.dashboard .dashboard__inner .stat .stat__inner {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.dashboard .dashboard__inner .stat .stat__inner .strong {
  font-size: 2.8rem;
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
}
.dashboard .dashboard__inner .stat .stat-title {
  margin-bottom: 20px;
  position: relative;
  padding-right: 25px;
}
.dashboard .dashboard__inner .stat .stat-title .tooltip {
  position: absolute;
  right: 0;
  top: 0;
}
.dashboard .dashboard__inner .stat .stat-title .tooltip.tooltip-to-right .tooltip-content {
  transform: none;
}
.dashboard .dashboard__inner .stat .stat__number {
  font-size: 2.8rem;
  margin-bottom: 10px;
}
.dashboard .dashboard__inner .stat .cta {
  display: flex;
  align-items: center;
  gap: 20px 5px;
  flex-wrap: wrap;
  margin-top: auto;
}
.dashboard .dashboard__inner .stat .cta .button {
  display: block;
  margin-top: 34px;
  padding: 7px 16px;
  font-size: 1.3rem;
  line-height: 1.6rem;
  letter-spacing: 0.5px;
  font-family: "primary-semi-bold", Arial, Helvetica, sans-serif;
}
.dashboard .dashboard__inner .stat .stat__number + .cta a {
  margin-top: 0 !important;
}
.dashboard .dashboard__inner .input-wrapper:not(:last-child) {
  margin-bottom: 4px;
}
.dashboard .dashboard__inner .stat:last-child {
  margin-right: 0;
}
.dashboard .dashboard__inner .positive {
  color: rgb(16, 185, 129);
}
.dashboard .dashboard__inner .negative {
  color: rgb(220, 38, 38);
}

@media (max-width: 1200px) {
  .dashboard .dashboard__inner .stats .stat {
    width: calc(33% - 4px);
  }
}
@media (max-width: 991px) {
  .dashboard .dashboard__inner .stats .stat {
    width: calc(50% - 5px);
  }
}
@media (max-width: 767px) {
  .dashboard .dashboard__inner .filters {
    flex-direction: column;
    padding-bottom: 30px;
  }
  .dashboard .dashboard__inner .filters .input-wrapper {
    width: 100%;
  }
}
@media (max-width: 576px) {
  .dashboard .dashboard__inner .stats .stat {
    width: 100%;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== ERROR ====

    Description:
        Error section.

    Modificators:
        No modificators.
*/
.error {
  padding-top: 70px;
  padding-bottom: 70px;
}
.error .heading {
  margin-bottom: 30px;
}
.error .heading .title h1,
.error .heading .title h2,
.error .heading .title h3,
.error .heading .title h4,
.error .heading .title h5,
.error .heading .title h6 {
  font-size: 5.6rem;
  line-height: 6.4rem;
}
.error .image {
  font-size: 0;
  line-height: 0;
  margin-bottom: 35px;
}

@media (max-width: 991px) {
  .error {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .error .heading .title h1,
  .error .heading .title h2,
  .error .heading .title h3,
  .error .heading .title h4,
  .error .heading .title h5,
  .error .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== TEXT & IMAGE ====

    Description:
        Text & image section.

    Modificators:

        1. Text and image reverse

        Description:             Revert position of image and text(image to right, text to left)
        Hook element selector:   text-and-image
        Class to add:            .image-on-right
*/
.text-and-image {
  padding-top: 100px;
  padding-bottom: 100px;
}
.text-and-image .heading .title h1,
.text-and-image .heading .title h2,
.text-and-image .heading .title h3,
.text-and-image .heading .title h4,
.text-and-image .heading .title h5,
.text-and-image .heading .title h6 {
  font-size: 4.4rem;
  line-height: 5.6rem;
}
.text-and-image .text-and-image__inner {
  display: flex;
  gap: 50px;
  align-items: center;
}
.text-and-image .text-and-image__inner .text {
  width: 50%;
  flex: 1;
}
.text-and-image .text-and-image__inner .text .content {
  font-family: "primary-medium", Arial, Helvetica, sans-serif;
  color: rgba(23, 23, 23, 0.6980392157);
  line-height: 2.6rem;
}
.text-and-image .text-and-image__inner .text .icon {
  margin-bottom: 25px;
}
.text-and-image .text-and-image__inner .text .title {
  text-align: left;
}
.text-and-image .text-and-image__inner .text .title h1,
.text-and-image .text-and-image__inner .text .title h2,
.text-and-image .text-and-image__inner .text .title h3,
.text-and-image .text-and-image__inner .text .title h4,
.text-and-image .text-and-image__inner .text .title h5,
.text-and-image .text-and-image__inner .text .title h6 {
  font-size: 2.8rem;
  line-height: 3.2rem;
}
.text-and-image .text-and-image__inner .text .cta-wrapper {
  margin-top: 24px;
}
.text-and-image .text-and-image__inner .text .cta-wrapper > a, .text-and-image .text-and-image__inner .text .cta-wrapper > button, .text-and-image .text-and-image__inner .text .cta-wrapper > .button {
  font-family: "secondary-semi-bold", Arial, Helvetica, sans-serif;
}
.text-and-image .text-and-image__inner .image {
  width: 50%;
  font-size: 0;
  line-height: 0;
}
.text-and-image .text-and-image__inner .image img {
  border-radius: 16px;
}
.text-and-image .text-and-image__inner .heading {
  margin-bottom: 25px;
}
.text-and-image .cta-wrapper {
  margin-top: 100px;
}
.text-and-image.image-on-right .text-and-image__inner {
  flex-direction: row-reverse;
}
.text-and-image.image-on-right .image {
  text-align: right;
}

.text-and-image.bg-black .text-and-image__inner .text .content {
  color: #FFFFFF;
}

.text-and-image.bg-dark-red .text-and-image__inner .text .content {
  color: #FFFFFF;
}

@media (max-width: 767px) {
  .text-and-image {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .text-and-image .heading .title h1,
  .text-and-image .heading .title h2,
  .text-and-image .heading .title h3,
  .text-and-image .heading .title h4,
  .text-and-image .heading .title h5,
  .text-and-image .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
  .text-and-image .text-and-image__inner {
    display: block;
  }
  .text-and-image .text-and-image__inner .image,
  .text-and-image .text-and-image__inner .text {
    width: 100%;
    width: 100%;
  }
  .text-and-image .text-and-image__inner .image {
    margin-bottom: 50px;
  }
  .text-and-image .cta-wrapper {
    margin-top: 50px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== TEXT BLOCK ====

    Description:
        Text block section.

    Modificators:
        1. No content
*/
.text-block {
  padding-top: 100px;
  padding-bottom: 100px;
}
.text-block .heading .title h1,
.text-block .heading .title h2,
.text-block .heading .title h3,
.text-block .heading .title h4,
.text-block .heading .title h5,
.text-block .heading .title h6 {
  font-size: 5.6rem;
  line-height: 6.4rem;
}
.text-block.no-content .heading .title h1,
.text-block.no-content .heading .title h2,
.text-block.no-content .heading .title h3,
.text-block.no-content .heading .title h4,
.text-block.no-content .heading .title h5,
.text-block.no-content .heading .title h6 {
  font-size: 4.5rem;
  line-height: 5rem;
}
.text-block .cta-wrapper {
  margin-top: 100px;
}
.text-block h1,
.text-block h2,
.text-block h3,
.text-block h4,
.text-block h5,
.text-block h6 {
  line-height: initial;
}

@media (max-width: 991px) {
  .text-block {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  .text-block .heading .title h1,
  .text-block .heading .title h2,
  .text-block .heading .title h3,
  .text-block .heading .title h4,
  .text-block .heading .title h5,
  .text-block .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
  .text-block.no-content .heading .title h1,
  .text-block.no-content .heading .title h2,
  .text-block.no-content .heading .title h3,
  .text-block.no-content .heading .title h4,
  .text-block.no-content .heading .title h5,
  .text-block.no-content .heading .title h6 {
    font-size: 4rem;
    line-height: 4.4rem;
  }
  .text-block .cta-wrapper {
    margin-top: 50px;
  }
}
/*
    File Name: _variables.scss

    Description:
    This is the variables SCSS file that imports all variables that are used all over project.

    Note:
    This file should not contain any actual CSS styles. Its purpose is to
    bring together all the variables that are used accros project.
    Any direct styles added to this file may be overridden by the imported files.

*/
/*
    ==== COLORS.VARIABLES ====

    Description:
        All variables related to colors.

    Modificators:
        No modificators.
*/
/*
    ==== FONT.VARIABLES ====

    Description:
        All variables related to fonts.

    Modificators:
        No modificators.
*/
/*
    ==== SEARCH AND SELECT ====

    Description:
        Search and select section.

    Modificators:
        No modificators.
*/
.search-and-select {
  padding-top: 50px;
  padding-bottom: 50px;
  z-index: 2;
}
.search-and-select .search-and-select__inner {
  display: flex;
  align-items: flex-end;
  gap: 30px 50px;
  flex-wrap: wrap;
}
.search-and-select .search-wrapper {
  width: 100%;
}
.search-and-select .search-wrapper .search-input input {
  border-color: #D6D3D1;
}
.search-and-select .search-wrapper .search__inner .title {
  margin-bottom: 20px;
}
.search-and-select .search-wrapper .search__inner .title h1,
.search-and-select .search-wrapper .search__inner .title h2,
.search-and-select .search-wrapper .search__inner .title h3,
.search-and-select .search-wrapper .search__inner .title h4,
.search-and-select .search-wrapper .search__inner .title h5,
.search-and-select .search-wrapper .search__inner .title h6 {
  font-size: 2.8rem;
  line-height: 3.2rem;
}
.search-and-select .search-wrapper .just-validate-error-label {
  position: absolute;
  bottom: -23px;
}
.search-and-select .select-wrappper {
  width: 100%;
}
.search-and-select .select-wrappper .choices .choices__inner {
  min-height: 56px;
  font-size: 1.8rem;
}
.search-and-select .select-wrappper .choices .choices__item {
  font-size: 1.8rem;
}
.search-and-select .select-wrappper .choices .choices__list--dropdown .choices__item {
  min-height: 56px;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .search-and-select .search-wrapper {
    width: calc(66% - 25px);
  }
  .search-and-select .select-wrappper {
    width: calc(34% - 25px);
  }
}