/* Fietsenkampioen Stylesheet 15-08-2007 i-Aspect B.V. door: Rutger Laurman */ html{ margin:0px; padding:0px; background:url(../images/bg_header.gif) repeat-x top; } body{ margin:0px; padding:0px; font:13px Arial, Helvetica, sans-serif; color:#423838; } /* standaard tags */ h1,h3,h4{ margin:0px; padding:0px;} h2{ font-size:20px; color: #fba80d; } h3 { font-size:16px; } p { line-height:18px; } div.leftcolumn p strong{ color:#fba80d; } hr{ display:none; } div.hr{ height:1px; padding-top:5px; padding-bottom:5px; border-top:1px solid #bdbcbc; } /* koppen */ h3.vacatures{ background:url(../images/kop_vacatures.gif) no-repeat left; } h3.winkelsindebuurt{ background:url(../images/kop_winkelsindebuurt.gif) no-repeat left; } h3.poll{ background:url(../images/kop_poll.gif) no-repeat left; } h3.zoekoccasion{ background:url(../images/kop_zoekeenoccasion.gif) no-repeat left; } /* knoppen */ button { background-position:left; background-repeat:no-repeat; text-indent:-500px; border:0px; text-decoration:underline; color:#fff; font-size:13px; cursor:pointer; } button.radio{ background:url(../images/btn_radio.gif) no-repeat left; text-decoration:none; text-indent:0px; padding-left:20px; width:auto; text-align:left; font-size:12px; color:#423838; } button:hover.radio{ background-image:url(../images/btn_radio-on.gif); text-decoration:underline; } button.zoekoccasion{ width:125px; height:26px; background-image:url(../images/btn_zoekoccasion.gif); } button.zoekwinkel { width:114px; height:26px; background-image:url(../images/btn_zoekwinkel.gif); } button.versturen { width:125px; height:26px; background-image:url(../images/btn_versturen.gif); } /* inhoud */ div#container{ width:775px; margin:auto; position:relative; } div#header{ position:relative; top:0px; height:86px; width:775px; background-repeat:no-repeat; background-position:right top; overflow:hidden; } div#header h1{ position:relative; font-size:16px; padding-top:10px; height:65px; width:223px; } div#content{ position:relative; top:35px; margin:0 auto; padding-top:20px; overflow:hidden; margin-bottom:100px; } div#content div.leftcolumn{ width:505px; float:left; } /* zoekblok */ div#zoekblok{ background:url(../images/bg_zoekblok.jpg) no-repeat; width:223px; height:224px; padding-left:280px; } div#zoekblok fieldset{ border:0px; padding-top:20px; } div#zoekblok fieldset legend{ display:none; } div#zoekblok fieldset input, div#zoekblok fieldset select, div#zoekblok fieldset label{ width:165px; height:22px; padding:2px; color:#423838; font-size:13px; } div#zoekblok fieldset input{ height:16px; width:156px; } div#zoekblok fieldset label{ height:20px; display:block; color:#fff; font-weight:bold; font-size:1.1em; padding-top:5px; clear:right; } div#zoekblok button{ margin-top:10px; margin-left:38px; } div#zoekblok input.lighttext{ color:#9b9a9a; } /* text block */ div#content div.leftcolumn div.textblock { clear:both; margin-top:20px; } div#content div.leftcolumn div.textblock h3{ width:504px; height:32px; text-indent:-5000px; margin:0px; } div#content div.leftcolumn div.textblock h3.recenteoccasions{ background:url(../images/kop_recenteoccasions.gif) no-repeat left; } div#content div.leftcolumn div.textblock p{ margin:0px; margin-bottom:15px; width:484px; padding:10px; line-height:18px; background:url(../images/bg_textblock.gif) no-repeat left bottom; } /* content */ div#content div.leftcolumn h3{ margin-bottom:10px; } div#content div.leftcolumn p{ margin-top:10px; margin-bottom:15px; line-height:18px; } div#content div.leftcolumn p a{ color:#fba80d; font-weight:bold; } /* over fietsenkampioen top 5 */ div#content div.leftcolumn ul.top5{ margin:0px; margin-top:-25px; margin-bottom:20px; padding-left:40px; border-top:1px solid #bcbcbc; border-bottom:1px solid #bcbcbc; list-style:none; padding-top:20px; background:url(../images/top5.jpg) no-repeat 0px 20px; } div#content div.leftcolumn ul.top5 li{ font-weight:bold; height:47px; } /* occasion list */ div#content div.leftcolumn ul.occasionlist{ list-style:none; margin:0px; margin-bottom:20px; margin-top:10px; padding:0px; clear:both; } div#content div.leftcolumn ul.occasionlist li{ width:490px; height:106px; padding:7px; margin-bottom:10px; overflow:hidden; background:url(../images/bg_occasionlistitem.jpg) no-repeat left top; cursor:pointer; } div#content div.leftcolumn ul.occasionlist li.hover, div#content div.leftcolumn ul.occasionlist li.hover a img{ cursor:pointer; } div#content div.leftcolumn ul.occasionlist li.hover a img, div#content div.leftcolumn ul.occasionlist li a:hover img{ border-color:#2e2525; } div#content div.leftcolumn ul.occasionlist li.hover h4, div#content div.leftcolumn ul.small li.hover h4 {text-decoration:underline; } div#content div.leftcolumn ul.occasionlist li img{ display:block; float:left; border:8px solid #423838; } div#content div.leftcolumn ul.occasionlist li h4{ font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:14px; float:right; width:342px; height:20px; padding:4px; padding-bottom:0px; overflow:hidden; } div#content div.leftcolumn ul.occasionlist li p{ width:342px; height:47px; float:right; line-height:18px; margin:0px; padding:4px; padding-top:0px; overflow:hidden; } /* alle beschrijving styles overrulen */ div#content div.leftcolumn ul.occasionlist li p *{ font-weight:normal !important; color:#423838 !important; text-decoration:none !important; } div#content div.leftcolumn ul.occasionlist li span.footer{ width:342px; padding:4px; padding-top:8px; display:block; float:right; text-align:right; } div#content div.leftcolumn ul.occasionlist li span.footer a{ font-weight:bold; color:#fba80d; } div#content div.leftcolumn ul.occasionlist li span.footer strong{ font-size:18px; margin-left:20px; } div#content div.leftcolumn ul.small li, div#content div.leftcolumn ul li.noresults{ height:52px !important; background:url(../images/bg_occasionlistitemsmall.jpg) no-repeat left top !important; } div#content div.leftcolumn ul li.noresults { cursor:default !important; } div#content div.leftcolumn ul.small li h4, div#content div.leftcolumn ul.small li p, div#content div.leftcolumn ul li.noresults h4, div#content div.leftcolumn ul li.noresults p{ float:left; } div#content div.leftcolumn ul.small li p, div#content div.leftcolumn ul li.noresults p{ height:20px; } div#content div.leftcolumn ul li.noresults p{ width:500px; } div#content div.leftcolumn ul.small li span.footer{ width:110px; } /* loading icon */ div#content div.leftcolumn ul.small li.loading h4{ float:left; width:200px; } div#content div.leftcolumn ul.small li.loading img{ float:left; height:16px; width:16px; border:0px; } /* vacatures */ ul.vacatures, ul.winkels{ list-style:none; margin:0px; margin-bottom:20px; margin-top:10px; padding:0px; clear:both; } table.vacatures th, table.winkels th{ text-align:left; padding-left:10px; } ul.vacatures li, ul.winkels li{ width:494px; height:22px; padding:5px; margin-bottom:5px; overflow:hidden; background:url(../images/bg_vacatureslist.jpg) no-repeat left; cursor:pointer; } ul.winkels li.nolink{ cursor:default; } ul.vacatures li a, ul.winkels li a{ font-weight:bold; color:#fba80d; text-decoration:underline; } ul.vacatures li.hover a, ul.winkels li.hover a{ text-decoration:none; } /* winkels */ div#winkelblok{ background:url(../images/bg_winkelblok.jpg) no-repeat; width:503px; height:64px; } div#winkelblok fieldset{ border:0px; padding-top:5px; } div#winkelblok fieldset legend{ display:none; } div#winkelblok fieldset div.blok{ float:left; width:175px; /*border:1px solid #ff00ff;*/ } div#winkelblok fieldset div.buttonblok{ width:125px; float:right; padding-top:10px; } div#winkelblok fieldset div.buttonblok button{ margin:0px; } div#winkelblok fieldset input, div#winkelblok fieldset select, div#winkelblok fieldset label{ width:165px; height:22px; padding:2px; color:#423838; font-size:13px; } div#winkelblok fieldset input{ height:16px; width:156px; } div#winkelblok fieldset label{ height:20px; display:block; color:#fff; font-weight:bold; font-size:1.1em; padding-top:5px; clear:right; } div#winkelblok button{ margin-top:10px; margin-left:38px; } /* contact */ form.contactformulier fieldset{ border:0px; } form.contactformulier fieldset input, form.contactformulier fieldset select, form.contactformulier fieldset textarea, form.contactformulier fieldset label{ width:396px; height:20px; padding:2px;padding-left:4px; color:#423838; font-size:13px; font-family:Arial, Helvetica, sans-serif; } form.contactformulier fieldset input, form.contactformulier fieldset select, form.contactformulier fieldset textarea { border:1px solid #888888; } form.contactformulier fieldset select{ width:406px; height:24px; } form.contactformulier fieldset textarea{ height:250px; } form.contactformulier fieldset label{ display:block; clear:both; font-weight:bold; color:#382d2d; padding-top:5px; padding-bottom:0px; margin-top:10px; } form.contactformulier fieldset strong{ font-size:14px; color:#fba80d; } form.contactformulier fieldset span#errorMessage{ width:220px; padding:10px; display:block; float:left; } form.contactformulier fieldset button{ margin-top:5px; float:left; } /* foutmeldingen */ form.contactformulier fieldset input.errorMessage, form.contactformulier fieldset select.errorMessage, form.contactformulier fieldset textarea.errorMessage{ border:1px solid #fba80d; } form.contactformulier fieldset label.errorMessage{ display:none; } /* zoek resultaten */ span.resultaten{ float:left; } span.resultaten p{ margin-top:0px !important; padding-top:0px; } div#resultaatweergave{ float:right; width:200px; display:block; height:30px; } div#resultaatweergave span{ float:left; } div#resultaatweergave span.btnholder{ background:url(../images/bg_resultaatbtns.gif) no-repeat left; width:53px; height:20px; display:block; } div#resultaatweergave span.btnholder button{ width:23px; height:16px; padding:0px; margin-top:2px; float:left; } div#resultaatweergave button#btn_foto{ text-indent:-5000px; background:url(../images/btn_resultaat-foto.gif) no-repeat 0px 0px; margin-left:2px; } div#resultaatweergave span.btnholder button.active{ background-position:0 -16px !important; } div#resultaatweergave button#btn_lijst{ text-indent:-5000px; background:url(../images/btn_resultaat-lijst.gif) no-repeat 0px 0px; margin-left:3px; } /* pagina knoppen */ div.resultcontrols{ overflow:hidden; } div.resultcontrols span.pages{ width:320px; padding-left:10px; padding-right:10px; float:left; display:block; overflow:hidden; } div.resultcontrols span.prev_button, div.resultcontrols span.next_button{ float:left; width:90px; height:30px; display:block; overflow:hidden; } div.resultcontrols span.next_button a, div.resultcontrols span.prev_button a{ padding:2px; padding-top:5px; height:25px; width:90px; display:block; border:0px; font-weight:bold; color:#fba80d; text-align:left; } div.resultcontrols span.prev_button{ width:75px; } div.resultcontrols span.prev_button a{ text-align:right; width:75px; } div.resultcontrols span.pages a{ border:1px solid #bdbcbc; background-color:#fff; color:#000; width:25px; height:20px; margin:1px; padding-top:5px; text-align:center; float:left; display:block; text-decoration:none; } div.resultcontrols span.pages span.spacer{ float:left; width:29px; height:15px; padding-top:8px; text-align:center; display:block; } div.resultcontrols span.pages a:hover{ text-decoration:underline; } div.resultcontrols span.pages a.active{ background-color:#fba80d; color:#fff; } /* rechter sidebar */ div#content div.rightcolumn{ width:255px; float:right; } div#content div.rightcolumn h3{ width:255px; height:32px; text-indent:-5000px; } div#content div.rightcolumn p, div#content div.rightcolumn div.box{ margin:0px; margin-bottom:15px; width:235px; padding:10px; line-height:18px; background:url(../images/bg_rightblock.gif) no-repeat bottom; } div#content div.rightcolumn div.nopadding{ padding:0px; } div#content div.rightcolumn a{ font-weight:bold; color:#fba80d; } /* winkel zoeken */ div#content div.rightcolumn select{ width:230px; color:#423838; font-size:13px; height:22px; padding-left:10px; } div#content div.rightcolumn select option{ padding-left:15px; } div#content div.rightcolumn button.zoekwinkel{ margin-left:104px; margin-top:10px; } /* zoek een occasion */ div#content div.rightcolumn div#zoekblok{ background:url(../images/bg_zoekblok-klein.gif) no-repeat; width:255px; height:222px; padding:0px; } div#content div.rightcolumn div#zoekblok fieldset{ border:0px; padding-top:20px; padding-left:35px; } div#content div.rightcolumn div#zoekblok fieldset select, div#content div.rightcolumn div#zoekblok fieldset input{ width:180px; } div#content div.rightcolumn div#zoekblok fieldset input{ width:172px; } /* footer */ div#footer{ position:relative; background:url(../images/bg_footer.gif) repeat-x top; height:47px; padding-top:30px; color:#9b9a9a; } div#footer p{ width:775px; margin:auto; } div#footer a{ color:#fff; }