﻿* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 62.5%;
	font:80% Trebuchet MS, Arial, Helvetica, Sans-Serif;
	background: url(images/body-bg.png) repeat-x top #444444;
	line-height:180%;
	margin:0;
	padding:0;

}

p {
	font-size: 1.3em;
	line-height: 1.4em;
	margin-bottom: 0.8em;
}

a { color: #ffffff; text-decoration: none; }
a:hover, a:active { text-decoration: underline; }

.style2 {
		font-family: Tahoma;
		color: #FF0000;
	}
	.style3 {
		color: #FF0000;
	}
	.style4 {
		color: #FF0000;
		font-family: Tahoma;
		font-size: medium;
	}
	.style5 {
		font-family: Tahoma;
		font-size: medium;
	}

h1 { font-size: 3.0em; margin-bottom: 0.8em; font: "Palatino"; color: #222222} 
h2 { font-size: 1.5em; text-transform: uppercase; margin-bottom: 0.8em; }
h3 {
	font-size: 1.6em;
	text-transform: uppercase;
	font-style: italic;
	letter-spacing: 2px;
	background: #666666;
	color: #bb4545;
	padding: 5px;
	margin-bottom: 0.5em;
	text-align: center;
}
.h1geek {
font-family: rockwell, tahoma, geneva, verdana, lucida, lucida grande, arial, 'helvetica', sans-serif;
color: #666666;
margin:0;
font-size: 2.5em;
font-weight: bold;
display: inline;
}
.fonttest {
	font-family: tahoma, geneva, verdana, lucida, lucida grande, arial, 'helvetica', sans-serif;
margin:0;
font-size: 11px;
font-weight:normal;
color:white;
display: inline;
line-height:normal;

}

.clear { clear: both; }

div#page-wrap {
	width:960px;
	margin: 0 auto;
}
div#menu {
	margin: 0 auto;
	
}
div#portfolio-wrapper{
	width:960px;
	margin: 0 auto:
}

ul#nav {
	height: 159px;
	background: url(images/header-bg.jpg) no-repeat;
	list-style: none;
	padding-left: 0px;
	}
				
	div#main-content {
		padding-bottom: 50px;
		}
		
		div#footer {
		background: #666666;
		height: 80px;
		color: white;
		padding: 10px 0 10px 0;
		text-transform: uppercase;
		text-align: center;
	}
	img{border:none;}
	pre{
		display:block;
		font:12px "Courier New", Courier, monospace;
		padding:10px;
		border:1px solid #bae2f0;
		background:#e3f4f9;	
		margin:.5em 0;
		width:674px;
		}	
		
		#services{
	margin-top:20px;
	position:relative;
	width: 151px;
}
	#other{
	margin-top:20px;
	position:relative;
		width: 151px;


}
	#portfolio{
	margin-top:20px;
	position:relative;
		width: 151px;


}
		div#3col{
		width: 960px;
		height: 200px;
		}
		.col
{
width:200px;
}

#left
{
float:left;
height: 200px;
padding:20px;
text-align:justify;


}

#right
{
float:right;
height: 200px;
padding:20px;
text-align:justify;



}

#center
{
text-align:justify;
vertical-align:text-top;
padding:20px;




}
#twitter_update_list{
height: 100px;
padding:10px;
text-align:justify;
list-style-type:none;



}


/* contact form */

#feedback{
	margin:0;
	position:fixed;
	left:-401px;
	top:170px;
	width:400px;
	z-index:1000;
	background:#e9e9e9 url(images/feedback_form.gif) repeat-x;
	border:1px solid #d5d5d5;
	border-left:none;
	text-align:left;
	}
#feedback h3{
	font-size:25px;
	margin:1em 35px;
	padding-bottom:.75em;
	background:url(images/feedback_border.gif) no-repeat 0 100%;
	}
#feedback fieldset{
	border:none;
	margin:1em 35px;
	padding:0;
	}
#feedback legend{
	display:none;
	}
#feedback div{
	clear:both;
	padding:.2em 0;
	}	
