/*************************************************************************/
/*** DPSwww Header css - Version 25 Aug 2025                            ***/
/*** This Version uses HTML, CSS, and javascript only (No Bootstrap)   ***/
/*** Minimum Screen size is 200px                                      ***/
/*************************************************************************/

.dps-header {
	background-color:white;
	font-size: 1.2rem;
	line-height: 1.75;
}

/*****************************************************************/
/*** DPS-skip-link                                             ***/
/*****************************************************************/
#DPS-skip-nav-section {
	background-color:white;
}
.dps-skip-nav-dev {
	margin:auto;
	width:100%;
	max-width:200px;
	color: blue; 
	padding-left:.5rem;
	background-color:white;
	font-size: 1rem;
    line-height: 1.5;
	display:block;
}
.dps-skip-nav {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.dps-skip-nav:focus {
	position: static;
	width: auto;
	height: auto;
	color:white;
	background: #495057;
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 1px 2px;
    border-radius: 0 0 0.3rem 0.3rem;
    border-bottom-width: 0;	
    outline: 0;
	text-align: center;
	text-decoration:none;
}
.dps-skip-nav-dev a {
    color: white;
    text-decoration: none;
}
.dps-skip-nav-dev a:hover {
	text-decoration: underline;
}


/* ------------------------------------------------------------------------------------------------------------- */
/*********************************************************************/
/*** DPS-topnav-section (Top nav bar)                              ***/
/*********************************************************************/
.dps-topnav-section{
	background-color: var(--bg-white);
	width:100%;
	min-height:2.3rem;
	display:block;
}

.dps-topnav {
	display:block;
	overflow: hidden;
	margin:auto;
	width:100%;
	max-width:1400px;
	padding:0rem;
	color:var(--text-white);
	background-color:var(--bg-white);
	font-size: 1.2rem;
    line-height: 1.75rem;
}

.dps-topnav a:link {
	color: var(--dpsTopNav-links);
}
.dps-topnav a:hover {
  background-color: var(--dpsTopNav-hover);
  color: var(--dpsTopNav-links);
}
.dps-topnav a:focus {
  background-color: var(--dpsTopNav-hover);
  color: var(--dpsTopNav-links);
  text-decoration: underline;
}
.dps-topnav a.active {
  background-color: var(--bg-white);
  color: var(--text-black);
}

.dps-topnav-1 a {
  float: left;
  margin: 3px;
  display: inline-block;
  color: var(--text-black);
  text-align: center;
  padding: .5rem;
  text-decoration: none;
  font-size: 1rem;
}
.dps-topnav-2  {
  float: right;
  display: inline-block;
  color: var(--text-black);
  text-align: center;
  padding: .5rem;
  text-decoration: none;
  font-size: 1.2rem;
}
.dps-topnav-2 a {
  color: var(--dpsTopNav-links);
  text-align: center;
  padding: .5rem;
  text-decoration: none;
  font-size: 1.2rem;
}
.dps-topnav-HR {
		display: block;
	}

.dps_gt_select select{
    border-radius: 0.25rem !important;
    width: 7rem !important;
    height: auto !important;
    border: 1px solid !important;
	}




/* ------------------------------------------------------------------------------------------------------------- */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* xxx  DPSnav                                                        xxx */        
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/*
.dpsnav-section">
		#DPSnav .dpsnav
			.dpsnav-content
				.dpsnav-container-1
					a 
					   img
				.dpsnav-container-2
					#DPSnavMain  .dpsnav-main
						a
					#DPSnavControl  .dpsnav-control
						button
					#DPSnavMobile  .dpsnav-mobile
						a
					
*/


.dpsnav-section{
	background-color: var(--bg-white);
	width:100%;
	min-height:2.3rem;
	display:block;
}

.dpsnav {
	display:block;
	max-width:1400px;
	margin:auto;
	padding:0rem;
	color:var(--text-black);
	background-color:var(--bg-white);
	font-size: .8rem;
    line-height: 1rem;
	overflow: hidden;
}
.dpsnav-content {
	display:flex;
	width: 100%;
}


/*** Container 1 - Image ***/
.dpsnav-container-1 {
	display: inline-flex;
	width: 33%;
	margin: .1rem;
	padding: .1rem;
}
.dpsnav-image-link {
  width:100%;
  max-width: 360px;
}
.dpsnav-container-1 a {
  margin: 0px;
  display: inline;
  color: var(--text-white);
  text-align: center;
  padding: .5rem;
  text-decoration: none;
  font-size: .8rem;
  background-color: white;
}
.dpsnav-container-1 img {
  width:100%;
  max-width: 360px;
}
.dpsnav-container-1 a:link{
  background-color: var(--bg-white);
  color: var(--text-white);
}
.dpsnav-container-1 a:hover {
  background-color: var(--bg-white);
  color: var(--text-white);
}
.dpsnav-container-1 a:focus {
  background-color: var(--bg-white);
  color:  var(--text-white);
  text-decoration: none;
}
@media (max-width:767px){
	.dpsnav-container-1 {
		width: 60%;
	}
}
@media (max-width:350px){
	
	.dpsnav-content {
		display:block;
    }
	.dpsnav-container-1 {
		display: inline-flex;
		width: 95%;
		margin: .25rem;
		padding: .25rem;
		/** For Testing
			background-color: pink;
		**/
	}

}


/******************************/
/*** Container 2 - NavLinks ***/
/******************************/
.dpsnav-container-2 {
	display: inline-flex;
	max-width: 66%;
	max-width: 100%;
	margin: .25rem;
	padding: .1rem;
	float: right;
	
}
@media (max-width:767px){
	.dpsnav-container-2 {
		width: 45%;
	}
}	
/******************************/
/*** Container 2 - Main     ***/
/******************************/
.dpsnav-main {
	display: inline-block;
	width: 100%;
	margin: rem 0rem 0rem 0rem;
	text-align: left;
	text-decoration: none;
	padding: 2rem .2rem;
	font-size: .8rem;
}
.dpsnav-main a {
  color: var(--dpsNav-links);
  text-align: center;
  margin: .25rem;
  padding: .3rem 1rem;
  text-decoration: none;
  font-size: 1rem;
  vertical-align: middle;
}
.dpsnav-main a:link {
  color:  var(--dpsNav-links); 
  background-color: white;
  padding: .3rem 1rem;
  text-align: center;
  text-decoration: none;
  display: inline-block;
}
.dpsnav-main a:hover {
  background-color: var(--dpsNav-hover);
  color:  var(--dpsNav-links);
}
.dpsnav-main a:focus {
  background-color: var(--dpsNav-hover);
  color:  var(--dpsNav-links);
  text-decoration: underline;
}
.dpsnav-main a.active {
  background-color: var(--bg-dpsNav-hover);
  color: var(--text-black);
}

@media (max-width:1100px){
	.dpsnav-main { 
		padding: 1.5rem .1rem;
		font-size: .8rem;
	} 
}
@media (max-width:900px){
	.dpsnav-main { 
		padding: 1rem .1rem;
		font-size: .7rem;
	} 
}
@media (max-width:800px){
	.dpsnav-main {
		padding: .5rem .1rem;
		font-size: .6rem;
	} 
}

/************************************************************************************************************************************/
/************************************************************************************************************************************/
/************************************************************************************************************************************/
/*******************************************/
/*** Container 2 - Mobile  #DPSnavMoblie ***/
/*******************************************/

	/*** Container 2 - Mobile ***/
	.dpsnav-mobile {
		display: none;
		width: 100%;
		min-width: 200px;
		min-height: 2rem;
		margin: 0rem 0rem 0rem 0rem;
		padding: 0.5rem 0rem;
		text-align: center;
		text-decoration: none;
		font-size: .8rem;
		float: right;
	}
	.dpsnav-mobile a {
	  color: var(--dpsNav-links);
	  text-align: left;
	  margin: .25rem;
	  padding: .3rem 1rem;
	  text-decoration: none;
	  font-size: 1rem;
	  vertical-align: top;
	}
	.dpsnav-mobile a:link {
	  color:  var(--dpsNav-links); 
	  background-color: white;
	  padding: .3rem 1rem;
	  text-align: center;
	  text-decoration: none;
	  display: block;
	}
	.dpsnav-mobile a:hover {
	  background-color: var(--dpsNav-hover);
	  color:  var(--dpsNav-links);
	}
	.dpsnav-mobile a:focus {
	  background-color: var(--dpsNav-hover);
	  color:  var(--dpsNav-links);
	  text-decoration: underline;
	}
	.dpsnav-mobile a.active {
	  background-color: var(--bg-dpsNav-hover);
	  color: var(--text-black);
	}



/*********************************************/
/*** Container 2 - Control  #DPSnavControl ***/
/*********************************************/
	.dpsnav-control {
		display: none;
		width: 100%;
		min-height: 2rem;
		margin: .1rem;
		padding: 0.5rem;
		text-align: right;
		text-decoration: none;
		font-size: .8rem;
		float: right;
	}
	.dpsnav-control-button {
		text-align: right;
		align-items: right; /* Vertically centers the text */
	}

/******************/
/* @media screen  */
/******************/
@media (max-width:768px){
	.dpsnav-container-2 {
		display: inline-flex;
		width: 95%;
		margin: .25rem;
		padding: .1rem;
		float: right;
	}
}
/*** End Container 2 - Control ***/






/************************************************************************/
/*** DPS-page-title --- Big Blue Banner **/
/************************************************************************/
.dps-page-title {
	width:100%;
	color: white; 
	background-color: var(--DPS-color);
	min-height: 4rem;
}
.dps-title-content {
	margin:auto;
	max-width:1400px;
	color: white; 
	padding:.5rem 0rem;
	background-color: var(--DPS-color);
	font-size: 2.5rem;
    line-height: 3rem;
	border:none;
}
h1.dps-title {
	padding:0rem 1rem;
    font-size: 2.5rem;
    font-weight: bold;
    margin: 0;
}

/*******************************************************************************/
/*** Screen Sizes for Page Title (Big Blue) ***/
/*******************************************************************************/
/*
@media (max-width:1200px){
	.dps-page-title {
		min-height: 4rem;
	}
	.dps-title-content {
		font-size: 2.5rem;
		line-height: 3rem;
	}
}
*/
@media (max-width:1100px){
	.dps-page-title {
		min-height: 4rem;
	}
	h1.dps-title {
	padding:0rem 1rem;
    font-size: 2rem;
	}
}
@media (max-width:900px){
	.dps-page-title {
		min-height: 4rem;
	}
	h1.dps-title {
	padding:0rem 1rem;
    font-size: 1.7rem;
	}
}
@media (max-width:768px){
	.dps-page-title {
		min-height: 3.3rem;
	}
	h1.dps-title {
		padding:0rem 1rem;
		font-size: 1.5rem;
	}
}
@media (max-width:500px){
	.dps-page-title {
		min-height: 2rem;
	}
	h1.dps-title {
		padding:0rem 1rem;
		font-size: 1.2rem;
	}
}
@media (max-width:350px){
	.dps-page-title {
		min-height: 3rem;
		padding:.3rem 0rem;
		font-size: 2.0rem;
		line-height: 2.1rem;
	}
	h1.dps-title {
		padding:0rem 1rem;
		font-size: 1.2rem;
	}
}
@media (max-width:200px){
	.dps-page-title {
		min-height: 3rem;
		padding:.3rem 0rem;
		font-size: 2.0rem;
		line-height: 2.1rem;
	}
	h1.dps-title {
		padding:0rem 1rem;
		font-size: 1rem;
	}
}
/*********************************************************************************************************************/
/*** End - Page Title (Big Blue) ***/
/*********************************************************************************************************************/

