/* 
 * Deprecated DNN CSS class names will remain available for some time
 * before being  permanently removed. Removal will occur according to
 * the  following process:
 *
 * 1. Removal will only occur with a major (x.y) release, neverMake spacing after list items in tabbed modules consistent with the rest of the site
 *    with a maintenance (x.y.z) release.Replace image gifs with Font Awesome
 * 2. Removal will not occur less than six months after the release
 *    when it was deprecated.
 * 3. Removal will not occur until after deprecation has been noted 
 *    in at least two major releases.
 *
 *                                              |        |Planned |
 *  Name                                        |Release |Removal |
 *----------------------------------------------+--------+--------+
 * Mod{NAME}C                                     5.6.2    6.2
 *   {NAME} = sanitized version of the DesktopModule Name 
 *   Used on <div> tag surrounding Module Content, inside container
 *----------------------------------------------+--------+--------+
 */

/* TEMPORARY DLA FIX FOR EDIT LINK IN ACCORDION */
/* August 5, 2024 */
/*#itemEditLink,#selectSeal, #updateSeal, #cancelSeal {
Visibility: visible;
top: 0px;
}*/



/* PAGE BACKGROUND */
/* background color for the header at the top of the page  */
.HeadBg {}

/* background color for the content part of the pages */
body {
	background-color: #ffffff;
}

Body {}

.ControlPanel {}

/* background/border colors for the selected tab */
.TabBg {}

.LeftPane {}

.ContentPane {}

.RightPane {}

/* text style for the selected tab */
.SelectedTab {}

/* hyperlink style for the selected tab */
A.SelectedTab:link {}

A.SelectedTab:visited {}

A.SelectedTab:hover {}

A.SelectedTab:active {}

/* text style for the unselected tabs */
.OtherTabs {}

/* hyperlink style for the unselected tabs */
A.OtherTabs:link {}

A.OtherTabs:visited {}

A.OtherTabs:hover {}

A.OtherTabs:active {}

/* GENERAL */
/* style for module titles */
.Head {}

/* style of item titles on edit and admin pages */
.SubHead {}

/* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */
.SubSubHead {}

/* text style used for most text rendered by modules */
.Normal {}

/* text style used for textboxes in the admin and edit pages, for Nav compatibility */
.NormalTextBox {}

.NormalRed {}

.NormalBold {
	font-weight:bold;
}

/* text style for buttons and link buttons used in the portal admin pages */
.CommandButton {}

/* hyperlink style for buttons and link buttons used in the portal admin pages */
A.CommandButton:link {
	display: inline-block;
	margin-bottom: 0;
	font-weight: normal;
	text-align: center;
	white-space: nowrap;
	/* vertical-align: middle; */
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	color: #fff;
	background-color: #337ab7;
	border-color: #2e6da4;
	text-decoration: none !important;
}

A.CommandButton:visited {
	color: #fff !important;
	background-color: #337ab7;
	border-color: #2e6da4;
}

A.CommandButton:hover {
	color: #fff !important;
	background-color: #286090;
	border-color: #204d74;
}

A.CommandButton:active {}

/* button style for standard HTML buttons */
.StandardButton {}

/* GENERIC */
/* Make all grays consistent */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, .Normal, .NormalDisabled, .NormalDeleted, body, html, button, input, select, textarea {
Color:#333;
}


H1 {}

H2 {}

H3 {}

H4 {}

H5,
DT {}

H6 {}

TFOOT,
THEAD {}

TH {}

A:link {}

/* Global link visited color */
a:visited {
	color: #6e41a0;
}

A:hover {}

A:active {}

SMALL {}

BIG {}

BLOCKQUOTE,
PRE {}


UL LI {}
/* Add margin between li's */
.DnnModule-DNN_HTML ul li,
.DnnModule-LiveHTML ul li {
    margin: 
1% auto;
}

UL LI LI {}

UL LI LI LI {}

OL LI {}

OL OL LI {}

OL OL OL LI {}

OL UL LI {}

HR {}

img {
	max-width: 100%;
	height: auto;
}

/* MODULE-SPECIFIC */
/* text style for reading messages in Discussion */
.Message {}

/* style of item titles by Announcements and events */
.ItemTitle {}

/* Menu-Styles */
/* Module Title Menu */
.ModuleTitle_MenuContainer {}

.ModuleTitle_MenuBar {}

.ModuleTitle_MenuItem {}

.ModuleTitle_MenuIcon {}

.ModuleTitle_SubMenu {}

.ModuleTitle_MenuBreak {}

.ModuleTitle_MenuItemSel {}

.ModuleTitle_MenuArrow {}

.ModuleTitle_RootMenuArrow {}

/* Main Menu */

.MainMenu_MenuContainer {}

.MainMenu_MenuBar {}

.MainMenu_MenuItem {}

.MainMenu_MenuIcon {}

.MainMenu_SubMenu {}

.MainMenu_MenuBreak {}

.MainMenu_MenuItemSel {}

.MainMenu_MenuArrow {}

.MainMenu_RootMenuArrow {}

/* Login Styles */
.LoginPanel {}

.LoginTabGroup {}

.LoginTab {}

.LoginTabSelected {}

.LoginTabHover {}

.LoginContainerGroup {}

.LoginContainer {}

h2.dnnFormSectionHead {
	font-size: 18px;
	color: #555
}

.banner .banner-right {
	background: transparent;
}
/* ---- TABLE STYLES ---- */
/* Forces tables to scroll, especially in smaller viewports */
@media (max-width: 590px) {
	#content table {
	display:block;
    overflow-x:auto;
}
}

/* Keeps content of tables full width - misaligns on Food Services page 
#content table tbody,
#content table thead {
    display: table;
    width: 100%;
}*/

/* Forces captions of tables wider than small viewports to still be readable */
@media (max-width: 768px) {
    table caption {
        max-width:75vw;
    }
}


.table-responsive {}

/* Adding zebra striping to tables in Form and List module with dnnFormItem class */
/* Changing bootstrap table-striped to darker gray color */
table.dnnFormItem tbody>tr:nth-of-type(odd),
.table-striped>tbody>tr:nth-of-type(odd)  {
background-color: #F2F2F2;
}

/*Makes table header font blue*/ 
.dnnFormAndList tr.dnnGridHeader th {
	color:#1f4a7f;
}

/*Hides the down gif in Form and List Headers when sorted*/ 
.dnnFormAndList table a[href$="descending" i] img, 
.dnnFormAndList table a[href$="ascending" i] img { 
display: none; 
} 

/*Form and List: AAdds Font Awesome down when XSLT template sorted descending*/ 
.dnnFormAndList table a[href$="descending"] span::after { 
font-family: serif, "FontAwesome"; 
content: "\00a0\f077"; 
} 

/*Form and List: Adds Font Awesome down when XSLT template sorted ascending*/ 
.dnnFormAndList table a[href$="ascending"] span::after {
font-family: serif, "FontAwesome"; 
content: "\00a0\f078"; 
} 

/* Adding blue background to Search Panel on Form and List module */
/* .dnnFormAndList .search-panel {
    background-color: #1f4a7f;
    padding: 8px;
	color:#444444;
} */
@media (max-width: 768px) {
.dnnFormAndList .search-panel {
margin:2rem auto 1rem;
padding:10px 10px 20px;
}
}

/* Adding white border to button in Search Panel on Form and List module */
.dnnFormAndList .search-panel .CommandButton.search-button {
	border:solid 1.5px #ffffff;
	max-height: 32px;
	display: inline;
	line-height: 4rem;
}

/* Changing text to white and bold within Search Panel on Form and List module */
.dnnFormAndList .search-panel a.CommandButton.search-button span,
.dnnFormAndList .search-panel span  {
color:#ffffff;
font-weight:bold;
}

/* Making the help label a Font Awesome question mark in the Search bar for Forms and List */
.dnnFormAndList .search-panel a.dnnFormHelp::after {
    font-family: 'FontAwesome';
    content: "\f059";
    color: white;
    font-size: 1.25em;
}

/* Creating the hover effect for the Font Awesome question mark in the Search bar for Forms and List */
.dma-full-width-centered.v2-template #content .dnnFormAndList .search-panel a.dnnFormHelp:hover {
    text-decoration: none;
    opacity: 70%;
}

