/* =Layout - display properties, floats, positioning, widths, hights, margins and paddings
version: 1.0
Author: Ekadoo, inc.
email: info@ekadoo.com
--------------------------------------------------------------------------------------- */
/* imports come always first
-----------------------------------------------------------------------------------------*/


/* :TODO: Remember to remove this ruler before the site goes life 
   :TODO: Remember to optimize the styles after the final testings done at cssoptimizer.com */
body {
	 /* background-image: url(/images_HTML/layoutgrid.png); */ 
	 background:#f3f3f3; 
}

/* Clearing element for a float: this fix uses a break in the markup as a clearing element, but it ensures that the break does not disturb the layout by reducing its values to 0. Add this class to breaks as needed to clear a float. Please note that the container of the break needs a dimension on it. */
.brclear { 
     clear:both; 
     height:0; 
     margin:0;
     font-size: 1px;
     line-height: 0;
}




/* Normalizes margins
------------------------------------------------------------------------------------------ */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td 
{ margin:0; padding:0; }	

/* Removes list-style from lists
------------------------------------------------------------------------------------------- */
ol, ul
{ list-style: none; }
/* Normalizes font-style and font-weight to normal
------------------------------------------------------------------------------------------- */
address, caption, cite, code, dfn, em, strong, th, var
{ font-style: normal; font-weight: normal; }
/* Removes border from fieldset and img
------------------------------------------------------------------------------------------- */
fieldset, img
{ border: 0; }
/* Left-aligns text in caption and th
------------------------------------------------------------------------------------------- */
caption, th
{ text-align: left; }
/* Removes quatation mark from q
------------------------------------------------------------------------------------------- */
q:before, q:after
{ content: ''; } 

/* Reserved links
------------------------------------------------------------------------------------------ */
	.reserved {
	visibility: hidden;
	}
/* =Not Displayed
------------------------------------------------------------------------------------------ */
	.not_displayed {
	display:none;
	}

/* =Fixed-pixel-width layout, width = 767 pixels
------------------------------------------------------------------------------------------- */

	body {	  
		text-align:center;
		min-width:767px;
		margin-top:10px;
		}
/* =Wrapper centers the content
------------------------------------------------------------------------------------------- */
	#wrapper {
		width:767px;
		margin:0 auto;
		text-align:left;
		}

/* =Masthead and FLASH Header movie
-------------------------------------------------------------------------------------------- */	
	#masthead {
	width:767px;
	height:153px;
	position:relative;
	border-top: 2px solid #FFFFFF;
	border-bottom: 18px solid #F3F3F3;
		}

/* =Flash inside the masthead
-------------------------------------------------------------------------------------------- */
	#flash {
  	position: relative;
  	z-index: 0;
	}	
		
/* =Branding. Taking our of the view Company name and slogan
-------------------------------------------------------------------------------------------- */
	#branding h1, #branding blockquote {
		position:absolute;
		top:-9999px;
		}			
		
		
/* =Main navigation buttons
--------------------------------------------------------------------------------------------- */	
	#nav_main {
	width:767px;
	position:absolute;
		z-index:4;
		top: 136px;
	}

	#nav_main ul {
	width:767px;
	margin:0;
	padding:0;
	float:left;
	/* border:1px solid red; */
	background: url(../../images_HTML/2px_dot_21455F.gif) repeat-x left 17px;
	}
/* =Gap li removal by float 
--------------------------------------------------------------------------------------------- */	
	#nav_main li {
	display:inline;
	float:left;
		}	
				
		
/* =Hints (Main) navigation buttons
------------------------------------------------------------------------------------- */
	
	#nav_hints {
	width:400px;
	position:absolute;
		z-index:5;
		top: 157px;
		left: 3px;
		}
	
	#nav_hints li {
	display:inline;
	padding-left:3px;
	} 
/* =Hint page C1.TV and Print command
--------------------------------------------------------------------------------------------- */
	#c1_hint_print {
	width:347px;
	height:24px;
	position:absolute;
	z-index:7;
	top: 156px;
	left:420px;
	}

	#c1_hint_print li {
	display:inline;
	}
			
	li#page_hint {
	width:200px;
	position:absolute;
	left:67px;
	}
	li#print {
	position:absolute;
	left:280px;
	height:24px;
	z-index:10;
	}
	
			
			
