/* Custom CSS for Officer of the Controller "IU" Theme */

/* ------- Tag ------- */

h1 {
	font-size: 2.25rem;
	font-weight: 700;
}

h2 {
	font-size: 2rem;
	font-weight: 700;
}

h3 {
	font-size: 1.625rem;
	margin-bottom: 1rem;
	font-weight: 700;
}

h4 {
	font-size: 1.4375rem;
	margin-bottom: .5rem;
	font-weight: 700;
}

h5 {
	font-size: 1.25rem;
	font-weight: 700;
}

h6 {
	font-size: 1rem;
	font-weight: 700;
}


hr {
	margin-top: 3rem;
	margin-bottom: 2.5rem;
}


img[src*='#left'] {
	float: left;
	margin-right: 1rem;
	max-width: 40%;
	height: auto;
}

img[src*='#right'] {
	float: right;
	margin-left: 1rem;
	max-width: 40%;
	height: auto;
}

img[src*='#center'] {
	display: block;
	margin: auto;
	max-width: 80%;
	height: auto;
}


img[src*='#fillwidth'] {
    width: 100%;
}

img[src*='#fillcenter'] {
	width: 100%;
	display: block;
	padding-left: 10%;
	padding-right: 10%;
}


iframe {
	display: block;
	width: 100%;
	border: 0;
}



/* ------- ID ------- */

#jumpToTop {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 30px;
	z-index: 99;
}


#supportFormFrame {
	height: 900px;
}

@media only screen and (min-width: 600px) {
	#supportFormFrame {
		height: 725px;
	}
}

/* ------- Class ------- */

.feature_header {
    height: 200px;
    background-position: center center;
    background-size:cover;
}

@media only screen and (min-width: 740px) {
	.feature_header {
		height: 300px;
	}
}

@media only screen and (min-width: 1080px) {
	.feature_header {
		height: 350px;
	}
}

@media only screen and (min-width: 1260px) {
	.feature_header {
		height: 400px;
	}
}

@media only screen and (min-width: 1400px) {
	.feature_header {
		height: 450px;
	}
}

@media only screen and (min-width: 1600px) {
	.feature_header {
		height: 550px;
	}
}




.feature_header_floating_text {
    height: 350px;
    background-position: center center;
    background-size:cover;
    position: relative;
    text-align: center;
}

.feature_header_floating_text div {
    background: rgba(255,255,255,.8);
    border-radius: .5rem;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 85%;
    margin: 0;
    padding: 2rem 3rem;
    font-weight: bold;
    transform: translate(-50%, -50%);
}

.feature_header_floating_text div div {
    background: initial;
    position: relative;
    top: initial;
    left: initial;
    width: 100%;
    margin: 0;
    padding: 0;
    transform: initial;
}


.feature_header_floating_text_button a {
    display: inline-block;
    padding: 4px 10px;
    height: 100%;
    border: 1px solid transparent;
    border-width: 2px;
    border-radius: 20px;
    transition:all .1s ease-in-out;
	cursor: pointer;
	color: white;
	background-color: #900;
	text-decoration: none;
	font-weight: bold;
}

.feature_header_floating_text_button a:focus, .feature_header_floating_text_button a:hover {
	background-color: white;
	border-color: #900;
	border-width: 2px;
	color: #900;
	transition:all .1s ease-in-out;
}


.feature_header_floating_text p {
    margin: 0;
}


@media only screen and (min-width: 740px) {
	.feature_header_floating_text {
		height: 300px;
	}

	.feature_header_floating_text div {
	    width: 80%;
	}
}

@media only screen and (min-width: 1080px) {
	.feature_header_floating_text {
		height: 350px;
	}

	.feature_header_floating_text div {
	    width: 70%;
	}
}

@media only screen and (min-width: 1260px) {
	.feature_header_floating_text {
		height: 400px;
	}
}

@media only screen and (min-width: 1400px) {
	.feature_header_floating_text {
		height: 450px;
	}
}

