/*<meta conditions="" />*/

@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);

/* updated 02022024 1334 */

@font-face 
{
	font-family: SeerSans;
	src: local(SeerSans-Regular), url(../Fonts/SeerSans-Regular.woff2) format("woff2"), url(../Fonts/SeerSans-Regular.woff) format("woff"), url(../Fonts/SeerSans-Regular.otf) format("otf");
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
}

@font-face 
{
	font-family: SeerSans;
	src: local(SeerSans-Book), url(../Fonts/SeerSans-Book.woff2) format("woff2"), url(../Fonts/SeerSans-Book.woff) format("woff"), url(../Fonts/SeerSans-Book.otf) format("otf");
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
}

@font-face 
{
	font-family: SeerSans;
	src: local(SeerSans-light), url(../Fonts/SeerSans-Light.woff2) format("woff2"), url(../Fonts/SeerSans-Light.woff) format("woff"), url(../Fonts/SeerSans-Light.otf) format("otf");
	font-weight: 500;
	font-style: normal;
	font-stretch: normal;
}

@font-face 
{
	font-family: SeerSans;
	src: local(SeerSans-Medium), url(../Fonts/SeerSans-Medium.woff2) format("woff2"), url(../Fonts/SeerSans-Medium.woff) format("woff"), url(../Fonts/SeerSans-Medium.otf) format("otf");
	font-weight: 500;
	font-style: normal;
	font-stretch: normal;
}

@font-face 
{
	font-family: SeerSans;
	src: local(SeerSans-Bold), url(../Fonts/SeerSans-Bold.woff2) format("woff2"), url(../Fonts/SeerSans-Bold.woff) format("woff"), url(../Fonts/SeerSans-Bold.otf) format("otf");
	font-weight: bold;
	font-style: normal;
	font-stretch: normal;
}

/* ==========================variables ====================================== */

:root
{
	--white: #fff;
	--black: #000;
	--primary: #22c6c9;
	--secondary: var(--gray-900);
	--callout: #002370;
	/* gray */
	--gray: #adb5bd;
	--gray-50: #f4f7fb;
	--gray-100: #e9ecef;
	--gray-200: #dee2e6;
	--gray-300: #ced4da;
	--gray-500: #868e96;
	--gray-600: #69747f;
	--gray-700: #495057;
	--gray-800: #343a40;
	--gray-900: #24282d;
	/* taupe */
	--taupe: #e4d5d3;
	--taupe-50: #faf7f6;
	--taupe-100: #f4eeed;
	/* warm gray */
	--warm-gray: #bfb8af;
	--warm-gray-50: #f2f1ef;
	--warm-gray-100: #e5e3df;
	--warm-gray-200: #d9d4cf;
	--warm-gray-300: #e5e3df;
	--warm-gray-600: #85807a;
	--warm-gray-700: #736e69;
	--warm-gray-800: #4c4a46;
	--warm-gray-900: #393734;
	/*  blue */
	--blue: #0032a0;
	--blue-50: #ccd6ec;
	--blue-100: #99add9;
	--blue-300: #335bb3;
	--blue-600: #002370;
	/* melon */
	--melon: #faaa8d;
	--melon-50: #feeee8;
	--melon-100: #fdddd1;
	/* teal */
	--teal: #22c6c9;
	--teal-50: #d3f4f4;
	--teal-100: #a7e8e9;
	--teal-200: #7adddf;
	--teal-500: #1b9ea1;
	--teal-600: #188b8d;
	--teal-700: #147779;
	--teal-800: #0e4f50;
	--teal-900: #0a3b3c;
	/* purple */
	--purple: #702f8a;
	--purple-50: #e2d5e8;
	--purple-100: #c6acd0;
	--purple-200: #002370;
	--purple-600: #4e2060;
	--purple-700: #431c52;
	/* cyan */
	--cyan: #00a9ce;
	--cyan-100: #99ddeb;
	/* menu */
	--menu: var(--gray-50);
	--menu-link: var(--black);
	--menu-hover: var(--white);
	/* text color */
	--ColorBodyText: var(--gray-800);
	--ColorHeadingText: var(--gray-900);
	--ColorLink: var(--blue);
	--ColorLinkHover: var(--gray-600);
	--box-popup: 10px 10px 300px 20px rgba(53,53,53,0.25);
	/* font vars */
	--FontRegular: "SeerSans-Regular", Arial, sans-serif;
	--FontLight: "SeerSans-Light", Arial, sans-serif;
	--FontMedium: "SeerSans-Medium", Arial, sans-serif;
	--FontBook: "SeerSans-Book", Arial, sans-serif;
	--FontBold: "SeerSans-Bold", Arial, sans-serif;
	--CodeFont: "Lucida Console", mono;
	--FontSizeBody: 1rem;
	--LineHeightBody: 1.55;
}

/* === HIDDEN CLASSES === */

/* Classes hidden from Styles window because authors are unlikely to need to apply them directly. This list is likely to change as the stylesheet evolves.
(But apparently one can't hide generic selectors.)  */

div.home-footer,
div.home-layout,
div.home-section,
div.home-tiles,
div.home-tiles-layout,
div.topic-hero,
div.topic-layout,
div.quick-links,
.outer-row,
.body-container,
.main-section,
.MCPopupContainer,
MadCap|tocProxy,
MadCap|listOfProxy,
p.FiguresTables_ListOf,
span.FigTblNum,
p.TOC1,
p.TOC2,
p.TOC3,
p.TOC4,
p.Index1,
p.Index2,
p.headerfooter
{
	mc-hidden: hidden;
}

/* ==================================== page architecture styles ====================================

      those that affect all pages (not individual component styles) 
	  
=====================================================================================================  */

body
{
	font-family: var(--FontBook);
	color: var(--ColorBodyText);
	font-size: var(--FontSizeBody);
	line-height: var(--LineHeightBody);
}

html.home-topic div.nav-search-wrapper
{
	display: none;
}

/* set the topic contents to be a flex object,
so that we can shift the footer to the bottom of the topic or window.  */

.height-container-sidenav.height-container
{
	display: flex;
	flex-flow: column nowrap;
	/* min-height: 100vh; */
	margin: 0;
	padding: 0;
	overflow: visible;
	justify-content: space-evenly;
	align-items: center;
}

/* sidemenu and links */

.sidenav-wrapper
{
	background-color: var(--menu);
}

ul.sidenav li a
{
	color: var(--menu-link);
}

.topic-layout
{
	flex: 1 auto;
	align-self: flex-start;
	height: 100%;
	overflow-y: auto;
	display: flex;
	flex-flow: row wrap;
	align-content: flex-start;
	align-items: flex-start;
	padding: 20px;
	max-width: 1400px;
}

.buttons.popup-container.clearfix.topicToolbarProxy._Skins_TopicToolbar_PAS.mc-component.nocontent
{
	flex: 1 100vw;
}

div#mc-main-content
{
	flex: 1 auto;
	display: flex;
	flex-flow: column nowrap;
	align-items: flex-start;
	justify-content: flex-start;
}

.body-container
{
	padding: 0;
}

/* peg the footer to the bottom of the window  */

#body-footer
{
	align-self: flex-end;
	width: 100%;
	margin: 10px 0 0;
	background-color: var(--warm-gray-800);
	padding: 10px 20px;
}

/* Style the home page footer */

div.home-footer
{
	background-color: var(--warm-gray-800);
	padding: 2%;
	display: flex;
	flex-flow: row wrap;
	width: 100%;
}

div.home-footer p
{
	color: white;
	line-height: 1.2;
	margin: 0 0 2px;
}

div.home-footer-details
{
	flex: 1 auto;
	position: 1;
}

div.home-footer-logo
{
	flex: 0 auto;
	right: 10px;
	position: 2;
}

div.home-footer a
{
	color: white;
	text-decoration: underline;
}

