/*<meta />*/

/* Fonts */
/* Fonts are defined by Marketing */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Roboto+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;1,100;1,200;1,300;1,400;1,500&display=swap');
@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);

@font-face 
{
	font-family: 'Montserrat';
	src: url(../Fonts/Montserrat-VariableFont_wght.ttf);
}

html	/* Colours and all layout are defined by Marketing */
{
	height: 100%;
	font-size: 16px;
	/*Main font size definition. All other fonts should be relative to this i.e. use the rem unit */
	line-height: 1.5rem;
	/* Colours - define all colours used in styles here */
	--heading-color: #002554;
	--text-color: #231F20;
	/* charcoal */
	--note-color: #f5f5f5;
	--warn-color: #f5f5f5;
	--link-color: #316094;
	--hov-color: #5382A6;
	--code-color: #fff6e6;
	--banner-color: #ffb3b3;
	--internal-color: red;
	--alt-internal-color: #ffe5e5;
	--eseye-blue: #002554;
	--eseye-mid-blue: #316094;
	--eseye-light-blue: #C5D4E2;
	--eseye-grey: #696969;
	--eseye-charcoal: #231F20;
	--eseye-teal: #36b0c9;
	--eseye-yellow: #FFA400;
	margin-top: 2rem;
	/* Padding for secondary menu */
}

body
{
	color: var(--text-color);
	font-family: Montserrat;
	/* MadCap Flare specific style */
	mc-hyphenate: never;
	max-width: 1440px;
	/* defines the max width of the content */
}

h1	/* Initial heading style on all Online Help pages */
{
	font-size: 2.5rem;
	line-height: normal;
	color: var(--heading-color);
	font-weight: 800;
	/* extra bold */
}

h1.home-page	/* Required for the unique H1 size and spacing on online help title pages: Home; Archive; Files; Glossary; Troubleshooting; Search Results */
{
	padding: 5rem 0 0 0;
	/*moves text above search bar*/
	font-size: 4rem;
	margin: 0px;
	text-align: center;
	font-weight: 800;
	/* extra bold */
}

p.subtext	/* Immediately under the H1 on online help title pages: Home; Archive; Files; Glossary; Troubleshooting; Search Results */
{
	font-family: 'Montserrat', sans-serif;
	color: #ffffff;
	text-align: center;
	font-size: 1.125rem;
	font-weight: 500;
	margin: 1.25rem calc(50% - 300px) 0.25rem calc(50% - 300px);
	/* Keeps subtext narrower than heading above (max 600px) it which is 740ox wide. */
}

h2	/* Subheading for H1 inside a topic */
{
	font-size: 1.75rem;
	color: var(--heading-color);
	margin-top: 1.75rem;
	margin-bottom: .5rem;
	line-height: normal;
	font-weight: 600;
}

h2.relatedLinks
{
	margin-top: 0rem;
}

h2.whatsnew
{
	text-align: center;
	font-size: 3rem;
	font-weight: 800;
	/* semi bold */
	margin-bottom: 3rem;
}

h3	/* Subheading for H2 inside a topic */
{
	font-size: 1.5rem;
	color: var(--heading-color);
	margin-top: 1.5rem;
	margin-bottom: .25rem;
	font-weight: bold;
	line-height: normal;
	font-weight: 400;
}

h3.tiles
{
	font-size: 1.5rem;
	color: var(--eseye-blue);
	margin-top: 1.5rem;
	margin-bottom: .25rem;
	font-weight: 700;
}

.BeforeYouBegin
{
	margin-top: 0rem;
}

h4	/* Subheading for H3 inside a topic */
{
	font-size: 1.25rem;
	color: var(--heading-color);
	margin-top: 1.25rem;
	margin-bottom: .25rem;
	line-height: normal;
	font-weight: 400;
}

h4.quicklinks	/* Defines links in the Quicklinks section on the Home page */
{
	font-size: 1rem;
	color: var(--heading-color);
	margin-left: 0rem;
	font-weight: 700;
}

h5	/* Subheading for H4 inside a topic - we don't tend to use although there is legacy usage */
{
	font-size: 1.15rem;
	color: var(--heading-color);
	margin-top: 1.25rem;
	margin-bottom: .25rem;
	line-height: normal;
}