@media only screen and (min-width: 1600px) {
	.feature_header_floating_text {
		height: 550px;
	}
}




.about_us_button a {
    display: inline-block;
    padding: 10px;
    height: 100%;
    border: 1px solid transparent;
    border-width: 2px;
    border-radius: 20px;
    transition:all .1s ease-in-out;
	cursor: pointer;
	color: white;
	background-color: #900;
	text-decoration: none;
	font-weight: bold;
}

.about_us_button a:focus, .about_us_button a:hover {
	background: 0 0;
	border-color: #900;
	border-width: 2px;
	color: #900;
	transition:all .1s ease-in-out;
}


.documentation_toc {

}

.documentation_toc ul {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 0;
}

.documentation_toc ul li {
	list-style-type: none;
	font-weight: bold;
}

.documentation_toc ul ul {
	list-style-type: disc;
	padding-left: 3rem;
}

.documentation_toc ul ul li {
	list-style-type: disc;
	font-weight: normal;
}



.documentation_two_toc {
	float: right;
	overflow: hidden;
	width: 290px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 1rem;
	margin-left: 1.5rem;
	padding: 0rem .75rem 1rem .75rem;
	/* background-color: #f3f4f6; */
	background-color: #edecea;
}

.documentation_two_toc ul {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 0;
}

.documentation_two_toc ul li {
	list-style-type: none;
	font-weight: bold;
}

.documentation_two_toc ul ul {
	list-style-type: disc;
	padding-left: 3rem;
}

.documentation_two_toc ul ul li {
	list-style-type: disc;
	font-weight: normal;
}



.documentation_three_toc {
	float: right;
	margin-left: 2rem;
}

@media only screen and (min-width: 600px) {
	.documentation_three_toc div {
		width: 400px;
	}
}

.documentation_three_toc div ul li {
	font-weight: bold;
}

.documentation_three_toc div ul li ul li {
	font-weight: normal;
	padding-left: 1rem;
}



.doc_nav_links {
	font-size: .875rem;
	vertical-align: middle;
}



.faq h3 {

	/* font-size: 1.4375rem; */
	/* font-weight: 700; */

	font-size: 1.25rem;
	font-weight: 700;
    margin-bottom: 0rem;
}

.faq h4 {
    /* font-size: 1.25rem; */
	/* font-weight: 700; */

	font-size: 1rem;
	font-weight: 700;

    margin-top: 1.75rem;
}

.faq h5 {
	font-size: 1rem;
	font-weight: 700;
    margin-top: 1.75rem;
}

@media only screen and (min-width: 750px) {
    .faq p {
        margin-left: 1.5rem;
    }

    .faq ul, .faq ol {
        margin-left: 2.25rem;
    }
}

.faq_toc {
    margin-bottom: 1rem;
}

.faq_toc ul {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 0;
}

.faq_toc ul li {
	list-style-type: none;
	font-weight: bold;
}

.faq_toc > ul > li {
    margin-top: 1.5rem;
}

.faq_toc ul ul {
	padding-left: 3rem;
}

.faq_toc ul ul li {
	list-style-type: disc;
	font-weight: normal;
}



.footer_info_section {
	margin-top: 7rem;
	background-color: #7a1705;
	color: #ffffff;
}

.footer_info_section a {
	cursor: pointer;
	color: #fff;
	text-decoration: none;
}

.footer_info_section a:focus, .footer_info_section a:hover {
	text-decoration: underline;
}

.footer_info_section ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	columns: 2;
}

.footer_info_section ul li {
	margin: 0;
	padding: 0;
}


.goto_report_button {
	float: right;
	margin-left: 2rem;
	margin-bottom: 1rem;
}


.guidebook_chapters div {
	border: none;
}

.guidebook_chapters h3 {
	font-size: 1rem;
	margin: 0rem;
}

.guidebook_chapters p {
	margin-top: .1rem;
}

.guidebook_chapters div a {
	cursor: pointer;
	background-color: transparent;
	text-decoration: none;
}