/* =Top main navigation links
--------------------------------------------------------------------------------------------- */
	
	#nav_main_top ul {
	position:absolute;
	z-index:1;
	left: 170px;
	top: -17px;
	width: 387px;
		}
	
	#nav_main_top li {
		display:inline;
		padding-left:10px;
		}		
		
/* =Reserved links for main navigation
-------------------------------------------------------------------------------------------- */
	#nav_reserved ul {
	position:absolute;
	z-index:2;
	left: 430px;
	top: 9px;
	width: 323px;
		
		}
	
	#nav_reserved li {
		display:inline;
		padding-left:15px;
		}


/* =Search area
-------------------------------------------------------------------------------------------- */
	#search_form {
		background:#FFFFFF;
		padding-left:587px;
		margin-top:10px;
		padding-top:7px;
		}
	
	#search_form p {
		display:inline;
		padding-left:10px;
	}
	#search_input {
		width:6em;
		height:16px;
		border:1px solid #B1B1B1;
		font-size:1em;
		}
	
		
/* =Site Info
--------------------------------------------------------------------------------------------- */
	#site_info {
		clear: both;
		width: 767px;
		padding: 10px 0 10px 0;
		border-top:1px solid #cccccc;
		}
/* =Nav B
---------------------------------------------------------------------------------------------- */
	#nav_B {
		float:left;
		width:163px;
		margin:0;
		padding:0;
		}
		
/* =B department moved 22 pixels to the right 
----------------------------------------------------------------------------------------------- */
/* =Gain 22 pixels fromm the left padding
----------------------------------------------------------------------------------------------- */
	#nav_second ul {		
		/* padding-left:22px; */
		padding-left:0; 
		padding-top:20px; 
		margin:0;
		}
		
	#nav_second ul li {
	display:block;
	line-height: 1.6em;
	padding-bottom:1em;
	}					
	
/* =Two steps tree
----------------------------------------------------------- */	
		
		
	#current_B ul  {
	background: #FFFFFF;
	padding:0;
	margin:0;
	border-top: 1px solid #cccccc;
	border-bottom: 18px solid #cccccc;
	}
	
	#current_B ul li {
	padding:0px;
	margin:0;
	display:block;
	line-height: 1.2em;
	background: url(../../images_HTML/gray_18x18.gif) repeat-y left top;
		}
		
	#current_B ul h5 {
	font-weight:bold;
	color:#21455B;
	padding-left:26px;
	padding-bottom:10px;
	padding-top:3px;
	background: url(../../images_HTML/Arrow_D_Red_Gray.gif) no-repeat left top; 
	}	
	
		
		
/* =Content
---------------------------------------------------------------------------------------------- */
/* =Gain 22 pixels +581 = 603
---------------------------------------------------------------------------------------------- */
	#content {
	width:603px;
	float:right;
	background:url(../../images_HTML/bg_content.gif) repeat-y left top; 
	border-left: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC; 
		}                                                                 		
		
			
/* =Content Main
---------------------------------------------------------------------------------------------- */
/* =Gained or new width is 414px and 1 px breath each side left
---------------------------------------------------------------------------------------------- */
	#content_main {
	width:414px;
	float:left;
		}

/* =Pages Numbers Bar
---------------------------------------------------------------------------------------------- */
	#pages_num ul {
		padding-left:305px;
		margin:0;
		}
	
	#pages_num li {
		display:inline;
		float:left;
		
		}

/* =Content C1.TV
---------------------------------------------------------------------------------------------- */
/* =Cells 1 2 layout
---------------------------------------------------------------------------------------------- */
	
	
	#content_c1TV li {
	display:inline;
	float:left;
	/* border:1px solid red; */ 
	}
/* =Cell 1
---------------------------------------------------------------------------------------------- */
	#cell1 {
	width:280px;
	}
	#cell1 h2 {
	padding:0 0px 0px 16px;
	margin-top:0px;
	padding-bottom:10px; /* to free up space before a paragraph */
	}
