@import url(autocomplete.css);

html, body {
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
}

body, ul, td, .normal {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
 	font-size : 13px;
	color : #000000;
}
	

a { color: #9BA81C; text-decoration:none; }
a:hover { color: #4B3A4A; }

#breadcrumb { padding:0px 0px 6px 0px; font-family:'Source Sans Pro', Arial, Helvetica, sans-serif; font-size:10px; font-weight:bold; letter-spacing:normal; color:#ACABAB; }
#breadcrumb a  { color:#ACABAB; }
#breadcrumb a:hover { color:#4B3A4A; text-decoration:none; }



hr {
	background-color:silver;
	border-width:0px;
	height:1px;
	margin:5px 0px;
	clear:both;
}


p {
	margin-top:0;
	}


h1, .page-title  	{
 	font: normal 600 20px/100% 'Source Sans Pro', Arial, Helvetica, sans-serif;
 	text-transform: uppercase;
	color : #750030;
	margin: 0px 0px 0px 0px;
	letter-spacing: 1px;
	}
h2, .page-subtitle {
 	font: normal normal 16px/150% 'Source Sans Pro', Arial, Helvetica, sans-serif;
	color : #005077;
	margin: 0px 0px 10px 0px;
	}

h3, .home2 {
	color : #750030;
	margin: 0px 0px 0px 0px;
 	font: normal 600 13px/150% 'Source Sans Pro', Arial, Helvetica, sans-serif;
	}

input, select {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
	font-size : 10px;
}	
	
.input {
	width:150px;
	}

textarea {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
	font-size : 13px;
	width:400px
 	}

.button {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
	font-size : 12px;
	color:black;
	}
 
.dwarf {
	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
	font-size : 10px;
	font-weight:normal;
	line-height: normal;
	letter-spacing:normal;
	}




table {
	border-spacing:0px;
	border-collapse:collapse;
}

td, th {
	padding:4px;
	font-size:13px;
	text-align:left;
}

thead, tfoot {
	font-size:13px;
}


tr td {
	padding: 6px 12px  !important;
}

.trlabel, .tdlabel, .cell, .cell2, .odd, .even {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
 	letter-spacing:normal;
	font-size : 13px;
	padding: 6px 12px;
}

.trlabel, thead th  {
	font-weight: bold;
	color: #FFFFFF !important;
	background-color:#4A3949;
	font-size: 13px;
	padding: 6px 12px;
	}
	
.tdlabel, tbody th  {
	font-weight: bold;
	color:#FFFFFF;
	background-color:#9BA81C;
		
	}
	
.cell, .odd  {
	color:black;
	background-color: #EBEDD1;
	font-size: 13px;
	padding: 6px 12px !important;
	}
	
.cell2, .even  {
	color:black;
	background-color: #F7F7EC;
	font-size: 13px;
	padding: 6px 12px  !important;
	}
	
.box  {
 	font-family : 'Source Sans Pro', Arial, Helvetica, sans-serif;
 	font-size:12px;
	font-weight:normal;
	letter-spacing:0px;
	}
	
.error {
	color: white;
	font-weight:bold;
	background-color:#750030;
	padding: 2px 8px;
	margin-top: 5px;
	}
	
.hand {
	cursor:pointer;
	cursor:hand;
}

div.clear {clear: both; display: block; margin: 0; padding: 0; height: 0; line-height: 1px; font-size: 1px;}

.applyBorder {
	border-width: 1px;
	border-color: #75528F;
	border-style:solid;
}


.calloutbox {
	border: 1px solid #9BA81C;
	padding:0px;
	margin:0px 19px 0px 0px;
	width:240px;
	background-color:#FAF8EA;
}

.calloutbox p, .calloutbox h2, .calloutbox h3 {
	margin-left:15px;
	margin-right:15px;
}


/* H1 inside comment box will be the blue header stripe. This sets a default text style as well, though you can also use an image */
.calloutbox h1 {
	margin:0px;
	height:42px;
	heig\ht:36px;
	background-image:url(../image/wui-calloutheaderbg.gif);
	background-repeat:repeat-x;
	font-size:15px;
	font-weight:bold;
	font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
	color:#FFFEF7;
	padding:3px 4px 2px 4px;
}


/* if you use an image, this adjusts the image down 2 pix to center it in the blue stripe */
.calloutbox h1 img {
	margin-top:3px;
}

ul.nav { font-size:11px; margin-left:0px; margin-top:5px; margin-bottom:5px; padding-left:12px; list-style-type:none; list-style-image:none;line-height:170%; }
ul.nav li { margin-bottom:2px; margin-left:0px; list-style-type:none; }
ul.nav li a { background-image:url(../image/navbullet.gif); background-position:0px 3px; background-repeat:no-repeat; padding-left:18px; font-weight:bold; display:block; width:90%;color:#49176D; }
ul.nav li a:hover { background-image:url(../image/navbullet.gif);color: #9BA81C; }
ul.nav li a, #breadcrumb a  { text-decoration:none; }





.page-summary p,
.page-contents p,
.page-conclusion p,
.page-bullets ul,
.page-bullets ol {
	line-height: 125%;
	padding: 0px !important;
}

.page-summary ul li,
.page-contents ul li,
.page-conclusion ul li {
	margin-left: 1.6em;
	list-style: disc outside url('/image/Bullet.gif');
}
.page-summary ol li,
.page-contents ol li,
.page-conclusion ol li {
	margin-left: 1.6em;
	list-style: decimal outside none;
}

.page-bullets {
	clear: left;
}
	.page-bullets ul li,
	.page-bullets ol li {
		margin-left: 1.6em;
		line-height: 150%;
	}
	.page-bullets span.clear {
		clear: left;
	}
.page-image-block,
.page-featured-image {
	padding: 0 0.5em 0.5em;
}
.page-image-block.right,
.page-featured-image.right {
	float: right;
	clear: right;
	padding-right: 0;
	margin-left: 1em;
}
.page-image-block.left,
.page-featured-image.left {
	float: left;
	clear: left;
	padding-left: 0;
	margin-right: 1em;
}
	#imageNav {
		text-align: center;
		padding: 0.2em 0;
		font-size: 80%
	}
	.page-content #currCaption,
	.page-content #featCaption {
		font-size: 80%;
		text-align: center;
	}
	
.page-additional-info {
	width: 300px;
	position: relative;
	margin: 1em 0;
	background-color: #f5f5f5;
}
	.page-additional-info h3 {
		width: 280px;
		padding: 0px 20px 10px;
		margin: 0;
		font-size: 18px;
		line-height: 50px;
		text-align: left;
		font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
	}
	.page-additional-info .page-additional-content {
		width: 280px;
		padding: 0 10px;
		text-align: left;
		margin-top: -20px;
	}
		.page-additional-info .page-additional-list {
			width: 280px;
			padding: 0 0 5px;
			color: inherit;
		}
			.page-additional-info .page-additional-list li {
				list-style: none;
				display: block;
				text-align: left;
				margin: 0 0 0 1em;
				padding: 3px 0;
			}
			.page-additional-info .page-additional-list a {
				font-size: 14px;
				font-weight: bold;
				text-decoration: none;
				font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
				line-height: 120%;
				color: black;
			}
			
			.page-additional-info a:hover {
				color: #b5985b

			}
			
.page-downloads {
	margin: 1em 0;
	clear: both;
}
	.page-dowloads h3 {
		padding-bottom: 0.5em;
	}
	.page-downloads .page-download-block {
		width: 45%;
		min-height: 45px;
		float: left; 
		padding-right: 5%;
		padding-bottom: 0.5em;
		position: relative;
	}
	.page-downloads .page-download-thumb {
		display: block;
		padding-right: 10px;
		position: absolute;
		left: 0;
		top: 0;
	}
	.page-downloads .page-download-block h4,
	.page-downloads .page-download-block p {
		font-size: 90%;
		padding-left: 42px;
	}
			
/* ========== SUB PAGE LAYOUTS ==========
 * 1. Layout A
 * 2. Layout B
 * 3. Layout C
 * 4. Layout D
 * 5. Layout E
 * 6. Layout F
 * 9. Layout I Slideshow uses Layout A
 * 10. Layout J Graphical Subpages
 *
 * ===== Layout A ===== */


.page-summary.layoutA p,
.page-contents.layoutA p,
.page-conclusion.layoutA p,
.page-bullets.layoutA ul,
.page-bullets.layoutA ol {
	padding-left: 0;
}
.page-image-block.layoutA {
	padding: 0 0 0.5em;
}
.page-image-block.layoutA,
.page-additional-info.layoutA {
	float: right;
	clear: right;
	margin-left: 1em;
}

/* ===== Layout B ===== */

.page-featured-image.layoutB {
	float: left;
	clear: left;
	margin-right: 1em;
}
.page-image-block.layoutB,
.page-additional-info.layoutB {
	float: right;
	clear: right;
	margin-left: 1em;
}

/* ===== Layout C ===== */

.page-additional-info.layoutC {
	float: left;
	clear: left;
	margin-right: 1em;
}
.page-image-block.layoutC,
.page-featured-image.layoutC {
	float: right;
	clear: right;
	margin-left: 1em;
}

/* ===== Layout D ===== */
.page-image-block.layoutD {
	float: right;
	clear: right;
	margin-left: 1em;
}
.page-additional-info.layoutD {
	float: left;
	clear: left;
	margin-right: 1em;
}

/* ===== Layout E ===== */
div.imageBlock.layoutE,
.page-image-block.layoutE {
	float: right;
	clear: right;
	padding: 0px;
}
div.imageBlock.layoutE p.imageCaption,
.page-image-block.layoutE .image-caption {
	font-size: 80%;
	text-align: right;
	margin: 0;
	padding: 0;
}
.page-downloads.layoutE {
	clear: none;
}
	.page-downloads.layoutE .page-download-block.layoutE {
		width: auto;
		float: none;
		clear: left;
		padding: 0 0.5em;
	}

/* ===== Layout F ===== */
.page-image-block.layoutF {
	float: right;
}
.page-image-block.layoutF #myCaption {
	text-align: center;
}
.page-image-block.layoutF #thumbGallery {
	padding: 0.5em;
	text-align: center;
}
	.page-image-block.layoutF #thumbGallery .thumbSwitch {
		display: inline-block;
		width: 50px;
		height: 50px;
		padding: 5px;
	}

