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

body {
	overflow: hidden;
	margin:0;
	padding:0;
	background:#E2E2E2;
	font:80% Helvetica, Arial, sans-serif;
	color:#555;
	line-height:180%;
}
h1{
	font-size:180%;
	font-weight:normal;
	}
h2{
	font-size:160%;
	font-weight:normal;
	}	
h3{
	font-size:140%;
	font-weight:normal;
	}	
img{border:none;}

pre{
	display:block;
	font:12px "Courier New", Courier, monospace;
	padding:10px;
	border:1px solid #bae2f0;
	background:#e3f4f9;	
	margin:.5em 0;
	width:500px;
	}		

/* SLIDER */
#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
	}
#slider li{ 
	width:900px;
	height:540px;
	overflow:hidden; 
	}	
#prevBtn, #nextBtn{ 
	display:block;
	width:60px;
	height:550px;
	position:absolute;
	left:920px;
	top:90px;
	}	
#prevBtn{ 
	left: -30px;
	}														
#prevBtn a, #nextBtn a{  
	display:block;
	width:60px;
	height:550px;
	background:url(../../assets/img/slider/btn_prev.png) no-repeat 0 225px;	
	}	
#nextBtn a{ 
	background:url(../../assets/img/slider/btn_next.png) no-repeat 20px 225px;	
	}	
#nextBtn a:hover{ 
	background:url(../../assets/img/slider/next_btn_over.png) no-repeat 20px 225px;	
	}	
#prevBtn a:hover{ 
	background:url(../../assets/img/slider/prev_btn_over.png) no-repeat 0 225px;	
	}	

/* IMAGE REPLACEMENT */
.graphic, #prevBtn, #nextBtn{
	margin:0;
	padding:0;
	display:block;
	overflow:hidden;
	text-indent:-8000px;
	}

/* HEADER */
#centering_box {width: 940px; position: absolute; height: 670px; left: 50%; top:50%; margin: -320px 0 0 -470px;}
#maincontent {width: 900px; position: relative; padding: 0 20px 20px 20px; background: url(../../assets/img/cutcorner.jpg) top right no-repeat #FFF; }
#header {height: 80px; width: 892px; margin-left: 4px; position: relative; }
#banner {margin-top: 20px; float:left; }
#toggle {width: 200px; margin-top: 20px; margin-bottom: 10px; float: left; text-align: right; position: absolute; right: 0; top: 20px; }
.designfocus_down {color: #006FFF;}
.webfocus_down {color: #006FFF;}

/* GRID SYSTEM */
.grid1 {height: 180px; width: 180px;}
.grid2 {height: 360px; width: 360px;}
.grid3 {height: 540px; width: 540px;}

.floatleft {float: left;}

.grid1 a {display: block; height: 180px; width: 180px; margin: 4px;} 
.grid2 a {display: block; height: 352px; width: 352px; margin: 4px;} 
.grid3 a {display: block; height: 532px; width: 532px; margin: 4px;}

a {text-decoration: none; color: #333; font-weight: bold;}

/* ABOUT BOX */
.about {background:url(../../assets/img/about.jpg) no-repeat;}
.about h2 {font-weight: bold; font-size: 260%; color: #fff; line-height: 1.1em; margin: 25px 0 0 25px;}
.about p {margin: 15px 0 0 25px; font-size: 160%; color: #D8D8D8; line-height: 1.1em;}
.about p a {font-weight: bold; text-decoration: none; color: #D8D8D8; margin: 0; line-height: 1.1em; display: inline;}
.about p a:hover {color: #FFFFFF;}