/*overall page structure*/
html, body {
	height: 100%;
}

body {
	overflow: auto;
}

#wrapper {
	width: 100%;
	min-height: 100%;
	overflow: hidden;
	position: relative;
}

#main {
	padding: 96px 15px 0;
}
/*content area - within which gms and sms will have different styling */
#content {
	float: right;
	padding: 16px 15px 40px 27px;
}


/* navbar/ header */

.navbar {
	width: 100%;
	position: fixed;
	z-index: 5;
	height: 96px;
}

	.navbar .container {
		position: relative;
	}

	.navbar .logo {
		margin: 0;
		display: inline-block;
	}

	.navbar .logo2 {
		float: left;
	}

	.navbar div.navheader {
		background-color: none;
		float: none;
		color: #fff;
		overflow: hidden;
		padding: 8px 0 0 30px;
	}

	.navbar div.header1 {
		font-size: 18px;
		white-space: nowrap;
		overflow-x: hidden;
	}

		.navbar div.header1::after {
			content: "\00a0";
		}


		.navbar div.header2 {
			font-size: 25px;
			font-weight: bold;
			white-space: nowrap;
			overflow-x: hidden;
		}

	.navbar .slogan {
		color: #fff;
		font-size: 12px;
		line-height: 1.6;
		margin: 0 0 4px;
		letter-spacing: 2px;
		padding: 7px 0 5px 28px;
		border-left: 1px solid #74a1ca;
		text-transform: uppercase;
		display: inline-block;
		vertical-align: bottom;
		max-width: 346px;
		height: 50px;
		overflow: hidden;
	}

	.navbar .slogan2 {
		color: #fff;
		display: block;
		font-size: 18px;
		margin: 11px 0 -3px;
	}

	.navbar .logout {
		color: var(--primary-bg);
		position: absolute;
		background: #fff;
		border-color: #fff;
		font-weight: 900;
		letter-spacing: 1px;
		text-transform: uppercase;
		border-radius: 0 0 5px 5px;
		right: 25px;
		top: -13px;
		padding: 4px 15px 2px;		
	}

.logout {
	text-decoration: none;
}

/*left menu / sidebar*/
.panel-group {
	padding-top: 12px;
}

#sidebar {
	padding: 0 0 0 15px;
	position: relative;
	background: #f6f6f6;
	position: fixed;
	max-width: 256px;
	top: 96px; /*suparna update 11_15_17*/
	bottom: 0;
}

.jcf-scrollable {
	overflow: hidden;
	width: 100%;
	height: 100%;
}

.jcf-scrollable-wrapper {
	overflow: hidden;
	width: 100%;
	height: 100%;
}

#sidebar:before {
	background: #f6f6f6;
	position: absolute;
	height: 100%;
	width: 1px;
	top: 0;
	right: 0;
	content: "";
	padding: 0 0 0 9999px;
	margin: 0 0 0 -9999px;
	-webkit-box-shadow: inset 0px -18px 16px 10px rgba(28,67,121,0.06);
	-moz-box-shadow: inset 0px -18px 16px 10px rgba(28,67,121,0.06);
	box-shadow: inset 0px -18px 16px 10px rgba(28,67,121,0.06);
}

.translated-ltr > body > .skiptranslate + #wrapper > .container > .row > #sidebar {
	top: 135px;
}

.burger-sublink {
	font-size: 9px;
	padding: 0px 3px;
}
.btn-group-burger .dropdown-menu > li.locked > a {
	color: var(--disabled-text);
}
.panel-group .panel {
	font-size: 15px;
	font-weight: 700;
	padding: 0px;
	color: var(--strong-text);
}


	.panel-group .panel span {
		padding:11px 0px 12px 12px;
		display:inline-block;
	}
	.panel-group .panel div.panel-collapse {
		margin: -13px 0px 0px 13px;
		padding-bottom: 13px;

	}
	.panel-group .panel div.panel-collapse span {
		padding: 0px;
	}
.panel-group .locked {
	color: var(--disabled-text);
}

.panel-group .panel > a {
	position: relative;
	display: block;
	color: inherit;
	z-index: 2;
	padding: 0 25px 0 31px;
}

.panel-group .panel.active {
	background: #fff;
	position: relative;
}

.panel-group .panel:hover:not(.locked) {
	background: #fff url(../images/bg-sidebar.gif) repeat-y 100% 0;
}