.guidebook_chapters div div div img {
	padding-left: 25%;
	padding-right: 25%;
	background: #f2f2f2;
}

.guidebook_chapters div div div:focus, .guidebook_chapters div div div:hover {
	background: #fff;
	border-color: #fff;
	color: #900;
	/* font-weight: bold; */
	transition:all .1s ease-in-out;
}



.guidebook_toc {

}

.guidebook_toc ul {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 0;
}

.guidebook_toc ul li {
	list-style-type: none;
	font-weight: bold;
}

.guidebook_toc ul ul {
	padding-left: 3rem;
}

.guidebook_toc ul ul li {
	list-style-type: disc;
	font-weight: normal;
}

.guidebook_toc ul ul ul li {
	list-style-type: circle;
}



.interested_section {
	background-color: #900;
	color: #fff;
}


.interested_section a {
    display: block;
    padding: 24px;
    height: 100%;
    border: 2px solid white;
    border-radius: .5rem;
    transition:all .1s ease-in-out;
	cursor: pointer;
	color: #fff;
	text-decoration: none;
}

.interested_section a:focus, .interested_section a:hover {
	background: #fff;
	border-color: #fff;
	color: #900;
	transition:all .1s ease-in-out;
}





.left_nav {

	font-size: 1rem;
	margin: 0;
	margin-bottom: 2rem;
	padding: 0;
	list-style-type: none;
	list-style-position: outside;
	background-color: #edecea;
	line-height: 1.6;
	box-sizing: border-box;
}

.left_nav li {
	border-left: 3px solid #fff;
	border-right: 3px solid #fff;
	margin: 0;
	padding: 0;
}

.left_nav li a {
	position: relative;
	display: block;
	color: #4A3C31;
	border-bottom: 1px solid #fff;
	padding: .5rem 1rem;
	transition: background-color .3s;
	background-color: transparent;
	cursor: pointer;
	line-height: inherit;
	text-decoration: none;
	font-weight: 400;
}

.left_nav a:focus, .left_nav a:hover {
	background-color: #b7b1ad;
	color: #16120f;
	transition: color .3s;
}


.left_nav_current {
	border-left: 3px solid #900 !important;
}



.list_alpha {
	list-style-type: lower-alpha;
}



.list_numeric {
	list-style-type: decimal;
}



.list_roman {
	list-style-type: lower-roman;
}


.main_nav ul {
    /* border-right: 1px solid #dddddd; */
    /* padding-right: 1rem; */
}


ol.tree li {
    position: relative;
}

ol.tree li ol {
    display: none;
}

ol.tree li.open > ol {
    display: block;
}

ol.tree li.parent:after {
    content: '[+]';
}

ol.tree li.parent.open:after {
    content: '';
}



.popular_resources a {
    display: block;
    padding: 24px;
    height: 100%;
    border: 2px solid rgba(0,0,0,.25);
    border-radius: .5rem;
    transition:all .1s ease-in-out;
	cursor: pointer;
	color: black;
	text-decoration: none;
}

.popular_resources a:focus, .popular_resources a:hover {
	background: #900;
	border-color: #900;
	color: white;
	transition:all .1s ease-in-out;
}


.search_button {
    border: none;
    color: black;
}

.search_button svg {
    height: 16px;
    width: 16px;
}

.side_by_side_tile div {
	border: none;
}

.side_by_side_tile h3 {
	margin: 0rem;
}

.side_by_side_tile h4 {
	font-size: 1rem;
	margin: 0rem;
}

.side_by_side_tile p {
	margin-top: .1rem;
	font-size: .875rem;
	overflow: auto;
}

.side_by_side_tile div div a {
    display: block;
    padding: 10px;
    height: 100%;

    border: 2px solid rgba(0,0,0,.25);
    border-radius: .5rem;
    transition:all .1s ease-in-out;

	cursor: pointer;
	background-color: transparent;
	text-decoration: none;
}


.side_by_side_tile div div img {
	float: left;
	margin-right: 1rem;
	width: 25%;
	max-height: 90%;
}

