/* You may adapt and learn from the elements of this CSS to use in your own
projects, but you may not copy the design (the unique combination of images,
colors, sizes, typography, and positioning) since this is copyright of Duoh! n.v.
and may not be reproduced. 
------------------------------------------------------------------*/

/* Duoh! Main stylesheet
------------------------------------------------------------------*/

/* @group resetting - general */

html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {
	margin:0;
	padding:0;
}
html {
	background: #3e373c url(graphics/colorbar.jpg) repeat-y fixed;
}
ul,li {
	list-style-type:none;
	}
body {
	font:80%/150% Corbel,Helvetica,Arial,Geneva,sans-serif;
	color:#777e77;
}	

/* @end */

/* @group misc */
#skip img#logo-print {
	display:none;
}
.noshow, .structural {
	position: absolute;
	top:-9999px;
	left:-9999px;
	height: 1px;
	width: 1px;
	}
.clear {
	clear:both;
	}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
	
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.noborder {
	border:none;
	}

/* @end */

/* @group body backgrounds */

body#homepage {
 	background: transparent url(graphics/bg-body1.jpg) no-repeat 960px 430px;	
}
body#aboutpage {
 	background: transparent url(graphics/bg-body6.png) no-repeat fixed 1000px 370px;	
}
body#servpage,
body.alt {
 	background: transparent url(graphics/bg-body4.jpg) no-repeat fixed 960px 370px;	
}
body#portfpage {
 	background: transparent url(graphics/bg-body3.gif) no-repeat 960px 370px;	
}
body#newspage {
 	background: transparent url(graphics/bg-body5.gif) no-repeat fixed 960px 370px;	
}
body#contpage {
 	background: transparent url(graphics/bg-body2.jpg) no-repeat fixed 960px 370px;	
}

/* @end */

/* @group layout */

#skip {
	position:absolute;
	top:-9999px;
	left:-9999px;
}
#wrapper,
#portfpage #wrapper,
#homepage #wrapper,
#servpage #wrapper,
#aboutpage #wrapper {
	width:980px;
	position:relative;
	background: url(graphics/bg-wrapper-3.png) repeat-y;
}
#contpage #wrapper {
	background: url(graphics/bg-wrapper-2.png) repeat-y;
}
#header {
	background:#fff url(graphics/bg-header.gif) no-repeat left bottom;
	/*height:430px;*/
	/*min-height:430px;*/
	height:33.5em;
	width:960px;
	position:relative;
	}
#logo {
	position:absolute;
	top:30px;
	left:577px;
	}
#content-wrapper {
	background: url(graphics/bg-content-wrapper.gif) no-repeat 90% 100%;
}		
#content {
	float:left;
	width:589px;
	padding:0 30px 0 35px;
	position:relative;
}	
#homepage #content,
#portfpage #content,
#newspage #content {
	float:left;
	width:659px;
	padding:0;
}	
#footer {
	clear:both;
	position:relative;
	background: url(graphics/bg-footer.png) no-repeat 246px -28px;
	min-height:250px;
	padding:25px 0 0 280px;
}	
#footer-txt {
	clear:both;
	padding:120px 0 10px 157px;
}

/* @end */

/* @group navigation */

#nav {
	z-index:10;
	width:266px;
	height:303px;
	position:absolute;
	left:70px;
	top:42px;
	}
#nav ul {
	text-align:left;
	width:266px;
	}	
#nav ul li {
	padding:0;
	margin:0;
	height:47px;
	}
#nav a {
	border:0;
	position:relative;
	/* Hide from IE Mac \*/
	overflow:hidden;
	height:47px;
	/* End hide from IE Mac */
	}
#nav a span {
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	background-image:url(graphics/navigation.gif);
	background-repeat:no-repeat;
	cursor:pointer;
	}	
#nav a:link, #nav a:visited {display:block;}	

li#home a:link span, li#home a:visited span {background-position:0px 0px;}
li#home a:hover span, li#home a:focus span {background-position:0px -282px;}
li#about a:link span, li#about a:visited span {background-position:0px -47px;}
li#about a:hover span, li#about a:focus span {background-position:0px -329px;}
li#serv a:link span, li#serv a:visited span {background-position:0px -94px;}
li#serv a:hover span, li#serv a:focus span {background-position:0px -376px;}
li#portf a:link span, li#portf a:visited span {background-position:0px -141px;}
li#portf a:hover span, li#portf a:focus span {background-position:0px -423px;}
li#news a:link span, li#news a:visited span {background-position:0px -188px;}
li#news a:hover span, li#news a:focus span {background-position:0px -470px;}
li#cont a:link span, li#cont a:visited span {background-position:0px -235px;}
li#cont a:hover span, li#cont a:focus span {background-position:0px -517px;}

