@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap');

.josefin-sans {
  font-family: "Josefin Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

:root {
  --asb-gm-green: #54baa2;
  --asb-gm-orange: #f6a202;
  --asb-gm-light-blue: #ebf6f8;
  --asb-gm-light-green: #daeeec;
  --asb-gm-light-yellow: #f2d780;
  --asb-gm-green-rgb: 84, 186, 162;
  --asb-gm-orange-rgb: 246, 162, 2;
}

.text-gm-green {
  color: var(--asb-gm-green);
}
.text-gm-orange {
  color: var(--asb-gm-orange);
}
.text-gm-light-blue {
  color: var(--asb-gm-light-blue);
}
.bg-gm-green {
  background-color: var(--asb-gm-green);
}
.bg-gm-orange {
  background-color: var(--asb-gm-orange);
}
.bg-gm-light-blue {
  background-color: var(--asb-gm-light-blue);
}
.bg-gm-light-green {
  background-color: var(--asb-gm-light-green);
}
.bg-gm-light-yellow {
  background-color: var(--asb-gm-light-yellow);
}

.view-mobility-guide a:hover{
  box-shadow: 0 .5rem 1rem rgba(var(--bs-dark-rgb),0.2) !important;
  transform: scale(1.05);
  transition: all ease-in-out .3s;
}
.mobility-resource.card{
  transition: all ease-in-out .3s;
}
.mobility-resource.card:hover{
  box-shadow: 0 .5rem 1rem rgba(var(--bs-dark-rgb),0.2) !important;
  transform: scale(1.05);
  transition: all ease-in-out .3s;
}

.header-guide-mobilite .page-title {
  color: var(--asb-gm-orange) !important;
  font-family: "Josefin Sans", sans-serif;
  font-weight: bolder;
  text-transform: uppercase;
}
.header-guide-mobilite .page-title::after {
  display: none !important;
}

.node .btn {
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-border-radius: var(--bs-border-radius-xxl);
  --bs-btn-font-weight: 500;
}

.node .btn-primary {
  --bs-primary: var(--asb-gm-orange);
  --bs-primary-rgb: var(--asb-gm-orange-rgb);
}

.node .btn-outline-primary {
  --bs-btn-color: var(--asb-gm-orange);
  --bs-btn-border-color: var(--asb-gm-orange);
  --bs-btn-hover-bg: var(--asb-gm-orange);
  --bs-btn-hover-border-color: var(--asb-gm-orange);
  --bs-btn-active-bg: var(--asb-gm-orange);
  --bs-btn-active-border-color: var(--asb-gm-orange);
  --bs-btn-disabled-color: var(--asb-gm-orange);
  --bs-btn-disabled-border-color: var(--asb-gm-orange);
}

.js-form-type-checkbox input:checked + label:before {
    background-color: var(--asb-gm-green) !important;
}

.card-flip .front .icon {
  background-color: var(--asb-gm-orange) !important;
}

.paragraph--type--rich-content .title:before {
  background-color: var(--asb-gm-orange) !important;
}