/**
	* @file: layout.css 
	* @projectDescription: ElectraLink 2011 Rebrand
	* @author: Daniel Peters <danielp@m-corp.com>
	* @version: 1.0
	* NB. This stylesheet should be used for layout only. E.g. column widths, header structure etc.
*/

/**
	* @section: Framework styles
	* These styles setup the basis of the website
*/

/**
	* Give the content a wrap
*/
#content-wrap {
	position: relative;
	padding: 7px 15px 95px 15px;
}
.ie9 #content-wrap {
	background: url(../../template-images/grad-foot.png) repeat-x bottom;
}
#content-wrap.homepage-template {
	padding-top: 15px;
}
	#main-content {
		float: right;
		width: 708px;
	}
	.fullwidth-template #main-content {
		float: none;
	}
	.fullwidth-template #main-content {
		width: 892px;
		padding-left: 18px;
		padding-right: 18px;
	}

/**
	* Styles for the .entry content area
*/
.entry {
	min-height: 400px;
	padding: 0 23px 15px 0;
}
.homepage-template #main-content {
	float: left;
	width: 440px;
	min-height: 100%;
	padding-left: 10px;
	padding-bottom: 0;
}
.default-template .entry {
	float: left;
	width: 480px;
}
.fullwidth-template .entry {
	float: none;
	width: 100%;
	padding-right: 0;
}
	.entry h1 {
		padding-bottom: 10px;
		line-height: 36px;
		font-size: 36px;
		font-weight: normal;
		color: #0268b3;
	}
		.entry h1 p {
			padding: 0;
		}
	.homepage-template .entry h1 {
		font-size: 14px;
		color: #000;
	}
	.entry h2 {
		padding-top: 10px;
		color: #000;
		font-size: 14px;
	}
	.entry p {
		padding: 10px 0;
	}
	.entry ul,
	.entry ol {
		padding: 5px 0 5px 20px;
	}
	.ie6 .entry ol {
		padding-left: 30px;
	}
		.entry ul li,
		.entry ol li {
			padding: 5px 0;
		}
		.entry ul  li {
			list-style: square;
		}
		.entry ol li {
			list-style: decimal;
		}
		.entry form ol li {
			list-style: none;
		}		
	.entry img {
		margin-bottom: 12px;
	}
	.homepage-template .entry h2 {
		padding-top: 0;
	}
	.homepage-template .entry p {
		padding: 5px 0;
	}

/**
	* @section: Header styles
	* Got to have a header, right?
*/
#header {
	padding: 10px 0 0 0;
}
	#header h1 {
		float: left;
		width: 155px;
		padding: 5px 0 0 30px;
	}
	#loggedin-panel {
		float: right;
		width: 410px;
		padding: 8px 15px 0 0;
		font-weight: bold;
	}
		#loggedin-panel #loggedin-name {
			float: right;
			margin-right: 20px;
		}
		#loggedin-panel #loggedin-actions {
			float: right;
			width:155px;
		}
		#loggedin-actions ol li.text-static {
			font-size: 11px;
			padding-bottom: 4px;
		}
			#loggedin-actions ol li.text-static a {
				padding-left: 10px;
				background: url(../../template-images/link-arrow.gif) no-repeat left center;
				font-weight: normal;
			}		
				
		#loggedin-panel p {
			padding: 10px 0 0 0;
			font-weight: normal;
		}

/**
	* @section: Footer styles
	* Got to have a footer, right?
*/
#footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 50px;
	padding: 10px 0;
	border-top: 1px solid #d3d5d6;
	font-size: 11px;
	color: #a0a0a0;
}
	#footer,
	#footer a {
	}
	#footer p#copyright {
		float: left;
		padding-left: 24px;
	}
	#footer nav {
		float: left;
		padding-right: 15px;
	}
		#footer nav li {
			float: left;
			padding: 0 0 0 24px;
		}
		
/**
	* @section: Navigation styles
	* Used to style the main navigation blocks
*/