body#homepage #nav ul li#home a span {background-position:0px -564px;}
body#aboutpage #nav ul li#about a span {background-position:0px -611px;}
body#servpage #nav ul li#serv a span {background-position:0px -658px;}
body#portfpage #nav ul li#portf a span {background-position:0px -705px;}
body#newspage #nav ul li#news a span {background-position:0px -752px;}
body#contpage #nav ul li#cont a span {background-position:0px -799px;}


/* @end */

/* @group subnavigation */

ul#subnav {
	background:#00cce7 url(graphics/bg-subnav.gif) repeat-y right top;
	width:231px;
	padding-top:20px;
	margin:0 0 0 70px;
}
#portfpage ul#subnav {
	background:#fe006f url(graphics/bg-subnav-2.gif) repeat-y right top;
}
#subnav li {
	color:#fff;
	text-align:right;
	font:1.7em "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
}
#subnav li a:link, #subnav li a:visited {
	color:#dbfbff;
	border:none;
	display:block;
	padding:0 22px .2em 10px;
}
#portfpage #subnav li a:link,
#portfpage #subnav li a:visited {
	color:#ffdbe3;
}
#subnav li a:hover, #subnav li a:focus {
	color:#fff;
	background-color:transparent;
}
#subnav li a:active {
	color:#ff0066;
}
#portfpage #subnav li.sel a:link,
#portfpage #subnav li.sel a:visited,
#subnav li.sel a:link,
#subnav li.sel a:visited {
	color:#fff
}
li#cn a:hover, li#cn.sel {
	background: url(graphics/li-cn.gif) no-repeat right center;
}
li#web a:hover, li#web.sel {
	background: url(graphics/li-web.gif) no-repeat right center;
}
li#ee a:hover,li#ee.sel {
	background: url(graphics/li-ee.gif) no-repeat right center;
}
li#logos a:hover, li#logos.sel {
	background: url(graphics/li-logo.gif) no-repeat right center;
}
li#illu a:hover, li#illu.sel {
	background: url(graphics/li-illu.gif) no-repeat right center;
}
li#ui a:hover, li#ui.sel {
	background: url(graphics/li-ui.gif) no-repeat right center;
}
li#print a:hover, li#print.sel {
	background: url(graphics/li-print.gif) no-repeat right center;
}
li#other a:hover, li#other.sel {
	background: url(graphics/li-other.gif) no-repeat right center;
}
li#vee {
	padding-top:20px;
	text-align:right;
	white-space:nowrap;
}


/* @end */

/* @group sidebar */

#sidebar {
	width:301px;
	min-height:1005px;
	float:left;
	position:relative;
}
#homepage #sidebar{min-height:1260px; background:none;}
#contpage #sidebar {
	background-position: 70px top;
}
#newspage #sidebar {
	min-height:400px;
}
.alt #sidebar {
	background: url(graphics/bg-sidebar-2.gif) no-repeat right bottom;
}
#aboutpage #sidebar {
	min-height:700px;
	background:url(graphics/pattern-squares.jpg) no-repeat right top;
}
#servpage #sidebar {
	min-height:705px;
	background:url(graphics/pattern-circles.gif) no-repeat right top;
}
#sidebar blockquote {
	display:block;
	width:235px;
	height:560px;
	margin-left:66px;
	text-indent:-9999px;
}
#homepage #sidebar blockquote {
	margin-left:27px;
	width:274px;
	height:900px;
	background:url(graphics/bg-sidebar-home.jpg) no-repeat right top;
}
#newspage #sidebar blockquote {
	height:480px;
	background: url(graphics/quote-design-is.png) no-repeat 0 -230px;
}
#portfpage #sidebar blockquote {
	height:704px;
	background: url(graphics/quote-design-is-2.png) no-repeat;
}
#contpage #sidebar blockquote {
	margin-top:0px;
	min-height:700px;
	background: url(graphics/quote-design-is.png) no-repeat;
}
.alt #sidebar blockquote {
	background: url(graphics/graphic-web-design.gif) no-repeat right top;
}
.alt #sidebar blockquote {
	height:460px;
}
.alt #sidebar {
	min-height:685px;
}

/* @end */

/* @group text */

sup {
	line-height:0%;
}
#footer-txt p {
	text-align:left;
	letter-spacing:1px;
	font-size:.9em;
}
#content p {
	margin-bottom:1.5em;
}
p.intro {
	font:1.25em/130% "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
	}
p.right {
	text-align:right;
}
p.centered {
	text-align:center;
}
#content p.nomargin, ul.nomargin.list2 {
	margin-bottom:0;
	}
