/* ******************************************************************************************* */
/* ******************************************************************************************* */
/* Mega Menu Settings */
/* ******************************************************************************************* */
/* ******************************************************************************************* */

/* 
yellow: #ffc547
blue: #21409a

 */
#Header {
	background: #21409a;
	
}

#MainMenuTB {
	display: table;
	border-collapse: collapse;
	border-spacing: 0px;
	border: 0px;
	width: 100%;
}

#MainMenuTR {
	display: table-row;
}

#MainMenuTD0 {
	display: none;
}

#MainMenuTD1 {
	padding: 0px 0px 5px 10px; 
	display: table-cell;
	text-align: left;
	vertical-align: top;
}

#MainMenuTD1:hover > h1 {
	color: #ffc547 !important;
}
#MainMenuTD1:hover > h2 {
	color: white;
}


#MainMenuTD2 {
	display: table-cell;
	text-align: right;
	vertical-align: bottom;
}

#MainMenuTD1 h1 {
	font-family: "Times New Roman", Times, serif;
	color: white;
	line-height: 1.25;
	font-size: 28px;
}
#MainMenuTD1 h2 {
	color: #ffc547;
	line-height: 1;
	font-size: 14px;
	padding: 0px 0px 0px 0px; 
}


#h2br {
	display: none;
}

#MainMenuContainer {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	width: auto;
	display: inline-block;
}


 #DelawareVeteransCoalition {
 	width: 100%;
 	height: auto;
 	display: block
 }
 
 
.YellowRuleTop {
	display: none;
	padding: 0px 0px 0px 0px; 
	margin: 0px 0px 0px 0px;
	width: 100%;
	border-top: 2px solid #003399
}

.BlackRuleTop {
	padding: 0px 0px 0px 0px; 
	margin: 0px 0px 0px 0px;
	width: 100%;
	border-bottom: 2px solid #000000
}



#MainContent {
	padding: 0px 0px 0px 0px; 
	margin: 0px 0px 0px 0px;
}

#ShiftNavTD {
	display: none;
	width: 60px;
}

#DVCHeadingLogoWrapper {
	position: relative;
	margin: 0px 0px 0px 0px;
	padding: 3px 10px 0px 10px;
	width: auto;
	
}


#DVCHeadingLogo {
	top: 10px;
	right: 10px;
	width: 220px;
	height: auto;
	user-select: none;
	position: absolute;
	z-index: 100;
}
#DVCHeadingLogoMobile {
	display: none;
}

#HeadingWrapper {
	padding: 0px 0px 0px 0px; 
	margin: 0px 0px 0px 0px;
	background: #21409a;
/* 
	background-image: url("/CoastalGraphics/images/WhiteMarbleTile.png");
    background-repeat: repeat;
    background-position: 0 0;
 */
	width: 100%;
}

/* 
#HeadingMenuContainer {
	text-align: center;
	background-image: url('/CoastalGraphics/images/BrownMarble.jpg');
	background-repeat: repeat;
	background-position: top left;
}
 */
#HeadingMenuContainer {
	text-align: center;
	vertical-align: middle;
}

#MainHeadingContainer {
	text-align: right;
	margin: 0px 10px 0px 0px;
}

#MainHeadingWrapper {
	display: inline-block;
	width: auto;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}

.HeadingElegance {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	line-height: inherit;
	font-weight: inherit;
	text-decoration: inherit;
	color: inherit;
}

#HeadingPhoneWrapper {
	display: inline-block;
	width: auto;
	padding: 10px 0px 0px 20px;
	margin: 0px 0px 0px 0px;
	height: auto;
	vertical-align: top;
	user-select: none;
}
#HeadingPhoneWrapper a {
	display: inline-block;
	color: #003399;
	vertical-align: middle;
	font-size: 28px;
