@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'SourceSansPro';
    src: url('../fonts/SourceSansPro-Regular.ttf') format('truetype'); /* Modern browser compatibility. TODO: add more fallback formats */
}
@font-face {
    font-family: 'SourceSansPro-Bold';
    font-style: normal;
    font-weight: 600;
    font-display: swap;  
    src: url('../fonts/SourceSansPro-Bold.ttf') format('truetype'); /* Modern browser compatibility. TODO: add more fallback formats */
}

body  {
	font: .9em Arial, Helvetica, sans-serif;
	background: #FFF;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	color: #000000;
}
h1 {
	font-size: 1.4em;
}
h2 {
	font-size: 1.2em;
}
h3 {
	font-size: 1em;
}
#container {
	width: 100%;
	min-width: 600px;
			
}
/* This div serves no functional purpose, but is necessary to make the design look the same as its older version */
#content {	
	background: #003399;
}

.bg-secondary {
	background-color: #003399;
}
/* ---------------------- HEADER CSS ---------------------- */

/* The two following properties are the CSS for the link to skip repetitive navigation. The first hides the skip navigation link, and the second makes it visible when focus is put on the link (through use of tabbing) */
#skip a, #skip a:hover, #skip a:visited {
	position: absolute;
	left: 0px;
	top: -500px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	background-color: #A90101;
	color: #FFF;
}
#skip a:active, #skip a:focus {
	position: static;
	display: block;
	float: right;
	margin-right: 1.5em;
	width: auto;
	height: auto;
}
section#usa-banner {
    margin-bottom: 0;
    background: #f0f0f0;
	font-family: 'Source Sans Pro', Helvetica, sans-serif;
}
.usa-banner__header-text {
    font-size: 12px;
    line-height: 1.2;
    margin-bottom: 0;
    margin-top: 0;
	padding: 1rem;
}
.usa-banner__header-text img {
	margin-right: .5rem;
}
#nciBanner {
	background-color: #fff;		
}
.nciLogo {
	display: inline-block;
	line-height: 0;
	max-width: 614px;
	
	width: 100%;
}
.nciLogo img {
	max-height: 54px;
	box-shadow: none;  
	margin: 23px;
}
#ribbon { 
	color: #fff; 
	background: #003399; 
	padding: 0 24px;
}
#ribbon h1 { 	 
	padding: 0; 
	margin: 0; 	
}
#ribbon h1 a { 
	color: #fff; 
	font-size: 20px; 
	text-decoration: none; 
	display: inline-block; 
	padding: 9px 0; 
	line-height: 1; 
	font-weight: normal;
	line-height: 1.3;
}

/* --------------------- SIDEBAR CSS ---------------------- */

#sidebar {
	float: left;
	width: 13em; 
	margin-top: 1em;
}
#sidebar ul, #sidebar li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#sidebar a {
	display: block;
	color: #FFF;
	text-decoration: none;
	text-align: center;
	background: #3f73d9;
	border: 1px solid #FFF;
	width: 12em;
	padding: .2em;
	margin: 2px auto 0 auto;
}
#sidebar a:hover {
	background: #FFF;
	color: #000;
	text-decoration: underline;
}
body.detailsBody #sidebar ul #details a, body.detailsBody #sidebar ul #details a:hover,
body.documentationBody #sidebar ul #documentation a, body.documentationBody #sidebar ul #documentation a:hover,
body.projectsBody #sidebar ul #projects a, body.projectsBody #sidebar ul #projects a:hover,
body.publicationsBody #sidebar ul #publications a, body.publicationsBody #sidebar ul #publications a:hover,
body.peopleBody #sidebar ul #people a, body.peopleBody #sidebar ul #people a:hover,
body.collaborationBody #sidebar ul #collaboration a, body.collaborationBody #sidebar ul #collaboration a:hover,
body.consortiumBody #sidebar ul #consortium a, body.consortiumBody #sidebar ul #consortium a:hover {
	background-color: #003399;
	color: #FFF;
	text-decoration: none;
}

/* ------------------- MAIN CONTENT CSS ------------------- */

#mainContent {
	margin: 0 0 0 13em; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	padding: 1em;
	background: #FFF;
	border-left: 1px solid #000;
	min-height: 14em;
}
h1 #pageTitle {
	margin: 0;
	padding: 0;
}
p.caption {
	font-size: .9em;
	font-style: italic;
	text-align: center;
	margin: .5em 0;
}
p.returnTop {
	text-align: right;
}
/* CSS used specifically for the Current Projects page */
.projectList {
	width: 12em;
}
/* CSS used specifically for the ATBC Study Bibliography page */
p.helpButton {
	width: 35em;
	text-align: right;
	margin: 0 0 .2em 0;
	padding: 0;
}
table.searchTable {
	border-collapse: collapse;
	border: 1px solid #3f73d9;
	text-align: left;
	width: 38em;
	background: #3f73d9;
}
table.searchTable th {
	white-space: nowrap;
}
table.searchTable th, table.searchTable td {
	padding: .2em;
	background: #FFF;
}
table.searchTable caption {
	display: block;
	background: #3f73d9;
	text-align: left;
	font-weight: bold;
	color: #FFF;
	padding: .2em .4em;
}

/* ---------------------- FOOTER CSS ---------------------- */

	#footer{
		border-top: 2px solid #A90101;
		font-size: .90em;
		text-align: center;
	}

	#footer p{margin: 10px 0;}
	#footer_govlinks { margin-top: 30px;}
	#footer_govlinks a, p { color: #333; text-decoration: none; }
	#footer_govlinks a:hover { text-decoration: underline; }
	
/* ----------------------- MISC CSS ----------------------- */

.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 1em;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 1em;
}
.clearFlt { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

/* Used primarily to hide form field labels off-screen */
.offscreen {position: absolute; top: -100em; left: -200em; font-size: 1px;}

/* Used to hide content from sighted users but keep it accessible to users of screenreaders or other accessibility technology */
.visuallyhidden {
  position: absolute;
  clip: rect(1px 1px 1px 1px); /* for IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  margin: -1px;
  border: 0;
  padding: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Make fieldsets invisible to sighted users */
fieldset.invisible {
  border: 0;
  padding: 0;
}

@media(max-width: 767px) {
	.pubsearch-app-body .p-card-content .input-group {display: block;}
	.pubsearch-app-body .p-card-content .input-group>input {display: inline; width: 80% !important;}
	#reportGenerationOptions fieldset > div.row .col-auto {display: flex; align-items: center; margin-bottom: .4rem;}
}
@media(max-width: 572px) {
	fieldset[id^="ps-all_dates-"] > div.row {flex-direction: column; padding-left: 1rem;}
	fieldset[id^="ps-all_dates-"] > div.row > .col-4 {padding: 0;}
	fieldset[id^="ps-all_dates-"] > div.row > .col-4:not(:last-of-type) {margin-bottom: .5rem}
}