/*<meta />*/

/*===========================================================================================================================================================

Hello! If this is your first time looking at a stylesheet within the text editor view, what you are reading right now is a "comment". Comments are added throughout this stylesheet with the purpose of making the source code easier to understand, comments will not be interpreted during the compile process. Since comments are not interpreted during the compile process, feel free to add or remove any comments.

For help with MadCap Flare go to Help Ribbon > Topics Section > Open Help. Alternatively visit the Flare Online Help at help.madcapsoftware.com

If you have any questions regarding how to work with this stylesheet or template project, please contact MadCap Technical Support. 
https://www.madcapsoftware.com/support/contact-options.aspx

NOTE: Generally, this stylesheet has elements listed out in the order that they appear in the topic from top to bottom. The exception are General styles which are at the top and the stylesheet mediums which are at the bottom.

EXAMPLE: Since the search-bar is at the top of the topic page, it will be listed closer to the top of this stylesheet.

===========================================================================================================================================================*/

/*==Topic General Styles==*/

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&family=Halant:wght@300;400;500;600;700&family=Inter:wght@100;200;300;400;500&family=Joan&family=Outfit:wght@100;200;300;400;600;700;800;900&family=Rubik:wght@300;400&display=swap');

@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);

:root
{
	/* colors */
	--white: #fff;
	--black: #000;
	--blue: #007aff;
	--deep: #000743;
	--light-blue: #0fb0f4;
	--light-blue-2: #10b1f5;
	--turquoise: #39cccc;
	--grey-1: #131724;
	--grey-2: #646f79;
	--grey-3: #8d96ac;
	--grey-4: #c6d1db;
	--grey-5: #eef4fa;
	--grey-6: #41546f;
	--grey-7: #d9d9d9;
	--grey-8: #8693a5;
	--grey-9: #cce0f8;
	--grey-10: #dddddd;
	--grey-11: #EEF4FA;
	--grey-12: #a9a9a9;
	--grey-dark: #172538;
	--black-blue: #061341;
	--deep-blue: #000a59;
	--dark-blue: #03139a;
	--darker-blue: #070f52;
	--very-dark-blue: #141826;
	--very-dark-blue-2: #000743;
	--purple: #8a59ff;
	--salmon: #ff4f81;
	--pink: #ff3366;
	--pink-2: #ff2727;
	--dark-pink: #d92b57;
	--dark-pink-2: #f36;
	--dark-red: #a60830;
	--heavy-blue: #192056;
	--darkest-blue: #1b2686;
	--black-15: rgba(0, 0, 0, 0.15);
	--light-blue-2-0: rgba(16, 177, 245, 0);
	--light-blue-05: rgba(15, 176, 244, 0.05);
	--black-5: rgba(0, 0, 0, 0.5);
	--darker-blue-08: rgba(7, 15, 82, 0.08);
	--darker-blue-15: rgba(7, 15, 82, 0.15);
	--darker-blue-16: rgba(7, 15, 82, 0.16);
	--darker-blue-05: rgba(7, 15, 82, 0.05);
	--darker-blue-2: rgba(7, 15, 82, 0.2);
	--grey-2-2: rgba(100, 111, 121, 0.2);
	--darker-blue-5: rgba(7, 15, 82, 0.5);
	--grey-1-02: rgba(19, 23, 37, 0.2);
	--grey-1-025: rgba(19, 23, 37, 0.25);
	--blue-0: rgba(0, 122, 255, 0);
	--blue-15: rgba(0, 122, 255, 0.15);
	--grey-8-5: rgba(134, 147, 165, 0.5);
	--grey-8-3: rgba(134, 147, 165, 0.3);
	--grey-4-5: rgba(198, 209, 219, 0.5);
	--grey-4-0: rgba(198, 209, 219, 0);
	--white-0: rgba(255, 255, 255, 0);
	--white-1: rgba(255, 255, 255, 0.1);
	--white-3: rgba(255, 255, 255, 0.3);
	--white-4: rgba(255, 255, 255, 0.4);
	--white-5: rgba(255, 255, 255, 0.5);
	--deep-15: rgba(0, 7, 67, 0.15);
	--deep-71: rgba(0, 7, 67, 0.71);
	--grey-5-0: rgba(238, 244, 250, 0);
	--grey-5-05: rgba(238, 244, 250, 0.5);
	--deep-09: rgba(0, 7, 67, 0.09);
	--deep-0: rgba(0, 7, 67, 0);
	--light-blue-3-2: rgba(74, 194, 255, 0.2);
	--light-blue-3-5: rgba(74, 194, 255, 0.5);
	--turquoise-1-05: rgba(57, 204, 204, 0.5);
	--note-blue: #6bb1e0;
	--tip-yellow: #f1b37e;
	--important-red: #ff6666;
	--warning-red: #d58181;
	--message-box-grey: #cccccc24;
	/* fonts */
	--h1-font-size: 68px;
	--h2-font-size: 50px;
	--h3-font-size: 42px;
	--h4-font-size: 34px;
	--h5-font-size: 26px;
	--h6-font-size: 22px;
	--h1-mobile-font-size: 38px;
	--h2-mobile-font-size: 30px;
	--h3-mobile-font-size: 28px;
	--h4-mobile-font-size: 25px;
	--h5-mobile-font-size: 20px;
	--h6-mobile-font-size: 18px;
	--footer-banner-heading-font-size: 58px;
	--body-font-size: 1rem;
	--fourteen-font-size: 14px;
	--twelve-font-size: 12px;
	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-bold: 700;
	--font-family-base: "DM Sans", sans-serif;
}

