.container {
    width: 95%;
    max-width: 1600px;
}

h1 {
    color: orange;
}

a, .menu {
    color: white;
}

.us {
    color: #ffcc80;
}

a.brand-logo {
    color: #009CE0;
    font-family: Times New Roman Bold;
    font-weight: bold;
}

.member-navigation ul.hide-on-med-and-down li:not(:has(> a)),
.member-navigation ul.hide-on-med-and-down li > a {
    /* control element height by using height, not line-height,
       and add vertical centering, to better handle line breaks */
    line-height: 1.2rem;
    height: 64px;

    display: flex;
    flex-direction: column;
    justify-content: center;
}

.member-navigation ul.hide-on-med-and-down li:last-child > *:last-child {
    /* For the last item in the desktop navigation, remove the right margin
       for alignment with the logout button. */
    margin-right: 0;
}

.menu-text {
    color: #0084d4;
    font-family: 'Sanchez';
    font-weight: bold;
}

.sidenav li >a {
    color: #0084d4;
}

.link-text-nav-mobile {
    color: #0084d4;
    font-weight: 500;
    font-size: 1.2rem;
}

i.delete_forever {
    cursor: pointer;
}

i.priority_high {
    vertical-align: inherit;
}

.disabled_by_default {
    vertical-align: inherit;
}

#confirmation-modal, #queue-modal, #unassign-modal {
    width: 40%;
}
.modal .modal-footer {
    height: auto;
}

#confirmation-modal-close-btn{
    margin-right: 15px;
}
div#confirmation-modal p{
    color: black;
}

div#confirmation-modal p span {
    font-weight: 500;
}

.modal .modal-close.btn-small {
    margin-right: 1rem;
}

.nav-wrapper ul.hide-on-med-and-down {
    display: flex;
}

 button.logout-btn {
    margin-left: 1rem;
}

.btn-container {
    display: flex;
    margin-top: 1rem;
}

.btn-container {
    display: flex;
    margin-top: 1rem;
}

#render-body-container {
    display: flex;
    flex-direction: column;
}

#subscription-list-container {
    padding-top: 7rem;
}

@media only screen and (min-width: 992px) {
    .tables-layout {
        display: flex;
        gap: 5%;
    }

        .tables-layout .card {
            width: 50%;
        }
}

.vissible {
    visibility: visible;
}

.hidden {
    visibility: hidden;
}

.blue {
    background-color: #007ac4 !important;
}

.blue-text {
    font-family: 'Sanchez';
}

.td-right-align {
    text-align: right;
    font-weight: 500; 
}

.sortable-column-header {
    cursor: pointer;
}

.sortable-column-header i {
    width: 25px;
    height: 25px;
}

.datepicker-error {
    border: 1px solid red !important;
    outline: none !important;
}

td form{
    display: contents;
    vertical-align: bottom;
    cursor: pointer;
}

#errandTable td, #errandTable th {
    width: 22%;
}

#errandStatus {
    display: none;
}

math {
    text-align: left;
}

math[display="block"] {
    /* We assume that block math consisting of several <mrow> elements should
       be presented vertically. */
    display: inline-flex;
    flex-direction: column;
}

math[display="block"] mrow + mrow {
    margin-top: 1rem;
}

/* default vertical padding in materialize.css is 15 px */
table td:has(+ td),
table th:has(+ th) { padding-right: 30px; }
table td + td,
table th + th { padding-left: 30px; }