/* =Cell2
--------------------------------------------------------------------------------------------- */
	#cell2 {
	width:110px;
	}
	
	#cell2 h6 {
	font-weight:normal;
	padding-top:7px;
	}

/* =Main C1.TV content area
----------------------------------------------------------------------------- */	
	#cell3 {
	width:414px;
	padding: 5px 0 15px 0;
	clear:both;
	}

/* =Screen and caption on the right side
------------------------------------------------------------------------------------------- */	
	#left {
	width:206px;
	}
	#right {
	width:206px;
	}
/* =Image on the right side (w=204px; H<=206px)
------------------------------------------------------------ */	
	#cell3 li img {
	border:0;
	margin:0;
	padding:0;
	width: 204px;
	}
/* =Text on the left or right side
------------------------------------------------------------ */	
	li#left p, li#right p {
	padding:0 10px 0 14px;
	}
	
/* =Caption under right or left image
-------------------------------------------------------------------------------------------- */	
	li#cell3 li#right blockquote, li#cell3 li#left blockquote, li#tab_content blockquote {
	color:#10567C;
	padding-top:5px;
	margin:1px 13px;
	background: url(../../images_HTML/bg_dotted.gif) repeat-x left top;
	font: 1.1em Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-weight:bold;
	letter-spacing:0.03em;
	}	
	
/* =Video or wide two cells image with ccaption
--------------------------------------------------------------------------------------------- */	
	#flash_sml {
	width:320px;
	margin: 15px 0 20px 47px;
	}
	
	#cell3 img {
	width: 370px;
	margin: 10px 0 0px 22px;
	}
	
	li#cell3 blockquote {
	color:#10567C;
	padding-top:5px;
	margin:0 22px 0px 22px;
	/* background: url(../../images_HTML/bg_dotted.gif) repeat-x left top; */
	font: 1.1em Georgia, "Times New Roman", Times, serif;
	font-style: italic;
	font-weight:bold; 
	letter-spacing:0.03em;
	}	
	
/* =Back to top
---------------------------------------------------------------------------------------------- */
	#jumptotop {
	clear:both;
	}

	
/* =Clearing the C1.TV area
---------------------------------------------------------------------------------------------- */
/* =Content C2.Tabs area
---------------------------------------------------------------------------------------------- */
/* =Navigation C2.Tabs
---------------------------------------------------------------------------------------------- */
	#nav_c2Tabs {
	clear:both;
	/* margin-bottom:0px; */
	}
	#nav_c2Tabs ul {
	margin:0px;
	padding:0px;
	width:414px;
	float:left;
	background: url(../../images_HTML/Gray_cccccc.gif) repeat-x left 18px; 
	/* border:1px solid red; */
	}
	
	#nav_c2Tabs ul li {
	/* line-height:200%; */
	float:left;
	padding-bottom:1px; /* to add a little bit air at the bottom */
	/* text-align: center; */
	}
	
	
/* =Text Template for C2.Tabs content area
---------------------------------------------------------------------------------------------- */
	#content_c2Tabs {
	width:396px;
	/* border:1px solid red; */
	margin:0 auto;
	padding-bottom:10px;
	padding-top: 20px;
	}
		
	#content_c2Tabs h3 {
	width:280px;
	padding:0 0 20px 7px;
	/* border:1px solid green; */
		}
		
	#content_c2Tabs h3 span {
	font-weight:normal;
	font-style: oblique;
	}

/* =Common top area for all C2.Tabs pages
---------------------------------------------------------------------------------------------- */	
	li#tab_common h3 {
	float:left;
	width:250px;
	padding:0 0 20px 7px;
	padding-top:10px; /* to give more space after nav C2.tab */
	/* border:1px solid red; */
	}
	
	
	li#tab_enlarge h6 {
	float:right;
	width:120px;
	font-weight:normal;
	padding:0 16px 19px 0;
	/* border:1px solid red; */
	padding-top:11px; /* to make it even with the title to the left */
	}
