html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 14px;
    .mh-md-100 {max-height: 100%;}
  }
}

.modal {
    position: absolute;
    top: 10px;
    right: 100px;
    bottom: 0;
    left: 0;
}

.center {
    text-align: center;
}

.col-fixed-40 { width: 40px; max-width: 40px;}

hr.hr-thin {
    margin-top: 2px;
    margin-bottom: 2px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
/*  margin-bottom: 60px;
*/}
body {
   /* padding-top: 40px;
    padding-bottom: 0px;*/
}

body {
}

.w-sidebar {
    width: 200px;
    max-width: 200px;
}

.row.collapse {
    margin-left: -200px;
    left: 0;
    transition: margin-left .05s ease;
}

    .row.collapse.show {
        margin-left: 0 !important;
    }

.row.collapsing {
    margin-left: -200px;
    left: -0.05%;
    transition: all .05s ease;
}

.div.collapse {

}

.text-toggle[aria-expanded=false] .text-expanded { display: none;}
.text-toggle[aria-expanded=true] .text-collapsed { display: none;}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.5%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 100%;
}

    .lcontainer {
        display: flex;
        flex-flow: column nowrap;
        flex-direction: column;
    }

    .lcontainer textarea.lesson-txt {
        box-sizing: border-box;
        height: 100%;
        min-height: 80px;
        resize: both;
    }

    textarea.height-75 {
        min-height: 75px;
    }

    .textarea-container {
        position: relative;
    }

    .textarea-container > div, .textarea-container > textarea {
        word-wrap: break-word;
        box-sizing: border-box;
        padding: 2px;
        width: 100%;
    }

    .textarea-container > textarea {
        overflow: hidden;
        position: absolute;
        height: 100%;
    }

    .textarea-container > div {
        padding-bottom: 1.5em;
        visibility: hidden;
    }

table {
    width: 100%;
    table-layout: fixed;
    border: 1px solid var(--color2);
    border-collapse: collapse;
}

table.noBorder {
    border: 0px hidden;
}


.thirty {
    width: 30%;
}

.fit {
    width: 100%;
    max-width: 125px;
}

.fit-lg {
    width: 100%;
    max-width: 250px;
}

button {
    display: inline-block
}

button.btn-pgdBanner {
    display: inline-block;
    /*font-weight: 400;*/
    /*line-height: 1.5;*/
    /*color: #212529;*/
    color: var(--color5);
    font-size: var(--bs-body-font-size);
    /*text-align: center;*/
    text-decoration: none;
    /*    vertical-align: middle;*/
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 0px solid transparent;
    /*padding: 0.375rem 0.75rem;*/
    /*font-size: 1rem;*/
    /*border-radius: 0.25rem;*/
    /*transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;*/
}

.filterHead {

}

navbar-brand {
    color: #343a40;
}

table.projectTable {
    table-layout: fixed;
    width: 100%;
    border: 1px solid var(--color2);
    border-collapse: collapse;
}

.projectTable thead th {
    color: #ffffff;
    background-color: #000000; /*var(--color2);*/
    vertical-align: middle;
    position: sticky !important;
    top: 0 !important;
    z-index: 1 !important;
}

.projectTable tr th:nth-child(1) {
    width: 15%;
}

.projectTable tr th:nth-child(2) {
    width: 15%;
}

.projectTable tr th:nth-child(3) {
    width: 20%;
}

.projectTable tr th:nth-child(4) {
    width: 20%;
}

.projectTable tr th:nth-child(5) {
    width: 20%;
}

.projectTable tr th:nth-child(6) {
    width: 10%;
}

table.projectDashboard {
    table-layout: fixed;
    width: 100%;
    border: 1px solid var(--color2);
    border-collapse: collapse;
}

.projectDashboard tr th:nth-child(1) {
    width: 20%;
}
.projectDashboard tr th:nth-child(2) { width: 31%;}
.projectDashboard tr td th:nth-child(3) {
    width: 13%;
    align-content: center;
}
.projectDashboard tr td th:nth-child(4) {
    width: 13%;
    align-content: center;
}
.projectDashboard tr td th:nth-child(5) {
    width: 13%;
    align-content: center;
}

table.stickyHead thead th {
    color: #ffffff;
    background-color: #000000; /*var(--color2);*/
    vertical-align: middle;
    position: sticky !important;
    top: 0 !important;
    z-index: 1 !important;
}
table.peopleTable {
    max-width: 600px;
}
table.peopleTable tr th:nth-child(1) {
    width: 30%;
}

table.peopleTable tr th:nth-child(2) {
    width: 30%;
}

table.peopleTable tr th:nth-child(3) {
    width: 20%;
}

table.peopleTable tr th:nth-child(4) {
    width: 20%;
}

table.table2 {
    table-layout: fixed;
    width: 100%;
    border: 1px solid var(--color2);
    border-collapse: collapse;
    /* padding: 0px 0px 0px 0px; */
}

    table.table2 thead th {
        color: #ffffff;
        background-color: #000000; /*var(--color2);*/
        vertical-align: middle;
        position: sticky !important;
        top: 0 !important;
        z-index: 1 !important;
    }

    table.table2 tr th:nth-child(1) {
        width: 2%;
    }

    table.table2 tr th:nth-child(2) {
        width: 3%;
    }

    table.table2 tr th:nth-child(3) {
        width: 12%;
    }

    table.table2 tr th:nth-child(4) {
        width: 18%;
    }

    table.table2 tr th:nth-child(5) {
        width: 58%;
    }

    table.table2 tr th:nth-child(6) {
        width: 7%;
    }

table.table3 tr {
    table-layout: fixed;
    width: 100%;
    vertical-align: top;
    border: 1px dotted;
}

.table3 th {
    background-color: var(--color5);
}

table.table3 tr {
    height: 18px;
    vertical-align: top !important;
}

    table.table3 tr th:nth-child(1) {
        width: 2%;
    }

    table.table3 tr th:nth-child(2) {
        width: 98%;
    }