@charset "utf-8";
/* CSS Document */

body {
padding: 0;
margin: 0;
font-size: 62.5%;
font-family: "Lucida Sans", "Lucida Sans Unicode", "Microsoft Sans Serif", "Trebuchet MS", Arial, Verdana;
}

#logo_bar_cont, #logo_bar_cont_1 #logo_bar_cont_2 {
height: 97px;
width: 100%;
display: block;
padding: 0;
margin: 0;
top: 0;
background: url(../img/logo_bg.png) bottom repeat-x;
}

	#logo_bar_cont_2 {
	background: url(../img/bg/blue_circles_top.png) right no-repeat;
	}

	#logo_bar {
	width: 85%;
	height: 97px;
	display: block;
	padding: 0;
	background: url(../img/zopio_logo.png) no-repeat left bottom;
	margin: 0 0 0 15%;
	}
		
		a#logo_bar_link, a#logo_bar_link:hover, a#logo_bar_link:active, a#logo_bar_link:visited {
		width: 397px;
		margin: 21px 0 0 0;
		padding: 0;
		border: 0;
		height: 76px;
		display: block;
		float: left;
		vertical-align: bottom;
		}
	
#nav_bar_cont {
height: 30px;
width: 100%;
display: block;
padding: 0;
margin: 0;
background: #fff;
}

	#nav_bar, #foot_nav {
	width: 85%;
	height: 30px;
	display: block;
	padding: 0;
    background: url(../img/zopio_reflection.png) no-repeat left top;
	margin: 0 0 0 15%;
	}
	
	#nav_text, #foot_nav_text {
	height: 16px;
	color: #666;
	float: right;
	text-transform: uppercase;
	font-weight: normal;
	vertical-align: middle;
	text-align: right;
	padding: 7px 0;
	display: block;
	width: 100%;
	margin: 0;
	border: 0;
	}

	#nav_text a, #foot_nav_text a {
	font-size: 1.3em;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: normal;
	margin-right: 24px;
	letter-spacing: 1px;
	color: #888;
	font-family: "Lucida Sans Unicode", "Trebuchet MS", Verdana, Arial, "Microsoft Sans Serif";			
	}
	
	#nav_text a.active_nav, #foot_nav_text a.active_nav{
	color: #333;
	}
	
	#nav_text a:hover, #foot_nav_text a:hover {
	color: #000;
	}
	
#banner_cont {
height: 200px;
width: 100%;
display: block;
vertical-align: top;
font-size: 0.9em;
padding: 0;
margin: 0;
background: 0;
}

	#banner {
	width: 968px;
	height: 200px;
	display: block;
	padding: 0;
	font-size: 0.9em;
	background: url(../img/banner.png) no-repeat left bottom;
	margin: 0 auto;
	}
	
#title_bar_cont {
height: 88px;
width: 100%;
display: block;
padding: 0;
margin: 0;
background: #fff;
}

	#title_bar {
	width: 77%;
	display: block;
	padding-top: 19px;
	height: 72px;
	text-align: left;
	margin: 0 0 0 3%;
	font-size: 3.8em;
	font-family: 'Trebuchet MS', 'Myriad Pro', 'Lucida Sans Unicode', 'Lucida Sans', Arial, 'Microsoft Sans Serif', Verdana;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-color: #000;
	font-weight: normal;
	float: left;
	}
	
	#prev_quiet, #next_quiet {
	height: 88px;
	width: 10%;
	padding: 0;
	margin: 0;
	float: left;
	display: block;
	background: 0;
	}
	
	#next_quiet {
	width: 9.9%;
	}
	
		#prev_quiet a, #next_quiet a {
		height: 88px;
		width: 100%;
		padding: 0;
		margin: 0;
		display: block;
		background: #fff;
		border: 0;
		text-decoration: none;
		}
		
		#next_quiet a {
		  background: url(../img/bg/next_quiet_off.png) top center no-repeat;
		}
		
		#prev_quiet a {
		  background: url(../img/bg/prev_quiet_off.png) top center no-repeat;
		}
		
		#prev_quiet a:hover {
		  background: url(../img/bg/prev_quiet.png) top center no-repeat;
		}
		
		#next_quiet a:hover {
		  background: url(../img/bg/next_quiet.png) top center no-repeat;
		}

		
	
#content_cont, #content_cont_1, #content_cont_2 {
width: 100%;
padding: 0;
display: block;
height: auto;
border: 0;
margin: 0;
background: url(../img/bg/content_top.png) top repeat-x;
}

	#content_cont_1 {
	background: url(../img/bg/blue_circles_mid.png) top right no-repeat;
	}
	
	#content_cont_2 {
	background: url(../img/bg/content_bot.png) bottom repeat-x #fff ;
	}

/* lt. blue bg #f6f6ff */

	#content {
	  width: 100%;
	  padding: 35px 0 0 0;
	  border: 0;
	  margin: 0;
	  background: url(../img/bg/sunburst.png) top left no-repeat;
	}
	
