/*--------------------------------------------------------------
			# Global Header
			--------------------------------------------------------------*/
				.header {color: var(--default-color);background-color: var(--background-color);padding: 5px 0;transition: all 0.5s;z-index: 997;}
				.header .logo {line-height: 1;}
				.header .logo img {max-height: 32px;margin-right: 8px;}
				.header .logo p {font-size: 30px;margin: 0;font-weight: 700;color: var(--heading-color);}
				.header .logo p span {color: var(--accent-color);}
				.scrolled .header {box-shadow: 0px 0 18px rgba(0, 0, 0, 0.1);}

			/*--------------------------------------------------------------
			# Global Page Titles and Breadcrumbs
			--------------------------------------------------------------*/
				.page-title {color: var(--default-color);position: relative;}
				.page-title .heading {padding: 40px 0;border-top: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);}
				.page-title .heading h1 {font-size: 38px;font-weight: 700;}
				.page-title nav {background-color: color-mix(in srgb, var(--default-color), transparent 95%);padding: 20px 0;}
				.page-title nav ol {display: flex;flex-wrap: wrap;list-style: none;margin: 0;font-size: 16px;font-weight: 600;}
				.page-title nav ol li+li {padding-left: 10px;}
				.page-title nav ol li+li::before {content: "/";display: inline-block;padding-right: 10px;color: color-mix(in srgb, var(--default-color), transparent 70%);}
				nav.breadcrumbs.hide-on-print {display: none;margin: 0;padding: 0;}
				.breadcrumbs-trail {margin: 0;padding: 0;}
				@media (min-width: 1200px) {nav.breadcrumbs.hide-on-print {display: block;min-height: 24px;overflow: hidden;}.breadcrumbs-trail {display: flex;flex-wrap: nowrap;align-items: center;min-height: 24px;line-height: 24px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}.breadcrumb-item {min-width: 0;flex: 0 1 auto;}.breadcrumb-separator {flex: 0 0 auto;display: inline-block;padding: 0 0.25rem;line-height: 24px;}.breadcrumbs-trail,.breadcrumbs-trail a,.breadcrumbs-trail span {line-height: 24px;}}
				
			/*--------------------------------------------------------------
			# Global Sections
			--------------------------------------------------------------*/
				section,.section {color: var(--default-color);background-color: var(--background-color);padding: 0px 0;scroll-margin-top: 90px;overflow: clip;}
				@media (max-width: 1199px) {section,.section {scroll-margin-top: 66px;}}

			/*--------------------------------------------------------------
			# Navigation Menu
			--------------------------------------------------------------*/
				/* Shared */
					.logo,.logo:hover,.logo:focus,.navmenu a,.navmenu a:hover,.navmenu a:focus {text-decoration: none;}
					.dropdown-indicator {font-size: 12px;margin-left: 6px;line-height: 0;transition: transform .25s ease;}
					.navmenu > ul > li > a {display: flex;align-items: center;}
					.submenu-toggle {background: none;border: 0;padding: 0;margin: 0;cursor: pointer;font: inherit;color: inherit;}
					.submenu-toggle i,.site-nav-toggle i {pointer-events: none;}
					.nav-item-with-toggle {display: flex;align-items: center;position: relative;}
					.nav-item-with-toggle > a {display: flex;align-items: center;flex: 1 1 auto;}
					
					/* Navmenu - Desktop */
					@media (min-width: 1200px) {
						.navmenu {padding: 0;}
						.navmenu ul {margin: 0;padding: 0;display: flex;list-style: none;align-items: center;}
						.navmenu li {position: relative;}
						.navmenu a,.navmenu a:focus {color: var(--nav-color);padding: 18px 15px;font-size: 16px;font-family: var(--nav-font);font-weight: 400;display: flex;align-items: center;justify-content: space-between;white-space: normal;transition: 0.3s;}
						.navmenu li:last-child a {padding-right: 0;}
						.navmenu li:hover > a,.navmenu .active,.navmenu .active:focus {color: var(--nav-hover-color);}
						.navmenu .dropdown ul {margin: 0;padding: 10px 0;background: var(--nav-dropdown-background-color);display: block;position: absolute;visibility: hidden;left: 14px;top: 130%;opacity: 0;transition: 0.3s;border-radius: 4px;z-index: 99;box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);}
						.navmenu .dropdown ul li {min-width: 200px;}
						.navmenu .dropdown ul a {padding: 10px 20px;font-size: 15px;text-transform: none;color: var(--nav-dropdown-color);}
						.navmenu .dropdown ul a:hover,.navmenu .dropdown ul .active:hover,.navmenu .dropdown ul li:hover > a {color: var(--nav-dropdown-hover-color);}
						.navmenu .dropdown:hover > ul {opacity: 1;top: calc(100% - 4px);visibility: visible;}
						.navmenu .dropdown:hover > .nav-item-with-toggle > a .dropdown-indicator,.navmenu .dropdown:focus-within > .nav-item-with-toggle > a .dropdown-indicator {transform: rotate(180deg);}
						.navmenu .dropdown > .nav-item-with-toggle::after {content: "";position: absolute;left: 0;right: 0;top: 100%;height: 8px;}
						.submenu-toggle,.site-nav-toggle {display: none !important;}
					}
					/* Navmenu - Mobile */
					@media (max-width: 1199px) {
						.site-nav-toggle {display: inline-flex !important;align-items: center;justify-content: center;background: none;border: 0;padding: 0;color: var(--nav-color);font-size: 28px;line-height: 1;cursor: pointer;position: absolute;top: 50%;right: 12px;transform: translateY(-50%);z-index: 10002;}
						.navmenu {padding: 0;}
						.navmenu > ul {display: none;}
						/* Support multiple possible JS open-state class names */
						.navmenu.mobile-open,.navmenu.navmenu-mobile-open,.navmenu.mobile-nav-active,body.site-nav-open .navmenu,body.mobile-nav-active .navmenu {position: fixed;inset: 0;background: rgba(33, 37, 41, 0.8);z-index: 9998;}
						.navmenu.mobile-open > ul,.navmenu.navmenu-mobile-open > ul,.navmenu.mobile-nav-active > ul,body.site-nav-open .navmenu > ul,body.mobile-nav-active .navmenu > ul {display: block;list-style: none;position: fixed;top: 60px;left: 20px;right: 20px;bottom: 20px;padding: 10px 0;margin: 0;border-radius: 6px;background-color: var(--nav-mobile-background-color);overflow-y: auto;z-index: 9999;box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);}
						.navmenu.mobile-open a,.navmenu.mobile-open a:focus,.navmenu.navmenu-mobile-open a,.navmenu.navmenu-mobile-open a:focus,.navmenu.mobile-nav-active a,.navmenu.mobile-nav-active a:focus,body.site-nav-open .navmenu a,body.site-nav-open .navmenu a:focus,body.mobile-nav-active .navmenu a,body.mobile-nav-active .navmenu a:focus {color: var(--nav-dropdown-color);padding: 10px 20px;font-family: var(--nav-font);font-size: 17px;font-weight: 500;display: flex;align-items: center;justify-content: space-between;white-space: normal;overflow-wrap: anywhere;transition: 0.3s;}
						.navmenu.mobile-open .nav-item-with-toggle,.navmenu.navmenu-mobile-open .nav-item-with-toggle,.navmenu.mobile-nav-active .nav-item-with-toggle,body.site-nav-open .navmenu .nav-item-with-toggle,body.mobile-nav-active .navmenu .nav-item-with-toggle {justify-content: space-between;}
						.navmenu.mobile-open .dropdown-indicator,.navmenu.navmenu-mobile-open .dropdown-indicator,.navmenu.mobile-nav-active .dropdown-indicator,body.site-nav-open .navmenu .dropdown-indicator,body.mobile-nav-active .navmenu .dropdown-indicator {display: none;}
						.submenu-toggle {width: 30px;height: 30px;margin-right: 20px;display: inline-flex;align-items: center;justify-content: center;border-radius: 50%;background-color: color-mix(in srgb, var(--accent-color), transparent 90%);}
						.submenu-toggle i {font-size: 12px;transition: transform .25s ease;}
						.submenu-toggle[aria-expanded="true"] i {transform: rotate(180deg);}
						.navmenu .dropdown > ul {display: none;position: static;visibility: visible;opacity: 1;box-shadow: none;background: rgba(33, 37, 41, 0.03);padding: 0 0 0 10px;margin: 0;border: 0;}
						/* Support multiple submenu open-state class names */
						.navmenu .dropdown > ul.dropdown-active,.navmenu .dropdown.dropdown-active > ul,.navmenu .dropdown.dropdown-open > ul {display: block;}
						body.site-nav-open .site-nav-toggle,body.mobile-nav-active .site-nav-toggle {position: fixed;top: 15px;right: 15px;transform: none;color: #fff;z-index: 10003;}
						body.site-nav-open .navmenu a.active,body.mobile-nav-active .navmenu a.active,.navmenu.mobile-open a.active,.navmenu.navmenu-mobile-open a.active {color: var(--nav-hover-color);font-weight: 600;}
						body.dir-notebook .navmenu > ul > li.notebook-root > a {color: var(--nav-hover-color);font-weight: 600;}
					}
			
			/*--------------------------------------------------------------
			# General Styling and Shared Classes
			--------------------------------------------------------------*/
			body {color: var(--default-color);background-color: var(--background-color);font-family: var(--default-font);}
			a {color: var(--accent-color);text-decoration: none;transition: 0.3s;}
			a:hover {color: color-mix(in srgb, var(--accent-color), transparent 25%);text-decoration: none;}
			h1,h2,h3,h4,h5,h6 {color: var(--heading-color);font-family: var(--heading-font);}
			
			
			
		  /* Minimal above-the-fold layout so the title/intro looks normal immediately */
		  .container{width:100%;padding-right:12px;padding-left:12px;margin-right:auto;margin-left:auto}
		  @media (min-width:992px){.container{max-width:960px}}
		  .row{display:flex;flex-wrap:wrap;margin-right:-12px;margin-left:-12px}
		  .col-lg-8{position:relative;width:100%;padding-right:12px;padding-left:12px}
		  @media (min-width:992px){.col-lg-8{flex:0 0 auto;width:66.66666667%}}
		  .d-flex{display:flex}.justify-content-center{justify-content:center}.text-center{text-align:center}
		  h1{margin:0 0 .5rem 0;line-height:1.2}
		  .mb-0{margin-bottom:0}
