/* theme_yavin5.css - Bootstrap 5.3 version of theme_yavin.css. GENERATED by build_bs5_theme.ps1 on 2026-09-29.
   Edit theme_yavin.css (shared rules) and regenerate, or add BS5-only rules to the block below. */

/* ---- BS5 adjustments: keep BS4-era layouts where BS5 changed a default -------------------- */

/* BS4 gutters were 30px; BS5's default is 1.5rem (24px). Rows that set their own g- or gx- classes keep them. */
.row:not([class^="g-"]):not([class*=" g-"]):not([class^="gx-"]):not([class*=" gx-"]) { --bs-gutter-x: 30px; }

/* BS5 containers take their side padding from --bs-gutter-x (1.5rem = 12px per side; BS4: 15px). */
.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { --bs-gutter-x: 30px; }

/* BS5 cards: 1rem padding and .5rem title spacing (BS4: 1.25rem and .75rem). */
.card { --bs-card-spacer-y: 1.25rem; --bs-card-spacer-x: 1.25rem; --bs-card-title-spacer-y: .75rem; --bs-card-cap-padding-y: .75rem; --bs-card-cap-padding-x: 1.25rem; }

/* BS5 list-group items: .5rem 1rem padding (BS4: .75rem 1.25rem). Utilities like .px-0 still win. */
.list-group { --bs-list-group-item-padding-y: .75rem; --bs-list-group-item-padding-x: 1.25rem; }

/* BS5 colors .nav-link via --bs-navbar-color (a class rule, so it beats the theme's element rule header a). */
header .navbar { --bs-navbar-color: var(--il-blue); --bs-navbar-hover-color: var(--il-blue); --bs-navbar-active-color: var(--il-blue); }

/* BS4 gave every .dropdown-menu top:100%; left:0. BS5 only does that for menus its own JS opens ([data-bs-popper]),
   but the theme's hover menus are opened by adding .show, so mega menus drifted under their item instead of
   aligning to #mainnav. Menus that BS5/Popper position still get their own inline/[data-bs-popper] values. */
.dropdown-menu { top: 100%; left: 0; }

/* BS5 sizes h1-h4 and .display-* responsively (RFS: e.g. h1 = calc(1.375rem + 1.5vw) below 1200px); BS4 used fixed
   sizes, so headings shrank on phones/tablets and text reflowed. Same specificity as BS5's rules; theme rules still win. */
h1, .h1 { font-size: 2.5rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }
.display-1 { font-size: 6rem; }
.display-2 { font-size: 5.5rem; }
.display-3 { font-size: 4.5rem; }
.display-4 { font-size: 3.5rem; }

/* BS4 .navbar-toggler was 1.25rem; BS5 reads --bs-navbar-toggler-font-size, which only exists inside .navbar, and the
   theme's menu button sits outside the .navbar, so it fell back to 16px. */
.navbar-toggler { font-size: 1.25rem; }

/* BS5 .table cells: .5rem padding and a bottom border; BS4: .75rem padding, top border, top-aligned, thead bottom 2px. */
.table > :not(caption) > * > * { padding: .75rem; vertical-align: top; border-bottom-width: 0; border-top: 1px solid var(--bs-border-color); }
.table > thead > tr > * { vertical-align: bottom; border-bottom: 2px solid var(--bs-border-color); }
.table-sm > :not(caption) > * > * { padding: .3rem; }
.table-bordered > :not(caption) > * > * { border: 1px solid var(--bs-border-color); }
.table-borderless > :not(caption) > * > * { border: 0; }

/* BS5's reboot indents lists 2rem (32px); BS4 left the browser default (40px). Same specificity as BS5's rule, so
   .list-unstyled / .list-inline and the theme's own list rules still win. */
ol, ul { padding-left: 40px; }

/* BS4's reboot gave every label margin-bottom: .5rem (BS5 only gives it to .form-label); BS4 reset it to 0 on
   .form-check-label and .custom-control-label, so do the same. .col-form-label keeps BS5's own margin rule. */
label { margin-bottom: .5rem; }
.form-check-label, .custom-control-label { margin-bottom: 0; }

/* BS4 links were not underlined until hover; BS5 underlines by default. */
a { text-decoration: none; }
a:hover { text-decoration: underline; }