/* ====================================== Typography  ============================================
		h1-h6, plus p and others    
=====================================================   */

h1
{
	color: var(--ColorHeadingText);
	font-family: var(--FontRegular);
	font-size: 2.8rem;
	font-weight: normal;
	line-height: 1;
	margin: 1rem 0;
}

h2
{
	/*color: var(--ColorHeadingText);
	font-family: var(--FontRegular);
	font-size: 2rem;
	font-weight: normal;
	line-height: 1.167;
	margin-top: 20px;
	border-top: solid 1px var(--warm-gray);*/
	font-size: 1.4rem;
	color: var(--ColorHeadingText);
	font-weight: normal;
	margin-top: 24px;
	margin-bottom: 10px;
}

h3
{
	color: var(--ColorHeadingText);
	font-family: var(--FontMedium);
	font-size: 1.44rem;
	font-weight: normal;
	line-height: 1.2;
	margin-top: 20px;
}

h4,
h5,
h6
{
	color: var(--ColorHeadingText);
	font-family: var(--FontMedium);
	font-size: 1.11rem;
	font-weight: normal;
	line-height: 1.167;
	margin-top: 18px;
}

p
{
	color: var(--ColorBodyText);
	font-family: var(--FontBook);
	font-size: var(--FontSizeBody);
	line-height: var(--LineHeightBody);
	padding: 0 6px 0 0;
	margin: 0 0 10px;
}

p.xs
{
	font-size: 0.77rem;
	line-height: 1.57;
}

p.sm
{
	font-size: 0.88rem;
	line-height: 1.5;
}

p.lg
{
	font-size: 1.11rem;
	line-height: 1.5;
}

p.xl
{
	font-size: 1.33rem;
	line-height: 1.33;
}

p.xxl
{
	font-size: 1.66rem;
	line-height: 1.2;
}

/* existing p styles -- validate from here to end of this section  */

p.quick-links
{
	font-weight: 600;
	color: var(--ColorLink);
	font-size: 1.2rem;
	padding-bottom: 4px;
}

p.quick-links:hover
{
	color: var(--ColorLinkHover);
}

p.Citation
{
	font-size: 0.77rem;
	line-height: 1.42;
	margin-left: 0.25in;
	margin-right: 0.25in;
}

p.FigureTitle,
p.TableTitle
{
	font-family: var(--FontMedium);
	font-style: italic;
	color: var(--primary);
}

p.headerfooter
{
	font-size: 0.8rem;
	color: white;
	padding-left: 20px;
}

p.headerfooter a
{
	font-size: 0.8rem;
	color: white;
	text-decoration: underline;
}

p.Legal
{
	font-size: 0.9rem;
}

p.Procedure
{
	font-style: italic;
	margin: 12px 0 6px;
}

p.Subhead
{
	font-size: 1rem;
	color: var(--gray-700);
	font-weight: 500;
	margin-top: 16px;
	/*margin-bottom: 10px;*/
	page-break-after: avoid;
}

p.TableFootnote	/* I added this in order to enable table footnotes that don't have to be ordered lists. --Kelby 2023-01-19 */
{
	font-size: 1.1rem;
	font-family: var(--FontLight);
	margin-top: 0;
	margin-left: 16px;
	page-break-before: avoid;
}

p.Title
{
	display: block;
	text-align: left;
	line-height: 1.06;
	margin-left: 0in;
	margin-bottom: 12pt;
	mc-hyphenate: never;
	text-indent: 0px;
	margin-top: 0pt;
	font-style: normal;
	color: var(--gray-700);
	font-family: var(--FontLight);
	font-size: 33pt;
}

p.Subtitle	/* TEMPORARY - new style added for use on the cover page of the User Guide only. I intend to circle back and figure out a better way to handle this. --Kelby 2023-04-19 */
{
	display: block;
	text-align: left;
	line-height: 1.06;
	margin-left: 0in;
	margin-bottom: 12pt;
	mc-hyphenate: never;
	text-indent: 0px;
	margin-top: 0pt;
	font-style: normal;
	color: var(--gray-600);
	font-family: var(--FontLight);
	font-size: 22pt;
}

/* ==========================================  images ========================================================= */

img
{
	max-width: 100%;
}

img[class^="Border"]
{
	border: 1px solid var(--warm-gray);
}

img[class^="NoBorder"]
{
	border: none;
}

img.checkbox
{
width: 18px;
	height: 18px;
	margin: 6px auto;
}

img.xs
{
	max-width: 100px;
}

img.sm
{
	max-width: 200px;
}

img.med
{
	max-width: 400px;
}

img.lg
{
	max-width: 600px;
}

img.xl
{
	max-width: 1100px;
}

/* use this to add a thin border around an image */

.box
{
	border: 1px solid var(--warm-gray-600);
	padding: 3px;
	border-radius: 9px;
}

/* for icons shown inline */

img.Icon
{
	margin-bottom: 0px;
	border: none;
	width: auto;
	height: var(--FontSizeBody);
}

/* for ICS icons */

img.Icon_CtrSW
{
	max-height: 60px;
	max-width: auto;
	border: none;
}

img.quicklink
{
	width: 100%;
	height: auto;
	max-width: 150px;
}

/* THUMBNAIL IMAGES  */

img.Thumbnail
{
	mc-thumbnail: popup;
	mc-thumbnail-max-width: 350px;
	mc-thumbnail-max-height: auto;
	width: auto;
	height: 100%;
	max-width: 100%;
}

img.MCPopupThumbnail.img.imgThumbnail
{
	border: 1px solid #808080;
	border-left-width: 25px;
	margin-left: 0px;
}

a.MCPopupThumbnailLink.MCPopupThumbnailPopup:after
{
	content: 'EXPAND +';
	position: relative;
	left: -395px;
	top: -40px;
	color: #fff;
	font-weight: 400;
	font-size: 13px;
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	display: inline-block;
}

/* add a close button to the top right of the popup  */

.MCPopupContainer:before
{
	content: '+';
	position: absolute;
	top: -30px;
	right: -45px;
	width: 2rem;
	height: 2rem;
	color: var(--gray-500);
	text-align: center;
	border-radius: 50%;
	background-color: white;
	font-size: 2rem;
	font-weight: 100;
	line-height: 1;
	transform: rotate(0deg);
	transition: transform 0.2s ease-in-out;
	/* content: "x"; */
}

.MCPopupContainer:hover:before
{
	transform: rotate(135deg);
	transition: transform 0.2s ease-in-out;
	color: red;
}

/*add a shadow to emphasize the modal aspect of the thumbnail popup & focus attention  */

.MCPopupContainer
{
	box-shadow: var(--box-popup);
}

.popupBody
{
	color: #000000;
	background-color: var(--gray-50);
	border: solid 1px var(--cyan) !important;
	margin: 0px;
	padding: 10px;
	width: 30%;
	min-width: 250px;
}

/*  =====================================   Lists ==================================================== */

ol,
ul
{
	margin-top: 0;
}

/* causes a paragraph that precedes a list to stay with the list, so we don't need to explicitly set .KeepWithNext */

p + ol,
p + ul,
p ~ ol,
p ~ ul
{
	page-break-before: avoid;
}

/* styles for controlling OL sublists within OLs or ULs via complex selectors*/

ol ol,
ul ol
{
	list-style-type: lower-alpha;
}

ol ol ol,
ul ol ol
{
	list-style-type: lower-roman;
}

ol ol ol ol,
ul ol ol ol
{
	list-style-type: upper-alpha;
}

ol ol ol ol ol,
ul ol ol ol ol
{
	list-style-type: upper-roman;
}

/* UL sublists within OLs or ULs */

ol ul,
ul ul
{
	list-style-type: circle;
}

ol ul ul,
ul ul ul
{
	list-style-type: square;
}

/* other list styles */

ol.CalloutList
{
	counter-reset: callout;
	list-style-type: none;
	font-size: 14px;
	line-height: 18px;
	padding-left: 10px;
}

