/*  D E V E L O P E R   C U S T O M I Z A B L E   S T Y L E S    */
/*  State of Delaware - Delaware Courts 2015  */
/*  Developed by Matt Campbell & Ben Kaminski  */





/*  G E N E R A L   S T Y L E S  */

#main_header h1, #main_content h1 {
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						400;
	color:								#4577c1 !important;
	font-size:							45px;
}

#main_header h2, #main_content h2 {
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						500;
	color:								#4577c1 !important;
	margin-top:							0px;
}

.container-lg h2 {
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						500;
	color:								#4577c1 !important;
	margin-top:							0px;
}

#courts_sidebar h2 {
	color:								#393939;
	text-transform:						uppercase;
	letter-spacing: 					2px;
	font-weight: 						600;
	font-size:							23px;
}

/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	#main_content {
		border-left: 					0px solid #e3e5e2;
}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	#main_content {
		border-left: 					0px solid #e3e5e2;
}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	#main_content {
		border-left: 					1px solid #e3e5e2;
}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	#main_content {
		border-left: 					1px solid #e3e5e2;
}}

#main_content a, #main_content a:link, #main_content a:active, #main_content a:visited {
	color: 								#3774ba;
	text-decoration: 					none;
	font-weight: 						none;
	-o-transition:						.5s;
	-ms-transition:						.5s;
	-moz-transition:					.5s;
	-webkit-transition:					.5s;
	transition:							.5s;
}

#main_content a:hover {
    text-decoration: 					underline;
    font-weight: 						none;
    color: 								#23387d;
}

#main_content ul, #main_content ol  {
	font-size:      					0.9em;
	line-height:    					2.1em;
	margin-top:      					1.0em;
	margin-bottom:      				1.0em;
}

.float_left {
	float:								left;
	margin-right:						10px;
}

.float_right {
	float:								right;
	margin-left:						10px;
}

.figure_left {
	float: 								left;
	width: 								50%;
	border: 							1px solid #ddd;
	border-radius: 						4px;
	margin: 							0.5em;
	padding: 							0.3em;
}

.figure_right {
	float: 								right;
	width: 								50%;
	border: 							1px solid #ddd;
	border-radius: 						4px;
	margin: 							0.5em;
	padding: 							0.3em;
}

.figure_center {
	text-align:							center;
	width: 								50%;
	border: 							1px solid #ddd;
	border-radius: 						4px;
	margin: 							0.5em;
	padding: 							0.3em;
}

.figure_left p, .figure_right p, .figure_center p {
	text-align: 						center;
	font-style: 						italic;
	font-size: 							smaller;
	text-indent: 						0;
}

img.scaled {
	width: 								100%;
}

hr.dashed {
	-moz-border-bottom-colors: 			none;
    -moz-border-left-colors: 			none;
    -moz-border-right-colors: 			none;
    -moz-border-top-colors: 			none;
    border-image: 						none;
    border: 							dashed #e3e5e2;
    border-width:						2px 0 0; 
	height:								2px;
    margin-top: 						10px;
    margin-right:						20px;
    margin-bottom: 						10px;
}

hr.home {
	-moz-border-bottom-colors: 			none;
    -moz-border-left-colors: 			none;
    -moz-border-right-colors: 			none;
    -moz-border-top-colors: 			none;
    border-image: 						none;
    border: 							solid #4577c1;
    border-width:						3px 0 0; 
	height:								3px;
    margin-top: 						10px;
    margin-right:						0px;
    margin-bottom: 						10px;
}

.fa_orange {
	color:								#fbaa27;
}

/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	.container-lg {
		max-width:						100%;
		margin-left: 					auto;
    	margin-right: 					auto;
    	padding-left: 					20px;
    	padding-right: 					20px;
    	margin-bottom:					-22px;
	}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.container-lg {
		max-width:						100%;
		margin-left: 					auto;
    	margin-right: 					auto;
    	padding-left: 					20px;
    	padding-right: 					20px;
    	margin-bottom:					-22px;
	}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.container-lg {
		max-width:						100%;
		margin-left: 					auto;
    	margin-right: 					auto;
    	padding-left: 					20px;
    	padding-right: 					20px;
    	margin-bottom:					-22px;
	}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.container-lg {
		max-width:						1800px;
		margin-left: 					auto;
    	margin-right: 					auto;
    	padding-left: 					10px;
    	padding-right: 					10px;
    	margin-bottom:					-22px;
	}}