text-shadow: 0px 0px 2px #ffffff, 0px 0px 4px #ffffff, 0px 0px 6px #ffffff, 0px 0px 8px #ffffff, 0px 0px 10px #ffffff, 0px 0px 12px #ffffff, 0px 0px 14px #ffffff, 2px 2px 0px #ffffff, -2px -2px 0px #ffffff, 2px -2px 0px #ffffff, -2px 2px 0px #ffffff;
	user-select: none;
}
#HeadingPhoneWrapper a:hover {
	color: white;
}

#MainHeadingMobile {
  	font-family: "Times New Roman", Times, serif;
  	font-style: italic;
	color: white;
	font-size: 14px;
	margin: 1px 5px 1px 5px;
	user-select: none;
text-shadow: 0px 0px 2px #ffffff, 0px 0px 4px #ffffff, 0px 0px 6px #ffffff, 0px 0px 8px #ffffff, 0px 0px 10px #ffffff, 0px 0px 12px #ffffff, 0px 0px 14px #ffffff, 2px 2px 0px #ffffff, -2px -2px 0px #ffffff, 2px -2px 0px #ffffff, -2px 2px 0px #ffffff;
	display: none;
}

#MainSubHeadingMobile {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 200;
	font-style: normal;
	color: #dca96e;
	font-size: 13px;
	margin: 1px 5px 5px 5px;
	user-select: none;
text-shadow: 0px 0px 2px #ffffff, 0px 0px 4px #ffffff, 0px 0px 6px #ffffff, 0px 0px 8px #ffffff, 0px 0px 10px #ffffff, 0px 0px 12px #ffffff, 0px 0px 14px #ffffff, 2px 2px 0px #ffffff, -2px -2px 0px #ffffff, 2px -2px 0px #ffffff, -2px 2px 0px #ffffff;
	display: none;
}

/* 
br.h1br {
	display: none;
}
 */






/* ******************************************************************************************* */
/* ******************************************************************************************* */
/* Slider Styles */
/* ******************************************************************************************* */
/* ******************************************************************************************* */

#SliderSpacer {
	height: 200px;
	width: 100vw;
}

#SliderWrapper {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 1;
	width: 100vw;
	height: auto;
	background: #ffffff;
	opacity: 0;
   animation: fadeIn 2s ease-in forwards;
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}

.SliderText {
	font-family: 'Cormorant Garamond' !important;
	font-style: italic !important;
	font-weight: 600 !important;
	padding: 5px 10px 5px 10px;
	display: inline-block;
	max-width: 90vw !important;
	border: 2px solid white;
	-webkit-border-radius: 12px 12px 12px 12px;
	-moz-border-radius: 12px 12px 12px 12px;
	border-radius: 12px 12px 12px 12px;
	background: rgba(0,0,0,0.3) !important;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5) !important
}


.SliderBR1 {
	display: none;
}




/* 
#mega-menu-wrap-main-menu {
	width: auto;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	display: inline-block;
}
 */


ul#mega-menu-main-menu {
	text-align: right;
	width: auto;
	display: inline-block;
	margin: 0px;
	padding: 0px;
	height: auto;
	background-color: rgba(0,0,0,0) !important;
}

li.mega-menu-item {
	display: inline-block;
	margin: 0px !important;
	padding: 0px !important;
	user-select: none;
	background-color: rgba(0,0,0,0) !important;
}