/* CSS for one-column layout */
/* CSS for two-column layout */
/* CSS for three-column layout */
/* CSS for blue blocks */
/* CSS for yellow blocks */
/* CSS for small blocks */
/* CSS for medium blocks */
/* CSS for large blocks */
		
		.col_0, .col_1, .col_2, .col_3 {
		  float: left;
		  display: block;
		  min-height: 200px;
		  padding: 0;
		  background: 0;
		}

		.col_0 {
		  margin: 0 4%;
		}
		
		.col_1 {
		  width: 92%;
		  margin: 0 4%;
		}
		
		.col_2 {
		  width: 44%;
		  margin: 0 0 0 4%;
		}
		
		.col_3 {
		  width: 28%;
		  margin: 0 0 0 4%;		
		}

		.yellow_block, .blue_block {
		  width: 100%;
		  padding: 0;
		  margin: 0 0 28px 0;
		  display: block;
		  border: 1px solid;
		}

     	  .yellow_block, .yellow_title_box {
		    background: #fff url(../img/bg/left_col.png) bottom repeat-x;
		    border-color: #ffebd5 #f90 #f90 #ffebd5;
		   }
		   
		  .blue_block, .blue_title_box {
		    background: url(../img/bg/right_feature_box.png) bottom repeat-x #447bb5;
		    border-color: #dde6f1 #7199c4 #7199c4 #dde6f1 ;
		  }
		  
		    .blue_block {
			  width: 96%;
			  padding: 0 2%;
			}
			
			.blue_block img {
			  width: 100%;
			  border: 1px #dde6f1 solid;
			  margin: 0 auto;
			}
		
		.yellow_block h4, .blue_block h4 {
		  font-size: 2.2em;
		  letter-spacing: 0.05em;
		  text-transform: uppercase;
		  font-weight: normal;
		  font-family: 'Lucida Sans', 'Trebuchet MS',  'Lucida Sans Unicode';
		  padding: 0;
		  margin-bottom: 13px;
		  display: inline;
		}
			
		  .yellow_block h4 {
		    color: #24568d;
          }
		  
		  .blue_block h2 {
		    color: #fff;
			font-weight: normal;
		  }
		  
		  .blue_block h4 {
		  	font-size: 2.2em;
			color: #fff;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			font-weight: normal;
			font-family: 'Lucida Sans', 'Trebuchet MS',  'Lucida Sans Unicode';
			padding: 0;
			margin: 0;
			display: inline;
		  }
			  
		.yellow_block p, .blue_block p {
		  font-size: 1.3em;
		  line-height: 1.8em;
		  font-family: 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif', Verdana;
		  padding: 0;
		  display: block;
		  margin: 0;
		}
			
        .yellow_block p {
		  color: #000;
		}
		
		.blue_block p {
		  color: #dde6f1;
		  font-size: 1.2em;
		  line-height: 1.6em;
		  font-family: 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif', Verdana;
		  padding: 0;
		  display: block;
		  margin: 0 0 10px 0;
		}
		
		  .yellow_block_in, .yellow_block_in_nobg, .blue_block_in, .blue_block_in_nobg {
		    width: 90%;
		    padding: 16px 5%;
		    min-height: 100px;
		  }
		  
		    .yellow_block_in, .yellow_title_box_in {
			  background: url(../img/bg/left_col_logo.png) top right no-repeat;
			}
			
			  .yellow_block_in_nobg, blue_block_in_nobg {
			    background: 0;
			  }
			
			.blue_block_in, .blue_title_box_in {
			  background: url(../img/bg/right_col_title_logo.png) top right no-repeat;
			}			

		
		.yellow_block a, .yellow_block a:active, .yellow_block a:visited {
			text-decoration: underline;
			color: #24568d;
			}
		
		.blue_block a, .blue_block a:active, .blue_block a:visited {
		  text-decoration: underline;
		  color: #fff;
		}
		
		.blue_block a:hover, .yellow_block a:hover {
		  text-decoration: none;
		}
		
		.blue_block a img, yellow_block a img {
			filter:alpha(opacity=75);
			-moz-opacity:0.75;
			opacity:0.75;
		}
		
		.blue_block a img:hover, yellow_block a img:hover {
		  border: 1px #f90 solid;
			filter:alpha(opacity=100);
			-moz-opacity:1;
			opacity:1;
		}
			
			.yellow_block ul, .blue_block ul {
			  margin: 5px 0 0 0;
			  padding: 0;
			  list-style-type: none;
			}
			
			.yellow_block ul li, blue_block ul li {
			  font-family: 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif', Verdana;
			  margin-bottom: .4em;
			  text-transform: none;
			  font-weight: normal;
			  font-size: 1.4em;
			}
			
			  .yellow_block ul li {
			    color: #000;
			  }
			  
			  .blue_block ul li {
			    color: #fff;
			  }
		    
			.yellow_block .footnote, .blue_block .footnote {
			  display: block;
			  font-size: 1.2em;
			  line-height: 1.8em;
			  margin: 20px 0 10px 0;
			  padding: 0 3%;
			  font-family: 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif', Verdana;
			}
			
			  .yellow_block .footnote {
			    color: #555;
			  }
			  
			  .blue_block .footnote {
			    color: #aaa;
			  }
			  
			  .blue_title_box, .yellow_title_box {
			    width: 100%;
			    display: block;
			    margin: 0;
				padding: 0;
				border: 1px solid;
				border-bottom: 0;
			  }
			  	
				.blue_title_box, .yellow_title_box {
				  background: url(../img/bg/right_col_title.png) repeat-x bottom #fff;
		    	  border-color: #dde6f1 #7199c4 #7199c4 #dde6f1;
				}
				
				.yellow_title_box {
		    	  background: url(../img/bg/devel.png) repeat-x top #fb4;
		    	  border-color: #ffebd5 #f90 #f90 #ffebd5;
				  color: #fff;
		   		}
			  			
			    .blue_title_box_in, .yellow_title_box_in {
				  width: 100%;
				  display: block;
				  margin: 0;
				  padding: 15px 0;
				}
				
					.blue_title_box h2, .yellow_title_box h2 {
  					  font-size: 2.7em;
					  text-transform: uppercase;
					  font-weight: bold;
					  letter-spacing: 2px;
					  padding: 0 5%;
					  margin: 0;
					  font-family: 'Lucida Sans', Myriad, 'Lucida Sans Unicode', 'Trebuchet MS';
					}
					
					  .blue_title_box h2 {
					    color: #487cb5;
					  }
					  
					  .yellow_title_box h2 {
					    color: #fff;
					  }
					
					.blue_title_box h4, .yellow_title_box h4 {
					  font-size: 1.3em;
					  font-weight: normal;
					  color: #000;
					  font-family: Verdana, 'Lucida Sans', 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif';
					  padding: 0 5%;
					  margin: 0;
					}
				
				#next_bar, #next_bar_2 {
				  width: 100%;
				  display: block;
				  background: url(../img/bg/next_bar.png) repeat-x bottom;
				  padding: 0;
				  margin: 0 auto 28px auto;
				  border: 1px solid #51667e;
				}
					
					#next_bar_2 {
					  margin: 0;
					  border: 0;
					  background: url(../img/bg/right_col_title_logo.png) right no-repeat;
					}
						
						a#next_link, a#next_link:active, a#next_link:visited {
						  width: 100%;
						  padding: 17px 0;
						  display: block;
						  border: 0;
						  margin: 0;
						  background: url(../img/bg/next_arrows_off.png) right no-repeat;
						  text-decoration: none;
						}
						
						a#next_link:hover {
						  background: url(../img/bg/next_arrows_on.png) right no-repeat;
						}
						
							a#next_link h2 {
							  font-size: 2.7em;
							  text-transform: uppercase;
							  font-weight: bold;
							  color: #fff;
							  letter-spacing: 1px;
							  display: block;
							  padding: 0 5%;
							  margin: 0;
							  font-family: 'Lucida Sans', Myriad, 'Lucida Sans Unicode', 'Trebuchet MS';
							  text-decoration: none;
							}
							
							a#next_link h4 {
							  font-size: 1.3em;
							  font-weight: normal;
							  display: block;
							  color: #f90;
							  letter-spacing: 0;
							  font-family: Verdana, 'Lucida Sans', 'Lucida Sans Unicode', Arial, 'Trebuchet MS', 'Microsoft Sans Serif';
							  padding: 0 5%;
							  margin: 0;
							  text-decoration: none;
							}
						

