:root {
  --cassiopeia-color-primary: #152A4F; /* Replace with your primary hex code */
}
.own {
  --cassiopeia-color-primary: #152A4F;
  --cassiopeia-color-hover: #174F4B;
  --cassiopeia-color-link: #152A4F;
}

/* Change image logo size */
.navbar-brand img {
    max-height: 50px !important; /* Adjust height as needed */
    width: auto;
}

/* Change text logo size */
.brand-logo {
    font-size: 12px !important;
}

.site-description {
    font-size: 12px !important;
}

.container-header {
    background-color: #152A4F;
    background-image: none;
    background-image: linear-gradient(0.25turn, #152A4F, #333C5B);
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "top below" 
                         "logo logo" 
                         "nav nav";
}
.container-header .container-topbar {
    padding: .5em;
}
.container-header .container-topbar {
    grid-area: top;
}
.container-header .container-below-top {
    grid-area: below;
    justify-content: flex-end;
}
.container-header .grid-child:has(.navbar-brand) {
    grid-area: logo;
}
.container-header .container-nav {
    grid-area: nav;
}
@media (width >= 991.98px) {
    .container-header {
        grid-template-columns: 
            [full-start] minmax(0,1fr) 
            [main-start] repeat(4,minmax(0,19.875rem))
            [main-end] minmax(0,1fr)[full-end];
        grid-template-areas: ". logo nav nav nav .";
        gap: 0 1rem;
    }
    .container-header:has(.container-below-top, .container-topbar) {
        grid-template-areas: ". top top below below ." 
                             ". logo nav nav nav .";
    }
}
.footer {
    background-color: #152A4F;
    background-image: none;
    font-size: 12px;
}