/**
	* #main-nav
*/
#header nav {
	position: relative;
	clear: both;
	width: 928px;
	padding: 15px 15px 11px 15px;
	background: url("../../template-images/main-menu-shadow.gif") no-repeat center bottom;
}
	#header nav ol {
		border: 1px solid #e5e5e4;
		background: #f9f9f9;
		font-size: 12px;
	}
		#header nav ol li {
			float: left;
		}
			#header nav ol li a {
				float: left;
				display: block;
				height: 13px;
				padding: 10px 17px 11px 17px;
				color: #6d6d6d;
				line-height: 13px;
				font-weight: bold;
			}
			#header nav ol li a:hover,
			#header nav ol li.selected a {
				margin: -1px;
				border: 1px solid #f89930;
				background: #f78f1f;
				background: linear-gradient(
					top,
					#f78f1f 0,
					#fcc578 0,
					#f78f1f 7px
				);
				background: -ms-linear-gradient(
					top,
					#f78f1f 0,
					#fcc578 0,
					#f78f1f 7px
				);
				background: -moz-linear-gradient(
					top,
					#f78f1f 0,
					#fcc578 0,
					#f78f1f 7px
				);
				background: -webkit-gradient(
					linear,
					center top,
					center bottom,
					from(#fcc578),
					color-stop(15%, #f78f1f)
				);
				background: -webkit-linear-gradient(
					top,
					#f78f1f 0,
					#fcc578 0,
					#f78f1f 7px
				);
				-pie-background: linear-gradient(
					top,
					#f78f1f 0,
					#fcc578 0,
					#f78f1f 7px
				);
				color: #fff;
				text-decoration: none;
			}
			.ie9 #header nav ol li a:hover,
			.ie9 #header nav ol li.selected a,
			.ie8 #header nav ol li a:hover,
			.ie7 #header nav ol li a:hover,
			.ie6 #header nav ol li a:hover,
			.ie6 #header nav ol li.selected a {
				background: url(../../template-images/grad-nav.png) repeat-x top;
			}

/**
	* #menu-sub
*/			
#menu-sub {
	float: left;
	width: 200px;
	margin-right: 2px;
}
#menu-sub a,
#menu-sub ol li.selected ol li a,
#menu-sub ol li.selected-section ol li a {
	display: block;
	color: #e67700;
}
#menu-sub a:hover,
#menu-sub ol li.selected ol li a:hover,
#menu-sub ol li.selected a,
#menu-sub ol li.selected-section a,
#menu-sub ol li.selected ol li.selected a {
	color: #0067b1;
	text-decoration: none;
}
	#menu-sub ol {
	}
		#menu-sub ol li {
			border-top: 1px solid #e6e6e5;
			font-weight: bold;
			font-size: 14px;
		}
		#menu-sub ol li:last-child {
			border-bottom: 1px solid #e6e6e5;
		}
			#menu-sub ol  li a {
				padding: 11px 18px;
			}
			#menu-sub ol  li ol {
				padding-bottom: 11px;
			}
				#menu-sub ol  li ol li {
					padding: 0;
					border: none;
					font-weight: normal;
					font-size: 13px;
				}
				#menu-sub ol  li ol li:last-child {
					border: none;
				}
					#menu-sub ol  li ol li a {
						padding: 7px 24px 7px 24px;
					}
				#menu-sub ol li.selected,
				#sub-menu ol li ol li.selected {
				}
					#menu-sub ol li a:hover,
					#menu-sub ol li.selected a,
					#menu-sub ol li.selected-section a,
					#menu-sub ol li.selected ol li a:hover,
					#menu-sub ol li.selected ol li.selected a {
						background: #f6f6f6 url(../../template-images/menu-sub-arrow.gif) no-repeat 179px center;
					}
					#menu-sub ol li ol li.selected a {
					}
					#menu-sub ol li.selected ol li {
					}
						#menu-sub ol li.selected ol li a,
						#menu-sub ol li.selected-section ol li a  {
							background: none;
						}
				#menu-sub ol  li ol li ol {
					padding-bottom: 0;
				}
					#menu-sub ol  li ol li ol  li a {
						padding-left: 34px;
					}

