/*<meta conditions="globalCond.MigrationGlobal" />*/

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

/******************************************************************
CSS variables - when working, need to apply as attrib where used
  
******************************************************************* 

NOTE:  mc-auto-numbers with color must be updated manually with hex code - warning callout text color*/

:root
{
	/* Print colors */
	--TitleGuideType-print-color: #6100DC;
	--TitleGuideType2-print-color: #000000;
	--TitleProduct-print-color: #333333;
	--TitleRevision-print-color: #65666A;
}

/*==Master Page Topic Layout for Online==*/
/*Div used to create padding around the body proxy used in the standard master page. */

div.TitleTop
{
	text-align: center;
	background-color: #F2F6FA;
}

div.HomePg_sidenav_content
{
	background-color: #F2F6FA;
	/* was #fff; */
	margin: 1em;
	padding: 1em 16em;
	/* was 1em;*/
}

div.HomePg_integrations
{
	background-color: #fff;
	margin: 1em;
	padding: 1em;
}

div.HomePgSpacer	/* Creates space between homePg_sidenav_content and flexboxes - separate due to color change */
{
	margin-top: 64px;
}

/* hides searchbar in top menu bar on homepage */

div.nav-search
{
	display: none !important;
}

div.footer
{
	display: flex;
	width: 100%;
	padding: 10px 56px;
	justify-content: space-between;
	align-items: center;
	background: #F2F6FA;
	flex-shrink: 0;
}

/*================================== */

html	/* was both html & body */
{
	height: 100%;
	/* spans entire viewport */
	margin: 0;
	/* removes default margin */
	display: flex;
	flex-direction: column;
	/* Arranges header, content, and footer in a column */
}

ul.navigation ul	/* Adds border box to top nav dropdown */
{
	border: 1px solid #bfc0c2;
}

/* Pre-footer body */

body
{
	background-color: #F2F6FA;
	font-size: 12pt;
	font-family: Lato, 'Gotham Book', 'Segoe UI', Calibri, Verdana, 'Times New Roman', 'Times New Roman Baltic';
}

/* footer styling from Matt*/

.footer
{
	display: flex;
	width: 100%;
	padding: 10px 56px;
	justify-content: space-between;
	align-items: center;
	background: #F2F6FA;
	/* should add this as a default background if we get the blue background working in all */
	flex-shrink: 0;
	/* prevent footer from shrinking */
}

p.HomeTitle	/*Used for subheadings on homepage.  */
{
	/*	margin-top: 32px;  have to figure out what is doc top, what is page top */
	text-align: center;
	font-size: 32px;
	color: #292E35;
	font-weight: bold;
	page-break-after: avoid;
}

p.HomePgSrch	/* Used for intro to search bar on homepage. */
{
	text-align: center;
	margin-top: 4px;
	font-size: 24px;
	font-weight: bold;
	color: #292E35;
	page-break-after: avoid;
}

p.LastUpdated	/* Used for last updated on homepage. */
{
	text-align: center;
	margin-top: 16px;
	margin-bottom: 64px;
	font-size: 16px;
	color: #292E35;
	page-break-after: avoid;
}

p.whatsnewflex p.trendingflex p.personaflex
{
	display: none;
	height: 0;
}

/*======================================================
Code for creating Flexbox tiles not based on menu proxy
========================================================*/

div.FlexContainer
{
	display: flex;
	/* Activates Flexbox Layout */
	/* 	flex-wrap: wrap; Child divs wrap within container */
	flex-flow: row wrap;
	width: 100%;
}

div.FlexContainer > div	/* Applies to divs within FlexContainer */
{
	flex-basis: 16em;
	/* Min width of items in container */
	flex-grow: 1;
	/* Child divs grow to fill avail. width within container */
	flex-direction: column;
	height: 400px;
	overflow-y: auto;
	margin: 1em;
	padding: 1em;
	/* box-shadow: 0 5px 10px rgba(0,0,0,0.25); */
	/* border: solid 1px; */
	background-color: #fff;
	transition: all 0.3s;
}

/* div.FlexContainer > div:hover	/* Applies to divs within FlexContainer on mouseover -readd end comment tag here if re-enabling hover properties
{
	box-shadow: 0 1px 24px rgba(0,0,0,0.5);
	background-color: #7EDDD3; 
}
*/

div.FlexContainer > div > a
{
	display: block;
	padding: 1em;
	color: inherit;
}

MadCap|breadcrumbsProxy
{
	border-bottom-width: 0;
	color: #888888;
}

a:link
{
	color: #076685;
}

a:visited
{
	color: #7D55C7;
}

a:hover
{
	color: #076685;
}

a:active
{
	color: #a82384;
}

a.home-button
{
	display: block;
	padding: 10px;
	text-decoration: none;
	width: 100%;
}

