/**********Styles Created By C.J. SVP Web Development & Brand Identity for C. Diggs Studios*************/
/************************There is still much to learn my young apprentice!"*****************************/
/**********************************Visit www.charlesdiggs.com*******************************************/

/*****************************/
/********LIGHTBOX CSS*********/
/*****************************/
#lightbox{ position:absolute; top:40px;	left:0;	width:100%;	z-index:100; text-align:center;	line-height:0;}
#lightbox a img{ border: none; }
#outerImageContainer{ position:relative; background-color:#003399; width:250px; height:250px; margin:0 auto;}
#imageContainer{ padding:10px;}
#loading{ position:absolute; top:40%; left:0%; height:25%; width:100%; text-align:center; line-height:0;}
#hoverNav{ position:absolute; top:0; left:0; height:100%; width:100%; z-index:10;}
#imageContainer>#hoverNav{ left:0;}
#hoverNav a{ outline:none;}
#prevLink, #nextLink{ width:49%; height:100%; background:transparent url(../js/imgs/blank.gif) no-repeat; /* Trick IE into showing hover */display:block;}
#prevLink{ left:0; float:left;}
#nextLink{ right:0; float:right;}
#prevLink:hover, #prevLink:visited:hover{ background:url(../js/imgs/prevlabel.gif) left 15% no-repeat;}
#nextLink:hover, #nextLink:visited:hover{ background:url(../js/imgs/nextlabel.gif) right 15% no-repeat;}
#imageDataContainer{ font:10px Verdana, Helvetica, sans-serif; background-color:#003399; margin:0 auto;	line-height:1.4em;}
#imageData{ padding:0 10px;}
#imageData #imageDetails{ width:70%; float:left; text-align:left; }	
#imageData #caption{ font-weight:bold; color:#FF0000;}
#imageData #numberDisplay{ display:block; clear:left; padding-bottom:1.0em;	}			
#imageData #bottomNavClose{ width:66px; float:right; padding:0px;}		
#overlay{ position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#0099FF; filter:alpha(opacity=60); -moz-opacity:0.6; opacity:0.6;}
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html>body .clearfix{display:inline-block; width:100%;}
* html .clearfix {/* Hides from IE-mac \*/ height: 1%;/* End hide from IE-mac */}	
/******************************/
/******************************/
/******************************/

