p, ul, blockquote, pre, td, th, label {margin-top: 0px}
li {padding-bottom: 19px}
li:last-child {padding-bottom: 0px}

/* PAGE DIV */
.page-padding, .no-padding, .content-padding {display: block; position: relative}

.logo-dph {max-width: 200px; margin: 20px}
.banner-div {display: block; position: relative}
.bannerImage {max-width: 1003px; text-align:center; width:100%}

/* DPH CSS EDITED */
.indexDivMedia{height:30px; /*padding-top:10px*/}
.colAtoZ1 {}
.colAtoZ2 {}
.colGrey1Media{float:left;  margin-left:20px; width: 160px;}
.colGrey3 {}
.colFontSize {width: 140px}
.colGrey2 {width: 210px; margin-left: 0px}
.colGrey4Media{float:right; padding-top:10px; padding-right: 20px}
.globalNavGreyMedia a:link, .globalNavGreyMedia a:visited {color:#2D3F77; text-decoration:none; font-weight: bold; font-size: 15px}
.globalNavGreyBlueDivMedia {background-color: #061C60; height:32px; padding-top: 2px}
.globalNavGreyDivMedia {background-color:#DCDDDE; height:50px; padding-top:7px; position: inline-block}
.footdropdown {border-bottom: solid 1px gray}
.droplinks {padding-bottom: 0px}
.contTitle4_Blue2 a:link, .contTitle4_Blue2 a:visited{color: #243877; text-decoration:none; }
 

/* MAIN NAVIGATION CLASSES */
#header {} /* contains mobile menu icon and text */
.li-margin-left-20 {margin-left: 20px}
.mobile-icon {cursor: pointer}
.logo-placement {margin-top: -46px}
.dph-logo {width: 100%; max-width: 160px} /* display: block; max-width: 528px */
.close-placement {margin-top: -46px}

#mobile-menu-div {position: fixed; height: auto; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 1; padding-top: 4px; width: 100%; overflow: scroll}
#open-header {width: 100%} /* contains mobile close menu icon and text */
#menu {margin-top: 66px} /* div that contains the nav text */
.cursor {cursor: pointer}
.media-nav-div {display: grid; position: relative; margin: 0 auto}
.mobile-menu {font-size: 16px; font-weight: bold; padding-left: 20px}
.mobile-menu a:link, .mobile-menu a:visited {color:#2D3F77; text-decoration: underline}


/* added javascript class */
.open-fixed-menu {position: fixed; top: 0px; padding-top: 4px; padding-bottom: 4px; width: 100%; z-index: 1} /* fixed item on scrollable mobile menu */


.info-block, .info-block2 {display: inline-block; padding: 0px; overflow: hidden;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
}

/* This element defines the size the iframe will take. In this example we want to have a ratio of 25:14 */
.aspect-ratio {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%; /* The height of the item will now be 56.25% of the width. */
  position: relative;
  margin-bottom: 20px;
}

/* Adjust the iframe so it's rendered in the outer-width and outer-height of it's parent */
.aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
}


.main-text {margin-bottom: 20px}
.twitter-feed-container {margin-bottom: 35px}

#more, #press-release-more, #info-more, #know-more {display: none;}


.text-box-block {display: block; width: 82%; border: solid 2px #464bb9; padding: 5%} /* margin-bottom: 80px */
.text-box-block2 {display: block; width: 82%; border: solid 2px #464bb9; padding: 5%}
.text-box-block, .text-box-block2 {
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
}
.block-text {background-color: #fff; width:60%; margin-left: 20%; margin-right: 20%} /* margin-top: -14%; */


.blue {background-color: #002454}
.blue-text {color: #002454}
.light-blue {background-color: #eaf1ff}
.purple {background-color: #464bb9}
.purple-link {color: #464bb9}
a:hover.purple-link {color: #464bb9}

.aqua {background-color: #81ecff}

h2 {font-size: 1.4em}

.button-info {margin-bottom: 20px}

.jumbotron {
  background-image: url("coronavirus-banner-update.png");
  background-size: cover;
  background-position: center center;
  border-radius: 0;
}

/* BUTTONS ON PAGE */
.button-block {display: inline-block; line-height: 1.8em; padding: 8px}
.button-text {font-weight: 700; margin-top: 10px; color: #fff; line-height: 1em; padding: 10px; width: 154px; font-size: 1em; height: 50px}/* changed from 1.4em to 1em */
/* .button-text2 {font-weight: 700; margin-top: 10px; color: #ffffff; line-height: 1em; padding: 30px; width: 185px; font-size: 1em} */


/* BUTTONS IN POPUP */
.button-text3 {font-weight: 700; margin-top: 10px; color: #ffffff; line-height: 1.5em; padding: 8px}
.button-block3 {display: inline-block; line-height: 1.8em; padding: 8px}

.button-text, .button-text2, .button-text3 {text-decoration: none}
a:hover.button-text, a:hover.button-text2, a:hover.button-text3 {color: #fff; text-decoration: none}
a:hover.button-block {background-color: #464bb9; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)}

.column-buttons {
	-webkit-columns: 2 162px;
	-moz-columns: 2 162px;
	columns: 2 162px;
	-webkit-column-gap: 5em;
	-moz-column-gap: 5em;
	column-gap: 5em;
}

.column-3, .column-2-video {
	-webkit-columns: 1 240px;
	-moz-columns: 1 240px;
	columns: 1 240px;
	-webkit-column-gap: 2em;
	-moz-column-gap: 2em;
	column-gap: 2em;
}


/* INFO POPUP */
.overlay {position: fixed; z-index: 1; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.7); transition: opacity 500ms; visibility: hidden; opacity: 0}
.overlay:target {visibility: visible; opacity: 1}

.popup {z-index: auto; margin: 70px auto; padding: 20px; width: 320px; background: #fff; position: relative; /* transition: all 5s ease-in-out; */}

.popup .close {/* position: absolute; top: 20px; right: 30px; */ transition: all 200ms; font-size: 20px; text-decoration: none; color: #6d6d6d}
.close-div {margin-top: 30px}
/* .popup .close:hover {color: #06D85F} */
.popup .popup-content {max-height: 375px; overflow: auto}



/* COLLAPSIBLE SECTION */
.no-collapse-line {
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	border-bottom: 1px solid #e9e9e9; 
	padding-bottom: 5px;
}

.collapsible {
	cursor: pointer;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	border-bottom: 1px solid #e9e9e9; 
	padding-bottom: 5px;
	content: "\f0da";

}

		
.collapsible:before {
	font-family: "FontAwesome"; font-weight: 900;
	content: '\f0da';
	float: left;
	margin-right: 5px;
}

.active:before {
	font-family: "FontAwesome"; font-weight: 900;

	/*content: "hide \005E\2212";*/
	content: "\f0d7 ";
	} 


.collapsible-content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}


/*.dontprint {display: none}*/


/* COUNTER ON PAGE */
.counter-container {border: solid 2px #e4e4e4; margin-bottom: 75px;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
}
.counter {display: inline-block; padding-left: 10px; padding-right: 10px}
.counter-block {display: inline-block; line-height: 1em; padding: 8px}
.counter-text {font-weight: 700; font-family: 'News Cycle', sans-serif; border: solid 3px #002454; width: 184px; font-size: 3em; margin-top: -8px; 
padding-top: 0px; color: #002454}
/* .counter-text {font-weight: 700; font-family: 'News Cycle', sans-serif; border: solid 3px #464bb9; width: 154px; font-size: 4em; margin-top: -8px; margin-bottom: 20px; 
padding-top: 0px; -webkit-text-stroke: 2px #464bb9; color: white;
   text-shadow:
       3px 2px 0 #464bb9,
     -1px -1px 0 #464bb9,  
      1px -1px 0 #464bb9,
      -1px 1px 0 #464bb9,
       1px 1px 0 #464bb9
} */




.column3alt {font-size: 11px; font-family: Arial, Helvetica, sans-serif}
.column3alt-2 {width: 100%; display: inline-block; vertical-align: top; margin-bottom: 20px}
.column3alt-1 {padding-left: 0%; width: 100%; display: inline-block; text-align: center; margin-bottom: 20px}


.footdrop {font-size:11px; font-family:Arial, Helvetica, sans-serif; color: #000; margin-bottom: 15px}

.center {text-align: center}
.right {text-align: right}
.justify {text-align: justify}


/* MOBILE PORTRAIT */
@media only screen and (min-width: 0px) {
	body {
		
	}

	/* MAIN NAVIGATION CLASSES */
	#desktop-menu {display: none}
	#mobile-menu-div {display: none}
	.media-nav-div {width: 88%}

	/* DIV CLASSES */
	.page-padding {width:100.0%; float: left; padding: 6%}
	.content-padding {width:100.0%; float: left; padding-left: 6%; padding-right: 6%}
	.no-padding {width:100.0%; float: left}
	.banner-div {width:88.0%; float: left; padding-left: 6%; padding-right: 6%}
	.text-box-block, .text-box-block2 {width: 88%}

	.colAtoZ1, .colAtoZ2 {display: none}
	.colGrey3 {display: none}
}



/* MOBILE PORTRAIT */
@media only screen and (min-width: 320px) {
	body {
		
	}

	/* MAIN NAVIGATION CLASSES */
	#desktop-menu {display: none}
	#mobile-menu-div {display: none}
	.media-nav-div {width: 88%}

	/* DIV CLASSES */
	.banner-div {width:88.0%; float: left; padding-left: 6%; padding-right: 6%}
	.text-box-block, .text-box-block2 {width: 100%}

	.colAtoZ1, .colAtoZ2 {display: none}
	.colGrey3 {display: none}
}



/* MOBILE LANDSCAPE */
@media only screen and (min-width: 480px) {
	body {
		
	}

	/* .block-text {margin-top: -10%} */

}



/* SMALL TABLET */
@media only screen and (min-width: 600px) {
	body {
		
	}
	
	/* .block-text {margin-top: -8%} */
	.info-block {padding: 50px}
	.info-block2 {padding-left: 50px; padding-right: 50px}
}



/* TABLET/NETBOOK */
@media only screen and (min-width: 768px) { 
	body {
		
	}
	
	.dontprint {display: none}
	
	.dph-logo {display: none}
	.column3alt-1 {display: block}

		
	/* MAIN NAVIGATION CLASSES */
	#header {padding-top: 26px} /* contains mobile menu icon and text */
	#desktop-menu {display: block}
	#mobile-icon {display: none}
	.logo-placement {margin-top: -34px; margin-left: 0px; text-align: left}
	#mobile-menu-div {display: none}

	/* DIV CLASSES */
	.bannerImage {max-width: 88%}
	.no-padding {width:100.0%; float: left; padding-left: 6%; padding-right: 6%}
	/* .text-box-block {margin-bottom: 80px} */

	
	.popup{width: 525px}
		
	.column-buttons {
		-webkit-columns: 4 170px;
		-moz-columns: 4 170px;
		columns: 4 170px;
		-webkit-column-gap: 2em;
		-moz-column-gap: 2em;
		column-gap: 2em;
		margin-top: -45px;
	}
	
	.column-3 {
		-webkit-columns: 3 208px;
		-moz-columns: 3 208px;
		columns: 3 208px;
		-webkit-column-gap: 1em;
		-moz-column-gap: 1em;
		column-gap: 1em;
	}
	
	.column-2-video {
		-webkit-columns: 2 208px;
		-moz-columns: 2 208px;
		columns: 2 208px;
		-webkit-column-gap: 1em;
		-moz-column-gap: 1em;
		column-gap: 1em;
	}


}


/* TABLET/NETBOOK */
@media only screen and (min-width: 945px) { 
	body {
		
	}
	.dontprint {display: none}
	
	/* .block-text {margin-top: -5%} */

}




/* LANDSCAPE TABLET/NETBOOK/LAPTOP */
@media only screen and (min-width: 1024px) { 
	body {

	}
	
	.colAtoZ1, .colAtoZ2 {display: block}
	.colGrey3 {display: block}
	.colGrey4{float:right; width: 300px; padding-top:10px;}
	.globalNavGreyMedia a:link, .globalNavGreyMedia a:visited {font-size: 18px}
	.info-block, .info-block2 {width: 90%;
		-webkit-columns: 2 184px;
		-moz-columns: 2 184px;
		columns: 2 184px;
		-webkit-column-gap: 3em;
		-moz-column-gap: 3em;
		column-gap: 3em;
	}
	
	.block-text {width:70%; margin-left: 15%; margin-right: 15%} /* margin-top: -8%; */

	.column3alt {font-size: 11px; font-family: Arial, Helvetica, sans-serif; width: 70%; margin-left: 15%; margin-right: 15%}
	.column3alt-1 {padding-left: 2%; width: 30%; display: inline-block}
	.column3alt-2 {width: 66%; display: inline-block; vertical-align: top}

	/* .main-text {margin-bottom: 78px} */
	.twitter-feed-container {margin-left: 45px}

	.media-nav-div {width: 1003px; float: none}	
	.page-padding, .no-padding, .content-padding {width: 1003px; float: none; margin: 0 auto; padding: 0%}
	.banner-div {width: 1003px; float: none; padding-left: 0%; padding-right: 0%}
	.bannerImage {max-width: 1003px; max-height: 300px}
	.column-buttons {margin-top: 20px}


}