.container-lg h3 {
	color:								#666;/*#fbaa27;*/
	text-transform:						uppercase;
	font-size:							21px;
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						700;
	margin-bottom:						-12px;
}

.container-lg h4 {
	color:								#1f242a;
	font-size:							50px;
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						900;
}

a.interior-drop, a.interior-drop:link, a.interior-drop:visited {
	color: 								#777 !important;
	text-decoration:					none !important;
}

a.interior-drop:hover {
	color: 								#777 !important;
	text-decoration:					none !important;
}

a.link-active, a.link-active:link, a.link-active:visited {
	text-decoration: 					none !important;
}

a.link-active:hover {
	text-decoration: 					none !important;
}

a i[class^="circle-pic"], a i[class*=" circle-pic"] {
    display: 							block;
}

i[class^="circle-pic"], i[class*=" circle-pic"] {
    border-radius: 						50%;
    display: 							block;
    font-size: 							0;
    height: 							100px;
    margin-bottom: 						20px;
    margin-left: 						auto;
    margin-right: 						auto;
    position: 							relative;
    text-align: 						center;
    width: 								100px;
}

i[class^="circle-pic"]::after, i[class*=" circle-pic"]::after {
    border-radius: 						50%;
    border-style: 						solid;
    border-width: 						2px;
    content:							"";
    height: 							100%;
    left: 								0px;
    pointer-events: 					none;
    position: 							absolute;
    top: 								0px;
    transform: 							scale(0.9);
    transition-duration: 				225ms;
    transition-property: 				all;
    transition-timing-function: 		cubic-bezier(0.5, -0.7, 0.67, 0.7);
    width: 								100%;
    z-index: 							-1;
}

i[class^="circle-pic"]::before, i[class*=" circle-pic"]::before {
    color: 								#fff;
    font-size: 							40px;
    font-style: 						normal;
    font-weight: 						normal;
    line-height: 						100px;
    margin: 							0;
    text-align: 						center;
    text-transform: 					none;
}

.link-active i[class^="circle-pic"]:hover::after, .link-active i[class*=" circle-pic"]:hover::after, .link-active span:hover > i[class^="circle-pic"]::after, .link-active span:hover > i[class*=" circle-pic"]::after, .link-active h3:hover > i[class^="circle-pic"]::after, .link-active h3:hover > i[class*=" circle-pic"]::after, .link-active h4:hover > i[class^="circle-pic"]::after, .link-active h4:hover > i[class*=" circle-pic"]::after, .link-active h5:hover > i[class^="circle-pic"]::after, .link-active h5:hover > i[class*=" circle-pic"]::after, .link-active h6:hover > i[class^="circle-pic"]::after, .link-active h6:hover > i[class*=" circle-pic"]::after {
    transform: 							scale(1.13);
    transition-timing-function: 		cubic-bezier(0.4, 0.25, 0.14, 1.73);
    text-decoration: 					none !important;
}

i[class^="small-circle-pic"], i[class*=" small-circle-pic"] {
    border-radius: 						50%;
    display: 							block;
    float: 								left;
    font-size:							0;
    height: 							40px;
    margin-right: 						20px;
    position: 							relative;
    text-align: 						center;
    width: 								40px;
}

i[class^="small-circle-pic"]::before, i[class*=" small-circle-pic"]::before {
    color: 								#fff;
    font-size: 							18px;
    font-style: 						normal;
    font-weight: 						normal;
    line-height: 						43px;
    margin: 							0;
    text-align: 						center;
    text-transform: 					none;
}

.agency_map {
	border: 							0px; 
	width: 								700px;
	height: 							500px;
	margin: 							0px;
}
/* ############################################################################################## */





/* HEADING FOR SECTIONS OF THE COURTS WEBSITE */

/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	#heading_home {
		height:							140px;
		width:							100%;
		padding-left:					10px;
		background-color:				#4577c1;
	}
	
	#heading_home h1 {
		color:							#fff !important;
		font-size:						38px !important;
}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	#heading_home {
		height:							120px;
		width:							100%;
		padding-left:					35px;
		background-color:				#4577c1;
	}

	#heading_home h1 {
		color:							#fff !important;
		font-size:						45px !important;
}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	#heading_home {
		height:							120px;
		width:							100%;
		padding-left:					40px;
		background-color:				#4577c1;
	}

	#heading_home h1 {
		color:							#fff !important;
		font-size:						50px !important;
}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	#heading_home {
		height:							120px;
		width:							100%;
		padding-left:					40px;
		background-color:				#4577c1;
	}

	#heading_home h1 {
		color:							#fff !important;
		font-size:						50px !important;
}}