MadCap|dropDownBody	/* May want to merge these drop-down entries with symplr.css */
{
	padding: 10px 30px 0;
}

MadCap|dropDown
{
	border-bottom: 1px solid #dadada;
	mc-image-position: left;
	mc-image-spacing: 10px;
	padding: 10px 0;
	mc-closed-image: url('../Images/icons/dropDownClosed.png');
	mc-open-image: url('../Images/icons/dropDownOpen.png');
}

p.HomePg-head2	/* Same as p.head2 without the top margin */
{
	font-size: 13pt;
	color: #0f3049;
	font-weight: bold;
	page-break-after: avoid;
}

p.HomePg-head2-centered	/* Same as p.head2 without the top margin */
{
	font-size: 13pt;
	color: #0f3049;
	font-weight: bold;
	text-align: center;
	page-break-after: avoid;
}

p.HomePg-head2-fancy	/* Same as p.head2 without the top margin */
{
	font-size: 13pt;
	color: #0f3049;
	font-weight: bold;
	page-break-after: avoid;
	border-bottom: solid 2px #000000;
	background-color: #ffe4c4;
	font-style: italic;
}

div.knowledgeProxyLayout1	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
}

div.knowledgeProxyLayout1::before
{
	content: ' ';
	display: table;
}

div.knowledgeProxyLayout1::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.knowledgeProxyLayout1 > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.knowledgeProxyLayout1 > div:nth-child(1)
{
	width: 16.667%;
	margin-left: 0%;
}

div.knowledgeProxyLayout1 > div:nth-child(2)
{
	width: 83.333%;
	margin-left: 0%;
}

div.SearchBarHomePg	/*This is a custom responsive layout row style (div class) in your stylesheet. To provide your own description for this style: (1) Open the stylesheet; (2) Find and select the div class with this name; and (3) In the Comment field, replace this text with your own. For more information on adding comments to styles, see the online Help.*/
{
	mc-grid-row: true;
	margin-left: auto;
	margin-right: auto;
}

div.SearchBarHomePg::before
{
	content: ' ';
	display: table;
}

div.SearchBarHomePg::after
{
	content: ' ';
	display: table;
	clear: both;
}

div.SearchBarHomePg > div
{
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

div.SearchBarHomePg > div:nth-child(1)
{
	width: 20%;
	margin-left: 0%;
}

div.SearchBarHomePg > div:nth-child(2)
{
	width: 60%;
	margin-left: 0%;
}

div.SearchBarHomePg > div:nth-child(3)
{
	width: 20%;
	margin-left: 0%;
}

@media print
{
	body
	{
		background-color: #ffffff;
		font-family: Lato, "Gotham Book", "Segoe UI", Calibri, Verdana, "Times New Roman", "Times New Roman Baltic";
		font-size: 11pt;
	}

	p.TitleGuideType	/*Use variant with this style for first line of printed title.*/
	{
		color: #6100DC;
		font-size: 30pt;
		font-weight: bold;
	}

	p.TitleGuideType2	/*Use variant with this style for first line of printed title.*/
	{
		color: #000000;
		font-size: 26pt;
		font-weight: bold;
	}

	p.TitleProduct	/*Use variant with this style for 2nd line of printed title.*/
	{
		color: #333333;
		font-size: 16pt;
	}

	p.TitleRevision	/*Use variant with this style for 3rd line of printed title. - this is actually Version - need to fix*/
	{
		color: #65666A;
	}
}

@media only screen and (max-width: 1279px)
{
	div.HomePg_sidenav_content
	{
		background-color: #F2F6FA;
		/* was #fff; */
		margin: 1em;
		padding: 1em;
	}

	div.knowledgeProxyLayout1 > div:nth-child(1)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.knowledgeProxyLayout1 > div:nth-child(2)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(1)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(2)
	{
		width: 33.33333%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(3)
	{
		width: 33.33333%;
		margin-left: 0%;
	}
}

@media only screen and (max-width: 767px)
{
	div.knowledgeProxyLayout1 > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.knowledgeProxyLayout1 > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(1)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(2)
	{
		width: 100%;
		margin-left: 0%;
	}

	div.SearchBarHomePg > div:nth-child(3)
	{
		width: 100%;
		margin-left: 0%;
	}

	p.HomeTitle
	{
		font-size: 20pt;
	}

	p.HomePgSrch
	{
		font-size: 15pt;
	}

	p.LastUpdated
	{
		font-size: 10pt;
	}

	h1
	{
		font-size: 15pt;
	}

	h2
	{
		font-size: 13pt;
	}

	h3,
	h4,
	h5,
	h6,
	p.head2
	{
		font-size: 11pt;
	}

	p.head3
	{
		font-size: 10pt;
	}

	text
	{
		font-size: 9pt;
	}
}