/**
	* #breadcrumbs
*/					
#breadcrumbs,
#breadcrumbs a {
	color: #949494;
}
#breadcrumbs{
	padding: 0 18px 27px 18px;
	font-size: 11px;
}
	#breadcrumbs li {
		float: left;
		padding-right: 9px;
		padding-left: 17px;
		background: url(../../template-images/breadcrumbs-trail.gif) no-repeat center left;
	}
	#breadcrumbs li:first-child {
		padding-left: 0;
		background: none;
	}
		
/**
	* @section: Banner styles
	* An attractive banner
*/
#banner {
	margin: 0 15px;
	text-align: center;
}

/**
	* Smaller, optional content page banner
*/
#page-banner {
	padding-bottom: 15px;
}
.fullwidth-template #page-banner {
	margin-left: -18px;
}

/**
	* @section: Main content
	* Styles for the main content area
*/
#main-title {
	padding: 0 0 15px 0;
}
	#main-title h1 {
		padding-bottom: 10px;
		line-height: 36px;
		font-size: 36px;
		font-weight: normal;
		color: #0268b3;
	}
	
/**
	* @section.call-to-action
	* Styles for the CTA section parents
*/

/**
	* #strip-boxes
*/
#strip-boxes {
	padding: 10px 14px 5px 14px;
}
#strip-boxes:after {
	visibility: visible;
}
#strip-boxes:after,
.strip-boxes-after {
	margin: 0 auto;
	width: 0;
	height: 0;
	overflow: hidden;
	padding: 4px 900px 0 0;
	display: block;
	background: url(../../template-images/gap-border-sml.gif) repeat-x;
}
	#strip-boxes section {
		float: left;
		display: inline-block;
		margin: 0 15.7px;
		width: 201px;
		padding: 18px 0;
	}
		#strip-boxes a.btn {
			float: right;
			padding: 0 3px 0 0;
		}

/**
	* #cta
*/
#cta {
	float: right;
	width: 200px;
	margin-left: 2px;
	padding: 10px 0 0 0;
}
	#cta section {
		padding: 18px 0;
	}
		#cta a.morelink {
			padding-left: 10px;
			background: url(../../template-images/link-arrow.gif) no-repeat left center;
			font-weight: bold;
		}

/**
	* latest news box styles
*/
#latest-news {
	position: relative;
	float: right;
	margin-right: 13px;
	width: 401px;
	padding: 17px;
	background: url(../../template-images/latest-news-bot.gif) no-repeat bottom;
	background: url(../../template-images/latest-news-top.gif) no-repeat top,
				url(../../template-images/latest-news-bot.gif) no-repeat bottom;
	-pie-background: url(../../template-images/latest-news-top.gif) no-repeat top,
					 url(../../template-images/latest-news-bot.gif) no-repeat bottom;
}
.ie6 #latest-news,
.ie7 #latest-news,
.ie8 #latest-news {
	border: 1px solid #dfdede;
	background: #fafafa;
	border-radius: 2px;
}
#latest-news,
#latest-news a {
	color: #6d6d6d;
}
	#latest-news h1 {
		margin-bottom: 9px;
		border-bottom: 1px solid #dfdede;
		font-size: 14px;
	}
		#latest-news h1 a:hover {
			text-decoration: none;
		}
	#latest-news li {
		font-size: 11px;
	}
		#latest-news li a {
			display: block;
			padding: 4px 0 5px 21px;
			background: url(../../template-images/latest-news-icon.gif) no-repeat left 3px;
			font-weight: normal;
		}
		#latest-news li a:hover {
			text-decoration: underline;
		}
		.ie6 #latest-news li a {
			position: relative;
		}
	#latest-news img {
		float:right;
		padding: 0 5px 10px 10px;
	}
	
	#latest-news .entry {
		min-height: 55px;
		padding-right: 0;
	}

