body { 
	background-color: #fff; 
	color: #555555; 
	line-height: 22px; 
	font-family: Century Gothic; 
	font-size: 12px;  
}

.boxy {
 min-height:300px;
 margin:20px;
 padding:30px 0 30px 450px;

}

.boxy1 {
 min-height:300px;
 margin:20px;
 padding:30px 0 30px 450px;
 background: url(images/illubg.png) no-repeat 0 140px; 
}

.boxy2 {
 min-height:300px;
 margin:20px;
 padding:30px 0 30px 450px;
 background: url(images/identitybg.png) no-repeat 0 140px; 
}

.boxy3 {
 min-height:300px;
 margin:20px;
 padding:30px 0 30px 450px;
 background: url(images/webbg.png) no-repeat 0 140px; 
}

.social {
 min-height:300px;
 margin:20px;
 padding:30px 0 30px 80px;
}

.social a {
	text-decoration: none;
	outline:none;
}

.social a:hover {
	text-decoration: none;
	outline:none;
}



.social img{
	outline: none;
	border: none;
	margin: 80px 0 0 70px;
}


#wrap { 
	width: 960px; 
	margin: 20px auto; 
	background: #fff url(images/bg.png) repeat 0 0; 
	border: 2px solid #d0d0d0;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 border-radius: 10px;
 -moz-box-shadow: 0px 0px 10px #ddd;
 -webkit-box-shadow: 0px 0px 10px #ddd;
 box-shadow: 0px 0px 10px #ddd;
}


h1, h2, h3, h4, h5, h6 { 
	font-weight: normal; 
}

h1 { 
	font-size: 40px; 
	margin: 20px 0 15px 0; 
}

h2 { 
	font-size: 26px; 
	margin: 20px 0 15px 0; 
}

h3 { 
	font-size: 22px; 
	margin: 20px 0 15px 0; 
}

h4 { 
	font-size: 18px; 
	margin: 20px 0 10px 0; 
}

h5 { 
	font-size: 16px; 
	margin: 20px 0 5px 0; 
}

h6 { 
	font-size: 14px; 
	margin: 0; 
}

a { 
color: #e86e14; 
text-decoration: none;
outline:none;
}

a:hover { 
color: #555555; 
}

p {
	margin: 0 0 15px 0; 
}

.line { 
	clear: both; 
	background: url(images/line.png) no-repeat; 
	width: 842px; 
	height: 2px; 
	margin: 40px 0 35px 88px; 
}

#header-top { 
	background: url(images/header-top.png) no-repeat; 
	width: 1020px; 
	height: 77px; 
	margin: 40px 0 0 0; 
}

#header { 
	height: 260px; 
}

#header #header-content { 
	float: left; 
}

#header #header-img { 
	float: right; 
	background: url(images/image-bg.png) no-repeat; 
	width: 260px; 
	height: 260px; 
	margin: 0 85px 0 0; 
}

#header #header-img img { 
	margin: 10px 0 0 10px; 
}

#header h1 {  
	background: url(images/name2.png) no-repeat; 
	width: 381px; 
	height: 53px; 
	text-indent: -9999px; 
	margin: 2px 0 0 85px; 
}

#header #contact-details { 
	font-size: 20px; 
	margin: 20px 0 0 90px; 
}

#header p { 
	margin: 0 0 5px 0; 
}

#header p .grey { 
	color: #aaaaaa; 
}

#header #about-me { 
	margin: 33px 0 0 90px; 
}

#header #about-me h2 {  
	font-size: 20px; 
}

#header #about-me p { 
	font-size: 14px; 
	color: #666666; 
	width: 500px; 
}

#content .section { 
	margin: 0 0 0 85px; 
}

.illustration { 
	float: left; 
	background: url(images/illustration.png) no-repeat; 
	width: 196px; 
	height: 46px; 
	text-indent: -9999px; 
	margin:0 0 0 0; 
}

.identity { 
	float: left; 
	background: url(images/identity.png) no-repeat; 
	width: 196px; 
	height: 46px; 
	text-indent: -9999px; 
	margin: 0 0 0 0; 
}

.web { 
	float: left; 
	background: url(images/web.png) no-repeat; 
	width: 196px; 
	height: 46px; 
	text-indent: -9999px; 
	margin: 0 0 0 0; 
}

#content .section .contact { 
	float: left; 
	background: url(images/contact.png) no-repeat; 
	width: 196px; 
	height: 46px; 
	text-indent: -9999px; 
	margin: 0 0 0 0; 
}

#content .section img { 
	float: left; 
	margin: -2px 0 0 20px; 
}

#content .section .section-content, #content .section-standard .section-content { 
	float: left; 
	width: 450px; 
	margin: 3px 0 10px 70px; 
}

#content .section-standard .section-content { 
	margin-left: 0px; 
}

#content .section .section-content h3, #content .section-standard .section-content h3 { 
	color: #e86e14; 
	margin: 0 0 3px 0; 
}

#content .section .section-content h4, #content .section-standard .section-content h4 { 
	margin: 0 0 12px 0; 
}

#footer { 
	clear: both;
	background: url(images/footer.png) no-repeat; 
	width: 1020px; 
	height: 76px; 
	margin: 0 0 30px 0; 
}

/*Navigation*/

