* {
    font-family: 'Montserrat Alternates', sans-serif;
}

html {
    font-size: 1.0rem;
}

@include media-breakpoint-up(sm) {
    html {
        font-size: 1.0rem;
    }
}

@include media-breakpoint-up(md) {
    html {
        font-size: 1.2rem;
    }
}

@include media-breakpoint-up(lg) {
    html {
        font-size: 1.4rem;
    }
}

#notifications_list_wrapper {
	overflow: hidden;
}

.btn-primary {
    color: white;
    background-color: #233A3F;
    border-color: #233A3F;
} .btn-primary:hover {
    color: white;
    background-color: #233A3F;
    border-color: #233A3F;
}

.btn-outline-primary {
    color: #233A3F;
    border-color: #233A3F;
}

.btn-outline-primary:hover {
    color: white;
    border-color: #233A3F;
    background-color: #233A3F;
}

:root, [data-bs-theme="light"] {
	--bs-primary: #233A3F;
	--bs-primary-rgb: 35,58,63;
    --bs-secondary: #63AB8E;
    --bs-secondary-rgb: 99,171,142;
    --bs-success-bg-subtle: #63AB8E;
    --bs-success-text-emphasis: white;
    --bs-link-color: #63AB8E;
    --bs-link-color-rgb: 99,171,142;
    --bs-link-hover-color: #233A3F;
    --bs-link-hover-color-rgb: 35,58,63;
	--bs-primary-text-emphasis: #233A3F;
    --bs-primary-bg-subtle: #63AB8E;
    --bs-primary-text-emphasis: white;
}

@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {
    
    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
      transform: translateX(50%);
    }
    
    .carousel-inner .carousel-item-start.active, 
    .carousel-inner .carousel-item-prev {
      transform: translateX(-50%);
    }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start { 
  transform: translateX(0);
}

.carousel-control-next, .carousel-control-prev {
	width: 40px;
}

.card-header, .card-footer {
    background-color: var(--bs-secondary-bg);
}

.badge-primary {
    font-size: 100%;
    background-color: var(--bs-primary);
    color: white;
}

.badge-danger {
	background-color: rgba(220,53,69,.2);
	color: #bd2130;
}

.badge-info {
	background-color: rgba(23,162,184,.2);
	color: #117a8b;
}

.badge-warning {
	background-color: rgba(255,193,7,.2);
	color: #d39e00;
}