body
{
	background: #1E303E url('../images/background.jpg') repeat-x;
	font: 13px/1.4em Verdana, Arial, sans-serif;
	margin: 0;
	padding: 0;
}
div#wrapper
{
	width: 924px;
	margin: 0 auto;
}

/* Header
---------------------------------*/
div#header
{
	height: 64px;
	padding-bottom: 36px;
	background: url('../images/wrapper-border-top.png') no-repeat bottom; 
}
div#header h1
{
	margin: 0;
	padding: 14px 0 0 4px; 
	float: left;
	text-indent: -1000em;
	background: url('../images/logo.png') no-repeat bottom right;
	width: 253px;
	height: 40px;
}

/* Main navigation
---------------------------------*/
ul#mainnav
{
	float: right;
	list-style: none;
	margin: 0;
	padding: 0 3px 0 0;
	background: url('../images/menusprites.png') no-repeat 32em 0 /*401px*/;
}
ul#mainnav li
{
	float: left;
}
ul#mainnav li a
{
	text-decoration: none;
	color: #fff;
	display: block;
	padding: 30px 15px 12px;
	line-height: 22px;
	font-size: 1.1em;
	background: url('../images/menusprites.png') no-repeat 0 0;
}
ul#mainnav li a:hover
{
	background-position: 0 -128px;
}
ul#mainnav li.active a
{
	background-position: 0 -64px;
}

/* Container and content
---------------------------------*/
div#container
{
	background: url('../images/wrapper-border-middle.png') repeat-y;
	padding: 0 10px;
	width: 100%;
	overflow: auto;
}
div#content
{
	background: #fff;
	color: #30373B;
	padding: 0 2%;
	width: 94%;
	overflow: hidden;
	float: left;
}
div#content h2
{
	font: bold 1.4em "Trebuchet MS", "Helvetica", sans-serif;
	background: #1f333e url('../images/header.jpg') repeat-x;
	color: #fff;
	margin: 0 -1em;
	padding: 0.6em 0.95em;
}
div#content h3
{
	font: 1.2em "Trebuchet MS", "Helvetica", sans-serif;
	color: #1F323F;
	margin: 0.5em 0;
	padding-bottom: 0.2em;
	border-bottom: 1px dotted #1F323F;
}
div#content a
{
	color: #1F323F;
	border-bottom: 1px dotted #1F323F;
	text-decoration: none;
}
div#content a:hover
{
	background-color: #EFF9FF;
}
div#content hr
{
	margin: 1em 0;
	padding: 0;
	border: solid #5C6C74;
	border-width: 1px 0 0 0;
}
div#content ul
{
	margin: 1em 0 1em 2.5em;
	padding: 0;
}
div#content p
{
	margin: 1em 0;
}

/* Container plus sidepanel
---------------------------------*/
div#container.has_sidepanel
{
	background-image: url('../images/wrapper-border-middle-sidepanel.png');
}
div#container.has_sidepanel div#content
{
	width: 66%;
}

/* Sidepanel
---------------------------------*/
div#sidepanel
{
	background: #223846;
	color: #c2c2c2;
	margin-left: 10px;
	padding: 2%;
	width: 22.8%;
	overflow: hidden;
	float: left;
}
div#sidepanel h3
{
	font: bold 1.2em "Trebuchet MS", "Helvetica", sans-serif;
	border-bottom: 1px dotted #c2c2c2;
	margin: 0;
}
div#sidepanel ul
{
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}
div#sidepanel ul li
{
	overflow: hidden;
}
div#sidepanel ul li a
{
	display: block;
	padding: 0.1em;
	color: #c2c2c2;
	text-decoration: none;
	font-size: 0.85em;
	white-space: nowrap;
	text-overflow: ellipsis;
}
div#sidepanel ul li a:hover
{
	background-color: #3B607B;
	color: #eee;
}

/* Footer
---------------------------------*/
div#footer
{
	clear: both;
	overflow: auto;
	background: url('../images/wrapper-border-bottom.png') no-repeat top; 
	color: #c2c2c2;
	padding: 2em 3em 1em 3em;
	font-size: 0.85em;
}
div#footer span.copyright
{
	float: left;
}
div#footer span.vanity
{
	float: right;
}

/* Lightbox
---------------------------------*/
#lightbox
{
	background-color: #F5FBFF;
	padding: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	z-index: 400;
	font-size: 1px;
	line-height: 1px;
}
#lightbox a
{
	border: none !important;
}
#lightbox img
{
	border: none;
	clear: both;
}
#overlay img
{
	border: none;
}
#overlay
{
	background-image: url(../images/overlay.png);
	z-index: 400;
}