body
{
	margin: 0;
	font-family: var(--font-family-base);
	font-size: var(--body-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 1.5;
	color: var(--grey-1);
	text-align: left;
	background-color: var(--white);
}

h1
{
	margin-top: 30px;
	margin-bottom: 8px;
	padding-bottom: 10px;
	font-size: var(--h1-font-size);
	font-weight: var(--font-weight-bold);
	letter-spacing: -0.05em;
	line-height: 82px;
}

h2
{
	margin-bottom: 4px;
	margin-top: 20px;
	font-size: var(--h2-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 65px;
}

h3
{
	margin-bottom: 4px;
	margin-top: 16px;
	font-size: var(--h3-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 55px;
}

h4
{
	font-size: var(--h4-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 44px;
}

h5
{
	font-size: var(--h5-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 34px;
}

h6
{
	font-size: var(--h6-font-size);
	font-weight: var(--font-weight-normal);
	line-height: 29px;
}

@media only screen and (max-width: 767px)
{
	h1
	{
		font-size: var(--h1-mobile-font-size);
		letter-spacing: -0.02em;
		line-height: 38px;
	}

	h2
	{
		font-size: var(--h2-mobile-font-size);
		line-height: 39px;
	}

	h3
	{
		font-size: var(--h3-mobile-font-size);
		line-height: 36px;
	}

	h4
	{
		font-size: var(--h4-mobile-font-size);
		line-height: 33px;
	}

	h5
	{
		font-size: var(--h5-mobile-font-size);
		line-height: 26px;
	}

	h6
	{
		font-size: var(--h6-mobile-font-size);
		line-height: 23px;
	}
}

/* All pages top nav search remove */

.title-bar-layout .nav-search-wrapper
{
	display: none;
}

/* CTA buttons */

div.button-primary
{
	position: relative;
	display: inline-block;
	margin: 20px 0;
	padding: 15px 30px;
	transition: all 0.2s ease-in-out;
	border-radius: 6px;
	font-weight: var(--font-weight-bold);
	font-size: var(--fourteen-font-size);
	line-height: 18px;
	letter-spacing: normal;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	background-color: var(--pink);
	color: var(--white);
}

div.button-primary::after
{
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 17px;
	background-image: url('../images/assets/icons/arrows/primary-btn-arrow.png');
	background-repeat: no-repeat;
	-webkit-transition: -webkit-transform 0.2s ease-in-out;
	transition: -webkit-transform 0.2s ease-in-out;
	transition: transform 0.2s ease-in-out;
	transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}

div.button-primary:hover,
div.button-primary:active,
div.button-primary :not(:disabled):not(.disabled):active,
div.button-primary :not(:disabled):not(.disabled):active:focus
{
	background: linear-gradient(0deg, var(--black-15), var(--black-15)), var(--pink);
	color: var(--white);
	opacity: 1;
}

div.button-primary:hover::after,
div.button-primary:active::after,
div.button-primary :not(:disabled):not(.disabled):active::after,
div.button-primary :not(:disabled):not(.disabled):active:focus::after
{
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* button secondary */

div.button-secondary
{
	position: relative;
	display: inline-block;
	margin: 20px 0;
	padding: 15px 30px;
	transition: all 0.2s ease-in-out;
	border-radius: 6px;
	font-weight: var(--font-weight-bold);
	font-size: var(--fourteen-font-size);
	line-height: 18px;
	letter-spacing: normal;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
	background-color: var(--white);
	color: var(--pink);
	border: 1px solid var(--grey-4);
}

div.button-secondary:hover,
div.button-secondary:active,
div.button-secondary :not(:disabled):not(.disabled):active,
div.button-secondary :not(:disabled):not(.disabled):active:focus
{
	border-color: var(--dark-pink-2);
	background: -webkit-linear-gradient(bottom, rgba(0,0,0,0.15), rgba(0,0,0,0.15)), var(--dark-pink-2);
	background: linear-gradient(0deg, rgba(0,0,0,0.15), rgba(0,0,0,0.15)), var(--dark-pink-2);
	color: var(--white);
}

a
{
	color: var(--pink);
	text-decoration: none;
	transition: all 0.1s ease-in-out;
}

a:hover
{
	color: var(--pink);
	text-decoration: underline;
}

.main-section ul,
.main-section ol
{
	margin: 29px 0 16px 0;
}

.main-section ol li
{
	margin-top: 29px;
}

.main-section ul
{
	padding: 0;
	list-style: none;
}

.main-section ul > li
{
	position: relative;
	padding-left: 27px;
}

.main-section ul > li::before
{
	content: "";
	position: absolute;
	display: block;
	top: 12px;
	left: 12px;
	width: 3px;
	height: 3px;
	border: 2px solid;
	border-color: inherit;
	border-radius: 100%;
}

p
{
	margin-bottom: 8px;
	margin-top: 8px;
}

img	/*Setting max-width: 100%; property makes images always fit the width of the container*/
{
	max-width: 100%;
}

img.thumbnail
{
	mc-thumbnail: popup;
}

.center
{
	position: relative;
	margin-right: auto;
	margin-left: auto;
	float: none !important;
	text-align: center;
}

/* Breadcrumb */

a.MCBreadcrumbsLink
{
	font-style: italic;
	text-decoration: underline;
	font-weight: var(--font-weight-bold);
}

a.MCBreadcrumbsLink:visited
{
	color: var(--grey-1);
}

a.MCBreadcrumbsLink:hover
{
	color: var(--pink);
}

MadCap|breadcrumbsProxy
{
	border-bottom: none;
	font-size: .7em;
	font-style: italic;
	mc-breadcrumbs-prefix: 'You are here: ';
}

/* Print and navigate buttons */

._Skins_Topic_Toolbar_Bottom.mc-component .button.print-button .button-icon,
._Skins_TopicToolbar.mc-component .button.print-button .button-icon
{
	background-image: url('../images/assets/icons/mainicons/print.svg');
}

._Skins_TopicToolbar.mc-component .button.previous-topic-button .button-icon,
._Skins_Topic_Toolbar_Bottom.mc-component .button.previous-topic-button .button-icon
{
	background-image: url('../images/assets/icons/mainicons/inner-arrow-left.svg');
}

._Skins_TopicToolbar.mc-component .button.next-topic-button .button-icon,
._Skins_Topic_Toolbar_Bottom.mc-component .button.next-topic-button .button-icon
{
	background-image: url('../images/assets/icons/mainicons/inner-arrow-right.svg');
}

._Skins_Topic_Toolbar_Bottom.mc-component .button.print-button,
._Skins_TopicToolbar.mc-component .button.print-button,
._Skins_TopicToolbar.mc-component .button.previous-topic-button,
._Skins_TopicToolbar.mc-component .button.next-topic-button,
._Skins_Topic_Toolbar_Bottom.mc-component .button.previous-topic-button,
._Skins_Topic_Toolbar_Bottom.mc-component .button.next-topic-button
{
	background: transparent;
	border: none;
}

MadCap|xref
{
	color: #2D8DCC;
	font-weight: bold;
	mc-format: '{para}';
	text-decoration: underline;
}

MadCap|xref:hover
{
	color: #7469b9;
}

MadCap|dropDownHotspot
{
	color: #7469b9;
}

MadCap|dropDownBody
{
	border-bottom: 1px solid #d3d3d3;
}

MadCap|dropDown	/*Change the "mc-open-image" and "mc-closed-image" properties to change the icons used in drop-downs*/
{
	mc-open-image: url('../images/assets/icons/arrows/arrow-down-gray.png');
	mc-closed-image: url('../images/assets/icons/arrows/arrow-right-gray.png');
}

/*==Master Page Topic Layout==*/

nav.title-bar
{
	background-color: var(--very-dark-blue-2);
	border-bottom: 1px solid var(--very-dark-blue-2);
}

nav.title-bar .outer-row
{
	max-width: 96%;
}

.off-canvas-wrapper-inner nav.title-bar .outer-row
{
	padding: 0;
}

ul.navigation li > a
{
	font-family: var(--font-family-base);
	font-size: var(--fourteen-font-size);
	color: var(--white);
}

ul.navigation li > a:hover,
ul.navigation .sub-menu li > a:hover
{
	color: var(--dark-pink-2);
}

ul.navigation li.is-expanded > a
{
	color: var(--dark-pink-2);
}

ul.navigation > li.has-children:after
{
	width: 40px;
	height: 10px;
	margin-left: -21px;
	background-image: url('../images/assets/icons/arrows/submenu-type-one.png');
	background-position: center;
	background-repeat: no-repeat;
	border: none;
}

ul.navigation > li > .sub-menu
{
	right: 50% !important;
	left: initial !important;
	transform: translateX(50%) !important;
}

ul.navigation ul ul.openRight
{
	left: 106%;
}

ul.navigation > li > .sub-menu li .sub-menu
{
	box-shadow: none;
}

ul.navigation .sub-menu
{
	padding: 20px;
	background: var(--white);
	box-shadow: 0 25px 50px rgba(7, 15, 82, 0.15);
	border-radius: 20px;
}

ul.navigation .sub-menu a
{
	color: var(--grey-1);
}

ul.navigation li > .sub-menu > li.is-expanded > a
{
	color: var(--dark-pink-2);
}

ul.navigation > .TOCGridMenuItem > .sub-menu
{
	min-width: 300px;
}

ul.navigation > .TOCGridMenuItem > .sub-menu > li
{
	padding: 0;
}

ul.navigation > .TOCGridMenuItem a
{
	padding-right: 30px;
}

ul.navigation > .TOCGridMenuItem > .sub-menu > li li
{
	padding-right: 0;
}

ul.navigation .TOCGridMenuItem > .sub-menu li .sub-menu
{
	opacity: 1;
	visibility: visible;
	position: relative;
	overflow: hidden;
	left: inherit;
	max-height: 0;
	margin-left: 0;
	padding: 0;
	-webkit-transition: max-height 0.35s ease-in;
	-o-transition: max-height 0.35s ease-in;
	transition: max-height 0.35s ease-in;
}

ul.navigation .TOCGridMenuItem > .sub-menu li:hover > .sub-menu
{
	max-height: 3000px;
	-webkit-transition: max-height 0.35s ease-in;
	-o-transition: max-height 0.35s ease-in;
	transition: max-height 0.35s ease-in;
}

ul.navigation .TOCGridMenuItem ul > li.has-children > a:after
{
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	right: 4px;
	background-image: url('../images/assets/icons/mainicons/menu_plus.png');
	background-repeat: no-repeat;
}

ul.navigation .TOCGridMenuItem ul > li.has-children.is-expanded > a:after
{
	background-image: url('../images/assets/icons/mainicons/menu_plus_hover.png');
}

div.top-bar	/*Contains the breadcrumbs and toolbar*/
{
	border-bottom: 1px solid #d3d3d3;
	min-height: 50px;
	/*Min-height is necessary for topics that are not included in a TOC*/
}

div.search-container
{
	padding-bottom: 20px;
}

.search-bar.search-bar-container._Skins_SearchTopics.mc-component .search-submit:hover,
.search-bar.search-bar-container._Skins_SearchTopics.mc-component .search-submit
{
	background-color: transparent;
}

.search-bar._Skins_SearchTopics.mc-component .search-field
{
	padding-left: 25px;
}

.search-bar._Skins_SearchTopics.mc-component .search-field:focus,
.search-bar._Skins_SearchTopics.mc-component .search-field:focus-visible
{
	outline: none;
}

#resultList h3.title a
{
	font-size: var(--h6-mobile-font-size) !important;
	font-weight: var(--font-weight-bold) !important;
	color: var(--pink) !important;
}

#resultList h3.title a:visited
{
	color: var(--grey-1) !important;
}

.dropDownHotspot,
#pagination a,
#resultList h3.title a:hover
{
	color: var(--pink) !important;
}

#resultList li::before
{
	display: none;
}

#resultList .url cite
{
	color: var(--grey-12) !important;
}

/*==Elements for the left side of Master Page layout==*/

div.side-menu	/*This is the div that the menu proxy is contained in*/
{
	padding-left: 10px;
	margin-top: 15px;
}

div.side-content	/*This is the div for the side-content containing "Search Tips" and the "Contact Support" button*/
{
	padding-top: 10px;
}

MadCap|dropDownHead.side-content	/*Font properties for the "Search Tips" drop-down head */
{
	font-size: 1.1em;
	font-weight: bold;
}

div.side-nav-container div.button-secondary
{
	padding: 6px 30px;
}

ul.menu._Skins_SideMenu.mc-component li > a
{
	font-family: var(--font-family-base);
	line-height: normal;
	color: var(--grey-1);
}

ul.menu._Skins_SideMenu.mc-component > li > a
{
	margin-bottom: 10px;
}

div.side-menu > ul > li
{
	margin-bottom: 10px;
	font-size: var(--h6-mobile-font-size);
}

div.side-menu > ul > li::before
{
	display: none;
}

div.side-menu > ul > li > ul > li:before
{
	left: 1px;
	width: 6px;
	height: 6px;
	border: none;
	background-color: var(--grey-2);
}

ul.menu._Skins_SideMenu.mc-component ul ul > li > a
{
	padding-left: 20px;
	margin: 5px 0;
}

div.side-menu > ul > li > ul > li > ul li::before
{
	display: none;
}

div.side-menu ul > li
{
	padding: 0;
}

ul.menu._Skins_SideMenu.mc-component li a:hover,
ul.menu._Skins_SideMenu.mc-component li > a.selected:hover,
ul.menu._Skins_SideMenu.mc-component li > a.selected
{
	color: var(--pink);
}

/* Dropdown link */

.dropDownHotspot:link
{
	color: var(--pink);
}

div.cta	/*Call to action button/Contact Support button*/
{
	-moz-border-radius: 60px;
	-webkit-border-radius: 60px;
	border-radius: 60px;
	padding: 2px 0px;
	border: 1px solid #7469b9;
	width: 162px;
	color: #7469b9;
	transition: all 0.5s cubic-bezier(.25,.8,.25,1);
	margin-top: 20px;
}

div.cta:hover	/*When hovering over the CTA button the following properties will apply*/
{
	box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
	transform: scale(1.01);
}

a.cta:link
{
	color: #FFF;
	text-decoration: none;
}

a.cta:visited
{
	color: #FFF;
	text-decoration: none;
}

div.topic-layout	/*This layout was created using the Responsive Layout Editor in MadCap Flare. Go to: Home Ribbon > Styles Section > Responsive Layout*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
}

div.topic-layout::before
{
	content: ' ';
	display: table;
}

div.topic-layout::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.topic-layout > div
{
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Footer */

div.footer
{
	padding: 40px 0 80px;
}

div.footer a	/*Complex Selector: Any anchor (links) tags that are within div.footer will have the following properties */
{
	text-decoration: none;
	color: #DADADA;
}

div.footer > div.outer-row
{
	line-height: 30px;
	padding: 0;
}

div.home-master-page-footer	/*This layout was created using the Responsive Layout Editor in MadCap Flare. Go to: Home Ribbon > Styles Section > Responsive Layout*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
	width: 66%;
}

div.home-master-page-footer::before
{
	content: ' ';
	display: table;
}

div.home-master-page-footer::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.home-master-page-footer > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-left: 0px;
	padding-right: 0px;
}

div.home-master-page-footer > div:nth-child(1)
{
	width: 25%;
	margin-left: 0%;
}

div.home-master-page-footer > div:nth-child(2)
{
	width: 16.667%;
	margin-left: 0%;
}

div.home-master-page-footer > div:nth-child(3)
{
	width: 16.667%;
	margin-left: 0%;
}

div.home-master-page-footer > div:nth-child(4)
{
	width: 16.667%;
	margin-left: 0%;
}

div.footer
{
	background-color: var(--deep);
}

div.footer p
{
	color: var(--grey-4);
}

div.footer-rights
{
	margin-left: auto;
	margin-right: auto;
	width: 66%;
}

div.footer-menu:not(:last-of-type)
{
	margin-right: 30px;
}

div.footer-menu ul.menu._Skins_FooterMenu.mc-component
{
	width: auto;
	background-color: transparent;
}

div.footer-menu ul.menu._Skins_FooterMenu.mc-component a
{
	opacity: 0.7;
	display: inline-block;
	padding: 0;
	margin: 4px 0;
	font-size: var(--twelve-font-size);
	letter-spacing: 0.04em;
	line-height: 19px;
	color: var(--white);
}

div.footer-menu ul.menu._Skins_FooterMenu.mc-component .has-children
{
	margin-bottom: 24px;
}

div.footer-menu ul.menu._Skins_FooterMenu.mc-component .has-children > a
{
	opacity: 1;
	margin-bottom: 12px;
	font-size: var(--fourteen-font-size);
	font-weight: var(--font-weight-bold);
	letter-spacing: 0.02em;
	line-height: 18px;
}

div.footer-menu ul.menu._Skins_FooterMenu.mc-component li > a:hover
{
	background-color: transparent;
	color: var(--dark-pink-2);
}

div.footer-description
{
	margin-right: 18%;
}

div.footer-description p
{
	font-size: var(--fourteen-font-size);
	letter-spacing: 0.03em;
	line-height: 25px;
}

div.footer-description img
{
	margin-bottom: 16px;
}

div.footer-description p
{
	max-width: 250px;
}

div.footer-description table
{
	width: 56% !important;
	margin-top: 31px;
}

div.footer-description table p
{
	max-width: inherit;
}

div.footer-description table img
{
	opacity: 0.5;
	margin: 0;
}

div.footer-description table a:hover img
{
	opacity: 1;
}

div.footer-menu ul li
{
	padding: 0;
}

div.footer-menu ul li::before
{
	display: none;
}

div.footer-rights
{
	margin-top: 100px;
}

div.footer-rights p
{
	opacity: 0.5;
	color: var(--grey-4);
	font-size: var(--twelve-font-size);
	letter-spacing: 0.04em;
	line-height: 18px;
}

/* Other page template specific styles*/

div.document-content
{
	width: 90%;
	margin: auto;
}

div.document-content h1
{
	font-size: var(--h1-mobile-font-size);
	letter-spacing: -0.02em;
	line-height: 38px;
}

div.document-content h2
{
	font-size: var(--h2-mobile-font-size);
	line-height: 39px;
}

div.document-content h3
{
	font-size: var(--h3-mobile-font-size);
	line-height: 36px;
}

div.document-content h4
{
	font-size: var(--h4-mobile-font-size);
	line-height: 33px;
}

div.document-content h5
{
	font-size: var(--h5-mobile-font-size);
	line-height: 26px;
}

div.document-content h6
{
	font-size: var(--h6-mobile-font-size);
	line-height: 23px;
}

div.document-content img
{
	margin: 10px 0;
}

div.document-content table
{
	margin: 22px 0;
}

div.document-content table thead tr th
{
	border-right-width: 2px;
	border-right-color: var(--white);
	border-right-style: solid;
	color: var(--white);
	background-color: var(--darker-blue);
	padding: 10px;
	border-bottom-width: 1px;
	border-bottom-color: var(--white);
	border-bottom-style: solid;
}

div.document-content table
{
	border-collapse: collapse;
}

div.document-content table tbody tr td
{
	vertical-align: top;
	padding: 10px;
	border-bottom-width: 2px;
	border-bottom-color: var(--white);
	border-bottom-style: solid;
	border-right-width: 2px;
	border-right-color: var(--white);
	border-right-style: solid;
}

div.document-content table tbody tr:nth-of-type(2n) td
{
	background-color: var(--grey-5);
}

div.document-content table tbody tr:nth-of-type(2n+1) td
{
	background-color: var(--white);
}

div.document-content table a
{
	color: var(--grey-1);
}

div.document-content table a:hover
{
	color: var(--pink);
}

/* Message boxes */

div.document-content p.note,
div.document-content p.warning,
div.document-content p.tip,
div.document-content p.important
{
	position: relative;
	padding: 20px 20px 20px 40px;
	background: var(--message-box-grey);
}

div.document-content p.note
{
	border-left: 4px solid var(--note-blue);
}

div.document-content p.warning
{
	border-left: 4px solid var(--warning-red);
}

div.document-content p.tip
{
	border-left: 4px solid var(--tip-yellow);
}

div.document-content p.important
{
	border-left: 4px solid var(--important-red);
}

div.document-content p.note::before,
div.document-content p.warning::before,
div.document-content p.tip::before,
div.document-content p.important::before
{
	content: "";
	position: absolute;
	display: block;
	width: 30px;
	height: 30px;
	top: 50%;
	left: -17px;
	background-position: center;
	background-repeat: no-repeat;
	transform: translateY(-50%);
}

div.document-content p.note::before
{
	background-image: url('../images/assets/icons/mainicons/message-tick.png');
}

div.document-content p.warning::before
{
	background-image: url('../images/assets/icons/mainicons/message-warning.png');
}

div.document-content p.tip::before
{
	background-image: url('../images/assets/icons/mainicons/message-tip.png');
}

div.document-content p.important::before
{
	background-image: url('../images/assets/icons/mainicons/message-important-icon.png');
}

/* Side navigation */

.sidenav-layout .sidenav-wrapper
{
	background: var(--grey-5);
}

ul.sidenav li a
{
	margin-left: 0 !important;
	color: var(--grey-1);
	border-bottom: solid 1px var(--grey-4);
	font-family: var(--font-family-base);
}

.sidenav-layout .sidenav-container ul li
{
	padding-left: 20px;
}

.sidenav-layout .sidenav-container > ul > li > .is-accordion-submenu > li
{
	padding-left: 0;
}

.sidenav-layout .sidenav-container > ul > li > .is-accordion-submenu > li > a
{
	margin-left: 0;
}

.sidenav-layout .sidenav-container ul > li::before
{
	display: none;
}

.sidenav-layout ul.sidenav li a:hover
{
	background-color: transparent;
}

.sidenav-layout ul.sidenav li a:hover,
.sidenav-layout ul.sidenav li a.selected
{
	color: var(--pink);
}

#mc-main-content
{
	margin-bottom: 85px;
}

/* logo changes */

.title-bar-layout .logo-wrapper
{
	min-height: 40px;
}

.title-bar-layout a.logo
{
	width: 168px;
	height: 36px;
	background-size: 168px 36px;
}

.search-bar.search-bar-container._Skins_SearchTopics.mc-component .search-submit
{
	background-image: url('../images/assets/icons/mainicons/search.svg');
}

/*===========================================================================================================================================================
Styles after this point are styles that are for specific mediums. If any additional styles are added to this template they will be listed after mediums.
[@media tablet] declares styles that will apply when the screen is in tablet view
[@media mobile] declares styles that will apply when the screen is in mobile view
===========================================================================================================================================================*/

@media only screen and (max-width: 1279px)
{
	aside.off-canvas
	{
		background-color: var(--grey-5);
	}

	ul.off-canvas-list li a
	{
		border-bottom: none;
		color: var(--grey-1);
	}

	ul.off-canvas-list > li > a
	{
		border-bottom: solid 1px var(--grey-4);
	}

	ul.off-canvas-list li a:hover
	{
		background: transparent !important;
		color: var(--pink);
	}

	ul.off-canvas-list li a.selected
	{
		color: var(--pink);
	}

	div.document-content
	{
		width: 98%;
		margin-left: 2%;
	}

	nav.title-bar .outer-row
	{
		max-width: 92%;
	}

	div.footer
	{
		padding-top: 10px;
	}

	div.footer-description
	{
		margin-right: 16%;
	}

	div.footer-rights,
	div.home-master-page-footer
	{
		width: 92%;
	}

	div.home-master-page-footer > div:nth-child(1)
	{
		width: 25%;
		margin-left: 0%;
	}

	div.home-master-page-footer > div:nth-child(2)
	{
		width: 16.667%;
		margin-left: 0%;
	}

	div.home-master-page-footer > div:nth-child(3)
	{
		width: 16.667%;
		margin-left: 0%;
	}

	div.home-master-page-footer > div:nth-child(4)
	{
		width: 16.667%;
		margin-left: 0%;
	}

	.menu-icon-container
	{
		min-height: 40px;
	}

	nav.title-bar .menu-icon
	{
		right: -2%;
		width: 48px;
		margin-left: auto;
	}
}

@media only screen and (max-width: 767px)
{
	div.top-bar
	{
		min-height: 0;
	}

	nav.title-bar .outer-row
	{
		max-width: 82%;
	}

	div.document-content
	{
		width: 98%;
		margin-left: 2%;
	}

	div.footer
	{
		padding: 10px 0 60px 0;
	}

	div.footer-rights,
	div.home-master-page-footer
	{
		width: 82%;
	}

	div.home-master-page-footer > div:nth-child(1)
	{
		width: 100%;
	}

	div.home-master-page-footer > div:nth-child(2)
	{
		width: 100%;
	}

	div.home-master-page-footer > div:nth-child(3)
	{
		width: 100%;
	}

	div.home-master-page-footer > div:nth-child(4)
	{
		width: 100%;
	}

	div.footer-menu > ul,
	div.footer-description
	{
		border-bottom: 1px solid #d3d3d3;
	}

	div.footer-menu > p
	{
		display: none;
	}

	div.footer-menu ul.menu._Skins_FooterMenu.mc-component .has-children
	{
		margin: 0;
	}

	ul.menu._Skins_FooterMenu.mc-component
	{
		padding: 20px 10px;
	}

	div.footer-menu ul.menu._Skins_FooterMenu.mc-component a
	{
		font-size: var(--fourteen-font-size);
		letter-spacing: 0.02em;
		line-height: 1;
	}

	div.footer-description
	{
		text-align: center;
	}

	div.footer-description
	{
		margin: 30px 0 0;
	}

	div.footer-description p
	{
		margin: auto;
	}

	div.footer-description img
	{
		margin: 0 auto 23px;
	}

	div.footer-description table
	{
		width: 31% !important;
		margin: 55px auto 49px;
	}

	div.footer-rights
	{
		margin: 30px auto;
	}

	#mc-main-content
	{
		margin-bottom: 50px;
	}
}