/* Removing the gray i icon image from the Search bar for Forms and List */
.dnnFormAndList .search-panel a.dnnFormHelp {
background:none;
}

/* Removes transparency from the tooltip background in the Search bar for Forms and List */
.dnnFormAndList .search-panel .dnnTooltip .dnnFormHelpContent, .dnnHelperTip .dnnFormHelpContent {
background: rgba(0,0,0,1.0);
}

/* Removes left float on label  */
.dnnFormAndList .search-panel .dnnLabel { float:none; }

/* Making heights consistent within Search Panel on Form and List module */
.search-panel button,
.search-panel input,
.search-panel optgroup,
.search-panel select, 
.search-panel textarea {
    max-height: 32px;
    min-height: 32px;
	margin: 3px auto;
}

/* Changing the height and color of text in the Keywords area of the Search Panel on Form and List module */
/* .dnnFormAndList input::placeholder,
.dnnFormAndList input::-ms-input-placeholder,
input::placeholder,
.search-panel input::placeholder {
    color: #444444;
    line-height:1rem;
} */
.dnnFormAndList ::-webkit-input-placeholder {
    color: #444444;
    line-height:1rem;
	height: 23px;
}

.dnnFormAndList ::-moz-placeholder {
    color: #444444;
    line-height:1rem;
	height: 23px;
}

.dnnFormAndList ::-ms-placeholder {
    color: #444444;
    line-height:1rem;
	height: 23px;
}

.dnnFormAndList ::placeholder {
    color: #444444;
    line-height:1rem;
	height: 23px;
}

/* Making all Form and List modules horizontally scrollable when wider than the screen, and fill width of screen */
.dnnFormAndList table {
    overflow-x: auto;
    width:100%;
    display:table !important; /*keeps full width even when content in columns is smaller*/
}

/* Changing Form and List table headers to bold typography */
.dnnFormAndList .dnnGridHeader td,
.dnnFormAndList thead.dnnGridHeader th,
.dnnFormAndList tr.dnnGridHeader th,
.dnnFormAndList table tr td:first-child {
	font-weight:bold;
}

/* Includes the word Back to the right of the Back Arrow icon on Form and List Module details view */
.dnnFormAndList .fa-arrow-circle-left::after {
  	content: "BACK";
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1.3rem;
    font-weight: bold;
    position: relative;
    bottom: 5px; }

/* Add a space between the Column title and the ascending sort icon on Form and List Module */
.dnnFormAndList th.sorted.asc a::after {
    content: "\00a0\f077";
}

/* Add a space between the Column title and the descending sort icon on Form and List Module */
.dnnFormAndList th.sorted.desc a::after {
    content: "\00a0\f078";
}

/* Override module.css to keep links DLA blue. */
tr.dnnGridItem a,
 tr.dnnGridAltItem a {
	 color:#084476;
 }


/* ---- HEADER STYLES ---- */
/* Adding color to the top-nav menu when active page is selected */
.dropdown.top-level.parent,
.dropdown.top-level.active,
.top-level.active,
.top-level.parent {
	/* background-color:transparent; */
	background-color: #0076A3;
}

/* Adding styling to the top-nav menu when active page is selected in dropdown */
.dropdown-menu .active a {
	font-weight: 900;
	color: #337ab7;
	background-color: #ecf5f8;
}

/* Increase size of DLA acronym in the Header on mobile */
@media (max-width: 767px) {
	.skin-title .title-text {
		font-size: 32px;
		padding-bottom: 3px;
	}

	/* Moves mobile nav to touch the white DLA header bar*/
	.otnav {
		background: #133C6A;
		margin-top: -15px;
	}

	/*Adjusts background of mobile navigation Active/Parent indicator*/
	.dropdown.top-level.parent,
	.dropdown.top-level.active,
	.top-level.active,
	.top-level.parent {
		background-color: transparent !important;
	}

	/*Adjusts color of mobile navigation Active/Parent indicator*/
	.dropdown.top-level.parent>a,
	.dropdown.top-level.active>a,
	.top-level.active>a,
	.top-level.parent>a {
		color: #80aff5;
	}

	/*Adjusts styling of mobile navigation Active dropdown menu item*/
	.dropdown-menu .active a {
		color: #ffffff !important;
		background-color: #486591 !important;
		border-left: #80aff5 4px solid;
		padding-left: 3%;
		font-weight: 900 !important;
	}

    /** Removes hardcoded 30px right in mobile accordion menu**/
    .DnnModule-AccordionMenu div div {
    padding-right: 0px !important;
    }

    /* Removes extra padding above mobile accordion menus*/
    .dma-full-width-centered #content {
        padding-top: 0px !important;
    }  

    /** Adds margin above sister divs to the Accordion if that div does not have the class has-margin **/
    div.DnnModule-AccordionMenu + div:not(.has-margin) {
        margin-top:30px; 
    }

    /** Help make the footer text not get cut off on mobile view**/
    .col-footerlinks .padded {
        margin:0px;
    }

    /** Makes mobile view go full-width, but keeps top margin**/
    .has-margin {
        margin: 30px 0px !important;
    }
}




/* Modifying the size of the magnifying glass in the header when converting to mobile view for touch-size compliance */
.dma-full-width-centered.v2-template .mobile-search,
.dma-full-width.v2-template .mobile-search {
	padding-right: 0px;
	padding-top: 20px;
	font-size: 23px;
}

/* Hide swoop image in header background */
.dma-full-width-centered .skin-header-background,
.dma-full-width .skin-header-background {
	background: white !important;
}

/* Make search box wide enough for text to not be cut off */
.skin-search-input {
	width: 270px;
	font-size: 1.1rem;
}

/* Make search input boxes rectangular - no border radius */
.skin-search-input,
.form-control {
    border-radius:0px;
}


/* Ensure logo scales down when page is scrolled */
	.skin-logo img {
		max-height: 100% !important;
	}

/* Vertically align the DLA logo in header on desktop */
@media (min-width: 767px) {
	.skin-logo {
		height: 80px !important;
	}
}

/* Vertically align the DLA text of logo */
@media (min-width: 767px) {
	.skin-title {
		padding-top: 0px;
	}
}

/* Forces smaller size for logo on scroll */
.dma-full-width-centered.scroll .skin-logo,
.dma-full-width.scroll .skin-logo {
	height: 50px !important;
}

/* Add space above logo on fixed header scrolled */
.dma-full-width-centered.scroll .skin-header-left,
.dma-full-width.scroll .skin-header-left {
	padding-top: 3px;
}

/* Change top nav to solid color blue */
header .otnav {
	background: #133C6A !important;
}

/* Increase top nav font size by .5px */
.otnav li a {
	font-size: 12.5px;
}

/* Change/Override font size increase to 991 instead of 992 default in skin.css */
@media (max-width: 991px) {
	.otnav li a {
		font-size: 11px;
		padding: 10px 5px 10px 5px;
	}
}

/* Remove default left margin to keep nav from wrapping */
@media (min-width: 992px) {
	ul#main-nav {
        margin-left:0px;
    }
}

/* Increase height and center nav items vertically */
@media (min-width: 992px) {
	header .nav>li>a {
		padding: 13px 15px;
	}
}

/* Increase height of top nav bar to 44px */
@media (min-width: 992px) {

	.dma-full-width-centered .menu,
	.dma-full-width .menu {
		height: 44px !important;
	}
}

/* Update final item of breadcrumbs, the active link, to not appear the same as the links */
.skin-breadcrumb-container span span span:last-of-type .skin-breadcrumb,
.dma-full-width-centered.v2-template #content .skin-breadcrumb-container span span span:last-of-type .skin-breadcrumb:hover,
.dma-full-width.v2-template #content .skin-breadcrumb-container span span span:last-of-type .skin-breadcrumb:hover {
	color: #444444;
	font-style: normal;
	font-weight: 700;
}


/* Override breadcrumb visited color to stay navy */
.skin-breadcrumb-container span span span a:visited {
	color: #084476;
}

