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

body{
	background-color: #1eb5fe;
}

* {
	margin: 0;
	padding:0;
}

#wrap {
	width:1020px; 
	height: 922px;
	margin: 30px auto 60px auto;
	background-color: #28282a;
}

#wrap1 {
	width:1020px; 
	height: 703px;
	margin: 50px auto 60px auto;
	background-color: #28282a;
}


#wrap2 {
	width:1020px; 
	height: 770px;
	margin: 50px auto 60px auto;
	background-color: #28282a;
}
/* ==============================Logo box====================================== */

.logo {
	width: 320px;
	height: 115px;
	float: left;
    background-image:url("images/logo.gif");
    background-repeat:no-repeat;
	margin: 10px 0px 0px 0px;
}




.logo_box {
	width: 320px;
	height: 318px;
	float: left;
	margin: 0px 15px 15px 15px;
}

/* ==============================image boxes====================================== */


#graphic_index {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/index_image.jpg");
    background-repeat:no-repeat;
	margin: 0px 15px 15px 0px;
}


#graphic_about {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/about_image.jpg");
    background-repeat:no-repeat;
	margin: 0px 15px 15px 0px;
}


#graphic_webdesign {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/webdesign_main_image.jpg");
    background-repeat:no-repeat;
    margin: 0px 15px 15px 0px;}
	
	
#graphic_stationery {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/stationery_main_image.jpg");
    background-repeat:no-repeat;
    margin: 0px 15px 15px 0px;}	
	
	#graphic_magazines {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/magazine_main_image.jpg");
    background-repeat:no-repeat;
    margin: 0px 15px 15px 0px;}	
	
#graphic_testimonials {
    width:655px; 
    height:318px;
    float:left;
    background-image:url("images/testimonials_main_image.jpg");
    background-repeat:no-repeat;
    margin: 0px 15px 15px 0px;}		
	
	
	
/* ==============================INDEX MIDDLE BOX ====================================== */


.index_middle_box {
	width: 655px;
	height: 355px;
	float: left;
	background-color: #353537;
	margin: 0px 0px 15px 15px;
}	
	
	
.index_middle_box_right {
	width: 320px;
	height: 355px;
	float: right;
	background-color: #353537;
	margin: 0px 15px 15px 0px;
}		
	
	
	
	
	
	

/* ==============================middle boxes====================================== */


.middle_box {
	width: 320px;
	height: 355px;
	float: left;
	background-color: #353537;
	margin: 0px 0px 15px 15px;
}

.about_middle_box {
	width: 320px;
	height: 355px;
	float: left;
	background-color: #353537;
	margin: 0px 0px 15px 15px;
}


/* ==============================bottom boxes====================================== */

.bottom_box{
	width: 320px;
	height: 204px;
	float: left;
	background-color: #353537;
	margin: 0px 0px 15px 15px;
}


/*======================== NAVIGATION========================*/		
		
		
#nav {position: relative;margin:0;padding:0; list-style:none}			
#nav  li {margin: 0; padding: 0;}
#nav a {background-position: 0px 0px; display:block; height:19px;  font-size:0.9em; text-indent:-5000px; width:266px;}
#nav a:hover{background-position: 0px 19px}
#nav a.current:hover{background-position: 0px 0px;}

#nav #home {position:absolute;top:150px;left:40px;}						
#nav #home a{background-image:url("images/home.gif"); }
#nav #home a.current{background-image:url("images/home_on.gif"); }

#nav #about_moo_web_design {position:absolute;top:178px;left:40px;}						
#nav #about_moo_web_design a{background-image:url("images/about.gif"); }
#nav #about_moo_web_design a.current{background-image:url("images/about_on.gif"); }

#nav #website_design {position:absolute;top:206px;left:40px;}						
#nav #website_design a{background-image:url("images/website_design.gif"); }
#nav #website_design a.current{background-image:url("images/website_design_on.gif"); }