.heading_logo {
	margin-top:							-15px;
	padding-left: 						20px;
}

/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	#heading_interior {
		height:							100%;
		width:							100%;
		padding-bottom:					20px;
		padding-left:					10px;
		background-color:				#4577c1;
	}
	
	#heading_interior h1 {
		color:							#fff !important;
		font-size:						30px !important;
}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	#heading_interior {
		height:							100%;
		width:							100%;
		padding-bottom:					20px;
		padding-left:					35px;
		background-color:				#4577c1;
	}

	#heading_interior h1 {
		color:							#fff !important;
		font-size:						45px !important;
}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	#heading_interior {
		height:							100%;
		width:							100%;
		padding-bottom:					20px;
		padding-left:					40px;
		background-color:				#4577c1;
	}

	#heading_interior h1 {
		color:							#fff !important;
		font-size:						50px !important;
}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	#heading_interior {
		height:							100%;
		width:							100%;
		padding-bottom:					20px;
		padding-left:					40px;
		background-color:				#4577c1;
	}

	#heading_interior h1 {
		color:							#fff !important;
		font-size:						50px !important;
}}
/* ############################################################################################## */





/* P A N E L   B O X E S   H O M E P A G E */

a.boxlinks_left, a.boxlinks_left:link, a.boxlinks_left:active, a.boxlinks_left:visited {
	color: #2D6A9F !important;
	text-decoration: none !important;
}

	a.boxlinks_left:hover {
		color: #2D6A9F !important;
		text-decoration: none !important;
	}
	
	
	a.boxlinks_right, a.boxlinks_right:link, a.boxlinks_right:active, a.boxlinks_right:visited {
		color: 							#3c763d !important;
		text-decoration:				none !important;
	}
	
	a.boxlinks_right:hover {
    	color: 							#3c763d !important;
    	text-decoration:				none !important;
	}
	
	.alert-boxes {
		margin-right:					40px;
	}
/* ############################################################################################## */

	



/* S I D E   B A R   N A V I G A T I O N */

.courts_nav {
	background-color: 					#ffffff !important;
}

button {
  display: 								inline-block;
  margin: 								0 0em;
  border: 								none;
  background: 							none;
}

button span {
  display: 								block;
}

.grid-button {
  padding: 								2rem;
  cursor: 								pointer;
  user-select: 							none;
  outline: 								none;
}

.grid-button .grid {
  width: 								1rem;
  height: 								1rem;
  background: 							#393939;
  color: 								#393939;
  /* Not in use when the colors are specified below */
  transition: 							0.3s;
}

.grid-button.disappear .grid {
  -webkit-transform: 					rotate3d(0, 0, 1, -45deg) scale3d(0.8, 0.8, 0.8);
  transform: 							rotate3d(0, 0, 1, -45deg) scale3d(0.8, 0.8, 0.8);
}

.grid-button.rearrange .grid {
  box-shadow: 							-1.25rem -1.25rem, 0rem -1.25rem, 1.25rem -1.25rem, -1.25rem 0rem, 1.25rem 0rem, -1.25rem 1.25rem, 0rem 1.25rem, 1.25rem 1.25rem;
}

.grid-button.rearrange.disappear .grid {
  box-shadow: 							0rem -1rem, 0rem -2rem, 1rem 0rem, -2rem 0rem, 2rem 0rem, -1rem 0rem, 0rem 2rem, 0rem 1rem;
}

.nav courts_nav > li > a:hover,
.nav courts_nav > li > a:focus {
	text-decoration: 					none;
	background-color: 					#ffffff !important;
}

.nav courts_nav > li > a {
    display:							block;
    padding: 							10px 5px !important;
    position: 							relative;
}

.panel-group .panel-heading + .panel-collapse > .panel-body, .panel-group .panel-heading + .panel-collapse > .list-group {
	border-top: 						0px;
}

.panel {
    background-color: 					#fff;
    border-radius: 						4px;
    box-shadow: 						0 0px 0px rgba(0, 0, 0, 0.05);
    margin-bottom: 						20px;
}

#HomeMenu {
	list-style: 						none outside none;
}

#HomeMenu > li {
	line-height:						2.2;
	margin-left:						-20px;
	margin-right:						20px;
	margin-bottom:						5px;
	border-bottom:						1px solid #e3e5e2;
	
}

