/*
Theme Name: Office of Veteran Services
Theme URI: https://vets.delaware.gov
Author URI: https://gic.delaware.gov
Description: Custom WordPress theme designed exclusively for the Delaware Commission of Veterans Affairs (DCVA).
Version: CLF 4.0.1
Tags: Bootstrap, mobile first, State of Delaware
Text Domain: dosgic_VA_theme
*/

/* ############################################################################################## */

/*  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 - CLF4 2016  */
/*  Developed by the GIC (Matt Campbell & Julianne Solum)  */

/* ############################################################################################## */

/*==========  Bootstrap 3 Mobile First Method CSS  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

	/* ============================= ELEMENTS ============================= */
	html {
		-webkit-font-smoothing: antialiased !important;
		position: relative;
		min-height: 100%;
	}

	body {
		width: 100%;
		min-height: 100%;
		font-family: 'Open Sans', sans-serif !important;
		font-weight: 400 !important;
		font-size: 16px !important;
		-webkit-font-smoothing: antialiased !important;
		padding-bottom: 200px !important;
	}

	/* ============================= ID's ============================= */

	/* BOOTSTRAP NAV-WALKER COMPENSATORY CSS  */
	/* ID OF BELOW SELECTOR WILL CHANGE BASED ON WEBSITE */
	#menu-dcva-main-navigation {
		z-index: 999;
	}

	.affix #menu-dcva-main-navigation {
		position: absolute !important;
	}

	#menu-line {
		position: absolute;
		top: 0;
		left: 0;
		height: 3px;
		background: #2f4170;
		-webkit-transition: all 0.25s ease-out;
		-moz-transition: all 0.25s ease-out;
		-ms-transition: all 0.25s ease-out;
		-o-transition: all 0.25s ease-out;
		transition: all 0.25s ease-out;
	}

	#main_header h1,
	#main_content h1 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		color: #294172 !important;
		font-size: 45px;
		margin-top: 10px;
	}

	#main_header h2,
	#main_content h2 {
		font-family: 'Montserrat', sans-serif;
		color: #294172 !important;
		margin-top: 0px;
	}

	#main_content h3 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 300 !important;
		font-size: 25px;
		color: #2f4170 !important;
		margin-top: 0px;
	}

	#main_content a,
	#main_content a:link,
	#main_content a:active,
	#main_content a:visited {
		color: #12398a;
		text-decoration: none;
		font-weight: bold;
	}

	#main_content a:hover {
		color: #a8a8a8;
		text-decoration: underline;
		font-weight: bold;
	}

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

	#headerImage {
		height: 350px;
		width: 100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: 60%;
		position: relative;
		padding-top: 50px !important;
		padding: 10px;
	}

	#loading1 {
		margin-left: auto;
		margin-right: auto;
		width: 100px
	}

	#loading2 {
		margin-left: auto;
		margin-right: auto;
		width: 100px
	}

	#va_head {
		background-color: #f5f5f5;
		height: auto;
		position: relative;
		z-index: 1000;
	}

	#dcvaServices h3 {
		font-size: 22px !important;
		margin-top: 15px !important;
	}

	#AgencyCarousel {
		border: 2px solid #2f4170;
	}

	#AgencyCarousel .carousel-caption h2 {
		font-family: 'Trebuchet MS', sans-serif !important;
		color: #ffffff !important;
		font-size: 25px;
		font-weight: 400;
		display: inherit;
		text-shadow: 1px 1px 1px #000000, 1px 1px 1px #000000;
	}

	#AgencyCarousel p {
		background-color: rgba(0, 0, 0, 0.8);
		padding: 10px;
	}

	#agencyFooter {
		background-color: #f5f5f5;
		color: #12398a;
		font-size: 15px;
		line-height: 1.5em;
		border-bottom: 10px solid #245194;
		position: absolute;
		bottom: 0;
		width: 100%;
		z-index: 1029;
	}

	#agencyFooter a,
	#agencyFooter a:link,
	#agencyFooter a:active,
	#agencyFooter a:visited {
		color: #12398a;
		text-decoration: none
	}

	#agencyFooter a:hover {
		color: #2f4170;
		text-decoration: underline
	}

	#agencyFooter ul {
		list-style-type: none;
		margin-left: -38px;
	}

	/* ============================= Classes ============================= */


	/* WordPress Core CSS */
	.alignnone {
		margin: 5px 20px 20px 0
	}

	.aligncenter,
	div.aligncenter {
		display: block;
		margin: 5px auto 5px auto
	}

	.alignright {
		float: right;
		margin: 5px 0 20px 20px
	}

	.alignleft {
		float: left;
		margin: 5px 20px 20px 0
	}

	a img.alignright {
		float: right;
		margin: 5px 0 20px 20px
	}

	a img.alignnone {
		margin: 5px 20px 20px 0
	}

	a img.alignleft {
		float: left;
		margin: 5px 20px 20px 0
	}

	a img.aligncenter {
		display: block;
		margin-left: auto;
		margin-right: auto
	}

	.wp-caption {
		background: #fff;
		border: 1px solid #f0f0f0;
		max-width: 96%;
		/* Image does not overflow the content area */
		padding: 5px 3px 10px !important;
		text-align: center
	}

	.wp-caption.alignnone {
		margin: 5px 20px 20px 0
	}

	.wp-caption.alignleft {
		margin: 5px 20px 20px 0
	}

	.wp-caption.alignright {
		margin: 5px 0 20px 20px
	}

	.wp-caption img {
		border: 0 none;
		height: auto;
		margin: 0;
		max-width: 98.5%;
		padding: 0;
		width: auto
	}

	.wp-caption p.wp-caption-text {
		font-size: 11px;
		line-height: 17px;
		margin: 0;
		padding: 0 4px 5px
	}

	.screen-reader-text {
		clip: rect(1px, 1px, 1px, 1px);
		position: absolute !important;
		height: 1px;
		width: 1px;
		overflow: hidden
	}

	.screen-reader-text:focus {
		background-color: #f1f1f1;
		border-radius: 3px;
		box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
		clip: auto !important;
		color: #21759b;
		display: block;
		font-size: 14px;
		font-size: 0.875rem;
		font-weight: bold;
		height: auto;
		left: 5px;
		line-height: normal;
		padding: 15px 23px 14px;
		text-decoration: none;
		top: 5px;
		width: auto;
		z-index: 100000
			/* Above WP toolbar */
	}

	img.alignright {
		float: right;
		margin: 0 0 1em 1em
	}

	img.alignleft {
		float: left;
		margin: 0 1em 1em 0
	}

	img.aligncenter {
		display: block;
		margin-left: auto;
		margin-right: auto
	}

	.alignright {
		float: right
	}

	.alignleft {
		float: left
	}

	.aligncenter {
		display: block;
		margin-left: auto;
		margin-right: auto
	}

	/* End WP Core Classes */


	.agencyFooter_logo {
		width: 125px;
		height: 125px;
		border: none;
		text-align: center;
	}

	hr.clf {
		-moz-border-bottom-colors: none;
		-moz-border-left-colors: none;
		-moz-border-right-colors: none;
		-moz-border-top-colors: none;
		border-image: none;
		border: 1px solid #294172;
		margin-bottom: 20px;
		margin-top: 20px;
	}

	hr.title {
		-moz-border-bottom-colors: none;
		-moz-border-left-colors: none;
		-moz-border-right-colors: none;
		-moz-border-top-colors: none;
		border-image: none;
		border: 2px solid #d4d4d4;
		margin-bottom: 5px;
		margin-top: 5px;
	}

	.border_none {
		border: none;
	}

	.news_date {
		/*font-size: 14px;
font-style: italic;
text-align: left;
display: block;*/
		display: none;
	}

	.news_title,
	.news_title a,
	.news_title a:link,
	.news_title a:visited,
	.news_title a:hover,
	.news_title a:active {
		font-size: 18px;
		display: block;
		text-align: left;
		padding-bottom: 10px !important;
	}

	.news_desc {
		display: none;
		text-align: left;
		line-height: 1.5em;
		padding-bottom: 15px;
	}

	.agency_map {
		border: 0px;
		width: 710px;
		height: 600px;
		margin: 0px;
	}

	.agency_control {
		margin-top: 235px;
		color: #fff;
	}

	.carousel-caption {
		right: 0% !important;
		left: 0% !important;
		padding-bottom: 30px;
	}

	.carousel-control.left {
		background-image: none;
	}

	.carousel-control.right {
		background-image: none;
	}

	.carousel-indicators {
		position: absolute;
		bottom: 1px;
		left: 50%;
		z-index: 15;
		width: 60%;
		padding-left: 0;
		margin-left: -30%;
		text-align: center;
		list-style: none;
	}

	.carousel-indicators li {
		display: inline-block;
		width: 15px;
		height: 15px;
		margin: 2px;
		text-indent: -999px;
		cursor: pointer;
		background-color: rgba(255, 255, 255, 0);
		border: 1px solid #fff;
		border-radius: 10px;
	}

	.carousel-indicators .active {
		width: 18px;
		height: 18px;
		margin: 0;
		background-color: #fff;
	}

	.interiorTitle {
		color: #294172;
		font-size: 25px;
		text-transform: normal;
		font-family: 'Trebuchet MS', sans-serif;
		line-height: 1.0;
		padding-top: 30px !important;
		padding-bottom: 15px !important;
		background-color: #f5f5f5;
	}

	.interior-title-wrapper {
		margin-top: -20px;
		background-color: #e6dfcd;
	}

	.jumbo {
		font-size: 45px;
	}
}