.page-additional-info.layoutF,
.page-featured-image.layoutF {
	float: left;
	clear: left;
	margin-right: 1em;
}

/* ===== Layout G ===== */
.page-video-block.layoutG {
	float: right;
	clear: right;
	padding: 0 0 1em 1em;
	text-align: center;
}
	.page-video-block.layoutG .video-wrapper {
		background: transparent url('/consoleAssets/image/loading.gif') no-repeat 50% 50%;
		margin: 0 auto;
	}
		.video-wrapper.layoutG object {
			display: block;
			margin: 0 auto;
		}
	.page-video-block.layoutG .video-caption {
		padding-top: 0.5em;
		text-align: center;
	}

.page-additional-info.layoutG {
	float: left;
	clear: left;
	margin-right: 1em;
}

.page-video-thumbs {
	margin-top: 1em;
}
	.page-video-thumbs .page-video-thumb {
		float: left;
		padding: 0.5em 1.3em 0.5em 0;
		width: 100px;
		text-align: center;
	}
		.page-video-thumbs .page-video-thumb a {
			text-decoration: none;
			font-size: smaller;
			font-weight: bold;
			display: block;
			position: relative;
		}
			.page-video-thumbs .page-video-thumb a img {
				border: 1px solid #CCC;
			}

/* ===== Layout H ===== */
.page-video-block.layoutH {
	float: right;
	clear: right;
	padding: 0 0 1em 1em;
	text-align: center;
}	
	.page-video-block.layoutH .video-wrapper {
		background: transparent url('/consoleAssets/image/loading.gif') no-repeat 50% 50%;
		margin: 0 auto;
	}
		.video-wrapper.layoutH object {
			display: block;
			margin: 0 auto;
		}
	.page-video-block.layoutH .video-caption {
		padding-top: 0.5em;
		text-align: center;
	}
	.page-video-block.layoutH .page-video-thumbs {
		padding: 1em 0 0.5em;
		margin: 0 auto;
	}
		.page-video-block.layoutH .page-video-thumbs .page-video-thumb {
			position: relative;
			display: block;
			float: left;
			width: 50px;
			height: 50px;
			padding: 5px;
			overflow: hidden;
		}
		