h6	/* Subheading inside a topic - used for Examples in Hera docs */
{
	font-size: 1rem;
	color: var(--heading-color);
	margin-top: 1.25rem;
	margin-bottom: .25rem;
	line-height: normal;
}

p	/* General paragraph style used in every topic */
{
	margin-bottom: 0.5rem;
	margin-top: 0.25rem;
	font-size: 1rem;
	color: var(--text-color);
}

p.learnmore	/* Defines Learn More paragraph on the online help Home page */
{
	font-family: 'Montserrat', sans-serif;
	color: var(--eseye-teal) !important;
	font-size: .9375rem;
	font-weight: 700;
}

p.learnmore a	/* Defines Learn More links on the online help Home page */
{
	font-family: 'Montserrat', sans-serif;
	color: var(--eseye-teal) !important;
	font-size: .9375rem;
	font-weight: 700;
}

.note	/* Applies styled box for notes. Apply to p style for single paragraph note. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
{
	background-image: url('../Images/icons/Icon_document.png');
	background-position: 1rem 50%;
	background-repeat: no-repeat;
	border-radius: 6px;
	background-color: var(--note-color);
	margin: 12px 0px;
	padding: 0.75rem 0.75rem 0.75rem 3rem;
	width: fit-content;
}

.tip	/* Applies styled box for tip. Apply to p style for single paragraph tip. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
{
	background-image: url('../Images/Templates/Icon_bulb.png');
	background-position: 1rem 50%;
	background-repeat: no-repeat;
	border-radius: 6px;
	background-color: var(--note-color);
	margin: 12px 0px;
	padding: 0.75rem 0.75rem 0.75rem 3rem;
	width: fit-content;
}

.warn	/* Applies styled box for warnings. Apply to p style for single paragraph warn. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
{
	background-image: url('../Images/Templates/Icon_Alert.png');
	background-position: 1rem 50%;
	background-repeat: no-repeat;
	border-radius: 6px;
	font-weight: 700;
	/*color: white;*/
	background-color: var(--note-color);
	margin: 12px 0px;
	padding: 0.75rem 0.75rem 0.75rem 3rem;
	width: fit-content;
}

.keepWithNext	/* For PDFs. When a heading or initial short piece of text are separated from following text that you want to keep together. */
{
	page-break-after: avoid;
}

.keepWithPrevious	/* For PDFs. When a heading or text is separated from preceding text that you want to keep together, and prevent from moving onto the next page. */
{
	page-break-before: avoid;
}

.newPage	/* For PDF headings. When you want a heading to appear at the start of the next page. */
{
	page-break-before: always;
}

div.code
{
	border-radius: 6px;
	background-color: var(--code-color);
	margin: 12px 0px;
	padding: 1rem;
	width: fit-content;
	/* Flare has warnings about this but it works in all browsers */
}

.code
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	border-radius: 3px;
	width: fit-content;
}

/*remove duplicate code indents in future - after cleaning up html where they're used */

.codeIndent1
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 1rem;
	border-radius: 3px;
	width: fit-content;
}

.codeIndent2
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 2rem;
	border-radius: 3px;
	width: fit-content;
}

.codeIndent3
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 3rem;
	border-radius: 3px;
	width: fit-content;
}

.codeIndent4
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 4rem;
	border-radius: 3px;
	width: fit-content;
}

.codeIndent5
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 5rem;
	border-radius: 3px;
	width: fit-content;
}

.codeIndent6
{
	background-color: var(--code-color);
	font-family: monospace;
	margin: 0px;
	margin-left: 6rem;
	border-radius: 3px;
	width: fit-content;
}

/*remove duplicate code responses in future - after cleaning up html where they're used */

.codeResponse
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse1
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 1rem;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse2
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 2rem;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse3
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 3rem;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse4
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 4rem;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse5
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 5rem;
	border-radius: 3px;
	width: fit-content;
}

.codeResponse5
{
	background-color: var(--code-color);
	font-family: monospace;
	font-weight: bold;
	margin: 0px;
	margin-left: 6rem;
	border-radius: 3px;
	width: fit-content;
}

.indent1
{
	margin-left: 1rem;
}

.indent2
{
	margin-left: 1.5rem;
}

.indent3
{
	margin-left: 2rem;
}

.indent4
{
	margin-left: 2.5rem;
}

