html { scroll-behavior: smooth; }
h1, h2, h3, h4, h5, h6, th { font-family: 'Prompt', sans-serif; }
body, p, span, label, td { font-family: 'Montserrat', sans-serif; }

body::-webkit-scrollbar { width: 2px; }
body::-webkit-scrollbar-track { background: transparent; }
body::-webkit-scrollbar-thumb { background-color: #8d1007; }

header.w3-top { z-index: 2; }

h1 { margin: 0 !important; }

th { text-align: center !important; }
th, td { 
    vertical-align: middle !important;
    font-weight: normal;
    white-space: nowrap;
}

.container-centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 400px;
}

.apps-logo { max-width: 96px; }
.apps-logo-large { max-width: 128px; }
.user-avatar { width: 4em; }

.form-overlay { z-index: 5 !important; }

.image-error { width: 100%; max-width: 400px; }

.text-prompt { font-family: 'Prompt', sans-serif; }
.text-montserrat { font-family: 'Montserrat', sans-serif; }
.text-bold { font-weight: bold; }
.text-italic { font-style: italic; }
.text-none,.text-none:hover { text-decoration: none; }
.text-plain { text-decoration: none; }

.no-wrap { white-space: nowrap; }

.cursor-pointer { cursor: pointer; }
.cursor-default { cursor: default; }

.href-disabled { pointer-events: none; }

@media only screen {
    .custom-scrollbar { scrollbar-width: thin; scrollbar-color: transparent transparent; }
    .custom-scrollbar::-webkit-scrollbar { width: 2px; }
    .custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
    .custom-scrollbar::-webkit-scrollbar-thumb { background-color: transparent; }
}

@media only screen and (max-width: 992px) {
    main#myMain { margin-left: 0%; }
    nav#mySidebar {
        width: 100%;
        box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    }
}

@media only screen and (min-width: 992px) {
    main#myMain { margin-left: 20%; }
    nav#mySidebar { width: 20%; min-width: 200px; }
}