#content blockquote {
	background: url(graphics/blockquote-top.gif) no-repeat;
	padding-top:10px;
	width:487px;
	font-style: italic;
	margin-left:135px;
}
blockquote p {
	margin:0;
	font-size:1.1em;
	color:#858c84;
}
#content blockquote p {
	margin-left:0;
	width:467px;
	background: url(graphics/blockquote-bottom.gif) no-repeat left bottom;
	padding:0 10px 10px 10px;
}
.txt-box {
	padding:10px;
	background-color:#f6fbed;
	border:1px solid #def0cb;
}
#content .txt-box p {
	margin-bottom:0;
}
.big em,.bigger em, .hot,
.txt-box em {
	background:none;
	color:#d90057;
	font-style:normal;
	}	
.bigger {
	font: 1.25em "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
}
.big {
	font: 1.8em "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
}
.small {
	font-size:.9em;
}
p.star {
	background:url(graphics/star-blue.gif) no-repeat;
	padding-left:12px;
	}
em, cite {
	background-color:#e2ffff;
	color:#617c7e;
}
/* Live Preview text */
#content blockquote blockquote {
	background:none;
	margin:0;
}
#content blockquote p#TextDisplay {
	margin:0;
}
#content blockquote p#TextDisplay strong {
	color:#858c84;
}

/* @end */

/* @group headings */

h1, h2, h3, h4, h5, h6 {
	font-family: Helvetica, Arial, Geneva, sans-serif;
}
.alt h3,h2 {
	/*color:#a0d35f;*/
	font-size:1.8em;
	margin:.7em 0 .7em 0;
}
h3 {
	color:#858c84;
	font-size:1.3em;
	margin:1em 30px 0 .5em;
}
h4 {
	font-size:1.5em;
	margin:1.2em 30px .5em 135px;
}
h5 {
	font-size:1.3em;
	margin:1em 35px 5px 135px;
	background: url(graphics/bg-h5.gif) no-repeat;
	padding:0 0 10px 30px;
}
h6 {
	font-size:1.1em;
	margin:1em 35px 5px 135px;
	padding:0;
}
h2#t-discl {
	text-indent:-9999px;
	width:218px;
	height:36px;
	display:block;
	background: url(graphics/t-disclaimer.gif) no-repeat;
	margin:-36px 0 30px 0;
}

/* @end */

/* @group text links */

#logo img {
	border:none;
}
a, a:link {
	color:#3fa8c1;
	text-decoration:none;
	border-bottom:1px solid #3fa8c1;
}
a:visited {
	color:#84b0c0;
	text-decoration:none;
	border-bottom:1px solid #84b0c0;
}
a:hover, a:focus {
	color:#fff;
	background-color:#26a7c3;
	border-bottom-color:#26a7c3;
}
a:active {
	color:#ffff;
	background-color:#ff0066;
	border-bottom-color:#ff0066;
}
.no-result {
	color: #adb7ac;
	font:bold 2.4em/100% Helvetica, Arial, Geneva, sans-serif;
}
p.no-result {
	padding:20px 35px 35px 0;
}
li.no-result {
	padding:20px 35px 35px 138px;
}

/* @end */

/* @group images */

.noborder, a.noborder:link, a.noborder:visited {
	border: none;
}
a.noborder:hover {
	background:none;
}

img.right {
	float:right;
	margin:0 0 0 10px;
}
.vcardicon img {
	border:none;
}

/* @end */

/* @group Lists */

ul.list, ul.list2 {
	margin:0 0 2em 0;
}
ul.list li, ul.list2 li {
	border-bottom:1px solid #e8ede2;
}
ul.list li a {
	display:block;	
	padding:.2em 0 .2em 10px;
	background: url(graphics/li.gif) no-repeat;
}
ul.list li a:link {
	border:none;
	color: #5e94a6;
}
ul.list li a:visited {
	border:none;
	color: #739aa9;
}
ul.list li a:hover {
	background-color:#f6fbf0;
	color:#3fa8c1;
}
ul.list li a:active {
	color:#ff0066;
}
ul.list2 li {
	padding:.2em 0 .2em 10px;
	background: url(graphics/li.gif) no-repeat;
}


/* @end */

/* @group estimate & vcard */

#footer #estimate {
	width:290px;
	float:left;
	margin-right:50px;
}	
#footer #estimate p {
	padding-left:4px;
	font-size:.9em;
}	
#footer #v-card {
	width:305px;
	float:left;
	position:relative;
}
#contpage #footer #v-card,
.alt #footer #v-card {
	width:410px;
	}

