.fakeimg {
    height: 200px;
    background: #aaa;
}

.text-shadow {
    text-shadow: 3px 3px 5px black;
}

li {
    font-size: 1.5rem;
}

.collapse > ul > li > a:hover, .collapse > ul > li > button:hover, .btn:hover {
    color: white;
}

.offcanvas-body > ul > li > a:hover {
    background-color: rgb(13, 110, 253);
    border-radius: 15px;
}

.offcanvas-body > ul > li > a:active {
    background-color: rgb(13, 202, 240);
}

.nav-tabs > li > a:hover {
    background-color: rgb(227, 230, 232);
}

.disabled {
    color: rgb(220, 53, 69) !important;
}

.skip {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.skip:focus {
    position: static;
    width: auto;
    height: auto;
    --bs-btn-hover-color: rgb(13,202,240) !important;
}

@media only screen and (max-width: 575px) {
    /* XS */
    .small, .medium, .large, .xlarge, .xxlarge {
        display: none;
    }
    .xsmall {
        display: block;
    }
}

@media only screen and (min-width: 576px) {
    /* SM */
    .xsmall, .medium, .large, .xlarge, .xxlarge {
        display: none;
    }
    .small {
        display: block;
    }
}

@media only screen and (min-width: 768px) {
    /* MD */
    .xsmall, .small, .large, .xlarge, .xxlarge {
        display: none;
    }
    .medium {
        display: block;
    }
}

@media only screen and (min-width: 992px) {
    /* LG */
    .xsmall, .small, .medium, .xlarge, .xxlarge {
        display: none;
    }
    .large {
        display: block;
    }
}

@media only screen and (min-width: 1200px) {
    /* XL */
    .xsmall, .small, .medium, .large, .xxlarge {
        display: none;
    }
    .xlarge {
        display: block;
    }
}

@media only screen and (min-width: 1400px) {
    /* XXL */
    .xsmall, .small, .medium, .large, .xlarge {
        display: none;
    }
    .xxlarge {
        display: block;
    }
}