/* ==================================================
	DCCPS Color Palette
================================================== */
:root {
    --dccps-primary-navy: #14315C;
    --dccps-primary-gray: #71767A;
    --dccps-primary-teal: #4BBFC6;
    --dccps-primary-hdrp: #D24600;
    --dccps-blue: #1f496f;    
    --dccps-blue-card: #14315c; /* card header when on a white background */
    --dccps-blue-card-lighter: #183a57; /* card header when on a blue background */
	--dccps-button-primary-default: #2f70a8;
	--dccps-button-primary-hover: #183a57;
	--dccps-button-primary-active: #162E51;
	--dccps-button-primary-focus: #183a57;
	--dccps-button-primary-focus-outline: #2491FF;
	--dccps-button-primary-disabled: #C9C9C9;
	--dccps-button-primary-disabled-text: #454545;
	--dccps-button-secondary-default: #2f70a8;
	--dccps-button-secondary-hover: #183a57;
	--dccps-button-secondary-active: #162E51;
	--dccps-button-secondary-focus: #183a57;
	--dccps-button-primary-focus-outline: #2491FF;
	--dccps-button-secondary-disabled: #2f70a8;
	--dccps-button-accent-default: #4BBFC6;
	--dccps-button-accent-hover: #31A3AA;
	--dccps-button-accent-active: #23848A;
	--dccps-button-accent-focus: #4BBFC6;
	--dccps-button-primary-focus-outline: #2491FF;
	--dccps-button-accent-disabled: #2f70a8;
	--dccps-button-accent-disabled-text: #454545;
}