/* pagination: BS5 .page-link sets its own 1rem font-size, 1.5 line-height and .375rem vertical padding; BS4 inherited the
   font-size and used 1.25 line-height with .5rem padding. Leave .pagination-sm/-lg on their own BS5 sizes (same as BS4). */
.pagination:not(.pagination-sm):not(.pagination-lg) { --bs-pagination-padding-y: .5rem; }
.pagination:not(.pagination-sm):not(.pagination-lg) .page-link { font-size: inherit; line-height: 1.25; }

/* ---- theme_yavin.css ------------------------------------------------------------------------ */

/* header */
@media all {
	body.theme_yavin header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100px;
		z-index: 1000;
	}

		body.theme_yavin header::before {
			content: "";
			display: block;
			position: absolute;
			top: 0px;
			left: 0px;
			background-color: #ffffff;
			border-bottom: 1px solid #f0f0f0;
			width: 100%;
			height: 100%;
			z-index: 0;
			opacity: 1;
			transition: opacity 0.35s ease;
		}

	body.theme_yavin header a {
		color: #13294b;
		text-decoration: none;
	}

		body.theme_yavin header a:hover {
			text-decoration: none;
			color: inherit;
		}

	body.theme_yavin header > div.container-fluid {
		height: 100%;
	}
		body.theme_yavin header > div.container-fluid .row {
			height: 100%;
			padding-left: 1rem;
			padding-right: 1rem;
		}

	body.theme_yavin header .brand {
		font-family: "Gotham Narrow A", "Gotham Narrow B";
	}

	body.theme_yavin header .imark {
		margin-bottom: 5px;
		font-family: "Gotham A", "Gotham B";
		font-size: 30px;
		line-height: 30px;
	}

		body.theme_yavin header .imark a {
			display: inline-block;
			height: 30px;
			padding: 0px 0px 0px 35px;
			background-image: url(//ws.engr.illinois.edu/images/block.i.color.png);
			background-size: contain;
			background-repeat: no-repeat;
			font-weight: 700;
			text-transform: uppercase;
		}

	body.theme_yavin header .site_name {
		font-weight: 400;
		font-size: 23px;
		line-height: 1;
		letter-spacing: -0.2px;
	}

	body.theme_yavin header .coll_name {
		margin-top: 5px;
		font-weight: 700;
		font-size: 14px;
		text-transform: uppercase;
		line-height: 1em;
		letter-spacing: -0.2px;
	}

	body.theme_yavin header .button.get-in-touch {
		width: 50px;
		height: 50px;
		padding: 10px;
		background-color: #f8f8f8;
		color: #13294b;
		border: none;
		line-height: 30px;
		font-size: 1rem;
	}

	body.theme_yavin header > .container-fluid .button.get-in-touch-activator {
		width: 50px;
		height: 50px;
		padding: 10px;
		background-color: #f8f8f8;
		color: #13294b !important;
		border: none;
		line-height: 30px;
		font-size: 1rem;
	}

	body.theme_yavin.landing.isattop:not(.navopen) header .site-search a.input-group-text {
		color: #121b21;
	}


	body.theme_yavin.landing.isattop:not(.navopen) header::before {
		opacity: 0;
	}

	body.theme_yavin.landing.isattop:not(.navopen) header a {
		color: #ffffff;
	}

	body.theme_yavin.landing.isattop:not(.navopen) header .imark a {
		background-image: url(//ws.engr.illinois.edu/images/block.i.orange.png);
	}



}



/* mainnav toggler button */
@media all {
	body.theme_yavin #mainnav-toggler-container {
		float: right;
	}

		body.theme_yavin #mainnav-toggler-container button {
			display: block;
			height: 50px;
			width: 125px;
			padding: 7px 20px;
			background-color: var(--il-orange);
			color: #ffffff;
			border: none;
			border-radius: 0.25rem;
			line-height: 30px;
			font-weight: 600;
			text-transform: uppercase;
		}


		body.theme_yavin #mainnav-toggler-container button .label {
			font-size: 20px;
		}


		body.theme_yavin #mainnav-toggler-container button:focus {
			background-color: #284C90;
			outline: none;
		}

		body.theme_yavin #mainnav-toggler-container button .icon::before {
			display: inline-block;
			font-family: 'Font Awesome 6 Pro';
			font-weight: 300;
			width: 16px;
		}

		body.theme_yavin #mainnav-toggler-container button[aria-expanded=false] .icon::before {
			content: '\f0c9';
		}

		body.theme_yavin #mainnav-toggler-container button[aria-expanded=true] .icon::before {
			content: '\f00d';
		}
}


