* {box-sizing: border-box; -moz-box-sizing: border-box; font-family: 'Varela Round', sans-serif;
}

body {margin: 0; padding:0; font-size: 14px; background:#f5f5f5; color:rgb(85, 81, 103);}

h1 {margin:0; padding-bottom: 10px;}

h1 {font-weight: 400;}
h1 span {display:block; font-size: 14px;}

h2 {font-weight: 900; margin-bottom: 40px;}

p {line-height: 1.6em;}

hr {border:0; margin: 20px 0; height: 10px; background:#f2f2f2;}

/* Layout Elements */

.container {max-width: 1400px; margin: 0 auto; width: 96%;}

.relative {position:relative;}

.float-left {float:left;}
.float-right {float:right;}
.margin-top {margin-top:30px;}
.margin-right {margin-right:30px;}
.margin-bottom {margin-bottom:30px;}

.clear-both::after {clear:both; display: block; content:"";}

.stretch {width: 100%;}
.txt-right {text-align:right;}

.width-50 {float:left; width: 48.5%;}
.width-50:last-child {float:right;}

.width-60 {float:left; width: 59%;}
.width-40 {float:right; width: 39%}

.width-70 {float:left; width: 69%;}
.width-30 {float:right; width: 29%}

.width33 {float:left; width: 30%; margin-right: 5%;}
.width33:last-child {margin-right:0;}

.width20 {float:left; width: 18%; margin-right: 2%;}
.width20:last-child {margin-right:0;}

.width-25 {float:left; width: 23.5%; margin-right: 2%;}
.width-25:last-child {margin-right:0;}

fieldset {padding: 57px 0 0; position: relative; border: 0 solid #ccc; margin-bottom: 30px;}
legend {background:#6237f0; color:#fff; padding: 5px 10px; margin: 0; position: absolute; top:0; left:0; text-transform: uppercase; font-size: 1.5em;}
fieldset .grid tbody td {padding: 10px 0;}


/* Form Elements */

.form-container {max-width: 900px;}
.form-title {font-size: 1.15em; font-weight: 700; margin-bottom: 15px;}
.form-item {margin-bottom: 15px;}
.form-item label {display:block; margin-bottom: 7px;}
select, textarea, input, input[type="date"] {display:block; padding: 10px; width: 100%; border: 1px solid #ccc}
input[type="checkbox"] {display:inline-block; width: auto;}
input.txt-funding {text-align:right;}

.form-item textarea {height: 75px;}

.btn {background:#6237f0; display:inline-block; padding: 10px 15px; color:#fff; text-decoration:none; border-radius: 3px; -moz-border-radius: 3px; text-align:center;}
.btn-cancel {color:#999;}

.rounded {-webkit-box-shadow: 0 0 50px 0 rgb(0 0 0 / 3%);    box-shadow: 0 0 50px 0 rgb(0 0 0 / 3%); border-radius: 5px;    -moz-border-radius: 5px; overflow: hidden;}




/* Header Elements */


header {background:#151a36; color:#fff; border-bottom: 1px solid #e5e5e5; position:relative; z-index:1; padding: 10px;}
header::after {clear:both; display: block; content:"";}
.logo {float:left; background: url(../images/logo.png) no-repeat; background-size: auto 100%; padding: 10px 10px 10px 50px;  font-size: 16px; text-transform: uppercase;}

nav.main-nav { background:#fff; -webkit-box-shadow: 0 0 50px 0 rgb(0 0 0 / 10%);    box-shadow: 0 0 50px 0 rgb(0 0 0 / 10%); margin-bottom: 30px;}
nav.main-nav ul {list-style: none; padding:0; margin:0;}
nav.main-nav ul li {float:left; width: 25%;}
nav.main-nav ul li a {padding: 27px 15px; text-decoration: none; display:block; font-weight: 700; color:#555; text-align:center; border-bottom: 5px solid rgba(0,0,0,.1);}
nav.main-nav ul li a:hover {border-bottom: 5px solid #6237f0; background:rgba(0,0,0,.025)}

nav.main-nav ul li a.active {color:#6237f0; border-bottom: 5px solid #6237f0; background:#fff;}

input:disabled {background:#e5e5e5; border: 1px solid #ccc;}

.small-number {width: 125px;}


/* Content Elements */

.content-container {background:#fff; margin: 30px 0; border-radius: 3px; -moz-border-radius: 3px; border: 1px solid #ccc;}
.content-filters {padding: 20px; background:#6237f013}
.filter-item {float:left; margin-right: 20px; width: 200px;}
.filter-item label {display:block; padding-bottom: 5px;}
.filter-item:last-child {margin-right: 0;}
.content-filters input, .content-filters select {padding: 5px; width: 100%;}

.content-title {font-size: 24px; padding: 20px; border-bottom: 1px solid #ccc; position:relative;} 
.title-status {position:absolute; right: 30px; font-size: 12px; text-transform:uppercase; color:#fff; padding: 10px 20px; border-radius: 5px;}
.status-behind {background:red; }
.status-good {background:green; }

.content-padding {padding:30px;}



.grid {width: 100%; border-collapse: collapse;}
.grid th {text-align:left; font-size: .8em; border-bottom: 1px solid #ccc; padding: 7px 10px; text-transform: uppercase;}
.grid th.txt-right {text-align:right;}
.grid th span {display:block; font-style:italic; font-size:.8em; margin-top: 5px;}

.grid tbody td {padding: 10px;  border-bottom: 1px solid #ccc;}
.grid tbody tr:last-child td {border-bottom: 0;}
.grid tbody td a {color:#6237f0;}
.grid tbody td a.btn {color:#fff;}
.grid tbody tr:hover {background:#6237f006}



.grid tbody td.highlight {background:#6237f006}

.grid tfoot td {background:#833bf0; padding: 10px; text-align:right; color:#fff;}

/* Dashboard Elements */

.top-number {text-transform: uppercase; font-size: .8em;}
.top-number span {display:block; font-size: 24px; margin-top: 10px;}

.grant-sub-header {text-transform: uppercase; font-size: .8em;}
.grant-sub-header span {display:block; font-size: 18px;}


.grant-meta-data {border-bottom: 1px solid #ccc; padding-bottom: 30px;}

/*Layout*/
.page-title {font-size: 30px; margin-bottom: 30px;}
.sub-title {font-size: 20px; padding: 0 0 20px;} 
.sub-sub-title {font-size: 18px; padding: 0 0 20px; font-weight: 900;} 

.left-col {position: absolute; top: 83px; bottom: 0; left: 0; width: 400px; padding: 50px 0 50px 20px; border-right: 1px solid #ccc;}    
.left-menu {list-style: none; padding:0; margin:0;}
.left-menu .menu-title {font-weight: 900; text-transform: uppercase; padding-bottom: 10px; font-size: .8em; }
.left-menu a {display:block; padding: 10px 0; text-decoration:none; color:rgb(40, 34, 53)}
.left-menu a.active {color:#1a79c7; font-weight: 900; border-right: 5px solid #1a79c7;}

.left-menu a.pending::before {content:"4"; display: inline-block; background: red; color:#fff; padding: 3px 8px; margin-right: 10px; border-radius: 20px;}

.right-col {position: absolute; top: 83px; right: 0; bottom: 0; left: 400px; background:#fff; padding: 20px; overflow: auto;}

.map-col {position: absolute; top: 83px; right: 0; bottom: 0; left: 0; background:url(../images/map.jpg); background-size: cover; padding: 20px; overflow: auto;}

.dash-graphs {max-width: 1400px;}
.dash-container {border: 1px solid #e5e5e5; border-radius: 7px; -webkit-box-shadow: 0 0 50px 0 rgba(0,0,0,.03);  box-shadow: 0 0 50px 0 rgba(0,0,0,.03); padding: 20px; min-height: 150px;}
.dash-container img {width: 100%; height: auto;}


.tab-lnk-container {margin: 30px 0 0;}
.tabs {margin: 0; list-style:none; padding:0;}
.tabs li {float:left;}
.tabs li a {padding: 10px; text-decoration: none; display:block;}

.tab-lnk-active {border-bottom: 5px solid #6237f0; }


.tab-container {}
.tab-content {display:none;}
.tab-content-1 {display:block;}

/*Map*/
.map-filters {position:absolute; margin:-10px 0 0 400px; background:#fff; padding: 0; min-width: 900px;}
.map-filters .form-item {margin:0;}
.map-filters .form-item label {font-weight: 900; text-transform: uppercase; font-size:.8em;}


/*Modal*/
.modal {background: rgba(0, 0, 0, 0.6); position:fixed; top:0; left:0; right:0; bottom:0; overflow: auto; padding: 30px; z-index: 9; display:none; }
.modal-container {background:#fff; padding: 30px; max-width: 700px; margin: 0 auto; border-radius: 5px; -moz-border-radius: 5px;}

.modal-container-project { padding: 30px; max-width: 1400px; margin: 0 auto; border-radius: 5px; -moz-border-radius: 5px; background:rgb(244, 242, 242);}
.modal-container-project .grant-meta-data {}
.modal-container-project .page-title {}

.qtr-report-title {color:#009688; font-weight: 700; display:block;}




.table-scroll {
	position:relative;
	max-width:1400px;
	margin:auto;
	overflow:hidden;
	border:0;
}
.table-wrap {
	width:100%;
	overflow:auto;
}
.table-scroll table {
	width:100%;
	margin:auto;
	border-collapse:separate;
	border-spacing:0;
}
.table-scroll th, .table-scroll td {
	padding:7px 10px;
	border:1px solid #ccc;
	background:#fff;
	white-space:nowrap;
	vertical-align:top;
    min-width: 150px;
    
}

.table-scroll thead th {text-transform: uppercase;
    font-size: .8em; text-align:left;}


.table-scroll td {text-align:right;}
.table-scroll thead, .table-scroll tfoot {
	
}

.clone {
	position:absolute;
	top:0;
	left:0;
	pointer-events:none;
}
.clone th, .clone td {
	visibility:hidden
}
.clone td, .clone th {
	border-color:transparent
}
.clone tbody th {
	visibility:visible;
    text-align:left;	    
}
.clone .fixed-side {
	border:1px solid rgba(0, 0, 0, 0.119);
	background:#fff;
	visibility:visible;    
}
.clone thead, .clone tfoot{background:transparent;}

.table-scroll tfoot td {
    background:#6237f0 !important; color:#fff;
}

.no-report {background:#e5e5e5 !important; border-bottom: 1px solid #fff !Important;}
.current-report {background: rgba(0, 128, 0, 0.274) !important; border-bottom: 1px solid #fff !Important;}
.missing-report {background: rgba(255, 0, 0, 0.263) !important; border-bottom: 1px solid #fff !Important;}