/* ==================================================
	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;}

/* 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");}

/* styles for the sidenav for the toggle */
.subNav li { position: relative;}
.subNav li a {padding-right: 30px;}
.subNav ul ul li a {padding-left: 20px;}
.subNav ul ul ul li a {padding-left: 30px;}

/* side nav heading & highlight color override */
.subNav .heading {background: #4a4a4a;}
p.heading a {color: #fff;}
p.heading a:hover, p.heading a:focus {text-decoration: underline !important;}
.subNav li a.active {border-left-color: #ca677e;}
.subNav li a:hover, .subNav li a:focus, .subNav li a.active:hover, .subNav li a.active:focus {background: #740a3c;color: #fff;border-left-color: transparent;}

/* page styles */
.bg-darkprimary p {color: #fff;}

/* icon added for headings */
.icon-header-publications:before {background-image: url(../toolbox/images/dccps/icon-2x-publications.png);}
.icon-header-resources:before {background-image: url(../toolbox/images/dccps/icon-2x-interests.png);}
.icon-header-support:before {background-image: url(../toolbox/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; }

/* ==================================================
	Color Overrides for base.css
================================================== */
/* backgrounds */
.bg-primary { background-color: #008390 /*cc*/; }
.bg-lightprimary { background-color: #59d1df /*cc*/; }
.bg-darkprimary { background-color: #4e0d24 /*cc*/; }

/* modal title head */
.modal-header { background: #740a3c /*cc*/; }

/* BS form elements */
.form-control:focus { border-color: #008391 /*cc*/; box-shadow: 0 0 0 .2rem rgba(0,131,145,.25) /*cc*/; }

/* header search */
.searchForm button:hover, .searchWrap button:focus { background: #e9f4f6 /*cc*/; }

/* ribbon */
.ribbon { background: #740A3C /*cc*/; }

/* menu and search toggles for mobile */
.js #menu-button, .js #search-tog { color: #008391 /*cc*/; }
.js #menu-button[aria-expanded="true"], .js #search-tog[aria-expanded="true"] { background: #008391 /*cc*/; border-color: #59d1df /*cc*/; }

/* left nav toggle on mobile */
.togSubNav { background: #008391 /*cc*/;  }
.togSubNav:hover, .togSubNav:focus { background: #01555f /*cc*/; }

/* slider buttons */
.flickity-button { background: #740a3c /*cc*/; }

/* white w/icon, title, desc. */
.card-white:hover, .card-white:focus { box-shadow: 0 3px 6px #c66780 /*cc*/; }
.branches .card-icon img, .card-head img, .card-head img { background: #740a3c /*cc*/; }
.card-white .card-title { color: #740a3c /*cc*/; }

/* white with dark head */
.card-dark:hover, .card-dark:focus { box-shadow: 0 3px 6px #c66780 /*cc*/; }
.card-dark > .card-title { background: #740a3c /*cc*/; border-top: 3px solid #c66780 /*cc*/; }

/* news/funding Cards */
.card-accent { border-left: 50px solid #740a3c /*cc*/; }
/* clickable version */
a.card-accent:hover, a.card-accent:focus { box-shadow: 0 3px 6px #c66780 /*cc*/; }

/* event card */
.card-event { border-top: 3px solid #740a3c /*cc*/; }

/* toggles on page */
.tog-control .state, .tog-control button[aria-expanded="true"] {background-color: #4a4a4a;}
.tog-control button {color: #4a4a4a;}
.tog-control button:hover, .tog-control button:focus {background: #4a4a4a;}
/* ==================================================
	Home
================================================== */
.hero { background: #4e0d24 /*cc*/; }
.hero p { color: #fff /*cc*/; }
.hero div {max-height: 300px; overflow: hidden;}
.hero-links { background: rgba(0,0,0,.8); padding: 10px 0; text-align: center; line-height: 1.2; }
.hero-links ul { list-style: none; margin: 0 auto; padding: 0; }
.hero-links li { padding: 0; margin: 0 5px; }
.hero-links a { text-decoration: none; display: block; width: 100%; height: 100%; padding: 5px 10px; border: 2px solid #fff; color: #fff; vertical-align: middle; }

.hero .lead {background: #625559 /*cc*/;}

.fun-opp { display: flex; }
.fun-details { font-size: 1rem; }
.fun-date { min-width: 125px; }

.twitWrap { overflow-y: scroll; max-height: 21em; }
@media (max-width: 991px) {
	.twitWrap { max-height: 43rem; }
}

/* ==================================================
	Buttons
================================================== */

a.btn.btn-action { width: 100%;color: #fff;background: #740a3c;}
a.btn.btn-action:hover, a.btn.btn-action:focus, a.btn.btn-action:active {color: #212529;background: #f2f2f2;}
a.btn.btn-page {width: 100%;color: #212529;background: #f2f2f2;border: 1px solid #740a3c;}
.lead+a.btn.btn-page{width: auto;}
.bg-lightgray a.btn.btn-page {background: #fff;}
.card-white a.btn.btn-page {background: #f2f2f2;}
.text-md-center a.btn.btn-page {width:50%;}
a.btn.btn-page:hover, a.btn.btn-page:focus, a.btn.btn-page:active {box-shadow: 0 0 0 2px #740a3c;}

/* ==================================================
	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: 2rem;}

figcaption {font-size: .9em; font-weight: bold;padding-bottom: 1rem;}

/* ==================================================
	Nav Links
================================================== */
.nav-pills>li {margin-bottom: 10px;width: 100%;}
.nav-pills>li>a {border-radius: 3px;background-color: #f2f2f2;font-weight: 600;text-decoration: none;padding: 10px 15px;display: block;position: relative;top: 0;transition: all .3s ease-in-out;}

.bg-lightgray>.nav-pills>li>a {background-color: #fff;}
.nav-pills>li>a:hover, .nav-pills>li>a:focus { color: #333; text-decoration: none; top: -.35rem; box-shadow: 0 3px 6px #c66780 /*cc*/; transition: all .3s ease-in-out; }


/* ==================================================
	Cards
================================================== */
.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*/}

.staffCard {padding: 1rem 0;margin: 0;}
.staffCard .card-title {padding-top: 0;}

/* ==================================================
	Tables
================================================== */
.table .thead-dark td {color: #fff;background-color: #212529;border-color: #32383e;}
.table .thead-dark a {color: #fff;}
/* ==================================================
	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%; }
}


/* ==================================================
	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 .25em; white-space: normal; }
.flickity-prev-next-button {height: 60px;}
.home .flickity-prev-next-button {height: 200px;}
@media (max-width: 992px) { .carousel-cell { width: 50%; } }
@media (max-width: 768px) { .carousel-cell { width: 100%; } }