/* mainnav-simple mainnav  */
@media all {

	body.theme_yavin #mainnav-simple-container #mainnav-toggler-container {
		display: none;
	}

	body.theme_yavin #mainnav-simple {
		margin: 0 -15px;
	}

		body.theme_yavin #mainnav-simple > ul {
			display: flex;
			margin: 0;
			padding: 0;
			list-style-type: none;
		}

			/* main menu item container */
			body.theme_yavin #mainnav-simple > ul > li {
				position: relative;
				flex-wrap: nowrap;
				margin: 0px 10px;
			}

				/* main menu item */
				body.theme_yavin #mainnav-simple > ul > li > a {
					display: block;
					height: 36px;
					padding: 4px 5px;
				}

					body.theme_yavin #mainnav-simple > ul > li > a.active {
						color: #ff552e;
					}

					body.theme_yavin #mainnav-simple > ul > li > a:hover {
						color: #ff552e;
					}


					/* dropdown toggler */
					body.theme_yavin #mainnav-simple > ul > li > a.dropdown-toggler {
						display: none;
						text-align: center;
						position: absolute;
						bottom: -7px;
						height: 22px;
						width: 100%;
						overflow: hidden;
						line-height: 20px;
						font-size: 0.8rem;
					}

						body.theme_yavin #mainnav-simple > ul > li > a.dropdown-toggler.show {
							display: block;
						}

				/* dropdown menu container */
				body.theme_yavin #mainnav-simple > ul > li > ul {
					display: none;
					position: absolute;
					left: 0px;
					top: 36px;
					min-width: 250px;
					max-height: 50vh;
					overflow: auto;
					background-color: #ffffff;
					list-style-type: none;
					padding: 0;
					margin: 0;
				}

				body.theme_yavin #mainnav-simple > ul > li.right > ul {
					left: auto;
					right: 0;
				}

					body.theme_yavin #mainnav-simple > ul > li > ul.show {
						display: block;
					}

					/* dropdown menu items */
					body.theme_yavin #mainnav-simple > ul > li > ul > li {
						margin: 0;
					}

						body.theme_yavin #mainnav-simple > ul > li > ul > li > a {
							display: block;
							width: 100%;
							padding: 15px 15px;
							border-bottom: 1px solid #f0f0f0;
							color: #13294b;
							line-height: 120%;
						}

							body.theme_yavin #mainnav-simple > ul > li > ul > li > a:hover {
								background-color: #f0f0f0;
							}

					/* hide 3rd level nav and beyond */
					body.theme_yavin #mainnav-simple > ul > li > ul ul {
						display: none;
					}
}




/* content */
@media all {
	body.theme_yavin #content {
		margin-top: 100px;
	}

	body.theme_yavin.landing #content {
		margin-top: 0px;
	}

}

	


/* roadmap */
@media all {

	/* secnav */
	body.theme_yavin #secnav {
		position: absolute;
		right: 15px;
		bottom: 0;
	}

		body.theme_yavin #secnav button {
			font-size: 1rem;
			margin-bottom: 0.75rem;
		}

		body.theme_yavin #secnav .dropdown-item.active {
			color: #284C90;
		}


	/* breadcrumbs */
	body.theme_yavin #breadcrumbs {
		font-size: 0.8em;
	}

		body.theme_yavin #breadcrumbs a {
			color: #ffffff;
		}

		body.theme_yavin #breadcrumbs ul {
			margin: 0;
			padding: 0;
			list-style-type: none;
			text-transform: capitalize;
		}

			body.theme_yavin #breadcrumbs ul li {
				display: inline;
			}

				body.theme_yavin #breadcrumbs ul li::after {
					content: ' / ';
				}

				body.theme_yavin #breadcrumbs ul li:last-child::after {
					content: "";
				}

}







	/* footer */
