html {
 height: 100%;
 display: flex;
 flex-direction: column;
}
body {
 background-image: url(/resources/assets/frontend/img/bg-body-ucar-v4.png);
 background-position: top right;
 background-repeat: repeat-y;
 background-color: #dbe2e9;
 margin: 0;
 padding: 0;
 color: #333333;
 line-height: 1.3em;
 font-size: 1.15em;
 height: 100%;
 display: flex;
 flex-direction: column;
 font-family: "Poppins", "UbuntuRegular", "Lucida Grande", Verdana, Arial;
}
div#flex_container {
 overflow: hidden;
 display: flex;
}
div#container {
 height: auto; 
 min-height: 100%;
 border: 1px solid #323133;
 margin: 0;
 padding: 10px 1%; /*DD: mix px and % in favor of the old 2% 1% */
}
div#wrap {
 width: 100%;
 /*max-width: 74em;*/
 margin: 0 auto;
 /*flex: auto; /* Set in flexdocs.css */
}

h1 {
 color: #000000;
 font-size:3rem;
 line-height: 3.75rem;
 font-weight: 700;
}

h1 {
 margin:0 auto 0.5em auto;
}
h2 {
 margin-bottom: 0.3em;
}
h3 {
 margin-bottom: 0.2em;
 font-size:120%;
}
h4 {
 margin-bottom: 0.1em;
 font-size:115%;
}
h5 {
 margin-bottom: 0.05em;
 font-size:110%;
}

div#header2.headerBox h1 a:visited {
 color: #FFFFFF;
}

div#container p {
 margin-top: 0.3;
}

/* hyperlinks */
a:link {
 color: #06778F;
 text-decoration: none;
}
a:visited {
 color: #81B2C0;
 text-decoration: none;
}
a:active {
 color: #81B2C0;
 text-decoration: underline;
}

a:hover {
 color: #81B2C0;
 text-decoration: underline;
}
a img {
 border: 0px; /*for IE<11 */
}

main {
  flex: 0 1 75%;
  margin: 0 1% 0 0;
  padding:0;
}

.expand {
 display: block;
}

#breadcrumbs {
 padding:0;
 display: flex;
 flex-wrap: wrap;
 list-style: none;
}

#breadcrumbs li {
 display: inline;
 margin:0;
 padding-left:10px;
 list-style-type: none;
 color: #53565a;
 font-size: 0.85em;
}

#breadcrumbs li.first {
 padding-left:0;
}

#breadcrumbs li a:after {
 content: " \002F ";
 padding:0 0 0 10px;
 color: #53565a;
}

#breadcrumbs li a:hover {
 text-decoration: none;
}

.fa {
 color: #53565a;
}

aside {
 flex: 0 1 25%;
 margin: 3.5em 0;
 padding:0;
}

aside h2 {
 font-size: 1.125rem;
 font-weight: 600;
 text-transform: uppercase;
 color: #FFFFFF;
 line-height: 1;
 margin: 0;
 padding: 1.0rem 1.825rem;
 border-bottom: 1px solid #000000;
 background-color: #323133;
}

aside ul {
 padding:0;
 margin:0 !important;
 list-style: none;
 border: 1px solid #000000;
 background-color: #323133;
}

aside ul li {
 margin: 1em 0;
 list-style-type: none;
}

aside li  button {
 border: none;
 background-color: #323133;
 color: #FFFFFF;
 width: 100%;
 font-size: 1rem;
 line-height: 1.5rem;
 text-align: left;
 padding-left: 1.825rem;
 padding-right: 1.825rem;
 cursor: pointer;
}


aside li button:hover {
 color: #40c1ac;
}

#list {
 margin:15px 0 0 0;
 padding:0;
 list-style: none;
}
#list li {
 margin-bottom:5px;
 padding:0;
 list-style-type: none;
}

#list li i {
 display:inline;
 margin-left:10px;
 line-height: 1.4em;
}
#list li i:hover {
 cursor: pointer;
}

#list li i span{
 margin-left:10px;
 font-size: 0.85em;
 line-height: 1.4em;
 font-family: "Poppins", "UbuntuRegular", "Lucida Grande", Verdana, Arial; 
}

.hide {
 display:none;
}