ol.CalloutList > li
{
	position: relative;
	padding: 5px 0 5px 30px;
}

ol.CalloutList > li::before
{
	content: counter(callout, upper-alpha);
	counter-increment: callout;
	height: 22px;
	width: 22px;
	border: 1px solid var(--callout);
	border-radius: 50%;
	color: var(--white);
	background-color: var(--callout);
	text-align: center;
	position: absolute;
	left: 0;
	top: 4px;
}

ol.CalloutList > li p
{
	margin-top: 0;
	margin-bottom: 0;
	/* had been 6px */
}

ol.TableFootnotes
{
	/*counter-reset: tablefootnotes;
	list-style-type: none;*/
	margin-top: 10px;
	margin-left: 0px;
}
ol.TableFootnotes > li
{
	font-size: 0.85em;
	font-family: var(--FontLight);
	position: relative;
	font-style:italic;
}
/*

ol.TableFootnotes > li::before
{
	content: counter(tablefootnotes, lower-alpha);
	counter-increment: tablefootnotes;
	font-family: var(--FontLight);
	position: absolute;
	left: -20px;
	top: 0px;
}

*/
ol.TableFootnotes > li p
{
	font-size: 0.85em;
	font-family: var(--FontLight);
	line-height:0.85;
}
ul.Checklist
{
	list-style-type: none;
	list-style-image: none;
}

ul.Checklist > li
{
	padding: 0;
}

ul.Checklist > li::before
{
	content: "□";
	font-size: 18px;
}

ul.Checklist > li p
{
	margin-top: 0px;
	margin-bottom: 6px;
}

/* ===================================  Definition Lists   ==========================================  */


dl
{
	display: block;
	/*flex-flow: row nowrap;*/
	width: 100%;
}

dt
{
	/*flex: 0 1 120px;
	align-self: flex-start;*/
	margin: 0;
}

dd
{
	/*flex: 1 auto;
	align-self: flex-start;*/
	margin: 0;
}

dt p
{
	font-weight: bold;
	margin: 0 0 12px 0;
}

dl p
{
	margin: 6px 0 6px 0px;
}

/* =========================================  Links   ===============================================  */

a,
a:link,
a:visited,
a.MCBreadcrumbsLink,
a.MiniTOC1,
a.MiniTOC1:link
{
	color: var(--ColorLink);
	text-decoration: none;
	font-size: inherit;
}

a:focus,
a:hover,
a.MiniTOC1:hover,
a.MiniTOC2:hover,
MadCap|xref:hover,
.xref:hover
{
	color: var(--ColorLinkHover);
}

a.button,
a.button:link,
a.button:visited
{
	font-size: 1.33rem;
	border-radius: 20px;
	margin-top: 30px;
	margin-bottom: 40px;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: var(--ColorLink);
	color: white;
	padding: 20px 40px;
}

a.button,
a.button:hover,
a.button:focus
{
	background-color: var(--blue-100);
	color: var(--gray-800);
}

/* button with white bg */

a.button-white,
a.button-white:link,
a.button-white:visited
{
	background-color: white;
	color: var(--ColorLink);
}

a.button-white:hover,
a.button-white:focus
{
	background-color: var(--gray-50);
	color: var(--gray-800);
}

/* ==========================  Alerts and Tips ======================= */

div.BestPract,
div.Caution,
div.Example,
div.Note,
div.Tip,
div.Warning
{
	margin-top: 8px;
	margin-bottom: 8px;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 6px;
	page-break-before: avoid;
	background-color: var(--white);
}

div.BestPract::before,
div.Caution::before,
div.Example::before,
div.Note::before,
div.Tip::before,
div.Warning::before
{
	font-family: var(--FontMedium);
	font-size: 9pt;
	letter-spacing: 2px;
	padding: 4px;
	margin-top: -2px;
	margin-left: -6px;
	margin-right: -6px;
}

div.BestPract
{
	border: solid 1px var(--cyan);
}

div.BestPract::before
{
	content: "BEST PRACTICE";
	display: block;
	color: var(--white);
	background-color: var(--melon);
	border: solid 1px var(--melon);
}

div.Caution
{
	border: solid 1px var(--blue-300);
}

div.Caution::before
{
	content: "CAUTION";
	display: block;
	color: var(--white);
	background-color: var(--blue-300);
	border: solid 1px var(--blue-300);
}

div.Example
{
	border: solid 1px var(--purple);
}

div.Example::before
{
	content: "EXAMPLE";
	display: block;
	color: var(--white);
	background-color: var(--purple);
	border: solid 1px var(--purple);
}

div.Note
{
	border: solid 1px var(--warm-gray-700);
}

div.Note::before
{
	content: "NOTE";
	display: block;
	color: var(--white);
	background-color: var(--warm-gray-700);
	border: solid 1px var(--warm-gray-700);
}

div.Tip
{
	border: solid 1px var(--callout);
}

div.Tip::before
{
	content: "TIP";
	display: block;
	color: var(--white);
	background-color: var(--callout);
	border: solid 1px var(--callout);
}

div.Warning
{
	border: solid 1px var(--purple);
}

div.Warning::before
{
	content: "WARNING";
	display: block;
	color: var(--white);
	background-color: var(--purple);
	border: solid 1px var(--purple);
}

div.Caution > p,
div.Example > p,
div.Note > p,
div.Tip > p,
div.Warning > p
{
	margin-top: 4px;
	margin-bottom: 4px;
}

div.Caution > ol,
div.Caution > ul,
div.Example > ol,
div.Example > ul,
div.Note > ol,
div.Note > ul,
div.Tip > ol,
div.Tip > ul,
div.Warning > ol,
div.Warning > ul
{
	margin-left: 18px;
}

/* === TABLE STYLES === */

table
{
	margin-left: 0;
	mc-hide-bottom-ruling: true;
}

caption	/* nita, redo this */
{
	margin-right: 0in;
	margin-top: 12pt;
	margin-bottom: 0pt;
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0em;
	mc-auto-number-position: inside-head;
	mc-auto-number-offset: 0px;
	mc-auto-number-class: Bold;
	line-height: 1.2;
	text-decoration: none;
	text-indent: 0;
	margin-left: 0;
	text-align: left;
	mc-auto-number-format: "GT:Table {n+}   ";
	caption-side: top;
	mc-caption-repeat: true;
	font-size: 9pt;
	color: var(--gray-700);
}

table.TableStyle-GrayHeader,
table.TableStyle-TealHeader
{
	width: auto;
	mc-hidden: hidden;
}

table.TableStyle-GrayHeader th p,
table.TableStyle-GrayHeaderColumn th p,
table.TableStyle-TealHeader th p,
table.TableStyle-RevisionHistory th p,
table.TableStyle-PlainHeader th p
{
	font-family: var(--FontLight);
	color: var(--primary);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: normal;
	margin-top: 3px;
	margin-bottom: 3px;
	mc-hidden: hidden;
}

table.TableStyle-TealHeader th > p
{
	color: var(--white);
	mc-hidden: hidden;
}

table.TableStyle-RevisionHistory th > p
{
	color: var(--gray-700);
	mc-hidden: hidden;
}

table.TableStyle-PlainHeader th > p
{
	color: var(--gray-700);
	mc-hidden: hidden;
}

table.TableStyle-GrayHeader td p,
table.TableStyle-GrayHeaderColumn td p,
table.TableStyle-TealHeader td p,
table.TableStyle-RevisionHistory td p,
table.TableStyle-PlainHeader td,
table.TableStyle-GrayHeader td,
table.TableStyle-GrayHeaderColumn td,
table.TableStyle-TealHeader td,
table.TableStyle-RevisionHistory td,
table.TableStyle-PlainHeader td
{
	font-family: var(--FontLight);
	/* testing to see why the variable isn't being used; had tried to use regular */
	font-weight: normal;
	margin-top: 3px;
	margin-bottom: 3px;
	mc-hidden: hidden;
	font-size: 9pt;
}