.toplevel a, .toplevel a:link, .toplevel a:active, .toplevel a:visited, .toplevel a:hover {
	text-decoration: 					none;
}

#HomeMenu a, #HomeMenu a:link, #HomeMenu a:active, #HomeMenu a:visited {
	color: 								#3774ba;
	text-decoration: 					none;
	font-weight: 						none;
	-o-transition:						.5s;
	-ms-transition:						.5s;
	-moz-transition:					.5s;
	-webkit-transition:					.5s;
	transition:							.5s;
}

#HomeMenu a:hover {
    color: 								#fbaa27 !important;
    text-decoration: 					none;
    font-weight: 						none;
}
/* ############################################################################################## */





/* S E R V I C E S   A R E A   H O M E P A G E */

.jp_services {
	padding-left: 						15px;
	padding-top:						25px;
}

.services_row {
	margin-left: 						0px; 
	margin-right: 						0px;
}

/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	.three-col-card {
    	float: 							none;
    	height: 						100%;
    	margin-right: 					1.69492%;
    	width: 							90%;
   		margin-bottom: 					18px;
    	position: 						relative;
}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.three-col-card {
    	float: 							left;
    	height: 						595px;
    	margin-right: 					1.69492%;
    	width: 							31%;
   		margin-bottom: 					18px;
    	position: 						relative;
	}
	.services-card-data p {
		font-size:						0.9em;
		display: 						block;
    	height: 						12em;
    	line-height: 					1.375em;
    	overflow: 						hidden;
    	text-overflow:					ellipsis;
}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.three-col-card {
    	float: 							left;
    	height: 						560px;
    	margin-right: 					1.69492%;
    	width: 							31%;
   		margin-bottom: 					18px;
    	position: 						relative;
	}
	.services-card-data p {
		font-size:						0.9em;
		display: 						block;
    	height: 						12em;
    	line-height: 					1.375em;
    	overflow: 						hidden;
    	text-overflow:					ellipsis;
}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.three-col-card {
    	float: 							left;
    	height: 						560px;
    	margin-right: 					1.69492%;
    	width: 							31%;
   		margin-bottom: 					18px;
    	position: 						relative;
	}

	.services-card-data p {
		font-size:						0.9em;
		display: 						block;
    	height: 						8em;
    	line-height: 					1.375em;
    	overflow: 						hidden;
    	text-overflow:					ellipsis;
}}

.services-card {
    border: 							1px solid #e4e4e4;
    overflow: 							hidden;
    position: 							relative;
}

.services-card-data {
	overflow: 							hidden;
    padding: 							0 15px;
}

.services-card-data h2 {
    color: 								#3774ba;
    display: 							block;
    font-size: 							20px;
    height: 							2.4em;
    line-height:						1.2em;
    margin: 							20px 0;
    overflow: 							hidden;
    text-overflow: 						ellipsis;
}

.services-card-option-links {
    margin-top: 						10px;
    padding: 							23px 15px 0;
}

ul.option-links {
    font-size: 							13px;
    line-height: 						18px;
    list-style-type: 					none;
    margin: 							0;
    padding: 							0;
}

ul.option-links li a::after {
    -moz-osx-font-smoothing: 			grayscale;
    color: 								#128ec3;
    content: 							"\f0da";
    float: 								right;
    font-family: 						"Font Awesome 5 Pro";
    font-size: 							18px;
    font-style:							normal;
    font-variant: 						normal;
    font-weight: 						900;
    line-height: 						1;
    text-transform: 					none;
}

ul.option-links li.first a {
    border-bottom: 						1px solid #e4e4e4 !important;
}

ul.option-links li.last a {
    border-bottom: 						none !important;
}

ul.option-links li a {
    border-bottom: 						1px solid #e4e4e4;
    color:								#000000;
    display: 							block;
    letter-spacing: 					2px;
    margin-bottom: 						10px;
    padding-bottom: 					10px;
    text-decoration: 					none;
    text-transform: 					uppercase;
    font-weight:						700;
}

.services-card-footer-bar {
    background-color: 					#f6f8f7;
    border-top: 						1px solid #e4e4e4;
    bottom: 							0;
    padding: 							14px;
    width: 								100%;
}

.services-card-footer-bar p {
    color: 								#000000;
    font-size: 							13px;
    letter-spacing: 					2px;
    margin-left: 						8px;
    text-transform: 					uppercase;
    font-weight:						700;
}