.indent5
{
	margin-left: 3rem;
}

.indent6
{
	margin-left: 3.5rem;
}

p.procedureTitle
{
	font-weight: bold;
	margin-top: 1.12em;
}

p.Title
{
	font-size: 3rem;
	line-height: normal;
	color: var(--heading-color);
	font-weight: 800;
	/* extra bold */
}

p.manual-title
{
	font-size: 2rem;
}

p.titleDocumentNo
{
	margin-top: 4rem;
	padding-left: 0.2rem;
}

ul
{
	list-style-type: disc;
	margin: 0.2em 0.2em 0.4em 0.4em;
	padding: 0rem 0rem 0rem 1rem;
}

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

ol
{
	margin: 0.2em 0.2em 0.4em 0.4em;
	padding: 0rem 0rem 0rem 1rem;
}

ol > li::marker
{
	font-weight: bold;
}

li
{
	font-size: 1rem;
	color: var(--text-color);
	margin: 0.2em 0.2em 0.4em 0.2em;
}

li > p
{
	margin-top: 0.2em;
	/* keep the same as bottom margin on li */
}

td
{
	font-size: 1rem;
}

a
{
	color: var(--link-color);
	text-decoration: none;
}

a:link
{
	color: var(--link-color);
	text-decoration: none;
}

a:visited
{
	color: var(--link-color);
	text-decoration: none;
}

a:hover
{
	color: var(--hov-color);
	text-decoration: underline;
}

a.xref
{
	text-decoration: none;
	color: var(--link-color);
}

a.xref:hover
{
	text-decoration: underline;
	color: var(--hov-color);
}

a.xref:hover
{
	text-decoration: underline;
	color: var(--hov-color);
}

a.footer
{
	color: var(--text-color);
	text-decoration: none;
}

/* Span styles */

span.fileName
{
	font-weight: bold;
}

span.title
{
	font-style: italic;
}

span.UI
{
	font-weight: bold;
}

span.var
{
	font-style: italic;
}

/* span.SearchHighlight   /*Paul Marshall requested to remove this 25/10/2023. Jen has a feeling it might be requested again, which is why it's hidden here and not deleted. Highlights search terms within the topic.  */

/* {
	background-color: #ffa400;
}
*/

span.noBreak	/*To prevent wrapping at the end of a line because of spaces, or to ensure a phrase sticks together. For example, where you have DELETE<space>/URL/to/EndPoint. Do not use this across the start or end of <a href></a> or it will break the link. */
{
	mc-hyphenate: never;
	white-space: nowrap;
}

span.wrap	/*Makes the selected text wrap when it is too long for a container. Great for APIs with long URLs. When selecting the URL ensure you only wrap the display text and not the full URL, otherwise you will break the link:
1) In the Text Editor, find the URL. For example: <a href="javascript:void(0)" onclick="handleLinkClick('https://docs.api.int.aws.eseye.io/#/Packages/get_api_v2_package__packageId__packageItem__packageItemId__attribute')">GET /api/v2/package/{packageId}/packageItem/{packageItemId}/attribute</a>
2) Ensure only the display text is wrapped with the span class. For example: ...packageItem__packageItemId__attribute')"><span class="wrap">GET /api/v2/package/{packageId}/packageItem/{packageItemId}/attribute</span></a>...
*/
{
	inline-size: 300px;
	word-break: break-all;
}

/* Image styles */

img
{
	max-width: 650px;
}

img.small	/*same as image large - delete or combine in future*/
{
	mc-thumbnail: popup;
	width: auto;
	mc-thumbnail-max-width: 15rem;
	mc-thumbnail-max-height: 15rem;
	border: 1px solid var(--link-color);
	border-radius: 6px;
}

img.small:hover	/*same as image large - delete or combine in future*/
{
	border: 1px solid var(--hov-color);
	box-shadow: 0 0 0 1px var(--hov-color);
	transition: all 200ms ease-out;
}

img.medium
{
	mc-thumbnail: popup;
	width: auto;
	mc-thumbnail-max-width: 20rem;
	mc-thumbnail-max-height: 20rem;
	border: 1px solid var(--link-color);
	border-radius: 6px;
}

img.medium:hover
{
	border: 1px solid var(--hov-color);
	box-shadow: 0 0 0 1px var(--hov-color);
	transition: all 200ms ease-out;
}

