/*!
 * SDGs 1.0 by @un - https://www.un.org
 * Font by Rachel Babruskinas, Gabe Galaxy
 * Copyright 2024 United Nations
 */

.sdgEN {
  font-family: "SDGIconsEN";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgFR {
  font-family: "SDGIconsFR";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgSP {
  font-family: "SDGIconsSP";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgRU {
  font-family: "SDGIconsRU";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgAR {
  font-family: "SDGIconsAR";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgCH {
  font-family: "SDGIconsCH";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxEN {
  font-family: "SDGIconsNoBoxEN";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxFR {
  font-family: "SDGIconsNoBoxFR";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxSP {
  font-family: "SDGIconsNoBoxSP";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxRU {
  font-family: "SDGIconsNoBoxRU";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxAR {
  font-family: "SDGIconsNoBoxAR";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdgNoBoxCH {
  font-family: "SDGIconsNoBoxCH";
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}

.sdg {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  text-rendering: auto; }

.sdg-1x {
  font-size: 2em;
  line-height: 1em; }

.sdg-2x {
  font-size: 4em;
  line-height: 1em; }

.sdg-3x {
  font-size: 8em;
  line-height: 1em;  }

.sdg-4x {
  font-size: 12em;
  line-height: 1em;  }

.sdg-5x {
  font-size: 16em;
  line-height: 1em;  }

.sdg-6x {
  font-size: 18em;
  line-height: 1em;  }

.sdg-7x {
  font-size: 20em;
  line-height: 1em;  }

.sdg-8x {
  font-size: 22em;
  line-height: 1em;  }

.sdg-9x {
  font-size: 24em;
  line-height: 1em;  }

.sdg-10x {
  font-size: 26em; 
  line-height: 1em; }

.sdg-2xs {
  font-size: 1em; }

.sdg-xs {
  font-size: 2em; }

.sdg-sm {
  font-size: 3em; }

.sdg-lg {
  font-size: 5em; }

.sdg-xl {
  font-size: 10em; }

.sdg-2xl {
  font-size: 15em; }

.sdg-fw {
  text-align: center;
  width: 1.25em; }

.sdg-ul {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0; }
  .sdg-ul > li {
    position: relative; }

.sdg-li {
  left: calc(-1 * 2em);
  position: absolute;
  text-align: center;
  width: 2em;
  line-height: inherit; }

.sdg-pull-left {
  float: left;
  margin-right: 0.3em; }

.sdg-pull-right {
  float: right;
  margin-left: 0.3em; }

.sdg-beat {
  animation-name: sdg-beat;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; }

.sdg-bounce {
  animation-name: sdg-bounce;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.28, 0.84, 0.42, 1); }

.sdg-fade {
  animation-name: sdg-fade;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1); }

.sdg-beat-fade {
  animation-name: sdg-beat-fade;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1); }

.sdg-flip {
  animation-name: sdg-flip;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out; }

.sdg-shake {
  animation-name: sdg-shake;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

.sdg-spin {
  animation-name: sdg-spin;
  animation-delay: 0s;
  animation-direction: normal;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear; }

.sdg-spin-reverse {
  --sdg-animation-direction: reverse; }

.sdg-pulse,
.sdg-spin-pulse {
  animation-name: sdg-spin;
  animation-direction: normal;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: steps(8); }

@media (prefers-reduced-motion: reduce) {
  .sdg-beat,
  .sdg-bounce,
  .sdg-fade,
  .sdg-beat-fade,
  .sdg-flip,
  .sdg-pulse,
  .sdg-shake,
  .sdg-spin,
  .sdg-spin-pulse {
    animation-delay: -1ms;
    animation-duration: 1ms;
    animation-iteration-count: 1;
    transition-delay: 0s;
    transition-duration: 0s; } }

@keyframes sdg-beat {
  0%, 90% {
    transform: scale(1); }
  45% {
    transform: scale(1.25); } }

@keyframes sdg-bounce {
  0% {
    transform: scale(1, 1) translateY(0); }
  10% {
    transform: scale(1.1, 0.9) translateY(0); }
  30% {
    transform: scale(0.9, 1.1)) translateY(-0.5em); }
  50% {
    transform: scale(1.05, 0.95) translateY(0); }
  57% {
    transform: scale(1, 1) translateY(-0.125em); }
  64% {
    transform: scale(1, 1) translateY(0); }
  100% {
    transform: scale(1, 1) translateY(0); } }

@keyframes sdg-fade {
  50% {
    opacity: 0.4; } }

@keyframes sdg-beat-fade {
  0%, 100% {
    opacity: 0.4;
    transform: scale(1); }
  50% {
    opacity: 1;
    transform: scale(1.125); } }

@keyframes sdg-flip {
  50% {
    transform: rotate3d(0, 1, 0, -180deg); } }

@keyframes sdg-shake {
  0% {
    transform: rotate(-15deg); }
  4% {
    transform: rotate(15deg); }
  8%, 24% {
    transform: rotate(-18deg); }
  12%, 28% {
    transform: rotate(18deg); }
  16% {
    transform: rotate(-22deg); }
  20% {
    transform: rotate(22deg); }
  32% {
    transform: rotate(-12deg); }
  36% {
    transform: rotate(12deg); }
  40%, 100% {
    transform: rotate(0deg); } }

@keyframes sdg-spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

.sdg-rotate-90 {
  transform: rotate(90deg); }

.sdg-rotate-180 {
  transform: rotate(180deg); }

.sdg-rotate-270 {
  transform: rotate(270deg); }

.sdg-flip-horizontal {
  transform: scale(-1, 1); }

.sdg-flip-vertical {
  transform: scale(1, -1); }

.sdg-flip-both,
.sdg-flip-horizontal.sdg-flip-vertical {
  transform: scale(-1, -1); }

.sdg-rotate-by {
  transform: rotate(0); }

.sdg-inverse {
  color: #fff; }

/* SDG icons */

.sdg-1::before {
  content: "\0041";
  color: #e5243b; }

.sdg-2::before {
  content: "\0042"; 
  color: #DDA63A; }

.sdg-3::before {
  content: "\0043"; 
  color: #4C9F38; }

.sdg-4::before {
  content: "\0044"; 
  color: #C5192D; }

.sdg-5::before {
  content: "\0045"; 
  color: #FF3A21; }

.sdg-6::before {
  content: "\0046"; 
  color: #26BDE2; }

.sdg-7::before {
  content: "\0047"; 
  color: #FCC30B; }

.sdg-8::before {
  content: "\0048";
  color: #A21942; }

.sdg-9::before {
  content: "\0049";
  color: #FD6925; }

.sdg-10::before {
  content: "\004A";
  color: #DD1367; }

.sdg-11::before {
  content: "\004B";
  color: #FD9D24; }

.sdg-12::before {
  content: "\004C";
  color: #BF8B2E; }

.sdg-13::before {
  content: "\004D";
  color: #3F7E44; }

.sdg-14::before {
  content: "\004E";
  color: #0A97D9; }

.sdg-15::before {
  content: "\004F";
  color: #56C02B; }

.sdg-16::before {
  content: "\0050";
  color: #00689D; }

.sdg-17::before {
  content: "\0051";
  color: #19486A; }

.sdg-wheel-white::before {
  content: "\0052";
  color: #000000; }

.sdg-wheel-black::before {
  content: "\0053";
  color: #ffffff; }

@font-face {
  font-family: "SDGIconsEN";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsEN.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsEN.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsEN.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsSP";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsSP.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsSP.woff') format('woff'),
		url('/themes/custom/un/fonts/SDGIconsSP.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsFR";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsFR.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsFR.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsFR.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsRU";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsRU.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsRU.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsRU.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsCH";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsCH.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsCH.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsCH.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsAR";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsAR.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsAR.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsAR.woff') format('woff'),
		url('/themes/custom/un/fonts/SDGIconsAR.ttf') format('ttf');
}

@font-face {
  font-family: "SDGIconsNoBoxEN";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxEN.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxEN.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxEN.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsNoBoxSP";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxSP.otf') format('otf');
}
@font-face {
  font-family: "SDGIconsNoBoxFR";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxFR.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxFR.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxFR.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsNoBoxRU";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxRU.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxRU.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxRU.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsNoBoxCH";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxCH.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxCH.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxCH.ttf') format('ttf');
}
@font-face {
  font-family: "SDGIconsNoBoxAR";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/themes/custom/un/fonts/SDGIconsNoBoxAR.otf') format('otf'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxAR.woff2') format('woff2'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxAR.woff') format('woff'),
		url('/themes/custom/un/fonts/SDGIconsNoBoxAR.ttf') format('ttf');
}