@charset "utf-8";
/*##################### TOC ####################*/
/*  1.  Header					*/
/*  1.1 Google custom search in header	*/
/*  2.  Main Nav				*/
/*  3.  Footer					*/
/*  4.  Left Column				*/
/*  5.  Right Column				*/
/*  5.1 Navigation				*/
/*  5.2 Breadcrumbs				*/
/*  6.  Content Wide				*/
/*  6.1 Fasttrack table				*/
/*  6.2 Fastrack&contact Forms			*/
/*  7.  Content					*/
/*  8.  Content & Content Wide commons		*/
/*  8.1 Jobs boxes				*/
/*  8.2 Downloads boxes				*/
/*  8.3 Warning Box				*/
/*  8.4 Nav 3 - Videos				*/
/*  8.5 BlueTab					*/
/*  8.6 Addresses tab				*/
/*  8.7 CS Image Styling			*/
/*  9.  Video Boxes				*/
/* 10.  Features Boxes				*/
/*##################### TOC ####################*/


* {font-family: Verdana, Arial, Helvetica, Sans Serif; padding: 0; margin: 0;}
body {font-size:62.5%; color: #333; background-color: #fafafa; text-align: center;}

/* #mainTable {padding: 0; margin: 0 auto; border-right: 1px #c6c6c6 solid; border-left: 1px #c6c6c6 solid; background: #fcfcfc url('/img/common/menu/main-bkg.jpg') no-repeat scroll 450px 10px;} */

#mainTable {/*width: 62.1em;  58 */ padding: 0; margin: 10px auto 0 auto; border: 1px #c6c6c6 solid; background: #fcfcfc url('/img/common/menu/main-bkg2.jpg') no-repeat scroll 400px 100px;}



/* 1.  ################### Header ###################*/
#header {background-color: #ffffff;}
	#header img { display: block; float: left;}
	
#promotion {border: 1px solid black; margin: 2em 1em; padding: 0.8em; float: right; color: black; text-align: center;}
	#promotion h3 {font-size: 1.2em;}

/* 1.1   google custom search in header */
	#googleSearch{padding: 4.5em 1em 0 0; float: right;}
		#googleSearch form input{float: left; height: 14px; font-size: 1em;}
			#googleSearch form input#submitButton {height: 20px;}

/* 2.  ################### Main Nav ###################*/
#mainNav { border-bottom: 1px #808080 solid; }

/* 3.  ################### Footer ###################*/
#footer{background-color: #e0e0e0;background:url("/img/common/menu/footer-bkg.jpg") repeat-y right top; border-top: 1px #c6c6c6 solid; text-align: center;}
	#footer p{font-size: 1.1em; padding: 1em 0 0 0; color: #fff; font-weight: bold; }
	
	#footerLeft{float: left; margin: 0 0 1em 1em;}
		#footerLeft a {color: #00559f; font-weight: bold;}
	#footerRight{float: right; margin: 0 1em 1em 0;}
		#footerRight p{color: #000;}

/* 4.  ################### Left Column ###################*/
#leftColumn{text-align: left; vertical-align: top; background: #efeff7 url('/img/common/ball-side.gif') repeat-y scroll left top; width: 23.2em; border-right: 1px #c6c6c6 solid;/*padding: 0 0 1em 0;*/}
	#leftColumn p { padding: 0 0.8em 0 0.8em; font-size: 1.3em; border-bottom: 1px #c6c6c6 solid;}
	#leftColumn h3 { font-size: 1.2em; margin: 0.5em 0 0 0 ;}
	
	/* navigation */
		#leftColumn p.leftNav2, 
		#leftColumn div.leftNav2{padding: 0; text-align: center; display: block;}

			#leftColumn .leftNav2 img{ margin: 0.8em 0;}

			#leftColumn .leftNav1 a, #leftColumn .leftNav2 a { display: block; text-decoration: none; color: #000080; font-weight: bold; margin: 0.3em 0; }
			#leftColumn .leftNav1 a{ font-size: 1em;}
			#leftColumn .leftNav1 a:hover, #leftColumn .leftNav2 a:hover{color: #0000ff;}
				#leftColumn .leftNav2 a:link img, 
				#leftColumn .leftNav2 a:visited img{border-color: #000080;}				
				#leftColumn .leftNav2 a:hover img{border-color: #0000ff;}

			#leftColumn .leftNav3 a{text-decoration: none; font-size: 1.0em; color: #000080; font-family: Arial;}
			#leftColumn .leftNav3 a:visited{color: #000080;}
			#leftColumn .leftNav3 a:hover{color: #0000ff;}

/* 5.  ################### Right Column ###################*/
#rightColumn{ vertical-align: top; text-align: center; width: 26.4em; height: 1px; padding: 1.6em 0 ;}

/* 5.1 navigation */
	#rightColumn .rightNav2 img{ margin: 0.8em 0;}
	#rightColumn p.rightNav2{ padding: 1.2em 0; text-align: center; display: block; font-size: 1.2em; }
		#rightColumn p.rightNav2 a { display: block; text-decoration: none; color: #000080; font-weight: bold; margin: 0.3em 0;}
			#rightColumn .rightNav2 a:hover{ color: #0000ff;}
	
/* 5.2 Breadcrumbs */
td#breadcrumbs {padding:0.5em 0 0 3em; text-align: left}
	

/* 6.  ################### Content Wide ###################*/
#contentWide{ vertical-align: top; text-align: center; padding: 0; width: 72.8em;}
	#contentWide div.wideNav { margin: 0 1.6em 1.6em 1.6em;}
		#contentWide div.wideNav p { display: inline; text-align: center; list-style-type: none; padding: 0 2em;  font-size: 1.3em;}
			#contentWide div.wideNav p.five { padding: 0 1em;}
			#contentWide div.wideNav p span { vertical-align: top; display: table-cell; display: inline-table; display: inline-block;}
				#contentWide div.wideNav p span a { font-family: Verdana, Arial, Helvetica, Sans Serif; text-decoration: none; color: #000080; font-size: 0.9em; font-weight: bold;}
					#contentWide div.wideNav p span a:hover { color: #0000ff;}
						#contentWide div.wideNav p span a:link img, 
						#contentWide div.wideNav p span a:visited img{ border-color: #000080;}
						#contentWide div.wideNav p span a:hover img{ border-color: #0000ff;}
						
	#contentWide p.wideNav2{ text-align: center; margin: 0 1.6em;}
		#contentWide p.wideNav2 a{ text-align: center; font-family: Verdana, Arial, Helvetica, Sans Serif; text-decoration: none; color: #000080; font-size: 1em; font-weight: bold;}
			#contentWide p.wideNav2 a:visited{ color: #000080;}
			#contentWide p.wideNav2 a:hover{ color: #0075fd; }

/* 6.1   fastrack table */
	table#fastTrack{ margin: 0 auto;}
		#fastTrack tr td{ background-image:url('/img/common/fast-track-frame-background.jpg'); width: 205px; height: 149px; border: 1px navy solid;}
		
/* 6.2   fastrack & contact forms */		
	/*  to get this working in right pannel  */
	/* #rightColumn #feature{ margin: 0 1.6em 0.8em 1.6em; }*/
	form#contact{ float: left; width: 100%;}
		form#contact fieldset{border-style: solid none none none; border-width: 1px 0 0 0; border-color: #333; padding: 0 2em; display: block; margin: 1em 0; clear:both;}
			form#contact fieldset legend {font-size: 1.5em; margin:0; padding: 0 0.5em}
			form#contact fieldset input,
			form#contact fieldset select {font-size: 1.2em; width: 98%;}
			form#contact fieldset div {width: 21.6em; margin: 1em 0; padding: 0 0 0.5em 0; background-color:#efeff7; border: 1px navy double; float: right;}
				form#contact fieldset div h3 {border-bottom: 1px black solid; padding: 0.4em 1em 0em 1.8em; margin:0 0.5em; background: url(/img/common/icon-info.gif) left center no-repeat; }
				form#contact fieldset div p  {margin: 0.5em 1em 0 1em; padding: 0; font-size: 1.1em; line-height: 1.1em;}
			
			form#contact fieldset table { width:36.4em; float:left; margin: 1em 0;}
				form#contact fieldset table tr td{padding: 0.2em 0;}
					form#contact fieldset table tr td.inputCell { width: 22.3em; vertical-align: bottom;}
					form#contact fieldset table tr td.wide {width: 36.2em; vertical-align: bottom; text-align: center;}
						form#contact fieldset table tr td.wide input {width: auto; margin: 0.5em 1em;}
						form#contact fieldset table tr td.wide textarea {font-size: 1.2em; width: 99%;}
						form#contact fieldset table tr td.wide p {padding: 0;}

					form#contact fieldset table tr td.wide div#files { background-color: transparent; width: 99.4%; border: none; margin: 0.5em 0 0 0;}
						form#contact fieldset table tr td.wide div#files .gFile{margin: 0; padding:0;}
						form#contact fieldset table tr td.wide div#files .remove{vertical-align: super; }
						form#contact fieldset table tr td.wide .add{color: #000080; cursor: pointer; text-decoration: underline; font-size: 1.3em;}
							form#contact fieldset table tr td.wide div#files .remove{color: #000080; cursor: pointer; text-decoration: underline;}
							form#contact fieldset table tr td.wide .add:hover{color: #0075fd; }
							form#contact fieldset table tr td.wide div#files .remove:hover{color: #0075fd; }
						form#contact fieldset table tr td.wide div#files span{ vertical-align: middle;}
				
				
				
					form#contact fieldset table tr td.label {width: 14em; vertical-align: top;}
						form#contact fieldset table tr td.label p {text-align: right; padding: 0.2em 0.8em 0 0;}
				
						form#contact fieldset table tr td label.multi{margin: 0.1em 0 0 0; padding: 0; font-size: 1.2em;}
							form#contact fieldset table tr td label.multi input{ margin: 0.1em 0.3em 0 0.5em; padding: 0; height: 1.0em; width: 1.0em;}


/* 7.  ################### Content ###################*/
#contentBox{ width: 46.4em; height: 1px; vertical-align: top;}
#content{ text-align: left; vertical-align: top; padding: 1em 0em 1em 3em;}
#contentIndent{ width: 46.4em; height: 1px; vertical-align: top; padding-left:30px}

/* 8.  ################### Content & contentWide commons ###################*/
#content *, 
#contentWide * {font-family: Arial, Helvetica, Sans Serif;}


	#content h1, #contentWide h1 {font-size: 1.9em; margin-bottom: 1em;}
	#content h2, #contentWide h2{ font-size: 1.4em; margin: 0.5em 0 0.8em 0;}
	#content h3, #contentWide h3 {font-size: 1.3em; font-weight: bold; margin-bottom: 0.5em;}
	#content p, #contentWide p{ text-align: justify; font-size: 1.3em; padding-bottom: 1em;}

	#content ul, #contentWide ul,
	#content ol, #contentWide ol{padding-left: 3.2em; padding-bottom: 1em;}
		#content li, #contentWide li{ text-align: justify; font-size: 1.3em; line-height: 1.3em;}
			#content ol li ul li, #contentWide ol li ul li,
			#content ul li ul li, #contentWide ul li ul li{ font-size: 1em;}
	
	#content a[href^="http://"]:not([href*="motiontouch.com"]) {background: url(/img/common/external.png) right center no-repeat; padding-right: 12px; }
	#contentWide a[href^="http://"]:not([href*="motiontouch.com"]) {background: url(/img/common/external.png) right center no-repeat; padding-right: 12px; }
	
	#content a, #contentWide a { color: #0000ff;}
		#content a:visited, #contentWide a:visited { color: #000080;}
		#content a:hover, #contentWide a:hover { color: #0075fd;}		


/* 8.1  Jobs boxes  */
	div.jobs { margin: 0 2em 1em 2em;}
		.jobs h3{ margin: 0.4em 0 0 1em;}
		.jobs h3, .jobs h2{text-align: left;}
		.jobs p{ margin: 0 1em; padding:0;}
		.jobs table{ margin: 0 0 1em 0; width: 100%; background-color:#ddd;}
			.jobs table tr.row1 {background-color: #cadbff;}
				.jobs table tr td {padding: 0;}
					#content .jobs table tr td.cellmid p, #contentWide .jobs table tr td.cellmid p{text-align: center;}
					#content .jobs table tr td.celllast p, #contentWide .jobs table tr td.celllast p{text-align: right;}

				#content .jobs table tr td p, #contentWide .jobs table tr td p{padding: 0.2em 0;}



/* 8.2  Downloads boxes  */
	div.downloadCategory { margin: 1em 2em; border-bottom: 1px #0066cc solid; }
		.downloadCategory div{ padding: 0 1em; border-bottom: 1px #a9daff solid; }
		.downloadCategory h2{ margin: 0; padding: 0.5em; background-color: #0066cc; color: #ffffff; text-align: left; }
		.downloadCategory h3{ padding: 0.4em 0 0.2em 0; text-align: left; }
			.downloadCategory h3 span{ color: #d10000; }

/* 8.3  warning box */
div#warning{ border:3px #ff1e00 solid; margin: 0.5em 4em; padding:0.5em 2em; background-color:#ffbfb7;}
	#warning p{ padding:0; text-align:center;}
		#warning p span{ color:red; font-weight:bold;}


/* 8.4  nav3 */
#nav3 table {width:100%}
	#nav3 #nav3left {padding:0 0 0 2em;}
		#nav3 a {text-decoration:none;}
		#nav3 img {border-width: 0;display:block; padding:0; margin:0;}
	#nav3 #nav3right {padding:0 2em 0 0; text-align:right;}
		#nav3 #nav3right img {margin: 0 0 0 auto;}
	#nav3 #nav3bottom {background:#fafafa url('/img/video/nav/nav3bkg.jpg') repeat-x; height:13px;}


/* 8.5  BlueTab */
.blueTab { width: 100%;}

	.blueTab td {border: 1px solid white;  background: #cadbff; padding: 0.2em 1em; margin: 0;}
	.blueTab th {border: 1px solid white;  background: #0066cc; padding: 0 1em;}
	#content .blueTab h3, 
	#contentWide .blueTab h3 {margin: 0; padding: 0.4em 0; color: #ffffff; }
	#content .blueTab p, 
	#contentWide .blueTab p {padding: 0; }


/* 8.6  Addresses tab */
	#contentWide .address td {vertical-align: top;}
		#contentWide .address td p{padding: 0; margin: 0 0.5em 0 0;}
	
	
/* 8.7	CS img styling */
	#content img.logo {display: block; float: right; margin: 0 0 1em 1em; border: 1px #000000 solid;}
	
	#content div.product {text-align: center;}
		#content div.product img {margin: 0.5em;}


/* 9.  ################### Video Boxes ###################*/
#VideoBoxBig{ margin: 0 auto;}
	#VideoBoxBig td{ width: 34.7em; vertical-align: top;}
		#VideoBoxBig tr td div{ margin: 0.8em 1.6em; vertical-align: top;}

			#VideoBoxBig img{ float: left; margin: 0 2.4em 0.8em 0;}
				#VideoBoxBig img.CaseStudies{ float: right; margin: 0 0 0.8em 1.5em ;}
			#VideoBoxBig h3{ text-align: left;}
	
				#VideoBoxBig p.CaseStudies{text-align: justify; padding-bottom: 0; font-size: 1.1em;}
			#VideoBoxBig p{ text-align: center; padding-bottom: 0; font-size: 1.1em;}
				#VideoBoxBig p a{font-weight: normal;}
	
			#VideoBoxBig a{text-decoration: none; font-weight: bold;}
	
			#VideoBoxBig ul{ padding-bottom: 0; }
				#VideoBoxBig ul li{ font-size: 1.1em; line-height: 1.2em; margin-bottom: 0.3em;}

/* 10.  ################### Features Boxes ###################*/

/*  to get this working in right pannel  */
#rightColumn #feature{ margin: 0 1.6em 0.8em 1.6em; }

/*  to get this working in content-wide  */
#content #feature { width: 21.6em; float: right; margin-left: 1.6em; margin-right: -1.6em; }

/*  common styles  */
#feature{clear: both; padding: 0.8em; background-color:#efeff7; border: 1px navy double; font-family: Arial, Helvetica, Sans Serif; }
	#feature h3{ font-family: Arial, Helvetica, Sans Serif; text-align: center; font-size: 1.6em; margin: 0 0 0.8em 0; padding: 0;}
	#feature p{ font-family: Arial, Helvetica, Sans Serif; text-align: center; font-size: 1.3em; margin:0; padding:0; }
	#feature img{ padding: 0; margin: 0.6em; }	

		#feature a:hover{ color: #0075fd;}