@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@latest/font/bootstrap-icons.css");
.bi-lrt::before {
  content: "";
  height: 1em;
  width: 1em;
  background-color: currentColor;
  display: inline-block;
  -webkit-mask: url("/media/mod_vu_cards/icons/lrt.svg") no-repeat center/contain;
          mask: url("/media/mod_vu_cards/icons/lrt.svg") no-repeat center/contain;
}

.bi-soundcloud::before {
  content: "";
  height: 1em;
  width: 1em;
  background-color: currentColor;
  display: inline-block;
  -webkit-mask: url("/media/mod_vu_cards/icons/soundcloud.svg") no-repeat center/contain;
          mask: url("/media/mod_vu_cards/icons/soundcloud.svg") no-repeat center/contain;
}

.vu-cards .btn-lrt {
  color: #fff;
  background-color: #222659;
  border-color: #222659;
}
.vu-cards .btn-lrt:hover {
  color: #fff;
  background-color: #141634;
  border-color: #1b1e47;
}
.btn-check:focus + .vu-cards .btn-lrt, .vu-cards .btn-lrt:focus {
  color: #fff;
  background-color: #141634;
  border-color: #1b1e47;
  box-shadow: 0 0 0 0.25rem rgba(67, 71, 114, 0.5);
}
.btn-check:checked + .vu-cards .btn-lrt, .btn-check:active + .vu-cards .btn-lrt, .vu-cards .btn-lrt:active, .vu-cards .btn-lrt.active, .show > .vu-cards .btn-lrt.dropdown-toggle {
  color: #fff;
  background-color: #1b1e47;
  border-color: #1a1d43;
}
.btn-check:checked + .vu-cards .btn-lrt:focus, .btn-check:active + .vu-cards .btn-lrt:focus, .vu-cards .btn-lrt:active:focus, .vu-cards .btn-lrt.active:focus, .show > .vu-cards .btn-lrt.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.25rem rgba(67, 71, 114, 0.5);
}
.vu-cards .btn-lrt:disabled, .vu-cards .btn-lrt.disabled {
  color: #fff;
  background-color: #222659;
  border-color: #222659;
}
.vu-cards .btn-lrt:hover {
  background-color: #1b1e47;
}
.vu-cards .btn-soundcloud {
  color: #fff;
  background-color: #ff5500;
  border-color: #ff5500;
}
.vu-cards .btn-soundcloud:hover {
  color: #fff;
  background-color: #cc4400;
  border-color: #cc4400;
}
.btn-check:focus + .vu-cards .btn-soundcloud, .vu-cards .btn-soundcloud:focus {
  color: #fff;
  background-color: #cc4400;
  border-color: #cc4400;
  box-shadow: 0 0 0 0.25rem rgba(255, 111, 38, 0.5);
}
.btn-check:checked + .vu-cards .btn-soundcloud, .btn-check:active + .vu-cards .btn-soundcloud, .vu-cards .btn-soundcloud:active, .vu-cards .btn-soundcloud.active, .show > .vu-cards .btn-soundcloud.dropdown-toggle {
  color: #fff;
  background-color: #cc4400;
  border-color: #bf4000;
}
.btn-check:checked + .vu-cards .btn-soundcloud:focus, .btn-check:active + .vu-cards .btn-soundcloud:focus, .vu-cards .btn-soundcloud:active:focus, .vu-cards .btn-soundcloud.active:focus, .show > .vu-cards .btn-soundcloud.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 111, 38, 0.5);
}
.vu-cards .btn-soundcloud:disabled, .vu-cards .btn-soundcloud.disabled {
  color: #fff;
  background-color: #ff5500;
  border-color: #ff5500;
}
.vu-cards .btn-soundcloud:hover {
  background-color: #cc4400;
}
.vu-cards .btn-spotify {
  color: #fff;
  background-color: #1db954;
  border-color: #1db954;
}
.vu-cards .btn-spotify:hover {
  color: #fff;
  background-color: #168d40;
  border-color: #179443;
}
.btn-check:focus + .vu-cards .btn-spotify, .vu-cards .btn-spotify:focus {
  color: #fff;
  background-color: #168d40;
  border-color: #179443;
  box-shadow: 0 0 0 0.25rem rgba(63, 196, 110, 0.5);
}
.btn-check:checked + .vu-cards .btn-spotify, .btn-check:active + .vu-cards .btn-spotify, .vu-cards .btn-spotify:active, .vu-cards .btn-spotify.active, .show > .vu-cards .btn-spotify.dropdown-toggle {
  color: #fff;
  background-color: #179443;
  border-color: #168b3f;
}
.btn-check:checked + .vu-cards .btn-spotify:focus, .btn-check:active + .vu-cards .btn-spotify:focus, .vu-cards .btn-spotify:active:focus, .vu-cards .btn-spotify.active:focus, .show > .vu-cards .btn-spotify.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.25rem rgba(63, 196, 110, 0.5);
}
.vu-cards .btn-spotify:disabled, .vu-cards .btn-spotify.disabled {
  color: #000;
  background-color: #1db954;
  border-color: #1db954;
}
.vu-cards .btn-spotify:hover {
  background-color: #179443;
}
.vu-cards .btn-youtube {
  color: #fff;
  background-color: #ff0000;
  border-color: #ff0000;
}
.vu-cards .btn-youtube:hover {
  color: #fff;
  background-color: #cc0000;
  border-color: #cc0000;
}
.btn-check:focus + .vu-cards .btn-youtube, .vu-cards .btn-youtube:focus {
  color: #fff;
  background-color: #cc0000;
  border-color: #cc0000;
  box-shadow: 0 0 0 0.25rem rgba(255, 38, 38, 0.5);
}
.btn-check:checked + .vu-cards .btn-youtube, .btn-check:active + .vu-cards .btn-youtube, .vu-cards .btn-youtube:active, .vu-cards .btn-youtube.active, .show > .vu-cards .btn-youtube.dropdown-toggle {
  color: #fff;
  background-color: #cc0000;
  border-color: #bf0000;
}
.btn-check:checked + .vu-cards .btn-youtube:focus, .btn-check:active + .vu-cards .btn-youtube:focus, .vu-cards .btn-youtube:active:focus, .vu-cards .btn-youtube.active:focus, .show > .vu-cards .btn-youtube.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 38, 38, 0.5);
}
.vu-cards .btn-youtube:disabled, .vu-cards .btn-youtube.disabled {
  color: #fff;
  background-color: #ff0000;
  border-color: #ff0000;
}
.vu-cards .btn-youtube:hover {
  background-color: #cc0000;
}
.vu-cards .btn-outline-lrt {
  color: #222659;
  border-color: #222659;
}
.vu-cards .btn-outline-lrt:hover {
  color: #fff;
  background-color: #222659;
  border-color: #222659;
}
.btn-check:focus + .vu-cards .btn-outline-lrt, .vu-cards .btn-outline-lrt:focus {
  box-shadow: 0 0 0 0.25rem rgba(34, 38, 89, 0.5);
}
.btn-check:checked + .vu-cards .btn-outline-lrt, .btn-check:active + .vu-cards .btn-outline-lrt, .vu-cards .btn-outline-lrt:active, .vu-cards .btn-outline-lrt.active, .vu-cards .btn-outline-lrt.dropdown-toggle.show {
  color: #fff;
  background-color: #222659;
  border-color: #222659;
}
.btn-check:checked + .vu-cards .btn-outline-lrt:focus, .btn-check:active + .vu-cards .btn-outline-lrt:focus, .vu-cards .btn-outline-lrt:active:focus, .vu-cards .btn-outline-lrt.active:focus, .vu-cards .btn-outline-lrt.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem rgba(34, 38, 89, 0.5);
}
.vu-cards .btn-outline-lrt:disabled, .vu-cards .btn-outline-lrt.disabled {
  color: #222659;
  background-color: transparent;
}
.vu-cards .btn-outline-soundcloud {
  color: #ff5500;
  border-color: #ff5500;
}
.vu-cards .btn-outline-soundcloud:hover {
  color: #fff;
  background-color: #ff5500;
  border-color: #ff5500;
}
.btn-check:focus + .vu-cards .btn-outline-soundcloud, .vu-cards .btn-outline-soundcloud:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 85, 0, 0.5);
}
.btn-check:checked + .vu-cards .btn-outline-soundcloud, .btn-check:active + .vu-cards .btn-outline-soundcloud, .vu-cards .btn-outline-soundcloud:active, .vu-cards .btn-outline-soundcloud.active, .vu-cards .btn-outline-soundcloud.dropdown-toggle.show {
  color: #fff;
  background-color: #ff5500;
  border-color: #ff5500;
}
.btn-check:checked + .vu-cards .btn-outline-soundcloud:focus, .btn-check:active + .vu-cards .btn-outline-soundcloud:focus, .vu-cards .btn-outline-soundcloud:active:focus, .vu-cards .btn-outline-soundcloud.active:focus, .vu-cards .btn-outline-soundcloud.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 85, 0, 0.5);
}
.vu-cards .btn-outline-soundcloud:disabled, .vu-cards .btn-outline-soundcloud.disabled {
  color: #ff5500;
  background-color: transparent;
}
.vu-cards .btn-outline-spotify {
  color: #1db954;
  border-color: #1db954;
}
.vu-cards .btn-outline-spotify:hover {
  color: #fff;
  background-color: #1db954;
  border-color: #1db954;
}
.btn-check:focus + .vu-cards .btn-outline-spotify, .vu-cards .btn-outline-spotify:focus {
  box-shadow: 0 0 0 0.25rem rgba(29, 185, 84, 0.5);
}
.btn-check:checked + .vu-cards .btn-outline-spotify, .btn-check:active + .vu-cards .btn-outline-spotify, .vu-cards .btn-outline-spotify:active, .vu-cards .btn-outline-spotify.active, .vu-cards .btn-outline-spotify.dropdown-toggle.show {
  color: #000;
  background-color: #1db954;
  border-color: #1db954;
}
.btn-check:checked + .vu-cards .btn-outline-spotify:focus, .btn-check:active + .vu-cards .btn-outline-spotify:focus, .vu-cards .btn-outline-spotify:active:focus, .vu-cards .btn-outline-spotify.active:focus, .vu-cards .btn-outline-spotify.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem rgba(29, 185, 84, 0.5);
}
.vu-cards .btn-outline-spotify:disabled, .vu-cards .btn-outline-spotify.disabled {
  color: #1db954;
  background-color: transparent;
}
.vu-cards .btn-outline-youtube {
  color: #ff0000;
  border-color: #ff0000;
}
.vu-cards .btn-outline-youtube:hover {
  color: #fff;
  background-color: #ff0000;
  border-color: #ff0000;
}
.btn-check:focus + .vu-cards .btn-outline-youtube, .vu-cards .btn-outline-youtube:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.5);
}
.btn-check:checked + .vu-cards .btn-outline-youtube, .btn-check:active + .vu-cards .btn-outline-youtube, .vu-cards .btn-outline-youtube:active, .vu-cards .btn-outline-youtube.active, .vu-cards .btn-outline-youtube.dropdown-toggle.show {
  color: #fff;
  background-color: #ff0000;
  border-color: #ff0000;
}
.btn-check:checked + .vu-cards .btn-outline-youtube:focus, .btn-check:active + .vu-cards .btn-outline-youtube:focus, .vu-cards .btn-outline-youtube:active:focus, .vu-cards .btn-outline-youtube.active:focus, .vu-cards .btn-outline-youtube.dropdown-toggle.show:focus {
  box-shadow: 0 0 0 0.25rem rgba(255, 0, 0, 0.5);
}
.vu-cards .btn-outline-youtube:disabled, .vu-cards .btn-outline-youtube.disabled {
  color: #ff0000;
  background-color: transparent;
}
.vu-cards .ratio-2x1 {
  --bs-aspect-ratio: 50%;
}
.vu-cards .ratio-3x2 {
  --bs-aspect-ratio: 66.6666666667%;
}
.vu-cards .ratio-3x1 {
  --bs-aspect-ratio: 33.3333333333%;
}
.vu-cards .bi {
  font-size: 1.5em;
}
.vu-cards .bi::before {
  height: 1em;
  width: 1em;
}
.vu-cards .card-img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}