/* =End of the common top area for all C2.Tabs pages
--------------------------------------------------------------------------------------------- */
/* =Clear for everything under enlarge screen in Tab area
____________________________________________________________________________________________ */
	li#tab_content	{
	clear:both;
	} 
	
	#content_c2Tabs ul li p {
	width:380px;
	padding:0 10px 25px 6px;
	/*background-image: url(../../images_HTML/bg_dotted.gif);
	background-repeat: repeat-x;
	background-position: left 93%; */
	}	
		
			
	#content_c2Tabs h6, li.pop_up_stream h6, li.pop_up_flv h6, li.pop_up_image h6, li.pop_up_video h6, li.pop_up_screen h6, li.pop_up_form h6 {
	text-align:right;
	padding-right:10px;
	padding-top: 10px;
		}
		
	li.pop_up_stream h6 a:link, li.pop_up_flv h6 a:link, li.pop_up_stream h6 a:visited, li.pop_up_flv h6 a:visited, #content_c2Tabs h6 a:link, #content_c2Tabs h6 a:visited, li.pop_up_image h6 a:link, li.pop_up_image h6 a:visited, li.pop_up_video h6 a:link, li.pop_up_video h6 a:visited, li.pop_up_screen h6 a:link, li.pop_up_screen h6 a:visited, li.pop_up_form h6 a:link, li.pop_up_form h6 a:visited {
	color:#D00000;
	padding-right:10px;
	padding-bottom:20px;
	}	
		
	li.pop_up_stream h6 a:hover, li.pop_up_flv h6 a:hover, #content_c2Tabs h6 a:hover, li.pop_up_image h6 a:hover, li.pop_up_video h6 a:hover, li.pop_up_screen h6 a:hover, li.pop_up_form h6 a:hover {
	text-decoration:underline;
	}
	
/* =Back to top inside the table
------------------------------------------------------------------------ */

	td#back_to_top h6, td#back_to_top h6 a:link, td#back_to_top h6 a:visited {
	padding:10px 0 0 0;
	font-size:0.99em; 
	}
		
	
	
	
	
/* =Enlarge screen/image for C2.Tabs
---------------------------------------------------------------------------------------------- */	
	li#tab_enlarge h6 a:link, li#tab_enlarge h6 a:visited {
	color:#3f3f3f;
	padding-right:20px;
	}
	
	li#tab_enlarge h6 a:hover {
	color:#D00000;
	text-decoration:none;
	}
	
/* =Table Template for C2Tabs area
---------------------------------------------------------------------------------------------- */

	#tech_data {
	width:396px;
	/* border:1px solid red; */
	margin:0 auto;
	border-top:1px solid #d1d1d1;
	border-bottom:1px solid #d1d1d1;
		}
		
	#tech_data td {
	padding:3px 2px 5px 5px;
	line-height: 120%;
	}

	#tech_data #col1 {
	width:34%;
	}
	
	#tech_data #col2 {
	width:18px;
	}

/* =Image Temaplate for C2.Tab Area
--------------------------------------------------------------------------------------------- */
	li#tab_content img {
	margin:0 10px 5px 10px;
	width: 376px;
	}

	
		
/* =Departments D1-D5
---------------------------------------------------------------------------------------------- */
/* =Gain some pixels 8px = 193-185 from the right D side
---------------------------------------------------------------------------------------------- */

	#nav_suppl {
		width:186px;
		float:right;
		/* background:#f3f3f3; */
		}
	
/* =Width for all D departments 185px
---------------------------------------------------------------------------------------------- */
	#nav_suppl ol {
	width:185px;
	}
		
/* =Spread between categories 15px
---------------------------------------------------------------------------------------------- */
		
	#dep_d1, #dep_d2, #dep_d4, #dep_d5 {
		margin-bottom:15px;
		}		
		
	#dep_d3 {
		margin-bottom:18px;
		}
		
		
		
		
		
/* =Icons positioning
---------------------------------------------------------------------------------------------- */	
	
	#home img {
		position:relative;
		top:1px;
		}
	