table.TableStyle-PlainHeader td p
{
	margin-top: 0;
	margin-bottom: 0;
	mc-hidden: hidden;
}

table tr {page-break-inside:avoid;}

/* === MISC STYLES === Look for a place to put them */

sup
{
	font-size: 0.6em;
}

sub
{
	vertical-align: text-bottom;
	font-size: 0.6em;
}

/* === SPAN STYLES === */

span.CircleNum
/* used infrequently for special use cases such as cumulative hours in the "Flow of experiment data" table */
/* style="border-left-style: solid; border-left-width: 1px; border-left-color: #a9a9a9; border-right-style: solid; border-right-width: 1px; border-right-color: #a9a9a9; border-top-style: solid; border-top-width: 1px; border-top-color: #a9a9a9; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #a9a9a9; background-color: #a9a9a9; display: inline-block; font-size: 10pt; color: #ffffff; border-width: 5px; border-radius: 15px; font-weight: normal; font-family: 'Seer Sans Book'; */
{
	display: block;
	width: 30px;
	height: 30px;
	font-size: 10pt;
	color: var(--white);
	background-color: var(--callout);
	border: 1px solid var(--callout);
	font-family: "Seer Sans Book";
	border-radius: 50%;
	padding-top: 0px;
}

span.DocName
{
	font-style: italic;
}

span.Emphasis
{
	font-weight: 700;
	font-style: italic;
}

span.Italic
{
	font-style: italic;
}

span.UILabel	/* for a main UI label, such as the name of a list or a menu command or icon */
{
	font-weight: bold;
}

span.UISelection	/* for a secondary UI label, such as for an item on a drop-down list, not for the list's name itself */
{
	font-style: italic;
}

span.Optional
{
	color: #656263;
	/* replace with a color var */
}

span.Wingdings3
{
	font-family: "Wingdings 3";
	color: var(--gray-700);
}

span.SearchHighlight1,
span.SearchHighlight2,
span.SearchHighlight3,
span.SearchHighlight4,
span.SearchHighlight5,
span.SearchHighlight6,
span.SearchHighlight7,
span.SearchHighlight3,
span.SearchHighlight9,
span.SearchHighlight10
{
	background-color: yellow;
	mc-hidden: hidden;
}

/* end of span styles */
/* default Madcap elements */

MadCap|breadcrumbsProxy
{
	border-bottom: solid 1px var(--primary);
	color: var(--gray-700);
	mc-breadcrumbs-prefix: "You are here: ";
	mc-breadcrumbs-count: 6;
	mc-breadcrumbs-divider: " > ";
	font-family: var(--FontRegular);
	vertical-align: top;
	line-height: 1.4em;
}

div.MCBreadcrumbsBox_0.breadcrumbs
{
	padding: 0 0 4px;
	margin: 0;
}

MadCap|glossaryProxy
{
	border-top-color: var(--white);
	margin: 0px;
	padding: 0px;
}

div.GlossaryPageHeading
{
	border-bottom-color: var(--white);
	border-bottom-width: 0px;
	border-top: 1px solid var(--primary);
	font-size: 1.3em;
	color: #22c6c9;
	/* why is flare not honoring this? 9-16 */
}

ul.MCGlossaryProxy_0
{
	list-style-type: none;
}

div.GlossaryPageDefinition
{
	margin-bottom: 8px;
	margin-left: 24px;
}

a.GlossaryPageTerm,
a.GlossaryPageLink
{
	color: var(--gray-700);
	font-weight: bold;
}

MadCap|indexProxy
{
	border-top-width: 1px;
	border-top-color: var(--primary);
}

MadCap|xref.AppxTitle,
MadCap|xref.ChptTitle
{
	mc-format: "{paratext}";
}

MadCap|xref.Chapter
{
	mc-format: '{h1}';
}

MadCap|xref.Figure
{
	mc-format: "{paranumonly}";
}

MadCap|xref.Table
{
	mc-format: "{paranumonly}";
}

MadCap|miniTocProxy
{
	border: none;
	margin-left: 40px;
	margin-bottom: 18pt;
	padding-top: 0px;
	padding-left: 0px;
}

p.MiniTOC1,
p.MiniTOC2
{
	font-size: 1.1em;
	font-weight: normal;
	line-height: 1.6em;
	/* we're allowing room for fingers to tap on the ICS screen */
	margin-top: 0;
	margin-bottom: 8px;
	margin-left: 0;
	/* text-indent: -20px; */
	color: var(--primary);
	display: list-item;
	/* experimental on December 1 */
}

p.MiniTOC2
{
	margin-left: 20px;
}

MadCap|topicToolbarProxy
{
	border: none;
	margin-top: 0px;
	padding-top: 0px;
}

MadCap|dropDown
{
	mc-closed-image: url("../../Images/icons/IconExpand.png");
	mc-open-image: url("../../Images/icons/IconCollapse.png");
	mc-closed-image-alt-text: Expand;
	mc-open-image-alt-text: Collapse;
	border-bottom: solid 1px var(--primary);
	border-top-color: transparent;
	border-right-color: transparent;
	border-left-color: transparent;
	border-bottom-color: var(--primary);
	border-bottom-width: 1px;
	padding: 20px 0;
}

MadCap|dropDownHead
{
	padding: 0 0 10px;
}

MadCap|dropDownHotspot
{
	color: var(--gray-600);
	font-size: 14pt;
	font-weight: bold;
}

div.togglerBody
{
	
}

.floatLeft
{
	float: left;
	padding-bottom: 20px;
}

/* === HOME PAGE STYLES for HTML5 HELP === */
/* style the welcome text */

div.home-section
{
	position: relative;
	max-width: 1400px;
	margin: auto;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	align-items: flex-start;
}

div.home-section.welcome
{
	/* padding-bottom: 100px; */
}

h2.hero-text
{
	text-align: center;
	width: 80%;
	max-width: 1400px;
	margin: 10px auto 0;
	font-size: 2.5rem;
	border: none;
}

p.hero-text
{
	text-align: center;
	width: 70%;
	margin: 20px auto;
	font-size: 1.5rem;
}

/* style the quick links as flex objects */

div.quick-links
{
	/* display: flex; */
	/* flex-flow: row wrap; */
	/* margin: 60px auto; */
	/* justify-content: space-evenly; */
	/* align-items: flex-start; */
	/* align-content: flex-start; */
	/* width: 100%; */
	/* flex: 1 1 auto; */
	width: 100%;
	margin: 20px auto;
}

div.quick-links div
{
	flex: 0 1 180px;
	text-align: center;
}

/* slideshow */

.mc-viewport.MCSlider
{
	background-color: var(--warm-gray-200);
	padding: 40px;
	color: white;
	font-size: 1.5rem;
	padding-bottom: 60px;
	border-radius: 40px;
}

div.MCSlider h2
{
	border: none;
	color: white;
	margin: 0 0 20px;
}

div.MCSlider p
{
	font-size: 1.25rem;
	padding: 0 40px;
	margin: 6px;
}

div.MCSlider p a.MCXref.xref
{
	text-decoration: underline;
	color: white;
}

div.home-layout
{
	padding: 2% 5%;
}

div.topic-hero
{
	padding: 10pt;
	background-size: cover;
	background-attachment: scroll;
	background-image: url("../../Images/brand/SupergraphicOLH.png");
	width: 80vw;
}

div.topic-hero h1
{
	color: var(--white);
	font-size: 3.5em;
	font-weight: 300;
	text-align: center;
}

html.home-topic	/*Overrides padding set in the skin*/
{
	
}

html.home-topic .body-container	/*Overrides padding set in the skin*/
{
	padding: 0;
	/* width: 80%; */
	flex: 1 1 auto;
}