/* Fonts */
:root {

	--default-font: "Roboto", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

	--heading-font: "Raleway", sans-serif;

	--nav-font: "Poppins", sans-serif;

}

/* Global Colors - The following color variables are used throughout the website. Updating them here will change the color scheme of the entire website */
:root {

	--background-color: #ffffff;
	/* Background color for the entire website, including individual sections */
	--default-color: #212529;
	/* Default color used for the majority of the text content across the entire website */
	--heading-color: #101f0c;
	/* Color for headings, subheadings and title throughout the website */
	--accent-color: #71c55d;
	/* Accent color that represents your brand on the website. It's used for buttons, links, and other elements that need to stand out */
	--surface-color: #ffffff;
	/* The surface color is used as a background of boxed elements within sections, such as cards, icon boxes, or other elements that require a visual separation from the global background. */
	--contrast-color: #ffffff;
	/* Contrast color for text, ensuring readability against backgrounds of accent, heading, or default colors. */
}

/* Nav Menu Colors - The following color variables are used specifically for the navigation menu. They are separate from the global colors to allow for more customization options */
:root {

	--nav-color: #212529;
	/* The default color of the main navmenu links */
	--nav-hover-color: #71c55d;
	/* Applied to main navmenu links when they are hovered over or active */
	--nav-mobile-background-color: #ffffff;
	/* Used as the background color for mobile navigation menu */
	--nav-dropdown-background-color: #ffffff;
	/* Used as the background color for dropdown items that appear when hovering over primary navigation items */
	--nav-dropdown-color: #212529;
	/* Used for navigation links of the dropdown items in the navigation menu. */
	--nav-dropdown-hover-color: #71c55d;
	/* Similar to --nav-hover-color, this color is applied to dropdown navigation links when they are hovered over. */
}