.services-card-footer-bar a, .services-card-footer-bar a:link, .services-card-footer-bar a:visited {
	color: 								#000000;
}
/* ############################################################################################## */





/* A B O U T   U S   S E C T I O N  */

.we_are {
	padding:							25px;
}

.we_are h5 {
	color:								#4577c1;
	font-size:							20px;
}

.about_row {
	background-color: 					#f8fafa;
}

	.about_row h5 a {
		color: #2F72AC;
	}
	.about_row a {
		color: #2F72AC;
	}
/* ############################################################################################## */





/* N E W S   S E C T I O N  */

#news_section {
	padding:							25px;
}

#news_section h2 {
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						300;
	color:								#4577c1 !important;
	margin-top:							0px;
	font-size:							38px;
}
/* ############################################################################################## */





/* W H E N   C O M I N G   T O   C O U R T   B O X */

#come_court {
	background-color:					#f5fcfd;
	border-top:							2px solid #f2f2f2;
	border-bottom:						2px solid #f2f2f2;
	padding:							10px;
}

#come_court h3 {
	color:								#666666;/*#fbaa27;*/
	text-transform:						uppercase;
	font-size:							18px;
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						700;
	margin-bottom:						-12px;
}

#come_court h4 {
	color:								#1f242a;
	font-size:							50px;
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						900;
}

#come_court p {
	text-align:							center;
	font-size:							16px;
}

	#come_court a {
		color: #3277B3;
		font-weight: 500;
	}


/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {
	.court_areas {
		float:							none;
    	width:							100%;
    	padding:						1%;
}}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.court_areas {
		float:							left;
    	width:							25%;
    	padding:						1%;
}}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.court_areas {
		float:							left;
    	width:							14%;
    	padding:						1%;
}}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.court_areas {
		float:							left;
    	width:							14%;
    	padding:						1%;
}}
/* ############################################################################################## */




.fa-question-circle, .fa-check-circle {
	vertical-align: middle;
}
.link-options {
	font-weight: 						700;
}
.link-options:hover {
	color: 								#092495 !important;
	transition:		 					0.4s;
	text-decoration: 					none !important;
}
.faq-links {
	font-size: 							18px;
}
.faq-links:hover {
	color:								green !important;
	transition:							0.4s !important;
}
.faq-links:focus {
	color:								green !important;
}
@media (max-width: 1200px) {
.faq-links {
	font-size: 							16px;
}}
@media (max-width: 768px) {
.faq-links {
	font-size: 							14px;
}}
/* ############################################################################################## */
/* #################### AW #################################################################### */

.alert-constable {
border:2px solid #3a6cb4;
}

/* FONT AWESOME STYLES*/
.red-exclamation {
    color: #DB2929;
}
/* END FONT AWESOME  */

/* JP COURT HOME PAGE NEWS BOX FOR MULTIPLE CLOSINGS - AMY */

.news {
	font-family: 						"Source Sans Pro", Helvetica, Arial, sans-serif;
	font-weight: 						600;
	color:								#4577c1 !important;
	font-size:							20px;
    padding-top:                        10px;
}
.newsBody {
    color:								#4577c1 !important;
}
/* END NEWS BOX */


/* TABLE COL 1 SPECIFIED LENGTH - on Continuance form */
#smcol tr td:nth-child(1){
    width: 30%;
}

/*remove padding from alert box (BS3) */
.alert-nopad {
	margin-bottom: 0px;
}

	.alert-nopad a {
		color: #2A6293;
	}

.alertcovid h3 {
	margin-top: 0px;
	padding-top: 0px;
}

/* ===== EMERGENCY NOTIFICATiON ====== */

.emergency {
	text-align: center;
	background-color: #C2371F;
	color: #ffffff;
	font-size: 18px;
	padding: 15px;
	font-weight: 600;
}

	.emergency a, .emergency a:link, .emergency a:active, .emergency a:visited {
		color: #ffffff;
	}

		.emergency a:hover {
			text-decoration: underline;
		}

/* ADA COMPLIANCY 
a {
	color: #3174AF !important;
}*/

.training ul {
	list-style: none;
	padding-left: 0;
}

.training ul li a {
	font-size: 16px;
}

.announce {
	font-size: 16px;
	font-weight: 600;
	font-family: 'Oxygen', sans-serif !important;
}
.announcesm {
	font-size: 16px;
	font-weight: 500;
	font-family: 'Oxygen', sans-serif !important;
}