#feedback label{
	float:left;
	width: 100px;
	}	
#feedback .field, #feedback .area{
	float:right;
	width:220px;
	border:1px solid #d5d5d5;
	padding:3px;
	background:#fff url(images/feedback_input.gif) repeat-x;
	}	
#feedback .area{
	height:120px;
	overflow:auto;
	}	
#feedback .submit{
	padding:1em 0;
	text-align:right;
	}	
#feedback button{
	text-indent:-8000px;
	text-align:left;
	border:0;
	overflow:hidden;
	width:164px;
	height:39px;
	background:url(images/feedback_submit.png) no-repeat 0 0;
	cursor:pointer;
	}	

	/* contact buttons */
	
	#feedback .open, #feedback .close{
		float:left;
		position:absolute;
		top:-1px;
		left:401px;
		text-indent:-8000px;
		width:38px;
		cursor:pointer;
		}
	#feedback .open{
		background:url(images/feedback_open.png) no-repeat 0 0;	
		height:122px;
		}
	#feedback .close{
		background:url(images/feedback_close.png) no-repeat 0 0;	
		height:41px;
		}	

/* // end of contact form */

  /* image replacement */
        .graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */
			
	#container{	
		margin:0 auto;
		position:relative;
		text-align:left;
		width:800px;
		background:#fff;		
		margin-bottom:2em;
		}	
	#header{
		height:80px;
		width:960px;
		line-height:80px;
		background:#444444;
		color:#666666;
		font: Trebuchet MS, Arial, Helvetica, Sans-Serif;
		}			
	#rotator-wrap{
		width:960px;
		border-bottom-style:dotted;
		border-bottom-color:white;
		border-bottom-width:thin;
}	
	#fronttext{
		width:740px;
		font-family: tahoma, geneva, verdana, lucida, lucida grande, arial, 'helvetica', sans-serif;
		margin:0;
		font-size: 16px;
		font-weight:normal;
		color:white;
		display: inline;
		line-height:normal;
}
	#content{
		position:relative;
		}			

/* Easy Slider */

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:960px;
		height:241px;
		overflow:hidden; 

		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:960px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(images/btn_next.gif) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:28px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:28px;
		line-height:28px;
		}
	ol#controls li a{
		float:left;
		height:28px;
		line-height:28px;
		border:1px solid #ccc;
		background:#DAF3F8;
		color:#555;
		padding:0 10px;
		text-decoration:none;
		}
	ol#controls li.current a{
		background:#222222;
		color:#fff;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */

/* slider jquery */

.boxgrid{ 
				width: 210px; 
				height: 160px; 
				margin:10px; 
				float:left;
				background:#161613; 
				border: solid 2px #8399AF; 
				overflow: hidden; 
				position: relative; 
			}
				.boxgrid img{ 
					position: absolute; 
					top: 0; 
					left: 0; 
					border: 0; 
				}
				.boxgrid p{ 
					padding: 0 10px; 
					color:#afafaf; 
					font-weight:bold; 
					font:10pt "Lucida Grande", Arial, sans-serif; 
				}
				
			.boxcaption{ 
				float: left; 
				position: absolute; 
				background: #000; 
				height: 100px; 
				width: 100%; 
				opacity: .8; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 			}
 				.captionfull .boxcaption {
 					top: 260;
 					left: 0;
 				}
 				.caption .boxcaption {
 					top: 220;
 					left: 0;
 				}

/* end of slider jquery */

/* lightbox  */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; 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-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

 /*  end of lightbox  */
 #contact-area {
	width: 605px;
	margin-top: 25px;
	margin: 0 auto;
}
#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 471px;
	font-family: Helvetica, sans-serif;
	font-size: medium;
	margin: 0px 0px 10px 0px;
	border: 1px solid #CCCCCC;
}
#contact-area textarea {
	height: 90px;
}
#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #000;
}
#contact-area input.submit-button {
	width: 100px;
	float: right;
}
label {
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 105px;
	padding-top: 5px;
	font-size: 1.4em;
}