.panel-group .panel:hover > a {
	text-decoration: none;
}

.panel-group .panel a:focus {
	color: var(--active-text);
	text-decoration: underline;
}

.panel-group .panel > a:focus {
	text-decoration: none;
}

.panel-group .panel.active > a {
	color: var(--active-text);
}

	.panel-group .panel.active > a span {
		text-decoration: underline;
	}

.panel-group .panel.active.has-drop > a {
	color: inherit;
}

	.panel-group .panel.active.has-drop > a span {
		text-decoration: none;
	}

.panel-group .panel > a:before {
	font-family: 'icomoon' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	font-size: 14px;
	position: absolute;
	left: 0;
	top: 2px;
	text-decoration: none;
}

.panel-group .panel > a.program-dashboard:before {
	content: "\e90f";
	top: 15px;
	left: 10px;
}

.panel-group .panel > a.agency:before {
	content: "\e90e";
	font-size: 16px;
	top: 11px;
	left: 12px;
}

.panel-group .panel > a.workplan:before {
	content: "\e90d";
	font-size: 20px;
	top: 11px;
	left: 14px;
}

.panel-group .panel > a.invoices:before {
	content: "\e90c";
	font-size: 18px;
	top: 12px;
	left: 14px;
}

.panel-group .panel > a.participants-n-staff:before {
	content: "\e90b";
	font-size: 18px;
	top: 11px;
	left: 11px;
}

.panel-group .panel > a.activities:before {
	content: "\e90a";
	font-size: 18px;
	top: 11px;
	left: 11px;
}

.panel-group .panel > a.search:before {
	content: "\e900";
	font-size: 15px;
	top: 13px;
	left: 12px;
}

.panel-group .panel > a.ta-activities:before {
	content: "\e909";
	font-size: 17px;
	top: 12px;
	left: 12px;
}

.panel-group .panel > a.ypqa:before {
	content: "\e908";
	font-size: 16px;
	top: 14px;
	left: 11px;
}