/* Projects listing
---------------------------------*/
#projects
{
	margin: 0 !important;
	padding: 0;
	overflow: hidden;
	list-style: none;
}
#projects li
{
	font: 15px "Trebuchet MS", "Helvetica", sans-serif;
	padding: 1%;
	margin: 0 1% 1% 0;
	border: solid #B9CDDA;
	border-width: 0 3px 3px 0;
	background: #F5FBFF;
	float: left;
	width: 29.6%;
	height: 210px;
	text-align: center;
	overflow: hidden;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#projects li:hover
{
	background-color: #edf4f8;
	border-color: #b3c9d7;
}
#projects li h4
{
	padding: 0;
	margin: 0;
	color: #5C6C74;
}
#projects li a
{
	display: block;
	border: none !important;
	background: none !important;
}
#projects li a img.screen
{
	padding: 4px;
	background: #fefefe;
	border: 1px solid #b3c9d7;
	margin: 1em 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
#projects li a:hover img.screen
{
	padding: 3px;
	border-width: 2px;
}

/* Tabs on project pages
---------------------------------*/
#tabs
{
	clear: both;
	overflow: hidden;
	margin: 0 0 1em 0 !important;
	padding: 0 0 0 1em !important;
	list-style: none;
	border-bottom: 2px solid #899AA2;
}
#tabs li
{
	float: left;
	margin: 0 0.25em 0 0;
	font: bold 15px "Trebuchet MS", "Helvetica", sans-serif;
}
#tabs li a
{
	float: left;
	padding: 0.25em 0.5em;
	border: solid #B9CDDA;
	border-width: 2px 0 0 2px;
	background: #F5FBFF;
	color: #5C6C74;
	text-decoration: none;
	-moz-border-radius: 8px 8px 0 0;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}
#tabs li a:hover
{
	background-color: #edf4f8;
	border-color: #b3c9d7;
}
#tabs li.active a
{
	border-color: #A7B8BF;
	background-color: #edf4f8;
}

/* Screenshots sections
---------------------------------*/
#screenshots
{
	margin: 0 !important;
	padding: 0;
	list-style: none;
	overflow: hidden;
}
#screenshots li
{
	float: left;
	margin: 0 5px 5px 0;
}
#screenshots li a
{
	background: none !important;
	border: none !important;
}
#screenshots li img
{
	padding: 4px;
	border: 1px solid #638A9F;
	cursor: -moz-zoom-in;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
#screenshots li:hover img
{
	padding: 3px;
	border-width: 2px;
}

/* Styled tables
---------------------------------*/
.formal_table
{
	background: #B9CDDA;
}
.formal_table thead th
{
	font-size: 1.1em;
	line-height: 1.4em;
	text-align: left;
	background: #6F8C9D;
	color: #fff;
}
.formal_table tbody th
{
	font-size: 1.05em;
	line-height: 1.3em;
	text-align: left;
	background: #C3D4DF;
	color: #365A74;
}
.formal_table tbody td
{
	background: #fff;
}
.formal_table tbody tr:hover td
{
	background: #EDF4F8;
}

/* Webdesign portfolio
---------------------------------*/
#portfolio
{
	list-style: none;
	margin: 0 !important;
	padding: 0;
}
#portfolio li
{
	margin: 1em 0;
	overflow: hidden;
}

/* Screenshot */
#portfolio li img
{
	display: block;
	float: left;
	width: 250px;
	height: 187px;
	padding: 10px;
	margin-right: 10px;
	border: solid #B9CDDA;
	border-width: 0 3px 3px 0;
	background: #F5FBFF;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#portfolio li a:hover img
{
	background-color: #edf4f8;
	border-color: #b3c9d7;
	cursor: -moz-zoom-in;
}

/* Name */
#portfolio li h3
{
	clear: right;
}
#portfolio li h3 a
{
	border-bottom: none !important;
	padding-right: 15px;
	background: url('../images/icons/external.png') center right no-repeat;
}

/* Extra info */
#portfolio li dl
{
	font-size: 0.85em;
	margin: 5px 0;
	overflow: hidden;
}

#portfolio li dl dt
{
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	padding-bottom: 2px;
}
#portfolio li dl dd
{
	margin: 0.5em 0 0.5em 2em;
}

/* Involvement */
#portfolio li dl dd ul
{
	list-style: disc inside;
	margin: 0;
}
#portfolio li dl dd ul li
{
	float: none;
	width: auto;
	min-width: 0;
	height: auto;
	margin: auto;
}

/* Page indices
---------------------------------*/
ul.pageIndex
{
	clear: both;
	margin: 1em 0 !important;
	padding: 0.75em 0 !important;
	list-style: none;
	text-align: center;
	border: dotted #888;
	border-width: 1px 0;
}
ul.pageIndex li
{
	display: inline;
}
ul.pageIndex li span
{
	opacity: 0.4;
}
ul.pageIndex li a, ul.pageIndex li span
{
	font-size: 12px;
	padding: 4px 6px;
	border: 1px solid #B9CDDA !important;
	background: #EFF9FF;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
ul.pageIndex li a.active
{
	background-color: #e4eff5;
	border-color: #b4c9d7 !important;
}
ul.pageIndex li a:hover
{
	background-color: #daeaf4 !important;
	border-color: #7e9caf !important;
}

/* Contact page
---------------------------------*/

.social_networks
{
	list-style: none;
	padding: 0;
	margin: 1em 0 !important;
}

/* (Newsletter) forms
---------------------------------*/
form
{
	margin: 0;
	padding: 0;
}
fieldset
{
	border: 1px solid #ccc;
	padding: 1em;
	margin: 0;
}
fieldset legend
{
	font: 1.2em "Trebuchet MS", "Helvetica", sans-serif;
	color: #1F323F;
}
form#newsletter label
{
	color: #444;
	display: block;
	float: left;
	clear: right;
	width: 200px;
	font-weight: bold;
}
form#newsletter label small
{
	font-weight: normal;
}
form#newsletter input.input_text
{
	border: 1px solid #ccc;
	background: #fff;
	margin-bottom: 5px;
}
form#newsletter input.input_text:focus
{
	border-color: #777;
}
form#newsletter input.button_submit
{
	display: block;
	border: 1px solid #B9CDDA;
	background: #EFF9FF;
	margin: 1em 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	font: 0.9em "Trebuchet MS", "Helvetica", sans-serif;
}
form#newsletter input.button_submit:hover
{
	background-color: #e4eff5;
	border-color: #b4c9d7;
}
p.error
{
	color: #c00;
}

/* Advertisements
---------------------------------*/
#ads
{
	text-align: center;
	margin: 1em 0 0;
	padding: 1em;
	border-top: 1px dotted #1F323F;
}