/*<meta conditions="Other.MasterTopNav" />*/

/* ----------- DO NOT EDIT THIS FILE IN FLARE'S EDITOR - USE TEXT EDITOR ONLY ------------------------ */
/* ------------------------------------------------------------------------- MASTER PAGES ------------------------ */

html.home	/* html: home page (home) */
{
	mc-master-page: url('../MasterPages/Home_Topic.flmsp');
}

html.normal	/* html: normal page(normal) */
{
	mc-master-page: url('../MasterPages/Normal_Topic.flmsp');
}

html.section	/* html: section page with grid menu at bottom (section) */
{
	mc-master-page: url('../MasterPages/Section_Topic.flmsp');
}

html.normal-no-menu	/* html: normal page with no menu (normal-no-menu) */
{
	mc-master-page: url('../MasterPages/Normal_Topic_No_Menu.flmsp');
}

html.normal-no-nav,
html.normal-no-sidenav,
html.normal-no-topnav	/* html: normal page with no nav menu (normal-no-nav) - includes old html classes for: no-sidenav, no-topnav */
{
	mc-master-page: url('../MasterPages/Normal_Topic_No_Nav.flmsp');
}

html.search-results	/* html: search results page */
{
	mc-master-page: url('../MasterPages/Search_Results.flmsp');
}

/* ------------------------------------------------------------------------- SKINS (manual skin modifications) -------------- */

#menu-bar-container	/* Top Nav: menu container */
{
	background-color: #191919;
	/* CSS variable IE 11 support */
	background-color: var(--col-grey-900);
	padding-top: 0;
	margin-left: -1em;
	/* move left to align */
}

#menu-bar-container ul.navigation > li.has-children > a::after	/* Add down icon to top level menu items with children */
{
	/*
	content: "\f0d7";
	font-family: FontAwesome;
	padding: 0 0 0 0.5em;
	*/
}

ul.navigation ul > li.has-children > a:after	/* Add right icon to menu items with children - replaces default icon */
{
	/*
	content: "\f0da";
	font-family: FontAwesome;
	*/
}

#menu-bar-container ul.navigation button.topnav-expand-toplevel	/* fix hard-coded position of topnav accessibility submenu button */
{
	top: 1rem;
}

.sage-sidenav nav.title-bar	/* set border between topic and header */
{
	border-bottom: solid 1px #000000;
}

.sage-sidenav .title-bar-layout .logo-wrapper	/* change logo wrapper style as now contains header text - align with search bar */
{
	min-height: 0;
	/* overwrite default setting */
	/* padding-left: 0.67rem; */
}

.sage-sidenav nav.title-bar button.menu-icon
{
	top: 0.5em;
	/* move menu icon up to align with title text */
}

html.normal-no-nav.sage-sidenav .sidenav-wrapper,
html.normal-no-sidenav.sage-sidenav .sidenav-wrapper	/* Side Nav - hide side nav menu for 'normal-no-nav' master page. */
{
	display: none;
}

html.normal-no-nav.sage-sidenav .title-bar-container,
html.normal-no-sidenav.sage-sidenav .title-bar-container,
html.normal-no-nav.sage-sidenav nav.title-bar,
html.normal-no-sidenav.sage-sidenav nav.title-bar	/* Side Nav - hide title bar for 'normal-no-nav' master page. Class 'title-bar' is current name, 'title-bar-container' is older class name. */
{
	display: none;
}

html.normal-no-nav.sage-topnav nav.title-bar.tab-bar,
html.normal-no-topnav.sage-topnav nav.title-bar.tab-bar	/* Top Nav - hide title bar for 'normal-no-nav' master page */
{
	display: none;
}

ul.navigation	/* Top nav - reset margins and padding so don't inherit */
{
	margin: 0;
	padding: 0;
}

ul.navigation ul	/* Top Nav - menu item */
{
	border-radius: 0 0 8px 8px;
	/*  menu item rounded bottom corners only (2nd level) - radius - rebrand 2022 phase 2 */
}

ul.navigation ul ul	/* Top Nav - menu item */
{
	border-radius: 8px;
	/* menu item rounded all corners (3rd level upwards) - radius - rebrand 2022 phase 2 */
}

ul.navigation li > a	/* Top Nav - menu item */
{
	
}

ul.navigation li > a:hover	/* Top Nav - menu item hover (1st level) */
{
	color: #ffffff;
}

ul.navigation ul li:hover > a	/* Top Nav - menu item hover on list item, but not over menu text (2nd level upwards) */
{
	color: #ffffff;
}

ul.navigation li:hover,
ul.navigation li > a:hover,
ul.navigation li > a.selected:hover	/* Top Nav - menu item hover (2nd level upwards) */
{
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
}

.sage-sidenav li.tree-node.is-accordion-submenu-parent.tree-node-selected > ul.vertical.menu.accordion-menu.is-accordion-submenu.nested > li > a	/* highlight child topics */
{
	/* background-color: #f7f7f7; */
}

.sage-sidenav ul.sidenav ul ul ul ul ul > li > a	/* 5th level menu indentation */
{
	margin-left: 5rem;
}

.sage-sidenav ul.sidenav ul ul ul ul ul ul > li > a	/* 6th level menu indentation */
{
	margin-left: 6rem;
}

.sage-sidenav ul.sidenav ul ul ul ul ul ul ul > li > a	/* 7th level menu indentation */
{
	margin-left: 7rem;
}

.sage-sidenav .sidenav-wrapper	/* side nav panel */
{
	background-color: #262626;
	/* CSS variable IE 11 support */
	background-color: var(--col-grey-850);
	/* rebrand 2-2023 */
	border-right: 1px solid #262626;
	/* CSS variable IE 11 support */
	border-right: 1px solid var(--col-grey-850);
	/* rebrand 2-2023 */
	min-width: 15rem;
	/* set minimum and maximum widths for the side nav panel */
	max-width: 30rem;
}

.sage-sidenav .body-container
{
	padding: 0 0 0 0;
	/* override hard-coded padding on topic body container in desktop view */
}