img.large
{
	mc-thumbnail: popup;
	width: auto;
	mc-thumbnail-max-width: 25rem;
	mc-thumbnail-max-height: 25rem;
	border: 1px solid var(--link-color);
	border-radius: 6px;
}

img.large:hover
{
	border: 1px solid var(--hov-color);
	box-shadow: 0 0 0 1px var(--hov-color);
	transition: all 200ms ease-out;
}

object
{
	width: 450px;
}

.MCPopupContainer
{
	border: 1px solid var(--link-color);
	border-radius: 6px;
}

img.MCPopupFullImage	/*stops the above image max width applying to thumbnailed images when expanded*/
{
	max-width: 100% !important;
}

img.icon	/*ensures that icons don't get too big and are proportional to the text size. Expecially useful for inline icons*/
{
	max-height: 1.5rem;
	max-width: 1.5rem;
	width: auto;
	vertical-align: text-bottom;
}

img.iconLarge	/*ensures that larger icons don't get too big and are uniform in size. Expecially useful for Infinity menu icons*/
{
	max-height: 4.9rem;
	max-width: 5rem;
	width: auto;
	vertical-align: text-bottom;
}

MadCap|dropDown
{
	/*border-bottom: 1px solid var(--link-color);*/
	font-weight: bold;
	mc-image-position: left;
	mc-image-spacing: 10px;
	padding: 10px 0;
	mc-closed-image: url('../Images/Templates/chevronDown.png');
	mc-open-image: url('../Images/Templates/chevronUp.png');
	color: var(--heading-color);
}

.ddH2
{
	/*same as h2*/
	font-size: 1.75rem;
	color: var(--heading-color);
	margin-top: 1.75rem;
	margin-bottom: .5rem;
	line-height: normal;
	font-weight: 600;
	mc-heading: 2;
}

.ddH3
{
	/*same as h3*/
	font-size: 1.5rem;
	color: var(--heading-color);
	margin-top: 1.5rem;
	margin-bottom: .25rem;
	line-height: normal;
	font-weight: 400;
	mc-heading: 3;
}

.ddH4
{
	/*same as h4*/
	font-size: 1.25rem;
	color: var(--heading-color);
	margin-top: 1.25rem;
	margin-bottom: .25rem;
	line-height: normal;
	font-weight: 400;
	mc-heading: 4;
}

.ddProcedure
{
	/*same as procedure*/
	font-size: 1rem;
	color: black !important;
	font-weight: bold;
	margin-top: 0px !important;
}

MadCap|dropDownBody
{
	padding: 10px 30px 0;
	font-weight: normal;
}

.MCDropDown_Closed .MCDropDownHotSpot_.MCHotSpotImage
{
	color: var(--eseye-blue);
}

.MCDropDown_Closed a.MCDropDownHotSpot,
.MCDropDown_Open a.MCDropDownHotSpot
{
	color: var(--eseye-blue);
}

.MCDropDown_Open .MCDropDownHotSpot_.MCHotSpotImage
{
	color: var(--eseye-blue);
}

div.relatedLinks
{
	border-radius: 6px;
	overflow: auto;
	background-color: var(--eseye-light-blue);
	padding: 0.75rem;
	margin-top: 2rem;
}

div.accent
{
	border-radius: 6px;
	overflow: auto;
	background-color: var(--eseye-light-blue);
	padding: 0.75rem;
	margin-top: 2rem;
}

div.keepTogether
{
	page-break-inside: avoid;
}

div.banner	/* Used for banner notifications, like End of Support statements */
{
	color: white;
	background-color: var(--banner-color);
	margin: 5px;
	padding: 15px;
	border-radius: 5px;
}

div.internalMasterPageStyle	/* Used for the internal page template - do not use on a page */
{
	color: white;
	background-color: var(--internal-color);
	margin: 5px;
	padding: 15px;
	border-radius: 5px;
}

div.internalOnly
{
	position: relative;
	background-color: var(--alt-internal-color);
	margin: 0rem;
	padding: 2.5rem 0.75rem 0.75rem 2.5rem;
	border-radius: 0rem;
	border-left: 0.25rem solid var(--internal-color);
	background-image: url(../Images/icons/internalIcon.svg);
	background-repeat: no-repeat;
	background-position: 0.25rem 0.5rem;
}