.side_by_side_tile div div a:focus, .side_by_side_tile div div a:hover {
    background: #900;
	border-color: #900;
	color: white;
	transition:all .1s ease-in-out;
}

.side_by_side_tile .greyed_out a {
    color: #595959;

}

.side_by_side_tile .greyed_out a:focus, .side_by_side_tile .greyed_out a:hover {
    background: none;
	border: 2px solid rgba(0,0,0,.25);
	color: #595959;
}


.side_by_side_toc {

}

.side_by_side_toc ul {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 0;
}

.side_by_side_toc ul li {
	list-style-type: none;
	font-weight: bold;
}

.side_by_side_toc ul ul {
	padding-left: 3rem;
}

.side_by_side_toc ul ul li {
	list-style-type: disc;
	font-weight: normal;
}

.side_by_side_toc ul ul ul li {
	list-style-type: circle;
}



.sop tr {
	border: 0;
}

.sop tr td:first-child {
	font-weight: bold;
	vertical-align: top;
}

.sop tr td {
	padding: 0.5rem;
}



.stopfloat {
	clear: both;
}



.toc {
	float: right;
	margin-left: 2rem;
}

@media only screen and (min-width: 600px) {
	.toc div {
		width: 400px;
	}
}

.toc div ul li {
	font-weight: bold;
}

.toc div ul li ul li {
	font-weight: normal;
	padding-left: 1rem;
}



.updates_header {
    height: 200px;
    background-position: center center;
    background-size:cover;
}

@media only screen and (min-width: 740px) {
	.updates_header {
		height: 225px;
	}
}

@media only screen and (min-width: 1080px) {
	.updates_header {
		height: 250px;
	}
}

@media only screen and (min-width: 1260px) {
	.updates_header {
		height: 300px;
	}
}


.updates h3 {

	/* font-size: 1.4375rem; */
	/* font-weight: 700; */

	/* font-size: 1.25rem; */
	font-weight: 700;
    margin-bottom: 0rem;
}

.updates h4 {
    /* font-size: 1.25rem; */
	/* font-weight: 700; */

	font-size: 1rem;
	font-weight: 700;

    margin-top: 1.25rem;
}

.updates h5 {
	font-size: 1rem;
	font-weight: 700;
    margin-top: 1.25rem;
}

/* ------- Glossary ------- */

/* Highlights the entry a link jumps to, e.g. .../glossary#account-number.
   :target matches only the element whose id is the current URL fragment, so at most one entry
   is ever highlighted, and nothing applies when the URL carries no fragment.
   Deliberately scoped to .uco-glossary: in-page Table of Contents links elsewhere on the site
   also point at h4 ids, and those headings must not light up. */

.uco-glossary h4[id]:target,
.uco-glossary h4[id]:target + p,
.uco-glossary h4[id]:target + p + p {
	background-color: #fdf6e3;
	box-shadow: -0.75rem 0 0 #fdf6e3, 0.75rem 0 0 #fdf6e3;
}

/* Letter headings read as section dividers, not just another heading.
   #e2e7e9 is the same rule colour Rivet's .rvt-border-top uses. */

.uco-glossary h3[id^="letter-"] {
	margin-top: 3.5rem;
	padding-top: 1.25rem;
	border-top: 2px solid #e2e7e9;
}

.uco-glossary h3[id^="letter-"]:first-of-type {
	margin-top: 0;
}

/* Space between entries. The first entry of a letter stays close to its heading. */

.uco-glossary h4[id] {
	margin-top: 2.25rem;
}

.uco-glossary h3[id^="letter-"] + h4[id] {
	margin-top: 1rem;
}

/* The "Defined in" line reads as metadata. Rivet black-400; black-300 (#75838f)
   only reaches 3.89:1 on white and fails WCAG AA at this 14px size. */

.uco-glossary h4[id] + p + p.rvt-ts-xs {
	color: #4c5a69;
	margin-bottom: 0;
}