@media all {
	footer {
		position: relative;
		z-index: 10;
		position: relative;
		line-height: 1.5;
		background-color: var(--il-blue);
		color: var(--engr-white);
		font-size: 16px;
	}

		footer::before {
			content: '';
			display: block;
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 6px;
			background-image: linear-gradient(to right, rgba(255, 95, 5, 1), rgba(204, 0, 0, 1));
		}

		footer :is(h2, .h2) {
			font-size: 1.25rem;
			border-bottom: 1px solid var(--engr-white);
			padding-bottom: 10px;
			margin-bottom: 6px;
			letter-spacing: initial;
			line-height: initial
		}

		footer ul {
			list-style-type: none;
			padding: 0;
			margin: 0;
		}

		footer li {
			margin-bottom: 0;
		}

		footer a {
			color: var(--engr-white);
			text-decoration: none;
			transition: color .3s;
		}

			footer a:hover {
				color: var(--il-orange);
			}

			footer a:focus {
				outline: none;
				color: var(--il-orange);
				text-decoration: underline;
			}

		footer .button {
			color: var(--engr-white);
			border-color: var(--engr-white);
		}

			footer .button:focus,
			footer .button:hover {
				border-color: var(--il-orange);
				background-color: var(--il-orange);
				color: var(--engr-white);
			}









		footer .campus_wordmark img {
			width: 225px;
		}

		footer .imark a {
			display: inline-block;
			height: 38px;
			padding: 0px 0px 0px 42px;
			margin: 0 0 .25rem 0;
			background-image: url(//ws.engr.illinois.edu/images/block.i.orange.png);
			background-size: contain;
			background-repeat: no-repeat;
			font-weight: 700;
			text-transform: uppercase;
			font-size: 38px;
			line-height: 38px;
			color: var(--engr-white);
		}

			footer .imark a:hover {
				text-decoration: none;
			}

		footer .department {
			font-weight: 600;
		}

		footer .coll_name {
			font-size: 1rem;
			margin: 0px 0px 2rem 0px;
			font-size: 1.75em;
			font-weight: 200;
		}

			footer .coll_name a {
				color: var(--engr-white);
			}

		footer .socials {
			display: flex;
			flex-wrap: nowrap;
			justify-content: flex-end;
			align-items: baseline;
		}

			footer .socials a {
				line-height: 40px;
				align-items: center;
				display: flex;
				margin-bottom: 1.5rem;
			}

				footer .socials a:hover {
					text-decoration: none;
				}

			footer .socials .button {
				margin-left: 0.5rem;
				height: 40px;
				padding: 5px 15px;
				white-space: nowrap;
			}

			footer .socials a i {
				font-size: 1.4em;
				margin-left: 0.75rem;
				margin-right: 0.75rem;
			}

			footer .socials.top-aligned a {
				align-items: unset;
			}

		footer .phone ul li {
			overflow: auto;
		}

			footer .phone ul li span {
				display: block;
				float: left;
			}

			footer .phone ul li a {
				float: right;
			}






		footer .il-footer-contact {
			margin-bottom: 2rem;
		}

			footer .il-footer-contact p {
				margin-bottom: 0;
				line-height: 1.5;
			}


			footer .il-footer-contact .sitename {
				font-size: 1.5rem;
				font-weight: bold;
				line-height: 1.2;
				margin-bottom: 1rem;
			}


		footer .il-footer-social {
			margin-bottom: 1.5rem;
		}

			footer .il-footer-social ul {
				display: flex;
				flex-wrap: wrap;
			}

			footer .il-footer-social li {
				margin-right: 1rem;
				height: 48px;
			}

				footer .il-footer-social li:last-child {
					margin-right: 0;
				}

			footer .il-footer-social a {
				font-size: 27px;
			}

		footer .il-footer-parent p {
			margin-bottom: 1.5rem;
		}

		footer #legal {
			border-top: 5px solid var(--il-alma-mater);
		}


			footer #legal ul {
				display: flex;
				flex-wrap: wrap;
				align-items: center;
			}

			footer #legal li {
				margin: 1rem 2rem 1rem 0;
			}

			footer #legal a {
				color: var(--engr-platinum);
				text-decoration: underline;
				padding: 5px;
			}

				footer #legal a:hover,
				footer #legal a:focus {
					outline: 2px dotted var(--engr-white);
				}

			footer #legal #ot-sdk-btn.ot-sdk-show-settings {
				border: 2px solid var(--engr-white) !important;
				border-radius: 5px;
				font-size: inherit;
				line-height: inherit;
				background-color: var(--il-alma-mater) !important;
				padding: 4px 10px;
				text-decoration: none;
				font-family: inherit !important;
			}

				footer #legal #ot-sdk-btn.ot-sdk-show-settings:focus,
				footer #legal #ot-sdk-btn.ot-sdk-show-settings:hover {
					background-color: var(--engr-white) !important;
					color: var(--engr-charcoal) !important;
				}


	@media (max-width: 1199px) {
		footer .title {
			font-size: 0.9em;
			line-height: 1.7rem;
		}
	}

	@media screen and (max-width: 767px) {
		footer .socials {
			flex-wrap: wrap;
			justify-content: left;
		}

			footer .socials a i {
				margin-right: 1rem;
			}

			footer .socials .button {
				margin-left: 0;
				margin-right: 0.5rem;
			}
	}
}















