/* Stylesheet "Alpheon" :: v1 (26-05-2008) */
/* Designed & Coded by "LessWorks"  */
/* You may learn from this CSS and use its techniques in your own projects, but the unique combination of images, colors, sizes, typography, and positioning ("the design") is copyright (c) 2008 "Alpheon" and may not be used by anyone but us. */ 

/*
	Style Index
	---------------------
	
	$1 - Site Structure Styles
		$1.1 - General Styles
		$1.2 - Main Layout Styles
		$1.3 - Shared Styles
		
	$2 - Content Styles
		$2.1 - General Content Styles
		$2.2 - Heading Styles
		$2.3 - Paragraph Styles
		$2.4 - Link Styles
		
	$3 - List Styles
		$3.1 - General Lists
		$3.2 - Main Navigation
		$3.3 - Content Lists
		
	$4 - Image Styles
		$4.1 - General Image Styles

	$5 - Table Styles
		$5.1 - General Table Styles
		
*/ 







/*** $1 - Site Structure Styles ***/

		/* 1.1 - General Styles */
		
      * {
        margin:           0;
        padding:          0;
      }
						
		/************************/
	
		/* 1.2 - Main Layout Styles */
			
      body {
        background:       url(../images/bg_body.png) repeat top left #f7f0e9;
        color:            #5f5f5f;
        font-family:      "MS Sans Serif", Arial, Helvetica, sans-serif;
        font-size:        80%;
        line-height:      1.8em;       
        padding:          30px 0;
			}
			
      #container {
        margin:           0 auto;
				width:            980px;
			}
			
      #header {
        background:       url(../images/bg_header.png) no-repeat top center;
        height:           160px;
        padding:          0 80px;
        position:         relative;
			}
			
			#intro {      
        background-image: url(../images/bg_intro.jpg);
        color:            #fff;
        height:           150px; 
        margin:           0 auto 40px auto;          
        padding:          90px 0 0 250px;
        width:            570px;
			}  
			
			#body_home #intro {
        background-position: 0 0;
			}
			
			#body_services #intro {
        background-position: 0 -480px;
			}
			
			#body_customers #intro {
        background-position: 0 -240px;
			}
			
			#body_about #intro {
        background-position: 0 -720px;
			}
			
			#main {
        background:       url(../images/bg_main.png) repeat-y top center;
        min-height:       600px;
        overflow:         hidden;
        padding:          0 80px 15px 80px;
			}                 

      #main_content {
        margin:           0 0 40px 0;
        overflow:         hidden;  
        position:         relative;
      }               

			#body_home #main_content {
        height:           363px;
			}
			
      #content {
        float:            left;     
        width:            580px;
			}    
			
			#benefits {
				background:url(../images/bg_benefits.png) no-repeat top center;
				margin:0 auto;
				height:185px;
				width:821px;
			}      
			              
			#sidebar {
				background:url(../images/bg_sidebar.png) no-repeat top center;
				float: right;     
				padding:10px 20px;
				height:343px;
				width:123px;
			}
			#approach {        
				bottom:1px;
				overflow:hidden;  
				position:absolute;
			}
			.approach {
				background:url(../images/bg_approach.png) no-repeat top center;
				float:left; 
				padding:20px;
				height:90px;
				width:242px;
			}           
			
			.approach.last {
				margin: 0 0 0 10px;
			}
			
 			#subnav {
				background:url(../images/bg_subnav.png) no-repeat bottom center;     
				float:left;
				margin: 0 40px 0 0;
				width:200px;
			}
			
 			#footer{
				background:url(../images/bg_footer.png) no-repeat top center;
				padding:70px 0 0 0;
			}        
			
			.contact_info {
				float:right;
			}
			
			
		/************************/