li.mega-menu-item > a {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 200;
	display: inline-block !important;
	font-size: 20px !important;
	line-height: 1.7 !important;
	margin: 0 !important;
	padding: 2px 10px !important;
	color: #ffffff !important;
	cursor: pointer !important;
	user-select: none;
	height: 100% !important;
	vertical-align: middle !important;
	background-color: rgba(0,0,0,0) !important;

	/* ---- CENTER-OUT underline animation ---- */
	background-image: linear-gradient(#21409a, #ffc547) !important;
	background-repeat: no-repeat !important;
	background-position: 50% 100% !important;      /* center bottom */
	background-size: 0% 2px !important;           /* start at the center */
	transition: background-size 0.2s ease-out !important;
}

li.mega-menu-item > a:hover,
li.mega-menu-item > a:active {
	color: #ffc547 !important;
	background-size: 100% 2px !important;         /* expands to full width */
}

ul.mega-sub-menu li.mega-menu-item a {
	text-shadow: none;
}


/* 
li.mega-menu-item:nth-of-type(2) a {
    color: lime !important;
}
 */

/* 
li.mega-menu-item:nth-of-type(6),
li.mega-menu-item:nth-of-type(7),
li.mega-menu-item:nth-of-type(8),
li.mega-menu-item:nth-of-type(9),
li.mega-menu-item:nth-of-type(10) {
	border-top: 2px solid #ffffff !important;
}
 */

.fa-home {
	font-size: 22px;
	-webkit-transform:scale(1,1); !important; /* Safari and Chrome */
	-moz-transform:scale(1,1); !important; /* Firefox */
	-ms-transform:scale(1,1); !important; /* IE 9 */
	-o-transform:scale(1,1); !important; /* Opera */
	transform:scale(1,1); !important; /* W3C */
}

ul#mega-menu-main-menu ul.mega-sub-menu {
	border-top: 2px solid white !important;
	border-right: 2px solid white !important;
	border-left: 0px solid white !important;
	border-bottom: 0px solid white !important;
	display: inline-block !important;
	width: auto !important;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.5) !important;
	top: 35px !important;
	right: 0px !important;
}

ul#mega-menu-main-menu ul.mega-sub-menu > li.mega-menu-item {
	display: block;
	width: 100%;
}

ul#mega-menu-main-menu ul.mega-sub-menu > li.mega-menu-item a {
	color: #ffffff !important;
	background: #003399 !important;
	width: 100% !important;
	white-space: nowrap !important;
	border-bottom: 2px solid white !important;
}

ul#mega-menu-main-menu ul.mega-sub-menu > li.mega-menu-item a:hover,
ul#mega-menu-main-menu ul.mega-sub-menu > li.mega-menu-item a:active {
	color: #003399 !important;
	background: #ffffff !important;
}


#ShiftNavContainer {
	line-height: 0
	margin: 10px 0px 0px 0px;
}


/* ******************************************************************************************* */
/* ******************************************************************************************* */
/* Shift Nav Settings */
/* ******************************************************************************************* */
/* ******************************************************************************************* */

.shiftnav-toggle-button {
	background-color: none !important;
	background: none !important;
	padding: 0px !important;
	margin: 0px !important;
	font-size: 30px;
	color: #ffffff;
}

#shiftnav-toggle-main {
	background-color: black !important;
	padding: 0px !important;
	margin: 0px !important;
}

.shiftnav-main-toggle-content, .shiftnav-toggle-main-block {
	padding: 0px !important;
	margin: 0px 0px 0px 0px !important;
}


.shiftnav-toggle {
	color: #ffffff !important;
}


.shiftnav-toggle:hover, .shiftnav-toggle:active {
	background-color: none !important;
	background: none !important;
	color: #ffffff !important;
}

.shiftnav-panel-close  {
	z-index: 2000 !important;
	background-color: none !important;
	background: none !important;
}

.shiftnav {
	border-left: none !important;
	border-right: 1px solid white !important;
	background: #21409a;
	max-width: 300px !important
}


.shiftnav ul {
	border-top: 1px solid white !important;
	margin-top: 40px !important;
}

.shiftnav li {
	font-family: "Times New Roman", Times, serif !important;
	background-color: none !important;
	border-bottom: 1px solid white !important;
	color: #ffffff !important;
	border-left: none !important;
}

.shiftnav li a {
	color: #ffffff !important;
}

.shiftnav li a:hover {
	background: #ffffff !important;
	color: #cc0000 !important;
	font-family: "Times New Roman", Times, serif !important;
}