/* Increase font of breadcrumbs on page */
.dma-full-width-centered.v2-template .skin-breadcrumb-container,
.dma-full-width-centered.v2-template .skin-breadcrumb-container span,
.dma-full-width.v2-template .skin-breadcrumb-container,
.dma-full-width.v2-template .skin-breadcrumb-container span {
	font-size: 14px;
}

/* Adds margin around the breadcrumbs */
@media (max-width: 767px) {

	.dma-full-width-centered.v2-template .skin-breadcrumb-container,
	.dma-full-width.v2-template .skin-breadcrumb-container {
		margin: 20px 0 8px 0px !important;
	}
}

.dma-full-width-centered.v2-template .skin-breadcrumb-container,
.dma-full-width.v2-template .skin-breadcrumb-container {
	margin: 30px 0 8px 0px !important;
}


/* Override US Govt banner to have light gray bg and dark text */
.header_banner_container {
	background-color: #f3f3f3 !important;
	background: linear-gradient(to bottom, #f3f3f3 30px, #ccC 30px 100%);
	color: #1b1b1b !important;
}

/* Makes US Gov banner font size smaller */
.header_banner_container .header_banner_flag {
	font-size: 11px !important;
}

/* Override US Govt banner "here's how you know" text */
.header_banner_container .header_banner_accordion {
	color: #1b1b1b !important;
	font-size: 11px !important;
}

@media (min-width: 460px) and (max-width: 767px) {
	.header_banner_container .header_banner_flag {
		height: 30px !important;
	}
}

@media (max-width: 460px) {

	/* On mobile, adjusts color gradient for US govt banner, text is now two lines */
	.header_banner_container {
		background: linear-gradient(to bottom, #f3f3f3 50px, #ccC 50px 100%) !important;
	}
}

/* Establish maximum width on a desktop view to be 1170px */
@media (min-width: 1170px) {
	.header_banner_container .header_banner_inner {
		width: 1170px !important;
	}
}

/* Adds 85px to the top of the screen on mobile to adjust for the fixed header */
/* TEMPORARILY HIDDEN UNTIL DMA TICKET IS RESOLVED
.dma-full-width-centered.v2-template html{
	scroll-padding-top: 85px;
}
*/

/* Adds 130px to the top of the screen on larger than mobile to adjust for the fixed header */
/* TEMPORARILY HIDDEN UNTIL DMA TICKET IS RESOLVED
@media screen and (min-width: 768px){
.dma-full-width-centered.v2-template html{
	scroll-padding-top: 130px;
	}
}
*/

/* ---- FOOTER STYLES ---- */

/* DMA banner: Overrides navy blue text in skin.css */
.skin-footer-banner a,
.skin-footer-banner a:hover,
.skin-footer-banner a:visited {
	color: #fff !important;
}

/* DMA banner: Overrides white background in skin.css */
.skin-footer-banner {
	background-color: transparent !important;
}

/* Footer: make navy background */
.skin-footer-background {
	/* background-color:#002d56; */
	background-color: #133C6A;
}

/* Footer links built-in module, override link color */
.skin-footer-background .fleft a {
	color: #fff !important;
}

/*Color of the new built-in social icon modules*/
.skin-footer-background .social-item span {
	background: #8da7b4;
}

/* Color of the icons on hover */
.skin-footer-background .social-item:hover span {
	background: #001d39;
}

/* STAY CONNECTED Heading color */
.skin-footer-background .skin-social h3 {
	color: #fff;
}

/* Line under the STAY CONNECTED color */
.skin-footer-background footer h3 {
	border-bottom: 1px solid #fff;
}

/* Adds the dark blue eagle in the bottom right of footer */
footer .skin-footer-background,
.dma-full-width-centered footer .skin-footer-background,
.dma-full-width footer .skin-footer-background {
	background-image: url(/Portals/104/dla-eagle-footer.png) !important;
	background-repeat: no-repeat;
	background-size: 550px 356px !important;
	background-position: right -200px bottom -30px;
	padding-bottom: 30px;
}

/* Overrides the Veteran Hotline logo's size to make it smaller */
.skin-footer-banner .vcl {
	height: 45px !important;
}

/* Adds vertical space between DMA text and veteran hotline logo on mobile */
@media (max-width: 767px) {
	.skin-footer-banner .vcl {
		margin-top: 15px;
	}
}

/* ---- ACCORDION STYLES ---- */

/* USACE Template for Accordion - Changing Plus to Minus When Expanded */
.usaceAccordionMenuExpandedItem .fa-plus:before {
	content: "\f068";
}

/* USACE Template for Accordion - Changing Items to Hyperlink Blue and removing underline */
.usaceAccordionMenuListItem .listItem a {
	color: #084476;
	text-decoration-style: none !important;
	text-decoration: none !important;
	font-weight: normal !important;
}

/* Styling for USACE accordion template - bolds the currently expanded menu item */
.usaceAccordionMenuListItem.listitem-expanded div.lvl0 a,
.usaceAccordionMenuListItem.listitem-expanded:has(.current-item a) > .lvl1 a {
    font-weight: bold !important;
}

/* Styling for USACE accordion template - removes default border on last menu item */
.usaceAccordionMenuLastListItem {
	border-bottom: none !important;
}

/* Styling for USACE accordion template - adds border accents to top and bottom, and adds margins for spacing */
.acAccordionMenu {
	border-top: 8px solid #084476;
	border-bottom: 8px solid #EFEFEF;
	margin-top: 25px;
	padding-top: 5px;
	margin-bottom: 40px;
}

/* Provide right margin for accordion in FixedThird1 Pane */
div#dnn_CenterPane_FixedThird1  > .DnnModule-AccordionMenu {
margin-right: 30px !important;
}


/* Stylizing mobile accordion jump-menu */
.ac-jump-menu {
	-webkit-appearance: none;
	/*remove default select button style*/
	-moz-appearance: none;
	/*remove default select button style*/
	appearance: none;
	/*remove default select button style*/
	background-color: #F3F4F7;
	border-top: 6px solid #084476 !important;
	border: 0px;
	padding: 1.65rem 1.0rem;
	outline: 0px;
	color: #084476;
	font-weight: bold;
}

.ac-jump-menu-wrapper {
	margin: 1.5rem 0 0;
}

.ac-jump-menu-wrapper:after {
	content: '\f078';
	font: 19px "FontAwesome";
	color: #084476;
	right: 11px;
	top: 32px;
	padding: 0 0 2px;
	position: absolute;
	pointer-events: none;
}

/* To remove default select button from IE11's accordion mobile jump menu */
.ac-jump-menu::-ms-expand {
	display: none;
}

.ac-jump-menu-success {
	position: relative;
	z-index: 9999999;
}

/* Styles the current-item class in the Accordion Menu */
.acAccordionMenu li.usaceAccordionMenuListItem.current-item>div {
	background-color: #ecf5f8;
	border-left: #0076A3 4px solid;
	/*border-left: #3399cc 4px solid; */

}

.acAccordionMenu li.usaceAccordionMenuListItem.current-item>div a {
	font-weight: bold !important;
}

.acResponsive .caret span.fa {
	background-color: #ffffff;
}

/* This code fixes the typo DMA's jumpMenu.css file - they have both SHOW and HIDE at 768px */
/* At 767 px width, we want the jump menu to show - at 768px, we want the normal menu to show */
/* This code shows the mobile jump menu at MAXIMUM 767 px width */
/* This is now HIDDEN after DMA fixed the issue on the back end
@media screen and (max-width: 767px) {
    .ac-show-mobile-only {
        display: block;
    }
}
@media screen and (min-width: 768px) {
    .ac-show-mobile-only {
        display: none !important;
    }
    .ac-hide-mobile-only {
        display:block;
    }
}*/


/* ---- FULL WIDTH PAGE STYLES ----  */

/* Adds padding around the accordion menu so that it doesn't touch the main body content*/
@media screen and (min-width: 768px) {

	.dma-full-width-centered.v2-template #dnn_SidePane.flex-row-col-md-4,
	.dma-full-width.v2-template #dnn_SidePane.flex-row-col-md-4 {
		padding-right: 30px !important;
		padding-left: 0px !important;
		padding-top: 5px !important;
	}
}