.page-additional-info.layoutH {
	float: right;
	clear: right;
	margin-left: 1em;
}

.page-image-block.layoutH {
	float: left;
	margin-right: 1em;
}	
	.page-image-block.layoutH #myCaption {
		text-align: center;
	}

/* p.imageCaption {
	position: absolute;
	bottom: 0px;
	left: 00px;
	color: white;
	padding: 5px 10px;
	font-weight: bold;
	font-size: 13px;
	border-radius: 5px;
	font: normal bold 18px/130% 'Source Sans Pro', Arial, Helvetica, sans-serif;
	
} */

 /* ===== Layout J ===== */

.page-summary.layoutJ p,
.page-contents.layoutJ p,
.page-conclusion.layoutJ p,
.page-bullets.layoutJ ul,
.page-bullets.layoutJ ol {
	padding-left: 0;
}
.page-image-block.layoutJ {
	padding: 0 0 0.5em;
}
.page-image-block.layoutJ,
.page-additional-info.layoutJ {
	float: right;
	clear: right;
	margin-left: 1em;
}

.subpage-image-layoutJ {
	width:310px;
	overflow:hidden;
	float:left;
}

	.subpage-imagebox-layoutJ {
		width:310px;
		height:310px;
		overflow:hidden;
	}

			div.subPageCaption p.subPageCaption {
				width: 100%;
				background-color: #ebedd1;
				font: normal bold 22px/130% 'Source Sans Pro', Arial, Helvetica, sans-serif;
				padding: 1em 0;
				color: black;
				text-align: center;
				
			}
				div.subPageCaption p.subPageCaption  {
					padding: 15px 0px;
				}
				
				a.subCaption {
					color: #4A3949 !important;
					text-decoration: none;
				}
				
				.subTitleCaption {
					color:#4A3949;
					font-size:80%;
					font-style:italic;
					font-weight:normal;
				}
				
				.subTitleCaption:hover {
					color:#ffffff;
				}
			
			div.subPageBlock div.subPageCaption a.subPageView {
				display: block;	
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;		
				text-decoration: none;
			}
			
			div.subPageBlock div.subPageCaption a.subPageBuy {
				display: block;
				padding: 3px;
				position: absolute;
				bottom: 7px;
				right: 7px;
				font-style:italic;
				font: normal 12px/100% 'Source Sans Pro', Arial, Helvetica, sans-serif;
				color: #FFF;
				text-decoration: none;
			}

		.learnMore {
			background-color:#4A3949;
			text-indent:0;
			
			display: inline-block;
			color: white;
			font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-weight: bold;
			font-style: normal;
			line-height: 25px;
			width: 105px;
			text-decoration: none;
			text-align: center;
		}
		
		.learnMore:hover {
			background-color: #9ba81b;
			color: #ffffff;
		}
		
		.learnMore:visited {
			color: white;
		}
		
		.learnMore:active {
			position: relative;
			top: 1px;
		}
		
		.learnMore2 {
			background-color:#005077;
			text-indent:0;
			
			display: inline-block;
			color: white;
			font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
			font-size: 12px;
			font-weight: bold;
			font-style: normal;
			line-height: 25px;
			text-decoration: none;
			text-align: center;
			text-transform:uppercase;
		}
		
		.learnMore2:hover {
			background-color: #006a7f;
			color: #ffffff;
		}
		
		.learnMore2:visited {
			color: white;
		}
		
		.learnMore2:active {
			position: relative;
			top: 1px;
		}

form.typeForm {
	float: right;
}

form.whichForm {
	color: #6A644E;
	font-size: 15px;
	margin-bottom: 20px;
}

.storeChart {
	width:30%;
	float:left;
	margin:10px;
	border:2px solid #cbcbcb;
	overflow:hidden;	
}

.storeChartHeader {
	width:96%;
	margin:2%;
	background-color:#005077;
	text-align:center;	
}

.storeChartHeaderAlt {
	width:96%;
	margin:2%;
	background-color:#750030;
	text-align:center;	
}