/* =Fix by Dmitrii request: added li#tab_content h6.backtotor a img,
--------------------------------------------------------------------------------------------- */	
	li#tab_content h6.backtotop a img, li h6.backtotop a img {
		width:18px;
		height:18px;
		position:relative;
		top:-1px;
		right:0px;
		float:right;
		}



	li h6.enlarge a img {
	width:9px;
	height:9px;
	position:relative;
	top:2px;
	left:6px;
		}


		td#back_to_top img {
		width:18px;
		height:18px;
		position:relative;
		top:-1px;
		right:0px;
		float:right;
		}

			
	#qms img {
		position:relative;
		top:5px;
		right:16px;
		float:right;
		}
	#links img {
		position:relative;
		top:-9px;
		right:6px;
		float:right;
		margin-bottom:-10px;
		}			
	#pdfs img, #pdfs_client img {
		position:relative;
		top:-21px;
		right:9px;
		float:right;
		margin-bottom:-10px;
		}
	#videos img, #videos_client img {
		position:relative;
		top:1px;
		right:5px;
		float:right;
		}								
		
/* creates a 9px gap from the left side
---------------------------------------------------------------------------------------------- */
	#nav_suppl ol li {		
		 padding-left:9px; 
		}
	#nav_suppl ul li {		
		padding-left:0px; 
		}								



/* =QMS
---------------------------------------------------------------------------------------------- */


	#qms ul {
		padding:20px 0 15px 0;
		margin:0;
		}

	
	#qms ul li {
	border-bottom: thin solid #21455F;
	}
	

/* =D1 area
---------------------------------------------------------------------------------------------- */
#dep_d1 ul {
	margin:0px;
	padding:0px;
	}
	
	#dep_d1 li {
	margin: 8px 0;
	padding-top: 1px;
	background: url(../../images_HTML/bg_dotted.gif) repeat-x left bottom;
	}	


/* =D2 area
---------------------------------------------------------------------------------------------- */
	 h4#contact_us {
		color:#D00000;
		padding:0 0 6px 6px;
		}

	#dep_d2 ul li {
	padding-left:6px;
	}
	#dep_d2 ul li blockquote {
	padding-left:6px;
	color:#D00000;
	}
	#dep_d2 ul li h3 {
	padding-top:4px;
	}
				
/* =D3 area
----------------------------------------------------------------------------------------------- */
	#dep_d3 input {
	width:6em;
	border:1px solid #B1B1B1;
	margin-left:6px;
	} 
	
	#dep_d3 input#email {
	width:150px;
	margin-left:5px;
	}
	
	
	input#login, input#logout {
	margin-top:2px;
	margin-left:90px;
	font-size:0.95em;
	} 
	
	input#logout {
	margin-left:110px;
	} 
	
	#dep_d3 ul li p {
	width: 170px;
	padding-left:6px;
	padding-bottom:3px;
	margin:0;
	font-style:oblique;
	font-family: Georgia, "Times New Roman", Times, serif;
	}
	
	#dep_d3 ul li blockquote {
	width:150px;
	padding:2px 0 2px 4px;
	margin-bottom:0;
	color:#21455f;
	/* font-weight:bold; */
	font-size: 0.95em;
	line-height: 120%;
	}
	
	
	#dep_d3 ul li {
	margin: 8px 0;
	padding-left:0px;
	color: #21455F;
		}
		
	li.loginerror_step1 {
	background: url(../../images_HTML/bg_dotted.gif) repeat-x 0 bottom;
	}
		 		  

/* =D4 area
--------------------------------------------------------------------------------------------- */
	#dep_d4 ul, #dep_d4_client ul, #dep_d5_client ul {
	margin:0px;
	padding:0px;
	padding-bottom:6px;
	}
	
	#dep_d4 li, #dep_d4_client li {
	margin: 8px 0;
	padding-top: 1px;
	background: url(../../images_HTML/bg_dotted.gif) repeat-x 0 80% !important;
	background-position:0 75%; /* Hack for Internet Explorer */
	}
	