/* Color Presets - These classes override global colors when applied to any section or element, providing reuse of the sam color scheme. */
.light-background {
	--background-color: #f1f6f1;
	--surface-color: #ffffff;
}

.dark-background {

	--background-color: #060606;

	--default-color: #ffffff;

	--heading-color: #ffffff;

	--surface-color: #252525;

	--contrast-color: #ffffff;

}
/*--------------------------------------------------------------
# Notebook TOC Section
--------------------------------------------------------------*/
.notebook-toc .content .who-we-are {
	text-transform: uppercase;
	margin-bottom: 15px;
	color: color-mix(in srgb, var(--default-color), transparent 40%);

}

.notebook-toc .content h3 {
	font-size: 2rem;
	font-weight: 700;

}

.notebook-toc .content ul {
	padding: 5px 40px 40px 40px;

}

.notebook-toc .content ul li {
	padding-bottom: 0px;

}

.notebook-toc .content ul i {
	font-size: 1.25rem;
	margin-right: 4px;
	color: var(--accent-color);

}

.notebook-toc .content p:last-child {
	margin-bottom: 0;

}

	/* Figures: Updated 8 Mar 2026 */
		figure.right,figure.center,figure.center-br,figure.mobile-center-br{padding:0;font-weight:700;text-align:center;}
		figure.right{margin-left:auto;margin-right:auto;float:right;clear:right;}
		figure.center-br{margin-left:auto;margin-right:auto;}

		@media screen and (min-width:990px){
			figure.right{padding-right:10px}
			figure.center{margin:auto}
			figure.center-br,
			figure.mobile-center-br{
				margin-top:25px;
				margin-bottom:25px;
			}
			figure.hide-mobile,
			figure.hide-over-721px{display:none}
			figure.hspace-5{margin-left:5px;margin-right:5px}
		}

		@media screen and (max-width:991px){
			figure.right{
				display:block;
				float:none;
				clear:none;
				margin:auto;
			}
			figure.center{margin:auto}
			figure.center-br{
				margin-top:25px;
				margin-bottom:25px;
			}
			figure.hide-desktop,
			figure.hide-under-720px{display:none}
			figure.hspace-5{margin-left:5px;margin-right:5px}
			figure.hspace-center{margin:0 auto}
			figure.width-75{width:75%}
		}

		span.Fig{margin:0;padding:0;font-weight:700;font-style:italic;}
		figcaption{margin:0;padding:0;font-weight:700;caption-side:bottom;font-size:12px;}
		figcaption::before{counter-increment:figure-counter;content:"Figure " counter(figure-counter) ": ";}

