/* Rules for CTPS "branding" */
#banner{
	position:relative;
	height:100%;
	left:2%;
	top:-43px;
	z-index:15;
	border: none;
}
.pagetitle{
    font-size: 17px;
}
.ctpsHeader{
	height:59px;
	background-color:white
}
.lightBlue{
	height:27px;
	width:100%;
	background-color:#7DA1C4;
	z-index:10;
}
.darkBlue{
	height:16px;
	width:100%;
	background-color:rgb(13,72,127);
	z-index:10;
}
/* End of rules for CTPS "branding" */

/* Begining of rules for the app itself. */
#outer_container {
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: stretch; 
	margin-top: 25px;
}

#inner_container {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: stretch; 
	order: 1;
}
#svg_container {
	order: 1;
	max-height: 726px; /* height: 726px; */
	width:  800px;
	border-style: solid;
	border-width: 1px;
	border-color: steelblue;
	margin-bottom: 10px;
}

#inner_container_right {
	order: 2;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	margin-left: 60px;
	margin-right: 75px;	
}
#button_div {
	order: 1;
	height: 40px;
}
#play_button {
	width: 54px;
}
#slider-vertical {
	order: 2;
	height:686px; /* (was 726px) Appears to need a hard-wired height. */
	/*
	margin-bottom: 10px;
	margin-left: 60px;
	margin-right: 75px;
	*/
}

#output {
	order: 2;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	font-family:"Trebuchet MS","sans-serif";
	height: 100%; 	/* height: 726px; */
	/* width: 550px; */
	width: 25%;
	margin-left: 15px;
	overflow-x: auto;
	overflow-y: auto;
	border-style: solid;
	border-width: 1px;
	border-color: white;
}

#output_header {
	order: 1;
	display: flex;
	flex-flow: row wrap;
	width: 99%;
	justify-content: space-between; 
}
#output_body {
	order: 2;
	display: flex;
	flex-flow: column wrap;
	width: 99%;
}

#output_year {
	order: 1;
	display: flex;
	color: black;
	font-size: 30px;
	font-weight: bold;
}
#download_button_div {
	order: 2;
	display: flex;
}
#download_button {
	height: 21px;
}


/* Force vertical alignment of contents of <table> used to fake bullets in an unordered list. */
td.fake_li_bullet {
	vertical-align:	top;
}

/* "Generic" unordered list for app - no indentation. */
ul.unindented_ul {
	list-style-position: inside;
	padding-left: 0;
}

.opened_list_caption {
	color: black;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.milestone_opened {
	color: black;
	font-size: 18px;
	font-weight: bold;
}

.reopened_list_caption {
	color: #009cdc;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.milestone_reopened {
	color: #009cdc;
	font-size: 18px;
	font-weight: bold;
}

.closed_list_caption {
	color: #ef3e42;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.milestone_closed {
	color: #ef3e42;
	font-size: 18px;
	font-weight: bold;
}

.legislative_list_caption {
	color: #009b67;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.milestone_legislative {
	color: #009b67;
	font-size: 18px;
	font-weight: bold;
}
.resources_list_caption {
	color: black;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.resource_item {
}
.resource_link {
}

.historical_list_caption {
	color: black;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 0px;
}
.historical_item {
	color: gray;
	font-size: 16px;
	font-weight: bold;
}


/* Rules for elements of the vertical slider.*/
/* The slider "bar": */
#slider-vertical .noUi-base .noUi-connects {
	background-color: #fe9929;
}

/* End of rules for the app itself. */