/***** Browser Reset *****/

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

html, body {
	width:100%;
	height:100%;
}



body{
	background:url(../images/bg.gif);
	font-family: Georgia, Verdana, sans-serif;
	font-size:0.8em;
	line-height:1.3em;
	color:#555;
}

a:link, a:visited, a:hover, a:active{
	outline:none;
	color:#718D22;
	text-decoration:underline;
}

img {
	border:0;
	vertical-align:bottom; /* solve IE issue (gap below the image) */
}

form {
	margin:0;
	padding:0;
	display:inline;
}

acronym{
	/*border-bottom:1px dashed #555;*/
	cursor:help
}

ol, ul {
	list-style:none;
}

h3{
	padding:20px 0 5px;
}

.first{
	padding-top:0;
	margin-top:0;
}

/***** Global Classes *****/

.clear			{ clear:both; }
.noShow			{ display:none;	}

.fLeft			{ float:left; }
.fRight			{ float:right; }

.bold			{ font-weight:bold; }
.italic			{ font-style:italic; }
.underline		{ text-decoration:underline; }
.highlight		{ background:#ffc; }

.centered		{ text-align:center; }
.justified		{ text-align:justify }
.upperCased		{ text-transform:uppercase;}

/* -------------- Structure --------------- */

#wrapper{
	width:803px;
	margin:0 auto;
	min-height:600px;
}

.tagline{
	position:absolute;
	left:-99999px;
}

#header{
	height:235px;
	margin-top:10px;
	background:url(../images/head_bg.png) no-repeat center;
}

#content1{
	height:60px;
	background:url(../images/content1.png) center repeat-y;
}

#content2{
	background:url(../images/content2.png) repeat-y;
	padding-bottom:20px;
	min-height:500px;
}

/* for all except Internet Explorer */
#wrapper > #content2{
	overflow:auto;
}

/* for Internet Explorer */
/*\*/
* html #content2 {
	height:500px;
}
/**/

#left{
	width:150px;
	margin:0 75px 0 30px;
	float:left;
}

#left p, #right p{
	font-size:85%;
	padding-bottom:5px;
}

#left ol, #right ol, #right ul{
	padding-left:30px;
	font-size:85%;
	padding-bottom:5px;
	list-style:decimal;
}

#right ul{
	list-style-image:url(../images/arrow.gif);
}

#left ul{
	font-size:85%;
	padding-bottom:5px;
}

#right{
	width:507px;
	float:left;
}

p.lastLine{
	padding:0;
	margin:0;
}

.column{
	text-align:justify;
}

#content3{
	height:25px;
	background:url(../images/content3.png) center repeat-y;
}

#footer{
	text-align:right;
	font-size:85%;
	margin:3px;
	margin-right:25px;
	color:#fff;
}

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

#menu{
	width:120px;
 	margin:0 auto;
}

#menu a {
	height:32px;
		voice-family:"\"}\"";
		voice-family:inherit;
		height:22px;
	text-decoration:none;
}

#menu a:link, #menu a:visited {
	color:#555;
	display:block;
	background:url(../images/menu12.gif);
	padding:10px 0 0 35px;
}

#menu a:hover, #homePage a.homePage, #articlesPage a.articlesPage, #contactPage a.contactPage, #portfolioPage a.portfolioPage, #LinkPage a.LinkPage{
	color:#000;
	background-position:0 -32px;
}

/* -------------- Home Page --------------- */

#technologies{
	width:120px;
	padding:0 0 14px 0;
	margin:0 auto;
	background:url(../images/box.gif) bottom left no-repeat;
}

#technologies .first {
	margin:0;
	padding:20px 10px 10px 10px;
	background:url(../images/box.gif) top left no-repeat;
	font-size:100%;
}

#technologies p, #technologies ul {
		margin:0;
		padding:0 10px 3px;
		border:1px solid #ddd;
		border-width:0 1px;
		background:#fff;
}

#technologies ul{
	padding-left:15px;
	/*list-style-image:url(../images/arrow.gif);*/
}

li acronym{
	border-bottom:none;
}

/* -------------- Portfolio Page --------------- */

#portfolioLink{
	width:120px;
	padding:0 0 14px 0;
	margin:0 auto;
	background:url(../images/box.gif) bottom left no-repeat;
}

#portfolioLink .first {
	margin:0;
	padding:20px 10px 10px 10px;
	background:url(../images/box.gif) top left no-repeat;
	font-size:100%;
}

#portfolioLink p, #portfolioLink ul {
		margin:0;
		padding:0 10px 3px;
		border:1px solid #ddd;
		border-width:0 1px;
		background:#fff;
}

#portfolioPage #right img{
	display:block;
	border:1px solid #ddd;
	width:406px;
	margin:10px auto;
	padding:3px;
}

.projectInfo{
	width:406px;
	margin:0 auto;
	color:#FD831A;
	font-weight:bold;
	text-transform:uppercase;
}

.projectInfo .left{
	width:110px;
	float:left;
	margin-right:5px;
	color:#718D22;
}

.projectInfo .right{
	margin-left:5px;
	color:#555;
	font-weight:normal;
}

#projectLink{
	text-transform:none;
	font-weight:normal;
	background:url(../images/arrow.gif) left no-repeat;
	margin-top:15px;
}

#projectLink a{
	padding-left:20px;
}
	

/* -------------- Contact Page --------------- */

p label{
	display:block;
}

p#title label{
	display:inline;
}

.inputText{
	width:200px;
}

/* -------------- Link Page --------------- */

.linkSection{
	padding:10px 0;
}

/* -------------- Sample Page --------------- */

#gallery{
	width:480px;
	height:900px;
	margin:20px 23px;
}

#gallery ul{
	position:relative;
	list-style:none;
	padding:0;
	margin:0px;
	width:480px;
}

#gallery ul li{
	display:inline;
	width:52px;
	height:52px;
	float:left;
	margin:0 0 5px 5px;
}

#gallery ul li a{
	display:block;
	width:50px;
	height:50px;
	text-decoration:none;
	border:1px solid #000;
}

#gallery ul li a img{
	display:block;
	width:50px;
	height:50px;
	border:0;
}

#gallery ul li a:hover{
	white-space:normal;
	border-color:#ddd;
}

#gallery ul li a:hover img{
	position:absolute;
	left:25px;
	top:200px;
	width:auto;
	height:auto;
	border:1px solid #000;
}

/* -------------- External Element --------------- */

.snap_preview_icon{
	vertical-align:top;
}