.sage-sidenav ul.sidenav li.is-accordion-submenu-parent > a > span.submenu-toggle-container::before	/* set background on expand/collapse icon for side nav menu item (not responsive menu) */
{
	position: absolute;
	content: "";
	background-color: transparent;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	border-left: 2px solid #ffffff;
	border-radius: 0 8px 8px 0;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

.sage-sidenav ul.sidenav li.is-accordion-submenu-parent > a > span.submenu-toggle-container	/* toggle button */
{
	border-radius: 0 8px 8px 0;
	/* for button focus - rounded corners - radius - rebrand 2022 phase 2 */
}

.sage-sidenav ul.sidenav li.is-accordion-submenu-parent > a.selected > span.submenu-toggle-container::before	/* set background on expand/collapse icon on selected item to default selected colour */
{
	/* disabled 2022 rebrand */
	/* background-color: transparent; */
}

.sage-sidenav ul.sidenav li.is-accordion-submenu-parent > a.selected > span.submenu-toggle-container > span.submenu-toggle	/* set expand/collapse colour on selected items */
{
	/* border-top-color: #ffffff; */
}

.sage-sidenav ul.sidenav li.is-accordion-submenu-parent > a > span.submenu-toggle-container:hover::before	/* set hover background on expand/collapse icon */
{
	background-color: #006738;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1);
	color: #ffffff;
}

.sage-sidenav ul.sidenav span.submenu-toggle-container:hover > span.submenu-toggle	/* set hover icon colour for expand/collapse icon */
{
	border-top-color: #ffffff;
}

.submenu-toggle-container span.invisible-label:before	/* Accessibility - add "submenu" prefix before invisible label on the menu item toggler button */
{
	/* Prefix label for side nav toggler button (side menu) - LOCALISED in localised_text.css */
	content: "Submenu: ";
}

.sage-sidenav ul.sidenav a.selected:hover,
ul.off-canvas-list a.selected:hover	/* Side Nav & responsive - hover colour for selected items */
{
	/* color: rgba(0,0,0,0.9); */
	/* CSS variable IE 11 support */
	/* color: var(--col-black-90); */
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
	color: #ffffff;
}

ul.sidenav li a:hover,
ul.off-canvas-list li a:hover	/* Side Nav & responsive - menu item hover */
{
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
}

aside#offCanvas	/* Side Nav & Top Nav - responsive menu */
{
	padding: 0.25rem;
	/* add padding to container */
}

ul.sidenav li a.selected,
ul.off-canvas-list li a.selected	/* Side Nav & responsive - menu item selected */
{
	background-color: rgba(255,255,255,0.35);
	/* CSS variable IE 11 support */
	background-color: var(--col-yang-35);
	/* changed to yang-35, as yang-30 failed accessibility contrast ratio */
}

aside.off-canvas	/* off canvas responsive menu */
{
	background-color: #262626;
	/* CSS variable IE 11 support */
	background-color: var(--col-grey-850);
	/* rebrand 2-2023 */
}

.is-accordion-submenu-parent > a span.submenu-toggle-container	/* increase width of toggle - related to below */
{
	width: 2rem;
}

.off-canvas-accordion .is-accordion-submenu-parent > a	/* increase width of toggle  - related to above, but add small amount so text doesn't touch border divider */
{
	padding-right: 2.25rem;
}

ul.navigation ul.sub-menu,
.search-filter-content	/* add shadow to top nav menu and search filter */
{
	box-shadow: 0 10px 10px 0 rgba(0,20,30,0.1), 0 5px 5px 0 rgba(0,20,30,0.2);
	/* DS menu shadow - rebrand 2022 */
	border: solid 1px #e0e1dd;
	border-top: none;
}

.search-filter-content	/* don't limit size of search filter menu. Script appears to set element max-height to clip to visible screen. */
{
	max-height: 40em !important;
}

section.sage-banner div.search-filter-content	/* reduce font-size for search filter in banner */
{
	font-size: 1rem;
}

.search-filter-content .SearchFilterEntry	/* Fix bug with duplicate entries appearing in filter list - li.SearchFilterEntry items only seem to appear in search bar component on home page - REMOVED as not required if don't use name #search for container */
{
	/* display: none; */
}

.search-bar .search-field
{
	color: rgba(0,0,0,0.9);
	/* CSS variable IE 11 support */
	color: var(--col-black-90);
}

.search-submit	/* Search (all) - set search submit button colour as can't use variables in skin (it replaces 'center center' with 'background' and breaks position) */
{
	background-color: #007E45 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product) !important;
	border-color: transparent !important;
	/* Set border colour on search submit to transparent, as it overlaps the :focus outline (on input) */
}

.search-submit:hover	/* Search (all) - search submit button hover - fixes bug, hover colour doesn't work if set in skin */
{
	background-color: #006738 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1) !important;
}

input.search-field::placeholder,
input#sage-search-input::placeholder	/* Override placeholder colour set by skin to match search input (rebrand 2-2023) */
{
	color: #737373 !important;
	/* CSS variable IE 11 support */
	color: var(--col-yin-55) !important;
}

._Skins_Sage_Search_Results_TopNav #resultList h3.title	/* Heading on search results page - "Your search for xxx returned yyy result(s)" */
{
	font-size: 1.5em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h3);
	/* same as h3 */
	margin: 1em 0 0.5em 0;
	/* reduce margin spacing */
}

#pagination a	/* search results pagination link */
{
	color: #007E45;
	/* CSS variable IE 11 support */
	color: var(--business-product);
	border-color: #007E45;
	/* CSS variable IE 11 support */
	border-color: var(--business-product);
	flex: 0 1 auto;
	/* set properties for flex items (buttons) */
}

#pagination a:hover	/* search results pagination link styles */
{
	background-color: #006738 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1) !important;
	/* override selected colour */
	border-color: #006738 !important;
	/* CSS variable IE 11 support */
	border-color: var(--business-product-hover1) !important;
	/* override selected colour */
	color: #ffffff;
}

#pagination a#selected
{
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
	border-color: #007E45;
	/* CSS variable IE 11 support */
	border-color: var(--business-product);
	color: #ffffff;
}

._Skins_Sage_Search_Results_TopNav.mc-component #pagination,
#pagination	/* override skin defaults for pagination links container */
{
	height: auto;
	/* override fixed height */
}

ul.pagination-list	/* pagination list inserted by script */
{
	list-style-type: none;
	height: auto;
	/* allow container to increase in size to fit rows */
	display: flex;
	/* Set as flex container. This will  be overridden by MadCap scripts setting inline display style of none or block, so additional JS has been added to set this to flex if buttons are visible (display:block). */
	flex-direction: row;
	/* set flex items (butttons) in a row */
	flex-wrap: wrap;
	/* allow flex items (buttons) to wrap if they don't fit */
	justify-content: left;
	/* justify flex items (buttons) to left */
	margin: 1em 0;
	/* add 1em margin above/below button strip */
	line-height: 1.5em;
	/* fix to stop vertical scroll bar appearing in search results - make sure line height is smaller than 4em height set in skin. */
}

li.pagination-list-item	/* pagination list items  inserted by script */
{
	flex: 0 1 auto;
	/* set properties for flex items (pagination buttons) */
	padding: 0 0 0.5em 0;
	margin: 0;
}

#no-results	/* no results box on search results page - hide unless you get no results */
{
	display: none;
}

.search-filter	/* Search (all) - search filter button - left border divider */
{
	border-left: solid 2px #006738;
	/* CSS variable IE 11 support */
	border-left: solid 2px var(--business-product);
}

.search-filter:hover	/* fix skin bug - if you set a background image for hover, the 'no repeat' and 'center' property is omitted */
{
	background-repeat: no-repeat !important;
	background-position: center !important;
}

.search-filter-content	/* Set search filter menu to appears above top nav menu, which has z-index : 3 */
{
	z-index: 5;
}

.sage-tripane body	/* Reset margins on body for tripane */
{
	margin: 0;
}

.search-bar .search-filter:hover	/* Search (all) - search filter button hover */
{
	background-color: #006738 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1) !important;
}

.search-bar .search-filter.open,
.search-filter-content	/* Search (all) - search filter text */
{
	color: rgba(0,0,0,0.9);
	/* CSS variable IE 11 support */
	color: var(--col-black-90);
}

.search-filter-content ul li:hover	/* Search (all) - search filter menu hover */
{
	background-color: #006738 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1) !important;
}

.search-filter-content ul li:focus,
.search-filter-content ul li:focus-within,
.search-filter-content ul li button:focus	/* Search (all) - search filter menu focus. Override defaults from skin.  */
{
	color: inherit !important;
	background-color: inherit !important;
}

.search-bar.search-bar-container .search-submit:hover	/* Search (all) - search submit button hover - fixes bug, hover colour doesn't work if set in skin */
{
	background-color: #006738 !important;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1) !important;
}

#search-results h2#results-heading	/* Search results (Side Nav / Top Nav) - Heading changed from h1 to h2 in script, so need to add/reset some styles */
{
	font-weight: 500;
	border-bottom: solid 2px #b9bab7;
	margin-top: unset;
}

#resultList h3.title a,
#resultList h3.title a:visited,
.micro-response-title a,
.micro-response-title a:visited	/* Search results (all) - results link */
{
	color: #007E45 !important;
	/* CSS variable IE 11 support */
	color: var(--business-product) !important;
}

#resultList h3.title a:hover,
#resultList h3.title a:focus,
.micro-response-title a:hover,
.micro-response-title a:focus	/* Search results hover (all) - results link */
{
	color: #006738;
	/* CSS variable IE 11 support */
	color: var(--business-product-hover1) !important;
}

#resultList .url cite,
.micro-response-url cite	/* Search results (all) - results path URL */
{
	color: #00324C;
	/* CSS variable IE 11 support */
	color: var(--col-action-minor-500);
}

#resultList .glossary	/* Search results (all) - glossary term */
{
	background-color: #F2F5F6;
	/* CSS variable IE 11 support */
	background-color: var(--col-action-minor-50);
}

#resultList b	/* Accessibility - hide bold formatting applied to matching terms in search results list, set to weight to normal/400  */
{
	font-weight: 400;
}

p.MCWebHelpFramesetLink	/* Tripane skin - 'Open topic in Navigation frame' style */
{
	margin-top: 0px;
	margin-bottom: 4px;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 26px;
	padding-right: 4px;
	border-style: solid;
	border-width: 1px;
	border-color: #dae0df;
	background-color: #D1FDE0;
	/* Jade T7 */
}