.shiftnav > ul > li:active, .shiftnav > ul > li:hover, .shiftnav > ul > li a:active, > ul > .shiftnav li a:hover {
	background-color: #ffffff !important;
	color: #ffc547 !important;

}

.shiftnav ul li.current-menu-item, .shiftnav ul li.current-menu-item a {
	background: #ffffff !important;
	background-color: #ffc547 !important;
	color: #21409a !important;
}

.shiftnav ul li.current-menu-item a:hover, .shiftnav  ul li.current-menu-item a:active {
	background: #ffffff !important;
	background-color: #ffc547 !important;
	color: #21409a !important; 
}


#shiftnav-main * {
	font-size: 20px !important;
	text-shadow: none !important;
}

button.shiftnav-panel-close {
	font-size: 18px !important;
	color: white !important;
	padding-bottom: 30px !important;
	top: 0px !important;
	position: absolute;
    z-index: 9999;           /* Keep it above the menu content */
}

.shiftnav .shiftnav-close {
    position: absolute;      /* Ensure we can place it freely */
    top: 10px;               /* Distance from the top edge */
    left: 10px;              /* Distance from the left edge */
    right: auto;             /* Override any right positioning */
    transform: none;         /* Remove centering transforms if present */
    z-index: 9999;           /* Keep it above the menu content */
}

/* Optional: give it a slightly larger hit area */
.shiftnav .shiftnav-close a,
.shiftnav .shiftnav-close {
    padding: 8px 12px;
}

@media screen and (max-width: 1470px) {

	h1#MainHeading {
		font-size: 22px;
		margin: 5px 5px 0px 5px;
	}

	h2#MainSubHeading {
		font-size: 18px;
		margin: 0px 8px 0px 8px;
	}
	li.mega-menu-item a {
		font-size: 16px !important;
	}

}
@media screen and (max-width: 1350px) {
	
	#MainMenuContainer {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 500px;
		display: inline-block;
	}

	#MainMenuContainer * {
		text-align: right !important;
		line-height: 1 !important;
	}

	ul#mega-menu-main-menu {
/* 
		text-align: center !important;
 */
	}


@media screen and (max-width: 1250px) {

	h1#MainHeading {
		font-size: 18px;
		margin: 5px 5px 0px 5px;
	}

	h2#MainSubHeading {
		font-size: 14px;
		margin: 0px 8px 0px 8px;
	}

}

@media screen and (max-width: 1150px) {

	#DVCHeadingLogo {
		top: 0px; 
		width: 230px;
		height: auto;
		user-select: none;
	}
}
@media screen and (max-width: 940px) {

	#MainMenuContainer {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
		width: 440px;
		display: inline-block;
	}

	li.mega-menu-item a {
		font-size: 14px !important;
	}
}


@media screen and (max-width: 870px) {

	#MainMenuContainer {
		margin: 0px 0px 15px 0px;
	}

	html, body {
	  overflow-x: hidden;
	  width: 100%;
	  max-width: 100%;
	}

	body {
	  padding: 52px 0px 0px 0px !important;
	}

	#Header {
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: 1000;
		width: 100%;
		
	}

	#MainMenuTD0 {
		padding: 5px 0px 0px 10px; 
		display: table-cell;
		text-align: left;
		vertical-align: top;
		width: 40px
	}

	
	#HeadingMenuContainer {
		text-align: center;
		height: 80px;
	}

	#DVCHeadingLogoWrapper {
		width: 10px;
	}

	#HeadingMenuContainer {
		text-align: center;
		vertical-align: middle
	}

	#MainHeadingWrapper {
		margin: 0px 0px 0px 0px;
	}

/* 
	#DVCHeadingLogo {
		left: -130px;
		height: 100px;
	}
 */

	#ShiftNavContainer {
		top: 30px; 
		left: 10px;
	}
	.HeadingElegance {
		display: none;
	}