/* simple table styling */
table.simple {
 border-collapse: collapse;
 border: 1px solid #323133;
 width: auto;
 margin: 0;
 font-size: 1rem;
}
table.simple td {
 vertical-align: top;
 padding: 10px;
 background-color: #FFFFFF;
 border: 1px solid #323133;
}

table.simple td.name {
 width: 20%;
 white-space: nowrap;
}

table.simple td ul {
 list-style: none;
 display: flex;
}

table.simple td ul li {
 list-style-type: none;
 margin:0;
 padding:0;
 flex: 1 1 auto;
}

table.simple td ul li a {
 text-transform: uppercase;
 font-weight: bold;
 font-size: 0.85em;
 line-height: 1.3em; 
 margin:0;
 padding:8px;
}

table.simple td ul li a:hover {
 text-decoration: none;
 background-color: #00797c;
 color: #FFFFFF;
}


table.simple th {
 vertical-align: top;
 padding: 10px;
 border: 1px solid #323133;
 background-color: #00797c;
 color: #FFFFFF;
 text-align:left;
}
























/* search box in banner */
#search-floater {
 border:1px solid #E3E4E6;
 position:relative;
 float:right;
 top:30px;
 /*width:172px;
 /*right:10px;*/
}

#search-floater form {
 position:relative;
 right:0;
 margin-top:0;
 width:172px;
 height:24px;
 float:right;
 margin:0;
}

#search-floater form input.form-text {
 float:left;
 height:24px;
 margin:0;
 width:124px;
 color:#696969;
 padding:2px;
 border: none !important; /* DD 7Aug2015 fixes displaced form-submit button (apparently Google script adds a border style on the input element). */
 box-sizing: border-box;
}

#search-floater form input.form-submit {
 height:24px;
 width:48px;
 float:right;
 padding:0;
 background-color:#034250;
 color:#FFFFFF;
 font-size: 0.85em;
 border:none;
}

/* image styling */
img.nodec {
	border: none;
	margin: 0 10px 0 0;
	padding: 3px;
	float: left;
	clear: left;
}

img.dec {
	border: 1px solid #E3E4E6;
	margin: 0 10px 0 0;
	padding: 3px;
	float: left;
}

/* <ul> styling for grid-like layout */

ul.tabular {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
ul.tabular li {
	width: 33%;
	display: inline;
	background: none;
	margin: 10px 0;
	padding: 0;
	border: none;
	float: left;
}
ul.tabular.full li {
	width: 100%;
}
ul.tabular.half li {
	width: 50%;
}
ul.tabular.third li {
 width: 33%;
}
ul.tabular.quarter li {
	width: 25%;
}

/* hide elements */
.nodisplay {
 display: none;
}

#archive_site {
 background-color:chartreuse;
 padding: 0.3em;
}

#archive_site p {
 font-size: 1.4em;
 line-height: 1.4em;
 margin: 0.5em;
 text-align: center;
}


/* Navigation & Header Region
 20200427: currently only search box
--------------------------------------------------*/

/* search box in banner */
#search-floater {
 border:1px solid #E3E4E6;
 /*position:absolute; */ /* removed DD 20200427 */
 top:30px;
 right:10px;
}

#search-floater form {
 border:none;
 margin:0;
 padding:0;
}

#search-floater form input#query_float{
 float:left;
 margin:0;
 width:145px;
 line-height: 24px;
 color:#696969;
 border: none;
 padding:0;
 background: url("https://www.google.com/cse/static/images/1x/googlelogo_lightgrey_46x16dp.png") 0% 50% no-repeat rgb(255, 255, 255);
}

#search-floater form input#query_float:focus{
 background-color: #FFFFFF;
 background-image: none;
}


#search-floater .gsc-search-button-v2,
#search-floater .gsc-search-button-v2 {
 height:24px !important;
 /* width:24px !important; */ /* removed DD 20200427 */
 margin:0;
 padding:0;
}

#search-floater .gsc-search-button {
 border: none !important;
 width:27px;
 margin:0;
 padding:0;
 background-color:#E3E4E6;
 float:right;
}


#search-floater gsc-search-button,
#search-floater gsc-search-button:hover,
#search-floater gsc-search-button:focus {
 border: none !important;
 background-color:#E3E4E6;
 color:#FFFFFF;
 background-image: none;
 filter: none;
}