/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
	/* ============================= ELEMENTS ============================= */

	/* ============================= ID's ============================= */

	/* ============================= Classes ============================= */
	.agency_control {
		margin-top: 230px;
	}
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

	/* ============================= ELEMENTS ============================= */
	#AgencyCarousel .carousel-caption h2 {
		font-family: 'Trebuchet MS', sans-serif !important;
		color: #ffffff !important;
		font-size: 25px;
		font-weight: 400;
		display: inherit;
		text-shadow: 1px 1px 1px #000000, 1px 1px 1px #000000;
	}

	/* ============================= ID's ============================= */
	#headerImage {
		height: 350px;
	}

	#main_content h3 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 300 !important;
		font-size: 28px;
		color: #2f4170 !important;
		margin-top: 0px;
	}

	#va_head {
		background-color: #f5f5f5;
		height: 75px;
		position: relative;
		z-index: 1000;
	}

	/* ============================= Classes ============================= */
	.agency_control {
		margin-top: 230px;
	}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

	/* ============================= ELEMENTS ============================= */
	#AgencyCarousel .carousel-caption h2 {
		font-family: 'Trebuchet MS', sans-serif !important;
		color: #ffffff !important;
		font-size: 25px;
		font-weight: 400;
		display: inherit;
		text-shadow: 1px 1px 1px #000000, 1px 1px 1px #000000;
	}

	/* ============================= ID's ============================= */
	#headerImage {
		height: 350px;
		padding-top: 50px;
	}

	#main_content h3 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 300 !important;
		font-size: 28px;
		color: #2f4170 !important;
		margin-top: 0px;
	}

	#va_head {
		background-color: #f5f5f5;
		height: 110px;
		position: relative;
		z-index: 1000;
	}

	/* ============================= Classes ============================= */
	.agency_control {
		margin-top: 140px;
	}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

	/* ============================= ELEMENTS ============================= */
	#AgencyCarousel .carousel-caption h2 {
		font-family: 'Trebuchet MS', sans-serif !important;
		color: #ffffff !important;
		font-size: 25px;
		font-weight: 400;
		display: inherit;
		text-shadow: 1px 1px 1px #000000, 1px 1px 1px #000000;
	}

	/* ============================= ID's ============================= */
	#headerImage {
		height: 600px;
		background-position: 10% 35%;
	}

	#main_content h3 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 300 !important;
		font-size: 28px;
		color: #2f4170 !important;
		margin-top: 0px;
	}

	#va_head {
		background-color: #f5f5f5;
		height: 125px;
		position: relative;
		z-index: 1000;
	}

	/* ============================= Classes ============================= */
	.agency_control {
		margin-top: 180px;
	}
}

