/* start of code */
/*
/*
*  @discuss standard button Element for Interactions that are not links
*  @see components/products/availbility.scss
*/
button {
  border: none;
  background: transparent;
  padding: 0;
  outline: none;
}

a:disabled, a[disabled=""], a[disabled=disabled], a.btn--disabled.btn--disabled, button:disabled, button[disabled=""], button[disabled=disabled], button.btn--disabled.btn--disabled, button.btn:disabled, button.btn[disabled=""], button.btn[disabled=disabled], button.btn.btn--disabled.btn--disabled {
  color: #5E6977;
  background: #BFC8CE;
  cursor: default;
  border: none;
  opacity: 1;
}
a:disabled:before, a[disabled=""]:before, a[disabled=disabled]:before, a.btn--disabled.btn--disabled:before, button:disabled:before, button[disabled=""]:before, button[disabled=disabled]:before, button.btn--disabled.btn--disabled:before, button.btn:disabled:before, button.btn[disabled=""]:before, button.btn[disabled=disabled]:before, button.btn.btn--disabled.btn--disabled:before {
  color: currentColor;
}
a:disabled:focus, a:disabled:hover, a[disabled=""]:focus, a[disabled=""]:hover, a[disabled=disabled]:focus, a[disabled=disabled]:hover, a.btn--disabled.btn--disabled:focus, a.btn--disabled.btn--disabled:hover, button:disabled:focus, button:disabled:hover, button[disabled=""]:focus, button[disabled=""]:hover, button[disabled=disabled]:focus, button[disabled=disabled]:hover, button.btn--disabled.btn--disabled:focus, button.btn--disabled.btn--disabled:hover, button.btn:disabled:focus, button.btn:disabled:hover, button.btn[disabled=""]:focus, button.btn[disabled=""]:hover, button.btn[disabled=disabled]:focus, button.btn[disabled=disabled]:hover, button.btn.btn--disabled.btn--disabled:focus, button.btn.btn--disabled.btn--disabled:hover {
  color: currentColor;
  background: #BFC8CE;
}
a.txtbtn, button.txtbtn, button.btn.txtbtn {
  padding: 0;
  cursor: pointer;
  font-weight: 400;
  background-color: transparent;
  border-color: transparent;
  color: #203367;
  font-size: 0.875rem;
  line-height: 1.285em;
}
a.txtbtn:hover:hover:hover, button.txtbtn:hover:hover:hover, button.btn.txtbtn:hover:hover:hover {
  color: #50E3C2;
}
a.txtbtn.small, button.txtbtn.small, button.btn.txtbtn.small {
  font-weight: 400;
  text-decoration: underline;
  font-size: 0.875rem;
  line-height: 1.714em;
}
a.txtbtn::before, button.txtbtn::before, button.btn.txtbtn::before {
  display: block;
  float: left;
  margin: 1px 0.625rem 0 0;
  font-size: 1rem;
}
a.txtbtn:active, a.txtbtn:focus, a.txtbtn:hover, button.txtbtn:active, button.txtbtn:focus, button.txtbtn:hover, button.btn.txtbtn:active, button.btn.txtbtn:focus, button.btn.txtbtn:hover {
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
  color: #233048;
}
a.txtbtn:disabled, button.txtbtn:disabled, button.btn.txtbtn:disabled {
  color: #5E6977;
  pointer-events: none;
}

[class^=col-] > button {
  width: 100%;
}