/* Removes left margin and padding from the list-unstyled class  */
.dma-full-width-centered.v2-template .list-unstyled,
.dma-full-width.v2-template .list-unstyled {
	list-style: none;
	margin-left: 0px;
	padding-left: 0px;
}

/* Making the hamburger menu a little bigger when converting to mobile view for touch-size compliance */
.dma-full-width-centered.v2-template .skin-nav-toggle,
.dma-full-width.v2-template .skin-nav-toggle {
	min-height: 44px;
	min-width: 44px;
	font-size: 21px;
}

/* Increase height of the header in mobile view and add a drop-shadow */
@media (max-width: 767px) {

	.dma-full-width-centered.v2-template .skin-header,
	.dma-full-width.v2-template .skin-header {
		height: 70px;
		box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .15) !important;
		margin-bottom: 15px;
	}
}

/* Adding space between the footer and body text */
.dma-full-width-centered.v2-template #content,
.dma-full-width.v2-template #content {
	margin-bottom: 75px;
}

/* Increasing the margin above H2 headers */
.dma-full-width-centered.v2-template h2,
.dma-full-width.v2-template h2 {
	margin-top: 30px;
}

/* Increasing the height and margin of paragraph text for touch-size compliance*/
.dma-full-width-centered.v2-template p,
.dma-full-width.v2-template p {
	margin: 16px 0px;
	line-height: 1.5;
}

/* Increasing the height of list text for touch-size compliance
.dma-full-width-centered.v2-template li {
	line-height:1.5;
} This is messing with the top nav and other things. Fix before uncommenting */

/*Increasing font-size site-wide */
.dma-full-width-centered.v2-template body,
.dma-full-width.v2-template body,
.dma-full-width-centered.v2-template p,
.dma-full-width.v2-template p,
.dma-full-width-centered.v2-template ul,
.dma-full-width.v2-template ul,
.dma-full-width-centered.v2-template ol,
.dma-full-width.v2-template ol,
.dma-full-width-centered.v2-template .Normal,
.dma-full-width.v2-template .Normal,
.dma-full-width-centered.v2-template .NormalDisabled,
.dma-full-width.v2-template .NormalDisabled,
.dma-full-width-centered.v2-template .NormalDeleted,
.dma-full-width.v2-template .NormalDeleted,
.dma-full-width-centered.v2-template table,
.dma-full-width.v2-template table {
	font-size: 16px !important;
}

/* Adding underline to hyperlinks when hovering for 508 compliance */
.dma-full-width-centered.v2-template a:hover,
.dma-full-width.v2-template a:hover {
	text-decoration: underline;
}

/* Removes underline styling in accordion menu and top nav menu */
.dma-full-width-centered.v2-template .otnav a:hover,
.dma-full-width.v2-template .otnav a:hover,
.dma-full-width-centered.v2-template .acAccordionMenu a:hover,
.dma-full-width.v2-template .acAccordionMenu a:hover {
	text-decoration: none;
}

/* Thicken and Darken HR */
.dma-full-width-centered.v2-template hr,
.dma-full-width.v2-template hr {
	border-top: 2px solid #ddd;
}

/* This removes the default top margin from a H2, H3, H4, H5, H6 or p or table element if it is the first element located in an outlined container */
.dma-full-width-centered.v2-template .containers-v2 h2:first-child,
.dma-full-width.v2-template .containers-v2 h2:first-child,
.dma-full-width-centered.v2-template .containers-v2 h3:first-child,
.dma-full-width.v2-template .containers-v2 h3:first-child,
.dma-full-width-centered.v2-template .containers-v2 h4:first-child,
.dma-full-width.v2-template .containers-v2 h4:first-child,
.dma-full-width-centered.v2-template .containers-v2 h5:first-child,
.dma-full-width.v2-template .containers-v2 h5:first-child,
.dma-full-width-centered.v2-template .containers-v2 h6:first-child,
.dma-full-width.v2-template .containers-v2 h6:first-child,
.dma-full-width-centered.v2-template .containers-v2 p:first-child,
.dma-full-width.v2-template .containers-v2 p:first-child,
.dma-full-width-centered.v2-template table td p:first-child,
.dma-full-width.v2-template table td p:first-child {
	margin-top: 0px;
}

/* Newer container titles - reduce font to 30px from default of 38px, to fit to h2 style*/
.dma-full-width-centered.v2-template .containers-v2 .container-title,
.dma-full-width.v2-template .containers-v2 .container-title {
	font-size: 30px;
}

/* Remove caret/arrow from container style Labeled-H2-title and Labeled */
.containers-v2.labeled .spacecom-label i {
	display: none;
}

/* removes h2 label background and extras from mobile view */
@media (max-width: 991px) {
    .containers-v2.labeled .spacecom-label {
    background-color: transparent;
    color: #254267;
    padding: 0px;
    line-height: 33px;
    position: relative;
    top: 0px;
    right: 0;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 1px;
    display: block;
    height: 100%;
    margin-left: 0px;
    margin-bottom: 20px;
text-align:center !important;
}

.containers-v2.labeled {
    border-top: none;
    padding-top: 0px;
    margin-top: 0px;
}

/* keeps mobile view labeled h2 headers blue */
.containers-v2.labeled .spacecom-label .container-title-use-heading {
color:#254267 !important;

}

/* removes triangle on the left-side of labeled h2 headers */
.containers-v2.labeled .spacecom-label::before {
display:none;
}
}

/** Increase the width of the date columns in the tables for the Event modules **/
.dma-full-width-centered.v2-template .ThemeMinimalExtropy .ListDate,
.dma-full-width.v2-template .ThemeMinimalExtropy .ListDate {
	width: 120px;
}

/*Adjust colors of the square page numbers on the Orgs main pages - top news sliders*/
.dma-full-width-centered.v2-template #content .top-rotator .slideContainer .page:hover {
	color: white;
	text-decoration: none;
	background-color: #B41019;
}

/* ---- HYPERLINK STYLES ----  */

/* Forcing links to be navy blue */
.dma-full-width-centered.v2-template a.SubHead,
.dma-full-width.v2-template a.SubHead {
	color: #084476 !important;
}

/*This adds the underline to ALL links in the content area of the page*/
.dma-full-width-centered.v2-template #content a,
.dma-full-width.v2-template #content a {
	/*line-height: inherit;*/
	/*font-weight: bold;*/
	text-decoration-style: solid !important;
	text-decoration-color: rgba(8, 68, 118, 0.4) !important;
	text-decoration-thickness: 1.0px !important;
	text-underline-offset: 1.5px;
	text-decoration: underline;
}

/*This adds the underline to ALL Visited links in the content area of the page*/
.dma-full-width-centered.v2-template #content a:visited,
.dma-full-width.v2-template #content a:visited {
	text-decoration-style: solid !important;
	text-decoration-color: rgba(110, 65, 160, 0.4) !important;
	text-decoration-thickness: 1.0px !important;
	text-underline-offset: 1.5px;
	text-decoration: underline;
}

/* On hover, this aligns the underline styling with link and hover */
.dma-full-width-centered.v2-template #content a:hover,
.dma-full-width.v2-template #content a:hover {
	text-decoration-style: solid !important;
	text-decoration-color: #B41019 !important;
	text-decoration-thickness: 1.0px !important;
	text-underline-offset: 1.5px;
	text-decoration: underline;
	color: #B41019;
}

/* Removes underline for links in breadcrumbs */
.dma-full-width-centered.v2-template #content .skin-breadcrumb-container a,
.dma-full-width.v2-template #content .skin-breadcrumb-container a {
	text-decoration: none;
}

/* Don't have the tabbed module active blocks turn red with underline */
.z-tabs.flat.flat-af-blue>ul.z-tabs-nav>li.z-active>a,
.z-tabs.flat.flat-af-blue>ul.z-tabs-mobile.z-state-closed>li a,
.z-tabs.flat.flat-af-blue>ul.z-tabs-mobile>li a,
.z-tabs.flat.flat-midnight-blue>ul.z-tabs-nav>li.z-active>a,
.z-tabs.flat.flat-midnight-blue>ul.z-tabs-mobile.z-state-closed>li a,
.z-tabs.flat.flat-midnight-blue>ul.z-tabs-mobile>li a
 {
	color: white !important;
	text-decoration: none !important;
}