/* ==================================================
	base.css Overwrites/Additions/Fixes
================================================== */
/* overwrite for h2 so it doesn't have padding on top if it's the first item on page */
h2 {padding-top: 0;}
.bg-darkprimary h2 {color: #fff;}
td.bg-darkprimary {background-color: var(--dccps-primary-navy)!important;}
.navbar-custom {font-size: 1rem;}

@media (min-width:62em) {
	.navbar-custom .navbar-nav .nav-link {padding: 1.1rem 12px;}
}

/* Expand Collapse for Side Nav */
/* toggle button for sections +/- */
.leftNav-toggle { cursor: pointer; position: absolute; height: 10px; width: 10px; right: 8px; top: 10px; padding: 10px; display: block; background: transparent url("../images/plus-dark.png") center no-repeat; background-size: 10px; border: none; }
.subNav li a:hover+.leftNav-toggle, .subNav li a:focus+.leftNav-toggle {background-image: url("../images/plus.png");}
.leftNav-toggle:focus { outline: 1px dotted #000; }
.leftNav-toggle[aria-expanded="true"] { background: transparent url("../images/minus-dark.png") center no-repeat; background-size: 10px;}
.subNav li a:hover+.leftNav-toggle[aria-expanded="true"], .subNav li a:focus+.leftNav-toggle[aria-expanded="true"] {background-image: url("../images/minus.png");}

/* improve nested toggles so colors/backgrounds work */
.tog-content .tog-control button { background: #fff; }
.tog-content .tog-control button:hover, .tog-content .tog-control button[aria-expanded="true"] { background: #4a4a4a; }
.tog-content .tog-content { background: #fff; }

/* styles for the sidenav for the toggle */
.subNav li { position: relative;}
.subNav ul li span {background: #f2f2f2; display: block; padding: 10px 30px 10px 10px; border-left: 5px solid #f2f2f2; line-height: 1.2; transition: all .1s linear;}
.subNav li a, .subNav li span {padding-right: 30px;}
.subNav ul ul li a, .subNav ul ul li span.d-block {padding-left: 40px;}
.subNav ul ul ul li a {padding-left: 60px;}
.subNav ul ul ul ul li a {padding-left: 75px;}

/* side nav heading & highlight color override */
.subNav .heading {background: var(--dccps-blue);}
p.heading a {color: #fff;}
p.heading a:hover, p.heading a:focus {text-decoration: underline !important;}
.subNav li a.active {border-left-color: #2f70a8;}
.subNav li a:hover, .subNav li a:focus, .subNav li a.active:hover, .subNav li a.active:focus {background: #2f70a8;color: #fff;border-left-color: transparent;}

/* page styles */
.bg-darkprimary p {color: #fff;}

/* icon added for headings */
.icon-header-publications:before {background-image: url(/images/dccps/icon-2x-publications.png);}
.icon-header-resources:before {background-image: url(/images/dccps/icon-2x-interests.png);}
.icon-header-support:before {background-image: url(/images/dccps/icon-2x-funding.png);}

/*flickity buttons and cards*/
.flickity-prev-next-button {border-radius: 0;}

/* external links on cards (also edited base.css gray feature card because of image css */
.ext { position: relative; }
.card-extlink { position: absolute; padding: .5rem; bottom: 0; right: 0; background: rgba(0,0,0,.05); display: inline-block; line-height: 0; }


/* return to top */
.returntop svg { border: 1px solid #2f70a8; /*cc*/ }
.returntop svg path { fill: #2f70a8; /*cc*/ }
.returntop:hover, .returntop:focus { background: #2f70a8; /*cc*/ }
@media (max-width: 991px) {
	.returntop:hover svg, .returntop:focus svg { background: #2f70a8; /*cc*/ border-color: #2f70a8; /*cc*/ }
}

/* Fixed skip nav to be visible when in focus */
a:not(.returntop)[href="#skip"]:focus, a:not(.returntop)[href="#skip"]:focus-visible {position: relative!important;}

/* ==================================================
	Color Overrides for base.css
================================================== */
/* backgrounds */
.bg-primary { background-color: var(--dccps-blue) /*cc*/; }
.bg-darkprimary { background-color: var(--dccps-primary-navy) /*cc*/; }
.bg-darker { background-color: #ccc!important; }
.bg-dark { background-color: #4a4a4a!important; }
.bg-dark-secondary { background-color: #000!important; }
.badge {padding: .25em .5em;}
.badge-primary, .badge.bg-primary {background-color: var(--dccps-blue)!important; color: #fff;}

/* modal title head */
.modal-header { background: var(--dccps-blue) /*cc*/; }
.modal-header a {color: #fff; text-decoration: none;}
button.modal-link {color: #2f70a8; text-decoration: underline;}
button.modal-link:hover {color: #1e486c;}

/**modal close button override**/
button.ui-dialog-titlebar-close:after {
    content: 'Close';
}
.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em !important;
    top: 3px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 5px !important;
    height: auto !important;
    border: 1px solid #ccc;
}

.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus {border: 1px solid #000;}

/* BS form elements */
.form-control:focus { border-color: var(--dccps-blue) /*cc*/; box-shadow: 0 0 0 .2rem #eeeeee /*cc*/; }

/* header search */
.searchForm button:hover, .searchWrap button:focus { background: #eee /*cc*/; }

/* ribbon */
.ribbon { background: var(--dccps-primary-hdrp) /*cc*/; }
.ribbon span {padding-left: 0; background: none;}

/* menu and search toggles for mobile */
.js #menu-button, .js #search-tog { color: var(--dccps-blue) /*cc*/; }
.js #menu-button:hover, .js #menu-button:focus, .js #search-tog:focus, .js #search-tog:hover  {background-color: #2f70a8 !important; color: #fff;}
.js #menu-button[aria-expanded="true"], .js #search-tog[aria-expanded="true"] { background: var(--dccps-blue) /*cc*/ !important; border-color: var(--dccps-blue) /*cc*/ !important; color: #fff; }

/* left nav toggle on mobile */
.togSubNav { background: var(--dccps-blue) /*cc*/;  }
.togSubNav:hover, .togSubNav:focus { background: #2f70a8 /*cc*/; }
.togSubNav:focus {outline:  1px solid #2f70a8;}

/* left nav */
.subNav li a:hover, .subNav li a:focus, .subNav li.is-hover > a { background: #2f70a8; /*cc*/ color: #fff; border-left-color: #2f70a8; /*cc*/ }
.subNav li a.active { border-left-color: #2f70a8; /*cc*/ background: #f9f9f9; color: #363636;}


/* slider buttons */
.flickity-button { background: var(--dccps-blue) /*cc*/; }

/* white w/icon, title, desc. */
.card-white:hover, .card-white:focus { box-shadow: 0 3px 6px #11293d /*cc*/; }
.branches .card-icon img, .card-head img, .card-head img { background: var(--dccps-blue-card) /*cc*/; }
.card-white .card-title { color: var(--dccps-blue) /*cc*/; }

/* white with dark head */
.card-dark:hover, .card-dark:focus { box-shadow: 0 3px 6px #11293d /*cc*/; }
.card-dark > .card-title { background: var(--dccps-blue-card) /*cc*/; border-top: 3px solid var(--dccps-blue) /*cc*/; }
.card-white.bg-darkprimary .card-title { color: #fff /*cc*/; }

/* news/funding Cards */
.card-accent { border-left: 50px solid #183a57 /*cc*/; }
.card-accent.bg-lightgray { background: #f2f2f2 /*variation of the accent card for pages with white backgrounds*/; }
/* clickable version */
a.card-accent:hover, a.card-accent:focus { box-shadow: 0 3px 6px #11293d /*cc*/; }

/* event card */
.card-event { border-top: 3px solid #183a57 /*cc*/; background: #f9f9f9; }

/* toggles on page */
.tog-control button {color: #4a4a4a;}
/* expand/collapse all toggles */
.tog-group .btn.btn-page {width: auto!important; margin: 1rem 0.25rem 0 0;}

/* ==================================================
	Home
================================================== */
.hero:not(.homepage-about) {background-color: #14315c;}
.hero .lead {font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, "sans-serif"; padding: 75px 20px 75px 0px; min-height: 475px; font-size: 22px; font-weight: 300; line-height: 1.636; margin-top: 0px; margin-bottom: 5px;}
.hero:not(.homepage-about) p {color: #fff /*cc*/;}
.hero hr {border-top: 4px solid var(--dccps-primary-hdrp); opacity: 1; width: 33%; margin-right: 100%; margin-top: 20px; margin-bottom: 20px;}
.hero div[class^="connect-"] {margin-top: 1em; display: flex; align-items: center;}
.hero div[class^="connect-"] a[class$="-icon"] {width: 38px; height: 38px; display: inline-block; border-radius: 50%; background: #fff; margin-right: 15px; transition: all 0.2s ease-in-out;}
.hero div[class^="connect-"] img {width: 32px; height: 32px; margin: 3px;}
.hero div[class^="connect-"] p {font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-size: 16px; font-weight: 400; line-height: 1.25; margin: 0;}
.hero div[class^="connect-"] a {color: #fff;}
.hero .connect-text .extlink {display: none;}
.hero-bg-image-wrapper {display: none;}
/*.hero-bg-image-wrapper img {height: 100%; overflow: hidden; top: 0; right: 0; width: 100%; background-size: cover; background-position: top; background-repeat: no-repeat;}
.hero-bg-image-wrapper img:before {content: ''; position: absolute; top: 0; left: 0; width: 400px; height: 100%; transform: scaleX(-1);}*/

@media (max-width: 991px) {
	.hero-bg-image-wrapper {display: none;}
	.hero .lead {min-height: inherit; padding: 20px 0;}
}
@media (min-width: 992px) {
    .hero-bg-image-wrapper {display: block; height: 100%; flex: 1; padding: 30px 0; background-image: linear-gradient(to right, transparent 10%, var(--dccps-primary-hdrp) 10%, var(--dccps-primary-hdrp) 90%, transparent 90%);}
	.hero-bg-image {height: 100%; overflow: hidden; top: 0; right: 0; width: 100%; background-image: url('/images/home/hero-bg-image-cropped.jpg'); background-size: cover; background-position: top; background-repeat: no-repeat;}
}

.homepage-about .hero-content {position: relative; z-index: 10;}
.homepage-about {min-height: 475px; position: relative; padding: 3rem 0; }
.homepage-about .hero-bg-image {background-image: url('/images/home/about-bg-image.jpg'); max-width: 55%; height: 100%; overflow: hidden; position: absolute; top: 0; right: 0; z-index: 1; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center left; transition: background-position .3s ease;}
.homepage-about .hero-bg-image:before {display: block; content: ''; height: 100%; position: absolute; top: 0; left: 0; width: 800px; transform: scaleX(-1); background: linear-gradient(to right,transparent 0%,rgba(242,242,242,0.028) 11.9%,rgba(242,242,242,0.104) 22.5%,rgba(242,242,242,0.216) 32.2%,rgba(242,242,242,0.352) 41.2%,rgba(242,242,242,0.5) 50%,rgba(242,242,242,0.648) 58.8%,rgba(242,242,242,0.784) 67.8%,rgba(242,242,242,0.896) 77.5%,rgba(242,242,242,0.972) 85.1%,#f2f2f2 90%);}
.homepage-about .hero-bg-texture:after {display: block; content: ''; height: 100%; position: absolute; top: 0; right: 0; width: 500px; transform: scaleX(-1); background: linear-gradient(to left,transparent 0%,rgba(242,242,242,0.028) 11.9%,rgba(242,242,242,0.104) 22.5%,rgba(242,242,242,0.216) 32.2%,rgba(242,242,242,0.352) 41.2%,rgba(242,242,242,0.5) 50%,rgba(7242,242,242,0.648) 58.8%,rgba(242,242,242,0.784) 67.8%,rgba(242,242,242,0.896) 77.5%,rgba(242,242,242,0.972) 85.1%,#f2f2f2 90%);}
.about-content {position: relative; z-index: 2;}


@media (max-width: 992px) {
	.homepage-about {padding: 3rem 0 0;}
	.homepage-about .hero-bg-image {max-width: 100%; width: 100%; height: 100%; overflow: hidden; position: relative; top: 0; right: 0; z-index: 1; display: block; background-position: top right;}
	.homepage-about .hero-bg-image:before {content: ''; position: relative; top: 0; left: 0; width: 100%; height: 400px; display: block; transform: scaleY(-1); background: linear-gradient(to bottom,transparent 0%,rgba(242,242,242,0.028) 11.9%,rgba(242,242,242,0.104) 22.5%,rgba(242,242,242,0.216) 32.2%,rgba(242,242,242,0.352) 41.2%,rgba(242,242,242,0.5) 50%,rgba(7242,242,242,0.648) 58.8%,rgba(242,242,242,0.784) 67.8%,rgba(242,242,242,0.896) 77.5%,rgba(242,242,242,0.972) 85.1%,#f2f2f2 90%);}
}

.whats-new h2 { font-family: "Merriweather","Times New Roman",Times,Georgia,serif; font-size: 1.5rem; line-height: 1.6; }
.foa-title {margin-bottom: 30px; position: relative; display: flex; align-items: center;}
.foa-title:before {content: ''; display: inline-block; top: -10px; left: -45px; width: 40px; height: 50px; background-image: url("/images/home/funding-icon.png"); background-size: 40px 50px;
    background-repeat: no-repeat; margin-right: 5px;}

/***** What's New Redesign 2022 *****/
.spotlight-card {margin-bottom: 2rem; padding-right: 2rem;}
.spotlight-card {margin-bottom: 3rem;}
.spotlight-card .card-head hr {display: block; margin: 1.5rem auto 1.5rem 0; width: 75%; border-top: 1px solid rgba(0,0,0,.2);}
.spotlight-card .card-head .btn.btn-action {width: auto; margin-top: 0.5rem;}
.spotlight-content {display: table-cell; vertical-align: top;}
.spotlight-content .card-title {font-weight: 700; margin-bottom: .5rem;}
.spotlight-content .card-title, .spotlight-content h3 {display: block;}
.spotlight-content a:not(.card-title), .spotlight-content span {transform: translateY(-2px);}
.spotlight-content a:not(.card-title) {display: inline-block;}
.spotlight-content span {display: inline;}
	/* set external links and the .extlink icon they generate to be display: inline, without effecting other links in Spotlight cards' content */
	.spotlight-content .extlink, .spotlight-content p:not(.card-title) a[href*="https://"] {display: inline; position:relative; top: -2px;} 
.spotlight-content p:not(.card-title) {font-size: 90%; position: relative;}
.spotlight-content p a.alignmentOverride {display: inline; position: relative; top: -2px;}
.spotlight-category {font-size: 75%; text-transform: uppercase; margin-bottom: 0;}
.spotlight-card .card-head .extlink img {border-radius: 0; background: transparent; margin: 10px 3px 0 1px;}
.funding-card .card-title {font-size: 1.125rem;}
.whats-new h2 {text-align: center; width: 100%;}
.whats-new .indent, .funding-indent {padding-left: 1rem;}
.whats-new .indent .funding-card {padding-left: 30px; width: 100%;}
.whats-new .funding-indent {padding-top: 3rem; padding-left: 2rem;}
.whats-new .funding-indent .funding-card .card-accent {position: relative; top: 0; transition: all .3s ease-in-out;}
.whats-new .funding-indent .funding-card .card-accent:hover, .whats-new .funding-indent .funding-card .card-accent:focus {box-shadow: 0 3px 6px #11293d /*cc*/; top: -.35rem; transition: all .3s ease-in-out;}
.spotlight-content .card-extlink {background: none; right:unset;}
.spotlight-content .card-extlink img {background: none; border-radius: 0; margin-right: 0;}

@media (min-width: 992px) {
	.whats-new .funding-indent {padding-left: 0; padding-top: 0;}
	.whats-new h2 {text-align: left;}
	.spotlight-card:last-child {margin-bottom: 2rem;}
}

.fun-opp { display: flex; }
.fun-details { font-size: 1rem; }
.fun-date { min-width: 125px; }

/* About HDRP Section */
.branches .nav-pills li {width: 100%; background-color: transparent;}
.branches .nav-pills>li>a {width: 100%; border-radius: 3px; display: flex!important; flex-direction: column; justify-content: center;}

@media (min-width: 768px) and (max-width: 992px) {
	.branches .nav-pills li {width: 49%; text-align: center; display: flex;}
	.branches .nav-pills li:nth-child(odd) {margin: .5rem auto .5rem 0;}
	.branches .nav-pills li:nth-child(even) {margin: .5rem 0 .5rem auto;}
}

/* Twitter Feeds */
.twitWrap { overflow-y: scroll; max-height: /*404px*/340px; /*just until widget is fixed*/ position: relative; }
.twitWrap-news {position: relative; padding-bottom: 50%; width: 100%; height: 100%;}
.twitWrap-news .innerWrap {position: absolute !important; top: 0px; left: 0px; width: 100% !important; height: 100% !important; overflow-y: scroll !important;}

.col-lg-12.events-button {display: block;}
.row.events-button {display: none;}
#twitterCard #followUs {overflow: hidden;}
#twitterCard #scroller {overflow: auto; width: 95%; margin: 0 auto;}
@media (min-width: 992px) {
	.col-lg-12.events-button {display: none;}
	.row.events-button {display: block;}
}
.col-lg-12.events-button {display: block;}
.row.events-button {display: none;}
#twitterCard #followUs {overflow: hidden;}
#twitterCard #scroller {overflow: auto; width: 95%; margin: 0 auto;}
@media (min-width: 992px) {
	.col-lg-12.events-button {display: none;}
	.row.events-button {display: block;}
}


/* ==================================================
	Buttons
================================================== */

.btn.btn-action, .btn.btn-reset { color: #fff;background: var(--dccps-button-primary-default); vertical-align: baseline; border-color: var(--dccps-button-primary-default);}
.btn.btn-action:active, .btn.btn-reset:active {background: var(--dccps-button-primary-active); color: #fff;}
.btn.btn-action:focus, .btn.btn-reset:focus {background: var(--dccps-button-primary-focus); border-color: transparent; outline-offset: 5px; outline: 3px solid var(--dccps-button-primary-focus-outline);}
.btn.btn-action:hover, .btn.btn-reset:hover {background: var(--dccps-button-primary-hover); border-color: transparent;}
[class*="card-"] .btn.btn-action {width: 100%;}


.btn.btn-page {width: 100%;color: var(--dccps-button-secondary-default); border: 2px solid var(--dccps-button-secondary-default); background: #fff;}
a .btn .btn-page {overflow-wrap: break-word; word-wrap: break-word;}
.lead+.btn.btn-page{width: auto;}
.text-md-center .btn.btn-page {width:50%;}
.btn.btn-page:active {background: #fff; border: 2px solid var(--dccps-button-secondary-active); color: solid var(--dccps-button-secondary-active);}
.btn.btn-page:focus {background: #fff; border: 2px solid var(--dccps-button-secondary-focus); color: var(--dccps-button-secondary-focus); outline-offset: 5px; outline: 3px solid var(--dccps-button-primary-focus-outline);}
.btn.btn-page:hover {background: #fff; border: 2px solid var(--dccps-button-secondary-hover); color: solid var(--dccps-button-secondary-hover);}

/* helper class for long buttons that need to wrap */ .text-wrap { white-space: normal; }

/********primary on dark background********/
.bg-darkprimary .btn-action, .btn-reset {color: #2f70a8; background-color: #fff; border: 1px solid #ddd; transition: all .3s ease-in-out;font-weight: 600;}
.bg-darkprimary .btn-action {color: #fff; font-weight: 400;}
.btn-reset:hover, .btn-reset:focus, .bg-darkprimary .btn-action:hover, .bg-darkprimary .btn-action:focus, .bg-darkprimary .btn-action:not(:disabled):not(.disabled).active, .bg-darkprimary .btn-action:not(:disabled):not(.disabled):active, .bg-darkprimary .show>.btn-action.dropdown-toggle {background-color: #eee; }


/* ==================================================
	Images
================================================== */

.icon {border: 5px solid #fff;box-shadow: 0 0 8px rgba(0,0,0,.2);border-radius: 50%;}

.branches .card-icon img {max-width: 60px; max-height: 60px; left: -30px;  margin-top: -30px;}
.branches.learn .card-icon img {max-width: 40px; max-height: 40px; left: -20px;  margin-top: -15px;}
.card-dark img.icon {max-width: 80px;margin-right: 1rem;float: left;}
.home .card-dark img.icon {max-width: none;margin-right: 0;float: none;}

img.bio_photo {margin-bottom: 1rem;}

figcaption {font-size: .9em; font-weight: bold;padding-bottom: 1rem;}

/* ==================================================
	List styles
================================================== */
.styled-list { font-size: 1rem; box-shadow: 0 2px 4px rgba(0,0,0,0.2); }
.styled-listWrap {padding: 1.25rem 0;}
.styled-listWrap .card-title {padding-top: .5rem;}
.styled-listWrap .card-content {padding: 0 1rem .5rem 0;}
.list-title { display: block; border-radius: 4px 4px 0 0; border: 1px solid #666; padding: .5rem 1rem; background: #6c757d; color: #fff; font-size: 1.125rem; }
.styled-list > ul { list-style: none; margin: 0; padding: 0; border: 1px solid #ccc; border-top: none; }
.styled-list > ul > li { border-bottom: 1px solid #ccc; padding: .5rem 1rem; margin: 0; }
.styled-list > ul > li:last-child { border-bottom: none; }  

/* ==================================================
	Nav Links
================================================== */
.nav-pills>li {width: 100%; border-radius: 3px; /*background-color: #f2f2f2;*/ position: relative;top: 0;transition: all .3s ease-in-out;}
.nav-pills>li>a:first-child {font-weight: 600; text-decoration: none; padding: 10px 15px; /*display: inline-block;*/ margin-top:0;}

/*.bg-lightgray > .nav-pills>li {background-color: #fff;}*/
.nav-pills>li:hover, .nav-pills>li:focus { color: #333; text-decoration: none; }
.nav-pills>li:hover a, .nav-pills>li:focus a {transition: color .3s ease-in-out;}

/********************RIGHT NAV***********************/

/* ==================================================
	Cards
================================================== */
a.card-title {color: #2f70a8;}
.branches .card-icon {padding-left: 3rem;}
.branches a, .main-carousel a {text-decoration: none;}
.learn .card-icon {padding-left: 2rem;}
.card-white p {color: #212529;}
.card-white.static:hover, .card-white.static:focus {position: static;top: 0;box-shadow:none;}
.card-50:nth-child(2n+2), .card-33:nth-child(3n+3), .card-25:nth-child(4n+4) { padding-right: 2rem; /*overwriting base.css*/}
.carousel-cell .card-video a {display: inline-block; margin-right: 0;}

.staffCard {padding: 1rem 0;margin: 0;}
.staffCard .card-title {padding-top: 0;}

.watch-video {display: flex; align-items: center; flex-wrap: wrap;}
.watch-video svg {fill: var(--dccps-blue);}
.pastEvents .watch-video {position: relative;}
.pastEvents .watch-video svg {align-self: flex-start; position:relative; top:0;}
.video-icon {display: flex; justify-content: center; align-items: center; padding: 0; min-width: 125px; text-align: center; border-right: 1px solid #ccc; margin-right: 25px; line-height: 1.1;}
.foa-videos {padding-bottom: 0; margin-bottom: 3rem; text-align: center;}	
.foa-videos .card-icon {padding-left: 4.5rem;}
/*.date.foa-date {padding: .5rem 25px .5rem 0; }*/
.date.foa-date strong {font-size: 1.25em;}
.date.foa-date strong:first-child {font-size: 2rem;}
.date.foa-date strong:last-child {font-size: .8em;}

/* Related NOFO cards on events pages */
.card-dark.card-nofo {margin-top: 1.5rem;}
.card-dark.card-nofo > .card-title {border-top: 3px solid #1e77ae; padding: 0.25rem 1rem;}
.card-dark.card-nofo .card-head, .card-dark.card-nofo .card-head img {background-color: #012A51;}
.card-dark.card-nofo .card-head h2 {font-size: 1.25rem;}
.card-dark.card-nofo .card-head img {max-width: 35px;}
.card-dark.card-nofo .card-content {font-size: 1.05rem; padding-bottom: 0;}

	@media (min-width: 576px) {
		.foa-videos {padding-bottom: 2rem; padding-top: 2rem; text-align: left;}
	}
	@media (min-width: 576px) and (max-width: 767px) {
		.foa-videos {margin: 0 0 0 3rem;}
	}
	@media (min-width: 768px) and (max-width: 991px) {
		.foa-videos {width: 75%; margin: 0 auto;}
	}
	@media (min-width: 992px) {
		.foa-videos {border-bottom: none; margin-left: 1.5rem; padding-top: 0; padding-bottom: 0;}
	}

.card-contact:before { background-image: url("/images/icon-contact.svg"); } 

/* Colorful cards seen on /areas/ and /seer-mhos/aboutdata/survey-data.html */
.card-aoi .card-title a, .card-aoi .card-title a:hover {color: #fff!important;}
.card-aoi .card-white, .card-aoi2 .card-white {padding: 0;}
.card-aoi a {text-decoration: none;}
.card-aoi a:hover, .card-aoi a:focus {text-decoration: underline;}
.card-aoi .card-head img {min-width: 60px;}
.card-aoi .card-white .card-head, .card-aoi .card-white .card-content {padding: 1rem;}
.card-aoi .card-white .card-title{color: #fff;}
.card-aoi .card-white .card-title {color: #fff; width: 100%;}
.burgundy01:not(.card-white), .card-head.burgundy01 img {background: #490e27;}
.burgundy03:not(.card-white), .card-head.burgundy03 img {background: #750e3e;}
.burgundy05:not(.card-white), .card-head.burgundy05 img {background: #7A243E;}
.blue01:not(.card-white), .card-head.blue01 img {background: #012A51;}
.blue03:not(.card-white), .card-head.blue03 img {background: #0C457C;}
.blue05:not(.card-white), .card-head.blue05 img {background: #124A6C;}
.card-white.burgundy01:hover, .card-white.burgundy01:focus {box-shadow: 0 3px 6px rgba(73,14,39,0.5);}
.card-white.burgundy03:hover, .card-white.burgundy03:focus {box-shadow: 0 3px 6px rgba(155,34,90,0.5);}
.card-white.burgundy05:hover, .card-white.burgundy05:focus {box-shadow: 0 3px 6px rgba(122,36,62,0.5);}
.card-white.blue01:hover, .card-white.blue01:focus {box-shadow: 0 3px 6px rgba(1,42,81,0.5);}
.card-white.blue03:hover, .card-white.blue03:focus {box-shadow: 0 3px 6px rgba(12,69,124,0.5);}
.card-white.blue05:hover, .card-white.blue05:focus {box-shadow: 0 3px 6px rgba(18,74,108,0.5);}


/* ==================================================
	Tables
================================================== */
.table .thead-dark td, .table .table-dark td {color: #fff;/*background-color: #343a40;*/border-color: #454d55;}
.table .thead-dark a, .table .table-dark a {color: #fff;}
caption {caption-side: top;font-weight: bold;font-size: .8em;}
.table td, .table th {padding: 0.75rem;}

.wide {font-size: .8em;}
.table-fixed {table-layout:fixed;}
.table-fixed .colspan2 {width: 20%!important;}
.table-striped .table-dark th, td.table-dark {background-color: #212529!important;}

table.align-right td {text-align: right;}
.bg-dark a {color: #fff;}

/* ==================================================
	Tabs
================================================== */
.nav.nav-tabs {position: relative; z-index: 2;}
.nav-tabs .nav-link::after {background: var(--dccps-button-primary-default);}
.nav-tabs .nav-link {color: var(--dccps-button-primary-default);}
.tab-content {position: relative; top: 8px; z-index: 1;}
@media screen and (max-width: 992px){
    .nav-tabs .nav-link {color: var(--dccps-button-primary-default); box-shadow: inset 6rem 0 0 -3.5rem #4a4a4a;}
    .nav-tabs .nav-link.active, .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {background: var(--dccps-button-primary-default);}
	.nav-tabs .nav-link::before {display: table-cell; width: 2.5rem; height: 2.5rem; ; vertical-align: top; border-radius: 4px 0 0 4px; top: .12rem; left: 0;}
	.nav-tabs.tabs-md .nav-link.active, .nav-tabs.tabs-md .nav-link:focus, .nav-tabs.tabs-md .nav-link:hover {background: var(--dccps-button-primary-default)!important;}
	.nav-tabs.tabs-md .nav-link {box-shadow: inset 6rem 0 0 -3.5rem var(--dccps-button-primary-default)!important}
	.nav-tabs button {width: 100%; display: block; text-align: left;}
	.tab-content {top: 0;}
}

/* ==================================================
	Past Events DataTables
================================================== */
.indicate { margin-bottom: .5rem; }
img[src*="icn-video.svg"] { max-width: 1.25rem; max-height: 1.25rem; vertical-align: text-bottom; margin-right: .25rem; }
#past-events .dataTable { width: 100%!important; }
#past-events .dataTable, #past-events .dataTable th, #past-events .dataTable td { box-sizing: border-box; }
#past-events .controlWrap { background: #f2f2f2; padding: 1em; border-bottom: none; }
#past-events #catSel, #past-events #recSel { display: inline-block; margin-right: 1em; }
#past-events #catSel select { max-width: 100%; }
#past-events .controlWrap label { font-weight: bold; text-align: left; margin-bottom: .25rem; display: block; }
#past-events .controlWrap .dataTables_filter { display: inline-block; float: none; text-align: left; }
#past-events .controlWrap .dataTables_filter input { margin: .25em 0 0 0; }
@media (max-width: 991px) {
	#past-events #catSel, #past-events #recSel { width: 49%; margin-right: 2%; }
	#past-events #recSel { margin-right: 0; }
	#past-events .controlWrap .dataTables_filter { display: block; margin: .5em 0 0 0; }
	#past-events .controlWrap .dataTables_filter input { width: 100%; }
}
@media screen and (max-width: 47.99em) {
	#past-events #catSel, #past-events #recSel { float: none; margin-bottom: .75em; margin-right: 0; width: 100%; }
}

.date strong:first-child {
    font-size: 1.2em;
}

/* ==================================================
	Current Projects DataTables
================================================== */
#current_projects .mhosProjects { width: 100%!important; }
#current_projects .mhosProjects, #current_projects .mhosProjects th, #current_projects .mhosProjects td { box-sizing: border-box; }
/*#current_projects .controlWrap { background: #f2f2f2; padding: 1em; border-bottom: none; }
#current_projects .controlWrap label { font-weight: bold; text-align: left; margin-bottom: .25rem; display: block; }*/
#current_projects .tog-content {margin-bottom: 0.5em;}
#current_projects .tog-control button {font-weight: 700;}
#current_projects .tog-control .state, #current_projects .tog-control button[aria-expanded="true"] {background-color: var(--dccps-blue);}
#current_projects .tog-control button:hover, #current_projects .tog-control button:focus {background-color: var(--dccps-blue); color: #fff;}

/* shadows on responsive tables */
/* https://codepen.io/hawcubite/pen/GZXLBR */
.widetable { max-width: 100%; overflow: auto; position: relative; }
.table-inner-wrapper { position: relative; overflow: auto; max-width: 100%; }
.table-shadow { position: absolute; top: 0; bottom: 0; height: 100%; width: 1rem; z-index: 1; pointer-events: none; opacity: 0; }
.shadow-left { left: 0; background-image: linear-gradient( to left, rgba(0,0,0,0), rgba(0,0,0,.15) ); }
.shadow-right { right: 0; background-image: linear-gradient( to right, rgba(0,0,0,0), rgba(0,0,0,.15) ); }
.widetable table { min-width: 520px; margin-bottom: 0; }


@media (max-width: 991px) {
	#current-projects #catSel, #current-projects #recSel { width: 49%; margin-right: 2%; }
	#current-projects #recSel { margin-right: 0; }
	#current-projects .controlWrap .dataTables_filter { display: block; margin: .5em 0 0 0; }
	#current-projects .controlWrap .dataTables_filter input { width: 100%; }
}
@media screen and (max-width: 47.99em) {
	#current-projects #catSel, #current-projects #recSel { float: none; margin-bottom: .75em; margin-right: 0; width: 100%; }
}

.date strong:first-child {
    font-size: 1.2em;
}

/* ==================================================
	Flickity v2.1.2 (News Archives Slider)
================================================== */
.flickity-page-dots { display: none; }
.flickity-enabled { padding: 0 75px; }
.carousel-cell { width: 33.3%; margin-right: 1rem;}
.carousel-cell a { display: flex; margin: 0 1em 0 0; white-space: normal; }
.carousel-cell a:focus {text-decoration: underline;}
.carousel-cell a.extlink {position: absolute;left: -2rem;bottom: 1rem;}
.flickity-prev-next-button {height: 60px;}
.home .flickity-prev-next-button {height: 175px;top: 46%;}
@media (max-width: 992px) { .carousel-cell { width: 50%; } }
@media (max-width: 768px) { .carousel-cell { width: 100%; } .text-md-center .btn.btn-page {width: 100%;}}
@media (max-width: 380px) { .flickity-prev-next-button, .home .flickity-prev-next-button {top: 100%; height: 42px; margin: 1rem 0;} .flickity-prev-next-button .flickity-button-icon {top: 20%;} .flickity-enabled { padding: 0; padding-bottom: 1rem; }  .card-accent .card-title, .card-content p { font-size: .9rem;} }

/* ==================================================
	Forms and Inputs
================================================== */
p#sort-by {
    background: #eee;
    padding: .5rem 1rem;
}
span.sort {
    font-weight: bold;
    /* width: 100%; */
    display: block;
}
#sort-by input {
    margin-right: .3rem;
}
#sort-by label {
    margin-right: 1rem;
}

/* BS5 helper for appended/prepended buttons */
.input-group-text.input-group-button {background-color: transparent; border-color: transparent; padding: 0;}
.input-group-button button {border-top-left-radius: 0; border-bottom-left-radius: 0;}

/* ==================================================
	Css Flow Chart
================================================== */
.tree ul {padding-top: 20px; position: relative; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; list-style-type:none; list-style-image:none; padding-left:0;}
.tree li {float: left; text-align: center; list-style-type: none; position: relative; padding: 20px 0 0 5px; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; list-style-image: none;}
.child {width: 48%;}
li.grandchild {width:47%;}
li.greatgrandchild { width:50%;}

/*We will use ::before and ::after to draw the connectors*/
.tree li::before, .tree li::after{content: ''; position: absolute; top: 0; right: 50%; border-top: 1px solid #ccc; width: 50%; height: 20px;}
.tree li::after{right: auto; left: 50%; border-left: 1px solid #ccc;}

/*We need to remove left-right connectors from elements without
any siblings*/
.tree li:only-child::after, .tree li:only-child::before {display: none;}

/*Remove space from the top of single children*/
.tree li:only-child{ padding-top: 0;}

/*Remove left connector from first child and
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after{border: 0 none;}
/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before{border-right: 1px solid #ccc; border-radius: 0 5px 0 0; -webkit-border-radius: 0 5px 0 0; -moz-border-radius: 0 5px 0 0;}
.tree li:first-child::after{border-radius: 5px 0 0 0; -webkit-border-radius: 5px 0 0 0; -moz-border-radius: 5px 0 0 0;}

/*Time to add downward connectors from parents*/
.tree ul ul::before{content: ''; position: absolute; top: 0; left: 50%; border-left: 1px solid #ccc; width: 0; height: 20px;}

.tree li span{border: 1px solid #94a0b4; padding: 5px 5px; text-decoration: none; color: #444; display: inline-block; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; background: #c8e4f8;}

/*We will apply the hover effect the the lineage of the element also*/
.tree li span:hover, .tree li span:hover+ul li span {background: #c8e4f8; color: #000; border: 1px solid #94a0b4;}

@media (max-width:1050px) {
    .parent {width:100%;}
    .parent span {width:90% !important;}
    .child {width:47% !important;}
    .grandchild {width:45% !important;}
    .greatgrandchild {width:40% !important;}
}

/* ==================================================
	Staff Organizational Chart
================================================== */
/*.org-chart-wrap {margin: 0 1rem 0 -17rem;}*/
.org-chart b, .org-chart strong {font-weight: 600;}
.org-chart {margin-right: -5px;  margin-left: 15px;}
.cardWrap.org-chart {margin-left: 0; margin-right: 0;}
.cardWrap.org-chart .card-dark > .card-title {flex-direction: column; justify-content: center; min-height: 80px;}
.org-chart, .org-chart a {color: #000;}
.org-chart .org-oad, .org-chart .org-oad a {color: #fff;}
.org-chart a {text-decoration: none; font-weight: 600;}
.org-chart > p.ms-auto {width: auto;}
.org-chart > .card-33 {padding: 0 1rem 1rem 0;}
.org-chart > .card-33:first-child {padding-left: 0.25rem}
.org-chart > .card-33:last-child {padding-right: 0.75rem;}
.org-chart h3 {text-transform: uppercase; font-size: 1rem; font-weight: 300;}
.org-chart div.card {border: none; border-radius: 0 !important;}
.org-chart-image {height: 75px; width: 75px; border: 3px solid #fff; border-radius: 50%; overflow:hidden; margin: 0 auto;}

.org-oad {background: var(--dccps-primary-navy); padding:0;}
.oad-wrap {background: var(--dccps-blue); margin: 0; min-width: 100%;}
.org-topLeft {background: var(--dccps-card-blue-lighter); flex-direction: row; justify-content: space-around;}
.org-topRight {background: transparent; font-size: 1rem;}

.harb-head.card-dark > .card-title, .hsirb-head.card-dark > .card-title, .orb-head.card-dark > .card-title {border-top: none;}
.harb-head.card-dark, .hsirb-head.card-dark, .orb-head.card-dark {min-width: 100%; padding: 0; box-shadow: none;}
.harb-head.card-dark:hover, .hsirb-head.card-dark:hover, .orb-head.card-dark:hover, .harb-head.card-dark:focus, .hsirb-head.card-dark:focus, .orb-head.card-dark:focus {top: 0;}

.harb-head.card-dark {background: #c87c50;}
.hsirb-head.card-dark {background: #cb855c;}
.orb-head.card-dark {background: #d6a180;}
.harb-head.card-dark > .card-title, .hsirb-head.card-dark > .card-title, .orb-head.card-dark > .card-title {color: #000; padding: 1rem;}
.harb-head.card-dark > .card-title {background: #c26b3a;}
.hsirb-head.card-dark > .card-title {background: #c87c50;}
.orb-head.card-dark > .card-title {background: #cb855c;}

.harb-body, .hsirb-body, .orb-body {padding: 0 15px 1.875rem;}
.harb-body .org-chart-image, .hsirb-body .org-chart-image, .orb-body .org-chart-image {margin: 0 auto .5rem auto;}

.org-oad h2, .harb-head h2, .hsirb-head h2, .orb-head h2  {font-weight: 500;}
.harb-head h2, .hsirb-head h2, .orb-head h2 {font-size: 1.25rem; padding: .5rem; margin-bottom: 0; text-align: center;}

.org-staff-list {padding: 0 1rem; font-size: 1rem; color: #000;}
.org-oad .org-staff-list {color: #fff;}
.org-branch-chief p {color: #000; margin-bottom: 0;}

@media (max-width: 1200px){
	.card-33.org-harb, .card-33.org-hsirb, .card-33.org-orb {width: 50%;}
}
@media (max-width: 992px){
	.card-33.org-harb, .card-33.org-hsirb, .card-33.org-orb {width: 100%;}
}
@media (max-width: 768px){
	.org-chart > .card-33 {padding: 0 0 .5rem 0 !important;}
}
@media (min-width: 576px){
	.orgChartModal .modal-lg {max-width:75%;}
}
.card-33.org-harb:before, .card-33.org-hsirb:before, .card-33.org-orb:before {content: ""; height: 30px; padding: 0 12px; margin: -30px 0 0 -30px; position: relative; top: 9px; left: 50%; border-radius: 50%; border: 3px solid #fff; z-index:999;}
.card-33.org-harb:before {background: #c26b3a;}
.card-33.org-hsirb:before {background: #c87c50;}
.card-33.org-orb:before {background:#cb855c;}

/* ==================================================
	PRO-CTCAE Fig 1
================================================== */
.burgundyHeading {background: var(--dccps-blue); color: #dfdfdf; font-size: 2rem; padding: 1.5rem; margin-top: 1rem; margin-bottom: 0; text-align: center; text-transform: uppercase;}
#fig1 {font-size: 2.5rem; padding: 2rem; margin-top: 1.5rem;}
ol.wider {padding-inline-start: 20px;}
.proFigWrapper {justify-content: space-between;}
.boxWrapper {justify-content: space-between; flex-direction: column; background: #124a6c; padding-bottom: 2rem; width: 100%;}
.boxWrapper .box h3 {background: #dfdfdf; color: #124A6C; font-size: 1.25rem; margin:0; padding: .5rem; text-transform: uppercase; text-align: center;display: flex; align-items: center; justify-content: center;}
.threeBox .box h3 {font-size: 1.5rem; margin:0 0 .75rem; padding: 1rem;}
.boxWrapper .box {background: #fff;}
.boxWrapper .box.last {margin:0;}
.boxWrapper .box ul {padding-right: 1rem; font-weight: 400;}
.fourBox .box p, .fiveBox .box p {padding: 0.5rem; margin-bottom: 0;}
.fourBox .box ul, .fiveBox .box ul {padding: 0 0.5rem 0.5rem 40px;}
	
@media (min-width: 1100px) {
	.boxWrapper:not(.threeBox) {flex-direction: row;}
	.boxWrapper .box:not(.last) {border-right: 2px solid #124A6c;}
	.fourBox .box, .fiveBox .box {display: flex; flex-direction: column;}
	/*.fourBox .box ul, .fiveBox .box ul {margin-top: auto;}*/
	.fourBox .box {width: 25%; margin: 0;}
	.fiveBox .box {width: 20%; margin: 0;}
	.fourBox h3, .fiveBox h3 {height: 64px;}
	.fourBox .box p, .fiveBox .box p {padding: 0.5rem; margin-bottom: 1rem;}
	.fourBox .box ul, .fiveBox .box ul {padding-top: 0.5rem; border-top: 1px solid #124a6c;}
}
@media (min-width: 992px){
	.boxWrapper.threeBox {flex-direction: row;}
	.boxWrapper.threeBox .box:not(.last) {border-right: 2px solid #124A6c;}
	.proFigWrapper {flex-direction:column-reverse;}
	.threeBox .box {width: 33.3333%; margin: 0;}
}

/* ==================================================
	SEER-MHOS Multimedia Page; News & Events refresh
================================================== */
#newsletters p, #videos p, #highlights p, #youcanuse p {color: #333!important;}
.bg-multimedia, .bg-news {position: relative; z-index: 2;}
.bg-multimedia::before, .bg-news::before {display: block; content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; background-color: #ffffff; background-image: url("/images/home/news-bg.jpg"); background-size: cover; background-position: right bottom; opacity: 0.5}

/*.bg-news .card-accent {border-color: var(--dccps-primary-navy);}*/
.discover { padding-right: 1rem; position: relative; }
.discover:after { content: ""; position: absolute; top: 50%; margin-top: -1.5px; right: 0; height: 5px; width: 9px; background: url("../images/seer-mhos/arrow-down-white.png") center no-repeat; transform: rotate(-90deg); }
#multimediaNav, #newsNav, #nihDMSNav {list-style: none!important; display: flex!important; flex-wrap: wrap!important; margin: 0!important; padding: 0!important;}
.newsButtons {width: 100%; display: flex;}
.newsButtons a.btn {display: inline-block; width: 46.5%!important;}
.newsButtons a.btn:first-child {margin: 0 auto 0 0.5rem;}
.newsButtons svg {height: 0.75rem; width: 0.75rem; margin-bottom: 2px;}
.cardWrap .newsButtons a.btn:last-child {margin: 0 0.5rem 0 auto;}
.newsCardWrap .card-white {display: flex; flex-direction: column;}
.newsCardWrap .card-foot {margin: auto -1rem 0;}
.newsCardWrap a.btn .card-extlink {padding: 0.25rem;}
#newsConnect p {color: #212529;}
#newsConnect .card-dark img.icon {max-width:none; float: none;}
#newsConnect .card-dark {display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start;}
.angledTipWrap {background:linear-gradient(to right, var(--dccps-primary-navy) 49.9%, transparent 50%);}
.angled-tip {margin-bottom: 3rem; padding: 1.5rem 3rem;}
.bg-news .card-news .col-lg-8.col-md-6 {display: flex; flex-direction: column;}
.card-accent .newsButtons {margin-top: auto; display: flex; align-self: flex-start;}
.card-accent .newsButtons a {width: auto!important;}
.newsImageWrap {display: flex; justify-content: center; align-items: center;}

/* Connect With Us Icons */
.newsletter .iconWrap {display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 1rem;}
.newsletter .iconWrap a {font-size: 1rem; font-weight: 400;}
.newsletter .iconWrap a.extlink {display: none;}
.newsletter .iconWrap p {margin: 0 0 0 0.5rem; font-size: 1rem; font-weight: 400;}
.newsletter .icon {border: 2px solid #fff; padding: 3px; border-radius: 50%; height: 32px; width: 32px; position: relative;transition: transform .3s ease-in-out;}
.newsletter .icon a {display: inline-block; top: -5px; left: -5px; height: 32px; width: 32px; position: relative;}
.newsletter .icon a:hover {transform: scale(1.1);}
.newsletter .icon svg {fill: #fff; position: absolute; left: 8px; top: 8px;}
.newsletter .icon.icon-twitter {background: #0b7bc1;}
.newsletter .icon.icon-linkedin {background: #0a66c2;}
.newsletter .icon.icon-subscribe {background: #0C457C;}
.newsletter .icon.icon-contact {background: #012A51;}

@media (max-width: 991px) {
	.angled-tip {width: 100%;}
	.discover {display: inline-block;}
	.seermhosnews .discover:after {transform: rotate(0deg);}
	.branchNav {padding-bottom: 1rem;}
}
@media (max-width: 1221px) {
	.seercahpsotp .angled-tip {width: 100%; padding: 1.5rem 3rem; margin-bottom: 3rem;}
	.seercahpsotp .discover {display: inline-block;}
	.seercahpsotp .discover:after {transform: rotate(0deg);}
	.seercahpsotp .angled-tip::after {display: none;}
}
@media (max-width: 767px) {
	.bg-news .newsImageWrap img {max-width: 75%;margin-bottom: 1.5rem;}
	.newsandevents .discover:after, .dms .discover:after {transform: rotate(0deg);}
	.discover {padding-left: 0;}
	.angled-tip-extended .discover::after {right: 0%;}
}
@media (max-width: 575px) {
	.branchNav li {margin-bottom: 1rem;}
	.branchNav li:last-child {margin-bottom: 0;}
	.branchNav li, .branchNav a {width: 100%;}
}
@media (min-width: 992px) {
	.angled-tip {position: relative; width: 765px; padding: 1.5rem 3rem 1.5rem 0;}
	.angled-tip-extended {width: 85%;}
	.angled-tip::after {content: ''; height: 100%; width: 25%; background: var(--dccps-primary-navy); position: absolute; z-index:-1; top: 0; right: -6.75%; transform: skew(-40deg);}
	.bg-news {padding-top: 3rem; border-top: 3px solid var(--dccps-blue);}
	.angled-tip-extended::after {width: 20%; right: -7.75%;}
}
@media (min-width: 1200px) {
	.angled-tip {position: relative; width: 75%;}
	.angled-tip.angled-tip-extended {width: 85%;}
	.angled-tip::after {content: ''; right: -6.75%; transform: skew(-50deg);}
	.angled-tip.angled-tip-extended::after {transform: skew(-40deg);}
}
@media (min-width: 1220px) {
	.seercahpsotp .angled-tip {z-index: 1;}
}
@media (min-width: 576px) and (max-width: 1305px) {
	#nihDMSNav a.btn {margin-bottom: .75rem;}
}
@media (min-width: 768px) and (max-width: 1305px) {
	.angled-tip-extended .discover::after {right: 10%;}
}

/* ==================================================
	Funding Grantees & Sample Grant Applications
================================================== */
h3.first {font-size: 1.225rem; margin-bottom: 0;}
div.staff-title {font-size: 14px; font-weight: 400; margin: 0 0 15px; text-transform: uppercase; letter-spacing: .05em;}
.grantee-quote {font-family: Merriweather,"Times New Roman",Times,Georgia,serif; font-weight: 300; font-style: italic; font-size: inherit; line-height: 20px;}
p.view-sample {margin-bottom: 0;}
	
@media (min-width: 992px){
    .col-lg-pull-9 {right: 75%;}
}
@media (min-width: 992px){
    .col-lg-push-3 {left: 25%;}
}

/* ==================================================
	Webinar Pages 2023 Redesign
================================================== */
.webinar-headshot {height: 125px; width: 125px; border-radius: 50%; margin-bottom: 20px; margin-right: 20px;}

@media (min-width: 768px) and (max-width: 992px) {
	.webinar-sidebar .card-head img {margin-right: 0;}
}

/* ==================================================
	Bootstrap dropdown arrow
================================================== */
.dropdown-toggle::after {display: inline-block; border-top: .3em solid; border-right: .3em solid transparent; border-bottom: 0; content: "" !important; border-left: .3em solid transparent; background: transparent !important; position: relative !important; transform: unset !important; width: 0 !important; top: 3px;}

/* ==================================================
	MISC.
================================================== */
a {overflow-wrap: break-word; word-wrap: break-word;}
.noBullet {list-style-type: none;}
.noIndent { padding-left: 0; }

@media (min-width: 992px){
	.col-lg-pull-8.branch-image {right: 66.66666667%;}
	.col-lg-push-4.branch-description {left: 33.33333333%;}
}

.medicaid-obtain li {list-style-type: lower-alpha;}
.bg-lightgray .card-extlink {background: transparent;}

/* ==================================================
	STYLE GUIDE ITEMS NOT CURRENTLY IN USE ELSEWHERE
================================================== */
/* tabs */
.nav-tabs .nav-link::after {background: var(--dccps-button-primary-default);}
.nav-tabs .nav-link {color: var(--dccps-button-primary-default);}
@media screen and (max-width: 576px){
    .nav-tabs .nav-link {color: #4a4a4a; box-shadow: inset 6rem 0 0 -3.5rem #4a4a4a;}
    .nav-tabs .nav-link.active, .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {background: #4a4a4a;}
	.nav-tabs .nav-link::before {
		display: table-cell;
		width: 2.5rem; 
		height: 2.5rem; 
		background: #4a4a4a url(/images/dccps/toggle.png) .75rem .75rem no-repeat; 
		vertical-align: top; 
		border-radius: 4px 0 0 4px;
		top: .12rem;
		left: 0;
	}
	.nav-tabs .nav-link.active::before {background: transparent url(/images/dccps/toggle.png) .75rem -5.875rem no-repeat;}
}

/* additional icons */
.icon-header-web:before { background-image: url("/images/dccps/icon-2x-web.jpg"); }
.icon-header-speaker:before { background-image: url("/images/dccps/icon-2x-speaker.jpg"); }
.icon-header-book:before { background-image: url("/images/dccps/icon-2x-book.jpg"); }
.icon-header-calendar:before { background-image: url("/images/dccps/icon-2x-calendar.jpg"); }
.icon-header-listserv:before { background-image: url("/images/dccps/icon-2x-purp-listserv.png"); border: none; }

/* headings icon spacing */
.sg-headings-icons h2 {padding-top: 1.875rem;}
