:root {--blue: #0B486D;	--darkblue: #02324f; --darkerblue: #06273C;	--lightblue: #1B6B9C; --lighterblue: #9BBBCE; --highlightblue: #DFF2FF;	--red: #990000;	--darkred: #7b0000;	--lightred: #ce0000; --highlight: #fff3b3; --green: #017500; --darkgreen: #005300;}

body
{
	font-family: Helvetica, Arial, "sans-serif";
	font-size: 14px;
	color: #111;
	background-color: #fff;
	line-height: 1.3;
	margin: 0;
	padding: 0;
}

a { text-decoration: none; }

#siteWrapper, #MAINFORM { display: contents; }

@media screen and (min-width:1100px) {

body
{
	display: flex;
	flex-direction: column;
	height: 100vh;
	width: 100vw;
	overflow: hidden;
}

#MAINFORM header:first-of-type 
{ 
	flex: 0 0 auto;
	background-color: var(--blue); 
}

	#MAINFORM header:first-of-type div.site-header-container
	{
		display: contents;
	}
	
		#MAINFORM div.mobile-fixed-container { display: none; }
		
		#sitemasthead,
		#sitemasthead > div:first-of-type { display: contents; }
			
			h1#logo-heading
			{
				display: block;
				flex: 0 0 auto;
				margin: 5px 0;
				font-size: inherit;
				line-height: 1;
				min-height: 58px;
				position: relative;
				z-index: 99;
			}
			
				a.site-logo-link { display: inline-block; }
				
					img.site-logo 
					{ 
						display: block;
						max-width: initial; 
					}
								
			#welcomeBackBar 
			{ 
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
			}
			
				#siteNavBar_welcomeBackBarLoggedIn_loginToggle 
				{
					display: block;
					font-size: inherit;
					background-color: transparent;
					right: 50px;
				}
				
					#siteNavBar_welcomeBackBarLoggedIn_loginToggle span.user-image 
					{ 
						top: 0;
						border-radius: 50%;
						border: 1px solid #eee;
						display: block;
						width: 50px;
						height: 50px;
					}
				
				#user-login-section 
				{
					width: auto;
					top: 50px;
					display: flex;
					right: 20px;
				}
				
				#siteNavBar_searchBox_SearchButton 
				{ 
					right: 120px;
					top: 13px; 
					z-index: 99;
					background-color: transparent;
					color: #fff;
				}

				#searchAutoCompleteResults { display: contents; }

				#siteNavBar_searchBox_searchPanel 
				{
					display: block;
					position: absolute;
					width: 100%;
				}

					#siteNavBar_searchBox_divSideBarContainer 
					{ 
						display: block;
						margin-top: 0;
					}

						#search-section { }
						
			#top-nav-bar 
			{ 
				flex: 1 1 auto;
				float: none; 
			}
			
				#hamburger-menu-section {}
				
					ul#main-nav 
					{
						display: flex;
						align-items: center;
					}
										
						ul#main-nav li.tabs 
						{ 
							flex: 0 0 auto; 
							float: none; 
							margin: 0;
							display: inline-block;	
							height: inherit;
							white-space: nowrap;
							position: relative;
						}

							#main-nav li > a 
							{ 
								padding: 8px 10px;
								max-height: inherit;
								color:#fff;
								font-size: 18px;
								border-left:1px solid transparent;
								border-right:1px solid transparent;
								border-bottom:1px solid transparent;
							}

							#main-nav li > a:hover 
							{
								border-left:1px solid #0B486D;			
								border-right:1px solid #0B486D;
								border-bottom:1px solid #0B486D;
								background-color: #eee;
								color:#0B486D;
							}

							#main-nav li.selected,
							#main-nav li.selected > a
							{ 
								background-color: #fff;
								color:#0B486D;			
							}

							#main-nav li.selected > a:hover
							{
								border-left:1px solid transparent;			
								border-right:1px solid transparent;
								border-bottom: 1px solid transparent;
								text-decoration: none;
							}

							#main-nav ul.nav_sub_menu
							{
								position: absolute;
								display: none;
								z-index: 20;
								left:-1px;
								margin-top:8px;
								background-color: #eeeeee;
								font-size:14px;
								color:#0B486D;
								border:1px solid #0B486D;
							}		

							#main-nav li > a:hover .nav_sub_menu { display: block; }

							#main-nav li.selected > a:hover .nav_sub_menu { left:-2px; background-color: #fff; border-top: 1px solid transparent; }

							#main-nav .nav_sub_menu a
							{
								color: inherit;
								font-size: inherit;
								white-space: nowrap;
								display: block;
								padding:5px 6px;
							}


							#main-nav li:hover .nav_sub_menu li:hover,
							#main-nav li:hover .nav_sub_menu li a:hover
							{
								background-color: #0B486D;
								color:#fff;
								text-decoration: none;
							}

							#main-nav .nav_sub_menu li.nav_section
							{
								position: relative;
								margin: 0;
								display: block;
								height: inherit;
								float: none;
								white-space: nowrap;
							}

							#main-nav .nav_sub_menu li.nav_section a
							{
								margin-left:20px;
								border-bottom: 0;
							}

							#main-nav .nav_sub_menu li.nav_section a span.glyphicons
							{
								position: absolute;
								left:6px;
								top:8px;
							}
						
							
#mainCrumbs 
{
	flex: 0 0 auto;
	top: 0;
	left: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 5px;
	margin: 5px;
}
	
	#mainCrumbs span 
	{ 
		display: block;
		font-size: 12px; 
	}
	
	#mainCrumbs span.breadcrumbs-title { font-weight: normal; }
	
	#mainCrumbs a,
	#mainCrumbs a:hover { color: var(--blue); }
	
#TargetedMessage 
{
	flex: 0 0 auto;
	top: 0;
	margin: 0;
	padding: 0;
	border: none;
}

#mainLayout 
{
	flex: 1 1 auto;
	overflow: auto;
	margin: 0;
	padding: 0;
}

	#mainLayout a { color: var(--blue); }
	#mainLayout a:hover
	{
		color: var(--darkblue);
		text-decoration: underline;
	}
	
	#mainLayout > div.container-fluid:first-of-type 
	{
		margin: 1px 10px;
		padding: 0;
		display: block;
	}
		
		#mainLayout > div.container-fluid:first-of-type > div.row:first-of-type 
		{
			display: flex;
			overflow: hidden;
		}

			#mainLayout > div.container-fluid:first-of-type > div.row:first-of-type nav { display: contents; }

			#sideBar 
			{ 
				display: block;
				flex: 0 0 auto;
			}
			
				#sideBar .sidebar-link-title { display: none; }
			
			#portlets
			{
				flex: 1 1 auto;
				padding: 0;
				width: auto;
				position: relative;
			}
			
				#PageBar_pageTitle 
				{
					display: inline-block;
					margin: 0;
				}
				
					#PageBar_pageTitle h2 { margin: 5px; }
				
				#PageBar_pageTitleButtons 
				{
					display: inline-block;
					float: none;
					position: absolute;
					right: 10px;
					top: 0;
					margin: 0;
				}
				
					#PageBar_wrenchToggle { background-color: transparent; }
					
					#PageBar_btnPrintView{ background-color: transparent; }
				
				#PageBar_menuAdmin 
				{
					display: flex;
					margin: 0;
					top: 0;
				}
				
				#portlet-grid 
				{
										
				}
				
					#portlet-grid::after,
					#portlet-grid::before { display: contents; }
					
					#portlet-grid > div.row:first-of-type
					{
						margin: 0;						
					}
						
						#portlet-grid > div.row:first-of-type::after,
						#portlet-grid > div.row:first-of-type::before { display: contents; }
																						
						#portlet-grid div.portlet-column 
						{ 
							padding: 0 5px;
						}
						
							#portlet-grid div.portlet 
							{ 
								margin: 5px 0 10px 0; 
								border: 1px solid var(--blue);
							}

								#portlet-grid div.portlet div.portlet-header-bar
								{
									background-color: var(--blue);
									color: #fff;
								}

									#portlet-grid div.portlet div.portlet-header-bar h3 { display: contents; }

										#portlet-grid div.portlet div.portlet-header-bar a { color: inherit; }
	
										#portlet-grid button.link-btn 
										{ 
											background-color: transparent;
											border: none;
											text-decoration: none;
											padding: 5px;
										}

											#portlet-grid button.link-btn:hover { text-decoration: underline; }
										
										#portlet-grid div.toggle.btn { width: 100px !important; height: auto !important; padding: 15px 10px; min-height: unset; }
											
											#portlet-grid div.toggle.btn label, #portlet-grid div.toggle.btn label:active { box-shadow: none !important; }							
											
											#portlet-grid div.toggle.btn div.toggle-group { background-color: transparent; }
											
											#portlet-grid div.toggle-group .toggle-on.btn, 
											#portlet-grid div.toggle-group .toggle-off.btn 
											{ 
												text-transform: uppercase;
												margin: 0;
												width: auto;
												padding: 5px;
												color: #fff;
												font-weight: bold; 
												font-size: 12px;
												display: flex;
												align-items: end;
												justify-content: center;
											}
											
											#portlet-grid div.toggle-group .toggle-on.btn { background-color: var(--green); }
											#portlet-grid div.toggle-group .toggle-off.btn { background-color: var(--red); }
											#portlet-grid div.toggle-group span.toggle-handle { display: none; }
										
										
										#portlet-grid div.portlet input[type="submit"],
										#portlet-grid a.link-btn
										{
											background-color: var(--blue);
											color: #fff;
											border: 1px solid var(--darkblue); 
											padding: 6px 12px;
											border-radius: 4px;
											text-decoration: none;
											display: inline-block;
											line-height: 1.3;
										}
										#portlet-grid div.portlet input[type="submit"]:hover,
										#portlet-grid a.link-btn:hover 
										{
											text-decoration: none;
											background-color: var(--darkblue);
											color: #fff;
										}
										
										#portlet-grid div.portlet div.card-action { padding: 0 5px; }
										#portlet-grid div.portlet button.card-action { border-radius: 4px; }
										
										#portlet-grid input[name*='RemoteUrl'] { width: 100% !important; }
										
										#portlet-grid table { width: 100%; }
										
										#portlet-grid iframe { border: none; }
										
	#mainLayout div.container-fluid.footer-wrapper.primary 
	{
		width: 100%;
	}
	
		#photostrip
		{
			position:relative;
			display: flex;
			align-items: center;
			justify-content: center;
			height:175px;
			background-color:#000;
			border:0px;
			overflow: hidden;
			border-top: 1px solid #02324f;
			border-bottom: 1px solid #02324f;
		}
			#photostrip img
			{
				position:relative;
				display:block;
				flex: 1 1 auto;
			}
	
	#MAINFORM .btn-primary { background-color: var(--blue); color: #fff !important; font-weight: 500; border-color: var(--darkblue); border-radius: 4px; }
	#MAINFORM .btn-primary:hover { background-color: var(--darkblue) !important; color: inherit; text-decoration: none; }
	#MAINFORM .btn-danger { background-color: var(--red) !important; color: #fff !important; font-weight: 500; border-color: var(--darkred) !important; border-radius: 4px; }
	#MAINFORM .btn-danger:hover { background-color: var(--darkred) !important; color: inherit; text-decoration: none; }
	#MAINFORM .btn-disable { background-color: var(--blue); opacity: .6 !important; font-weight: 500; }
	#MAINFORM .btn-clear-primary { background-color: #bbb; color:#000; font-weight: 500; }
	#MAINFORM .btn-clear-primary:hover { background-color: #ccc; text-decoration: none; }
	
}

@media screen and (max-width:1100px) {

body { min-width: 400px; }

#MAINFORM header:first-of-type 
{ 
	background-color: var(--blue); 
}

	#MAINFORM header:first-of-type div.site-header-container
	{
		display: contents;
	}
	
		#MAINFORM div.mobile-fixed-container { display: none; }
		
		#sitemasthead { display: block; min-height: 50px; }
		
		#sitemasthead > div:first-of-type { display: contents; }
			
			button#main-nav-btn { display: none; }
			
			h1#logo-heading
			{
				margin: 0;
				font-size: inherit;
				line-height: 1;
			}
			
				a.site-logo-link { display: block; }
				
					img.site-logo 
					{ 
						display: block;
						max-width: 325px; 
						width: 100%;
					}
					
				#welcomeBackBar 
				{  
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					margin: 0;
					z-index: 9;
				}

					#siteNavBar_welcomeBackBarLoggedIn_loginToggle 
					{
						display: block;
						font-size: inherit;
						background-color: transparent;
						right: 50px;
					}
			
			nav#top-nav-bar 
			{
				position: absolute;
				top: 8px;
				right: 10px;
				left: auto;				
				z-index: 99;
				width: 30px;
				height: 31px;
				overflow: hidden;
			}
			
				nav#top-nav-bar::before 
				{
					position: absolute;
					content: '\2630';
					color: #fff;
					font-size: 24px;
					font-weight: normal;
					z-index: 99;
					display: block;
					width: 25px;
					height: 25px;
					right: 1px;
					top: 1px;
					background-color: var(--blue);
				}
				
				nav#top-nav-bar.open::before 
				{
					content: '\2715';
					width: 30px;
					height: 30px;
					right: 1px;
					top: 1px;
					display: block;
					background-color: var(--blue);
				}
				
			nav#top-nav-bar.open { width: 97%; height: 100%; overflow: visible; }
			
			nav#top-nav-bar div.nav-container { display: contents; }
			
			nav#top-nav-bar #header-tabs { display: contents; }
			
			#hamburger-menu-section
			{
				position: relative;	
				width: 100%;
				height: 100%;	
				display: block;		
				overflow: hidden;
				cursor: pointer;		
				background-color: var(--blue);
				border: 1px solid #fff;
				text-align: center;
			}
			
				ul#main-nav 
				{
					display: none;
					background-color: var(--blue);
					width: auto;
					height: auto;
					position: relative;
					margin: 0;
					padding: 0;
					text-align: left;
					overflow: hidden;
				}
				
					nav#top-nav-bar.open ul#main-nav { display: block; }
					
					ul#main-nav li 
					{					
						margin: 0;
						padding: 0;
						display: block;
						background-color: transparent;
					}
					
						
						ul#main-nav li a 
						{
							
							display: block;
							color: #fff;
							font-size: 14px;
							width: 100%;
							line-height: 1.4;
							
						}
						ul#main-nav li a:hover { color: var(--blue) !important; background-color: #fff !important;}
							
}			