div.whatsNewAutomation /* Used to demarcate area for automation on Home.htm. This area is replaced by information taken from WhatIsNew.htm, using the UpdateHome.py script */
{
	margin: 0;
    padding: 0;
    border: none;
    background: none;
}

.internalOnly
{
	background-color: var(--alt-internal-color);
	margin-left: 0.5rem;
	padding-left: 1.5rem;
	border-radius: 0.5rem;
	background-image: url(../Images/icons/internalInlineIcon.svg);
	background-repeat: no-repeat;
	background-position: top left;
}

.search-section
{
	width: 100vw;
	height: 375px;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: var(--eseye-blue);
	background-image: url("../Images/Templates/Hero_1440 x 375.png");
	background-position: right;
	background-repeat: no-repeat;
}

.heading-section
{
	width: 100vw;
	height: 300px;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	background: var(--eseye-blue);
	background-image: url("../Images/Templates/Hero_1440 x 375.png");
	background-position: right;
	background-repeat: no-repeat;
}

.tiles-flex-container
{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: stretch;
	align-content: space-around;
	gap: 3rem;
	padding: 3rem 10%;
}

div.tiles-flex-tile
{
	flex: 1 1 250px;
	border: 1px solid var(--eseye-light-blue);
	border-radius: 10px;
	padding: 0rem 1.6rem;
	transition: transform .2s;
}

.tiles-flex-container-whats-new
{
	display: flex;
	flex-wrap: wrap;
	justify-content: stretch;
	align-items: stretch;
	align-content: space-around;
	gap: 1rem;
	padding: 3rem;
	padding-top: 0;
	padding-bottom: 2rem;
}

div.whats-new-flex-tile
{
	flex: 0 1 calc(33.3% - 1rem);
	/*flex-grow: 1;flex-shrink: 1;flex-basis: 400px; */
	padding: 0 1rem;
	border: 1px solid var(--eseye-light-blue);
	border-radius: 10px;
	transition: transform .2s;
}

.quick-links-flex-container
{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: stretch;
	gap: 1rem;
}

div.quick-links-flex-tile
{
	flex: 1 1 150px;
	/*flex-grow: 1;flex-shrink: 1;flex-basis: 150px; */
}

.main-page-container
{
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: stretch;
	gap: 3rem;
	padding: 0;
	max-width: 1800px;
}

div.main-page-toc /*Online TOC */
{
	order: 1;
	flex: 1 1;
	/*flex-grow: 1;flex-shrink: 1;flex-basis: 300px; */
	padding: 0rem 0.6rem;
}

div.main-page-body
{
	order: 2;
	flex: 3 1;
	/*flex-grow: 4;flex-shrink: 1;flex-basis: 1440px; */
	padding: 0rem 0.6rem;
    margin-right: calc(300px + 0.25rem); /* takes into account the width of the secondary TOC */
}

div.main-page-toc2 /*Online TOC */
{
	order: 3;
	position: fixed;
	right: 2rem;
	width: 300px;
/*	flex: 0.5 0.5; */
	/*flex-grow: 1;flex-shrink: 1;flex-basis: 300px; */
	padding: 0rem 0.6rem;
	background-color: var(--note-color);
	border-radius: 6px;
}

div.api-schema-flex-container
{
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	justify-content: flex-end;
	gap: 0.25rem;
}

div.api-schema-tile
{
	border: 1px solid var(--eseye-light-blue);
	background-color: var(--code-color);
	border-radius: 10px;
	font-family: monospace;
}

div.api-schema-tile p
{
	margin: 0.1rem 0.5rem;
}

ul.menu._Skins_Topics_SideMenu.mc-component
{
	background-color: var(--note-color);
}

MadCap|breadcrumbsProxy
{
	color: var(--link-color);
	mc-breadcrumbs-prefix: 'Home >';
}

MadCap|xref
{
	color: var(--link-color);
}


/*


/* Set the max width to the save value as the break point in the Flare Target (on the skins tab) */

.Container
{
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: stretch;
	gap: 3rem;
	padding: 0;
	max-width: 1800px;
}

.LeftColumn	/* Only for API topics with swagger iFrame */
{
	/* flex: 1; */
	width: 550px;
}