/* ============================= CUSTOM MEDIA QUERIES ============================= */
/* Xtra-Small Portrait devices (phones, 400px and up) */
@media (max-width: 767px) {

	.carousel-inner>.item>img,
	.carousel-inner>.item>a>img {
		min-height: 400px;
		/* Set slide height here */
		max-width: 100%;
		object-fit: cover;
		overflow: hidden;
	}
}

/* Conditional Styles for IE Edge */
_:-ms-lang(x),
_:-webkit-full-screen,
.carousel-inner>.item>img,
.carousel-inner>.item>a>img {
	margin: auto;
	min-width: 100%;
	min-height: 100%;
}

@media (max-width: 874px) {
	.menu_text {
		position: absolute;
		margin-left: 60px;
		margin-top: -44px;
		opacity: 1;
		font-size: 20px;
		font-weight: bold;
		color: #12398a;
	}
}

@media (min-width: 875px) {
	.menu_text {
		position: absolute;
		margin-left: 60px;
		margin-top: -44px;
		opacity: 0;
		font-size: 20px;
		font-weight: bold;
		color: #12398a;
	}
}

@media (min-width: 1100px) {
	.menu_text {
		position: absolute;
		margin-left: 60px;
		margin-top: -100px;
		opacity: 0;
		font-size: 20px;
		font-weight: bold;
		color: #12398a;
	}
}