body {
	/* Set figure-counter" to 0 */
	counter-reset: figure-counter;

}
.visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;

}	

/*--------------------------------------------------------------
# Global Section Titles
--------------------------------------------------------------*/	
.section-title {

	text-align: center;

	padding-bottom: 20px;
	/*adjusts padding under centered headers (such as "Aerodynamics & Performance" on cfi-notebook page*/
	position: relative;

}

.section-title div {

	font-size: 13px;

	letter-spacing: 1px;

	font-weight: 700;

	padding: 8px 20px;

	margin: 0;

	background: color-mix(in srgb, var(--accent-color), transparent 90%);

	color: var(--accent-color);

	display: inline-block;

	text-transform: uppercase;

	border-radius: 50px;

	font-family: var(--default-font);

}

.section-title h2 {

	color: var(--heading-color);

	margin: 10px 0 0 0;

	font-size: 32px;

	font-weight: 700;

	font-family: var(--heading-font);

}

.section-title h2 .description-title {

	color: var(--accent-color);

}		
	/* Images */
@media screen and (max-width: 720px) {
	img.hide-under-720px {
		display:none;

	}

}
/*--------------------------------------------------------------
# Global Headers: Updated 8 Mar 2026
--------------------------------------------------------------*/

	/* h1 Media */
		@media screen and (min-width:300px){h1.header{margin:0;line-height:45px;width:100%;text-align:center;color:#000;font-weight:700;font-family:Arial;vertical-align:middle;font-size:8vw;padding-bottom:1%}}
		@media screen and (min-width:500px){h1.header{margin:0;line-height:45px;width:100%;text-align:center;color:#000;font-weight:700;font-family:Arial;vertical-align:middle;font-size:6vw;padding-bottom:1%}}
		@media screen and (min-width:720px){h1.header{margin:0;line-height:45px;width:100%;text-align:center;color:#000;font-weight:700;font-family:Arial;vertical-align:middle;font-size:3.5vw;padding-bottom:1%}}h2.filter-header{margin-left:.5%;color:#000;font-weight:700;font-family:Arial;font-size:12px;display:inline-block}

	/* h2 Media */
		@media screen and (min-width:300px){h2.h2header{margin-left:.5%;margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:6.8vw;display:inline-block;padding-top:20px}}
		@media screen and (min-width:500px){h2.h2header{margin-left:.5%;margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:4.8vw;display:inline-block;padding-top:20px}}
		@media screen and (min-width:720px){h2.h2header{margin-left:.5%;margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:2.2vw;display:inline-block;padding-top:20px}}

	/* h3 Media */
		@media screen and (min-width:300px){h3.h3header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:18px;display:inline-block}}
		@media screen and (min-width:500px){h3.h3header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:20px;display:inline-block}}
		@media screen and (min-width:721px){h3.h3header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:22px;display:inline-block}}

	/* h4 Media */
		@media screen and (min-width:300px){h4.h4header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:18px;display:inline-block}}
		@media screen and (min-width:500px){h4.h4header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:20px;display:inline-block}}
		@media screen and (min-width:721px){h4.h4header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:22px;display:inline-block}}

	/* h5 Media */
		@media screen and (min-width:300px){h5.h5header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:16px;display:inline-block}}
		@media screen and (min-width:500px){h5.h5header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:18px;display:inline-block}}
		@media screen and (min-width:721px){h5.h5header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:20px;display:inline-block}}

	/* h6 Media */
		@media screen and (min-width:300px){h6.h6header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:16px;display:inline-block}}
		@media screen and (min-width:500px){h6.h6header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:18px;display:inline-block}}
		@media screen and (min-width:721px){h6.h6header{margin-top:0;margin-bottom:0;color:#000;font-weight:700;font-family:Arial;font-size:20px;display:inline-block}}
.notebook-toc .notebook-images img {
	border-radius: 10px;

}