.RightColumn	/* Only for API topics with swagger iFrame */
{
	position: relative;
	top: 0;
	/* flex: 1; */
	width: 550px;
}

.IframeWrapper
{
	height: 100vh;
	width: 550px;
}

.IframeWrapper.st1cky	/* Only applies to iframe object in API topics */
{
	position: fixed;
	top: 0;
}

.RightColumn iframe
{
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	border: none;
}

p.ctabutton
{
	font-size: 0.9375rem;
	font-weight: 700;
	font-color: white;
	text-align: center;
	background-color: var(--eseye-teal);
	/*border: 2px solid var(--eseye-light-blue);*/
	border-radius: 1.5rem;
	padding: 0.5rem;
	width: 12rem;
	/* If you change this, also change the margin-left/right below */
	height: 2.5rem;
	margin-left: calc(50% - 6rem);
	margin-right: calc(50% - 6rem);
}

hr.home
{
	color: var(--eseye-grey);
	size: 2px;
	width: 80%;
	margin-top: 3rem;
	margin-bottom: 3rem;
}

hr.footerhome
{
	color: var(--eseye-grey);
	size: 2px;
	/*width: 80%;
	margin-top: 3rem;
	margin-bottom: 3rem;*/
	width: 120vw;
	margin: 3rem 0 3rem calc(50% - 50vw);
}