span{ display:none;}
body{ margin:0; color:#999999; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:78%;}
h1{ font-family:"Trebuchet MS"; font-size:130%; color:#66CCFF; padding:3px 0 3px 0; margin:0}
p{ margin:0 0 0 10px; padding:5px 0 0 0; line-height:16px;}

/*GENERAL & CUSTOM CLASSES*/
.hide{ display:none;}
.margin_reg{ margin:15px;}
.right {float:right;}
.inside{ margin:0 16px 0 16px;}
.center{ text-align:center;}
.smallerwidth{ width:300px;}
.clear{ clear:both;}
.crumbs{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:87%; color:#333333; list-style-type:none; margin:0; padding:0 10px 0 10px; color:#6699CC;}
.crumbs a{ color:#6699CC; text-decoration:none}
.crumbs a:hover{ text-decoration:underline; color:#FFFFFF; background:#0099FF;}
.crumbs a:active{ text-decoration:underline; color:#FFFFFF;  background:#0099FF;}
.site_wide{ padding:68px 0 0 0; height:auto; margin:0; background:#CCCCCC;}
.site_wide_ul{ padding:0; margin:0;}
.site_wide_li{ list-style-type:none; display:block;}
.activecrumb{ color:#999999; display:inline;}
.view_work{ display:inline; text-decoration:none}
.view_work a{ display:inline; font-size:90%; color:#00CC00; margin:0 0 0 12px; text-decoration:none}
.view_work a:visited{ display:inline; font-size:90%; color:#00CC00; margin:0 0 0 12px; text-decoration:none}
.view_work a:hover{display:inline; font-size:90%; color:#00A7FF; margin:0 0 0 12px; text-decoration:underline}
.view_work a:active{ display:inline; font-size:90%; color:#00A7FF; margin:0 0 0 12px; text-decoration:underline}
.mtop_60px{ padding:84px 0 0 0;}

/*GENERAL & CUSTOM ID's*/
#mtop_60px{ padding:84px 0 0 0;}
#mtop_60px li{ list-style-type:none; }
#mtop_60px span{ display:inline; font-size:90%; color:#00A7FF;}
#mtop_60px strong{ color:#666666;}

#linelink{ display:inline;}
#linelink a{ color:#00CC00; margin:0; text-decoration:none}
#linelink a:hover{ color:#00A7FF; margin:0; text-decoration:underline}
#linelink a:visited{ color:#00A7FF; margin:0; text-decoration:underline}

#container{ margin:0 auto; width:820px; height:auto;}
#page_header{ height:136px; width:100%; background:#FFFFFF url(../imgs/pure/page_header.jpg) 0 0 no-repeat;}
#page_logo{ margin: 8px 0 0 2px; border:none;}
#page_qoute{ float:right; margin:2px 2px 0 0;}
#topborder{ height:25px; width:100%; background:#FFFFFF url(../imgs/pure/topborder.jpg) 0 0 no-repeat;}
#midsection{ height:auto; width:100%; background:#FFFFFF url(../imgs/pure/midsection.jpg) 0 0 repeat-y;}
#bottomborder{ height:25px; width:100%; background:#FFFFFF url(../imgs/pure/bottomborder.jpg) 0 0 no-repeat;}
#navsection{ height:61px; width:100%; background:url(../imgs/pure/navholder.jpg) 0 0 no-repeat;}

/*MAIN NAVIGATION*/
#nav{ margin:10px 0 0 0; padding:10px 0 0 0; height:61px; list-style:none; display:inline; overflow:hidden;}

#nav li{ margin:0; padding:0; list-style:none; display:inline;}

#nav a{	float:left;	padding:53px 0 0 0;	overflow:hidden; height:0px !important; height /**/:22px; /* for IE5/Win only */}
	
#nav a:hover {background-position:0 -20px;}

#nav a:active, #nav a.selected { background-position: 0 -40px;}

#home a{ margin:3px 0 0 5px; width:60px; height:60px; background:url(../imgs/pure/_home2.gif) 0px -54px no-repeat;}
#home a:hover{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_home2.gif) 0px 1px no-repeat;}
#home a:active{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_home2.gif) 0px 1px no-repeat;}

#clients a{ margin:3px 0 0 5px; width:60px; height:60px; background:url(../imgs/pure/_clients2.gif) 0px -54px no-repeat;}
#clients a:hover{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_clients2.gif) 0px 1px no-repeat;}
#clients a:active{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_clients2.gif) 0px 1px no-repeat;}

#portfolio a{ margin:3px 0 0 5px; width:60px; height:60px; background:url(../imgs/pure/_portfolio2.gif) 0px -54px no-repeat;}
#portfolio a:hover{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_portfolio2.gif) 0px 1px no-repeat;}
#portfolio a:active{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_portfolio2.gif) 0px 1px no-repeat;}

#contactus a{ margin:3px 0 0 5px; width:60px; height:60px; background:url(../imgs/pure/_contacts2.gif) 0px -54px no-repeat;}
#contactus a:hover{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_contacts2.gif) 0px 1px no-repeat;}
#contactus a:active{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_contacts2.gif) 0px 1px no-repeat;}


#aboutus a{ margin:3px 0 0 5px; width:60px; height:60px; background:url(../imgs/pure/_aboutus2.gif) 0px -54px no-repeat;}
#aboutus a:hover{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_aboutus2.gif) 0px 1px no-repeat;}
#aboutus a:active{ margin:3px 0 0 5px; width:60px; height:63px; background:url(../imgs/pure/_aboutus2.gif) 0px 1px no-repeat;}


#content_all{ width:100%; height:auto;}
#r_content{ width:700px; height:auto;}


/*SUB-PAGES*/
#home_page{ width:100%; height:auto; background:#FFFFFF;}
#clients_page{ width:100%; height:auto; background:#FFFFFF url(../imgs/pure/include_pages/clients.jpg) 0 18px no-repeat;}
#aboutus_page{ width:100%; height:650px; background:#FFFFFF url(../imgs/pure/include_pages/aboutus_bg.jpg) 0 18px no-repeat;}
#contactus_page{ width:100%; height:auto; background:#FFFFFF url(../imgs/pure/include_pages/contactus_bg.jpg) 0 18px no-repeat;}
#portfolio_page{ width:100%; height:auto; background:#FFFFFF url(../imgs/pure/include_pages/portfolio_bg.jpg) 0 18px no-repeat;}
#novoa_page{ background:#FFFFFF url(../imgs/pure/include_pages/novoa_bg.jpg) 0 18px no-repeat;}
#wireframe_page{ background:#FFFFFF url(../imgs/pure/include_pages/wireframe_bg.jpg) 0 18px no-repeat;}
#bourget_page{  background:#FFFFFF url(../imgs/pure/include_pages/bourgetpaint_bg.jpg) 0 18px no-repeat;}
#asiansoul_page{  background:#FFFFFF url(../imgs/pure/include_pages/asiansoul_bg.jpg) 0 18px no-repeat;}

#home_text{ height:auto; width:340px;}

#about_cj{ width:200px; height:auto;}
#about_sr{ float:right; width:200px; height:auto;}

#friends{ width:80px; height:355px; background:#FFFFFF url(../imgs/pure/friends_bg.jpg) 0 0 no-repeat;}


#footer{ text-align:center;}
#footer ul{ padding:20px; margin:0;}
#footer li{ list-style-type:none; display:inline; font-size:90%; padding:0 7px 0 7px;}