/*<meta />*/

/* This is a brand specific stylesheet for the Main Home page (index.html) for new HTML5 Web Help targets. It should call StylesForHomePage.css via @import in the first line below. All brand specific style changes should be made to this stylesheet. i.e. Font color changes, icon color changes, etc. If something is to affect ALL brands, then it must be changed in StylesForHomePage.css. For example, adding a border to content. */

@import url('basestyles/stylesforhomepage.css');

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

/* These are the Brand Specific styles for the TopNav WebHelp targets. These styles are 100% modifiable for your needs. */
/* Home Page General Styles*/

html.HomePage
{
	mc-master-page: url('../masterpages/homepage.flmsp');
}

body
{
	font-family: Arial;
	line-height: 1.5em;
}

a.BlackText
{
	color: #000000;
	text-decoration: none;
}

h1
{
	font-size: 2.75em;
}

h3
{
	font-size: 1.6785em;
}

h3.SubCenter
{
	text-align: center;
}

img.Hyperlinked
{
	border-style: none;
}

img.Slideshow
{
	border-style: none;
	margin-bottom: 15px;
}

p
{
	color: #5a5a5a;
	margin-bottom: 8px;
	margin-top: 8px;
}

p.Copyright
{
	font-size: 0.9em;
	text-align: left;
	color: #888888;
	line-height: 1.6em;
	margin: 0 0 10px 0;
}

.centered-text
{
	text-align: center;
}

.center
{
	position: relative;
	margin-right: auto;
	margin-left: auto;
	float: none !important;
	text-align: center;
}

.whiteheader
{
	color: #ffffff;
	font-weight: normal;
}

.row.nav-search
{
	display: none;
}

.main-section > .row.outer-row
{
	max-width: 100%;
	padding: 0;
}

/* Home Page Button Styles */

.button
{
	cursor: pointer;
	background-color: transparent;
	width: 150px;
	height: 35px;
	font-weight: bold;
}

.button.black
{
	border: solid 2px black;
	color: black;
	width: 125px;
	height: 35px;
	margin: 0px 5px;
}

.button.black:hover
{
	background-color: #ccc;
}

.button.black.small-centered
{
	position: relative;
	margin-right: auto;
	margin-left: auto;
	float: none !important;
	text-align: center;
}

.button a
{
	display: block;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}

/* Responsive Header Styles*/

#contentBody > .responsive-header
{
	background-color: transparent;
}

/* Content Section */

#content-section
{
	padding-top: 60px;
	padding-bottom: 60px;
	background-color: #e1e1e1;
	margin-top: -50px;
}

#content-section h3
{
	font-weight: normal;
}

.right-section div.button-group,
.left-section div.button-group
{
	margin-top: 20px;
}

#content-section .left-section
{
	padding-right: 20px;
}

#content-section .right-section
{
	padding-left: 20px;
}

.left-section .left-content,
.right-section .right-content
{
	height: 270px;
}

#content-section .right-section .table-images:first-of-type
{
	margin-bottom: 20px;
}

#content-section.mc-blurb p
{
	margin-top: 0;
	margin-bottom: 5px;
}

#content-section.mc-blurb .mc-bullets
{
	margin-top: 10px;
	padding-left: 30px;
	padding-right: 10px;
}

#content-section.mc-blurb .mc-bullets > li
{
	color: #5a5a5a;
	list-style-image: url('../images/icons/bullet2.png');
	font-size: 14px;
	margin-top: 8px;
	line-height: 1.6em;
}

/* Home Page Topic Hero section*/

div.topichero
{
	background-image: none;
	background-color: #262626;
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 20px;
	height: auto;
	padding-bottom: 150px;
}

div.topichero h1
{
	font-size: 3.6em;
	margin-top: 1.11em;
	margin-bottom: 0.5em;
	line-height: 100%;
}

div.topichero h3
{
	font-size: 1.8em;
	margin-bottom: 80px;
	line-height: 100%;
}

.search,
.search-bar
{
	margin: 0 auto;
}

/* Home Page slide show */

div.slidingshow
{
	margin-top: -79px;
	margin-bottom: 100px;
	margin-left: auto;
	margin-right: auto;
	width: 750px;
}

.mc-wrapper .mc-caption
{
	background: none;
}

/* DIRECTION CONTROLS (NEXT / PREV) */

.mc-wrapper .mc-prev,
.mc-wrapper .mc-next
{
	/*left: 10px;*/
	background-image: url('images/mcslider_controls.png');
	background-repeat: no-repeat;
	background-position: 0 -32px;
	display: none;
}

/* Home Page Video Section */

.video-section
{
	padding-top: 50px;
	padding-bottom: 30px;
}

.video-section img
{
	padding-right: 10px;
	padding-bottom: 10px;
}

.video-wrapper
{
	padding-bottom: 56.25%;
	/* 16:9 */
	position: relative;
}

.video-section iframe
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video-section .columns
{
	margin-bottom: 20px;
}

/* Home Page Footer */

.footer
{
	background-color: #262626;
	padding-top: 40px;
	padding-bottom: 40px;
}

.footer a
{
	text-decoration: none;
	color: #DADADA;
}

.footer > div.row
{
	line-height: 30px;
	padding: 0;
}

.footer-logo
{
	max-width: 100%;
}

.footer-links
{
	text-align: left;
}

.footer-links a
{
	padding-right: 15px;
}

.footer-icons
{
	text-align: right;
}

.footer-icons > a:first-of-type
{
	padding-right: 10px;
}

/* Mad Cap proxy/editor assigned styles */

MadCap|searchBarProxy
{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	float: none;
	width: 50%;
}

MadCap|topicToolbarProxy
{
	float: none;
}

p.TOC2
{
	margin-left: 20px;
	display: none;
}

MadCap|menuProxy.menu1
{
	mc-toc-depth: 1;
	mc-context-sensitive: True;
}

MadCap|menuProxy.menu2
{
	mc-toc-depth: 1;
	mc-context-sensitive: True;
}

MadCap|slideshow
{
	border-style: none;
	box-shadow: none;
}

MadCap|slideshowCaption
{
	background: none;
	color: #000000;
	padding: 0px;
	padding-top: 0px;
}

html.HomePage
{
	mc-master-page: url('../masterpages/homepage.flmsp');
}

/* Medium Layout */

@media only screen and (max-width: 64.063em)
{
	#content-section .right-section,
	#content-section .left-section
	{
		padding: 0;
	}

	div.slidingshow
	{
		width: 100%;
	}

	.left-section div.button-group > div
	{
		margin-bottom: 20px;
	}

	.footer
	{
		padding-top: 20px;
		padding-bottom: 20px;
	}
}

/* Small Layout */

@media screen and (max-width: 40em)
{
	MadCap|searchBarProxy.homeSearchBar
	{
		width: 100%;
	}

	div.topichero h1
	{
		font-size: 2em;
	}

	div.topichero h3
	{
		font-size: 1.2em;
	}

	#content-section
	{
		padding-top: 30px;
		padding-bottom: 30px;
	}

	.video-section
	{
		padding-top: 30px;
	}

	.video-section .columns
	{
		padding: 0;
	}

	.footer-links,
	p.Copyright,
	.footer-icons
	{
		text-align: center;
	}
}