.footer-section
{
	color: var(--eseye-grey);
	text-align: center;
	width: 90vw;
	margin-left: calc(50% - 45vw);
	/* where 45vw is width (90vw) divided by 2 */
	margin-right: calc(50% - 45vw);
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

/* Home page section */
/* CSS fixes for nav bar*/

.navigation-wrapper
{
	flex: 1 1 auto !important;
}

.nav-search-wrapper
{
	flex: 0 1 auto !important;
	margin: 0 0 1rem 0;
	/* Lines up search bar in header */
}

nav.title-bar	/*adds space below secondary header*/
{
	/*margin-top: 2rem;*/
}

.topNav	/*adds secondary nav bar*/
{
	height: 2rem;
	background-color: var(--eseye-mid-blue);
	position: fixed;
	top: 0px;
	color: white;
	font-weight: 700;
	text-align: right;
	width: 100vw;
	left: 0px;
	padding: 0.1rem 5% 0.1rem 0.1rem;
	font-size: 0.75rem;
	z-index: 99;
}

div.topNav a
{
	font-family: 'Montserrat', sans-serif;
	color: white !important;
	font-size: 0.75rem;
	font-weight: 700;
	padding-right: 1rem;
}

button#searchButton
{
	background-color: var(--eseye-mid-blue);
	border: none;
	color: white;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 0.75rem;
	padding-right: 1rem;
}

nav.title-bar .menu-icon
{
	top: 32vh !important;
	/* Defines the location of the TOC expand button in tablet/mobile views */
}

.title-bar-layout
{
	flex-wrap: nowrap;
}

.searchNav	/*adds secondary search bar*/
{
	padding-top: 2rem;
	padding-bottom: 3rem;
	background-color: var(--note-color);
	border-bottom: 0.5rem solid var(--link-color);
	position: fixed;
	width: 100%;
	top: 2rem;
	left: 0rem;
	z-index: 55;
}

/* Online TOC changes */

ul.menu._Skins_Topics_SideMenu.mc-component
{
	line-height: 1.5rem;
}

/* Search bar changes */

.search-bar._Skins_Eseye_Home_Searchbar.mc-component
{
	margin-left: inherit !important;
	/* Fix for responsive tablet/mobile views */
}

/*CSS fix for overwriting spacing around footer*/

.height-container-sidenav
{
	padding-bottom: 0px;
}

.main-section > .outer-row
{
	padding-bottom: 0px;
}

/* Glossary fixes */

div.MCTopicPopupContainer
{
	padding: 0px !important;
	height: auto !important;
	bottom: 50% !important;
}

.glossarySearch
{
	height: 3em;
	border-top-left-radius: 1.5rem;
	border-top-right-radius: 1.5rem;
	border-bottom-right-radius: 1.5rem;
	border-bottom-left-radius: 1.5rem;
	width: 20vw;
	margin-left: calc(50% - 10vw);
	font-family: Montserrat;
	font-size: 1em;
	padding-left: 1rem;
	margin-top: 2rem;
}

/* Top right search bar fixes */

ul.navigation li
{
	font-weight: 600 !important;
	size: 1.5rem !important;
}

ul.navigation li > a
{
	font-weight: 600;
	font-size: 1.5 rem;
}

ul.navigation li > a:hover
{
	text-decoration: underline;
}

ul.navigation li.has-children > a
{
	font-weight: 800 !important;
	color: var(--eseye-mid-blue);
	font-size: 0.875rem;
	letter-spacing: 0.0063rem;
}

ul.navigation li.has-children > a:hover
{
	font-weight: 800 !important;
	text-decoration: underline solid var(--eseye-teal) 0.375rem;
	text-underline-offset: 0.5rem;
}

MadCap|xref.quicklinks
{
	color: var(--eseye-grey);
	text-decoration: none;
}

MadCap|xref.quicklinks:visited
{
	color: var(--eseye-grey);
	text-decoration: underline;
}

MadCap|xref.quicklinks:hover
{
	color: var(--eseye-grey);
	text-decoration: underline;
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    .main-page-container {
        flex-flow: column nowrap; /* Stack the columns vertically */
    }

    div.main-page-toc {
        order: 1;
        width: 100%; /* Take full width on mobile */
        flex: none; /* Disable flex-grow and flex-shrink */
    }

    div.main-page-toc2 {
        position: relative; /* Position it within the document flow */
        order: 2; /* Move it above the main-page-body */
        width: 100%; /* Full width on mobile */
        height: auto; /* Let it expand with the content */
        right: 0; /* Reset the right margin */
        padding: 1rem 0.6rem; /* Adjust padding for better mobile layout */
        box-shadow: none; /* Remove shadow if not needed on mobile */
    }

    div.main-page-body {
        order: 3;
        margin-right: 0; /* Remove the right margin reserved for toc2 */
        flex: none; /* Disable flex-grow and flex-shrink */
        width: 100%; /* Take full width on mobile */
    }
}

@media print
{
	p
	{
		font-size: 0.8rem;
	}

	li
	{
		font-size: 10pt;
	}
	
	li p
	{
		font-size: 10pt;
	}

	td
	{
		font-size: 0.8rem;
	}
	
	td p
	{
		font-size: 1rem;
	}
	
	.note	/* Applies styled box for notes. Apply to p style for single paragraph note. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
	{
	background-position: 0.8rem 50%;
	padding: 0.75rem 0.75rem 0.75rem 3.2rem;
	}
	
	.tip	/* Applies styled box for tips. Apply to p style for single paragraph note. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
	{
	background-position: 0.8rem 50%;
	padding: 0.75rem 0.75rem 0.75rem 3.2rem;
	}
	
	.warn	/* Applies styled box for warnings. Apply to p style for single paragraph note. Group multiple paragraphs with div, then apply to div for multiple paragraphs. */
	{
	background-position: 0.8rem 50%;
	padding: 0.75rem 0.75rem 0.75rem 3.2rem;
	}

	h2
	{
		
	}

	MadCap|xref
	{
		font-style: italic;
		color: var(--link-color);
	}

	a.xref
	{
		font-style: italic;
		color: var(--link-color);
	}

	MadCap|xref:focus
	{
		text-decoration: underline;
	}

	MadCap|xref:hover
	{
		text-decoration: underline;
	}
	
	p.TOC1
	{
	color: var(--Dark);
	margin-top: 15px;
	page-break-after: avoid;
	font-size: inherit;
	font-weight: bold;
	line-height: 12pt;
	margin-bottom: 10px;
	}

	p.TOC2
	{
	color: var(--Dark);
	font-weight: normal;
	line-height: 12pt;
	margin-left: .25in;
	font-size: inherit;
	margin-top: 10px;
	margin-bottom: 10px;
	}

	p.TOC3
	{
	color: var(--Dark);
	font-weight: normal;
	margin-bottom: 10px;
	margin-top: 10px;
	margin-left: 0.5in;
	font-size: inherit;
	line-height: 12pt;
	}
	
	p.TOC4
	{
	color: var(--Dark);
	font-weight: normal;
	margin-bottom: 10px;
	margin-top: 10px;
	margin-left: 0.75in;
	font-size: inherit;
	line-height: 12pt;
	}
}