/* CSS Document Artylicious V3*/

* {	
margin: 0;
padding: 0;
font-family:"trebuchet MS", Arial, Helvetica, sans-serif;
}
/******************** BODY *******************/
body{
font-size: 100%;
background-image:url(../assets/layout/bg_new2.gif);
}
#header{
height:86px;
width:900px;
margin:0 auto;
}
/**************** OUTER BOX ******************/
#container{
width:100%;
background:#fff url(../assets/layout/bg.jpg) repeat-x;
}
#box{
width:890px;
padding:0px 0px 0px 10px;
margin:0 auto;
}
/**************** HEADER *********************/
#header{
width:580px;
color: #000000;
background: #fff url(../assets/layout/bg_header.jpg) 0 0 repeat-x;
float:left;
}
#header img {
display: block;
height: 86px;
width: 280px;
text-decoration: none;
text-indent: -9999pt;
position: absolute;
top: 0px;
border:0px;
}
.off{
position:absolute;
left:-1000em;
top:-1000em;
}
/************** MENU *************************/
#menu{
background:#635D4F url(../assets/layout/menubg.gif);
border-bottom:1px solid #666;
border-top:1px solid #eee0c1;
width:570px;
float:left;
margin:0 auto;
display:block;
}
#nav, #nav ul {
float: left;
width: 100%;
list-style: none;
line-height: 1.0;
background:transparent;
border: solid #000;
border-width: 0 0;
}
#nav a {
font-family:Arial, Helvetica, sans-serif;
font-size:0.8em;
display: block;
width: 9em;
text-decoration: none;
padding: 7px;
border-top:1px solid #eee0c1;
color:#f2ede1;
}
#nav a:hover{
color:#000;
background-color:#a29b8a;
}
#nav a.daddy {
background:url(../assets/layout/divider.gif) left no-repeat;
display:block;
height:19px;
width:60px;
border-top:0px;
text-align:center;
padding:9px 12px 1px 14px;
font-weight:bold;
text-decoration:none;
color:#f2ede1;
}
#nav a.home{
width:40px;
padding:9px 12px 1px 15px;
}
#nav a.info{
width:22px;
}
#nav a:hover.daddy, #nav a.current{
color:#000;
background:url(../assets/layout/active_bg.gif) left repeat-x;
}
#nav li {
float:left;
}
#nav li ul {
position: absolute;
left: -999em;
height: auto;
width: 160px;
font-weight: normal;
background-color:#615946;
border-width: 1px;
margin-left: 1px;
}
#nav li li {
float:left;
width: 146px;
}
#nav li ul a {
width: 146px;
}
#nav li ul ul {
margin: -1.75em 0 0 160px;
}
#nav li:hover ul ul, #nav li.sfhover ul ul{
left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul{
left: auto;
}
#nav li:hover{
color:#000;
}
/*********************** TEXT *************************/
#text{
float:left;
width:550px;
margin:20px 0px 0px 0px;
padding-bottom:16px;
}
#text p, #textwijd p{
color: #58564f;
text-decoration: none;
font-size: 0.8em;
line-height: 20px;
padding: 8px 0px 10px 0px;
}
.list li{
background:url(../assets/layout/li.gif) left 4px no-repeat;
padding:1px 0px 1px 16px;
list-style:none
}
.listside li{
background: url(../assets/layout/li.gif) left center no-repeat;
padding:2px 0px 2px 16px;
border-bottom:1px solid #EFEADD;
list-style:none
}
.listside a:link, .listside a:visited{
color:#227788;
text-decoration:none;
}
.listside a:hover, .listside a:active{
color:#000;
text-decoration:none;}
.list
{margin:12px 0px}
#text li, #textwijd li{
color: #58564f;
font-size: 0.8em;
list-style-type: none;
}
.textpart{
background:url(../assets/layout/dotted.gif) bottom left repeat-x;
margin-bottom: 16px;
padding-bottom:4px;
height: 1%
}
html>body .textpart {
height: auto
}
/*************** Brede Text ********************/
#textwijd{
float:left;
width:860px;
margin-top:-40px;
padding-bottom:16px;
}
.textpartwijd{
width:860px;
text-align:justify;
clear: both;
background:url(../assets/layout/dotted.gif) bottom repeat-x;
margin-bottom: 16px;
padding-bottom:4px;
}
/*********************** DATUM *************************/
.datum{
width:42px;
float:left;
text-align:center;
color:#444;
border:1px solid #33aabb;
margin:13px 8px 0px 0px;
padding:4px 4px;
}
.datum dt {
display: block; 
background:url(../assets/layout/bgdate.jpg) center repeat-x;
width: 42px;
height: 42px;
text-align: center;			
}
.datum dt span {		
padding: 8px 1px 0px 0px;
font-size: 0.6em;
color: #666;
text-transform: uppercase;
display: block;		
line-height: 0.6em;
}	
.datum dt strong {	
padding-right:1px;		
font-family: Georgia, "Times New Roman", Serif;
font-size: 1.2em;
font-weight:normal;
color: #666;
display: block;		
}
/************** RIGHT SIDE ************************/
#right {
width: 310px;
margin-top: 36px;
float: right;
background:url(../assets/layout/bg_projecten.gif) 0px 50px no-repeat;
font-size:0.7em;
color:#58564f;
padding-bottom:10px;
}
.project, .projectlast{
width: 252px;
margin: 0px 0px 6px 26px;
padding: 7px 0px 0px 0px;
border-bottom:1px solid #ddccbb;
line-height:3.0em;
}
.projectlast{
border:0px;
}
.img a:link, .img a:visited{
display:block;
background-color:#FFFFFF;
color:#58564f;
border:1px solid #cdc6b6;
padding:5px;
text-decoration:none;
}
.img img{
border:0px
}
.img a:hover, .img a:active{
border:1px solid #79715C;
background-image:url(../assets/layout/bg_img.gif);
}
a.leesmeer, .leesmeer a:link, .leesmeer a:visited{
color:#338899;
background:url(../assets/layout/link.gif) no-repeat center right;
padding:0px 13px 0px 0px;
}
.leesmeer a:hover, .leesmeer a:active{
color:#FF6600;
background:url(../assets/layout/link_hover.gif) no-repeat center right;
}
.check{
text-align:justify; 
border:1px solid #cdc6b6; 
width: 232px;
margin: 18px 0px 8px 26px;
padding: 0px 10px 8px 10px;
background-color:#FFFFFF;
line-height:1.6em;
}
.check h3{
text-align:right;
padding:7px 10px 2px 0px;
margin:0px -10px 4px -10px;
font-size:1.1em;
color:#227788;
border-bottom:1px dotted #cdc6b6;
}
/************** HEADERS **********************/
h1 {
background:url(../assets/layout/h1.gif) left bottom no-repeat;
font-family:Arial, Helvetica, sans-serif;
font-size: 1.1em;
letter-spacing:1px;
font-weight: normal;
padding:8px 0px 4px 0px;
margin-bottom:2px;
color: #227788;
}
h2 {
font-size: 0.8em;
font-weight: bold;
color: #58564f;
margin:10px 0px -10px 0px;
}
/************** FOOTER ***********************/
#footer{
background:#fff url(../assets/layout/bg_footer3.gif) 0px 1px repeat-x;
clear:both;
width:100%;
font-size:12px;
color:#d6cfbe;
padding:6px 0px 3px 0px;
border-top:4px solid #458da5;
border-bottom:1px solid #333;
}
#footertekst{
width:889px;
padding-left:11px;
margin:0 auto;
}
#footer a:link, #footer a:visited{
color:#88CCFF;
background-color:#635d4f;
text-decoration:none;
}
#footer a:active, #footer a:hover{
color:#fff;
background-color:#635d4f;
text-decoration:none;
}
/****************** REGULAR LINKS *****************/
a:link, a:visited{
color:#ff6600;
text-decoration:underline;
}
a:hover, a:active{
color:#227788;
text-decoration:underline;
}
/******************* TAGS *************************/
.tags{
text-align:justify; 
font-family:Arial, Helvetica, sans-serif;
}
.link1{
color:#ff6600;
background-color:#FFF;
font-style:italic;
text-decoration:none;
}
.link2{
color:#527176;
background-color:#FFF;
text-transform:uppercase;
text-decoration:none;
}
.link3{
color:#776745;
background-color:#FFF;
font-weight:bold;
text-decoration:none;
}
.tags a:link, .tags a:visited{
color:#527176;
background-color:#FFF;
text-decoration:none;
line-height:1.8em;
cursor: help;
}
.tags a:hover, .tags a:active{
color:#333;
background-color:#FFFF99;
text-decoration:none
}
/****************** FORMULIEREN *********************/
label{
line-height: 22px;
width: 120px;
float: left;
}
.offerte label{
width: 146px;
}
input.chk {
margin-top:2px;
}
input, textarea{
border: 1px solid #B3AC9A;
font-size:13px;
}
input.input, textarea {
width:50%;
color:#58564F;
background:#fff url(../assets/layout/form-bg.jpg) repeat-x;
margin:3px 0px 3px 0px;
padding:2px;
}
.offerte input.input{
width:250px;
}
.offerte textarea{
width:400px;
}
input#domein{
width:50%;
color:#58564F;
background:#fff url(../assets/layout/form-bg.jpg) repeat-x;
margin:0px;
padding:2px;
}
input#form-submit{
cursor:pointer;
color:#58564F;
width:80px;
margin:8px 0px 0px 120px;
background:#fff url(../assets/layout/button-bg.jpg) top repeat-x;
}
input#submit, input#reset {
font-size:12px;
color:#58564F;
height:24px;
cursor:pointer;
width:80px;
background:#fff url(../assets/layout/button-bg.jpg) top repeat-x;
}
input#reset{
width:110px}
input#radio{
float:left;
}
.clear {
clear: both;
line-height: 0px; 
display: block;
}
input:focus, textarea:focus{
border: 1px solid #58564f;
}
legend{
font-weight:bold;
font-size:0.8em;
color:#58564F;
padding:2px 5px;
background:#eef8fb;
border:1px solid #E9E1D0;
margin-top:4px;
}
fieldset{
border:1px solid #E9E1D0;
padding:3px 10px;
margin:0px 0px 8px 0px;
background-color:#FBFAF7;
}
/****************** Afbeeldingen Contactpagina ****************/
li.phone {
background:url(../assets/layout/phone.gif) 0px 50% no-repeat;
padding:0px 0px 0px 23px;
}
li#fax {
background:url(../assets/layout/faxmach.gif) 0px 50% no-repeat;
padding:0px 0px 0px 23px;
}
li#vcard {
background:url(../assets/layout/vcard.gif) 0px 50% no-repeat;
padding:0px 0px 0px 23px;
}
li#email {
background:url(../assets/layout/email.gif) 0px 50% no-repeat;
padding:0px 0px 0px 23px;
}
/********************** CV *************************************/
.cv {
line-height: 24px;
font-weight:bold;
margin-right: 4px;
}
.cvimg{
padding:6px;
margin-right:12px;
background-color:#f4f1e8;
border:1px solid #ddccbb;
margin-top:5px;
}
.cvextra:hover {
color:#227788;
cursor:pointer;
}
.cvextra{
padding:8px 0px}
.emoticon{
margin-right:12px}
/******************** Portfolio *******************************/
.portfolioleft{
font-size:0.8em;
width:270px;
float:left;}
.portfolioleft img{
margin:0px 0px 0px 0px;
}
.portfolioleft a:link, .portfolioleft a:visited {
display:block;
width:245px;
height:175px;
padding:6px;
background:url(../assets/layout/bg_voor.gif) top left no-repeat;
}
.portfolioleft a:hover, .portfolioleft a:active{
background-image:url(../assets/layout/bg_na.gif);
}
.portfolioright{
color: #58564f;
font-size:1.0em;
width:270px;
float:left;
padding:0 0 0px 8px;
}
.portfolioright p{
padding:2px 0px !important}
.portfolioright h4{
border-bottom:1px solid #D8E7EA;
color:#227788;
padding-bottom:2px;
margin-bottom:8px;
font-size:0.8em;
}
.portfolio{
padding:18px 0px 16px 0px;
height:190px;
background-image:url(../assets/layout/dotted.gif);
background-position:bottom left;
background-repeat:repeat-x;
}