/* Remove the underline decoration from tabbed modules */
#content .z-tabs.flat>ul>li>a {
	text-decoration: none !important;
}

/* Targets the first h2 in a tabbed module box and removes the default top margin */
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner h2:first-of-type {
margin-top:0px !important;
}

/* Forces title in mobile view of Tabbed Modules to not overlap the tabbed modules navigation*/
.dma-full-width-centered.v2-template .z-tabs .z-tabs-nav.z-tabs-mobile span.z-title {
display: inline-block;
max-width: 85%;
}

/* Make line height of lists in tabbed modules consistent with the rest of the site */
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ul,
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ol {
    line-height: 1.5;
}

/* Make spacing after list items in tabbed modules consistent with the rest of the site */
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ul li,
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ol li {
    margin-bottom: 18px;
  }

/* Make line height of lists in tabbed modules consistent with the rest of the site */
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ul,
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ol {
    line-height: 1.5;
}

/* Make spacing after list items in tabbed modules consistent with the rest of the site */
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ul li,
.dma-full-width-centered.v2-template .z-tabs > .z-container >.z-content > .z-content-inner ol li {
    margin-bottom: 18px;
  }

/* Makes mobile view of tabbed modules have a gray background and space on the left and right before text */
.z-tabs.mobile {
    background-color: #eff0f2;
}
.z-tabs.mobile >.z-container >.z-content {
width:90% !important;
margin:auto;
}


/* ---- EXPANDABLE TEXT MODULE STYLES ---- */

/* Adds margin below the expandable text module */
.dma-full-width-centered.v2-template .DnnModule-ICGModulesExpandableTextHtml,
.dma-full-width.v2-template .DnnModule-ICGModulesExpandableTextHtml {
	margin-bottom: 2em;
}

/* Adds background color, margin and padding to each item in the expandable text module */
.dma-full-width-centered.v2-template .ICG_ETH_Expanders,
.dma-full-width.v2-template .ICG_ETH_Expanders {
	background-color: #EDEFF4;
	margin: 1.25em 0 0;
	padding: 1em;
	overflow: hidden;
}

/* Within the expandable module, this adds styling to the direct child div of the div that directly follows .ICG_ETH_Expanders */
.dma-full-width-centered.v2-template .ICG_ETH_Expanders+div>div,
.dma-full-width.v2-template .ICG_ETH_Expanders+div>div {
	border: 1px solid #EDEFF4;
	padding: 1.5em;
}

/* Increases weight, color and size of title of the Expander div */
.dma-full-width-centered.v2-template .ICG_ETH_Title,
.dma-full-width.v2-template .ICG_ETH_Title {
	font-size: 16px;
	font-weight: bold;
	color: #084476;
}

/* Removes margin above h2 in expandable text module*/
.dma-full-width-centered.v2-template .ICG_ETH_Expanders + div > div h2:first-of-type {
margin-top:0px !important;
}

/* Removes underline style from Expandable Text Titles */
.dma-full-width-centered.v2-template .ICG_ETH_Title a,
.dma-full-width.v2-template .ICG_ETH_Title a {
	text-decoration: none !important;
}

/* Enforcing h3 as the same style as if it were a plain title  */
.dma-full-width-centered.v2-template .ICG_ETH_Expanders h3,
.dma-full-width.v2-template .ICG_ETH_Expanders h3 {
	font-size: 16px;
	display: inline;
	font-weight: bold;
	margin: 0
}

/* Better aligns the + and - images used in the expanders */
.dma-full-width-centered.v2-template .ICG_ETH_Title img,
.dma-full-width.v2-template .ICG_ETH_Title img {
	vertical-align: top;
	padding-top: 3px;
}

/* In expandable text, this floats the +/- sign and gives it a width*/
.dma-full-width-centered.v2-template .ICG_ETH_Title a:first-child,
.dma-full-width.v2-template .ICG_ETH_Title a:first-child {
	float: left;
	width: 25px;
	max-width: 8%;
}

/* In expandable text, floats the second <a> item and gives it a width*/
.dma-full-width-centered.v2-template .ICG_ETH_Title a:nth-child(2),
.dma-full-width.v2-template .ICG_ETH_Title a:nth-child(2) {
	float: left;
	width: 90%;
}


/* ---- NEWS AND OTHER ARTICLECS STYLES ---- */
/* Change bold font on News list articleCS on homepage back to Normal (post AFPIMS code update) */
.dma-full-width-centered.v2-template #content .DnnModule-ArticleCSDashboard a,
.dma-full-width.v2-template #content .DnnModule-ArticleCSDashboard a {
    font-weight: normal;
}

/* Remove the darkened overlay in the ActicleCS Dashboard DOD-Card template */
.dma-full-width-centered.v2-template .dod2-card__image::after,
.dma-full-width.v2-template .dod2-card__image::after {
	background: transparent !important;
}

/* This removes any extra margins above content of news card on Main news page, full-width */
@media only screen and (min-width: 992px) {

	.dma-full-width-centered.v2-template .dod2-card:hover .dod2-card__content,
	.dma-full-width.v2-template .dod2-card:hover .dod2-card__content,
	.dma-full-width-centered.v2-template .dod2-card:focus .dod2-card__content,
	.dma-full-width.v2-template .dod2-card:focus .dod2-card__content,
	.dma-full-width-centered.v2-template .dod2-card:active .dod2-card__content,
	.dma-full-width.v2-template .dod2-card:active .dod2-card__content {
		margin-top: 0px;
	}
}

/* This reduces the size of Title text to make room on the cards */
.dma-full-width-centered.v2-template .dod2-card__title,
.dma-full-width.v2-template .dod2-card__title {
	font-size: 2.2rem;
	font-size: 1.75rem;
	line-height: 2.3rem;
}

/* This increases the max height of the description field so that READ MORE shows up */
@media only screen and (min-width: 992px) {

	.dod2-card:active .dod2-card__description,
	.dod2-card:focus .dod2-card__description,
	.dod2-card:hover .dod2-card__description {
		max-height: 100% !important;
	}
}

/* Removes default underline for hyperlinks in news module */
.dma-full-width-centered.v2-template #content .DnnModule-ArticleCSDashboard a,
.dma-full-width.v2-template #content .DnnModule-ArticleCSDashboard a {
	text-decoration: none;
}

/* Keeps news module button hyperlink functionality rather than global hyperlink treatment */
.dma-full-width-centered.v2-template #content .adash.adash-explore .read-more-link:hover,
.dma-full-width.v2-template #content .adash.adash-explore .read-more-link:hover {
	background-color: #000;
	color: #fff;
}

/* This overrides the font-size and underline styling when using the ArticleCS Listing template (see News) */
.dma-full-width-centered.v2-template .alist.news .title a,
.dma-full-width.v2-template .alist.news .title a {
	font-size: 1.5em;
	text-decoration: none !important;
	line-height: 1em !important;
}

/* This overrides the hyperlink and hover styling for the ArticleCS Listing module's admin options (see News) */
.dma-full-width-centered.v2-template #content a.btn.btn-primary,
.dma-full-width.v2-template #content a.btn.btn-primary {
	color: #fff;
	text-decoration-color: #fff !important;
}

/* This overrides the hover styling for the pagination above the ArticleCS Listing module (see News) */
.dma-full-width-centered.v2-template #content .pagination>.active>a,
.dma-full-width.v2-template #content .pagination>.active>a {
	color: #fff !important;
	text-decoration: none;
}

/* This overrides to 16px when there are no <p> tags in article views - typically in older articles */
.dma-full-width-centered.v2-template .adetail.blog .body,
.dma-full-width.v2-template .adetail.blog .body,
.dma-full-width-centered.v2-template .adetail.news .body,
.dma-full-width.v2-template .adetail.news .body,
.dma-full-width-centered.v2-template #content .adetail.news .body,
.dma-full-width.v2-template #content .adetail.news .body,
.dma-full-width-centered.v2-template .adetail.transcript .body,
.dma-full-width.v2-template .adetail.transcript .body,
.dma-full-width-centered.v2-template .adetail.speeches .body,
.dma-full-width.v2-template .adetail.speeches .body,
.dma-full-width-centered.v2-template .adetail.bio .body,
.dma-full-width.v2-template .adetail.bio .body,
.dma-full-width-centered.v2-template .adetail.factsheet .body,
.dma-full-width.v2-template .adetail.factsheet .body {
	font-size: 16px;
}

