* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-size: calc(100% + 0.22vw)
}

body {
	width: 98%;
	min-height:  100vh;
	margin: 0 auto;
	background-color: #fffafa;
	overflow: auto;
}

/*Elements & Element Classes Paragraph Classes Span Classes*/
p {font-family: "Times New Roman", serif; font-size: 1.0rem; 
		line-height: 1.0em; margin: 3px 0 7px 0;}

p.lead {font-size: 1.1rem; line-height: 1.1em;}
span.small {font-size: 0.75em; line-height: 1.0em;}
span.smaller {font-size: 0.5em;}
span.nowrap {white-space: nowrap;}
blockquote {font-family: "Times New Roman", serif;  
						font-size: 1.0rem; font-style: italic;}

li {margin: 0 0 5px 0;}

h3 {margin: 10px 0 0 0;}
h4 {margin: 7px 0 0 0;}
h5 {margin: 5px 0 0 0;}

figcaption, caption {font-family: "Times New Roman", serif; 
				font-size: 1.0rem; line-height: 1.0em; text-indent: -7ch;
				padding: 0.3em 0 0.2em 0;}

.centered {margin-left: auto; margin-right: auto;}

table {border-collapse: collapse;}
thead> tr> th {border-top: 1px solid #000; border-bottom: 1px solid #000; 
			padding: 2px 2px; text-align: left;}
tfoot> tr> td {border-bottom: 1px solid #000; border-top: 1px solid #000;
			padding: 2px 2px; text-align: left;}
td {vertical-align: top; padding: 5px 2px;}
table.autosl {	counter-reset: autosl;}
table.autosl tr td:first-child::before {counter-increment: autosl;
														content: counter(autosl);}
table.autosl tr td:last-child::before {counter-reset: autosl; content:"";}
 
ul {font-family: "Times New Roman", serif;
							 font-size: 1.0rem; line-height: 1.1em;
							 list-style-type: circle;
							 margin: 0.5em 2em 1em 2em; padding: 0.5em 2em 1em 2em;}

ol.ua {list-style-type: upper-alpha;
					font-family: "Times New Roman", serif;
					font-size: 1.0rem; line-height: 1.1;
					margin: 0.5em 2em 1em 2em;}
ol.la {list-style-type: lower-alpha;
					font-family: "Times New Roman", serif;
					font-size: 0.9rem; line-height: 1.1em;
					margin: 0.5em 2em 1em 2em;}
ol.alpha {list-style-type: lower-alpha;
					font-family: "Times New Roman", serif;
					font-size: 0.9rem; line-height: 1.1em;
					margin: 0.5em 2em 1em 2em;}

ol.num 	{font-family: "Times New Roman", serif;
					font-size: 0.9rem; line-height: 1.1em;
					margin: 0.5em 2em 1em 2em;}
ol.ur {list-style-type: upper-roman;
					font-family: "Times New Roman", serif;
					font-size: 1.0rem; line-height: 1.1;
					margin: 0.5em 2em 1em 2em;}
ol.lr {list-style-type: lower-roman;
					font-family: "Times New Roman", serif;
					font-size: 0.9rem; line-height: 1.1;
					margin: 0.5em 2em 1em 2em;}

ul.refs {font-family: "Times New Roman", serif;
							 font-size: 0.8rem; line-height: 1.0em; margin-top:0;
							 list-style-type: none; list-style-position: inside;
							 padding-left: 3em; text-indent: -3em;}
ol.biblio {font-family: "Times New Roman", serif;
					font-size: 0.8rem; line-height: 1.0em;
					margin: 0.5em 2em 1em 2em; padding-left: 1.0em;}
ol.inside	{list-style-position: inside;}
ul.inside  {list-style-position: inside;}
ol.outside {list-style-position: outside;}
ul.outside {list-style-position: outside;}

