@font-face {
    font-family: 'Outfit';
    src: url('fonts/Outfit-ExtraLight.ttf') format('truetype');
    font-weight: ExtraLight;
    font-style: normal;
}

@font-face {
    font-family: 'Volkhov';
    src: url('fonts/Volkhov-Regular.ttf') format('truetype');
    font-weight: Regular;
    font-style: normal;
}

body {
    background-color: rgba(187, 230, 180, 0.4);
    font-family: "Outfit";
}

.bgdark {
    background-color: #89cbc9 !important;
    border-color: #89cbc9 !important;
    color: #fff !important;
}

.bgwhite {
    background-color: #fff !important;
}

.navbar {
    opacity: 0.95;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: rgba(86, 176, 54, 1) !important;
    color: #fff !important;
}

.btn-dark {
    background-color: rgba(33, 65, 52, 1) !important;
    border-color: rgba(86, 176, 54, 1);
}

.list-group-item {
    background-color: rgba(137, 204, 202, .3);
}

.list-group-item-secondary {
    background-color:rgba(86, 176, 54, 1);
    color:#fff;
    font-weight: bold;
}

.list-group-hover .list-group-item:hover {
    background-color: rgba(234, 146, 0, .4);
}

.list-group-item.active {
    background-color: rgba(0, 110, 182, .3);
}

.spermalie-vib-groen {
    color: rgba(86, 176, 54, 1);
}

.spermalie-fam-groen {
    color: rgba(33, 65, 52, 1);
}

.jumbotron {
    background-color: rgba(33, 65, 52, 1);
    color: rgba(86, 176, 54, 1);
    border-radius: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: rgba(86, 176, 54, 1);
    font-family: "Volkhov";
}

/* Spermalie table striping - Bootstrap 5.3 compatible */
.table-striped>tbody>tr:nth-of-type(odd),
.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(33, 65, 52, 1) !important;
    --bs-table-striped-bg: rgba(33, 65, 52, 1) !important;
}

.table-striped>tbody>tr:nth-of-type(odd) td,
.table-striped>tbody>tr:nth-of-type(odd) th,
.table-striped tbody tr:nth-of-type(odd) td,
.table-striped tbody tr:nth-of-type(odd) th
{
    color: #fff !important;
}

a {
    color: rgba(86, 176, 54, 1);
}
.card-header {
    background-color: rgba(33, 65, 52, 1);
    color: #fff;
    font-weight: bold;
}

.card-img-top i {
    font-size: xx-large;
}

.divToast {
    position: fixed;
    top: 80px;
    right: 15px;
    z-index: 99;
}

.spinner {
   width: 56px;
   height: 56px;
   display: grid;
   animation: spinner-plncf9 4s infinite;
}

.spinner::before,
.spinner::after {
   content: "";
   grid-area: 1/1;
   border: 9px solid;
   border-radius: 50%;
   border-color: #56b036 #56b036 #0000 #0000;
   mix-blend-mode: darken;
   animation: spinner-plncf9 1s infinite linear;
}

.spinner::after {
   border-color: #0000 #0000 #dbdcef #dbdcef;
   animation-direction: reverse;
}

@keyframes spinner-plncf9 {
   100% {
      transform: rotate(1turn);
   }
}