#foot_nav{
  width: 100%;
  background: #fff;
  margin: 0 auto;
}
	
	#foot_nav_text {
	  float: none;
	  text-transform: uppercase;
	  text-align: center;
	}

	#foot_nav_text a {
	  font-weight: normal;
	  margin: 0 12px;
	}					

#base_board, #base_board_2, #base_board_3, #base_board_blue, #base_board_yellow, #base_board_lt_blue, #base_board_gray {
  width: 100%;
  height: 200px;
  display: block;
  margin: 0;
  background: #fff;
  padding: 0%;
}

	#base_board_blue {
	  background: url(../img/bg/design_inv.png) repeat-x top;
	}

	#base_board_yellow {
	  background: url(../img/bg/devel_inv.png) repeat-x top;
	}
		
	#base_board_lt_blue {
	  background: url(../img/bg/consulting_inv.png) repeat-x top;
	}
	
	#base_board_gray {
	  background: url(../img/bg/hosting_inv.png) repeat-x top;
	}

	#base_board_2 {
	  background: url(../img/bg/bb_logo.png) right no-repeat;
	}
	
		#base_board_3 {
		  background: url(../img/bg/bb_snowflakes.png) center repeat-x;
		}


/*  Tools  */

.clear_all {
  clear: both;
}

  .bold {
    font-weight: bold;
    font-size: 1.1em;
    font-family: Verdana, Arial, 'Microsoft Sans Serif', 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Sans';
  }