html.home-topic .main-section > .outer-row	/*Overrides padding set in the skin when in tablet or mobile*/
{
	/* max-width: 100%; */
	/* padding: 0; */
}

MadCap|toggler
{
	mc-closed-image: url("../../Images/icons/plus-circle-brand.png");
	mc-closed-image-alt-text: Expand;
	mc-open-image: url("../../Images/icons/minus-circle-brand.png");
	mc-open-image-alt-text: Collapse;
	color: var(--primary);
}

code
{
	font-family: var(--CodeFont);
	font-size: 0.9em;
}

/* ===========================    New Styles   ===============================  */
/* mini TOC */

div.MCMiniTocBox_0
{
	margin: 1rem 0 0 1rem;
}

p[class^="MiniTOC"]
{
	font-size: 1rem;
	display: block;
}

a[class^="MiniTOC"]:link
{
	color: var(--ColorLink);
}

a[class^="MiniTOC"]:link:hover
{
	color: var(--ColorLinkover);
}

a.MiniTOC1:link
{
	font-weight: bold;
	margin: 1rem 0 0px 0;
}

a.MiniTOC2:link
{
	margin: 0 0 0px 1rem;
}

/* keeps the icon and description together -- requires buttons to be within a span.icon-desc container */

.icon-desc
{
	white-space: nowrap;
}

.icon-desc img.Icon
{
	margin: 0;
	padding: 0 2px;
	height: 1rem;
	width: auto;
}

ol.CalloutList > li::before
{
	height: 20px;
	width: 20px;
}

._Skins_TopicToolbar_PAS .button-icon
{
	background-size: 1rem !important;
}

._Skins_TopicToolbar_PAS.mc-component .button
{
	/* width: 1rem; */
}

/*  Continued From and Continued To buttons for process steps  */

p.continued_from
{
	background: no-repeat url("../../../pas/_images/icons/circle-arrow-up.png");
	background-size: 1.2rem;
	background-position: 12px 5px;
	padding: 5px 5px 5px 8px;
	border: 1px solid var(--warm-gray-600);
	border-radius: 6px;
	font-size: 1rem;
	margin: 40px 0;
	padding-top: 30px;
	position: relative;
	min-width: 200px;
}

p.continue_to
{
	background: no-repeat url("../../../pas/_images/icons/circle-arrow-down.png");
	background-size: 1.2rem;
	background-position: 12px 5px;
	padding: 35px 5px 5px 8px;
	border: 1px solid var(--blue-100);
	border-radius: 6px;
	font-size: 1rem;
	margin: 40px 0 10px;
	position: relative;
	min-width: 200px;
}

p.continued_from:before
{
	content: 'Previous step';
	position: absolute;
	top: 3px;
	left: 36px;
	color: var(--blue-100);
}

p.continue_to:before
{
	content: 'Next step';
	position: absolute;
	top: 3px;
	left: 36px;
	color: var(--blue-100);
}

p.continue_to:hover,
p.continued_from:hover
{
	background-color: var(--gray-50);
}

/* togglers */

h2 a.MCToggler
{
	font-size: 1.2rem;
	margin-top: 0;
	position: relative;
	top: -1px;
}

.MCToggler_Image_Icon
{
	width: 20px;
	height: auto;
	padding-right: 5px;
}

.MCToggler_Open.MCTogglerHotSpot_.MCHotSpotImage,
.MCToggler_Closed.MCTogglerHotSpot_.MCHotSpotImage
{
	background-size: 18px;
}

div.togglerBody
{
	margin-left: 28px;
	margin-top: -12px;
}

/* flex containers for the QR page */

div.flex-parent
{
	display: flex;
	flex-flow: row wrap;
	width: auto;
	background-color: var(--primary);
	padding: 20px;
}

div.flex-group
{
	display: flex;
	flex-flow: row wrap;
	background-color: white;
	margin: 10px;
	padding: 20px;
	border-radius: 20px;
	width: 100%;
}

div.flex-group h2
{
	flex: 100%;
}

div.flex-group > p,
div.flex-group > div.tip
{
	max-width: 100%;
	align-content: center;
	flex: 100%;
}

div.flex-child
{
	flex: 1 40%;
	padding: 0px;
	align-self: flex-start;
}

div.flex-child.wide
{
	flex: 1 100%;
}

div.flex-group img
{
	display: none;
	flex: 1 40%;
	max-width: 45%;
	height: auto;
	padding: 20px;
	align-self: flex-start;
}

div.flex-group img.wide
{
	display: none;
	max-width: 100%;
	padding: 0;
}

div.flex-group div.images
{
	display: none;
	flex-flow: column nowrap;
	flex: 1 40%;
	padding: 20px;
	justify-content: flex-start;
}

div.images img
{
	display: none;
	max-width: 100%;
	padding: 0;
	height: auto;
	width: 100%;
}

/* ===== Generic classes ===== */

.Authornote	/* Use for notes to oneself or another Flare author */
{
	mc-conditions: "Audience.AuthorOnly";
	mc-exclude-action: "remove";
	background-color: yellow;
	mc-auto-number-format: '{b}{color red}Author Note:  {/color}{/b}';
	mc-auto-number-position: inside-head;
	mc-auto-number-offset: 6pt;
}

.Comment	/* Use for comments that should never appear in any output */
{
	mc-conditions: "Audience.Comment";
	mc-exclude-action: "remove";
	background-color: #e6e6e6;
}

.OnlineOnly
{
	mc-conditions: "Output.OnlineOnly";
	mc-exclude-action: "remove";
}

th.Reviewernote,
td.Reviewernote
{
	background-color: #fafad2;
}

p.Reviewernote_OLD	/* Use for previous notes for history but not to review */
{
	mc-conditions: "Audience.Reviewer";
	mc-exclude-action: "remove";
	position: relative;
	padding: 4px 10px;
	border: 2px solid #f7e80e;
	border-top: 28px solid #f7e80e;
	border-radius: 0 0 6px 6px;
	background-color: rgba(244,258,133,0.6);
	max-width: 600px;
	text-style: strikethrough;
}

p.Reviewernote_OLD:before
{
	content: 'PREVIOUS REVIEWER NOTE (delete when no longer relevant) ';
	position: absolute;
	top: -24px;
	left: 10px;
}

div.Reviewernote,
.Reviewernote	/* Use for notes to reviewers' attention */
{
	mc-conditions: "Audience.Reviewer";
	mc-exclude-action: "remove";
	position: relative;
	padding: 30px 10px 0;
	border: 2px solid tomato;
	border-radius: 0 0 6px 6px;
	background-color: #fafad2;
	max-width: 600px;
}

.Reviewernote:before
{
	content: 'REVIEWER NOTE:  ';
	font-weight: 800;
	position: absolute;
	top: 4px;
	left: 10px;
}

.KeepWithNext,
.keep-with-next	/* Avoids a break after this element if possible. */
{
	column-break-after: avoid;
	frame-break-after: avoid;
	page-break-after: avoid;
}

.KeepWithPrevious,
.keep-with-previous	/* Avoids a break before this element if possible */
{
	column-break-before: avoid;
	frame-break-before: avoid;
	page-break-before: avoid;
}

.NoBreakInside,
.keep-together	/* Avoids a break inside this element if possible */
{
	column-break-inside: avoid;
	frame-break-inside: avoid;
	page-break-inside: avoid;
}

.NotInContents	/* To apply to a heading of any level that you want to keep out of the generated table of contents in a PDF */
{
	mc-heading-level: 0;
}

.TightBeforeAfter	/* Use to reduce before and after space around an element */
{
	margin-top: 0;
	margin-bottom: 0;
}

.UnbindOnExclude	/* Typically used for links when we want to leave the human-readable text but get rid of the underlying link */
{
	mc-conditions: "Output.UnbindOnExclude";
	mc-exclude-action: "unbind";
}

/* =====================  Process Accordion  ============================ */

