/* 
stylesheet template hypotheekinfopunt.nl (basic.css)

INHOUD
1. Reset
2. Default
3. Headings
4. Links
5. Layout
6. Branding/Masthead	
7. Navigation
8. Contact/Formulieren
9. Classes
10. Home

COLOURS
Bordeaux = #a90056

/* 1.Reset 
------------------------------------------------------------*/
@import url(reset.css);


/* 2.Default
------------------------------------------------------------*/
body { font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:18px; color:#444; behavior:url(../_js/csshover.htc); }

p, dl, ol, ul { margin-bottom:18px; }

#main ul { margin-left:20px; }

ol { list-style:none; }

 
/* 3.Headings
------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 { color:#a90056; }

h1 { font-size:20px; margin-bottom:18px; font-weight:bold; }

h2 { font-size:14px; line-height:18px; font-weight:bold; }

h3 { font-size:12px; font-weight:bold; color:#444; }

h4 { font-size:12px; }


/* 4.Links
------------------------------------------------------------*/
a { text-decoration:none; color:#a90056; }

a:hover { text-decoration:underline; }


/* 5.Layout
------------------------------------------------------------*/
#wrapper { width:874px; margin:auto; overflow:hidden; }

#content { float:left; width:874px; }

#main { width:645px; float:right; padding:0 10px 30px 10px; }

#sidebar { width:189px; float:left; }

.doublecolumn { float:left; width:370px; }

.smallcolumn { float:left; }


/* 6.Branding/Masthead
------------------------------------------------------------*/
#masthead { float:left; width:874px; margin-bottom:40px; height:160px; }

*html #masthead { margin-bottom:-80px; } 

#masthead a.logo { float:left; text-indent:-9000px; display:block; height:160px; width:209px; margin-top:117px; background-color:#FFF; } 

#masthead p.klantenservice { font-size:20px; color:#a90056; float:right; margin:10px 0 0 0;  }
	

/* 7.Navigation
------------------------------------------------------------*/
ul#littlenav { float:left; line-height:12px; height:26px; margin-bottom:0; padding-top:16px; list-style:none; }

ul#littlenav li { padding-right:10px; float:left; }

ul#littlenav li.last { padding-right:0; }

ul#littlenav li a { color:#666; font-weight:bold; font-size:11px; }

ul#littlenav li a:hover, ul#littlenav li a.active { color:#a90056; text-decoration:none; }


ul#mainnav { width:665px; height:119px; float:right; margin-bottom:0; list-style:none; }

ul#mainnav li { width:129px; height:118px; margin-right:5px; float:left;  }

ul#mainnav li.sparen { margin-right:0; }

ul#mainnav li.hypotheken a, ul#mainnav li.financieringen a, ul#mainnav li.verzekeringen a, ul#mainnav li.pensioenen a, ul#mainnav li.sparen a { display:block; float:left; text-indent:-9999px; width:129px; height:118px; }

ul#mainnav li.hypotheken a:hover, ul#mainnav li.financieringen a:hover, ul#mainnav li.verzekeringen a:hover, ul#mainnav li.pensioenen a:hover, ul#mainnav li.sparen a:hover { background-position:-129px 0; }

ul#mainnav li.hypotheken a { background:url(../_img/tmpl/btn_hypotheken.gif) no-repeat;  }

ul#mainnav li.financieringen a { background:url(../_img/tmpl/btn_financieringen.gif) no-repeat; }

ul#mainnav li.verzekeringen a { background:url(../_img/tmpl/btn_verzekeringen.gif) no-repeat; }

ul#mainnav li.pensioenen a { background:url(../_img/tmpl/btn_pensioenen.gif) no-repeat; }

ul#mainnav li.sparen a { background:url(../_img/tmpl/btn_sparen.gif) no-repeat; }


ul#subnav { float:left; margin-bottom:10; font-size:11px; padding-left:19px; list-style-position:outside; }

ul#subnav li { color:#000; list-style-image:url(../_img/tmpl/pijl.gif); }

ul#subnav li a { color:#333; }

ul#subnav li a:hover, ul#subnav li a.active { color:#a90056; text-decoration:none; }

p.titel { height:24px; width:152px; background:url(../_img/tmpl/bg_homeitems.jpg) no-repeat; margin-bottom:4px; line-height:24px; padding-left:10px; color:#333; font-size:12px; font-weight:bold; float:left; }

.special { margin-bottom:2px; }

p.verzekerbutton a { background:url(../_img/tmpl/buttons_verzekeringen.gif) no-repeat; height:21px; width:127px; margin-bottom:2px; padding:5px 0 0 35px ; color:#fff; font-size:12px; font-weight:bold; float:left; }

p.verzekerbutton a:hover { text-decoration:none; }

p.verzekeringen { height:24px; width:152px; background:url(../_img/tmpl/bg_homeitems.jpg) no-repeat; margin-bottom:4px; line-height:24px; padding:0 0 0 10px; color:#333; font-size:12px; font-weight:bold; float:left; }

p.personenauto a { background-position:0 0;  }

p.bestelauto a { background-position:0 -26px; }

p.motorfiets a { background-position:0 -52px; }

p.bromfiets a { background-position:0 -78px; }

p.zorgverzekering a { background-position:0 -104px; }

p.gezinsrechtbijstand a { background-position:0 -130px; }

p.uitvaart a { background-position:0 -156px; }

p.woonpakket a { background-position:0 -182px; }

p.notie { text-decoration:underline; }


/* 8.Contact/Formulieren
------------------------------------------------------------*/
ol li { margin-bottom:5px; }

label { display:block; float:left; width:130px; padding-top:3px; }

body#contact label { width:100px; }

.height { height:80px; }

label.biglabel { width:400px; }

ol#maxbedrag label { width:150px; }

.text { border:1px solid #999; background:#fff; padding:4px 2px 2px 2px; height:16px; width:240px; font-family:Arial, Helvetica, sans-serif; font-size:12px; }

.area { height:140px; overflow:hidden;  }

.dag, .maand { width:20px; }

.jaar { width:35px; }

.small { width:60px; margin-right:20px; }

.radio { margin-bottom:3px; }

.verplicht { font-size:11px; margin-right:35px; }

.alert { color:#FF0000; }

button, a.offerte { background: url(../_img/tmpl/buttons.gif) no-repeat #999; height:20px; display:block; text-indent:-9999px; border:none; cursor:pointer; }

button.send { background-position:0 0; width:113px; }

button.send:hover { background-position:0 -20px; }

button.bereken { background-position:-113px 0; width:61px; }

button.bereken:hover { background-position:-113px -20px; }

a.offerte { background-position:-174px 0; width:110px; }

a.offerte:hover { background-position:-174px -20px; }

.statusok { font-weight:bold; color:#009900; }

.statuserror { font-weight:bold; color:#F00; }


/* 9.Classes
------------------------------------------------------------*/
.fl { float:left; }

.fr { float:right; }

.clear { clear:both; }

a.contact { display:block; padding:2px 10px; color:#FFF; background:#717174 url(../_img/tmpl/info_arrow.gif) right no-repeat; width:350px; }

a.contact:hover { background:#a90056 url(../_img/tmpl/info_arrow_red.gif) right no-repeat; text-decoration:none; }

.leenbanner { margin-bottom:30px; float:right; }

.banner { float:right; margin:0 0 20px 20px; border:none;  }

.argenta { color:#03884f; text-align:center; font-size:18px; line-height:22px; width:140px; }

.hypo {  font-size:18px; line-height:22px; position:relative; width:264px; }

.hypo a { color:#00a7e3; }

.hypo span { position:absolute; bottom:30px; left:10px;  }

a.acrobat { text-indent:-9999px; background:url(../_img/tmpl/acrobat.gif) no-repeat; width:88px; height:31px; display:block; margin-top:8px; }


/* 9.Vestigingen
------------------------------------------------------------*/
ul#vestigingen { float:left; list-style:none; margin-left:0px; width:645px;  }

ul#vestigingen li { float:left; border-top:1px solid #999; margin-right:30px; height:290px; padding-bottom:20px; line-height:15px; width:300px; clear:both; }

ul#vestigingen li.even { margin-right:0; clear:none; }

ul#vestigingen li span { width:60px; display:block; float:left; }


/* 10.Homepage
------------------------------------------------------------*/
#home #wrapper { width:834px; }

#home #masthead { height:435px; width:834px; border-bottom:1px solid #dbdbdc; margin-bottom:6px; }

#home #masthead a.logo { float:left; text-indent:-9000px; display:block; height:63px; width:209px; background-color:#FFF; margin-top:0; } 

#home #masthead p.klantenservice { margin:15px 0 0 0;  }

#home ul#mainnav { width:834px; height:366px; float:left; margin-bottom:0;list-style:none; position:relative; padding:0; }

*html #home ul#mainnav { margin-bottom:-40px; } 

#home ul#mainnav li div { position:relative; bottom:68px; padding:0 10px; line-height:16px; height:45px; cursor:pointer; }

#home ul#mainnav li div span { color:#01a7e3; }

#home ul#mainnav li { width:162px; height:366px; margin-right:6px; float:left;  }

#home ul#mainnav li.sparen { margin-right:0; }

#home ul#mainnav li.hypotheken a, #home ul#mainnav li.financieringen a, #home ul#mainnav li.verzekeringen a, #home ul#mainnav li.pensioenen a, #home ul#mainnav li.sparen a { display:block; float:left; text-indent:-9999px; width:162px; height:366px; }

#home ul#mainnav li.hypotheken a:hover, #home ul#mainnav li.financieringen a:hover, #home ul#mainnav li.verzekeringen a:hover, #home ul#mainnav li.pensioenen a:hover, #home ul#mainnav li.sparen a:hover { background-position:-162px 0; }

#home ul#mainnav li.hypotheken a { background:url(../_img/tmpl/btn_hypotheken_home.jpg) no-repeat;  }

#home ul#mainnav li.financieringen a { background:url(../_img/tmpl/btn_financieringen_home.jpg) no-repeat; }

#home ul#mainnav li.verzekeringen a { background:url(../_img/tmpl/btn_verzekeringen_home.jpg) no-repeat; }

#home ul#mainnav li.pensioenen a { background:url(../_img/tmpl/btn_pensioenen_home.jpg) no-repeat; }

#home ul#mainnav li.sparen a { background:url(../_img/tmpl/btn_sparen_home.jpg) no-repeat; }

#home ul#littlenav { float:right; clear:right; margin:0; height:12px; padding-top:10px; }



ul#homeitems { float:left; list-style:none; }

ul#homeitems li { width:162px; margin-right:6px; float:left; font-size:10px; }

*html ul#homeitems li { margin-right:0px; }

ul#homeitems li p, ul#homeitems li ol { padding:0 0 0 10px; line-height:15px; }

ul#homeitems li h3 { height:24px; width:152px; background:url(../_img/tmpl/bg_homeitems.jpg) no-repeat; margin-bottom:4px; line-height:24px; padding-left:10px; color:#333; font-size:12px; font-weight:bold; float:left; }

ul#homeitems li.holland { background:url(../_img/tmpl/holland.gif) no-repeat right; height:140px; margin-right:0; }

ul#homeitems li.holland a { background: url(../_img/tmpl/btn_home.gif) no-repeat #999 -92px 0; height:17px; display:block; width:51px; text-indent:-9999px; margin-top:9px; cursor:pointer; }

ul#homeitems li.holland a:hover { background-position:-92px -17px; }

ul#homeitems li.quick a { color:#444; padding-left:20px; background:url(../_img/tmpl/pijl.gif) no-repeat; }

*html ul#homeitems li.quick { margin-right:6px; }

*html ul#homeitems li.nieuwsbrief, *html ul#homeitems li.login { margin-right:-4px; }

ul#homeitems li ol .text { width:140px; height:12px; font-size:10px; }

ul#homeitems li ol button { background: url(../_img/tmpl/btn_home.gif) no-repeat #999; height:17px; display:block; text-indent:-9999px; border:none; cursor:pointer; }

ul#homeitems li ol button.send { background-position:0 0; width:52px; }

ul#homeitems li ol button.send:hover { background-position:0 -17px; }

ul#homeitems li ol button.login { background-position:-52px 0; width:40px; }

ul#homeitems li ol button.login:hover { background-position:-52px -17px; }

ul#homeitems li.nieuwsbrief p { margin-bottom:12px; }

.flashbanner { float:left; width:168px; background-color:#CCC; height:118px; margin-top:15px; }


/* 10.Prospectussen
------------------------------------------------------------*/
#prospectussen { list-style:url(../_img/tmpl/acrobat_ico.gif); float:left; width:300px; padding-bottom:20px; }

#prospectussen a { color:#444; background:url(../_img/tmpl/acrobat_ico.gif) no-repeat; padding-left:24px; }

body#contact img.persoon { border:1px solid #999; margin-bottom:18px; }

a.vergelijkdirect { display:block; width:190px; height:41px; text-indent:-9999px; background:url(../_img/tmpl/vergelijkdirect_bijstand.gif) no-repeat; }

body#contact p span { width:50px; display:block; float:left; }

body#contact p span.big { width:135px; } 

ol.extra label { width:200px; }

#openingstijden { border:1px solid #a90056; clear:both; width:600px; padding:10px; }

#openingstijden h4 { font-size:14px; color:#a90056; margin-bottom:8px; }

#openingstijden p { margin:0; }