ul#calloutnav { 
 background: #000;
 margin:50px 0 0 0px;
 padding: 0 16px 1px;
 opacity: 0.6;
 list-style: none;
 -moz-box-shadow: 0 0 10px #000;
 -webkit-box-shadow: 0 0 10px #000;
 box-shadow: 0 0 10px #000;
 border: 2px solid  #CCC;
 border-left: none;
 border-radius: 10px;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;

-moz-border-radius-topleft: 0px;
-webkit-border-top-left-radius: 0px;
-moz-border-radius-bottomleft: 0px;
-webkit-border-bottom-left-radius: 0px;
}

ul#calloutnav li {
 display:inline;
 border-right: 1px solid #666;
	margin: 0;
 padding: 0 8px 0 7px;
}

ul#calloutnav li.last {
	border-right: none; 
}

ul#calloutnav a { 
	color: #ccc;
 line-height:36px;
	font-size: 11px; 
 text-transform: uppercase; 
	letter-spacing: 1px; 
	text-decoration: none;
 outline:none;
}

ul#calloutnav a:hover { color: #fff }
ul#calloutnav a:focus { border-bottom:1px solid #e86e14; }

/*ceebox*/
/* CeeBox CSS Document */
/* Minor change made for 2.0.6 */
/* Works with 2.0.4 and up */
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for ceebox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}
html,body{height:100%;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> ceebox specific background images <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#cee_closeBtn 		{ background-image: url(images/cee-close-btn.png); }
#cee_next 			{ background-image: url(images/cee-next-btn.png); }
#cee_prev 			{ background-image: url(images/cee-prev-btn.png); }
* html #cee_next 	{ background-image: url(images/cee-next-btn.gif); } /* IE6 hack */
* html #cee_prev 	{ background-image: url(images/cee-prev-btn.gif); } /* IE6 hack */
#cee_load 			{ background-image: url(images/loader.gif);}
/* ceebox border width controled as option in jquery.ceebox.js */
/* colors for ceebox background and border can also be set as option in jquery.ceebox.js  */
#cee_box			{background-color: #fff;border-color:#525252;border-style: solid; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> ceebox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#cee_box {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
	background-color: #fff;
}

#cee_count {
	font: 10px Arial, Helvetica, sans-serif;
	-moz-opacity: 0.8;
	opacity: 0.8;/* opacity used to reduce contrast of font color so that any main color will work */
	clear:left;
	float:left;
	padding: 2px 0 4px;
}
.cee_html #cee_title h2 {float:left;}
.cee_html #cee_count {clear:none;padding-left:5px;}
* html #cee_count { /* ie6 hack */
	zoom:1;
	padding-bottom:6px;
}
#cee_next,#cee_prev{
	height:100%;
	width: 49%;
	text-indent:-10000px;
	text-decoration:none;
	visibility:visible;
	background-repeat:no-repeat;
}

#cee_box a {border:0;outline:none}
#cee_box a:link {color: #666;}
#cee_box a:visited {color: #666;}
#cee_box a:hover {color: #000;}
#cee_box a:active {color: #666;}
#cee_box a:focus{color: #666;}
#cee_closeBtn {
	background-repeat: no-repeat;
	display:box;
	width:24px;
	height:23px;
	position:absolute;
	text-indent:-10000px;
}
/* Next up a bunch of ugly ass css hacks to fix the fact that IE cuts off the close button when it floats negative. 
Yeah "thou shalt not hack the css" ...so sue me it's better than handling it in the javascript */ 
#cee_closeBtn {top:-3px;right:-3px;} /* base value only here for IE8 */
#cee_closeBtn, #ie8#hack {top:-10px;right:-10px;} /* All browsers except IE8 see this; IE8 keeps using the */
*:first-child+html #cee_closeBtn{top:-3px;right:-3px;} /* only IE7 sees this*/ 
* html #cee_closeBtn{top:-3px;right:-3px;} /*only IE 6 sees this*/

#cee_closeBtn:hover {
	background-position: 0px -23px;
	}
	
.cee_close {cursor:pointer}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> ceebox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#cee_box {
	text-align:left;
	color:#000;
}

#cee_box img#cee_img, #cee_vid,#cee_iframeContent,#cee_ajax {
	display:block;
	margin: 15px 15px 0;
	border-right: none;
	border-bottom: none;
	border-top: none;
	border-left: none;
	
}

#cee_title {
	padding:7px 15px 5px 15px;
	overflow:hidden;
}
.cee_html #cee_title{
	background-color:#e8e8e8;
	height:18px;
	-moz-border-radius: 7px 7px 0 0;
	-webkit-border-radius: 7px 7px 0 0;
	border-radius: 7px 7px 0 0;
}
#cee_title h2 {
	font-size:1em;
	font-weight:400;
	margin:0 0 1px;
}

#cee_ajax{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
}

#cee_load{
	display:none;
	height:50px;
	width:50px;
	margin: -25px 0 0 -25px; /* -height/2 0 0 -width/2 */
	background-position: center center;
	background-repeat:no-repeat;
	
}

#cee_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0.6;
	opacity: 0.6;
	height:100%;
	width:100%;
}

* html #cee_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#cee_iframe{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
}



/*contact page*/

#form {
	float: right;
	width: 370px;
	background: #584445;
	margin: 0px 40px 0px 0px;
	padding: 20px 20px;
	color: #fff;   
	-webkit-box-shadow: 0 0px 5px #333;
    -moz-box-shadow:0 0px 5px #333;
    box-shadow:0 0px 5px #333;
}

h3.contact {
	margin: 20px;
}

/*social*/


	