.btn {
  box-sizing: border-box;
  font-size: 1rem;
  line-height: 1.25em;
  hyphens: none;
  word-break: keep-all;
  line-height: 1;
  transition: all 0.2s ease 0s;
  outline: none !important;
  text-decoration: none;
  vertical-align: baseline;
  border-width: 0;
}
.btn:not(:last-child) {
  margin-right: 0.25rem;
}
.btn.btn.btn {
  background-image: none;
}
.btn:focus, .btn:hover {
  box-shadow: none;
}
.btn::before, .btn::after {
  font-size: 1em;
  display: inline-block;
  text-shadow: -0.1px -0.1px 0 currentColor, 0.1px -0.1px 0 currentColor, -0.1px 0.1px 0 currentColor, 0.1px 0.1px 0 currentColor;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .btn::before, .btn::after {
    font-size: 1rem;
  }
}
.btn.ss-icon-only {
  position: relative;
}
@media (max-width: 419.98px) {
  .btn.ss-icon-only {
    text-indent: -99em;
    min-width: 0;
    width: auto !important;
  }
  .btn.ss-icon-only::before, .btn.ss-icon-only::after {
    text-indent: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    flex: 0 0 0;
  }
}
.btn--slim {
  min-width: 0 !important;
  min-height: 0;
  padding-left: 1em !important;
  padding-right: 1em !important;
}
.btn--general {
  border-radius: 3px;
  min-width: 8em;
  padding: 0.625em 1.75rem 0.75em;
  /*box-shadow: 0 1px 1px rgba(43, 149, 237, 0.1) inset;*/
  font-weight: 500;
  background-color: #203367;
  border-color: #203367;
  color: #FFFFFF;
  width: 100%;
  min-height: 2.5em;
}
@media (min-width: 430px) {
  .btn--general {
    width: auto;
  }
}
.btn--general.btn--with-icon {
  padding: 0.25em 1.75rem 0.75em;
}
.btn--general.btn--with-icon.carreer-btn {
  padding: 0.625em 1.75rem 0.75em;
}
.btn--general.btn--with-icon.carreer-btn.slow {
  animation: pulsating 5s infinite;
}
.btn--general.btn--with-icon.carreer-btn.medium {
  animation: pulsating 3s infinite;
}
.btn--general.btn--with-icon.carreer-btn.fast {
  animation: pulsating 1s infinite;
}
@keyframes pulsating {
  0% {
    scale: 100%;
  }
  50% {
    scale: 110%;
  }
  100% {
    scale: 100%;
  }
}
.btn--general.btn--with-icon.carreer-btn:before {
  transform: scale(1.7);
}
.btn--general:focus:focus, .btn--general:hover:hover {
  background-color: #50E3C2;
  border-color: #50E3C2;
  color: #203367;
}
.btn--warning.btn--warning {
  background-color: #FD5959;
  border-color: #FD5959;
  color: #FFFFFF;
}
.btn--warning.btn--warning:hover {
  background-color: rgb(252.3928571429, 38.6071428571, 38.6071428571);
  color: #FFFFFF;
}
.btn--ghost.btn--ghost {
  border-radius: 3px;
  min-width: 8em;
  font-weight: 500;
  padding: 0.5em 1.625em 0.625em;
  vertical-align: baseline;
  color: #203367;
  background-color: transparent;
  border-color: #203367;
  border-width: 2px;
}
.btn--ghost.btn--ghost:focus, .btn--ghost.btn--ghost:hover {
  background-color: #203367;
  border-color: #203367;
  color: #FFFFFF;
}
.btn--hero.btn--hero {
  background-color: #50E3C2;
  border-color: #50E3C2;
  color: #203367;
  /* @discuss
  text-transform: uppercase;
  */
}
.btn--hero.btn--hero:focus, .btn--hero.btn--hero:hover {
  background-color: rgb(123.9655172414, 234.0344827586, 209.3251231527);
  border-color: #50E3C2;
  color: #203367;
}
.btn--hero.btn--hero.btn--ghost {
  border-color: #50E3C2;
  background-color: transparent;
  color: #233048;
  text-transform: none;
}
.btn--hero.btn--hero.btn--ghost:focus, .btn--hero.btn--hero.btn--ghost:hover {
  background-color: rgb(123.9655172414, 234.0344827586, 209.3251231527);
  border-color: #50E3C2;
  color: #203367;
}
.btn--hero.btn--hero.btn--ghost--dark {
  color: #FFFFFF;
}
.btn--gray.btn--gray {
  background-color: #ECEFF1;
  border-color: #ECEFF1;
  color: #203367;
  text-transform: uppercase;
}
.btn--gray.btn--gray:focus, .btn--gray.btn--gray:hover {
  background-color: rgb(123.9655172414, 234.0344827586, 209.3251231527);
  border-color: #50E3C2;
  color: #203367;
}
.btn.tiny {
  font-size: 0.75rem;
}
.btn.small, .btn--s {
  font-size: 0.875rem;
}
.btn.medium::before, .btn--m::before {
  text-shadow: none;
}
.btn.big, .btn--l {
  font-size: 1.25rem;
}
.btn.big::before, .btn--l::before {
  text-shadow: none;
}
.btn::before, .btn::after {
  color: currentColor;
}
.btn--with-icon {
  position: relative;
}
.btn--with-icon::before {
  padding-right: 0.33em;
}
.btn--with-icon::after {
  padding-left: 0.33em;
}
.btn--with-icon.btn--hero::before, .btn--with-icon.btn--hero::after {
  color: #203367;
}
.btn--with-icon.extend {
  border: none;
  color: #233048;
  transition: all 0.2s ease-out;
  box-shadow: none;
  text-decoration: underline;
}
.btn--with-icon.extend:hover, .btn--with-icon.extend:focus {
  background-color: inherit;
  color: inherit;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .btn--with-icon.extend:hover, .btn--with-icon.extend:focus {
    background-color: transparent;
  }
}
.btn--with-icon.extend::after {
  height: 0.437rem;
  width: 0.437rem;
  margin-top: 0;
  overflow: hidden;
  border: 0.125rem solid #233048;
  border-width: 0.125rem 0.125rem 0 0;
  transform: translateY(0.375rem) rotate(135deg);
  transition: all 0.2s ease-out;
}
.btn--with-icon.extend.active:after {
  margin-top: 0;
  transform: translateY(0.625rem) rotate(-45deg);
}
.btn-separate-icon {
  position: relative;
  border-radius: 0;
  padding: 0.937rem 4.437rem 0.937rem 1rem;
  margin: 0;
}
.btn-separate-icon--icon {
  position: absolute;
  display: block;
  height: 100%;
  width: 3.437rem;
  right: 0;
  top: 0;
  border-left: 0.125rem solid #FFFFFF;
  font-size: 0.875rem;
  padding: 0.625rem 0;
  color: inherit;
}
.btn-separate-icon--icon.icon-arrow-right:before {
  color: #FFFFFF;
}
.btn-separate-icon--icon--down:before {
  display: block;
  transform: rotate(90deg);
}