/* This ensures that the Line Height in the news body is 1.5, we were seeing the DATELINE take an extra line */
.dma-full-width-centered.v2-template .adetail.news .dateline-text,
.dma-full-width.v2-template .adetail.news .dateline-text {
	font-size: 16px;
	line-height: 1.5;
}

/* This changes the hyperlink colors in an ArticleCS detail view to match standard hyperlink color */
.dma-full-width-centered.v2-template #content .adetail .body a:link,
.dma-full-width.v2-template #content .adetail .body a:link,
.dma-full-width-centered.v2-template #content .adetail .body a:visited,
.dma-full-width.v2-template #content .adetail .body a:visited {
	color: #084476;
}

/* This changes the hyperlink-hover colors in an ArticleCS detail view to match standard hyperlink-hover color */
.dma-full-width-centered.v2-template #content .adetail .body a:link:hover,
.dma-full-width.v2-template #content .adetail .body a:link:hover,
.dma-full-width-centered.v2-template #content .adetail .body a:hover,
.dma-full-width.v2-template #content .adetail .body a:hover {
	color: #b41019;
}

/* Modifies Accordions Embedded in ArticleCS Body (Currently in Applications) */
/* Styles the Accordion Supertokens in ArticleCS to match other Accordion styles across the site */
.dma-full-width-centered.v2-template #content .ast-accordion>.ast-accordion-target>.ast-accordion-item>.ast-accordion-label,
.dma-full-width.v2-template #content .ast-accordion>.ast-accordion-target>.ast-accordion-item>.ast-accordion-label {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	background-color: #edeff4;
	color: #084476;
	border-radius: 0px !important;
	letter-spacing: 0;
}

.dma-full-width-centered.v2-template #content .ast-accordion>.ast-accordion-target>.ast-accordion-item>.ast-accordion-content,
.dma-full-width.v2-template #content .ast-accordion>.ast-accordion-target>.ast-accordion-item>.ast-accordion-content {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #444444;
	border: 1px solid #edeff4;
	letter-spacing: 0;
}

/* Keeps right aligned areas of ArticleCS inline when embedded in the right column feature pane */
@media (min-width: 992px) and (max-width: 1470px) {
    #dnn_FeaturePane .media-inline.media-inline-right {
        float:none;
        margin: 2% auto;
        display:block;
    }
}


/* ---- LEADERSHIP BIO STYLES ---- */
/* Bios 8x10 on desktops */
.adash-bio .dimg {
	height:300px;
	width:240px;
	object-fit:cover;
	object-position:bottom bottom;
}
@media (min-width:470px) and (max-width:569px) {
	.adash-bio .dimg {
		height:145px;
		width: 116px;
		object-fit:cover;
		object-position:bottom bottom;
	}
}
@media (min-width:570px) and (max-width:640px) {
	.adash-bio .dimg {
		height:250px;
	width:187px;	
		object-fit:cover;
		object-position:bottom bottom;
	}
}
@media (min-width:768px) and (max-width:990px) {
	.adash-bio .dimg {
		height:170px;
	width:136px;	
		object-fit:cover;
		object-position:bottom bottom;
	}
}

/* ---- APPLICATION STYLES (ArticleCS type Applications) & AVIATION VENDOR STYLES (ArticleCS type Vendor Information) ---- */

/* Specific to /Working-With-DLA/Applications/All-Applications/ */
/* Removes the DATE from list view */
#dnn_ctr99668_ContentPane .alist .date {
	display: none;
}

/* Overrides the ArticleCS-Dashboard type 'Categories' - removes the default gray folder */
.ModArticleCSDashboardC ul.da_tree img[src$=".png"] {
	display: none;
}

/* Overrides the ArticleCS-Dashboard type 'Categories' - adds a FA folder */
.ModArticleCSDashboardC ul.da_tree li:before {
	font-family: 'FontAwesome';
	content: '\f07b';
	margin: 0 5px 0 -15px;
	color: #777;
}

/* Specific to /Working-With-DLA/Applications/Details (dnn_ctr99669_ModuleContent) */
/* Also specific to /Aviation/Business/Vendor-Information-Hub/Details (dnn_ctr104799_ModuleContent) */
/* Also specific to modules that include id (app_embed) */
/* Removes the word "APPLICATIONS" and the DATE from the top of the Article Detail view */
#dnn_ctr99669_ModuleContent .adetail .category-date,
#dnn_ctr104799_ModuleContent .adetail .category-date,
#app_embed .adetail .category-date {
	display: none;
}

/* Adds a margin on top of Application Details page, Vendor Information Details page, and embedded apps */
@media screen and (min-width: 768px) {
	#dnn_ctr99669_ModuleContent, #dnn_ctr104799_ModuleContent {
		margin-top: 15px;
	}

	#app_embed {
		margin-top: 30px;
	}
}

/* Modifies the button (big-link) at the top of all the Application and Vendor Information Details pages */
#dnn_ctr99669_ModuleContent .ast-biglink a.btn.btn-primary,
#dnn_ctr104799_ModuleContent .ast-biglink a.btn.btn-primary,
#app_embed .ast-biglink a.btn.btn-primary {
	letter-spacing: 0.05em;
	color: #fff !important;
	text-decoration: none !important;
	padding: 3% 4% !important;
	font-size: 110% !important;
	background-color: #084476;
}

/* Modifies the button (big-link) at the top of all the Application and Vendor Information Details pages when user hovers over the button */
#dnn_ctr99669_ModuleContent .ast-biglink a.btn.btn-primary:hover,
#dnn_ctr104799_ModuleContent .ast-biglink a.btn.btn-primary:hover,
#app_embed .ast-biglink a.btn.btn-primary:hover {
	background-color: #3399cc !important;
	text-decoration: underline !important;
}

/* fa fa-external-link-alt is not a valid FontAwesome icon (but DMA is using it in their code) */
/* The correct way is: fas fas-external-link-alt OR fa fa-external-link */
/* By default, DMA's code always tries to display an external-link icon in a BigLink supertoken */
/* If DMA ever fixes it on their end, we might see 2 external-link icons show up -- this is where we would fix that issue */
#dnn_ctr99669_ModuleContent .adetail .body .ast-biglink .fa-external-link-alt,
#dnn_ctr104799_ModuleContent .adetail .body .ast-biglink .fa-external-link-alt,
#app_embed .adetail .body .ast-biglink .fa-external-link-alt {
	display: inline-block;
	font-family: FontAwesome;
}

/* f08e is the external-link icon */
#dnn_ctr99669_ModuleContent .adetail .body .ast-biglink i:before,
#dnn_ctr104799_ModuleContent .adetail .body .ast-biglink i:before,
#app_embed .adetail .body .ast-biglink i:before {
	content: '\f08e';
	font-size: 130%;
}

/* f2c1 is the badge icon -- 00a0 is a space -- f08e is the external-link icon */
#dnn_ctr99669_ModuleContent .adetail .body .cac .ast-biglink i:before,
#dnn_ctr104799_ModuleContent .adetail .body .cac .ast-biglink i:before,
#app_embed .adetail .body .cac .ast-biglink i:before {
	content: '\f2c1\00a0\00a0\f08e';
	font-size: 130%;
}

/* Removes the thin black underline that AFPIMS adds when using the GRID or SPLIT supertokens */
.adetail.blog .ast-grid .item .body,
.adetail.news .ast-grid .item .body,
.adetail.transcript .ast-grid .item .body,
.adetail.speeches .ast-grid .item .body,
.adetail.bio .ast-grid .item .body,
.adetail.factsheet .ast-grid .item .body,
.adetail.blog .ast-split .item .body,
.adetail.news .ast-split .item .body,
.adetail.transcript .ast-split .item .body,
.adetail.speeches .ast-split .item .body,
.adetail.bio .ast-split .item .body,
.adetail.factsheet .ast-split .item .body {
	border-bottom: none !important;
}

/* ---- MISC STYLES ---- */