/**
	* @section: Pagination
	* Styles for the pagination
*/
.entry .paging,
.entry .listing .paging {
	position: relative;
	text-align: center;
	margin-top: 20px;
	padding: 0 0 25px 0;
}
	.entry .paging ol {
	}
	.entry .paging li,
	.entry .paging a {
		position: relative;
		display: block;
		padding: 3px 7px;
		background: #f2f2f2;
	}
	.entry .paging li {
		margin: 0 6px 2px 0;
		color: #6d6d6d;
		-moz-box-shadow: 0 2px 2px #ccc;
		-webkit-box-shadow: 0 2px 2px #ccc;
		box-shadow: 0 2px 2px #ccc;
	}
		.entry .paging a {
			margin: -3px -7px;
		}
	.entry .paging li.changer {
	}
	.entry .paging li.changer,
	.entry .paging li.changer a {
		padding: 3px 11px;
	}
		.entry .paging li.changer a {
			margin: -3px -11px;
		}
	.entry .paging li.first,
	.entry .paging li.previous {
		float: left;
	}
	.entry .paging li.paging-number {
		display: inline-block;
		font-weight: bold;
	}
	.ie6 .entry .paging li.paging-number,
	.ie7 .entry .paging li.paging-number {
		display: inline;
		width: 0%;
		zoom: 1;
	}
		.entry .paging li.paging-number a {
			font-weight: normal;
		}
		.entry .paging a.forwarder {
			background: none;
		}
	.entry .paging li.next,
	.entry .paging li.last {
		float: right;
	}

/**
	* @section: Forms
	* Forms need to be styled
*/

/**
	* First, we set the default form styles
*/
form {
}
	fieldset {
	}
		legend {
		}
		label {
			display: block;
			padding: 0 0 5px 0;
		}
		form .nolabel label {
			display: none;
		}
		
		input,
		textarea,
		select {
			padding: 3px 3px 4px 3px;
			border: 1px solid #dbdbdb;
			background: #f4f4f4;
			font-family: Calibri, Tahoma, TrebuchetMS, Arial;
			font-size: 12px;
			color: #6d6d6d;
		}
		select {
			width: auto;
		}
		form textarea {
			resize: none;
		}
		.submit-field input,
		.button-wrapper input,
		form.formBuilder .formbuttonbar input {
			padding: 3px 9px 4px 9px;
		}

/**
	* standard content form styling
*/
.entry form {
}
	.entry form fieldset {
		padding: 5px 0;
		border-bottom: 1px solid #e6e6e5;
	}
		.entry form ul,
		.entry form ol {
			padding: 0;
		}
		.entry form li {
			clear: left;
			padding: 5px 0;
		}
			.entry form fieldset {
				border: none;
			}
			.entry form label,
			.entry form span.form-label {
				float: left;
				width: 150px;
				padding: 3px 0;
			}
			.entry form input[type="text"],
			.entry form input[type="password"],
			.entry form input.typeText,
			.entry form input.typePassword,
			.entry form textarea {
				width: 250px;
			}
			.entry form select {
				width: 255px;
			}
			.entry form .shortButton,
			.entry form .submit,
			.entry form .formbuttonbar,
			.entry form .button-wrapper {
				margin-top: 5px;
				margin-left: 150px;
			}
			.entry form .button-wrapper .shortButton {
				margin-top: 0;
			}
			.entry form#company-select .shortButton  {
				margin: 0;
			}

/**
	* .formBuilder add-on styles
*/
form.formBuilder .formcheckbox,
form.formBuilder .formradio ol {
	padding-left: 150px;
}
	form.formBuilder .formcheckbox label,
	form.formBuilder .formradio label {
		padding: 0 0 0 5px;
	}
	form.formBuilder .formcheckbox input,
	form.formBuilder .formradio input {
		float: left;
		width: auto;
		border: none;
	}
.form-error-message, .validationerror {
	padding: 0 0 5px 0;
	display: block;
	color: #f78f1d;
}