/*** $2 - Content Styles ***/

		/* 2.1 - General Content Styles */

			a:link, a:visited {
				color:#397438;
        outline:          none;
			}
			
			a:hover {
				color:#000;
        outline:          none;
			}
							
		/************************/
	
		/* 2.2 - Heading Styles */
			
			h1, h2, h3, h4 {
        font-family:      Arial, Helvetica, sans-serif;
				color:#222222;
  				text-shadow:      0 1px #fff; 
 					font-size:1em;
				margin: 0 0 0 0;
			}
			
			h1 {              
				color:#fff;
 				font-size:36px;  
				line-height:1.5em;     
				margin:0 0 0 0;
 				text-shadow:      0 1px #000; 
			}
			
			h2 {        
				color:#383838;
				font-size:20px;
				margin:0 0 0.5em 0;
				letter-spacing:-0.01em;
 			}
			
			h3 {
				clear:both;
				font-size:14px;
			}              
			
			.approach h3 {
				color:#7c5d3e;
 				text-shadow:      0 1px #fff; 
			}
			                                
			#sidebar h3 {
				color:#588315;
 				text-shadow:      0 1px #e0ebce; 
			}    
			
			#subnav h3 a:link, #subnav h3 a:visited {
				background:url(../images/bg_subnav_title.png) no-repeat top center;   
				color:#222222;
				font-size:12px;
				height:43px;  
				display:block;
				line-height:43px;
				padding:0 30px;  
				text-decoration:none;
			}    
			
			#subnav h3 a:hover, #subnav h3 a:active {
				text-decoration:underline;
			}
			
			#benefits h3 {
				color:#40859e;
 				text-shadow:      0 1px #e4f7fc; 
			}

			#body_faq h3, #body_approach h3 {
				font-size:1.6em;
				margin: 0.5em 0 1em 0;
				letter-spacing:-0.01em;
			} 
			
			h3.subtitle {
				font-size:1.3em;
				margin: 1.5em 0 1em 0;
			}                            
			
			h3 span {                 
				color:#666;
				display:block;
				font-size:12px;   
				font-style:italic;
				font-weight:normal;
			}
			
			.faq h3.subtitle {
				margin: 2em 0 0 0;
			}
			
			#body_faq h4 {
				color:#555555;
				font-size: 1em;
			}
			
		/************************/
	
		/* 2.3 - Paragraph Styles */		
			     
			#intro p {      
         font-family:      Arial, Helvetica, sans-serif;
 			font-size:22px; 
				font-weight:bold;
				text-shadow:      0 1px #000; 
				padding: 0 1em 0 0;
			}   
			
			#sidebar p, #sidebar p a {
				color:#fff;               
				font-size:11px;
				text-shadow:      0 1px #61a319;   
				line-height:16px;
			}         
			
			#benefits p, #benefits p a {
				color:#fff;               
				line-height:18px;
				padding:6px 10px 0 0;
				text-shadow:      0 1px #8bc4d9;   
			}

			p {
				clear:both;
				padding: 0 0 1em 0;
			}   
			
			.approach p {
				color:#9f7f5d;
				text-shadow:      0 1px #fff; 
 			}
			
			#footer p {
				color:#ac9680;
				float:none;
				font-size:0.95em;
				text-align:center;
 				text-shadow:      0 1px #fff; 
				
 				word-spacing:0;
			}
					
		/************************/
	
		/* 2.4 - Link Styles */
		
			#header a.logo {
				background:url(../images/logo.png) no-repeat top center;
				display:block;
				height:70px;
				outline:none;
				position:absolute;
				left:80px;
				text-indent:-4000px;
				top:50px;
				width:200px;
			}                
			  
			#approach a:link, #approach a:visited, #benefits a:link, #benefits a:visited, #sidebar a:link, #sidebar a:visited {
				text-decoration:none;              
				
			}
			a:hover p, a:hover h3{
				text-decoration:underline;
			}

		/************************/