.process
{
	list-style-type: none;
	counter-reset: step;
	/*width: 900px;*/
}

.process .process-step
{
	counter-increment: step;
	padding: 0;
	margin: 0;
}

.process .process-step input[type="radio"]
{
	display: none;
}

.process .process-step input[type="radio"]:checked + label
{
	color: var(--black);
}

.process .process-step input[type="radio"]:checked + label:before
{
	background: var(--primary);
	color: white;
}

label
{
	font-family: var(--FontBold);
	font-size: 18px;
	cursor: pointer;
	padding: 0.8em 1em 0.8em 0;
}

label:hover
{
	color: var(--primary);
}

label:before
{
	font-family: var(--FontBold);
	text-align: center;
	content: counter(step);
	border: 10px solid var(--primary);
	border-radius: 40px;
	display: inline-block;
	width: 40px;
	height: 40px;
	line-height: 40px;
	font-size: 24px;
	margin: 0 0.5em 0 0;
	background: white;
	color: var(--primary);
}

/* step content */

.process .process-step .step-content-container
{
	border-left: 10px solid var(--primary);
	padding: 6px 0;
	margin: -2px 0 -2px 25px;
}

.process .process-step input[type="radio"]:checked ~ .step-content-container
{
	height: auto;
	overflow: visible;
}

.process .process-step input[type="radio"] ~ .step-content-container
{
	overflow: hidden;
}

.process .process-step input[type="radio"] ~ .step-content-container .step-content
{
	height: 0;
	transition: all 0.3s linear;
}

.process .process-step input[type="radio"]:checked ~ .step-content-container .step-content
{
	overflow-y: auto;
	transition: all 0.5s linear;
	border: 1px solid var(--warm-gray-100);
}

.process .process-step .step-content-container .step-content
{
	padding: 0 1em;
	overflow: hidden;
	margin: 0 0 0 36px;
	border-radius: 2px;
}

.buttons.popup-container.clearfix.topicToolbarProxy._Skins_TopicToolbar_ICS.mc-component.nocontent
{
	width: 100%;
	display: block;
	margin: 12px 0;
}

/* ====================================== Tablet  ==========================================    */

@media only screen and (max-width: 1279px)
{
	.row.outer-row.sidenav-layout
	{
		padding: 0;
	}

	div.body-container,
	div.topic-hero
	{
		width: 100vw;
	}

	/* slide-out-menu  */

	.off-canvas
	{
		background-color: var(--menu);
	}

	ul.off-canvas-list li a,
	ul.menu a
	{
		color: var(--menu-link);
		border: none;
	}

	ul.off-canvas-list li a:hover,
	ul.off-canvas-list ul > li > a:hover,
	ul.off-canvas-list ul ul > li > a:hover,
	ul.off-canvas-list ul ul ul > li > a:hover,
	ul.off-canvas-list ul ul ul ul > li > a:hover,
	ul.off-canvas-list li.js-drilldown-back > a:hover
	{
		background-color: var(--menu-hover);
	}

	h1
	{
		font-size: 2.667rem;
		line-height: 1;
	}

	h2
	{
		font-size: 1.778rem;
		line-height: 1.125;
	}

	h3
	{
		font-size: 1.444rem;
		line-height: 1.2;
	}

	div.topic-hero h1
	{
		font-size: 3em;
	}

	h1.home-page
	{
		font-size: 1.5em;
	}

	/* Flex items for QR page */

	div.flex-parent
	{
		margin: 0px;
		padding: 10px;
	}

	div.flex-group
	{
		margin: 5px;
		padding: 10px;
		border-radius: 10px;
	}

	div.flex-child,
	div.flex-group img
	{
		flex: 100%;
		max-width: 100%;
		padding: 5px;
	}

	ol img[class^="NoBorder"],
	ul img[class^="NoBorder"]
	{
		width: 100%;
		max-width: 100%;
	}

	img.xl,
	img[class^="NoBorder"],
	img[class^="Border"]
	{
		width: 100%;
		max-width: 100%;
	}
}

/* ====================================== MOBILE  ==========================================    */

@media only screen and (max-width: 767px)
{
	.topic-layout
	{
		width: 100%;
	}

	h1
	{
		font-size: 1.5rem;
		line-height: 1.125;
	}

	div.topic-hero h1
	{
		font-size: 1.5rem;
	}

	h2
	{
		font-size: 1.556rem;
		line-height: 1.143;
	}

	h3
	{
		font-size: 1.33rem;
		line-height: 1.25;
	}

	p.hero-text
	{
		font-size: 1.2rem;
		padding-bottom: 40px;
	}

	p.headerfooter
	{
		padding-left: 10px;
	}

	div.topic-hero
	{
		padding: 6px;
		height: 100%;
		width: 100%;
		margin: 0;
	}

	a.button,
	a.button:link,
	a.button:visited
	{
		font-size: inherit;
		padding: 10px 20px;
		margin: 10px auto;
		text-align: center;
	}

	div.home-section.welcome
	{
		padding: 0 0 60px 0;
		border: none;
		max-width: 100%;
	}

	div.quick-links
	{
		margin: 20px auto;
	}

	div.quick-links div
	{
		flex: 0 0 130px;
		padding-bottom: 20px;
	}

	p.quick-links
	{
		font-size: 1rem;
		line-height: 1.2;
		padding: 0 10px;
	}

	div.BestPract,
	div.Caution,
	div.Example,
	div.Note,
	div.Tip,
	div.Warning
	{
		max-width: 90vw;
	}

	ol img[class^="NoBorder"],
	ul img[class^="NoBorder"]
	{
		max-width: calc(95vw - 40px);
	}

	ol,
	ul
	{
		padding-inline-start: 20px;
	}

	img.med,
	img.lg,
	img.xl,
	img[class^="NoBorder"],
	img[class^="Border"]
	{
		max-width: 100%;
	}
}

/* === PRINT medium for Help topics printed from a browser */

@media print
{
	
}

/* === PDFWORD medium for PDF and Word ouptut */