.height-container-sidenav	/* MadCap bug - Fixes hard-coded padding set by MadCap in Topic.css. Affects both side nav and top nav. */
{
	padding-bottom: 0 !important;
}

/* ------------------------------------------------------------------------- MENU PROXIES (Navigation menus) ------------------ */
/* --------------------------------------------------- menu-section: large navigation grid used in section pages (Sage-Menu-Section-TopNav skin proxy) */
/* (A) Menu hides top level - Sage_Menu_Section_TopNav */
/* (B) Menu displays top level - Sage_Menu_Section_Home ['Skins_Sage_Menu_Section_Home' skin has now been removed from template, but leave CSS here for compatibility]*/

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav,
ul.menu.mc-component._Skins_Sage_Menu_Section_Home
{
	/* Set width 100% so that menu fills all available space */
	width: 100%;
}

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu,
ul.menu.mc-component._Skins_Sage_Menu_Section_Home
{
	/* (A) First sub-menu inside the menu proxy - which are the child elements of the current topic. This is the container for the grid flex row */
	/* (B) Main menu inside the menu proxy. This is the container for the grid flex row */
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 5%;
}

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > a
{
	/* (A) This is the link to the current parent topic - we want to hide this */
	display: none;
}

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu > li,
ul.menu.mc-component._Skins_Sage_Menu_Section_Home > li
{
	/* These are the menu child elements, which are flex items in the grid - we set them to flex-grow: 0 (so equal width and doesn't expand), flex-shrink: 1, and flex basis 30% for 3 columns  as we have 2x 5% gaps) */
	flex: 0 1 30%;
}

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu > li > a,
ul.menu.mc-component._Skins_Sage_Menu_Section_Home > li > a
{
	/* These are the hyperlinks inside the menu child elements */
	display: block;
	font-size: 1em;
	font-weight: 500;
	/* background-color: #ffffff; */
	border: 2px solid #335B70;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-action-minor-500);
	color: #335B70;
	/* CSS variable IE 11 support */
	color: var(--col-action-minor-500);
	line-height: 1.2em;
	padding: 1em 1.5em 1em 1.5em;
	/* rounded corners - radius - rebrand 2022 phase 2 */
	margin: 1em 0 1em 0;
	/* add spacing for wrapped rows */
	border-radius: 8px;
	/* rounded corners - radius - rebrand 2022 phase 2 */
	text-align: center;
	text-decoration: underline;
	/* display underline on links, as hard-coded as 'none' */
}

ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu > li > a:hover,
ul.menu.mc-component._Skins_Sage_Menu_Section_Home > li > a:hover	/* Link hover / focus style */
{
	color: #ffffff !important;
	background-color: #00324C;
	/* CSS variable IE 11 support */
	background-color: var(--col-action-minor-600);
	border: 2px solid #00324C;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-action-minor-600);
	text-decoration: underline;
	/* display underline on links, as hard-coded as 'none' */
}

/* LARGE screens (DESKTOP) - no changes */
/* MEDIUM screens (TABLET) */

@media only screen and (max-width: 1024px)
{
	ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu > li
	{
		/* In medium screen widths, set flex basis: 47.5% for 2 columns, as have 12 5% gap */
		flex: 0 1 47.5%;
	}
}

/* SMALL screens (MOBILE) */

@media only screen and (max-width: 640px)
{
	ul.menu.mc-component._Skins_Sage_Menu_Section_TopNav li.has-children > ul.sub-menu > li
	{
		/* In small screen widths, set flex basis: 100% for 1 column */
		flex: 0 1 100%;
	}
}

/* --------------------------------------------------- menu-topic-container (Menu-Topic skin proxy): sidebar navigation used by 'On this page' menu (all skins) and TOC 'Menu' (Top Nav skin only) */

nav.menu-topic-container	/* container for topic navigation control */
{
	margin: 0em 0em 1em 0em;
	padding: 1em 0 1em 0;
	border-radius: 8px;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

nav#menu-toc.menu-topic-container	/* set background and link colours - menu TOC */
{
	background-color: #262626;
	/* CSS variable IE 11 support */
	background-color: var(--col-grey-850);
	/* rebrand 2-2023 */
	color: #ffffff;
	/* rebrand 2-2023 */
}

nav#menu-on-page.menu-topic-container	/* set background and link colours - on this page TOC */
{
	color: rgba(0,0,0,0.9);
	/* CSS variable IE 11 support */
	color: var(--col-black-90);
	/* rebrand 2-2023 */
}

nav.menu-topic-container::before	/* heading for menu proxy navigation control - no longer used for accessibility */
{
	/* content: "Menu"; */
	/* Default text label for any menu type - overwritten using IDs below. */
	display: block;
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-size: 1.25em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h4);
	/* same as h4 */
	font-weight: 700;
	line-height: 1.25em;
	margin: 0rem 1rem 0.5rem 1rem;
	color: inherit;
}

nav#menu-on-page.menu-topic-container::before
{
	/* content: "On this page"; * /
	/* Label for topic headings menu (side menu) - LOCALISED in localised_text.css */
}

nav#menu-toc.menu-topic-container::before
{
	/* content: "Menu"; */
	/* Label for Menu proxy (side menu) - LOCALISED in localised_text.css */
}

header.menu-topic-container-heading	/* heading for menu proxy navigation control - based on h4 - uses header for accessibility */
{
	display: block;
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-size: 1.25em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h4);
	/* same as h4 */
	font-weight: 700;
	line-height: 1.25em;
	margin: 0rem 1rem 0.5rem 1rem;
	color: inherit;
}

nav.menu-topic-container ol,
nav.menu-topic-container ul,
nav.menu-topic-container ol li,
nav.menu-topic-container ul li	/* remove list formatting, display as blocks */
{
	margin: 0;
	padding: 0;
	display: block;
	list-style-type: none;
	line-height: 1.5em;
	/* override hard-coded 1em */
}

nav.menu-topic-container a	/* base style for all links */
{
	color: inherit;
	/* rebrand 2-2023 */
	padding: 0.33em 0.67em 0.33em 1em;
	font-weight: 500;
	text-decoration: none;
	display: block;
}