@media (min-width: 1300px) {
	.menu_text {
		position: absolute;
		margin-left: 60px;
		margin-top: -100px;
		opacity: 0;
		font-size: 20px;
		font-weight: bold;
		color: #12398a;
	}
}

/* ============================= END CUSTOM MEDIA QUERIES ============================= */

/*  =============== BEGINNING OF PMC STYLESHEET  ==============*/
#public-meetings a,
#public-meetings a:link,
#public-meetings a:active,
#public-meetings a:visited {
	color: #12398a;
	text-decoration: none;
	font-weight: bold;
}

#public-meetings a:hover {
	color: #a8a8a8;
	text-decoration: none;
	font-weight: bold;
}

ul.meeting-container>li {
	list-style-type: none;
}

.meeting-container {
	text-align: center;
	padding: 0px !important;
}

span.meeting-title {
	font-family: 'Montserrat', sans-serif;
	font-size: 25px;
	font-weight: 700;
	color: #606060;
}

span.meeting-agency {
	display: none;
}

span.meeting-date {
	font-style: italic !important;
	color: #7e8082;
	font-weight: bold;
	font-size: 17px;
}

span.meeting-time {
	font-style: italic !important;
	color: #7e8082;
	font-weight: bold;
	font-size: 17px;
}

span.meeting-end {
	font-style: italic !important;
	color: #7e8082;
	font-weight: bold;
	font-size: 17px;
}

span.meeting-purpose {
	display: none;
}

span.meeting-address {
	color: #7e8082;
	background-color: #f0f0f0;
	padding: 15px;
	border-radius: 4px;
	display: block;
}

a.map-link,
a.map-link:link,
a.map-link:active,
a.map-link:visited,
a.info-link,
a.info-link:link,
a.info-link:active,
a.info-link:visited {
	color: #12398a;
	background-color: #fff;
	text-decoration: none;
	font-weight: bold;
	border: 2px solid #2f4170;
	border-radius: 30px;
	padding: 15px 35px;
}

a.info-link:hover,
a.map-link:hover {
	color: #fff !important;
	background-color: #2f4170;
	text-decoration: none;
	font-weight: bold;
	border: 2px solid #2f4170;
	border-radius: 30px;
	padding: 15px 35px;
}

/*  =============== END OF PMC STYLESHEET  ==============*/






/*======================================= EVENT CALENDAR ================================*/
.eme-location-map {
	width: 100% !important;
	height: 350px !important;
}

.eme-calendar-table {
	font-size: 14px;
	width: 100%;
	height: 340px;
	background-color: #2f4170;
	color: #FFF;
}

table.fullcalendar td {
	border-color: #4A5967;
}

.month_name {
	color: #FFF;
	font-family: 'Trebuchet MS', sans-serif !important;
	font-weight: 600;
	font-size: 24px;
}

.eme-calendar-table thead th {
	padding: 10px 0px 10px 0px;
	text-transform: uppercase;
	color: #FFF;
	border-bottom: 1px solid #bbb;
	background: #2f4170;
	text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
}

.eme-calendar-table tbody td {
	color: #666;
	padding: 8px;
	text-align: center;
	border: 1px solid;
	border-color: #4A5967 #4A5967 #4A5967 #4A5967;
	background-color: #FFF;
}