@media PDFWord
{
	body
	{
		color: var(--black);
		margin: 0;
		orphans: 2;
		widows: 2;
	}

	/* === Heading styles === */

	h1,
	h2,
	h3,
	h4,
	h5,
	h6
	{
		mc-hyphenate: never;
		page-break-after: avoid;
		font-family: var(--FontLight);
		margin-left: -0.65in;
		/* Outdents into the left margin */
		color: var(--primary);
	}

	h1
	{
		font-size: 20pt;
		margin-top: 0;
	}

	h1.noTOC
	{
		mc-toc-depth: 0;
	}

	/*	h1.Appx,
	h1.Chpt
	{
		color: var(--white);
		font-size: 44pt;
		margin-top: 0.46in;
		frame-break-after: always;
	} */

	h1.Appx
	{
		color: var(--white);
		font-size: 44pt;
		margin-top: 0.46in;
		frame-break-after: always;
		mc-auto-number-format: "Appendix {chapnum} ";
		mc-auto-number-class: ChapterLabel;
	}

	h1.Chpt
	{
		color: var(--white);
		font-size: 44pt;
		margin-top: 0.46in;
		frame-break-after: always;
		mc-auto-number-format: "Chapter {chapnum} ";
		mc-auto-number-class: ChapterLabel;
	}

	span.ChapterLabel
	{
		font-size: 20pt;
		display: block;
		padding-left: 1pt;
		font-weight: normal;
	}

	h1.GlsIdx
	{
		margin-left: 0in;
		/* Removes the outdent into the left margin */
	}

	h2
	{
		font-size: 16pt;
		font-weight: normal;
		margin-top: 12pt;
		margin-bottom: 8pt;
		border-top: none;
		clear: both;
	}

	h3
	{
		font-size: 14pt;
		margin-top: 12pt;
		margin-left: -0.325in;
	}

	h4
	{
		color: var(--secondary);
		font-size: 12pt;
		margin-top: 12pt;
		font-style: italic;
		margin-left: -0.162in;
	}

	h5
	{
		color: var(--gray-700);
		font-size: 11pt;
		font-style: italic;
		font-weight: normal;
		margin-top: 12pt;
		margin-left: 0in;
		mc-heading-level: 0;
	}

	h6	/* Nita doesn't think this ends up being used anywhere */
	{
		color: #231f20;
		/* can we use a var color instead? */
		font-size: 9pt;
		/* was 8pt */
		font-variant: small-caps;
		font-family: "Seer Sans Book";
		font-weight: normal;
		margin-top: 20pt;
		mc-heading-level: 0;
	}

	/* === Div styles === */

	div.ApxChpIntro
	{
		page-break-after: always;
	}

	div.ApxChpIntro p
	{
		font-size: 12pt;
	}

	div.togglerBody	/* used to contain toggler body content and to give us something to add a name to, so the toggler will work */
	{
		margin-left: 0;
		margin-top: 0;
	}

	/* === Img styles === */

	img
	{
		max-width: 5in;
	}

	img.xs
	{
		max-width: 18pt;
	}

	img.sm
	{
		max-width: 1.5in;
	}

	img.med
	{
		width: 2.25in;
	}

	img.lg
	{
		max-width: 3.5in;
	}

	img.xl
	{
		max-width: 4.5in;
	}

	img.Border99,
	img.NoBorder99
	{
		max-width: 99%;
	}

	img.Border90,
	img.NoBorder90
	{
		max-width: 90%;
	}

	img.Border80,
	img.NoBorder80
	{
		max-width: 80%;
	}

	img.Border70,
	img.NoBorder70
	{
		max-width: 70%;
	}

	img.Border60,
	img.NoBorder60
	{
		max-width: 60%;
	}

	img.Border50,
	img.NoBorder50
	{
		max-width: 50%;
	}

	img.Border40,
	img.NoBorder40
	{
		max-width: 40%;
	}

	img.Border30,
	img.NoBorder30
	{
		max-width: 30%;
	}

	img.Border20,
	img.NoBorder20
	{
		max-width: 20%;
	}

	/* === Paragraph styles === */

	p
	{
		font-size: 10pt;
		font-family: var(--FontLight);
		font-weight: normal;
		line-height: normal;
		margin-top: 6pt;
		margin-bottom: 6pt;
		mc-hyphenate: never;
		orphans: 2;
		widows: 2;
	}

	p.Citation
	{
		font-size: 9pt;
	}

	p.cover-subtitle	/* used only for cover page topic */
	{
		display: block;
		text-align: left;
		line-height: 1.2;
		margin-bottom: 12pt;
		mc-hyphenate: never;
		text-indent: 0px;
		margin-top: 16pt;
		/* was 12pt */
		/* page-break-after: avoid; Commented out as I work the pagination issue. --Nita 7/22/21 */
		font-style: normal;
		color: var(--primary);
		font-family: var(--FontLight);
		font-size: 10pt;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.16em;
	}

	p.cover-text	/* used only for cover page topic */
	{
		color: #918f90;
		/* color: var(--gray-700); would like to use a variable but this one isn't quite right */
		font-size: 9pt;
		/* was 8pt */
		margin: 0pt;
		padding: 0pt;
	}

	p.headerfooter	/* used only in the headers and footers of page layouts */
	{
		color: var(--white);
		margin-top: 0px;
		font-size: 10pt;
		mc-hidden: hidden;
	}

	p.Procedure
	{
		page-break-after: avoid;
	}

	p.Procedure ol,
	p.Procedure ul,
	p.Procedure div,
	p.Procedure p
	{
		page-break-before: avoid;
	}

	/* selectors for generated table of contents */

	MadCap|tocProxy
	{
		border-top: none;
		padding: 0;
		margin-top: 0.4in;
	}

	p.TOC1,
	p.TOC2,
	p.TOC3,
	p.TOC4	/* These are based on Chelsea's CSS from which I will grab some attributes. */
	{
		/*	mc-leader-format: 'dot'; /* this doesn't seem to work */
		/*	mc-leader-class: Teal; /* this doesn't seem to work */
		font-family: var(--FontLight);
		font-size: 10pt;
		color: var(--gray-600);
		margin-top: 0pt;
		margin-bottom: 2pt;
		margin-right: 0in;
		margin-left: 0in;
	}

	p.TOC1	/* This is based on Chelsea's CSS from which I will grab some attributes. */
	{
		page-break-after: avoid;
		color: var(--gray-800);
		/* was #231f20; */
		margin-top: 6pt;
	}

	p.TOC3
	{
		margin-left: 0.25in;
	}

	p.TOC4
	{
		margin-left: 0.5in;
	}

	MadCap|listOfProxy
	{
		border-top: none;
		padding: 0;
		margin-top: 0;
	}

	p.FiguresTables_ListOf
	{
		font-family: var(--FontLight);
		font-size: 10pt;
		color: var(--gray-600);
		margin-top: 0pt;
		margin-bottom: 2pt;
		margin-right: 0in;
		margin-left: 0in;
		mc-leader-align: right;
		mc-leader-format: ".";
		mc-leader-offset: 8pt;
		line-height: normal;
	}

	/* DECEMBER 1 EXPERIMENT with miniTOCs */

	MadCap|miniTocProxy
	{
		margin-left: 20px;
		margin-bottom: 0;
		/* display: list-item; doesn't work */
	}

	p.MiniTOC1,
	p.MiniTOC2,
	p.MiniTOC3,
	p.MiniTOC4,
	p.MiniTOC5,
	p.MiniTOC6
	{
		mc-pagenum-display: none;
		/* Suppresses page numbers (as well as the leader dots) from miniTOC listings in PDFs */
		font-size: 10pt;
		font-family: var(--FontLight);
		font-weight: normal;
		font-style: italic;
		line-height: normal;
		margin-top: 0;
		margin-bottom: 0;
		margin-left: 0;
		/* display: list-item; doesn't work */
	}

	p.FigureTitle,
	p.TableTitle
	{
		page-break-after: avoid;
		column-break-before: avoid;
		font-size: 10pt;
		/* was 9pt */
		color: var(--black);
		font-family: var(--FontLight);
		font-style: italic;
		font-weight: normal;
	}

	p.FigureTitle
	{
		mc-auto-number-format: "GF:Figure {n+}. ";
		mc-auto-number-class: FigTblNum;
	}

	p.TableTitle
	{
		mc-auto-number-format: "GT:Table {n+}. ";
		mc-auto-number-class: FigTblNum;
	}

	span.FigTblNum
	{
		font-weight: bold;
		color: var(--primary);
	}

	p.Legal
	{
		font-size: 9pt;
	}

	p.continued_from,
	p.continue_to
	{
		display: none;
	}

	/* === List styles === */

	ol,
	ul
	{
		
	}

	ol p,
	ul p
	{
		font-size: 10pt;
	}

	ol li,
	ul li
	{
		font-size: 10pt;
	}

	li ol li,
	li ul li
	{
		margin-left: -12pt;
		padding-left: 0;
	}

	li div ol li,
	li div ul li
	{
		margin-left: 0;
	}

	ol.CalloutList
	{
		list-style-type: decimal;
		list-style-image: none;
		text-indent: 0in !important;
		margin-left: 0.2in;
	}

	ol.CalloutList > li::before	/* This hides the before attributes, which don't apply to PDF output */
	{
		display: none !important;
		content: "";
	}

	ol.CalloutList > li::marker
	{
		font-weight: bold;
		color: var(--callout);
		content: counter(callout, upper-alpha) "";
		text-align: left;
	}

	ol.CalloutList li
	{
		margin-top: 0pt;
		margin-bottom: 0pt;
		margin-left: -3pt;
		padding-bottom: 0pt;
	}

	ol.CalloutList > li > p
	{
		margin-top: 0pt;
		margin-bottom: 0pt;
		margin-left: -0.3in;
	}

	/* NITA: put tablefootnotes here */

	ol.TableFootnotes
	{
		list-style-type: lower-alpha;
		list-style-image: none;
		margin-top:10pt;
		margin-left: 16pt;
		page-break-before: avoid;
		position:relative;
	}
	ol.TableFootnotes > li
	{
		font-size: 9pt;
		line-height:1.2;
		margin:0;
		position:relative;
	}

	ol.TableFootnotes > li::before	/* This hides the before attributes, which don't apply to PDF output */
	{
		display: none !important;
		content: "";
	}

	ol.TableFootnotes > li::marker
	{
		font-weight: 500;
		font-size: 9pt;
		font-family: var(--FontLight);
		content: counter(tablefootnotes) " ";
		position:absolute;
		top:6pt;
	}

	ol.TableFootnotes > li p
	{
		font-size: 9pt;
		line-height:1.1;
		margin:0;
	}

	ul.Checklist
	{
		text-indent: 0in !important;
		margin-left: 0.25in;
	}

	td ul.Checlist
	{
		margin-left: 0;
	}

	ul.Checklist > li::before	/* This hides the before attributes, which don't apply to PDF output */
	{
		display: none !important;
		content: "";
	}

	ul.Checklist > li::marker
	{
		content: "□";
		font-size: 18pt;
		color: var(--black);
		display: inline-block;
	}

	ul.Checklist > li > p
	{
		margin-top: 0pt;
		margin-bottom: 0pt;
	}

	/*checklist syles 
	body.checklist {font-size:9pt;margin:0;}
	body.checklist h1 {font-size:18pt;margin:0 0 18pt;}
	body.checklist h2 {font-size:14pt;margin:9pt 0;}
	body.checklist h3 {font-size:10pt;margin-left:0in;color:black;}
	body.checklist p.header {font-size:10pt;font-weight:bold;}
	body.checklist p {line-height:1.1;padding:0 3pt;margin:0;}
	body.checklist ul.checkbox {}
	body.checklist ul.checkbox > li {margin:0;padding:0;}
	body.checklist ul.checkbox > li::marker
	{
		content: "□";
		font-size: 18pt;
		color: var(--black);
		display: inline-block;
	}
	body.checklist ul.checkbox > li > p {margin:0;padding:0;line-height:1.0;}

	end checklist styles */

	p.TableFootnote	/* This is a new style I added to mimick the appearance of table footnotes, but allow them to be something other than ordered lists. --Kelby 2023-01-19 */
	{
		font-size: 9pt;
		margin-top: -6px;
	}

	/* === MadCap styles === */

	MadCap|xref
	{
		mc-format: "{i}{paratext}{/i} ({pageref})";
		/* font-style: italic; */
	}

	MadCap|xref.AppxTitle,
	MadCap|xref.ChptTitle
	{
		mc-format: "{i}{paranumonly}. {paratext}{/i} ({pageref})";
	}

	MadCap|xref.Chapter
	{
		mc-format: '{paranumonly} {h1} ({pageref})';
	}

	/* === Table styles === */

	table.TableStyle-GrayHeader th p,
	table.TableStyle-GrayHeaderColumn th p,
	table.TableStyle-TealHeader th p,
	table.TableStyle-RevisionHistory th p,
	table.TableStyle-PlainHeader th p
	{
		font-size: 9pt;
	}

	table.TableStyle-GrayHeader td p,
	table.TableStyle-GrayHeaderColumn td p,
	table.TableStyle-TealHeader td p,
	table.TableStyle-RevisionHistory td p,
	table.TableStyle-PlainHeader td p
	{
		font-size: 9pt;
		font-family: var(--FontLight);
	}

	/* === Styles for the index and glossary === */
	/* Flare does not seem to honor the color and font variables for these selectors */

	MadCap|indexProxy
	{
		padding-left: 0;
		padding-bottom: 0;
		margin-top: 0;
		padding-top: 3pt;
	}

	p.IndexHeading
	{
		color: #22c6c9;
		text-align: left;
		font-size: 14pt;
		margin-top: 0pt;
		margin-bottom: -6pt;
		margin-right: 0pt;
		margin-left: 0pt;
	}

	p.Index1
	{
		margin-top: 0pt;
		margin-bottom: 0pt;
		padding: 0;
		font-size: 9pt;
		mc-hyphenate: always;
	}

	p.Index2
	{
		margin-top: 0pt;
		margin-bottom: 0pt;
		margin-left: 12pt;
		padding: 0;
		font-size: 9pt;
		mc-hyphenate: always;
	}

	div.GlossaryPageTerm
	{
		font-family: var(--FontLight);
		font-size: 10pt;
	}

	div.GlossaryPageDefinition
	{
		font-family: var(--FontLight);
		font-size: 10pt;
		font-weight: normal;
		text-align: left;
		margin-top: 2pt;
		mc-hyphenate: never;
	}

	div.GlossaryPageHeading
	{
		font-family: var(--FontLight);
		font-size: 14pt;
		font-weight: normal;
		color: var(--primary);
	}

	a.GlossaryPageTerm
	{
		color: var(--black);
	}

	span.SeeAlsoIndexTerms
	{
		font-style: italic;
	}

	span.SeeIndexTerms
	{
		font-style: italic;
	}

	div.topic-hero
	{
		background-image: url("../../Images/brand/SupergraphicOLH.png");
	}

	MadCap|dropDown
	{
		border-bottom: none 0px #ffffff;
		padding: 0;
	}

	MadCap|toggler
	{
		mc-conditions: "Output.OnlineOnly";
		mc-exclude-action: "unbind";
	}

	MadCap|listOfProxy
	{
		margin-top: 0;
	}

	/* ===================================  Definition Lists   ==========================================  */

	dl
	{
		display: block;
		margin-left: 0;
		padding-left: 0;
		page-break-inside: avoid;
	}

	dl dt
	{
		margin-left: -0.6in;
		padding-left: 0;
	}

	dl dd
	{
		margin-left: 0;
		padding-left: 0;
	}

	dl dt p
	{
		font-weight: bold;
	}

	dd p,
	dt p
	{
		/*margin-left: 0;
		padding-left: 0;*/
	}

	/* Process steps */

	ol.process
	{
		margin: 10pt 0;
		padding: 0;
	}

	ol.process li.process-step,
	ol.process li.process-step::marker
	{
		list-style-type: decimal;
		font-size: 14pt;
	}

	ol.process li.process-step ol > li::marker
	{
		font-size: inherit;
	}

	.process .process-step .step-content-container
	{
		border: none;
		margin: 0;
		padding: 0;
	}

	.process .process-step .step-content-container .step-content
	{
		border: none;
		margin: 0 0 0 0pt;
		padding: 0 0 0 10pt;
		border-left: 6pt solid var(--warm-gray-50);
	}

	label
	{
		padding: 0;
	}

	label:before
	{
		display: none;
		text-align: left;
		content: '';
		border: none;
		border-radius: 0px;
		width: 12pt;
		height: auto;
		line-height: reset;
		font-size: reset;
	}

	.mcfootnoteBlock,
	.footnotesBlock
	{
		font-size: 80%;
		line-height: 1.1;
		color: tomato;
	}

	MadCap|footnoteBlock
	{
		color: tomato;
	}

	MadCap|footnote
	{
		color: tomato;
		font-style: italic;
		font-variant: small-caps;
	}

	.Reviewernote,
	div.Reviewernote	/* Use for notes to reviewers' attention */
	{
		padding: 10pt;
	}

	span.CircleNum
	{
		vertical-align: middle;
		text-align: center;
		width: 16pt;
		height: 16pt;
		padding-top: 2pt;
		margin-bottom: 4pt;
		font-size: 9pt;
		top: -2pt;
		line-height: 1.4;
	}

	.floatLeft
	{
		float: left;
	}
}