﻿html { height: 100%; font-family: 'Inter', sans-serif; line-height: 1.4; }
body { min-height: 100%; display: flex; flex-direction: column; background-color: #fafafa; margin: 0; margin-bottom: 100px; clear: both; }

a { text-decoration: none; font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif; font-size: 15px; font-weight: bold; color: #788d56; text-decoration: none; }
a:hover { text-decoration: underline; }

header { height: 100px; background-color: #fff; box-shadow: rgba(0, 0, 0, .05) 0 0 20px; }
main { flex: 1; }
/*footer { height: 100px; background-color: #fff; box-shadow: rgba(0, 0, 0, .05) 0 0 20px;}*/
.login-button { text-decoration: none; color: white; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; margin: 0; line-height: 19px; padding: 9px 10px; border: 0; border-radius: 3px; background-color: #788d56; text-decoration: none; color: #fff; font-weight: 500; display: block; box-sizing: border-box; font-size: 1rem; transition: background-color 0.2s ease-in-out; }
.login-button:hover { text-decoration: none; background-color: #57683c; }
#table-file { padding-right: 75px; }
td a { font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif; font-size: 15px; font-weight: bold; color: #788d56; text-decoration: none; }

td a:hover { color: #57683c; border-bottom-color: #57683c; }

.mobile-label { display: none; }

.logo-color:hover { filter: hue-rotate(347deg); }

footer { background-color: #6E8858; color: #fff; }
footer nav { padding: 20px; max-width: 1360px; margin: auto; display: flex; align-items: center; height: 100px; box-sizing: border-box; }
footer nav .spacing { flex: 1; }
footer a { color: #fff; }

header nav { padding: 20px; max-width: 1340px; margin: auto; display: flex; align-items: center; height: 100px; box-sizing: border-box; }
header nav .spacing { flex: 1; }
header nav img { height: 50px; }

article { max-width: 1300px; margin: 30px auto; box-sizing: border-box; background-color: #fff; padding: 20px; border-radius: 10px; box-shadow: rgba(0, 0, 0, .05) 0 0 20px; }
.table-container { max-width: 1300px; margin: auto; box-sizing: border-box; }
table { border-collapse: collapse; width: 100%; box-sizing: border-box; overflow: hidden; }
th { text-align: left; white-space: nowrap; color: #6E8858; }
th, td { padding: 10px; }
tr:nth-child(2n) { background-color: #fafafa; }
tr:nth-child(2n+1) { background-color: #eee; }

hr { border: 0; border: 1px solid #888; margin: 20px 0; }

a.button { border-radius: 5px; background-color: #788d56; color: #fff; padding: 10px 25px; text-decoration: none; font-size: 16px; }
a.button:hover { background-color: #57683c; }

#facility-head { max-width: 200px; }
select { width: 100%; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23a0aec0'%3e%3cpath d='M15.3 9.3a1 1 0 0 1 1.4 1.4l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 0 1 1.4-1.4l3.3 3.29 3.3-3.3z'/%3e%3c/svg%3e"); -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-print-color-adjust: exact; color-adjust: exact; background-repeat: no-repeat; background-color: #fff; border-color: rgb(209, 213, 219) !important; border-width: 1px; border-radius: .375rem !important; padding-top: .375rem !important; padding-right: 2.5rem !important; padding-bottom: 0.375rem !important; padding-left: .75rem !important; background-position: right .5rem center; background-size: 1.5em 1.5em; font-size: 14px; height: unset !important; display: block; margin-top: 4px; max-width: 100%; }
main { display: flex; flex-direction: column }

.facilitySelect .classSelect .typeSelect .fileTypeSelect { min-width: 100%; }

#docForm {  flex: 1 }

.quill-content p,
.quill-content ul,
.quill-content ol { margin: 0 }

.help-container { padding: 30px; max-width: 1300px; width: 100%; text-align: center; box-sizing: border-box; margin: 0 auto }

.help-container p { font-weight: 600; }

.warning-container { padding: 10px; text-align: center; }
.warning-container p {   }


@media only screen and (max-width : 667px) {
    tr { display: flex; flex-direction: column; }
    th { padding: 10px; width: unset !important; }
    th+th { padding-top: 0; }

    footer { flex-direction: column; }
    footer > p { text-align: center !important; margin-bottom: 20px; }
    .mobile-label { display: block; font-weight: 600; line-height: 1.6rem; color: #6E8858; }
    .mobile-hidden { display: none; }
    select { width: 100%; }

    .logged-in header { height: unset; }
    .logged-in header nav { height: unset; align-items: flex-start; }
    .logged-in header nav > div { display: flex; flex-direction: column; }
}
