/*	---------------------------------------------------------------
		@filename		templates.css
		@author			david.milton@akqa.com - modified by adam.abouraya@akqa.com
		@description	Page layout + global style definitions for the content page templates
		
		Contents
		1. Page Layout
		2. Generic Styles
		3. Navigation Pane (navigation side bar)
		4. Components

	--------------------------------------------------------------- */
	

/*	
	=========== 1. Page Layout ===========
*/

#wrapper {
	width:960px;
	margin:0 auto;
}

.layout-3col-tmpl #sub-nav-sidebar,
.layout-2col-tmpl #sub-nav-sidebar {
	float: left;
	height: 500px;
	width: 232px;
}
.layout-3col-tmpl #sub-nav-sidebar  #quick-tools,
.layout-2col-tmpl #sub-nav-sidebar  #quick-tools {
	padding-bottom: 10px;	
}

.layout-3col-tmpl #template-core,
.layout-3col-tmpl #related-content,
.layout-2col-tmpl #template-core {
	background: none;
	float: right;
	width: 720px;
	min-width: 720px;
}
.layout-3col-tmpl #related-content {
	border: 1px dotted red;
	height: 150px;
	margin-top: -20px;
}
.layout-2col-tmpl #video-topic-browser,
.layout-2col-tmpl #promo-group {
	border: 1px dotted red;
	height: 120px;
	margin-top: 10px;
}
.layout-2col-tmpl #promo-group {
	height: 158px;
}
.layout-3col-tmpl #template-core .section-header {
	border: 1px dotted red;
	height: 150px;
	margin: 0 0 10px 0;
	width: 716px;
}
.layout-3col-tmpl #template-core #content {
	border: 1px dotted #ccc;
	float: left;
	width: 472px;
}
.layout-3col-tmpl #template-core .help-callout-block {
	border: 1px dotted #ccc;
	height: 320px;
	margin: 10px 1px 1px 1px;
	width: 468px;
}

.layout-3col-tmpl #template-core .help-callout {
	border: 1px dotted red;
	display: inline;
	float: left;
	height: 150px;
	margin: 4px;
	width: 224px;
}
.layout-2col-tmpl #template-core #content .compare-products-services,
.layout-2col-tmpl #template-core #content .topic-info-table,
.layout-3col-tmpl #template-core #content .topic-info-table,
.layout-2col-tmpl #template-core #content .compare-products-services,
.layout-2col-tmpl #template-core #content .topic-info,
.layout-3col-tmpl #template-core #content .topic-info,
.layout-3col-tmpl #template-core #content .product-list,
.layout-3col-tmpl #template-core #content .page-intro,
.layout-2col-tmpl #template-core #content .section-landing-intro,
.layout-2col-tmpl #template-core #content .silo-landing-overview,
.layout-2col-tmpl #template-core #content .video-gallery,
.layout-3col-tmpl #template-core #content .content-tabs,
.layout-2col-tmpl #template-core #content .content-tabs,
.layout-3col-tmpl #template-core #content .content-drawers,
.layout-3col-tmpl #template-core #content .expandable-details,
.layout-3col-tmpl #template-core #content .instruction-manual {
	border: 1px dotted red;
	margin: 10px 1px 0 1px;
	height: 150px;
	width: 468px;
}

.layout-2col-tmpl #template-core #content .compare-products-services,
.layout-3col-tmpl #template-core #content .topic-info-table,
.layout-2col-tmpl #template-core #content .topic-info-table,
.layout-2col-tmpl #template-core #content .compare-products-services,
.layout-3col-tmpl #template-core #content .product-list,
.layout-2col-tmpl #template-core #content .topic-info,
.layout-3col-tmpl #template-core #content .topic-info {
	height: 25px;
}

.layout-2col-tmpl #template-core #content .section-landing-intro,
.layout-2col-tmpl #template-core #content .silo-landing-overview,
.layout-2col-tmpl #template-core #content .video-gallery,
.layout-2col-tmpl #template-core #content .content-tabs {
	width: 714px;
}
.layout-3col-tmpl #template-core #content .topic-info-table,
.layout-3col-tmpl #template-core #content .topic-info,
.layout-3col-tmpl #template-core #content .product-list {
	width: 464px;
}

.layout-2col-tmpl #template-core #content .compare-products-services,
.layout-2col-tmpl #template-core #content .topic-info-table,
.layout-2col-tmpl #template-core #content .topic-info {
	width: 710px;
}

.layout-2col-tmpl #template-core #content .product-list,
.layout-3col-tmpl #template-core #content .compare-products-services {
	display:none;
}

.layout-2col-tmpl #template-core #content .video-gallery,
.layout-3col-tmpl #template-core #content .content-drawers,
.layout-3col-tmpl #template-core #content .expandable-details,
.layout-3col-tmpl #template-core #content .instruction-manual {
	height: 100px;
	border-color: green;
}

.layout-3col-tmpl #template-core #content .content-tabs,
.layout-2col-tmpl #template-core #content .content-tabs {
	height: auto;
	border-color: green;
}


.layout-3col-tmpl #related-content #find-helpful {
	border: 1px dotted red;
	float: left;
	height: 146px;
	margin: 1px;
	width: 470px;
}

.layout-3col-tmpl #related-content #related-pubs {
	border: 1px dotted red;
	float: right;
	height: 146px;
	margin: 1px;
	width: 228px;
}
.layout-2col-tmpl #template-core #content {
	border: 1px dotted #ccc;
	min-height: 450px;
	width: 718px;
}

.layout-3col-tmpl #template-core #promo-sidebar {
	border: 1px dotted #ccc;
	float: right;
	min-height: 450px;
	width: 232px;
}
.sub-nav-menu {
	border: 1px dotted #ccc;
	margin-bottom: 10px;
	height: 150px;
}
#get-help {
	border: 1px dotted #ccc;
	height: 250px;
}
.layout-2col-tmpl #template-core #faq-link,
.layout-3col-tmpl #template-core #promo-sidebar #faq-link {
	border: 1px dotted #ccc;
	margin: 30px 1px 10px;
	width: 228px;
}
.layout-2col-tmpl #template-core #faq-link {
	border: 1px dotted red;
	float: right;
	margin: 20px 1px 10px;
	width: 228px;
}

/*.promo-bucket {
	height: 150px;
	margin: 1px;
	margin-bottom: 10px;
	width: 228px;
} */

.dj_ie6 .promo-bucket {
	display: inline;
}

.layout-2col-tmpl #template-core .promo-bucket {
	display: inline;
	float: left;
	margin: 3px 4px;
}

/*	
	=========== 2. General Styles Layout ===========
*/
h3.section-label,
h3.section-label-optional,
h3.section-label-choice {
	padding: 10px;
}

h3.section-label-optional, p.optional { color: red; }
h3.section-label-choice, p.choice { color: green; }
p {	padding-left: 10px; }