/*
*
*  Sylesheet for Howarddesign.nl
*
*/

body,html
{
text-align:center;
padding:0px;
margin:0px;
background-color: #303030;
height:100%;
font-family: Arial;
font-size:10px;
color: #595959;
vertical-align:middle;
}

p
{
margin:0px;
padding:0px;
}


#containermidden{
width:800px;
text-align:left;
margin:0pt auto;
height:604px;
background-color: #ffffff;
position:absolute;
left: 50%;
top: 50px;
/*margin-top: -300px;*/ /* half of the height */
margin-left: -400px; /* half of the width */
}

#header{
width:800px;
height:78px;
background-image: url(../image/logo_howard_design.jpg);
background-repeat: no-repeat;
background-position: 252px 22px;
}

#data_left{
width:400px;
height:388px;
background-image: url(../image/vert_sep_wit.jpg);
background-repeat: repeat-y;
background-position: right top;
text-align:left;
}

.data_left_editor{
background-image: url(../image/vert_sep_wit.jpg);
background-repeat: repeat-y;
background-position: top right;
}


#data_right{
width:383px;
height:522px;
float:left;
padding-left:17px;
font-family: Arial;
font-size:13px;
color: #4b4b4b;
}



#data_right A:link {text-decoration: none; color: #4b4b4b;}
#data_right A:visited {text-decoration: none; color: #4b4b4b;}
#data_right A:active {text-decoration: none; color: #4b4b4b;}
#data_right A:hover {text-decoration: none; color: #989d9e;}

.data_right_editor{
width:383px;
height:522px;
padding-left:17px;
font-family: Arial;
font-size:13px;
background-color:#ffffff;
}

.data_right_bottom{
width:383px;
display:table;
}

.data_right_editor A {text-decoration: none; color: #595959;}

.data_right_editor A:link {text-decoration: none; color: #595959;}
.data_right_editor A:visited {text-decoration: none; color: #595959;}
.data_right_editor A:active {text-decoration: none; color: #595959;}
.data_right_editor A:hover {text-decoration: underline; color: #595959;}

#col_left{
float:left;
}

#data_left_bottom{
width:350px;
height:133px;
padding:16px;
}

#data_left_bottom A:link {text-decoration: none; color: #595959;}
#data_left_bottom A:visited {text-decoration: none; color: #595959;}
#data_left_bottom A:active {text-decoration: none; color: #595959;}
#data_left_bottom A:hover {text-decoration: underline; color: #595959;}

#data_left_bottom A{
background-image: url(../image/link_button.jpg);
background-repeat: no-repeat;
padding-left:14px;
width:150px;
display:block;
padding-bottom:2px;
padding-top:2px;
}

.data_left_bottom_editor{
width:400px;
height:133px;
padding:16px;
font-size:12px;
background-color:#ffffff;
}

.data_left_bottom_editor A:link {text-decoration: none; color: #595959;}
.data_left_bottom_editor A:visited {text-decoration: none; color: #595959;}
.data_left_bottom_editor A:active {text-decoration: none; color: #595959;}
.data_left_bottom_editor A:hover {text-decoration: underline; color: #595959;}

.data_left_bottom_editor A{
background-image: url(../image/link_button.jpg);
background-repeat: no-repeat;
padding-left:14px;
width:350px;
height:20px;
display:block;
}

#image_1{
width:167px;
height:156px;
/*margin-top:4px;*/
display:block;
float:left;
background-image: url(../image/ontwerpen_concepten_corpora.jpg);
}

/*
#image_1:hover {background-image: url(../image/ontwerpen_concepten_corpora_hover.jpg)}
#image_2:hover {background-image: url(../image/brochures_periodieken_drukw_hover.jpg)}
#image_3:hover {background-image: url(../image/webdesign_multimedia_produc_hover.jpg)}
#image_4:hover {background-image: url(../image/presentatiewanden_beursstan_hover.jpg)}
*/

#link_1{
width:171px;
height:24px;
margin-top:6px;
margin-left:3px;
display:block;
float:left; 
}


#image_2{
width:163px;
height:156px;
/*margin-top:4px;*/
margin-left:26px;
display:block;
float:left;
background-image: url(../image/brochures_periodieken_drukw.jpg);
}

#link_2{
width:167px;
height:42px;
margin-top:6px;
margin-left:26px;
display:block;
float:left;    
}



#image_3{
width:171px;
height:164px;
margin-top:12px;
display:block;
float:left;
background-image: url(../image/webdesign_multimedia_produc.jpg);
}


#link_3{
width:165px;
height:56px;
padding-top:9px;
padding-left:6px;
display:block;
float:left;
background-image: url(../image/webdesign_multimedia_producties_onder.jpg);
}


#image_4{
width:170px;
height:164px;
margin-top:12px;
margin-left:22px;
display:block;
float:left;
background-image: url(../image/presentatiewanden_beursstan.jpg);
}

#link_4{
width:151px;
height:56px;
padding-top:9px;
margin-left:18px;
padding-left:14px;
display:block;
float:left;
background-image: url(../image/presentatiewanden_beursstands_onder.jpg);
background-position: 5px 0px;
}

.preload{
display:none;
}