caption {
	color:#333;
}

/* DVIDS video wrapper code for .VideoWrapper and .VideoWrapper iframe */
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 25px;
	height: 0;
}

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* DVIDS Tag and Playlists Hover Override */
.DVIDSMediaTags span a:hover {
color: #FFF !important;
}

.DVIDSDropDown .navbar-nav > .open > a, .DVIDSDropDown .navbar-nav > .active > a:hover {
color: #fff !important;
}

/* New document style class, rotates doc image, adds shadow, border, and margin. */
.document-tn {
	transform: rotate(3deg);
	box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 3px 20px 0 rgb(0 0 0 / 19%);
	border: 1px solid #ccc;
	margin-bottom: 3%;
}

/* Button style that matches AFPIMS' default READ MORE Button */
.btn-readmore {
	text-align: center;
	margin-top: 15px;
	font-size: 16px;
	border: 1px solid #000;
	border-radius: 8px;
	background: #fff;
	padding: 8px 16px;
	text-transform: uppercase;
	color: #000 !important;
	transition: all 200ms linear;
}

.btn-readmore:hover {
	background: #000;
	color: #fff !important;
	text-decoration: none !important;
}

/* For large standalone background images with text - makes them responsive on smaller screens */
@media (max-width: 1199px) {
.mobile-img-responsive-swap .pdbg-container {
    background-size:contain;
    background-repeat:no-repeat;
    height:calc(0.4 * 100vw) !important;
}
}

/** Form and List Reusable Components **/

/*Ordered List Counter with Blue Circle */
.orderedList-counter ol {
    list-style: none !important;
    counter-reset: step-counter !important;
}

.orderedList-counter ol>li {
    counter-increment: step-counter !important;
}

.orderedList-counter ol>li::marker {
    display: none !important;
}

.orderedList-counter ol>li::before {
    content: counter(step-counter);
    color: #084476 !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    background-color: white;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    border: 2px solid #084476;
    margin: 5px;
}

/*White Link and Text Wrapper*/
.whiteLink-wrapper {

    background-color: #133C6A;
    padding: 10px;

    * {
        color: white !important;
        text-decoration-color: white !important;
    }

    .whiteLink-wrapper>a {
        text-decoration: underline !important;
        text-decoration-color: white !important;
    }

    a:hover,
    a:focus {
        color: white !important;
        font-weight: 600;
    }

}

.dma-full-width-centered.v2-template #content .whiteLink-wrapper a:visited,
.dma-full-width.v2-template #content .whiteLink-wrapper a:visited {
    text-decoration-color: white !important;
    text-decoration: underline !important;
}

.dma-full-width-centered.v2-template #content .whiteLink-wrapper a,
.dma-full-width.v2-template #content .whiteLink-wrapper a {
    text-decoration-color: #fff !important;
}

.dma-full-width-centered.v2-template #content .whiteLink-wrapper a:hover,
.dma-full-width.v2-template #content .whiteLink-wrapper a:hover {
    text-decoration-color: #fff !important;
}


/*Article CS Dashboard Keyword Search Input Wrapper*/

.ArticleCSinput-wrapper .form-group .control-label {
    display: none !important;
}

.ArticleCSinput-wrapper .form-horizontal .control-label {
    display: none !important;
}

.ArticleCSinput-wrapper .sort>.form-control,
.ArticleCSinput-wrapper .category>.form-control,
.ArticleCSinput-wrapper .keyword>.form-control {
    cursor: pointer;
    font-size: 20px !important;
    border-radius: 0px !important;
    padding: 10px 12px !important;
    height: 100%;
    border: 1px solid grey !important;
    margin: 10px;
}

.ArticleCSinput-wrapper .sort>.form-control,
.ArticleCSinput-wrapper .category>.form-control,
.ArticleCSinput-wrapper .keyword>.form-control {
    color: #084476;
}

.ArticleCSinput-wrapper div.keyword input::placeholder {
    color: #084476;
}

.ArticleCSinput-wrapper .form-control:hover {
    border-color: #66afe9 !important;
    outline: 0 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) !important;
}

.ArticleCSinput-wrapper .form-control:focus {
    border-color: #66afe9 !important;
    outline: 0 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6) !important;
}

.ArticleCSinput-wrapper .advanced-search-btn {
    font-size: 20px;
    margin-top: 10px;
    border: 2px solid #0360ae;
    background-color: #0360ae;
    font-weight: 700;
    border-radius: .25rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.ArticleCSinput-wrapper .advanced-search-btn:hover {
    color: #1F4A7F !important;
    background-color: #fff !important;
    border: 1px solid #1F4A7F !important;
}

/*Partial Border Corners Impact Container*/
@media (max-width: 590px) {
.pseudo-partial-border {
margin:30px 25px 50px;
}
}

.pseudo-partial-border {
    position: relative;
    padding: 7px;
    margin: 25px;
    background: #EDEFF4;
    border: none;
    padding: 15px;
}

.pseudo-partial-border::before,
.pseudo-partial-border::after {
    position: absolute;
    width: 8rem;
    height: 6rem;
    content: "";
}

.pseudo-partial-border::before {
    right: 0;
    top: 0;
    margin: -15px;
    border-right: 5px solid #084476;
    border-top: 5px solid #084476;
}

.pseudo-partial-border::after {
    left: 0;
    bottom: 0;
    margin: -15px;
    border-left: 5px solid #084476;
    border-bottom: 5px solid #084476;
}


/* ---- Reformat Default Form and List Search Bar to align with Vendor Hub Styling ---- */

.dnnFormAndList {

.search-panel > .search-button { 

font-size: 20px !important; 

    border: 2px solid #0360ae !important; 

    background-color: #0360ae !important; 

    font-weight: 700 !important; 

    border-radius: 3px !important; 

    -webkit-appearance: none !important; 

    -moz-appearance: none !important; 

    appearance: none !important; 

color: #fff !important; 

max-height: 45px !important; 

line-height: 3rem !important; 

display: inline-block !important; 

} 

 

.search-panel > .search-reset-button { 

font-size: 20px !important; 

    border: 2px solid black !important; 

    background-color: #36454F !important; 

    font-weight: 700 !important; 

    border-radius: 3px !important; 

    -webkit-appearance: none !important; 

    -moz-appearance: none !important; 

    appearance: none !important; 

color: #fff !important; 

max-height: 45px !important; 

line-height: 3rem !important; 

display: inline-block !important; 

} 

  

.search-panel > a.search-button:hover { 

background-color: #fff !important; 

border: 1px solid #1F4A7F !important; 

color: #1F4A7F !important; 

  

span { 

color: #1F4A7F !important; 

} 

} 

  

.search-panel > .search-reset-button:hover { 

background-color: #fff !important; 

border: 1px solid #1F4A7F !important; 

color: #36454F !important; 

  

span { 

color: #36454F !important; 

} 

} 

  

.search-panel > .NormalTextBox, .search-panel > input { 

cursor: pointer; 

    font-size: 20px !important; 

    border-radius: 0px !important; 

    padding: 10px 12px !important; 

    border: 1px solid grey !important; 

color: #084476; 

} 

  

.search-panel > .NormalTextBox { 

margin-top: 3px !important; 

 

} 

  

.search-panel button, .search-panel input, .search-panel optgroup, .search-panel select, .search-panel textarea { 

    max-height: 45px !important; 

    min-height: 45px !important; 

    margin: 3px auto; 

} 

  

div.search-panel > div.dnnLabel > label > span, .search-panel > .that-text, .search-panel > .browse-text { 

color: #084476 !important; 

font-size: 16px !important; 

} 

  

.search-panel > .NormalTextBox:hover, div.search-panel > input:hover { 

border-color: #66afe9 !important; 

    outline: 0 !important; 

    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6) !important; 

    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6) !important; 

} 

  

.search-panel > .NormalTextBox:focus, div.search-panel > input:focus { 

    border-color: #66afe9 !important; 

    outline: 0 !important; 

    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6) !important; 

    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6) !important; 

} 

  

.search-panel { 

background-color: #EEEEEE; 
padding:10px;

} 

  

.search-panel a.dnnFormHelp::after { 

color: #084476; 

} 

  