/* 
	#MainHeadingWrapper {
		display: none;
	}

	h1#MainHeading {
		display: none
	}

	h2#MainSubHeading {
		display: none
	}
 */

	#MainHeadingMobile,
	#MainSubHeadingMobile {
		display: block;
	}

	#HeadingPhoneWrapper {
		padding: 0px 0px 0px 20px;
		display: inline-block;
	}
	.YellowRuleTop {
		display: block;
	}

	.BlueRuleTop {
		border-top: 2px solid #ffffff;
		border-bottom: 2px solid #003399
	}

	#ShiftNavTD {
		display: table-cell;
	}

	#MainMenuContainer {
		display: none;
	}
}

@media screen and (max-width: 720px) {

	#HeadingMenuContainer {
		display: none
	}

/* 
	#DVCHeadingLogoWrapper {
		text-align: center;
	}
 */
	
	#MainHeadingWrapper {
		display: none;
	}

	h1#MainHeading {
		display: none
	}

	h2#MainSubHeading {
		display: none
	}
}

@media screen and (max-width: 690px) {

	#MainHeadingMobile {
		font-size: 12px;
	}

	#MainSubHeadingMobile {
		font-size: 11px;
	}
}

@media screen and (max-width: 625px) {

	#MainHeadingMobile,
	#MainSubHeadingMobile {
		display: none;
	}
}

@media screen and (max-width: 440px) {
	
	body {
	  padding: 48px 0px 0px 0px !important;
	}

	#MainMenuTD0 {
		padding: 0px 0px 0px 10px; 
	}

	#MainMenuTD1 h1 {
		font-size: 20px;
	}
	#MainMenuTD1 h2 {
		font-size: 12px;
	}

	.vlp-layout-basic div {
		display: inline-block; !important;
		flex: auto !important;
	}

}

@media screen and (max-width: 430px) {


	#Header {
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: 1000;
		width: 100%;
		
	}
	
	#HeadingMenuContainer {
		text-align: center;
		height: 60px;
	}

	#DVCHeadingLogoWrapper {
		width: 10px;
	}


	#MainHeadingWrapper {
		margin: 0px 0px 0px 0px;
	}

	#DVCHeadingLogo {
		left: -110px;
		height: 80px;
	}

	.shiftnav-toggle-button {
		font-size: 32px;
	}
	
	#ShiftNavContainer {
		top: 22px; 
		left: 10px;
	}

	#HeadingMenuContainer {
		display: none
	}
	
	
	h1#MainHeading {
		display: none
	}

	h2#MainSubHeading {
		display: none
	}

	#HeadingPhoneWrapper {
		display: inline-block;
		padding: 2px 0px 0px 10px;
	}
	#HeadingPhoneWrapper a {
		font-size: 16px;
	}

	#HeadingPhoneWrapper {
		display: inline-block;
	}
	.YellowRuleTop {
		display: block;
	}

	.BlueRuleTop {
		border-bottom: 2px solid #003399
	}

	#ShiftNavTD {
		display: table-cell;
	}

	#MainMenuContainer {
		display: none;
	}
}

@media screen and (max-width: 380px) {

	body {
	  padding: 58px 0px 0px 0px !important;
	}

	#MainMenuTD0 {
		padding: 5px 0px 0px 10px; 
	}

	#MainMenuTD1 h1 {
		font-size: 18px;
	}
	
	#h2br {
		display: inline;
	}
}
@media screen and (max-width: 330px) {

	body {
	  padding: 52px 0px 0px 0px !important;
	}

	#MainMenuTD1 h1 {
		font-size: 18px;
	}
	#MainMenuTD1 h2 {
		font-size: 10px;
	}
}

@media screen and (max-width: 350px) {

	#HeadingPhoneWrapper {
		display: inline-block;
		padding: 2px 0px 0px 10px;
	}
	#HeadingPhoneWrapper a {
		font-size: 14px;
	}
}
@media screen and (max-width: 330px) {

	#HeadingPhoneWrapper a {
		font-size: 13px;
	}
}