/*
 * Colors: Base
\* -------------------------------------------------------------------------- */
/*
 * Colors: System color
\* -------------------------------------------------------------------------- */
/*
 * Colors: Overrides
\* -------------------------------------------------------------------------- */
/*
 * Colors: ADN-club
\* -------------------------------------------------------------------------- */
/** System monospace */
/**
 * Returns a rem value from a number of pixels.
 * Its uses 16px as root font-size
 */
/* -- Not on redesign -- */
/* 1025 is used instead of 1024 because touch devices design is not specified */
/* Scrollbars customization */
/**
 * Returns an url encoded SVG with the given color
 * @param {String} $icon - SVG code
 * @param {String} $color - Final color
 * @return {String} URL encoded svg
 */
/* stylelint-disable function-parentheses-newline-inside */
/* stylelint-enable function-parentheses-newline-inside */
/*
 * https://allyjs.io/tutorials/hiding-elements.html#2017-edition-of-visuallyhidden
 */
/* Mixin to use if touch devices design is specified */
/** Vertical scrollbar with custom color & size
*     @include ad-scrollbars(color, size);
*/
/** Horizontal scrollbar with custom color & size
*     @include ad-scrollbars();
*     @include ad-scrollbars-horizontal(color, size);
*/
.pd-button-container {
  text-align: center;
}

.pd-button {
  display: inline-block;
  width: auto;
  min-width: 190px;
}
.pd-button.text-size-medium {
  font-size: 0.625rem;
}
@media (min-width: 768px) {
  .pd-button.text-size-medium {
    font-size: 0.75rem;
  }
}
.pd-button.text-size-big {
  font-size: 0.75rem;
}
@media (min-width: 768px) {
  .pd-button.text-size-big {
    font-size: 1rem;
  }
}

.container-modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1200;
  display: none;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: transparent;
}
.container-modal .modal-content {
  position: relative;
  top: 35%;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 30%;
  min-width: 500px;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 10%;
  padding: 2rem !important;
  color: rgb(255, 255, 255);
  background: rgb(0, 0, 0);
}
@media (max-width: 479px) {
  .container-modal .modal-content {
    min-width: 90%;
  }
}
.container-modal .close {
  position: relative;
  top: -25%;
  left: 50%;
  cursor: pointer;
}
.container-modal .close .svg-icon.close-icon {
  width: 1.375rem;
  height: 1.375rem;
  filter: invert(1);
}
.container-modal a {
  width: 39%;
  margin-top: 1rem;
}
@media (max-width: 479px) {
  .container-modal a {
    min-width: 90%;
  }
}

/* stylelint-disable selector-max-id */
#next-events-btn {
  margin-top: 3rem;
}

.title.dropdown-button {
  width: 16rem;
  color: rgb(255, 255, 255);
  font-weight: 200;
  text-decoration: underline;
  -webkit-text-decoration: underline solid currentColor;
          text-decoration: underline solid currentColor;
  text-decoration-thickness: 1px;
  -webkit-text-decoration: underline 1px solid;
          text-decoration: underline 1px solid;
  background-color: rgb(0, 0, 0);
}
@media (max-width: 1024px) {
  .title.dropdown-button {
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media (max-width: 479px) {
  .title.dropdown-button {
    font-size: 0.7rem;
  }
}
.title.dropdown-button::after {
  filter: invert(1);
}

.dropdown-images-container {
  display: flex;
  justify-content: center;
  margin-left: -40rem;
}
@media (max-width: 1359px) {
  .dropdown-images-container {
    margin-left: -33rem;
  }
}
@media (max-width: 1279px) {
  .dropdown-images-container {
    margin-left: 0;
  }
}
@media (max-width: 767px) {
  .dropdown-images-container {
    flex-direction: column;
    align-items: center;
    margin-top: 2rem !important;
  }
}
.dropdown-images-container .text-container-dropdown {
  margin-top: 2rem;
}
.dropdown-images-container .pd-image__image {
  width: 320px;
  height: auto;
}
.dropdown-images-container .text-block {
  margin-bottom: 2rem;
}
.dropdown-images-container .text-block .step-title {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.dropdown-images-container .text-block .step-title h1 {
  margin: 0;
  font-weight: 300;
  font-size: 3.8rem;
}
.dropdown-images-container .text-block .step-title h2 {
  margin: 0;
  font-weight: 300;
  font-size: 1.2rem;
}
.dropdown-images-container .text-block p {
  margin: 0;
  font-weight: 300;
}

/*# sourceMappingURL=button.css.map*/