@media screen and (max-width: 991px) {

	body.theme_yavin header {
		height: 70px;
	}

		body.theme_yavin header::before {
			height: 70px;
		}
	
		body.theme_yavin header > div.container-fluid .row {
			height: 70px;
			padding-left: 0;
			padding-right: 0;
		}

		body.theme_yavin header > .container-fluid .col {
			flex: 0 0 130px;
			max-width: 130px;
		}

		body.theme_yavin header > .container-fluid .col.brand {
			flex: 0 0 calc(100% - 130px);
			max-width: calc(100% - 130px);
			align-items: center;
			line-height: 1;
			padding-right: 0;
		}

		body.theme_yavin header .brand {
			display: flex;
		}

		body.theme_yavin header .brand > div {
			width: auto;
			margin: 0;
		}

			body.theme_yavin header .imark a {
				text-indent: -999999px;
			}


		body.theme_yavin header .brand .site_name {
			font-size: 18px;
			width: 100%;
		}

		body.theme_yavin header .coll_name {
			display: none;
		}

	body.theme_yavin #mainnav-toggler-container button {
		height: 40px;
		width: 100px;
		padding: 5px 10px;
		font-size: 16px;
		line-height: 20px;
	}

	/* mainnav-simple for mobile */

	body.theme_yavin #mainnav-simple-container #mainnav-toggler-container {
		display: block;
	}

	body.theme_yavin #mainnav-simple {
		display: none;
	}

		body.theme_yavin #mainnav-simple.show {
			display: block;
		}

	body.theme_yavin #mainnav-simple {
		position: fixed;
		top: 70px;
		right: 15px;
		max-height: calc(100vh - 70px);
		background-color: #f0f0f0;
		width: 400px;
		max-width: 100%;
	}

		body.theme_yavin #mainnav-simple > ul {
			width: 100%;
			display: block;
			max-height: calc(100vh - 70px);
			overflow: auto;
			padding-bottom: 10px;
		}

			body.theme_yavin #mainnav-simple > ul > li > a {
				padding-right: 40px;
			}

			body.theme_yavin #mainnav-simple > ul > li > a.dropdown-toggler {
				display: block;
				position: absolute;
				right: 0px;
				top: 0px;
				width: 40px;
				height: 40px;
				padding: 10px;
			}

			body.theme_yavin #mainnav-simple > ul > li > ul.show {
				position: static;
			}

	body.theme_yavin #content {
		margin-top: 70px;
	}

	body.theme_yavin.landing #hero .row {
		padding-top: 80px;
	}



}



@media screen and (max-width: 575px) {

	body.theme_yavin header > .container-fluid .col.brand {
		flex: 0 0 calc(100% - 70px);
		max-width: calc(100% - 70px);
	}

	body.theme_yavin header > .container-fluid .col {
		flex: 0 0 70px;
		max-width: 70px;
	}

	body.theme_yavin #mainnav-toggler-container button {
		width: 40px;
	}

	body.theme_yavin #mainnav-toggler .label {
		display: none;
	}

	body.theme_yavin header .coll_name {
		font-size: 29px;
	}


	body.theme_yavin #mainnav-simple {
		max-width: 100%;
	}


	body.theme_yavin #roadmap {
		padding-top: 1em;
		padding-bottom: 1em;
	}

	body.theme_yavin #secnav {
		position: relative;
		margin-top: 1rem;
		right: 0;
	}

		body.theme_yavin #secnav button.button {
			width: 100%;
			margin: 0;
		}

	body.theme_yavin #secnav .dropdown-menu.show {
		width: 100%;
	}



}


@media screen and (max-width: 440px) {

	body.theme_yavin header > .container-fluid .col {
		flex: 0 0 66px;
		max-width: 66px;
	}

	body.theme_yavin header .coll_name {
		font-size: 17px;
	}


}