:root {
  --logo-color-blue: #008bd2;
  --logo-color-red: #e30613;
  --logo-color-yellow: #fd0;
}

.hero-image img {
  bottom: 0;
  z-index: 0;
  right: 10%;
}

@media only screen and (min-width: 480px) {
    .hero-image img {
        bottom: 0;
        z-index: 0;
        right: 30%;
    }
}

.text-accent {
    color: var(--logo-color-blue) !important;
}

.bg-accent {
    background-color: var(--logo-color-blue)  !important;
}

.btn-accent {
    background-color: var(--logo-color-blue)  !important;
}

.btn-logo-red {
    background-color: rgba(var(--logo-color-red), 0.5)  !important;
    color: rgba();

}

.btn-logo-yellow {
    background-color: var(--logo-color-yellow)  !important;
}

header .bi {
    width: 1em;
    height: 1em;
}