.panel-group .panel > a.reports:before {
	content: "\e907";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.resources:before {
	content: "\e906";
	font-size: 14px;
	top: 15px;
	left: 13px;
}

.panel-group .panel > a.user-accounts:before {
	content: "\e905";
	font-size: 17px;
	top: 12px;
	left: 13px;
}

.panel-group .panel > a.admin-list:before {
	content: "\e911";
	font-size: 19px;
	top: 12px;
	left: 17px;
}

.panel-group .panel > a.incomplete:before {
	content: "\e921";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.ready-to-submit:before {
	content: "\e922";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.submitted-copy-3:before {
	content: "\e923";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.proposal-application:before {
	content: "\e924";
	font-size: 17px;
	top: 14px;
	left: 12px;
}

.panel-group .panel > a.proposal-list:before {
	content: "\e925";
	font-size: 15px;
	top: 13px;
	left: 12px;
}

.panel-group .panel > a.uploads:before {
	content: "\e914";
	font-size: 16px;
	top: 13px;
	left: 15px;
}

.panel-group .panel > a.edit-02:before {
	content: "\e926";
	font-size: 18px;
	top: 12.25px;
	left: 12px;
}

.panel-group .panel > a.megaphone:before {
	content: "\e927";
	font-size: 18px;
	top: 12.25px;
	left: 12px;
}

.panel-group .panel > a.clock:before {
	content: "\e928";
	font-size: 18px;
	top: 12.25px;
	left: 12px;
}

.panel-group .panel > a.facilities:before {
	content: "\e929";
	font-size: 20px;
	top: 10px;
	left: 13px;
}

.panel-group .panel > a.partners:before {
	content: "\e92a";
	font-size: 14.5px;
	top: 15px;
	left: 9px;
}

.panel-group .panel > a.lock:before {
	content: "\e92b";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.up-arrow:before {
	content: "\e92c";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.down-arrow1:before {
	content: "\e92d";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.solid-check:before {
	content: "\e930";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.stack:before {
	content: "\e92e";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.warning1:before {
	content: "\e92f";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.award-solid:before {
	content: "\e935";
	font-size: 21px;
	top: 12px;
	left: 13px;
}

.panel-group .panel > a.Organization_icon:before {
	content: "\e936";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.lifebuoy:before {
	content: "\e941";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.barcode:before {
	content: "\e937";
	font-size: 19px;
	top: 13px;
	left: 12px;
}

.panel-group .panel > a.phone:before {
	content: "\e942";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.address-book:before {
	content: "\e944";
	font-size: 17px;
	top: 13px;
	left: 12px;
}

.panel-group .panel > a.location:before {
	content: "\e947";
	font-size: 22px;
	top: 10px;
	left: 10px;
}

.panel-group .panel > a.compass2:before {
	content: "\e94a";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.bell:before {
	content: "\e951";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.download:before {
	content: "\e960";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.upload:before {
	content: "\e961";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.bubbles4:before {
	content: "\e970";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.pie-chart:before {
	content: "\e99a";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.stats-dots:before {
	content: "\e99b";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.stats-bars2:before {
	content: "\e99d";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.meter:before {
	content: "\e9a6";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.sphere:before {
	content: "\e9c9";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.warning:before {
	content: "\ea07";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.notification:before {
	content: "\ea08";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.eye:before {
	content: "\e9ce";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.eye-blocked:before {
	content: "\e9d1";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.cancel-circle:before {
	content: "\ea0d";
	font-size: 17px;
	top: 13px;
	left: 13px;
}

.panel-group .panel > a.blocked:before {
	content: "\ea0e";
	font-size: 17px;
	top: 13px;
	left: 13px;
}


.panel-group .panel > a.arrow-left:before {
	content: "\e915";
	font-size: 17px;
	top: 13px;
	left: 17px;
}

.panel-group .panel > a.utilities:before {
	content: "\e91f";
	font-size: 19px;
	top: 11px;
	left: 12px;
}

.panel-group .panel > a.calendar:before {
	content: "\e916";
	font-size: 19px;
	top: 11px;
	left: 12px;
}


.panel-group .panel ul {
	margin: 0;
	padding: 11px 0 0 18px;
	list-style: none;
	font-size: 14px;
}

	.panel-group .panel ul li {
		padding: 0 0 12px;
	}

		.panel-group .panel ul li:last-child {
			padding: 0;
		}

	.panel-group .panel ul a {
		position: relative;
		color: inherit;
		padding: 0 0 0 13px;
		display: block;
	}

		.panel-group .panel ul a:hover {
			color: var(--active-text);
			text-decoration: none;
		}

			.panel-group .panel ul a:hover span {
				text-decoration: underline;
			}

		.panel-group .panel ul a:before {
			font-family: 'icomoon' !important;
			speak: none;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			text-transform: none;
			line-height: 1;
			font-size: 9px;
			content: "\e903";
			position: absolute;
			left: 0;
			top: 6px;
		}

	.panel-group .panel ul .active a,
	.panel-group .panel ul .active a:before {
		color: var(--active-text);
	}

		.panel-group .panel ul .active a span {
			text-decoration: underline;
		}

.panel-group .panel.has-drop {
	position: relative;
}

	.panel-group .panel.has-drop:after {
		top: 19px;
		right: 14px;
		content: " ";
		position: absolute;
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-top: 9px solid #9b9b9b;
	}

	.panel-group .panel.has-drop.active,
	.panel-group .panel.active {
		background: #fff url(../images/bg-sidebar.gif) repeat-y 100% 0;
	}

		.panel-group .panel.has-drop.active:after {
			top: 14px;
			border-top: 0;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
			border-bottom: 9px solid #9b9b9b;
		}

.panel-spacer {
	padding: 0px;
	margin: 0px;
}

	.panel-spacer > hr.spacer {
		margin: 5px 13px;
		border-top: 1px solid var(--medium-grey-2);
	}

.globalfootnote {
	font-size: 85%;
	margin-top: 30px;
	border-top: 1px solid #dfe1df;
}


@media only screen and (max-width: 767px) {
	.navbar {
		position: static;
		height: auto;
		padding: 13px 0 0px;
	}

	div.navbar {
		min-height: unset;
		padding-top: 0px;
	}
	.navbar div.navheader {
		background-color: none;
		float: none;
		color: #fff;
		overflow: hidden;
		padding: 4px 10px 0 10px;
	}

	.navbar div.header1 {
		font-size: 15px;
		white-space: unset;
		overflow-x: unset;
	}

		.navbar div.header1::after {
			content: "";
		}

	.navbar div.header2 {
		font-size: 18px;
		font-weight: bold;
		white-space: unset;
		overflow-x: unset;
	}

}