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

body {
	background: #fff url(images/bg_ptn.gif) repeat top left;
	font-family: "Tahoma", sans serif;
	font-size: 11px;
	color: #666;
	line-height: 22px;
	padding: 10px;
	}
a {	color: #5595b1; text-decoration: none;	}
a:hover {color: #d0574d;	}
h2 { font-weight: normal; }

.logo img{border:0; max-width: 100%;}

strong { color: #000;}

#wrapper {width: 600px; max-width: 100%; margin: 0 auto;}

#main {
	background: #fff;
	border-radius: 4px;
	-moz-border-radius: 10px;
	-webkit-box-shadow: 0 0 12px #dfdddd;
	-moz-box-shadow: 0 0 12px #dfdddd;
	box-shadow: 0 0 4px #dfdddd;
	padding: 10px;
	margin: 0 auto;
	text-align: center;
	max-width: 100%;
}

/*-------------------- Navigation -----------------*/

.header {background: transparent; height: 120px; }

.logo { width: 100%; text-align: center; height: 81px; display:block; padding: 10px 0 0 0;}
.navigation { text-align: center; margin-top: 10px; background: url(images/nav_bgf.png) no-repeat top center;  height: 97px; }

.navigation ul {	padding:  33px 0 0 124px; width: 80%;    margin: auto; }

.navigation li {	float:left;	padding-right: 45px; list-style: none;}

.navigation a {	height:86px;display:block;	text-indent:-999em;}

.navigation a.home {	background:url(images/nav_text.png) no-repeat;	width:86px;	height:24px;}
.navigation a.home:hover { background-position:0% -23px;}

.navigation a.about { background:url(images/nav_text.png) no-repeat -154px 0; width:86px;	height:24px;}
.navigation a.about:hover { background-position: -154px -24px;}

.navigation a.blog { background:url(images/nav_text.png) no-repeat -620px 1px;	width:86px;	height:25px;}
.navigation a.blog:hover{ background-position:-620px -24px; }

.navigation a.portfolio { background:url(images/nav_text.png) no-repeat -305px 0; width:86px;	height:24px;}
.navigation a.portfolio:hover{ background-position:-305px -23px; }

.navigation  a.contact {	background:url(images/nav_text.png) no-repeat -450px 0; width:108px;	height:24px;}
.navigation a.contact:hover{ background-position: -450px -23px;}
*/
.tipsy { padding: 8px; font-size: 10px; opacity: 0.6; filter: alpha(opacity=60); background-repeat: no-repeat; /* background-image: url(images/tipsy.gif); */}
  .tipsy-inner { padding: 5px 8px 4px 8px; background-color:#5595b1; color: white; max-width: 200px; text-align: center; }
  .tipsy-inner { -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;}
  .tipsy-north { background-position: top center; }
  .tipsy-south { background-position: bottom center; }
  .tipsy-east { background-position: right center; }
  .tipsy-west { background-position: left center; }
  #gravity { width: 100%; margin: 5px 0; border-spacing: 5px; }
  #gravity td { text-align: center; vertical-align: middle; padding: 5px 0; background-color: #d0d0d0; }
  #gravity a { }
	#gravity a:hover { color: #505050; background: none; }




/*-------------- banner -----------------*/

.splash { height: 275px;
		   background:url(images/splash2.png) top center no-repeat;}
.divider { background: url(images/divider.gif) no-repeat top center; height: 49px; width: 100%; float: left; padding: 15px 0;}	
	
#about {  width:100%; padding: 20px 0; float:left;}
#about .info { width: 45%; padding: 10px 10px 20px 40px; float: left; }
#about .skills { width: 45%; padding: 10px  20px; float: right; }
.clear { clear: both;}
#about p { margin: 5px 5px 5px 10px; line-height: 22px; }
#about blockquote {float: right; text-align: left; font-size: 24px; width: 200px; font-style:italic; color:#5595b1; display: block; border-left: 1px solid #5595b1; padding-left: 18px; line-height: 30px; margin: 0 10px 10px 8px;  }
#about ul { margin: 0; padding: 0 0 0 8px;}
#about ul li {  list-style-type: none; background: url(images/bullet.png) no-repeat 0 5px; padding-left: 22px; margin:0;}
.profile {border:5px solid #000; -moz-border-radius: 0.30em; border-radius: 0.30em; margin:3px 10px 3px 3px; float: left; -moz-box-shadow: 0px 0px 4px #666;
-webkit-box-shadow: 0px 0px 4px #666;}


#work { width:100%; padding: 0px 0 0 0 ; display:block; float:left; height: 325px;}
#work .box {-moz-border-radius: 0.50em; -webkit-border-radius: 0.50em;  width: 500px;
padding: 10px 40px 10px; float: left; }
#slider img a {border: none;}
#slider img  {border: none;}
#work p {}
 
#contact {width: 100%;  padding: 10px 0 10px 40px  ; display:block; float:left;}
#contact .contact-form { width: 45%; padding: 10px 10px 20px 5px; float: left; }
/*.contact-form input[type="text"], .contact-form textarea { width: 350px;  font-family: "Rockwell",Georgia, Times New Roman, Times, serif; font-size: 14px; padding: 5px;
											 color: #666666; background: #d9e6e9; border: none; border-radius: 4px; -moz-border-radius: 4px;}*/
.element #submit {margin-top: 10px; background-color:#000; border: none;  font-family: "Rockwell",Georgia, Times New Roman, Times, serif; font-size: 14px; color:#FFFFFF; font-size:12px; font-weight:bold; padding:7px;   border-radius: 4px; -moz-border-radius: 4px;}
#submit:hover {color: #d0574d;}


.block {
	width:400px;
	margin:0 auto;
	text-align:left;
}
.element * {
	  font-family: "Rockwell",Georgia, Times New Roman, Times, serif; font-size: 14px; padding: 5px;
											 color: #666666; background: #d9e6e9; border: none; border-radius: 4px; -moz-border-radius: 4px; margin: 2px;
}
.element label {
	background: none;
	font-family: "Tahoma", sans serif;
	font-size: 11px;
	color: #666;
	line-height: 22px;
	
}
.element input[type="text"] {
	float:left; 
	width:350px;
}
.element .textarea {
	height:120px; 
	width:350px;
}
.hightlight {
	
	background: #e8bbb7 url(images/iconCaution.gif) no-repeat right  4px;
}


.loading {
	background:url(images/ajax-loader.gif) no-repeat 1px; 
	height:28px; 
	width:28px;
	margin: -34px 0 0 110px;
	display:none;
}
.element #done {
		margin: -34px 0 0 110px;
background-color: #ffffff; 

	padding-left:20px;
	font-size:90%; 
	display:none;
}
#contact 

.elsewhere { width: 45%; padding: 10px  0px; float: left; }
.contact-other  {display: block; padding: 2px 0; }
.contact-other  img {float: left; padding: 5px 5px 0 0; }
.clear { clear:both;}

#footer {padding: 20px 15px; margin: auto; width: 80%;}
#footer p {text-align: center;}
 /* 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:100%;
		background:#fff;		
		margin-bottom:2em;
		}	
	#header{
		height:80px;
		line-height:80px;
		background:#5DC9E1;
		color:#fff;
		}				
	#content{
		position:relative;
		}			
#slideshow { margin: 0 0 0 40px; }
/* Easy Slider */
#slider
{		width: 790px;
		padding-top: 15px; margin-left: 30px;
}

#slider img {float: left; border:5px solid #000;
-moz-border-radius: 0.30em;
border-radius: 0.30em;
margin:3px 0px 3px 0px;
float: left;
-moz-box-shadow: 0px 0px 4px #666;
-webkit-box-shadow: 0px 0px 4px #666;}
	#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:790px;
		height:220px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:47px;
		height:47px;
		position: relative;
		left:-20px;
		top:-165px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:825px;
		top: -207px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position: relative;
		width:46px;
		height:47px;
		background:url(images/btn_prev.png) no-repeat 0 0;	
		}	
		#prevBtn a:hover, #nextBtn a:hover,
	#slider1next a:hover, #slider1prev a:hover{  
		display:block;
		position: relative;
		width:46px;
		height:47px;
		background:url(images/btn_prev_hover.png) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(images/btn_next.png) no-repeat 0 0;	
		}	
		
		#nextBtn a:hover, #slider1next a:hover{ 
		background:url(images/btn_next_hover.png) no-repeat 0 0;	
		}	
		
	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:#5DC9E1;
		color:#fff;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
		

	.site-info {padding-left: 20px;	font-size: 10px; width: 275px; float: left;	}
	.site-info h3 { font-family: "Rockwell",Georgia, Times New Roman, Times, serif;	font-weight: bold;color: #37a2c6; font-size: 16px;}
	
	
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}