:root {
  --min-width-mobile: 360px;
  --max-width-mobile: 411px;
  --min-width-tablet: 512px;
  --max-width-tablet: 769px;
  --min-width-laptop: 1240px;
  --max-width-laptop: 1920px;
  --padding-size: 1rem;
  --padding-size-max: 2rem;
  --padding-size-med: 1.4rem;
  --padding-size-min: 1rem;
  --color-separator-primary: #716E6E;
  --color-separator-light: #d5d5d5;
  --color-separator-secondary: #A6BF2C;
  --color-background-primary: #6F1175;
  --color-background-secondary: #E9DBEA;
  --color-background-form-element-info: #EEE2E2;
  --color-background-form-element-primary: #EEE2EE;
  --color-background-form-element-secondary: #E2EEE2;
  --color-background-form-button: #A6BF2C;
  --color-text-primary: #6F1175;
  --color-text-secondary: #3d3d3d;
  --color-text-button: #fff;
  --color-text-content: #555555;
  --color-border: #bcbcbc;
  --icon-font-family: "Font Awesome 5 Brands", "Font Awesome 5 Free";
  --color-drawer-items-background: #F2F2F2;
  --color-detail-title: #3d3d3d;
  --color-cta-background-primary: #6F1175;
  --color-cta-background-secondary: #A6BF2C;
  --color-cta-text: #fff;
  --color-error: #c00;
  --color-danger: #c00;
  --color-backgroud-message-notice: #E2EEE2;
  --color-backgroud-message-error: #EEE2E2;
  --color-backgroud-alternative: #E2E2E2;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--color-text-primary);
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--color-text-primary);
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--color-text-primary);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--color-text-primary);
  -webkit-box-shadow: 0 0 0 1000px var(--color-background-form-element-primary) inset;
  background: var(--color-background-form-element-primary);
}

body {
  font-family: Inter, serif;
  font-size: 1rem;
  font-style: normal;
  color: var(--color-text-secondary);
  line-height: 1.375rem;
}

a, button {
  line-height: 1rem;
}

.a__toggle-display:after {
  position: absolute;
  top: 3.7rem;
  right: 1rem;
  font-family: var(--icon-font-family);
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  content: "\f070";
  padding-left: .4rem;
  cursor: pointer;
}

.a__toggle-hide:after {
  position: absolute;
  top: 3.7rem;
  right: 1rem;
  font-family: var(--icon-font-family);
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  content: "\f06e";
  padding-left: .4rem;
  cursor: pointer;
}

h1 {
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.25rem;
  color: var(--color-detail-title);
  margin-bottom: var(--padding-size-max);
}

h1 > small {
  font-weight: initial;
  font-size: .9rem;
}

h1:after {
  border-top: solid 1px var(--color-separator-secondary);
  content: " ";
  display: flex;
  max-width: 16.875rem;
  margin-top: 1.8375rem;
}

a {
  font-family: Inter, serif;
  color: var(--color-text-primary);
}

p {
  margin-bottom: var(--padding-size-min);
}

strong {
  font-weight: 900;
}

.page__icon::before, .page__icon::after {
  font-family: var(--icon-font-family);
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
}

.page__icon-marker::before {
  content: "\f3c5";
  padding-right: .4rem;
}

.page__icon-calendar::before {
  content: "\f073";
  padding-right: .4rem;
}

.page__icon-list::before {
  content: "\f03a";
  padding-right: .4rem;
}

.page__icon-chevron-down::after {
  content: "\f078";
  padding-left: .4rem;
}

.page__icon-left-arrow::before {
  content: "\f30a";
  padding-right: .4rem;
}

.page__icon-warning::before {
  content: "\f071";
  padding-right: .4rem;
}

.page__icon-chevron-right::after {
  position: absolute;
  right: .8rem;
  content: "\f054";
}

.page__icon-times::after {
  position: absolute;
  right: .8rem;
  content: "\f00d";
}

.page__icon-eye::after {
  position: absolute;
  right: .8rem;
  content: "\f070";
}

.page__background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9991;
  background: #222;
  opacity: .4;
}

.page-separator {
  display: flex;
  margin-bottom: var(--padding-size);
  width: 10.1875rem;
  height: 0.0625rem;
  background: var(--color-separator-secondary);
}

.resize-transition-stopper {
  transition: none !important;
}

.page__list-dons, .page__list-places, .page__message {
  margin-top: var(--padding-size-max);
  margin-bottom: var(--padding-size);
  padding: var(--padding-size-min);
  border-radius: 1rem;
  background: var(--color-background-form-element-primary);
  color: var(--color-text-primary);
}

.page__list-dons, .page__message {
  max-width: calc(45rem - 2 * var(--padding-size-min));
}

.page__list-dons ul, .page__list-places ul {
  display: flex;
  flex-flow: column wrap;
}

.page__list-dons ul li, .page__list-places ul li {
  padding-top: .5rem;
  padding-bottom: .5rem;
}

.page__list-dons ul {
  height: 20rem;
  flex-grow: 1;
  overflow-x: auto;
}

.page__list-dons ul li {
  width: 76vw;
}

.page__list-places ul {
  height: 50rem;
  flex-grow: 1;
  overflow-x: auto;
}

.page__list-places ul li {
  width: 76vw;
}

.page__flash-messages-wrapper {
  max-width: 45rem;
}

.page__flash-message {
  margin-top: var(--padding-size-min);
  margin-bottom: var(--padding-size-min);
  padding: var(--padding-size-min);
  border-radius: .5rem;
}

.page__flash-message-notice {
  background-color: var(--color-backgroud-message-notice);
  color: var(--color-text-primary);
}

.page__flash-message-error {
  background-color: var(--color-backgroud-message-error);
  color: var(--color-text-primary);
}

.mob-only {
  display: inherit;
}

.td-ism {
  display: none;
}

@media screen and (min-width: 960px) {
  .mob-only {
    display: none;
  }
}

@media screen and (min-width: 769px) {
  :root {
    --padding-size: 2rem;
  }

  .page__list-dons, .page__message {
    max-width: inherit;
  }

  .page__list-dons ul {
    overflow-x: inherit;
  }

  .page__list-dons ul li {
    width: inherit;
  }

  .page__list-places ul {
    overflow-x: inherit;
  }

  .page__list-places ul li {
    width: inherit;
  }

  .td-ism {
    display: initial;
  }
}