/*** $3 - List Styles ***/

		/* 3.1 - General Lists */
		
			ul li{
				list-style:none;
			}
			
		/************************/
	
		/* 3.2 - Main Navigation */
		
			#header ul {
				right:80px;
				position:absolute;
				top:69px;
			}

			#header ul li {
				display:block;
				float:left;
			}
		
			#header li a {
	 			background:url(../images/bg_header_li.png) no-repeat top left;
				display:block;
				float:left;
				color:#c1ae9a;  
				height: 42px;  
				line-height:40px;  
				font-size:14px;
				font-weight:bold;
				padding:0 2em;
				text-decoration:none;       
				text-shadow:      0 1px #fff;
        text-transform:lowercase;
			}

			#header li.first a {
	 			background:url(../images/bg_header_li_first.png) no-repeat top left;
			}

			#header li.last a {
	 			background:url(../images/bg_header_li_last.png) no-repeat top right;
			}

			#header li.last {
	 			background:url(../images/bg_header_li_separator.png) no-repeat top left;
 				padding: 0 0 0 2px;
			}
			
			#header li.current a, #header li a:hover {
 	 			background:url(../images/bg_header_li.png) no-repeat 0 -42px;
				line-height:41px;  
 			}		 
			
			#header li.first.current a, #header li.first a:hover {
	 			background:url(../images/bg_header_li_first.png) no-repeat left -42px;
				color:#c1ae9a;  
		 	}

			#header li.last.current a, #header li.last a:hover {
	 			background:url(../images/bg_header_li_last.png) no-repeat right -42px;
				color:#c1ae9a;  
		 	}
					
			#header li a:hover {
			}		
		
		/************************/
	
		/* 3.3 - Content Lists */
		
			#content ul {
				margin: 0 0 1.8em 0;
			}                       
			
			#content ul ul {     
				color:#888;
				margin: 0.5em 0 0.5em 2em;
			}
			
			#content ul li, #main ol.faq ul li {
				list-style:square;
				margin:0 0 0 1.2em;
				*margin: 0 0 0 1.3em;
				padding: 0;
			}

			
			#content ul#news_overview li {
				margin:1em 0 0 1.2em;
				*margin: 1em 0 0 1.3em;
			}
			
			#content ol li {
 				list-style: none;
			}
			
			#content ol li span {
				font-weight: bold;
			}
			#content ol.faq {
 				list-style: none;
				padding:0.5em 0 2em 0;
			}
			#content ol.faq li {
 				list-style: none;
				padding:1em 0;
			}

			#content ol.faq li p {
 				list-style: none;
				padding:0 0 0.5em 0;
			}

			#content ol.faq li p.back_to_top {
				font-size:11px;
			}
                        

			ul#arrowed_list {
				margin:12px 0 20px 0;
			}
			ul#arrowed_list li {
				background:url(../images/bg_block_arrow.png) no-repeat;  
				list-style:none;
				width:504px;    
				margin:0;
				height:80px;
			}        
			ul#arrowed_list li.last {
				background:url(../images/bg_block_arrow_last.png) no-repeat;  
			}        
			ul#arrowed_list h4 {
				float:left;
				background:none;
				width:158px;
				padding:20px 0 0 0;
				list-style:square; 
				text-align:center;
				height:auto;
			}          
			
			ul#arrowed_list li ul {
				float:right;
				background:none;
				width:290px; 
				padding:14px 20px 0 0;
				list-style:square;
				height:auto;      
				
			}        
			
			ul#arrowed_list li li {
				background:none;
				width:auto;            
				text-shadow:      0 1px #fff;
				list-style:square;   
				line-height:20px;
				height:auto;
			}                     
			
			ul.tools {           
				height:95px;
				padding: 8px 0 8px 170px;
			}       
			
			ul.tools#dashboard {
				background:url(../images/tools1.gif) no-repeat 0 8px;                       
			}

			ul.tools#cockpit {
				background:url(../images/tools2.gif) no-repeat 0 8px;                       
			}

			ul.tools#sitedashboard {
				background:url(../images/tools3.gif) no-repeat 0 8px;                       
			}
			
			#content ul.tools li.title {
				list-style:none;
				margin:0 0 0 0;
			}



			
		/************************/

		#sidebar li {
			height: 120px;
		}  
		
		#subnav ul {
			padding: 0 0 40px 0;
		}                     

		#subnav li {
			background:url(../images/bg_subnav_li.png) no-repeat bottom center;   
			padding:10px 15px 10px 30px;
		}     
		
		#subnav li a {        
			color:#98b774;                      
			font-size:11px;
			display:block;
			text-decoration:none;
			text-shadow:      0 1px #fff;
		}  
		
		#subnav li.current a {
			color:#679241;      
			font-weight:bold;
		}                 
		
		#subnav li a:hover, #subnav li a:active {
			color:#679241;      
			
		}


									/************************/

									#benefits li {
										float:left;
										height: 120px;
										padding:20px 0 0 20px;
										width: 185px;
									}                       