/**
	* #news-archive-filter
*/
#news-archive-filter {
	padding: 0 1px 10px 0;
	text-align: center;
}
	#news-archive-filter fieldset {
		margin: 0 auto;
		width: 310px;
	}
	#news-archive-filter legend {
		padding: 0 0 6px 15px;
	}
	#news-archive-filter li {
		clear: none;
		float: left;
	}
		#news-archive-filter label {
			float: left;
			width: auto;
			padding: 4px 8px 4px 15px;
		}
		#news-archive-filter select {
			width: auto;
		}
	#news-archive-filter li.submit-field {
		float: left;
		padding-left: 8px;
	}
		#news-archive-filter li.submit-field input {
			margin: 0;
		}

/**
	* #login-form
*/		
form#login-form {
	float: right;
	width: 386px;
	padding: 0 31px 0 0;
	color: #b0b0b0;
}
.ie6 form#login-form {
	width: 400px;
	padding-right: 21px;
}
.ie9 form#login-form {
	width: 386px;
}
	form#login-form a {
		clear: both;
		display: block;
		line-height: 18px;
		padding-left: 88px;
		background: url(../../template-images/link-arrow.gif) no-repeat 78px center;
		font-size: 11px;
	}
	form#login-form legend {
		padding: 0 0 5px 19px;
		color: #f78f1d;
	}
	form#login-form .text-field {
		float: left;
	}
		form#login-form label {
			float: left;
			padding: 2px 8px 2px 20px;
			font-size: 11px;
		}
		form#login-form .text-field input {
			width: 106px;
			font-size: 11px;
			color: #b0b0b0;
		}
	form#login-form .submit-field {
		margin-top: -1px;
		padding-left: 8px;
	}
		form#login-form .submit-field input {
			padding: 0;
			border: none;
			background: none;
		}
	form#login-form .text-static {
		clear: left;
		padding: 0 0 4px 244px;
		font-size: 11px;
	}
		form#login-form .text-static a {
			padding-left: 10px;
			background: url(../../template-images/link-arrow.gif) no-repeat left center;
		}

		
/**
	* #search
*/
form#search {
	position: absolute;
	top: 15px;
	right: 15px;
	width: 150px;
	padding: 8px 8px 0 10px;
	color: #b0b0b0;
}
	form#search fieldset {
	}
	form#search legend {
		display: none;
	}
		form#search .text-field input {
			width: 106px;
			font-size: 11px;
			color: #b0b0b0;
		}
		form#search label {
			display: none;
		}
	form#search ol {
		border: none;
	}
		form#search .submit-field {
			padding-left: 8px;
		}
			form#search .submit-field input {
			padding: 0;
			border: none;
			background: none;
		}

.search-content .title
{
	font-weight: bold;
	font-style: italic;
	display: inline;
}

ol#search-results 
{
	padding-left: 0px;
}

ol#search-results li
{
	list-style-type:none;
	list-style-position:inside;
	border-top: 1px solid #E6E6E5 ;
	padding-left: 5px;
}

ol#search-results li:hover
{
	background-color: #F6F6F6 ;
}

ol#search-results li:last-child
{
	border-bottom: 1px solid #E6E6E5 ;	
}

ol#search-results li h4
{
	font-weight: bold;
}
ol#search-results li h4 a
{
	text-decoration: underline;
}
ol#search-results li a
{
	display: block;
}

#refinesearch input.searchButton{
	margin-left: 10px;
	border: 0px;
	padding:0px;
}
		
#refinesearch ol li {
	float: left;
}

.search-keywords
{
	display: inline;
}
.search-content strong, .search-keywords strong
{
	color: #f78f1d;
}

#snippet
{
	font-weight:bold ;
	padding-bottom: 1em;
}


/**
 * Non-semantic helper classes: please define your styles before this section.
 */

/* For image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements.
   j.mp/bestclearfix */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }



/**
 * Media queries for responsive design.
 *
 * These follow after primary styles so they will successfully override.
 */

@media all and (orientation:portrait) {
  /* Style adjustments for portrait mode goes here */

}

@media all and (orientation:landscape) {
  /* Style adjustments for landscape mode goes here */

}

/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
   consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {


  /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you: j.mp/textsizeadjust */
  /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}


/**
 * Print styles.
 *
 * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
 */
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
  -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}