#estimate h3 {
	background: url(graphics/t-convinced.gif) no-repeat;
	margin:0;
}
#homepage #estimate h3 {
	background: url(graphics/t-convinced.gif) no-repeat;
}
#servpage #estimate h3 {
	background: url(graphics/t-estimate.gif) no-repeat;
}
#portfpage #estimate h3 {
	background: url(graphics/t-how-much.gif) no-repeat;
}
#newspage #estimate h3 {
	background: url(graphics/t-effective.gif) no-repeat;
}
#estimate h3 a {
	display:block;
	height:69px;
	width:275px;
	text-indent:-9999px;
}
#estimate h3 a:link, #estimate h3 a:visited {border:none;}
#estimate h3 a:hover {background:none;}
#v-card h3 {
	background:url(graphics/h3-we-support.gif) no-repeat left center;
	display:block;
	height:69px;
	width:283px;
	position:relative;
	text-indent:-9999px;
	margin:0;
}
#v-card h3 span {
	position:absolute;
	top:18px;
	right:15px;
	text-indent:0px;
}
.vcard {
	padding:0 0 0 4px;
}
.vcard p {
	font-size:.94em;
	}
.adr {
	margin-bottom:10px;
}
.bullet {
	margin:0 3px;
	font-size:50%;
}
p.vcardicon img {
	margin-right:10px;
	float:left;
	}
	

/* @end */

/* @group page navigation */

ul.pagination {
	margin:0 35px;
}
li.previous a:link, li.next a:link,
li.previous a:visited, li.next a:visited {
	color:#fff;
	font: bold 24px/27px Helvetica, Arial, Geneva, sans-serif;
	border:none;
	display:block;
	height:45px;
}
li.previous a:hover, li.next a:hover {
	background-color:transparent;
}
li.previous, li.next {
	margin-bottom:30px;
}
li.previous {
	background:#26b6d0 url(graphics/previous.gif) no-repeat;
	padding:0 0 0 16px;
	width:8em;
	float:left;
}
li.next {
	background:#26b6d0 url(graphics/next.gif) no-repeat right top;
	padding:0 16px 0 0;
	text-align:right;
	width:4em;
	float:right;
}
li.next a, li.previous a {
	margin-top:-10px;
}

/* @end */

/* @group forms */

.btn {
	background: url(graphics/bg-btn.gif) no-repeat 0px 7px;
	border:none;
	color:#fff;
	padding:0 8px 8px 0;
	font: bold 1.8em Helvetica, Arial, Geneva, sans-serif;
	margin:10px 10px 0 0;
}
#post {
	cursor: pointer;	
}
.txt {
	width:392px;
	padding:.5em;
	margin:.5em 0 0 0;
	border:1px dashed #a6aea5;
	color:#959b94;
}


/* @end */

/* @group EE & EH */

#eh {
	position:absolute;
	top:210px;
	left:65px;
	background: url(graphics/hosted_by.png) no-repeat;
}
#pwrd-ee {
	position:absolute;
	top:170px;
	left:65px;
	background: url(graphics/powered_by.png) no-repeat;
}
#pwrd-ee a, #eh a {
	display:block;
	width:149px;
	height:38px;
	border-bottom:none;
	text-indent:-9999px;
}
#eh a:link, #eh a:visited,
#pwrd-ee a:link, #pwrd-ee a:visited {
	border:none;
}
#eh a:hover,#eh a:active,
#pwrd-ee a:hover,#pwrd-ee a:active {
	background-color:transparent;
}


/* @end */

/* @group 404 */

#notfound #content {
	background: url(graphics/404.jpg) no-repeat right bottom;
	width:960px;
	padding:50px 0 630px 27px;
}
#notfound #content p {
	padding:0 0 0 185px;
}
#notfound #content h2 {
	padding:0 0 0 185px;
	font: bold 2.8em Helvetica, Arial, Geneva, sans-serif;
	color:#acb6ab;
}

#notfound #content p a:visited {
	border-bottom-color: #504c4e;
}
/* @end */

/* @group message template */
#message h1 {
	width:600px;
	padding:50px 0 0 80px;
	line-height:125%;
	font: 2.4em "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
	}
#message #content {
	width:600px;
	padding:20px 0 0 80px;
}
#nmessage #content p {
	padding:0 0 0 185px;
}
#message #content h2 {
	font: 1.6em "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, Geneva, sans-serif;
	color:#acb6ab;
}
#message #content p a:visited {
	border-bottom-color: #504c4e;
}
#message ul {
	margin-bottom:2em;
	}
#message ul li {
	border-bottom:1px solid #504c4e;
	padding:.4em 0 .4em 12px;
	background:url(graphics/star-pink-onbrown.gif) no-repeat;
	}

/* @end */