.share-button.social-media-icons__item:not(.non-standard) {
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
  background: #203367;
  color: #203367;
  display: flex;
  flex-direction: column;
  height: 32px;
  justify-content: center;
  padding: 0 1rem;
  position: relative;
  transition: all 0.4s ease-out;
}
.share-button.social-media-icons__item:not(.non-standard) span {
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 500;
  padding-bottom: 2px;
}
.share-button.social-media-icons__item:not(.non-standard):hover, .share-button.social-media-icons__item:not(.non-standard):focus {
  background: #0077B5;
  color: #0077B5;
}
.share-button.social-media-icons__item:not(.non-standard):hover span, .share-button.social-media-icons__item:not(.non-standard):focus span {
  color: #FFFFFF;
}
.share-button.social-media-icons__item:not(.non-standard):hover:before, .share-button.social-media-icons__item:not(.non-standard):focus:before {
  color: #0077B5;
}
.share-button.social-media-icons__item:not(.non-standard):before {
  color: inherit;
  line-height: 1;
  left: -34px;
  position: absolute;
}

.topscroll__button {
  background-color: #f7f7f8;
  min-width: 64px;
  min-height: 64px;
  padding: 1rem;
  position: fixed;
  bottom: 0;
  left: 0;
  display: block;
  z-index: 100;
}
.topscroll__button.icon-chevron-up:before {
  display: flex;
}

@media screen and (max-width: 768px) {
  .topscroll__button {
    display: none;
  }
}
/* pure css close button */
.close-x-small {
  width: 1.5em;
  height: 1.5em;
  border-radius: 50%;
  position: relative;
  background-color: #BFC8CE;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.close-x-small.close-x-small.close-x-small {
  max-width: none;
  background-image: unset;
}
.close-x-small:hover {
  background-color: #50E3C2;
  transform: rotate(180deg);
}
.close-x-small::before, .close-x-small::after {
  content: "";
  display: block;
  height: 100%;
  width: 1px;
  height: calc(100% - 0.4em);
  position: absolute;
  background-color: #FFFFFF;
  top: 0.2em;
  left: calc((100% - 1px) / 2);
  transform: rotate(45deg);
}
.close-x-small::after {
  transform: rotate(-45deg);
}