/*** $4 - Image Styles ***/

		/* 4.1 - General Image Styles */
		
			img {
			}
					
			a img {
				border: none;
			}
			
			#main img {
/*				border:1px solid #ccc;
*/				margin: 0.3em 0 0 0;  
				padding:0.5em 0;
			}
			
			#main img.even {
				float:left;
			}                 
			
			#main img.sidebar {
				float:right;
			}
		             
			.content_next_image {
				float:left;
				width:360px;
			}
		/************************/

		/* 4.2 - Overview Image Styles */
		
			#overview {
				background: url(../images/solution-overview.png) no-repeat;
				height: 350px;
				margin: 0 auto;
				position: relative;
				width: 568px;
			}
		
			#overview a {
				position: absolute;
				outline: none;
				text-indent: -4000px;
			}
		
		
			#overview a:link, #overview a:visited {
				border: 1px solid #ddd;
			}
			#overview a.active, #overview a:hover {
				border: 2px solid #444;
			}
		
			#link_power_1 {
				height: 75px;
				left: 8px;
				top: 45px;
				width: 90px;
			}
			#link_power_2 {
				height: 75px;
				right: 5px;
				top: 45px;
				width: 90px;
			}
			#link_website {
				height: 100px;
				left: 219px;
				top: 45px;
				width: 129px;
			}
			#link_alpheon_1 {
				height: 45px;
				left: 115px;
				top: 145px;
				width: 94px;
			}
			#link_alpheon_2 {
				height: 45px;
				left: 359px;
				top: 145px;
				width: 94px;
			}
			#link_grid {
				height: 99px;
				left: 260px;
				top: 180px;
				width: 45px;
			}
		
			.more-info {
				background: #e5f6fd;
				border:1px solid #7fd7f7;
				color:#222222;
				margin: 0 auto;
				padding: 1em;
				position: absolute;
				width: 200px;
				z-index: 4;
 				left: -245px;
 				top: 64px;
			}         
			
			.more-info h3 {
				margin:0 0 6px 0;
			}
		
			#main .more-info ul {
				float: none;
				margin-bottom: 0;
			}

		/************************/

		/* 4.3 - Approach Overview Styles */
		
			#approach-overview {
				border: 1px solid #eee;
				overflow: hidden;
				padding: 0.5em 0.5em 0.5em 1.2em;
			}
		
			#approach-overview div {
				float: left;
				font-size: 0.9em;
				height: 320px;
				border-right: 1px solid #e2e2e2;
				margin: 0 10px 0 0;
				padding: 0 1em 0 0 ;
				text-align: center;
				width: 140px;
			}	
		
			#approach-overview img {
				float: none;
				margin: 0 auto;
				width: 80px;
			}
			#approach-overview div.last {
				border: 0;
				margin: 0;
			}
		
			#approach-overview h3 {
				font-size: 1.2em;
			}
					
			#approach-overview h4, #approach-overview li {
				line-height: 1.5em;
				padding: 0 0 0.5em 0;
				text-align: left;
			}
		
			#approach-overview li.customer {
				background: #e5f6fd;
				color: #222;
				font-weight: bold;
				padding: 0;
			
			}
		
			p.legend {
				margin: 1em 0 0 0;
				font-size: 0.95em;
				font-style: italic;
				text-align: right;
			}
		
			p.legend span {
				font-weight: bold;
				background: #e5f6fd;
				color: #222;
			}

		/************************/








