body {
    background-color: #f5f5f5;
}
.rootdomain-main-page {
    color: #222;
}
.rootdomain-main-page .page-title {
    font-size: 1.15em;
}
.rootdomain-main-page .page-title, .rootdomain-main-page .the-rest, .rootdomain-main-page .mbo-logo-main {
    display: inline-block;
    vertical-align: middle;
}
.rootdomain-main-page a {
    color: var(--link-color);
}
.rootdomain-main-page a:visited {
    color: var(--visited-link-color);
}
.rootdomain-main-page a.owned-subdomain {
    color: #b59410;
}
.theme-name-winter {
    /* Cool blue */
    color: #4d8cf5;
}
.theme-name-spring {
    /* Cotton-candy pink */
    color: #ff6b6b;
}
.theme-name-summer {
    /* Deep green */
    color: #00b894;
}
.theme-name-fall {
    /* Pumpkin orange */
    color: #ff7f50;
}
.subdomain-items {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
    padding: 0;
    justify-content: left;
}
/* Breakpoints to reduce columns */
@media (max-width: 1300px) {
    .subdomain-items {
        grid-template-columns: repeat(6, 1fr);
    }
}
@media (max-width: 1000px) {
    .subdomain-items {
        grid-template-columns: repeat(5, 1fr);
    }
}
@media (max-width: 800px) {
    .subdomain-items {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media (max-width: 600px) {
    .subdomain-items {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 500px) {
    .subdomain-items {
        grid-template-columns: repeat(2, 1fr);
    }
}
#subdomain-search {
    width: 60px;
    max-width: 200px;
}
#subdomain-tooltip {
    position: absolute;
    color: black;
    background-color: yellow;
    border: 1px solid #000;
    padding: 5px;
    z-index: 1;
    max-width: 200px;
}
.subdomain-item a {
    border: 1px solid transparent;
}
.subdomain-item a:hover {
    background-color: yellow;
    border: 1px solid #000;
}
.mbo-logo-main {
    height: 50px;
    margin: 0 auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
}
.rootdomain-main-page-header {
    color: #444;
}
.mainpage-recent-users-user {
    border-radius: 50%;
}
.mainpage-recent-users-user:hover {
    /* Add a shadow to the user */
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
}
#darkmode-form {
    display: inline-block;
}