#nav #stationery {position:absolute;top:234px;left:40px;}						
#nav #stationery a{background-image:url("images/stationery.gif"); }
#nav #stationery a.current{background-image:url("images/stationery_on.gif"); }

#nav #magazine_design {position:absolute;top:262px;left:40px;}						
#nav #magazine_design a{background-image:url("images/magazine_design.gif"); }
#nav #magazine_design a.current{background-image:url("images/magazine_design_on.gif"); }

#nav #testimonials {position:absolute;top:290px;left:40px;}						
#nav #testimonials  a{background-image:url("images/testimonials.gif"); }
#nav #testimonials  a.current{background-image:url("images/testimonials_on.gif"); }		




/*======================== Email link========================*/	



#email {position: relative;margin:0;padding:0; list-style:none; float:left;}			
#email li {margin: 0; padding: 0; float:left;list-style:none;}
#email a {background-position: 0px 0px; display:block; height:25px;  font-size:0.9em; text-indent:-5000px; width:271px}
#email a:hover{background-position: 0px 25px}
#email a.current:hover{background-position: 0px 25px;}

#email  #email_link {position:absolute;top:280px; left:-295px}						
#email #email_link a{background-image:url("images/email_link.gif"); }
#email #email_link a.current{background-image:url("images/email_hover.gif"); }


#email_second_position {position: relative;margin:0;padding:0; list-style:none; float:left;}			
#email_second_position li {margin: 0; padding: 0; float:left;list-style:none;}
#email_second_position a {background-position: 0px 0px; display:block; height:25px;  font-size:0.9em; text-indent:-5000px; width:271px}
#email_second_position a:hover{background-position: 0px 25px}
#email_second_position a.current:hover{background-position: 0px 25px;}

#email_second_position  #email_second_position_link {position:absolute;top:5px; left:20px}						
#email_second_position #email_second_position_link a{background-image:url("images/email_link.gif"); }
#email_second_position #email_second_position_link a.current{background-image:url("images/email_hover.gif"); }




/*======================== text styles========================*/		


h1{
	font:12px/22px Arial, sans-serif;
	color: #ccc;
	padding: 0px 35px 10px 30px;
	}

h2{
	font:12px/22px Arial, sans-serif;
	color: #ccc;
	padding: 30px 35px 10px 30px;
	}	

h3{
	font:10px/22px Arial, sans-serif;
	text-align:center;
	color: #333333;
	padding: 10px 0px 0px 0px;
	}

h4{
	font:12px/20px Arial, sans-serif;
	color: #ccc;
	margin: 0px 0px 10px 28px;
	
	}	


	
p{
	font:12px/22px Arial, sans-serif;
	color: #ccc;
	margin: 0px 30px 0px 28px;
	}		

	

		
a:link {color: #1eb5fe; text-decoration:underline;font:13px/17px Arial, sans-serif;}	
a:visited {color: #1eb5fe; text-decoration:underline;}			 
a:hover {color:#007b9e; text-decoration:underline;}			
a:active {color: #1eb5fe;;text-decoration:underline;}		
a:focus {color: #1eb5fe; text-decoration:underline;}			


		
.blue{
	font:12px/22px Arial, sans-serif;
	color: #1eb5fe;
	}			
	

.middle_box li {
margin-bottom:10px; }	


.middle_box ul li {
	font:12px/22px Arial, sans-serif;
	color: #ccc;
	margin-left:2.8em;
	padding: 0px 20px 0px 0px;
	list-style: disc; }	


.about_middle_box ul {
	font:12px/22px Arial, sans-serif;
	color: #ccc;
	margin-left:2.8em;
	padding: 40px 0px 0px 0px;; 
	list-style: disc; }	

.about_middle_box ul li {
	padding: 0px 20px 12px 0px;
 }		
 
/*======================== Footer========================*/	 
 
 	#footer {
	width:1020px; 
	height:30px;
	float:left;
		}