* { box-sizing: border-box; -moz-box-sizing: border-box; font-family: 'Montserrat', sans-serif;}

body {font-size: 14px; margin: 0; padding:0; background:#f5f5f5;}


h1, h2, h3, h4 {font-family: 'Barlow Condensed', sans-serif; margin: 0 0 1em 0;}

p {line-height: 1.5em;}

.container {max-width: 1400px; width: 100%; margin: 0 auto;}

header, .report-header {background:#fff; border-bottom: 1px solid #ccc; padding: 15px;}
header h1 {margin:0; padding: 7px 0 7px 78px; position:relative; line-height: 1em; color:#fff; font-size: 20px; font-weight:700; text-transform:uppercase;}
header h1 img, .report-header h1 img {position:absolute; width: 60px; height: auto; left:0; top:0;}
header h1 span {font-size: 16px; display:block; margin-bottom:6px;} 

h2 {font-size: 2em; padding-bottom: 0;}

.login-header {background:#222; padding: 15px;}
.login-header h1 {margin:0; padding: 7px 0 7px 78px; position:relative; line-height: 1em; color:#fff; font-size: 20px; font-weight:700; text-transform:uppercase;}
.login-header h1 img {position:absolute; width: 60px; height: auto; left:0; top:0;}
.login-header h1 span {font-size: 16px; display:block; margin-bottom:6px;} 

.popular-pages-subtitles div {font-family: 'Barlow Condensed', sans-serif;}
.popular-page-container {border-bottom: 1px solid #ccc;}
#popular-pages-container {padding: 2%; border: 1px solid lightgray; background:#fff;}
#popular-pages .popular-page-container {padding: 7px; background:#f5f5f5;}
#popular-pages .popular-page-container:nth-child(even) {background:#e5e5e5;}
#application-window .form-item {
    margin-bottom: 25px;
}

#application-window .form-item > span{
    margin-bottom: 2px;
}

#submit-press-release-attachments > div {margin-bottom: 4px;}


main { padding: 30px 15px;}

hr {margin: 30px 0; padding:0; border: 0; height: 5px; background:#e5e5e5;}

.btn {background:#086b7d; display:inline-block; font-weight: 700; padding: 10px 15px; color:#fff; text-decoration:none;  border-radius: 3px;}
.btn:hover {background:#4557de;}

.reset-lnk {float: right;}

.clear-after {position:relative;}
.clear-after::after {clear:both; display:block; content:""; }

.width-70 {float:left; width: 60%;}
.width-70:last-child {float:right; width: 38%; background:#fff; border:1px solid #ccc; padding: 30px;}

.width-50 {float:left; width: 47.5%;}
.width-50:last-child {float:right;}
.width50 {float:left; width: 47.5%;}
.width50:last-child {float:right;}
.width25 { width: 21.25%; margin-right: 5%; float:left;}
.width25:last-child { margin-right: 0%;}


.width20 { width: 18%; margin-right: 2.5%; float:left;}
.width20:last-child { margin-right: 0%; float:right}


.float-left {float:left}
.float-right {float:right}

.relative {position:relative;}

.k-toolbar.k-editor-toolbar li:first-child {display:none;}

/* Dashboard Styles */

.width33 { width: 30%; float:left;}
.width33:nth-child(2) { margin: 0 5%;}

.dash-left { position:absolute; width: 28%; height: 100%;}
.dash-right { float:right; width: 70%;}

.dash-tile {border: 1px solid #ccc; padding: 30px 30px 30px 100px;margin-bottom: 15px; background:#fff; -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.05);    box-shadow: 0 0 30px 0 rgba(0,0,0,.05); border-radius: 3px; position: relative;}
.dash-tile img {position:absolute; left:30px; width: 50px; height: auto;}
.dash-tile h2 {text-transform:uppercase;}
.dash-tile .btn {margin-top: 15px;}

.dash-tile:last-child {margin-bottom:0;}

.dash-tile-submit {border: 1px solid #ccc; padding: 30px;margin-bottom: 0; background:#fff; height: 100%; -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.05);    box-shadow: 0 0 30px 0 rgba(0,0,0,.05);  border-radius: 3px;}
.dash-tile-submit h2 {text-transform:uppercase;}
.dash-tile-submit .btn {margin-top: 30px; width: 100%; text-align:center;}

.dash-submission-status span {background:#e5e5e5; border-radius: 3px; display:inline-block; padding: 5px; font-size: .8em;}
.dash-submission-status span::before {height: 7px; width: 7px; content:''; overflow: hidden; display:inline-block; margin-right: 7px; }
.dash-submission-status span.unsubmitted::before {background:#ff0000;}
.dash-submission-status span.submitted::before {background: rgb(4, 173, 46);}

.dash-numbers {text-align:center;}
.dash-numbers span {font-size: 50px; font-weight: 900; display:block; font-family: 'Oswald', sans-serif;}

/* Roster Pages */

.main-table {width: 100%; border-collapse: collapse;}
.main-table th {font-size: .8em; text-align:left; padding: 10px 0;}

.main-table tbody tr {background:#fff; }
.main-table tbody tr td {padding:5px; border-bottom: .5px solid #ccc;}

.filter-container {padding-bottom: 15px;}
.filter {}
.filter span {display:block; font-size: .8em; text-transform:uppercase; margin-bottom: 5px;}
.filter input {width: 100%;}

.login-bg {background: #f5f5f5;}

.login-container {max-width: 600px; margin: 50px auto;  background:#fff; padding: 30px; }

.login-content {display:none; margin-top: 30px;}
.login-content-01 { display: block; }

.form-item > textarea {padding: 10px; width:100%; height: 150px;}


.form-item { margin-bottom: 15px; }
    .form-item > span:not([class^="k-"]) {font-family: 'Barlow Condensed', sans-serif; display: block; font-size: 1em; color:#086b7d; text-transform:uppercase; font-weight: 600; margin-bottom: 8px; }

        .form-item > span.required:before { color:red; content:"*"; display:inline-block; padding-right: 5px;}

.agency .form-item {margin-bottom: 8px;}
.agency input {padding: 5px 10px;}
.agency .btn {padding: 5px 10px;}
.agency {border-bottom: 2px solid rgb(209, 218, 219); margin-bottom: 8px;}

input[type=text], input[type=password], input[type=date], input[type=number], input[type=email], input[type=tel], select, textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; font-family: 'Montserrat', sans-serif; font-size: 1em;}

.logo-container {}
.logo { margin: 0; font-size: 20px; font-weight: 400; padding: 0; width: 200px; height: 55px; background: url(../images/logo.png) no-repeat; background-position: left center; background-size: auto 40px;  line-height: 1em;}
    .logo span { display: block; font-size: 12px; }

.invalid {
    border: 0.2rem solid red !important;
}
.tabs { border-bottom: 1px solid rgba(0,0,0,.1); margin-bottom: 30px;}
.tabs a { display: inline-block; text-decoration:none; padding: 10px 10px 20px; font-weight: 400;}
    .tabs a.active { border-bottom: 5px solid #277ad4; font-weight: 700; color:#000;}

.tab-container { display:none;}

#header-links {padding-top: 10px;}
#header-links a {font-weight: bold; font-size: 1.5em; color: #086b7d; text-decoration: none; padding-left: 20px; font-family: 'Barlow Condensed', sans-serif; text-transform:uppercase;}

.k-widget,.k-widget * {box-sizing: border-box!important;}

.k-widget.k-datepicker {width: 100%}

.k-widget.k-window {max-height: 100%;}
input.k-input[data-role=datepicker] {padding: 8px}

.stretch {width: 100%; text-align:center;}

.page-title {background:#086b7d; color:#fff; padding: 30px 0;}
.page-title h1 {max-width: 1400px; margin: 0 auto; font-size: 3em; text-transform:uppercase; font-weight: 600; padding: 0 15px;}

.save-container {background:#e5e5e5; padding: 30px; border: 1px solid #ccc;}

#graph-data-container {background:#f5f5f5; padding: 30px; border: 1px solid #ccc; max-height: 800px; overflow-y: auto;}

#graph-data th {text-align: left;}
#graph-data tbody tr {cursor:move}

.web-integration-container {display:none; position:absolute; top: 100%; right:0; padding: 30px; width: 500px; background:#fff; z-index:99;}
.web-integration-lnk {display:inline; background:#086b7d; text-decoration: none; color:#fff; padding: 5px 10px; border-radius: 3px;}

.tag.selected {color:green}
.tag.unselected {color:black}
.running {background-color: rgb(37, 155, 37);height: 100%;}
.not-running{background-color: lightgray; height:100%;}
.running>span:hover{background-color: green;}
#gant table {border-spacing: 0;border-collapse: separate;table-layout: fixed;white-space: nowrap; width:100%; border-bottom: 1px solid black;}
#gant tbody {border-bottom:1px solid black}
#gant tbody td {height: 30px;}

#gant tbody tr td:first-child, #gant tbody tr td:nth-child(2),#gant thead tr th:first-child, #gant thead tr th:nth-child(2) {
    width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: -webkit-sticky;
    position: sticky;
    background-color: #f5f5f5;
    z-index:5;
    border: 1px solid black;
}

#gant tbody tr td:first-child, #gant thead tr th:first-child {
    left: 0;
}
#gant tbody tr td:nth-child(2),#gant thead tr th:nth-child(2) {
    left: 200px;
}

#gant tbody td span {height:100%; display:inline-block;}
#gant tbody td.month {width:150px;padding:7px 0 2px 0;}
#gant tbody td:not(.month) {border: 1px solid black}
#gant tbody tr td.month {border-right:1px solid black;border-left:1px solid black;}
#gant thead .month-header {width:150px;}
#gant table thead th {
    padding: 3px;
    background-color: #ececec;
    border:1px solid black;
  }

#gant{position:relative; overflow: auto; white-space: nowrap;}

.k-grid td[role=gridcell] .btn {padding: 4px 12px;}

.key-takeaway {
    border: 1px solid black;
    padding:2em;
    margin-bottom: 2em;
    padding-bottom: 0;
}

.meeting {padding: 1em 2em; background-color: white; border-radius: 8px; margin-bottom: 2em;}

.hint {}

.graph-section {
    padding: 2%;
    border: 1px solid lightgray;
    background: #fff;
    margin-bottom: 2em;
}

#graph-data th, #graph-data td, .graph-data-clone th, .graph-data-clone td {padding: 0.2em 1em;}
@media only screen and (max-width: 1024px) {
    body.login-bg {background:#fff;}
}


.k-animation-container {z-index: 999999999!important}


.resource-title {
    font-weight: bold; font-size: 1.3em;
    margin-bottom: 1em;
}

.resource {
    background: white;
    border-radius: 8px;
    padding:2em;
    margin-bottom: 2em;
}
.resource-category,.resource-date {font-size: 0.9em;font-style: italic;}
.resource-category {margin-bottom: 1em;}

#resources {margin-top:3em;}
/* Applicant Management */

.dash-col {background:#fff; padding: 20px; border-radius: 3px; -moz-border-radius: 3px;     -webkit-box-shadow: 0 0 100px 0 rgb(0 0 0 / 10%);    box-shadow: 0 0 100px 0 rgb(0 0 0 / 10%);}
.dash-col * {font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase;}
.dash-col span {display:block; position:relative; text-transform: uppercase; padding-bottom: 10px; margin-bottom: 10px; border-bottom:1px solid rgba(0, 0, 0, 0.217);}
.dash-col span::after {position:absolute; right:0; content:" "; width: 15px; height: 15px;  border-radius: 50px; -moz-border-radius: 50px;}
.dash-col.approved span:after {background:rgb(4, 173, 46);}
.dash-col.pending span:after {background: rgba(255, 255, 255,.3)}
.dash-col.denied span:after {background: #ff0000;}
.dash-col div {font-size: 45px;}

.dash-col {margin-right: 2%; width: 23.5%}
.dash-col.approved {background:#086b7d; color:#fff;}
.dash-col.pending {background: rgb(221, 134, 3);  color:#fff;}


.selected-applicant {background:#fff; padding: 20px 20px 40px 20px; margin-bottom: 30px; border: 1px solid #ccc; -webkit-box-shadow: 0 0 100px 0 rgb(0 0 0 / 10%);    box-shadow: 0 0 100px 0 rgb(0 0 0 / 10%);}

.applicant-info {background:#f2f2f2; border: 1px solid #ccc; margin-bottom: 30px;}
.applicant-col {padding: 20px; border-radius: 3px; -moz-border-radius: 3px;}
.applicant-col * {font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase;}
.applicant-col div {font-size: 20px;}

.selected-applicant .main-table tr:hover td {background:rgba(34, 34, 34, 0.021);}
.selected-applicant .main-table tr:last-child td {border-bottom: 0;}

.selected-applicant .main-table tr.pending td {background: rgba(221, 134, 3, 0.20) !important;}
.selected-applicant .main-table tr.stop td {background: rgba(255, 0, 0, 0.16)}

.selected-applicant .main-table td {padding: 10px;}

/* Enironment Dashboard Styles */

.map-icon-critical{background:#ff00009a;border:1px solid #666; border-radius: 50%}
.map-icon-serious{background:#ff80009a;border:1px solid #666; border-radius: 50%}
.map-icon-good{background:#00db309a;border:1px solid #666; border-radius: 50%}
.map-icon-not-tested{background:#94949457;border:1px solid #666; border-radius: 50%}

#map-filters {background:#f5f5f5; padding: 10px; border-bottom: 1px solid #ccc;}
#map-filters::after {clear:both; content:''; display: block;}
.map-filter {float:left; width: 200px; margin-right: 10px;}

.popup-title {font-size: 1.5em; font-weight: 700; margin-bottom: 10px; text-transform: capitalize;}
.leaflet-popup-content {width: 300px;}
.popup-status-critical {color:red; background:red; padding: 7px 15px; display:inline-block; color:#fff; border-radius: 4px; font-style:italic; font-weight: bold; margin-bottom: 15px;}

.map-popup fieldset {border: 1px solid #ccc; margin-bottom: 30px;}
.map-popup fieldset legend {font-weight: 700;}
.map-popup fieldset table {width: 100%; border-collapse: collapse;}
.map-popup fieldset table td:last-child {text-align:right;}

.map-popup fieldset table tr:nth-child(odd) td {background:#0000000c}
.map-popup fieldset table .detected {color:red;}

.btn.view-school-profile {width:100%; background:#fff; border: 3px solid #151b3c; text-align:center; color:#151b3c;}

.comment-header {font-style: italic; font-size: 0.8em;}
.comment {border-bottom: 1px solid black; margin-bottom: 2em;}

/*Report Styles */
.report-section {background:#fff; border: 1px solid #ccc; margin-bottom: 50px;}
.report-section h2 {margin: 0; padding: 30px; color:#086b7d; font-size: 18px; border-bottom: 1px solid #ccc; text-transform: uppercase;}
.report-section .stat-container {padding: 30px;}
.report-section .stat-container .tag-stat, .report-section .stat-container .agency-stat {margin-bottom: 7px;}

.report-section .stat-container .press-release {border-bottom: 1px solid #ccc; padding: 0 0 20px 0; margin-bottom: 20px;}
.report-section .stat-container .press-release:last-child {border-bottom: 0;}
.report-section .stat-container .press-release .press-release-title {font-weight: bold; padding-bottom: 7px;}
.report-section .stat-container .press-release .press-release-info {font-style:italic; margin-bottom: 10px}
.report-section .stat-container .press-release .agency {border-bottom: 0;}
.report-section .stat-container .press-release .press-release-tags {display:inline-block; background:#086b7d; font-size: .8em; color:#fff; padding: 5px; border-radius: 3px;}

#listening-grid table {table-layout: fixed;}
#listening-grid td {white-space: nowrap; text-overflow: ellipsis;}

.btn.open-listening {opacity: 0.7;}
.btn.open-listening.requested {opacity: 1;}