:root {
    --bs-light: #FFFFF0;
}

.navbar-brand-image img {
    max-width: 126px;
    max-height: 33px
}

@media only screen and (min-width: 269.99px) {
    .navbar-brand-image img {
        max-width: 168px;
        max-height: 44px
    }
}

@media only screen and (min-width: 484.99px) {
    .navbar-brand-image img {
        max-width: 280px;
        max-height: 73px
    }
}


.figure {
    max-width: 600px;
    border: 1px solid rgba(17, 17, 17, 0.15);
    border-radius: 4px;
    padding: 1px
}

.figure-caption {
    padding: 1px 5px 10px 10px;
}

#navbarTop {
    height: 120px;
}
body {
    margin-top: 120px;
    padding-top: 100px;
    padding-bottom: 80px;
    background-color: var(--bs-light);
    overflow-x: hidden;
}

.card {
    max-width: 240px;
}
.card img {
    max-width: 240px;
    max-height: 280px;
}

/*.card-group {*/
/*    box-shadow: rgb(38, 57, 77) 0 20px 30px -10px;*/
/*}*/

.card-footer div {
    margin-left: -55%;
    -moz-transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    -o-transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    transform: rotate(-30deg);
}

.card-footer h2 {
    color: green;
    background: transparent;
    text-shadow: 1px 0 1px #CCCCCC, 0 1px 1px #EEEEEE, 2px 1px 1px #CCCCCC, 1px 2px 1px #EEEEEE, 3px 2px 1px #CCCCCC, 2px 3px 1px #EEEEEE, 4px 3px 1px #CCCCCC, 3px 4px 1px #EEEEEE, 5px 4px 1px #CCCCCC, 4px 5px 1px #EEEEEE, 6px 5px 1px #CCCCCC, 5px 6px 1px #EEEEEE, 7px 6px 1px #CCCCCC;
}

.navbar > .container-fluid,
.navbarFooter.bg-light,
.navbar.navbar-light {
    background-color: var(--bs-light) !important
}

.navbarFooter .nav-item a {
    color: var(--bs-gray) !important
}
.navbarFooter .nav-item a:hover {
    text-decoration: underline;
}

#navbarFooter .active {
    color: black !important
}

#navbarFooter .navbar-toggler {
    background-color: #999999;
}

#navbarFooter .navbar-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

#navbarTop .navbar-toggler {
    background-color: #999999;
}

#popUp {
    display: none;
    background-color: white !important;
    box-shadow: rgb(38, 57, 77) 0 20px 30px -10px;
    border: 1px solid grey;
    margin-top: -25vh;
    padding: 10px;
    border-radius: 12px;
    width: 90vw;
    height: 90vh;
    margin-left: -32vw;
    -moz-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
}

.ball {
    position: absolute;
    border-radius: 100%;
    opacity: 0.7;
}