/* =D5 area
--------------------------------------------------------------------------------------------- */
	#dep_d5 ul {
	margin:0px;
	padding:0px;
	padding-bottom:6px;
	}
	#dep_d5 li, #dep_d5_client li {
	margin: 8px 0;
	padding-top: 1px;
	background: url(../../images_HTML/bg_dotted.gif) repeat-x 0 80% !important;
	background-position:0 75%; /* Hack for Internet Explorer */
	}	
	
/* =Pop Up holder
--------------------------------------------------------------------------------------------- */
		/* #pop_up {
		width:100%;
		/* margin-bottom:1000px; */
		/* position:relative; 
		}	*/

/* =Pop Up classes
---------------------------------------------------------------------------------------------- */	
		li.pop_up_mainloader {
		width:600px;
		margin:0 auto;
		background: url(none);
		}
		
		li.pop_up_mainloader p {
		padding-top:20px;
		/*padding-bottom:30px;*/
		}
		
		
		
		
		li.pop_up_image {
		width:600px;
		margin:0 auto; 
		background: #ffffff;
		border:1px solid #D8D8D8;
		/* position:relative;
		top:0px;
		z-index:1000; */
		}
		
		li.pop_up_stream,
		li.pop_up_flv {
		width:962px;
		margin:0 auto;
		background: url(none);
		}
		
		li.pop_up_video {
		width:720px;
		margin:0 auto;
		background: url(none);
		}
		
		li.pop_up_screen {
		width:900px;
		margin:0 auto;
		/* position:relative;
		top:0px;
		z-index:1000; */
		}
		
		li.pop_up_form {
		width:552px;
		margin:0 auto;
		/* padding: 0 10px; */
		background: #d7dee3;
		border:1px solid #b1b1b1;
		/* position:relative;
		top:0px;
		z-index:1000; */
		}
		
		
		li h6.closewindow a img {
		width:18px;
		height:18px;
		position:relative;
		top:-1px;
		right:0px;
		float:right;
		}
		
		li.pop_up_stream h6, li.pop_up_flv h6, li.pop_up_image h6, li.pop_up_video h6, li.pop_up_screen h6, li.pop_up_form h6  {
		margin-bottom:15px;
		}
		
/* =New cLient form table
------------------------------------------------------------------------------- */
	table#newclient {
	width:530px;
	background:#e9edef;
	border:1px solid #cad3d9;
	margin-left:10px; /* to make it even left and right  in Firefox, Opera */
	margin-bottom:10px;
	}
	
	.light_background {
	background:#F4F5F7;
	}
	
	table#newclient td, table#newclient tr {
	color:#21455F;
	padding:4px 6px 4px 12px;
	text-align:left;
	}
	
	table#newclient td span {
	/* font-family: Georgia, "Times New Roman", Times, serif; */
	font-style: oblique;
	}
	
	table#newclient td#cell_a, table#newclient td#cell_b {
	width: 265px;
	border-bottom:2px solid #21455f;
	padding-top:5px;
	}
	table#newclient label {
	text-align:left;
	}
	
	table#newclient input {
	color:#003366;
	}
	
	.width100 {
	width:100px;
	}
	table#newclient input#submit {
	float:right;
	/* margin-right:10px; */
	margin-bottom:10px;
	}
	
	table#newclient tr:hover {
	color:#21455F;
	background: none;
	}
	
	.back_pattern {
	background: url(../../images_HTML/repeat_All.gif) repeat;
	}
	
	table#newclient caption {
	font-size:1.4em;
	font-weight:bold;
	color:#21455f;
	margin-left:10px; /* to make it even left and right  in Firefox, Opera */
	margin-bottom:15px;
	}
	
	table#newclient h4 {
	font-size:1em;
	}
	
	table#newclient a {
	color:#D00000;
	}

/* =Testimonials
------------------------------------------------------------------------- */
#testimonials{
	padding:1px 1px 17px 1px;
	width:150px;
	margin:0 0 14px 0;
}
#testimonials h3{
	display:block;
	height:23px;
	overflow:hidden;
	margin:0;
	text-align:left;
	padding-left:15px;
}
#testimonials p{
	padding:0 10px;
	margin:10px 0 0 0;
}
#testimonials img{
	margin:17px 0 0 0;
}