/*** $5 - Table Styles ***/

		/* 5.1 - General Table Styles */
		
			table {
				border-collapse: collapse;
				border: 1px solid #ddd;
				margin: 0 0 2em 0;
			}                      
			
			#facebox table {
				border: 0;
				margin: 0;
			}

			th, td {
				border-bottom: 1px solid #ddd;
				padding: 1em 1em 0 1em;
				vertical-align: top;
			}

			th {
				background: #eaeaea;
				text-align: left;
			}
			#content td ul {
				margin: 0 0 0 1em;
			}
			
			/*** $5 - Form Styles ***/

					/* 5.1 - General Form Styles */

						form br {
							clear:both;
						}       
						
						form {
							width:260px;      
							float:left;
						}

						fieldset {
							background:#fdfdfd;
							padding: 0;
							border: 0; 
						}

						legend {
							display:none;
						}

						label {
							font-weight:bold;
							display:block;
						}

						input, textarea {
							border: 1px solid #ccc;  
							color:#666;
							font-family:Arial, Helvetica, sans-serif;
							font-size:1em;
							padding:0.4em;				
							margin: 0 0 1em 0;  
							width:260px;
						}

						textarea {
							height: 12em;
						}

						input:focus, textarea:focus {
							background:#f1f8e5;
							color:#222;
						}


						button {
							font-size:1.1em;   
							float:right;
							margin:0 0 0 0;
							padding:0 0.5em;
						}            
						
						
						
						
						
						
						
						
						
						
						
						form {
							font-size:1em;
							width:260px;      
							float:left;
							text-align:left;
						}

						/* Elements */


						form fieldset{  
							
							margin:0 0 0.5em 0
						}

						form label {
						    font-weight:bold;
						}

						form fieldset input {
							border: 1px solid #ccc;  
							color:#666;
							font-family:Arial, Helvetica, sans-serif;
							font-size:1em;
							padding:0.4em;				
							margin: 0 0 1em 0;  
							width:260px;
						}

						form .radio input,
						form .checkbox input {
						    width:auto;
						    border:none;
						    margin:0 1.5em 0 0
						 }

						form input, form textarea, form select {
						    margin-bottom:1em;
								border: 1px solid #ccc;  
								color:#666;
								font-family:Arial, Helvetica, sans-serif;
								font-size:1em;
								padding:0.4em;				
								margin: 0 0 1em 0;  
								width:260px;
						 }

						form .radio label, form .radio input,
						form .checkbox label, form .checkbox input {
						    display:inline;
						    margin:0 1.5em 0 0
						}

						form .radio input, form .checkbox input {
						    margin:0 0.3em 0 0
						}

						/* Button */

						form button {
							font-size:1.1em;   
							float:right;
							margin:0 0 0 0;
							padding:0 0.5em;
						}


						/* information */

						form .formInfo {
						    margin-bottom:1em;
						    padding-bottom:0.5em;
						}

						form .formInfo h2 {
							color:#00889e;
							font-weight:bold;
							font-size:1.2em;
							margin-bottom:1em
						}

						form .formInfo p{
							text-align:justify
						}

						form .required {
							color:#ff3838;
							font-weight:bold;
							font-size:0.8em
						}

						input[type="hidden"] {
						 	display:none;
						}

                          						/* Simple Form CSS */

						.message-box { text-align: center; padding: 5px; color:#545454;  margin:5px auto 20px auto; }  

						.clean { background-color: #efefef; border: 1px solid #dedede;}
						.info  { background-color: #f7fafd; border: 1px solid #b5d3ff;}
						.ok    { background-color: #d7f7c4; border: 1px solid #82cb2f;}
						.alert { background-color: #fef5be; border: 1px solid #fdd425;}
						.error { background-color: #ffcdd1; border: 1px solid #e10c0c;}

						form .error { border: 2px solid #e10c0c; } /* js error class */