.search-panel .CommandButton.search-button { 

line-height: 3rem !important; 

} 

  

.dnnLabel { 

padding-top: 8px; 

margin-top: 4px; 

width: inherit !important; 

float: left !important; 

} 

  

a.dnnFormHelp { 

top: 4px !important; 

text-decoration: none !important; 

} 

  

div.Normal { 

container-type: inline-size; 

} 

  

@container (width > 900px) { 

div.search-panel:not(:has(a.search-reset-button)) { 

display: grid !important; 

grid-auto-flow: column; 

font-size: 0 !important; 

align-items: center; 

justify-content: center; 

gap: 5px !important; 

} 

  

div.search-panel:not(:has(a.search-reset-button)) > div.dnnLabel { 

grid-column: 1; 

font-size: 16px; 

} 

  

div.search-panel:not(:has(a.search-reset-button)) > input, div.search-panel:not(:has(a.search-reset-button)) > a  { 

font-size: 20px !important; 

} 

  

.dnnLabel { 

width: inherit !important; 

margin-right: 1em; 

} 

  

} 

  

@container (500px < width < 900px) { 

div.search-panel { 

display: grid !important; 

grid-auto-flow: column; 

font-size: 0 !important; 

align-items: center; 

} 

  

div.search-panel > div.dnnLabel { 

grid-column: 1; 

font-size: 16px; 

} 

  

div.search-panel > input { 

grid-column: 2; 

font-size: 20px; 

} 

  

div.search-panel > a { 

grid-column: 3; 

font-size: 20px !important; 

} 

  

.dnnLabel { 

width: inherit !important; 

margin-right: 1em; 

} 

  

} 

  

@container (width < 500px) { 

  

.search-panel:not(:has(a.search-reset-button)){ 

display: grid !important; 

align-items: center; 

justify-items: center; 

font-size: 0 !important; 

} 

  

.search-panel:not(:has(a.search-reset-button)) > .dnnLabel { 

order: 1; 

justify-items: center !important; 

font-size: 16px !important; 

} 

  

.search-panel:not(:has(a.search-reset-button)) > input { 

width: 100%; 

order: 2; 

} 

  

.search-panel:not(:has(a.search-reset-button)) > .CommandButton { 

order: 3; 

width: inherit !important; 

margin-top: 8px; 

} 

 

} 

  

@container (width > 940px) { 

div.search-panel:has(a.search-reset-button) { 

display: grid !important; 

grid-auto-flow: column; 

font-size: 0 !important; 

align-items: center; 

justify-content: center; 

gap: 5px !important; 

} 

  

div.search-panel:has(a.search-reset-button) > div.dnnLabel { 

grid-column: 1; 

font-size: 16px; 

} 

  

div.search-panel:has(a.search-reset-button) > input { 

grid-column: 2; 

font-size: 20px; 

} 

  

div.search-panel:has(a.search-reset-button) > .CommandButton { 

grid-column: 3; 

font-size: 20px; 

} 

  

div.search-panel:has(a.search-reset-button) > a.search-reset-button { 

order: 4; 

font-size: 20px; 

} 

 

.dnnLabel { 

width: inherit !important; 

margin-right: 1em; 

} 

  

} 

  

@container (width < 940px) { 

div.search-panel:has(a.search-reset-button) { 

display: flex !important; 

justify-content: space-around; 

flex-wrap: wrap; 

gap: 5px; 

font-size: 0px !important; 

} 

  

div.search-panel:has(a.search-reset-button) > .dnnLabel { 

order: 1; 

margin-left: auto !important; 

font-size: 16px; 

} 

  

div.search-panel:has(a.search-reset-button) > input { 

order: 2; 

} 

  

div.search-panel:has(a.search-reset-button) > .CommandButton { 

order: 3; 

margin: auto !important; 

} 

  

div.search-panel:has(a.search-reset-button) > a.search-reset-button { 

order: 4; 

margin: auto; 

} 

  

} 

  

@container (width < 515px) { 

div.search-panel:has(a.search-reset-button) { 

display: flex !important; 

justify-content: center !important; 

align-content: center; 

flex-wrap: wrap; 

gap: 10px; 

font-size: 0px !important; 

} 

  

div.search-panel:has(a.search-reset-button) > .dnnLabel { 

order: 1; 

margin: auto;  

} 

  

div.search-panel:has(a.search-reset-button) > input { 

order: 2; 

width: 100%; 

} 

  

div.search-panel:has(a.search-reset-button) > .CommandButton { 

order: 3; 

margin: auto !important; 

} 

  

div.search-panel:has(a.search-reset-button) > a.search-reset-button { 

order: 4; 

margin: auto; 

} 

} 

  

div.Normal { 

container-type: inline-size; 

container-name: search-bar 

} 

  

@container search-bar (width < 330px) { 

.search-panel:has(span.browse-text) > .NormalTextBox, .search-panel:has(span.browse-text) > input  { 

width: 100%; 

} 

  

div.search-panel:has(span.browse-text) { 

display: flex !important; 

justify-content: center !important; 

align-content: center; 

flex-wrap: wrap; 

gap: 10px; 

font-size: 0px !important; 

} 

} 

  

@container search-bar (width > 940px) { 

div.search-panel:has(span.browse-text) {display: grid !important;grid-auto-flow: column;font-size: 0 !important;align-items: center;justify-content: center;gap: 5px !important;padding: 8px;} 

  

.search-panel:has(span.browse-text) > .NormalTextBox, .search-panel:has(span.browse-text) > input  { 

width: 100%; 

} 

  

.search-panel:has(span.browse-text) > .browse-text { 

grid-column: 1; 

} 

  

.search-panel:has(span.browse-text) > .browse-text + .NormalTextBox { 

grid-column: 2; 

} 

  

.search-panel:has(span.browse-text) > .that-text { 

grid-column: 3; 

} 

  

.search-panel:has(span.browse-text) > .that-text + .NormalTextBox { 

grid-column: 4; 

} 

  

.search-panel:has(span.browse-text) > .NormalTextBox + input { 

grid-column: 5; 

} 

  

.search-panel:has(span.browse-text) > .CommandButton { 

grid-column: 6; 

} 

  

.search-panel:has(span.browse-text) > a.search-reset-button { 

grid-column: 7; 

} 

} 

  

.search-panel:has(span.browse-text) > .that-text, .search-panel:has(span.browse-text) > .browse-text { 

margin: auto !important; 

} 

  

@container search-bar (width < 940px) { 

div.search-panel:has(span.browse-text) { 

display: flex !important; 

justify-content: center !important; 

flex-wrap: wrap; 

gap: 5px; 

font-size: 0px !important; 

} 

  

.search-panel:has(span.browse-text) > .CommandButton { 

margin: auto; 

} 

  

.search-panel:has(span.browse-text) > .browse-text { 

order: 1; 

} 

  

.search-panel:has(span.browse-text) > .browse-text + .NormalTextBox { 

order: 2 !important; 

} 

  

.search-panel:has(span.browse-text) > .that-text { 

order: 3 !important; 

} 

  

.search-panel:has(span.browse-text) > .that-text + .NormalTextBox { 

order: 4 !important; 

} 

  

.search-panel:has(span.browse-text) > .NormalTextBox + input { 

order: 5 !important; 

} 

  

.search-panel:has(span.browse-text) > .CommandButton { 

order: 6 !important; 

} 

  

.search-panel:has(span.browse-text) > a.search-reset-button { 

order: 7; 

} 

} 
}

/*Event Module visual updates, from John McCormick */

tr.ListPager > td > table > tbody > tr > td {
border-width: 0px !important;
}

.ListDataGrid > tbody > tr > th {
padding-left: 3px;
font-size: 14px;
}

.ThemeMinimalExtropy .ListHeader {
    font-size: 14px;
    padding-left: 5px;
}

.ThemeMinimalExtropy .ListDataGrid td, .ThemeMinimalExtropy .DetailEnrollGrid td, .ThemeMinimalExtropy .EditEnrollGrid td, .ThemeMinimalExtropy .EnrollGrid td {
    border-color: #a2bbdd;
    border-style: solid;
    border-width: 1px;
    padding: 5px;
vertical-align: middle;
}