summary {font-family: Georgia, sans-serif; font-size: 1.1rem;}
.txt-xxl {font-family: "Times New Roman", serif; font-size: 1.3rem; line-height: 1.15;}
.txt-xl {font-family: "Times New Roman", serif; font-size: 1.2rem; line-height: 1.15;}
.txt-lg {font-family: "Times New Roman", serif; font-size: 1.1rem; line-height: 1.1;}
.txt-std {font-family: "Times New Roman", serif; font-size: 1.0rem; line-height: 1.1;}
.txt-mid	{font-family: "Times New Roman", serif; font-size: 0.9rem; line-height: 1.05;}
.txt-sm {font-family: "Times New Roman", serif; font-size: 0.75rem; line-height: 1.0;}
.txt-smler {font-family: "Times New Roman", serif; font-size: 0.6rem; line-height: 1.0;}

.btnette {font-fmaily: Arial, sans-serif; font-size: 0.8rem; line-height: 2.0em; white-space: nowrap;
				 padding: 2px 5px; margin: 0 5px;
				border: 1px solid #5a5a5a; border-radius: 3px;}
.btnlike {font-fmaily: Arial, sans-serif; font-size: 1.0rem; line-height: 2.0em; white-space: nowrap;
				 padding: 2px 5px; margin: 0 5px;
				border: 1px solid #5a5a5a; border-radius: 3px;}

.uppercase {text-transform: uppercase;}
.lowercase {text-transform: lowercase;}
.capitalize {text-transform: capitalize;}

.col-460px {width: 460px; list-style-position: outside;
				padding: 5px 5px 5px 10px;
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.dtl-600px {width: 600px; list-style-position: outside;
				padding: 5px 5px 5px 10px; 
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.dtl-460px {width: 460px; list-style-position: outside;
				padding: 5px 5px 5px 10px; 
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.dtl-300px {width: 300px; list-style-position: outside;
				padding: 5px 5px 5px 10px; 
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.dtl-90pct {width: 90%; margin: 0 auto; list-style-position: outside;
				padding: 5px 5px 5px 10px; margin: 10px auto;
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.box 			{padding: 5px 5px 5px 10px; margin:1em auto;
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;}
.box-600px  {width: 600px; list-style-position: outside;
				padding: 5px 5px 5px 10px; 
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}
.box-460px  {width: 460px; list-style-position: outside;
				padding: 5px 5px 5px 10px; 
				border: 1px solid #219df4; border-radius: 5px 5px 0 0;
				}


.dontshow {display: none;}


/*Responsive Display Classess.*/
.screen-sm {
	display: inline-block;
}

.screen-md {
	display: none;
}

.screen-lg {
	display: none;
}
.noprint {display: block;}

/*Other Display Classess.*/
.slide {display: none;}

/* Flex container classes*/
.ctnr-block {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-between;
}

.ctnr-block-flexstart {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.ctnr-block-around {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: space-around;
}

.ctnr-block-alignend {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: 100%;
}

.ctnr-inner-flexend {
	display: flex;
	justify-content: safe flex-end;
	width: 37%;
	padding: 2px 0 2px 0;
}

.ctnr-inner-alignend {
	display: flex;
	align-items: flex-end;
	width: 63%;
	height: calc(14%*0.56);
	padding: 2px 0 2px 0;
}

.ctnr-w37pct-alignend {
	display: flex;
	align-items: flex-end;
	width: 37%;
	height: calc(14%*0.56);
	padding: 2px 0 2px 0;
}
.ctnr-block-hrp {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 25px;
}

/* Display classes*/
.blockdisplay {display:block;}

/* Other container classes*/
div.relative {position: relative}
.ctnr-mslider {width:100%; position: relative; margin:1em auto;}
.ctnr-mslide {width:96%; position: relative; margin:0 auto;}
.ctnr-slider {width:100%; max-width:640px; position: relative; margin:1em auto;}
.ctnr-slide {width:96%; max-width:600px; position: relative; margin:0 auto;}
/*caption position classes for ctnr-slide: 5+2=7 characters*/
 /*6th (last but one) chr means position property: a for absolute, r for relative*/
 /*7th (last) chr means text-align property: c for center, l for left, r for right*/
.captnac {position: absolute; width: 100%; font-size: 1.0rem; text-align: center;}
.captnal {position: absolute; width: 100%; font-size: 1.0rem; text-align: left;}
.captnar {position: absolute; width: 100%; font-size: 1.0rem; text-align: right;}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}



/* Navigation classes*/
.prev {cursor:pointer; position: absolute; top: 50%;
			font-weight: bold; font-size: 2rem; color:#ea0000;
			transition: 0.6s ease; border-radius: 0 3px 3px 0;
			user-select: none;
}
.next {cursor:pointer; position: absolute; top: 50%;
			font-weight: bold; font-size: 2rem; color:#ea0000;
			transition: 0.6s ease; border-radius: 3px 0 0 3px;
			user-select: none; right: 0;
}
.prev:hover, .next:hover {background-color:rgba(0,0,0,0.8)}
.dot {cursor: pointer; height: 1em; width: 1em; margin: 0 2px;
		background-color: #bbb; border-radius: 50%;
		display: inline-block; transition: background-color 0.6s ease;
	}
.now, .dot:hover {background-color: #717171;}
.fade {animation-name: fade; animation-duration: 1.5s;}

/*Header classes*/
.logo-ihs {
	width:16%;
	height: calc(16% * 0.559602649);
	margin-right:3px;
}

.h1-banner {font-family: arial;}

.banner-sm {font-size: 1.5rem; line-height: 1.0em;}

.banner-md {font-size: 1.5rem; line-height: 1em;}

.banner-lg {font-size: 1.6rem; line-height: 1em;}

.search-site {font-family: georgia; font-size: 1rem; 
				line-height: 1.5em; color: #000;
				border: 2px solid #708222; padding: 2px;
				margin:0 5px 0 5px;}

.search-go {font-family: georgia; font-size: 1.0rem; 
				 color: #fff; background-color: #708222;}

.search-go:hover {cursor: pointer;}				 


/*Main menu elements & classes*/
a {text-decoration: none;} /*No text-decoration for all links in IHS website.*/

.mainbar {background-color:#3C6C91; margin: 2px 0; padding: 5px 0;} /*Use: nav for main and footer menu.*/

.menu {list-style-type: none; margin: 0; padding: 5px 5px;} /*Use: primary ul for main menu along with flex container class: 'ctnr-block'*/

.menu >li {margin: 2px 0; position: relative;
				font-family: georgia, sans-serif; font-size: 0.9rem;
				color: #fff; text-align: left; line-height: 1.0em;}

.menu>li a {font-family: verdana, georgia, sans-serif;
			color: #fff; font-size: 0.90rem; line-height: 1.0em; padding: 3px;}

.menu li >a:hover {background-color: #187bcd; border-radius: 5px 5px 0 0;
				outline: 1px solid #219df4; outline-offset: 2px;}

.menu li >a:active {background-color: #219df4; border-radius: 5px 5px 0 0;
				outline: 1px solid #219df4; outline-offset: 2px;}

.menunow {background-color: #219df4; border-radius: 5px 5px 0 0;
				outline: 1px solid #219df4; outline-offset: 2px;}

.footmenu a {font-family: georgia, sans-serif; font-size: .8rem;
				color: #fff; text-align: left; line-height: 1.0em;}

/* Float container classes */
.sidebar	{width: 15%; float: left; display: block; margin: 0 10px 5px 0;}
.sidebar::before,
.sidebar::after {content: ""; display: table;}
.sidebar::after {clear: left;}
.float-l {float: left;}
.float-l::after {clear: left;}
.float-r {float: right;}
.float-r::after {clear: right;}
.topnoaside {width: 82%; float: left; 	margin: 0.6% 0 0.5% 0.2%; padding: 0 5px;}
.topnoaside::after {clear: right;}

.topsec 		{width: 58%; float: left; 	margin: 0.6% 0 0.5% 0.2%; padding: 0 5px;}

.aside-right {width: 25%; float: right; margin: 0.6% 0 0.5% 0.2%; padding: 0 5px;
				outline: 1px solid grey; outline-offset: 0; border-radius: 5px;
				overflow-wrap: anywhere;}
.figcaption {display: inline-block;}				

.fig-66pct	{width: 66%; margin: 0 auto;}
.fig-right-60pct {width: 60%; float: right; padding-left: 10px;}

.fig-right-40pct {width: 40%; float: right; padding-left: 10px;}

.fig-right-30pct {width: 30%; float: right; padding-left: 10px;}

.fig-left-60pct {width: 60%; float: right; padding-left: 10px;}

.fig-left-40pct {width: 40%; float: right; padding-left: 10px;}

.fig-left-30pct {width: 30%; float: right; padding-left: 10px;}

/* Replace any instance by float-l and float-r
.float-right {float: right;}
.float-left {float: left;} */
.clear-l {clear: left;}
.clear-r {clear: right;}
.clear-b {clear: both;}

/*Side menu elements & classes*/
.sidemenu {list-style-type: none; background-color:#3C6C91;
				margin: 0.2% 0.5% 0 0; padding: 0 5px 5px 5px;
				}/*Use: primary ul for main sidemenu along with float container class: 'sidebar'*/

.sidemenu li {font-family: georgia, sans-serif; font-size: 0.80rem;
						color: #fff; text-align: left; line-height: 1.0em;
						border-bottom: 1px solid white; margin: 5px 0;
						padding-top: 5px;}
.sidemenu li:first-child {margin:0 0;}
.sidemenu li:last-child {border-bottom: none;}

.sidemenu >li a {display: block; font-family: georgia, sans-serif;
							color: #fff; font-size: 0.90rem;
							text-align: left; line-height: 1.15em;}

.sidemenu >li a:hover {background-color: #187bcd; border-radius: 5px;
								padding-left: 5px; outline: 1px solid #000;
								outline-offset: 0;}

.sidemenu >li a:active {background-color: #219df4; border-radius: 5px;
								padding-left: 5px; outline: 1px solid #000;
								outline-offset: 0;}

.sidenow {background-color: #219df4; border-radius: 5px 5px 0 0;
				padding-left: 5px; outline: 1px solid #000;
				outline-offset: 0; }

.sidemenu li:hover ul {display: block;}

ul.respond {margin: 0 0 0 0;padding:0 0 0 10px;}

ul.folding {font-family: georgia, sans-serif;
							color: #fff; font-size: 0.75rem;
							text-align: left; line-height:1.0; 
							color: #fff; border-bottom: none;
							display: none;}
ul.open {font-family: georgia, sans-serif;
							color: #fff; font-size: 0.75rem;
							text-align: left; line-height:1.0; 
							color: #fff; border-bottom: none;
							}
.leadline {font-family: georgia, sans-serif; font-size: 1.0rem;
				color: #fff; text-align: left; line-height: 1.0em;}

 


/*Width & Height Classes*/
.inlineimg {height:20px;}
.thumbnail {width: 150px;}
.w-100pct {width: 100%;}
.w-90pct {width: 90%;}
.w-85pct {width:83%}
.w-80pct {width: 80%;}
.w-75pct {width: 75%}
.w-60pct {width: 58%; min-width: 350px;}
.w-max60pct {max-width:58%; min-width: 350px;}
.w-50pct {width: 48%; min-width: 350px;}
.w-40pct {width: 38%; min-width: 350px;}
.w-30pct {width: 30%; min-width: 310px;}
.w-20pct {width: 20%;}
.w-max15pct {max-width:15%; min-width: 200px;}
.w-15pct {width: 15%;}
.w-max75 {max-width: 75px}
.w-max100 {max-width: 100px}
.w-max400 {max-width: 400px;}
.w-max500 {max-width: 500px;}
.w-max600 {max-width: 600px;}
.w-max700 {max-width: 700px;}
.w-max800 {max-width: 800px;}
.w-symbol {min-width:100px;}
.imgw450 {width: 450px; max-width: 99%;}
.imgw400 {width: 400px; max-width: 99%;}
.imgw300 {width: 300px;}
.imgw225 {width: 225px;}
.imgw200 {width: 200px;}
.imgw150 {width: 150px;}
.imgw100 {width: 100px;}
.imgw60 {width: 60px;}
.imgw12 {width: 12px;}
.minw150 {min-width: 150px;}
.minht80 {min-height: 81px}
.minht120 {min-height: 121px}
.hrp-photo {width: 225px;}
.hrp-title {width: 40%;}
.hrp-right {width: 39%; min-width: 300px; align-self: end; padding-bottom: 25px;}
.person {margin:10px 0; padding: 10px; border: 1px solid #219df4; border-top-left-radius:5px; border-top-right-radius: 5px;}
.oldbody {width:960px; margin:  0 auto;}

footer {clear: both;}

/*Text Style Spacing and Alignment Classes Indent Classes*/
.bold {font-weight: bold;}
.italic {font-style: italic;}
.normal {font-style: normal;}
.center {text-align: center;}
.right {text-align: right;}
.left {text-align: left;}
.indent-0 {text-indent: 0;}
.noindent {text-indent: 0;}
.indent {text-indent: 1em;}
.indent-2em {text-indent: 2em;}
.indent-3em {text-indent: 3em;}
.indent-4em {text-indent: 4em;}
.h-indent-1em {padding-left: 1em; text-indent: -1em;}
.h-indent-2em {padding-left: 2em; text-indent: -2em;}
.h-indent-3em {padding-left: 3em; text-indent: -3em;}
.h-indent-4em {padding-left: 4em; text-indent: -4em;}
.h-indent-5em {padding-left: 5em; text-indent: -5em;}
.h-indent-6em {padding-left: 6em; text-indent: -6em;}
.h-indent-7em {padding-left: 7em; text-indent: -7em;}
.h-indent-8em {padding-left: 8em; text-indent: -8em;}
.h-indent-9em {padding-left: 9em; text-indent: -9em;}
.wordspace-1em {word-spacing: 1em;}

.ln-ht-pt8 {line-height: 0.8em;}
.self-align-center {align-self: center}
.self-align-end {align-self: flex-end;}
.self-justify-start {justify-self: start;}
.self-justify-center {justify-self: center;}
.self-justify-end {justify-self: end;}


/* Padding Classes*/
.pad-top-10px {padding-top: 10px;}
.pad-top-1em {padding-top: 1em;}
.pad-top-2em {padding-top: 2em;}
.pad-sides-5px {padding: 0 5px}
.pad-sides-1em {padding: 0 1em 0 1em;}
.pad-sides-2em {padding: 0 2em 0 2em;}
.pad-sides-3em {padding: 0 3em 0 3em;}
.pad-bot-5px {padding-bottom: 5px;}
.pad-bot-10px {padding-bottom: 10px;}
.pad-tb-5px {padding-top:5px; padding-bottom:5px;}

.pad-lt-1em {padding-left: 1em;}
.pad-lt-2em {padding-left: 2em;}
.pad-lt-3em {padding-left: 3em;}
.pad-lt-4em {padding-left: 4em;}
.pad-lt-5em {padding-left: 5em;}

.pad-rt-1em {padding-right: 1em;}
.pad-rt-2em {padding-right: 2em;}
.pad-rt-3em {padding-right: 3em;}

/*Margin Classes*/
.mgn-za {margin: 0 auto;}
.mgn-1a {margin: 1em auto;}
.mgn-top-0 {margin-top: 0;}
.mgn-top-5px {margin-top: 5px;}
.mgn-top-10px {margin-top: 10px;}
.mgn-top-1em {margin-top: 1em;}
.mgn-top-2em {margin-top: 2em;}
.mgn-lt-5px {margin-left: 5px;}
.mgn-lt-1em {margin-left: 1em;}
.mgn-lt-2em {margin-left: 2em;}
.mgn-lt-3em {margin-left: 3em;}
.mgn-lt-4em {margin-left: 4em;}
.mgn-lt-5em {margin-left: 5em;}
.mgn-rt-5px {margin-right: 5px;}
.mgn-rt-1em {margin-right: 1em;}

.bordr {border: 1px solid red;}
.border-b {border-bottom: 1px solid #000;}
.border-t {border-top: 1px solid #000;}

/* Color classes.*/
.ihs-red {color:#ea0000;}
.ihs-blue {color: #0075ea;}
.ihs-green {color: #008000;}
.white {color: #ffffff;}
.brightred {color: #ff0000;}
.ihs-skysatin {color: #219df4;}

/*Heading classes*/
.h1-top {margin: 3px 0 0 0; font-family: georgia, sans-serif;
				font-size: 1.6rem; line-height: 1.2em; text-align: center;}

.h1-basic {margin: 8px 0 5px 0; font-family: georgia, sans-serif;
				font-size: 1.6rem; line-height: 1.2em;}

.h2-top {margin: 3px 0 0 0; font-family: georgia, sans-serif;
				font-size: 1.5rem; line-height: 1.1em; text-align: center;}

.h2-basic { margin: 6px 0 4px 0; font-family: georgia, sans-serif;
				font-size: 1.5rem; line-height: 1.1em; padding-top: 5px;}
.h3-top {margin: 3px 0 0 0; font-family: georgia, sans-serif;
				font-size: 1.4rem; line-height: 1.1em; text-align: center;}
.h3-basic { margin: 6px 0 4px 0; font-family: georgia, sans-serif;
				font-size: 1.4rem; line-height: 1.1em; padding-top: 5px;}
.h4-top {margin: 3px 0 0 0; font-family: georgia, sans-serif;
				font-size: 1.4rem; line-height: 1.1em; text-align: center;}
.h4-basic { margin: 6px 0 4px 0; font-family: georgia, sans-serif;
				font-size: 1.4rem; line-height: 1.1em; padding-top: 5px;}

/*Image and Figure Classes*/
.topfig {margin:0; padding:0; width:100%;}

.imgw100pct {margin: 0 auto; width: 100%;}

/*Responsive styling for Small screens.*/
@media screen and (min-width: 768px)
{
body {
	width: 96%;
	min-height:  100vh;
	margin: 0 auto;
	background-color: #fffafa;
	}
	.screen-sm {display: none;}
	.screen-md {display: inline;}
	.screen-lg {display: none;}
	.logo-ihs {width:15%; height: calc(15% * 0.559602649); margin-right:3px;}
}


/*Responsive styling for Tablets and bigger.*/
@media screen and (min-width: 768px)
{
	.screen-sm {display: none;}
	.screen-md {display: inline;}
	.screen-lg {display: none;}
	.logo-ihs {width:14%; height: calc(14% * 0.559602649); margin-right:3px;}
	ul.respond {padding:0 0 0 25px;}
}

/*Responsive styling for Large and larger.*/
@media screen and (min-width: 992px)
{
	.screen-sm {display: none;}
	.screen-md {display: none;}
	.screen-lg {display: inline;}
	.logo-ihs {width:14%; height: calc(14% * 0.559602649); margin-right:3px;}
}

/*Responsive styling for Prints.*/
@media print {
	.screen-sm {display: none;}
	.screen-md {display: none;}
	.screen-lg {display: inline;}
	.mainbar {display: none;}
	.noprint {display: none;}
	.sidebar {display: none}
	.topsec 	{width: 73%; float: left; 	margin: 0.6% 0 0.5% 0.2%; padding: 0 5px;}
	.topnoaside {width: 99%;}
	body {background-color: #fff;}
	@page {margin: 0.75in;}
	
	}