nav#menu-on-page.menu-topic-container a	/* set default left border colour - on this page TOC */
{
	border-left: 4px solid #E6EBED;
	/* CSS variable IE 11 support */
	border-left: 4px solid var(--col-action-minor-100);
	border-radius: 0 8px 8px 0;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

nav.menu-topic-container a:before	/* Standard topic, uses font icon fa-caret-right */
{
	/*
	font-family: "FontAwesome";
	content: "\f0da";
	padding: 0 0.5em 0 0;
	*/
}

nav.menu-topic-container ul.sub-menu > li.has-children > a:before	/* Book topics with "has-children" class. Uses font icon fa-caret-down */
{
	/*
	font-family: "FontAwesome";
	content: "\f0d7";
	padding: 0 0.5em 0 0;
	*/
}

nav.menu-topic-container ul._Skins_Sage_Menu_Topic_TopNav > li.has-children > a:before	/* Parent topic, uses font icon fa-caret-up */
{
	/*
	font-family: "FontAwesome";
	content: "\f0d8";
	padding: 0 0.5em 0 0;
	*/
}

nav#menu-toc.menu-topic-container a.selected	/* current topic with "selected" class - menu TOC */
{
	background-color: rgba(255,255,255,0.35);
	/* CSS variable IE 11 support */
	background-color: var(--col-yang-35);
	/* changed to yang-35, as yang-30 failed accessibility contrast ratio */
	/* color: #ffffff; */
}

nav#menu-on-page.menu-topic-container a.selected	/* current topic with "selected" class - on this page TOC */
{
	border-left: 4px solid #007E45;
	/* CSS variable IE 11 support */
	border-left: 4px solid var(--business-product);
	background-color: #ffffff;
	/* color: #ffffff; */
}

nav.menu-topic-container a.selected + ul.sub-menu	/* highlight child items in the selected topic sub menu */
{
	/* removed for rebrand 2022 */
}

nav#menu-toc.menu-topic-container a:hover	/* hover on links - menu TOC */
{
	color: #ffffff;
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
	/* text-decoration: none; */
}

nav#menu-on-page.menu-topic-container a:hover	/* hover on links - on this page TOC */
{
	background-color: #CCD6DB;
	/* CSS variable IE 11 support */
	background-color: var(--col-action-minor-200);
	/* text-decoration: none; */
}

/* DISABLED - rebrand 2022 links - overwrite link styles */

/*
nav.menu-topic-container a:focus	
{
	outline-style: solid;
	background-color: initial;
}
*/

nav.menu-topic-container a.selected:hover,
nav.menu-topic-container a.selected:focus	/* hover colour on selected (current) item */
{
	/* background-color: #004B87; */
}

nav.menu-topic-container ul._Skins_Sage_Menu_Topic_TopNav > li.has-children > a	/* parent topic link */
{
	padding-left: 1em;
}

nav.menu-topic-container ul > li > ul > li > a	/* position first level topic (parent) */
{
	padding-left: 2em;
}

nav.menu-topic-container ul > li > ul > li > ul > li > a	/* position second level topic */
{
	padding-left: 3em;
}

nav.menu-topic-container ul > li > ul > li > ul > li > ul > li > a	/* position third level topic */
{
	padding-left: 4em;
}

#menu-on-page ul > li > a
{
	padding-left: 1em;
	/* position first level topic in page menu */
}

#menu-on-page ul ul > li > a
{
	padding-left: 2em;
	/* position second level topic in page menu */
}

#menu-on-page ul ul ul > li > a
{
	padding-left: 3em;
	/* position third level topic in page menu */
}

#menu-on-page ul ul ul ul > li > a
{
	padding-left: 4em;
	/* position fourth level topic in page menu */
}

/* ------------------------------------------------------------------------- MEDIA QUERIES - RESPONSIVE ELEMENTS -------------- */
/* media query sizes: http://foundation.zurb.com/docs/media-queries.html */

#dimensions	/* dimensions in bottom left (development only - remove) */
{
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	color: white;
	padding: 3px;
	z-index: 5000;
}

/* --------------------------------------------------- LARGE screens (DESKTOP) */

#dimensions
{
	background-color: #20B2AA;
}

section.sage-topic-body
{
	margin: 0;
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.sage-topnav section.sage-topic-body,
.sage-topnav section.sage-header-bar,
.sage-topnav section.sage-header,
.sage-topnav section.sage-banner,
.sage-topnav section.sage-section,
.sage-topnav section.sage-footer,
.sage-topnav footer.sage-footer	/* set padding for all sections (top nav) */
{
	padding-left: 5rem;
	padding-right: 5rem;
}

.sage-sidenav section.sage-topic-body,
.sage-sidenav section.sage-header-bar,
.sage-sidenav section.sage-header,
.sage-sidenav section.sage-banner,
.sage-sidenav section.sage-section,
.sage-sidenav section.sage-footer,
.sage-sidenav footer.sage-footer	/* set padding for all sections (side nav) */
{
	padding-left: 2rem;
	padding-right: 2rem;
}

.sage-tripane section.sage-topic-body,
.sage-tripane section.sage-header-bar,
.sage-tripane section.sage-header,
.sage-tripane section.sage-banner,
.sage-tripane section.sage-section,
.sage-tripane section.sage-footer,
.sage-tripane footer.sage-footer	/* set padding for all sections (tripane) */
{
	padding-left: 1rem;
	padding-right: 1rem;
}

section.sage-banner #sage-home-title
{
	/* font-size: 3em; */
}

section.sage-banner
{
	/* font-size: 1.4em; */
}

/* --------------------------------------------------- MEDIUM screens (TABLET) */

@media only screen and (max-width: 1024px)
{
	#dimensions
	{
		background-color: #6B8E23;
	}

	section.sage-topic-body
	{
		margin: 0;
		padding-top: 2rem;
		padding-bottom: 2rem;
	}

	.sage-topnav section.sage-topic-body,
	.sage-topnav section.sage-header-bar,
	.sage-topnav section.sage-header,
	.sage-topnav section.sage-banner,
	.sage-topnav section.sage-section,
	.sage-topnav section.sage-footer,
	.sage-topnav footer.sage-footer	/* set padding for all sections (top nav) */
	{
		padding-left: 3rem;
		padding-right: 3rem;
	}

	.sage-sidenav section.sage-topic-body,
	.sage-sidenav section.sage-header-bar,
	.sage-sidenav section.sage-header,
	.sage-sidenav section.sage-banner,
	.sage-sidenav section.sage-section,
	.sage-sidenav section.sage-footer,
	.sage-sidenav footer.sage-footer	/* set padding for all sections (side nav) */
	{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.sage-tripane section.sage-topic-body,
	.sage-tripane section.sage-header-bar,
	.sage-tripane section.sage-header,
	.sage-tripane section.sage-banner,
	.sage-tripane section.sage-section,
	.sage-tripane section.sage-footer,
	.sage-tripane footer.sage-footer	/* set padding for all sections (tripane) */
	{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	section.sage-banner #sage-home-title
	{
		/* font-size: 2.75em; */
	}

	#sage-home-banner-content	/* content inside banner (side nav) */
	{
		min-height: 20em;
		/* set minimum height to prevent cropping background image on medium/large*/
	}

	section.sage-banner
	{
		/* font-size: 1.2em; */
	}

	#sage-header-search
	{
		padding-top: 0.5em;
		/* add padding between search bar and menu on medium screen */
	}
}

/* --------------------------------------------------- SMALL screens (MOBILE) */

@media only screen and (max-width: 640px)
{
	#dimensions
	{
		background-color: #DAA520;
	}

	section.sage-topic-body
	{
		margin: 0;
		padding-top: 2rem;
		padding-bottom: 2rem;
	}

	.sage-topnav section.sage-topic-body,
	.sage-topnav section.sage-header-bar,
	.sage-topnav section.sage-header,
	.sage-topnav section.sage-banner,
	.sage-topnav section.sage-section,
	.sage-topnav section.sage-footer,
	.sage-topnav footer.sage-footer	/* set padding for all sections (top nav) */
	{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.sage-sidenav section.sage-topic-body,
	.sage-sidenav section.sage-header-bar,
	.sage-sidenav section.sage-header,
	.sage-sidenav section.sage-banner,
	.sage-sidenav section.sage-section,
	.sage-sidenav section.sage-footer,
	.sage-sidenav footer.sage-footer	/* set padding for all sections (side nav) */
	{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	.sage-tripane section.sage-topic-body,
	.sage-tripane section.sage-header-bar,
	.sage-tripane section.sage-header,
	.sage-tripane section.sage-banner,
	.sage-tripane section.sage-section,
	.sage-tripane section.sage-footer,
	.sage-tripane footer.sage-footer	/* set padding for all sections (tripane) */
	{
		padding-left: 1rem;
		padding-right: 1rem;
	}

	section.sage-banner #sage-home-title
	{
		/* font-size: 2.25em; */
	}

	section.sage-banner
	{
		/* font-size: 1.2em; */
	}

	.right	/* no left margin on small screen */
	{
		margin: 0em 0em 1em 0em;
	}

	#sage-header-search
	{
		padding-top: 0.5em;
		/* add padding between search bar and menu on small screen */
	}
}

/* --------------------------------------------------- END media query sizes ------- */
/* ------------------------------------------------------------------------- PAGE HEADER AND TOP NAV ------------------ */

section.sage-header
{
	/* font-size: 1.125em; */
}

#sage-header-title	/* header - product title (top nav and side nav) */
{
	margin: 0;
	display: none;
	/* hide product title until top nav and side nav scripts have been run */
	line-height: 1.75em;
	position: relative;
	/* white-space:nowrap; */
	/* Removed for accessibility, originally didn't wrap header title on multiple lines */
}

.sage-topnav #sage-header-title	/* header - product title (top nav) */
{
	top: 0.75em;
	/* larger, to align with search box */
	display: block;
	/* display product title when top nav script has run */
	padding-bottom: 1em;
}

.sage-sidenav #sage-header-title	/* header - product title (side nav) */
{
	top: 8px;
	display: block;
	/* display product title when side nav script has run, and it's been moved to header */
}

.sage-sidenav .title-bar-layout .logo-wrapper	/* header product title - fix Flare's default settings */
{
	display: block;
	/* Set by default to "flex", so need to override */
	flex: 1 1 auto;
	/* Set by default to 0 1 auto, so override to set grow=1 */
}

#sage-header-home	/* header - home link inserted in product title from top nav and side nav scripts (a#sage-header-home) */
{
	z-index: 2;
	/* required to make link clickable in side nav */
	text-decoration: none;
	/* remove link underline */
}

#sage-header-home:hover,
#sage-header-home:focus	/* header - home link */
{
	text-decoration: none;
	/* don't underline home link on hover */
}

#sage-header-search	/* header search box (top nav) */
{
	
}

#sage-header-logo	/* Sage logo in header */
{
	height: 24px;
	/* 24px logo height specified in DLS */
}

#sage-header-product-name	/* container for product name in header */
{
	color: #ffffff;
	font-size: 1.125em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-body-l);
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-weight: 500;
	display: inline-block;
	position: relative;
	bottom: 9px;
	/* Vertically align with logo. */
}

#sage-header-divider	/* divider between logo and product name */
{
	display: inline-block;
	height: 24px;
	/* set height to same as logo */
	position: relative;
	bottom: 3px;
	/* align with logo */
	border-left: 2px solid #262626;
	margin: 0 1em 0 1em;
}

img.sage-logo	/* Sage logo normal */
{
	height: 24px;
}

.sage-footer div.sage-logo	/* Sage logo container - old style deprecated */
{
	text-align: center;
}

/* ------------------------------------------------------------------------- PAGE SECTIONS AND BANNERS ----------------- */
/* --------------------------------------------------- sage-header (container for header, logo, search) - */

section.sage-header	/* container for header, logo, search */
{
	padding-top: 1.5em;
	padding-bottom: 0;
}

section#header-normal.sage-header	/* Used for top nav, but not side nav  */
{
	background-color: #000000;
	padding-top: 1em;
	padding-bottom: 1em;
}

/* --------------------------------------------------- sage-banner (banner areas with images) - */

section.sage-banner	/* banner areas with images  (top nav) */
{
	padding-top: 2rem;
	padding-bottom: 2rem;
}

section.sage-banner h1,
section.sage-banner h2	/* spacing for banner headings  */
{
	margin: 0 0 0.5em 0;
}

section.sage-banner-dark	/* Light text in dark banner - deprecated rebrand 2022, use colour-dark-1 instead */
{
	background-color: #000000;
	color: #ffffff;
}

section.sage-banner-dark a,
section.sage-banner-dark a:hover,
section.sage-banner-dark a:focus	/* links on dark banners - deprecated rebrand 2022, use colour-dark-1 instead */
{
	color: #ffffff;
}

/* --------------------------------------------------- #banner-home: sage-banner on home page - */

section#sage-home-banner	/* Banner on home page */
{
	min-height: 40vh;
}

#sage-home-banner-image	/* image inside banner (side nav) */
{
	background-size: contain;
	/* restrict as will be cropped */
	background-position: center center;
	background-image: url("../Images/brand/background_home.png");
	/* set background image */
	background-repeat: no-repeat;
	min-height: 32vh;
	/* minimum image height, stops container being zero height - based on banner height 40vh */
	flex: 0 1 auto;
	/* flex layout - use this inside sage-layout-container */
	width: 30%;
	/* overflow: auto; */
	/* removed as search bar menu was cropped */
	order: 2;
}

#sage-home-banner-content	/* content inside banner (side nav) */
{
	padding: 2rem 0 2rem 0;
	flex: 0 1 auto;
	/* flex layout - use this inside sage-layout-container */
	width: 65%;
	/* overflow: auto; */
	/* removed as search bar menu was cropped */
	order: 1;
}

section#banner-home .sage-logo	/* Sage logo on home page banner */
{
	width: 5em;
}

section#banner-home .search-bar-container	/* Search bar container */
{
	margin: 0 0 2em 0;
}

/* --------------------------------------------------- sage-section (sections in topics) - */

section.sage-topic-body	/* Contains topic body content, and is flex container */
{
	background-color: #ffffff;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	/* centre body in page */
	gap: 5%;
	/* Gap between columns. Take into account when setting column widths. */
}

.sage-layout-topic-main	/* Container for main topic body in flex layout. */
{
	order: 1;
	flex: 0 1 auto;
	width: 100%;
	max-width: 40rem;
	/* Max width for accessibility (approx 80 characters) */
	overflow: auto;
	/* Display scroll bar if content can't fit. */
}

.sage-layout-two-columns .sage-layout-topic-main
{
	width: 70%;
	/* Set width of topic body to 70% if using a two column layout with a side panel */
}

html.section .sage-layout-topic-main
{
	/* max-width: 100rem; */
	/* Set larger max width for topic body for a section topic, as it's a 3 column menu. */
}

.sage-layout-topic-panel	/* Container for side panel in two column flex layout. */
{
	order: 2;
	/* Position after topic-main in flex layout. */
	flex: 0 1 auto;
	width: 25%;
	/* Set width of topic body to 25% in the two column layout (70% for main, 5% gap) */
	max-width: 30rem;
	/* Max width for accessibility */
	position: sticky;
	/* Stick to page when scroll. */
	top: 2rem;
	/* Sticky offset from top of page. */
	align-self: flex-start;
}

.sage-layout-container	/* Container for content - flex container */
{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	/* centre body in page */
	gap: 5%;
	/* Gap between columns. Take into account when setting column widths. */
}

.sage-layout-wide	/* Content - home page and section topics in restricted width flex layout. */
{
	flex: 0 1 auto;
	width: 100%;
	max-width: 80rem;
	/* Double regular max width (approx 160 characters) */
	/* overflow: auto; */
	/* removed as search bar menu was cropped */
}

html.searchTopic .sage-layout-topic-panel	/* If using Flare's generated search results page (not search results proxy topic), this hides topic panel - results page has a html.searchTopic class. */
{
	display: none;
}

html.searchTopic .sage-layout-topic-main	/* If using Flare's generated search results page (not search results proxy topic), this removes width limit so can fit more pagination buttons before scroll bar is displayed. */
{
	width: auto;
	max-width: none;
}

.row.outer-row .row	/* fix bug with nested Foundation rows - overwrite left/right margins of -0.9375rem in Foundation, as causes overflow on the containing element */
{
	margin-left: 0;
	margin-right: 0;
}

@media only screen and (max-width: 1024px)
{
	.sage-layout-two-columns .sage-layout-topic-main
	{
		order: 2;
		/* display topic-main second, after topic-panel */
		width: 100%;
		/* fill width when single column */
	}

	.sage-layout-topic-panel
	{
		position: relative;
		/* not sticky */
		top: 0;
		/* remove sticky offset */
		order: 1;
		/* display panel first, before topic-main */
		width: 100%;
		/* fill width when single column */
		max-width: 40rem;
		/* set panel to same width as topic-main, for justify alignment */
	}
}

@media only screen and (max-width: 640px)
{
	.sage-layout-two-columns .sage-layout-topic-main
	{
		order: 2;
		/* display topic-main second, after topic-panel */
		width: 100%;
		/* fill width when single column */
	}

	.sage-layout-topic-panel
	{
		position: relative;
		/* not sticky */
		top: 0;
		/* remove sticky offset */
		order: 1;
		/* display panel first, before topic-main */
		width: 100%;
		/* fill width when single column */
		max-width: 40rem;
		/* set panel to same width as topic-main, for justify alignment */
	}

	#sage-home-banner-image,
	#sage-home-banner-content
	{
		width: 100%;
		/* fill width when single column */
	}
}

.sage-topnav section.sage-section	/* sections (top nav) */
{
	padding-top: 4rem;
	padding-bottom: 4rem;
}

.sage-sidenav section.sage-section	/* sections (side nav)  */
{
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.sage-tripane section.sage-section	/* sections (tripane)  */
{
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.sage-topnav.home section.sage-section	/* home page - sections (top nav) */
{
	/* font-size: 1.25em; */
	text-align: center;
}

.sage-sidenav.home section.sage-section	/* home page - sections (side nav) */
{
	text-align: center;
}

.sage-tripane.home section.sage-section	/* home page - sections (tripane) */
{
	text-align: center;
}

section.sage-topic-body section.sage-section	/* sections inside topic body */
{
	padding: 1rem;
	margin-bottom: 1rem;
}

section#sage-search.sage-section	/* home page search section */
{
	padding-top: 2rem;
	padding-bottom: 2rem;
}

#sage-search-tips	/* home page search tips */
{
	text-align: left;
	padding-top: 0.5rem;
}

/* --------------------------------------------------- sage-footer (footer section) - */

section.sage-footer,
footer.sage-footer	/* footer section  */
{
	padding-top: 4em;
	padding-bottom: 4em;
	box-shadow: 0 50vh 0 50vh #000000;
	/* add shadow to hide white space below footer on short pages */
}

section.sage-footer a,
footer.sage-footer a	/* links in footer section  */
{
	color: inherit;
}

section.sage-footer .heading2,
footer.sage-footer .heading2	/* footer headings */
{
	display: block;
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-size: 1em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h6);
	/* same as h6 */
	font-weight: 700;
	line-height: 1.25em;
	margin: 0rem 0rem 0.5rem 0rem;
	color: inherit;
}

p.heading2	/* Accessibility - add aria heading role and level 2 by script - used in footer, etc. */
{
	font-weight: 700;
	font-size: 2em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h2);
	line-height: 1.25em;
	margin: 0rem 0rem 0.5rem 0rem;
	color: inherit;
}

p.heading3	/* Accessibility - add aria heading role and level 3 by script - used in footer, etc. */
{
	font-weight: 700;
	font-size: 1.5em;
	/* CSS variable IE 11 support */
	font-size: var(--font-size-h3);
	line-height: 1.25em;
	margin: 0rem 0rem 0.5rem 0rem;
	color: inherit;
}

/* ------------------------------------------------------------------------- SEARCH RESULTS PAGE ------------------ */

#searchPane #resultList
{
	line-height: 1.5em;
	/* set line height, as cannot set this in skin file */
}

html.search-results.sage-sidenav nav.sidenav-wrapper
{
	display: none;
	/* hide sidenav menu on results page */
}

#sage-search-no-results-image	/* no search results - image and heading container */
{
	text-align: center;
}

#sage-search-no-results-image img	/* no search results - image */
{
	height: auto;
	max-height: 30vh;
}

.hint
{
	color: #737373;
	/* CSS variable IE 11 support */
	color: var(--col-yin-55);
}

/* search filter styles below */

.sage-search-filter-container
{
	display: none;
	/* Hide search filter box initially, as displayed by script */
}

.sage-search-filter-search-bar .search-bar,
.sage-search-filter-search-bar .search-bar._Skins_Sage_Search_Normal_TopNav.mc-component
{
	width: auto;
	/* reset width to normal */
	height: auto;
	/* reset height to normal */
}

.sage-search-filter-search-bar .search-filter-content
{
	max-height: 25em !important;
	/* override max height set in skins-template CSS */
}

.sage-search-filter-search-bar input.search-field
{
	display: none;
	/* hide search bar input */
}

.sage-search-filter-search-bar .search-submit-wrapper
{
	display: none;
	/* hide search submit button */
}

.sage-search-filter-search-bar span#search-filters-label.invisible-label
{
	display: none;
	/* hide invisible label for filters button (it adds white space height) */
}

.sage-search-filter-search-bar .search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter,
.sage-search-filter-search-bar .search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter,
.sage-search-filter-search-bar .search-bar .search-filter
{
	display: none;
	/* hide search filter button for filter displayed on search results page */
}

.sage-search-filter-container .sage-search-filter-search-bar .search-filter-content
{
	display: block;
	/* display filter menu content */
	position: relative;
	left: 0;
	top: 0;
	box-shadow: none;
	border: 1px solid #668494;
	/* CSS variable IE 11 support */
	border: 1px solid var(--col-action-minor-400);
	border-radius: 8px;
}

.sage-search-filter-search-bar .search-filter-content ul li
{
	padding: 0;
	/* remove padding on filter list */
}

.sage-search-filter-search-bar .selected-filter
{
	background-color: #CCD6DB;
	/* CSS variable IE 11 support */
	background-color: var(--col-action-minor-200);
}

.sage-search-filter-container #sage-search-filtered-by-label
{
	display: none;
	/* Hide filtered by label initially, as displayed by script */
	font-weight: 500;
	font-size: var(--font-size-h4);
}

.search-results #search-bar-container
{
	padding: 0.25em;
	/* add padding so can see focus */
}

.search-results #search-bar-container .search-field
{
	border: 1px solid var(--col-black-90);
	/* add border to search bar input, when displayed at top of search results page */
}

.search-results #search-bar-container .search-filter
{
	border-top: 1px solid var(--col-black-90);
	/* add border to search bar filter button, when displayed at top of search results page */
	border-bottom: 1px solid var(--col-black-90);
	/* add border to search bar filter button, when displayed at top of search results page */
}

/* ------------------------------------------------------------------------- Search box buttons - text labels ------------------ */

.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter,
.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter,
.search-bar .search-filter	/* search filter button - text label - normal state */
{
	text-align: center;
	color: var(--col-black-90);
	display: flex;
	/* flex used to centre inserted button label */
	flex-direction: column;
	justify-content: center;
}

.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter:hover,
.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter:hover,
.search-bar .search-filter:hover,
.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter.selected,
.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter.selected,
.search-bar .search-filter.selected	/* search filter button - text label - hover and selected states */
{
	color: #ffffff;
}

.sage-search-filter-label:after	/* search filter button - add icon to inserted text label */
{
	font-family: "FontAwesome";
	content: "\f0d7";
	padding: 0 0 0 0.5em;
	display: inline-block;
}

.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter-wrapper.open,
.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter-wrapper.open,
.search-bar .search-filter-wrapper.open
{
	font-weight: inherit;
	/* override bold from filter label when menu is open */
}

.search-bar.search-bar-container._Skins_Sage_Search_Normal_TopNav.mc-component .search-submit,
.search-bar.search-bar-container._Skins_Sage_Search_Large_TopNav.mc-component .search-submit,
.search-bar .search-submit	/* search submit button - text label - normal state */
{
	text-align: center;
	color: #ffffff;
	display: flex;
	/* flex used to centre inserted button label */
	flex-direction: column;
	justify-content: center;
}

.search-bar.search-bar-container._Skins_Sage_Search_Normal_TopNav.mc-component .search-submit,
.search-bar.search-bar-container._Skins_Sage_Search_Large_TopNav.mc-component .search-submit,
.search-bar.search-bar-container .search-submit,
.search-bar.search-bar-container._Skins_Sage_Search_Normal_TopNav.mc-component .search-submit:hover,
.search-bar.search-bar-container._Skins_Sage_Search_Large_TopNav.mc-component .search-submit:hover,
.search-bar.search-bar-container .search-submit:hover
{
	/* background-image: none; */
}

.sage-search-submit-label:before	/* search submit button - add icon to inserted text label */
{
	font-family: "FontAwesome";
	content: "\f002";
	padding: 0 0.5em 0 0;
	display: inline-block;
}

.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-field,
.search-bar .search-field
{
	/* placeholder to fix bug in Flare CSS causing text to overflow on filter/submit buttons - this manually overrides the right padding on search input to matach the combined width of both buttons (assume filter is present). */
	/* Example provided is for button widths of 144px. Calculated as: (button width * 2) + 5px */
	padding-right: calc((144px * 2) + 5px);
}

.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-field
{
	/* placeholder to fix bug in Flare CSS causing text to overflow on filter/submit buttons - this manually overrides the right padding on search input to matach the combined width of both buttons (assume filter is present). */
	/* Example provided is for button widths of 176px. Calculated as: (button width * 2) + 5px */
	padding-right: calc((176px * 2) + 5px);
}

.search-bar._Skins_Sage_Search_Normal_TopNav.mc-component .search-filter-wrapper > span.invisible-label,
.search-bar._Skins_Sage_Search_Large_TopNav.mc-component .search-filter-wrapper > span.invisible-label,
.search-bar .search-filter-wrapper > span.invisible-label
{
	display: none;
	/* search filter button - hide hidden accessibility label because button now has text label inserted by script */
}

.search-bar.search-bar-container._Skins_Sage_Search_Normal_TopNav.mc-component .search-submit > span.invisible-label,
.search-bar.search-bar-container._Skins_Sage_Search_Large_TopNav.mc-component .search-submit > span.invisible-label,
.search-bar .search-submit > span.invisible-label
{
	display: none;
	/* search submit button - hide hidden accessibility label because button now has text label inserted by script */
}

/* ------------------------------------------------------------------------- Go to top  ------------------ */

button	/* Set some default styles for buttons (e.g. feedback, and go to top.) */
{
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 1em;
}

.go-to-top	/* displayed using script */
{
	mc-auto-number-format: "Top";
	/* Title for go to top button - LOCALISED in localised_text.css */
	position: fixed;
	bottom: 0;
	right: 0;
	/* position for top nav */
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
	color: #ffffff;
	display: none;
	box-shadow: 0 10px 10px 0 rgba(0,20,30,0.1), 0 5px 5px 0 rgba(0,20,30,0.2);
	/* DS menu shadow - rebrand 2022 */
	border: none;
	padding: 0.5em 1em 0.5em 1em;
	/* rounded corners - radius - rebrand 2022 phase 2 */
	border-radius: 16px 16px 0 0;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

.go-to-top::before
{
	font-family: "FontAwesome";
	content: "\f0d8";
	/* Icon for go to top link */
	padding: 0 0.25em 0 0;
}

.sage-sidenav .go-to-top
{
	right: 17px;
	/* position for side nav - move in from right, as it overlaps scroll bar */
}

.go-to-top:hover,
.go-to-top:focus
{
	background-color: #006738;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1);
	text-decoration: none;
}

@media only screen and (max-width: 640px)
{
	.go-to-top
	{
		/* Hide on mobile screens */
		display: none !important;
	}
}

/* ------------------------------------------------------------------------- Dropdown and toggler close links (Removed due to accsssibility issue) ------------------ */

/* 
a.dropDownClose,
a.togglerClose
{
	font-size: 1em;
	color: #007E45; 
	color: var(--business-product);
	display: block;
	margin: 1em 0 0 0;
}

a.dropDownClose:before,
a.togglerClose:before
{
	content: "Close"; 
	display: inline-block;
}

a.dropDownClose:after,
a.togglerClose:after
{
	font-size: 1.33em;
	font-family: "FontAwesome";
	content: "\f106";
	padding: 0 0 0 0.5em;
	display: inline-block;
}

.hide-before:before,
.hide-after:after 
{
	display: none !important; 
}


[class*="colour-dark"] [class*="note"] a.dropDownClose,
[class*="colour-dark"] [class*="Box"] a.dropDownClose,
[class*="colour-dark"] [class*="note"] a.togglerClose,
[class*="colour-dark"] [class*="Box"] a.togglerClose
{
	color: #007E45 !important; 
	color: var(--business-product) !important;
}
*/

/* ------------------------------------------------------------------------- Feedback ------------------ */

.feedback-reason
{
	display: none;
}

div.feedback-option
{
	line-height: 1.5em;
	margin: 0em 0em 1em 0em;
}

.feedback-button
{
	background-color: transparent;
	display: inline-block;
	font-size: 1em;
	line-height: 1em;
	padding: 0.5em 1em 0.5em 1em;
	/* rounded corners - radius - rebrand 2022 phase 2 */
	margin: 0.5em 0.5em 0.5em 0;
	text-align: center;
	min-width: 5em;
	border-radius: 32px;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

.feedback-yes
{
	color: #008A21 !important;
	/* CSS variable IE 11 support */
	color: var(--col-semantic-positive) !important;
	border: 2px solid #008A21;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-semantic-positive);
}

.feedback-no
{
	color: #CB374A !important;
	/* CSS variable IE 11 support */
	color: var(--col-semantic-negative) !important;
	border: 2px solid #CB374A;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-semantic-negative);
}

.feedback-yes:hover
{
	background-color: #006E1A;
	/* CSS variable IE 11 support */
	background-color: var(--col-semantic-positive-hover);
	border: 2px solid #006E1A;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-semantic-positive-hover);
	color: #ffffff !important;
	text-decoration: none;
}

.feedback-no:hover
{
	background-color: #A22C3B;
	/* CSS variable IE 11 support */
	background-color: var(--col-semantic-negative-hover);
	border: 2px solid #A22C3B;
	/* CSS variable IE 11 support */
	border: 2px solid var(--col-semantic-negative-hover);
	color: #ffffff !important;
	text-decoration: none;
}

label	/* checkbox labels */
{
	font-weight: 500;
}

#feedback-survey p.heading2	/* Reduce heading size in feedback form */
{
	font-size: 1.5em;
	font-size: var(--font-size-h3);
}

#feedback-survey p.heading3	/* Reduce heading size in feedback form */
{
	font-size: 1.25em;
	font-size: var(--font-size-h4);
}

/* ------------------------------------------------------------------------- Sage search box (using form) ------------------ */

form#sage-search-form	/* KB search box - container form */
{
	box-sizing: border-box;
	margin: 8px 0 8px 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

html.home form#sage-search-form
{
	justify-content: center;
	/* center search box on home page */
}

input#sage-search-input	/* KB search box - input text box */
{
	flex: 1 0;
	box-sizing: border-box;
	border: 1px solid #668494;
	/* Same as --col-action-minor-400 (and major 300) */
	border: 1px solid var(--col-action-minor-400);
	padding: 0.5em 0.5em 0.5em 0.75em;
	margin: 0;
	font-size: 1em;
	font-family: "Sage UI", Arial, Helvetica, sans-serif;
	font-weight: 400;
	border-radius: 4px 0px 0px 4px;
	max-width: 15em;
	min-height: 2.5em;
}

form#sage-search-form label	/* display label above input */
{
	display: block;
	width: 100%;
}

button#sage-search-button	/* KB search box - search button */
{
	flex: 1 0;
	background-color: #007E45;
	/* Same as --business-product */
	background-color: var(--business-product);
	color: #ffffff;
	box-sizing: border-box;
	border: none;
	padding: 0.5em;
	margin: 0;
	cursor: pointer;
	font-size: 1em;
	border-radius: 0 4px 4px 0;
	max-width: 9em;
	min-height: 2.5em;
}

button#sage-search-button:hover
{
	background-color: #006738;
	/* Same as --business-product-hover1 */
	background-color: var(--business-product-hover1);
	color: #ffffff;
}

/* ------------------------------------------------------------------------- Breadcrumbs  ------------------ */
/* Breadcrumbs - these breadcrumb styles are added by script, to im,prove accessibility */

.sage-breadcrumbs-list
{
	list-style-type: none;
	display: flex;
	/* Set as flex container. This will  be overridden by MadCap scripts setting inline display style of none or block, so additional JS has been added to set this to flex if buttons are visible (display:block). */
	flex-direction: row;
	/* set flex items (butttons) in a row */
	flex-wrap: wrap;
	/* allow flex items (buttons) to wrap if they don't fit */
	justify-content: left;
	/* justify flex items (buttons) to left */
	margin: 0;
	padding: 0;
}

.sage-breadcrumbs-list-item
{
	flex: 0 1 auto;
	margin: 0;
	padding: 0;
	position: relative;
}

.sage-breadcrumbs-list-item::before	/* Add divider to breadcrumbs */
{
	content: " / ";
	padding: 0 0.5em;
}

.sage-breadcrumbs-list-item:first-of-type::before	/* Hide divider for first list item */
{
	display: none;
}

.sage-breadcrumbs-list span.MCBreadcrumbsDivider,
.sage-breadcrumbs-list span.MCBreadcrumbsPrefix	/* Hide generated breadcrumb prefix and dividers */
{
	display: none;
}

/* ------------------------------------------------------------------------- Cookies ------------------ */

#sage-cookie-notification
{
	display: none;
	max-width: 40rem;
	margin: auto;
}

button.major
{
	background-color: transparent;
	border: 2px solid #007E45;
	/* CSS variable IE 11 support */
	border: 2px solid var(--business-product);
	display: inline-block;
	font-size: 1em;
	line-height: 1em;
	padding: 0.5em 1em 0.5em 1em;
	/* rounded corners - radius - rebrand 2022 phase 2 */
	margin: 0.5em 0.5em 0.5em 0;
	text-align: center;
	min-width: 5em;
	border-radius: 32px;
	/* rounded corners - radius - rebrand 2022 phase 2 */
}

button.major:hover,
button.major:focus
{
	border: 2px solid #006738;
	/* CSS variable IE 11 support */
	border: 2px solid var(--business-product-hover1);
}

button.major.primary
{
	background-color: #007E45;
	/* CSS variable IE 11 support */
	background-color: var(--business-product);
	color: #ffffff;
}

button.major.primary:hover,
button.major.primary:focus
{
	background-color: #006738;
	/* CSS variable IE 11 support */
	background-color: var(--business-product-hover1);
}

/* ------------------------------------------ hide styles ---------------------- */

.go-to-top,
.sub-menu,
li.has-children,
.menu-section,
div.navigation-wrapper,
ul.navigation,
nav.menu-topic-container,
section.sage-header-bar,
section.sage-header,
nav.tab-bar,
section.sage-topic-body,
section.sage-banner,
section.sage-section,
section.sage-footer,
footer.sage-footer,
.search-bar-container,
.search-filter-content	/* hide styles from editor */
{
	mc-disabled: true;
}

#banner-intro,
#dimensions,
#pagination,
#resultList,
#sage-header-product,
#sage-header-search,
#sage-header-title,
#sage-home-title,
#searchPane,
.dropDownHead,
.dropDownHotspot,
.expandingHead
{
	mc-disabled: true;
}

/* ------------------ colours ---------------------------------- */

:root
{
	--col-logo: #00d639;
	/* Sage bright green logo colour */
	--col-black-90: rgba(0,0,0,0.9);
	/* rgba colour will be solid black in PDF */
	--col-action-minor-800: #001E2E;
	/* same as utility-major-700 (rebrand 2022) */
	--col-action-minor-700: #00283D;
	/* same as utility-major-600 (rebrand 2022) */
	--col-action-minor-600: #00324C;
	/* same as utility-major-500 (rebrand 2022) */
	/* --col-utility-major-500: #00324C; */
	/* (rebrand 2022) */
	--col-action-minor-500: #335B70;
	/* same as utility-major-400  (rebrand 2022)*/
	/* --col-utility-major-400: #335B70; */
	/* (rebrand 2022) */
	--col-action-minor-400: #668494;
	/* same as utility-major-300  (rebrand 2022)*/
	--col-action-minor-300: #99ADB7;
	/* same as utility-major-200 - close to old --col-slate-60  (rebrand 2022)*/
	--col-action-minor-200: #CCD6DB;
	/* same as utility-major-100 - same as old --col-slate-80  (rebrand 2022)*/
	--col-utility-major-75: #D9E0E4;
	/* (rebrand 2022) */
	--col-action-minor-100: #E6EBED;
	/* same as utility-major-50 - same as old --col-slate-90 (rebrand 2022) */
	--col-action-minor-50: #F2F5F6;
	/* same as utility-major-25 - same as old --col-slate-95 (rebrand 2022) */
	--col-semantic-neutral: #335B70;
	/* semantic-neutral-500 (rebrand 2022) */
	--col-semantic-positive: #008A21;
	/* semantic-positive-500 (rebrand 2022 - 2) */
	--col-semantic-positive-hover: #006E1A;
	/* semantic-positive-600 (rebrand 2022 - 2) */
	--col-semantic-caution: #EF6700;
	/* semantic-caution-500 (rebrand 2022) */
	--col-semantic-negative: #CB374A;
	/* semantic-negative-500 (rebrand 2022 - 2) */
	--col-semantic-negative-hover: #A22C3B;
	/* semantic-negative-600 (rebrand 2022 - 2) */
	--col-semantic-info: #0060A7;
	/* semantic-info-500 (rebrand 2022) */
	--col-semantic-focus: #FFBC19;
	/* semantic-focus-500 - changed in 2023 for accessibility requirements, and used with double outline (yellow outline inside black outline) */
	--business-product: #007E45;
	/* changed from 008200 - colors.action.major.500 (rebrand 2022) */
	--business-product-hover1: #006738;
	/* changed from 006300 - colors.action.major.600 (rebrand 2022) */
	--business-product-hover2: #004D2A;
	/* changed from 004500 - colors.action.major.700 (rebrand 2022) */
	--col-yin-90: #191919;
	/* equivalent to rgba(0,0,0,0.90); */
	--col-yin-85: #262626;
	/* equivalent to rgba(0,0,0,0.85); */
	--col-yin-75: #404040;
	/* equivalent to rgba(0,0,0,0.75); */
	--col-yin-65: #595959;
	/* equivalent to rgba(0,0,0,0.65); */
	--col-yin-55: #737373;
	/* equivalent to rgba(0,0,0,0.55); */
	--col-yin-30: #b2b2b2;
	/* equivalent to rgba(0,0,0,0.30); */
	--col-yin-15: #d9d9d9;
	/* equivalent to rgba(0,0,0,0.15); */
	--col-yin-10: #e5e5e5;
	/* equivalent to rgba(0,0,0,0.10); */
	--col-yin-05: #f2f2f2;
	/* equivalent to rgba(0,0,0,0.05); */
	--col-grey-700: #4D4D4D;
	/* colorsGray700 */
	--col-grey-750: #404040;
	/* colorsGray750 */
	--col-grey-850: #262626;
	/* colorsGray850  is solid version of colorsComponentsLeftnavWinterStandardBackground (rebrand 2-2023) */
	--col-grey-900: #191919;
	/* colorsGray900 */
	--col-yang-30: rgba(255,255,255,0.3);
	/* colorsYang030 equivalent to colorsComponentsLeftnavWinterStandardSelected, or #696969 solid (rebrand 2-2023) */
	--col-yang-35: rgba(255,255,255,0.35);
	/* Created specifically for nav menu selected item, as yang-30 colour fails the accessibility contrast ratio */
	--col-jade-t7: #D1FDE0;
	/* Jade T7 */
}

/* ------------------ sizes ---------------------------------- */

:root
{
	--font-size-body: 100%;
	/* 16 px base */
	--font-size-body-l: 1.125em;
	/* 18/16 px */
	--font-size-code: 1em;
	/* 16/16 px */
	--font-size-h1-xl: 3.5em;
	/* 56/16 px */
	--font-size-h1: 2.5em;
	/* 40/16 px */
	--font-size-h2: 2em;
	/* 32/16 px */
	--font-size-h3: 1.5em;
	/* 24/16 px */
	--font-size-h4: 1.25em;
	/* 20/16 px */
	--font-size-h5: 1.125em;
	/* 18/16 px */
	--font-size-h6: 1em;
	/* 16/16 px */
}

html.font-small	/* 14px base */
{
	--font-size-body: 87.5%;
	/* 14 px */
	--font-size-body-l: 1.1428em;
	/* 16 px */
	--font-size-code: 1.1428em;
	/* 16 px */
	--font-size-h1-xl: 3.5714em;
	/* 52 px /14 */
	--font-size-h1: 2.8571em;
	/* 40 px /14 */
	--font-size-h2: 2.2857em;
	/* 32 px /14 */
	--font-size-h3: 1.7142em;
	/* 24 px /14 */
	--font-size-h4: 1.4285em;
	/* 20 px /14 */
	--font-size-h5: 1.2857em;
	/* 18 px /14 */
	--font-size-h6: 1.1428em;
	/* 16 px /14 */
}

html.font-large	/* 18px base */
{
	--font-size-body: 112.5%;
	/* 18px */
	--font-size-h1-xl: 3.7777em;
	/* 68/18 - 'display 4' size */
	--font-size-h1: 2.7777em;
	/* 50/18 */
	--font-size-h2: 2.2222em;
	/* 40/18 */
	--font-size-h3: 1.7777em;
	/* 32/18 */
	--font-size-h4: 1.3333em;
	/* 24/18 */
	--font-size-h5: 1.1111em;
	/* 20/18 - increased from 18 */
	--font-size-h6: 1em;
	/* 18/18 - increased from 14 */
}