.close-x {
  position: absolute;
  right: 0.937rem;
  top: 50%;
  opacity: 0.6;
  width: 1.25rem;
  height: 1.25rem;
  transition: all 0.2s ease-out;
  cursor: pointer;
  z-index: 2;
  display: flex;
}
.close-x .circle-bg {
  width: 100%;
  height: 100%;
  display: block;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  background-color: #5E6977;
  border-radius: 50%;
  z-index: -1;
  transform: scale(0);
  pointer-events: none;
}
.close-x::after, .close-x::before {
  background-color: #233048;
  content: "";
  display: block;
  height: 1.125rem;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  z-index: 1;
}
.close-x::before {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.close-x::after {
  transform: translate(-50%, -50%) rotate(-135deg);
}
.close-x:hover {
  opacity: 1;
}
.close-x:hover .circle-bg {
  transform: scale(1.8);
}
.close-x:hover.inverse::after, .close-x:hover.inverse::before {
  background-color: #5E6977;
}
.close-x:hover.inverse .circle-bg {
  transform: scale(0);
}
.close-x:hover::after, .close-x:hover::before {
  transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  background-color: #FFFFFF;
  width: 1px;
}
.close-x:hover::before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.close-x:hover::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.close-x.light .circle-bg {
  background-color: #BFC8CE;
}
.close-x.inverse::after, .close-x.inverse::before {
  background-color: #FFFFFF;
}
.close-x.inverse .circle-bg {
  background-color: #BFC8CE;
  transform: scale(1.6);
}
.close-x-modal .circle-bg {
  background-color: rgba(191, 200, 206, 0.2);
}

.toggle-chevron {
  position: absolute;
  width: 1.5rem;
  height: 1.125rem;
  top: 0.937rem;
  right: 0.937rem;
  transition: all 0.2s ease-out;
  cursor: pointer;
  z-index: 3;
}
.toggle-chevron::after {
  content: "\e938";
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 700;
  color: #233048;
  display: block;
  font-size: 1.75rem;
  position: absolute;
  transform: rotate(90deg);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.toggle-chevron.back:after {
  transform: rotate(0deg);
}

/* pure css close button */
.toggle-x {
  position: absolute;
  right: 1.875rem;
  top: 1.875rem;
  width: 1.125rem;
  height: 1.125rem;
  transition: all 0.2s ease-out;
  cursor: pointer;
  z-index: 20;
}
.toggle-x .circle-bg {
  width: 100%;
  height: 100%;
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  background-color: #233048;
  border-radius: 50%;
  position: absolute;
  z-index: -1;
  transform: scale(0);
  pointer-events: none;
}
.toggle-x.light .circle-bg {
  background-color: #BFC8CE;
}
.toggle-x::after, .toggle-x::before {
  display: block;
  position: absolute;
  content: " ";
  height: 1.125rem;
  width: 1px;
  background-color: #233048;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.toggle-x.back .circle-bg {
  transform: scale(1.8);
}
.toggle-x.back.light .circle-bg {
  transform: scale(1.6);
}
.toggle-x.back::after, .toggle-x.back::before {
  background-color: #FFFFFF;
}
.toggle-x.back::before {
  transform: translate3D(8px, 0, 0) rotate(45deg);
}
.toggle-x.back::after {
  transform: translate3D(8px, 0, 0) rotate(-45deg);
}

.toggle-x:before {
  transform: translate3D(8px, 0, 0) rotate(0deg);
}

.toggle-x:after {
  transform: translate3D(8px, 0, 0) rotate(-90deg);
}

@media screen and (max-width: 768px) {
  .btn {
    white-space: normal;
  }
  .btn::after {
    top: 50%;
    margin-top: -8px;
  }
}