table.eme-calendar-table td {
	padding: 2px !important;
	padding-top: 5px !important;
}

table.eme-calendar-table td.eventful a {
	color: #61aadd !important;
	font-weight: bold;
}

.prev-month {
	color: #FFF !important;
	font-size: 24px;
	font-family: 'Tahoma', sans-serif;
}

.next-month {
	color: #FFF !important;
	font-size: 24px;
	font-family: 'Tahoma', sans-serif;
}

.left-sidebar-interior tr td .next-month {
	color: #FFF !important;
	font-family: 'Open Sans', sans-serif;
}

.left-sidebar-interior tr td .prev-month {
	color: #FFF !important;
	font-family: 'Open Sans', sans-serif;
}

/** Specific Event Date Styles **/
table.eme-calendar-table td.eventful a {
	color: #fff !important;
	font-weight: bold;
	transition: 0.4s ease-in-out;
}

table.eme-calendar-table td.eventful a:hover {
	color: #FFF !important;
	transition: 0.4s ease-in-out;
	text-decoration: none !important;
	background-color: #2299d5 !important;
}

.eventful {
	background: #275996 !important;
	transition: 0.4s ease-in-out;
}

.eventful:hover {
	background-color: #2299d5 !important;
}

table.fullcalendar ul li {
	list-style-type: none;
}

table.fullcalendar td.month_name,
div.month_name {
	padding: 15px !important;
}

/*======================================= / END OF EVENT CALENDAR ================================*/

.label-success {
	background-color: #477C41;
}

/* **********************************************
 * CONSTANT CONTACT SUBSCRIBE FORM 
 ************************************************ */
#newsletter-signup {
	background-color: #294172;
	color: #ffffff;
}

#newsletter-signup .lead {
	font-size: 25px;
}

/* Change form width to 80% and center */
.ctct-form-container {
	width: 100%;
	position: relative;
	margin: 0 auto;
}

@media (min-width: 992px) {
	.ctct-form-container {
		width: 80%;
	}
}

/* Make container use flexbox to chnage form layout to be more horizontal */
#ctct_form_0 {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

/* Header is fullwidth plus bottom margin */
#ctct_form_0 .ctct-form-header {
	flex: 1 1 1000em;
	margin-bottom: 0 !important;
}

/* Fields are fullwidth */
#ctct_form_0 .ctct-form-header,
#ctct_form_0 .ctct-form-text,
#ctct_form_0 #gdpr_text,
#ctct_form_0 .ctct-form-error {
	flex: 1 1 1000em;
}

/* Place email, first, last name fields in 3 columns */

#ctct_form_0 #email_address_field_0,
#ctct_form_0 #first_name_field_0,
#ctct_form_0 #last_name_field_0 {
	flex: 1 1 1000em;
}

@media (min-width: 768px) {
	#ctct_form_0 #email_address_field_0 {
		flex: 1 1 1000em;
	}

	#ctct_form_0 #first_name_field_0,
	#ctct_form_0 #last_name_field_0 {
		flex: 2 2 1em;
	}
}

/* Relocate Google reCAPTCHA */
#ctct_recaptcha_0 {
	padding-bottom: 5rem !important;
}

.grecaptcha-badge {
	position: absolute !important;
	right: 2.5rem !important;
	bottom: 1rem !important;
}

@media (min-width: 556px) {
	.grecaptcha-badge {
		bottom: 2.25rem !important;
	}
}

/* Decrease width of submit button */
@media (min-width: 556px) {
	.ctct-form-button {
		width: 30% !important;
	}
}

@media (min-width: 768px) {
	.ctct-form-button {
		width: 35% !important;
	}
}

/* Increase disclaimer text size */
.ctct-gdpr-text {
	font-size: 1.5rem !important;
}

/* Increase form description text size */
p[data-qe-id="form-description"] {
	font-size: 2rem !important;
}

/* Hide CC branding */
.ctct-form-footer {
	display: none;
}

/* ***** END CONSTANT CONTACT SUBSCRIBE FORM ***** */


/* Utility helper styles */
.d-flex {
	display: flex;
	flex-wrap: wrap;
}

.align-items-center {
	display: flex;
	align-items: center;
}

.pt-2 {
	padding-top: 2em !important;
}

.p-2 {
	padding: 2em
}