/**
* Stylesheet for Boekenzoeker
*
* @media screen, projection
* @copyright 3RDS
* @author Bramus!
*/
/**
* = Primary selectors
* ----------------------------------------------------------
*/
body {
font: 300 11px/1.4 Arial, sans-serif;
background: #fff;
color: #333333;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 700;
}
h1 {
font-size: 28px;
padding: 0 0 12px 0;
font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h2 {
font-size: 18px;
padding: 0 0 10px 0;
font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
h3 {
font-size: 16px;
padding: 0 0 8px 0;
}
h4 {
font-size: 14px;
padding: 0 0 4px 0;
}
p {
padding: 0 0 18px 0;
}
ul, ol {
padding: 0 0 15px 30px;
}
ul ul, ul ol, ol ul, ol ol {
padding-bottom: 0px;
}
ul li {
list-style: square;
}
ol li {
list-style: decimal;
}
dd {
padding-bottom: 5px;
}
hr {
display: none;
}
td {
vertical-align: top;
}
/**
* = Clearfix
* ----------------------------------------------------------
*/
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/**
* = Firefox Fixes
* ----------------------------------------------------------
*/
/* force scrollbar */
/**::-moz-any-link html, html {
min-height: 100%;
margin-bottom: 1px;
}*/
/* remove big outlines on links */
/**::-moz-any-link a,*/ a {
overflow: hidden;
}
/**
* = Links
* ----------------------------------------------------------
*/
a:link {
color: #000;
}
a:visited {
color: #000;
}
a:hover {
color: #000;
}
a:active {
color: #000;
}
/**
* = Debug
* ----------------------------------------------------------
*/
#debug {
display: block;
position: absolute;
top: 0;
left: 0;
height: 24px;
background: #333;
border-bottom: 1px solid #999;
padding: 0;
margin: 0;
width: 100%;
}
#debug li {
display: block;
float: left;
height: 24px;
padding: 0;
margin: 0;
}
#debug li a {
display: block;
font: normal 12px/24px Arial, Helvetica, sans-serif;
padding: 0 10px;
border-right: 1px solid #999;
height: 24px;
color: #fff;
}
#debug li a:hover {
background: #444;
}
/**
* = Page structure
* ----------------------------------------------------------
*/
#wrapper {
width: 886px;
height: 557px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -443px;
margin-top: -278px;
}
#content {
position: relative;
width: 886px;
height: 557px;
overflow: hidden;
}
/**
* = Footer
* ----------------------------------------------------------
*/
#footer {
width: 856px;
height: 28px;
line-height: 14px;
font-size: 11px;
color: #999;
position: absolute;
left: 50%;
top: 50%;
margin-left: -423px;
margin-top: 278px;
text-align: center;
}
#footer a {
color: #999;
}
#footer a:hover {
color: #000;
}
/**
* = Page structure : Splash Page
* ----------------------------------------------------------
*/
#b_splash h1 {
display: block;
width: 886px;
height: 557px;
}
#b_splash h1 a {
display: block;
width: 886px;
height: 557px;
background: transparent url(../images/algemeen/splash.jpg) no-repeat top left;
text-indent: -9999px;
}
/**
* = Page structure : Colorize me!
* ----------------------------------------------------------
*/
#b_wit #wrapper { background: transparent url(../images/wit/bg.jpg) no-repeat top left; }
#b_blauw #wrapper { background: transparent url(../images/blauw/bg.jpg) no-repeat top left; }
#b_geel #wrapper { background: transparent url(../images/geel/bg.jpg) no-repeat top left; }
#b_groen #wrapper { background: transparent url(../images/groen/bg.jpg) no-repeat top left; }
#b_oranje #wrapper { background: transparent url(../images/oranje/bg.jpg) no-repeat top left; }
#b_rood #wrapper { background: transparent url(../images/rood/bg.jpg) no-repeat top left; }
#b_roze #wrapper { background: transparent url(../images/roze/bg.jpg) no-repeat top left; }
/**
* = Page Content : 1. homeLink
* ----------------------------------------------------------
*/
#homeLink {
display: block;
width: 45px;
height: 45px;
background: transparent url(../images/algemeen/homeLink.gif) no-repeat top left;
position: absolute;
right: 27px;
bottom: 17px;
text-indent: -9999px;
z-index: 300;
}
#b_wit #homeLink:hover, #b_wit #homeLink.selected { background-image: url(../images/wit/homeLink.gif); }
#b_blauw #homeLink:hover, #b_blauw #homeLink.selected { background-image: url(../images/blauw/homeLink.gif); }
#b_geel #homeLink:hover, #b_geel #homeLink.selected { background-image: url(../images/geel/homeLink.gif); }
#b_groen #homeLink:hover, #b_groen #homeLink.selected { background-image: url(../images/groen/homeLink.gif); }
#b_oranje #homeLink:hover, #b_oranje #homeLink.selected { background-image: url(../images/oranje/homeLink.gif); }
#b_rood #homeLink:hover, #b_rood #homeLink.selected { background-image: url(../images/rood/homeLink.gif); }
#b_roze #homeLink:hover, #b_roze #homeLink.selected { background-image: url(../images/roze/homeLink.gif); }
/**
* = Page content: extrakleur
* ----------------------------------------------------------
*/
#extraKleur {
position: absolute;
top: 17px;
left: 0;
width: 218px;
height: 30px;
overflow: hidden;
z-index: 20;
}
#extraKleur li {
list-style: none;
width: 30px;
height: 30px;
float: left;
margin-right: 1px;
}
#extraKleur li a {
display: block;
width: 30px;
height: 30px;
text-indent: -9999px;
}
#extraKleur ul li#extraGroen { background: url(../images/groen/bol.gif) no-repeat 60% 70%; }
#extraKleur ul li#extraOranje { background: url(../images/oranje/bol.gif) no-repeat 50% 50%; }
#extraKleur ul li#extraBlauw { background: url(../images/blauw/bol.gif) no-repeat 50% 50%; }
#extraKleur ul li#extraRood { background: url(../images/rood/bol.gif) no-repeat 60% 60%; }
#extraKleur ul li#extraRoze { background: url(../images/roze/bol.gif) no-repeat 60% 50%; }
#extraKleur ul li#extraGeel { background: url(../images/geel/bol.gif) no-repeat 60% 50%; }
#extraKleur ul li#extraGroen a:hover { background: url(../images/algemeen/kleurkiezerhome_groen.gif) no-repeat top left; }
#extraKleur ul li#extraOranje a:hover { background: url(../images/algemeen/kleurkiezerhome_oranje.gif) no-repeat top left; }
#extraKleur ul li#extraBlauw a:hover { background: url(../images/algemeen/kleurkiezerhome_blauw.gif) no-repeat top left; }
#extraKleur ul li#extraRood a:hover { background: url(../images/algemeen/kleurkiezerhome_rood.gif) no-repeat top left; }
#extraKleur ul li#extraRoze a:hover { background: url(../images/algemeen/kleurkiezerhome_roze.gif) no-repeat top left; }
#extraKleur ul li#extraGeel a:hover { background: url(../images/algemeen/kleurkiezerhome_geel.gif) no-repeat top left; }
/**
* = Page content: 2. topnav
* ----------------------------------------------------------
*/
#topnav {
position: absolute;
top: 0;
left: 0;
width: 886px;
height: 67px;
overflow: hidden;
z-index: 10;
}
#topnav ul {
display: block;
height: 67px;
width: 886px;
position: relative;
margin: 0;
padding: 0;
background: transparent url(../images/algemeen/topNav.gif) no-repeat top left;
}
#topnav.loggedin ul {
background-image: url(../images/algemeen/topNav_loggedin.gif);
}
#topnav ul li {
display: block;
position: absolute;
top: 0;
height: 67px;
}
#topnav ul li a {
display: block;
height: 67px;
text-indent: -9999px;
background: transparent;
}
/**
* = Page content: topnav : loginLink
* ----------------------------------------------------------
*/
#topnav ul #loginLink, #topnav ul #loginLink a {
right: 0;
width: 155px;
}
#b_wit #topnav ul #loginLink a:hover, #b_wit #topnav ul #loginLink.selected a { background: url(../images/wit/topNav_login.gif) no-repeat top left; }
#b_blauw #topnav ul #loginLink a:hover, #b_blauw #topnav ul #loginLink.selected a { background: url(../images/blauw/topNav_login.gif) no-repeat top left; }
#b_geel #topnav ul #loginLink a:hover, #b_geel #topnav ul #loginLink.selected a { background: url(../images/geel/topNav_login.gif) no-repeat top left; }
#b_groen #topnav ul #loginLink a:hover, #b_groen #topnav ul #loginLink.selected a { background: url(../images/groen/topNav_login.gif) no-repeat top left; }
#b_oranje #topnav ul #loginLink a:hover, #b_oranje #topnav ul #loginLink.selected a { background: url(../images/oranje/topNav_login.gif) no-repeat top left; }
#b_rood #topnav ul #loginLink a:hover, #b_rood #topnav ul #loginLink.selected a { background: url(../images/rood/topNav_login.gif) no-repeat top left; }
#b_roze #topnav ul #loginLink a:hover, #b_roze #topnav ul #loginLink.selected a { background: url(../images/roze/topNav_login.gif) no-repeat top left; }
#b_wit #topnav.loggedin ul #loginLink a:hover, #b_wit #topnav ul #loginLink.selected a { background: url(../images/wit/topNav_loggedin.gif) no-repeat top left; }
#b_blauw #topnav.loggedin ul #loginLink a:hover, #b_blauw #topnav ul #loginLink.selected a { background: url(../images/blauw/topNav_loggedin.gif) no-repeat top left; }
#b_geel #topnav.loggedin ul #loginLink a:hover, #b_geel #topnav ul #loginLink.selected a { background: url(../images/geel/topNav_loggedin.gif) no-repeat top left; }
#b_groen #topnav.loggedin ul #loginLink a:hover, #b_groen #topnav ul #loginLink.selected a { background: url(../images/groen/topNav_loggedin.gif) no-repeat top left; }
#b_oranje #topnav.loggedin ul #loginLink a:hover, #b_oranje #topnav ul #loginLink.selected a { background: url(../images/oranje/topNav_loggedin.gif) no-repeat top left; }
#b_rood #topnav.loggedin ul #loginLink a:hover, #b_rood #topnav ul #loginLink.selected a { background: url(../images/rood/topNav_loggedin.gif) no-repeat top left; }
#b_roze #topnav.loggedin ul #loginLink a:hover, #b_roze #topnav ul #loginLink.selected a { background: url(../images/roze/topNav_loggedin.gif) no-repeat top left; }
/**
* = Page content: topnav : terugLink
* ----------------------------------------------------------
*/
#topnav ul #terugLink, #topnav ul #terugLink a {
right: 155px;
width: 101px;
}
#b_wit #topnav ul #terugLink a:hover, #b_wit #topnav ul #terugLink.selected a { background: url(../images/wit/topNav_terug.gif) no-repeat top left; }
#b_blauw #topnav ul #terugLink a:hover, #b_blauw #topnav ul #terugLink.selected a { background: url(../images/blauw/topNav_terug.gif) no-repeat top left; }
#b_geel #topnav ul #terugLink a:hover, #b_geel #topnav ul #terugLink.selected a { background: url(../images/geel/topNav_terug.gif) no-repeat top left; }
#b_groen #topnav ul #terugLink a:hover, #b_groen #topnav ul #terugLink.selected a { background: url(../images/groen/topNav_terug.gif) no-repeat top left; }
#b_oranje #topnav ul #terugLink a:hover, #b_oranje #topnav ul #terugLink.selected a { background: url(../images/oranje/topNav_terug.gif) no-repeat top left; }
#b_rood #topnav ul #terugLink a:hover, #b_rood #topnav ul #terugLink.selected a { background: url(../images/rood/topNav_terug.gif) no-repeat top left; }
#b_roze #topnav ul #terugLink a:hover, #b_roze #topnav ul #terugLink.selected a { background: url(../images/roze/topNav_terug.gif) no-repeat top left; }
/**
* = Page content: topnav : infoContactLink
* ----------------------------------------------------------
*/
#topnav ul #infoContactLink, #topnav ul #infoContactLink a {
right: 256px;
width: 133px;
}
#b_wit #topnav ul #infoContactLink a:hover, #b_wit #topnav ul #infoContactLink.selected a { background: url(../images/wit/topNav_infocontact.gif) no-repeat top left; }
#b_blauw #topnav ul #infoContactLink a:hover, #b_blauw #topnav ul #infoContactLink.selected a { background: url(../images/blauw/topNav_infocontact.gif) no-repeat top left; }
#b_geel #topnav ul #infoContactLink a:hover, #b_geel #topnav ul #infoContactLink.selected a { background: url(../images/geel/topNav_infocontact.gif) no-repeat top left; }
#b_groen #topnav ul #infoContactLink a:hover, #b_groen #topnav ul #infoContactLink.selected a { background: url(../images/groen/topNav_infocontact.gif) no-repeat top left; }
#b_oranje #topnav ul #infoContactLink a:hover, #b_oranje #topnav ul #infoContactLink.selected a { background: url(../images/oranje/topNav_infocontact.gif) no-repeat top left; }
#b_rood #topnav ul #infoContactLink a:hover, #b_rood #topnav ul #infoContactLink.selected a { background: url(../images/rood/topNav_infocontact.gif) no-repeat top left; }
#b_roze #topnav ul #infoContactLink a:hover, #b_roze #topnav ul #infoContactLink.selected a { background: url(../images/roze/topNav_infocontact.gif) no-repeat top left; }
/**
* = Page content: topnav : top10Link
* ----------------------------------------------------------
*/
#topnav ul #top10Link, #topnav ul #top10Link a {
right: 389px;
width: 67px;
}
#b_wit #topnav ul #top10Link a:hover, #b_wit #topnav ul #top10Link.selected { background: url(../images/wit/topNav_top10.gif) no-repeat top left; }
#b_blauw #topnav ul #top10Link a:hover, #b_blauw #topnav ul #top10Link.selected { background: url(../images/blauw/topNav_top10.gif) no-repeat top left; }
#b_geel #topnav ul #top10Link a:hover, #b_geel #topnav ul #top10Link.selected { background: url(../images/geel/topNav_top10.gif) no-repeat top left; }
#b_groen #topnav ul #top10Link a:hover, #b_groen #topnav ul #top10Link.selected { background: url(../images/groen/topNav_top10.gif) no-repeat top left; }
#b_oranje #topnav ul #top10Link a:hover, #b_oranje #topnav ul #top10Link.selected { background: url(../images/oranje/topNav_top10.gif) no-repeat top left; }
#b_rood #topnav ul #top10Link a:hover, #b_rood #topnav ul #top10Link.selected { background: url(../images/rood/topNav_top10.gif) no-repeat top left; }
#b_roze #topnav ul #top10Link a:hover, #b_roze #topnav ul #top10Link.selected { background: url(../images/roze/topNav_top10.gif) no-repeat top left; }
/**
* = Page content: topnav : zoekForm
* ----------------------------------------------------------
*/
#topnav ul #zoekForm {
right: 456px;
width: 430px;
}
#topnav ul #zoekForm form {
display: block;
margin: 0;
padding: 0;
height: 67px;
width: 430px;
position: relative;
}
#topnav ul #zoekForm form fieldset {
margin: 0;
padding: 0;
border: 0;
}
#topnav ul #zoekForm form fieldset legend {
display: none;
}
#topnav ul #zoekForm form fieldset #zoekFormSubmit {
display: block;
height: 67px;
width: 63px;
background: transparent url(../images/algemeen/topNav_zoek.gif) no-repeat top left;
text-indent: -999px;
overflow: hidden;
position: absolute;
top: 0;
right: 0;
}
#b_wit #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_wit #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_wit #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/wit/topNav_zoek.gif); }
#b_blauw #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_blauw #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_blauw #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/blauw/topNav_zoek.gif); }
#b_geel #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_geel #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_geel #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/geel/topNav_zoek.gif); }
#b_groen #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_groen #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_groen #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/groen/topNav_zoek.gif); }
#b_oranje #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_oranje #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_oranje #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/oranje/topNav_zoek.gif); }
#b_rood #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_rood #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_rood #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/rood/topNav_zoek.gif); }
#b_roze #topnav ul #zoekForm form fieldset #zoekFormSubmit:hover, #b_roze #topnav ul #zoekForm form fieldset #zoekFormSubmit:active, #b_roze #topnav ul #zoekForm.selected form fieldset #zoekFormSubmit { background-image: url(../images/roze/topNav_zoek.gif); }
#topnav ul #zoekForm form fieldset #zoekFormQuery {
display: block;
height: 15px;
width: 130px;
padding: 0 3px;
line-height: 15px;
font-size: 10px;
position: absolute;
top: 26px;
right: 65px;
background: #fff;
border: 1px solid #999;
}
/**
* = Page Content : 3. contentInner
* ----------------------------------------------------------
*/
#contentInner {
position: absolute;
top: 73px;
left: 0;
width: 886px;
height: 500px;
overflow: visible;
z-index: 100;
}
#contentInner hr {
display: block;
}
/**
* = Page Content : 3. contentInner : HOME
* ----------------------------------------------------------
*/
#contentInnerHome {
height: 500px;
width: 886px;
position: relative;
}
/**
* = Page Content : 3. contentInner : HOME : startbeeld
* ----------------------------------------------------------
*/
#contentInnerHome ul#startbeeld {
display: block;
padding: 0;
margin: 0;
height: 500px;
width: 886px;
z-index: 100;
}
#b_wit #contentInnerHome ul#startbeeld { background: url(../images/wit/startbeeld.jpg) no-repeat 50% 0px; }
#b_blauw #contentInnerHome ul#startbeeld { background: url(../images/blauw/startbeeld.jpg) no-repeat 50% 0px; }
#b_geel #contentInnerHome ul#startbeeld { background: url(../images/geel/startbeeld.jpg) no-repeat 50% 0px; }
#b_groen #contentInnerHome ul#startbeeld { background: url(../images/groen/startbeeld.jpg) no-repeat 50% 0px; }
#b_oranje #contentInnerHome ul#startbeeld { background: url(../images/oranje/startbeeld.jpg) no-repeat 50% 0px; }
#b_rood #contentInnerHome ul#startbeeld { background: url(../images/rood/startbeeld.jpg) no-repeat 50% 0px; }
#b_roze #contentInnerHome ul#startbeeld { background: url(../images/roze/startbeeld.jpg) no-repeat 50% 0px; }
#contentInnerHome ul#startbeeld li {
list-style: none;
margin: 0;
padding: 0;
position: absolute;
top: 189px;
height: 86px;
width: 303px;
}
#contentInnerHome ul#startbeeld li a {
display: block;
height: 86px;
width: 303px;
background: url(../images/algemeen/blank.gif) no-repeat top left;
text-indent: -999px;
}
#contentInnerHome ul#startbeeld li#ikbenwatiklees a:hover {
background: url(../images/algemeen/startbeeld_ikbenwatiklees.png) no-repeat top left;
}
#contentInnerHome ul#startbeeld li#fill {
width: 886px;
}
#contentInnerHome ul#startbeeld li#fill span {
position: relative;
display: block;
width: 270px;
height: 86px;
left: 312px;
text-indent: -9999px;
z-index: 100;
}
#contentInnerHome ul#startbeeld li#fill ul {
position: relative;
margin: 0;
padding: 0;
height: 86px;
width: 886px;
top: -86px;
z-index: 50;
}
#contentInnerHome ul#startbeeld ul li#ikbenwatiklees {
position: absolute;
left: 252px;
top: 0;
}
#contentInnerHome ul#startbeeld ul li#geefmewatikben {
left: 342px;
top: 0;
}
#contentInnerHome ul#startbeeld li#geefmewatikben a:hover {
background: url(../images/algemeen/startbeeld_geefmewatikben.png) no-repeat top right;
}
/**
* = Page Content : 3. contentInner : HOME : kleurenkiezer
* ----------------------------------------------------------
*/
#contentInnerHome ul#startbeeld li#kleurkiezer {
display: block;
width: 886px;
height: 106px;
background: transparent url(../images/algemeen/kleurkiezerhome.png) no-repeat top left;
top: 310px;
}
#contentInnerHome ul#startbeeld li#kleurkiezer span {
display: none;
}
#contentInnerHome ul#startbeeld li#kleurkiezer ul {
width: 886px;
height: 106px;
margin: 0;
padding: 0;
position: relative;
}
#contentInnerHome ul#startbeeld li#kleurkiezer ul li {
margin: 0;
padding: 0;
position: absolute;
height: 30px;
width: 30px;
cursor: pointer;
}
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#groen { /* background: lime; */ top:9px; left: 66px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#oranje { /* background: orange; */ top:40px; left: 74px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#blauw { /* background: blue; */ top:69px; left: 83px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#rood { /* background: red; */ top:9px; right: 67px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#roze { /* background: pink; */ top:40px; right: 74px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#geel { /* background: yellow; */ top:69px; right: 83px; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li a {
display: block;
height: 30px;
width: 30px;
}
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#groen a:hover { background: url(../images/algemeen/kleurkiezerhome_groen.gif) no-repeat top left; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#oranje a:hover { background: url(../images/algemeen/kleurkiezerhome_oranje.gif) no-repeat top left; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#blauw a:hover { background: url(../images/algemeen/kleurkiezerhome_blauw.gif) no-repeat top left; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#rood a:hover { background: url(../images/algemeen/kleurkiezerhome_rood.gif) no-repeat top left; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#roze a:hover { background: url(../images/algemeen/kleurkiezerhome_roze.gif) no-repeat top left; }
#contentInnerHome ul#startbeeld li#kleurkiezer ul li#geel a:hover { background: url(../images/algemeen/kleurkiezerhome_geel.gif) no-repeat top left; }
/**
* = Page Content : 3. contentInner : BROWSECATEGORY
* ----------------------------------------------------------
*/
#contentInnerBrowseCategory, #contentInnerPage {
height: 505px;
width: 886px;
position: relative;
top: -15px;
overflow: visible;
}
#b_wit #contentInnerBrowseCategory { background: url(../images/wit/browsecategory.png) no-repeat 0 100%; }
#b_blauw #contentInnerBrowseCategory { background: url(../images/blauw/browsecategory.png) no-repeat 0 100%; }
#b_geel #contentInnerBrowseCategory { background: url(../images/geel/browsecategory.png) no-repeat 0 100%; }
#b_groen #contentInnerBrowseCategory { background: url(../images/groen/browsecategory.png) no-repeat 0 100%; }
#b_oranje #contentInnerBrowseCategory { background: url(../images/oranje/browsecategory.png) no-repeat 0 100%; }
#b_rood #contentInnerBrowseCategory { background: url(../images/rood/browsecategory.png) no-repeat 0 100%; }
#b_roze #contentInnerBrowseCategory { background: url(../images/roze/browsecategory.png) no-repeat 0 100%; }
#contentInner #contentInnerBrowseCategory.listing { background: none; }
/**
* = Page Content : 3. contentInner : BROWSECATEGORY : ik ben wat ik lees // geef me wat ik ben
* ----------------------------------------------------------
*/
#contentInnerBrowseCategory ul.browse {
display: block;
margin: 0;
padding: 0;
list-style: none;
width: 466px;
height: 510px;
position: relative;
top: -15px;
left: -15px;
}
#contentInnerBrowseCategory.listing ul.browse {
width: 316px;
left: -10px;
}
#contentInnerBrowseCategory ul#ikbenwatiklees {
background: url(../images/algemeen/schijf_ikbenwatiklees.png) no-repeat 0 100%;
}
#contentInnerBrowseCategory ul#geefmewatikben {
background: url(../images/algemeen/schijf_geefmewatikben.png) no-repeat 0 100%;
}
#contentInnerBrowseCategory.listing ul#ikbenwatiklees {
background: url(../images/algemeen/schijf_ikbenwatiklees_smal.png) no-repeat 0 100%;
}
#contentInnerBrowseCategory.listing ul#geefmewatikben {
background: url(../images/algemeen/schijf_geefmewatikben_smal.png) no-repeat 0 100%;
}
#contentInnerBrowseCategory ul.browse li {
display: block;
margin: 0;
padding: 0;
list-style: none;
position: absolute;
left: 216px;
width: 234px;
height: 40px;
}
#contentInnerBrowseCategory.listing ul.browse li {
left: 66px;
}
#contentInnerBrowseCategory ul.browse li a {
display: block;
width: 234px;
height: 40px;
text-indent: -9999px;
overflow: hidden;
}
#contentInnerBrowseCategory ul.browse li.fiftyfifty, #contentInnerBrowseCategory ul.browse li.fiftyfifty a {
width: 117px;
}
#contentInnerBrowseCategory ul.browse li.second {
left: 333px;
}
#contentInnerBrowseCategory.listing ul.browse li.second {
left: 183px;
}
/**
* = Page Content : 3. contentInner : BROWSECATEGORY : ik ben wat ik lees // geef me wat ik ben : other cat link
* ----------------------------------------------------------
*/
#contentInnerBrowseCategory ul.browse li.othercat {
width: 202px;
left: 0;
top: 0;
height: 150px;
}
#contentInnerBrowseCategory ul.browse li.othercat a {
width: 202px;
height: 150px;
}
#contentInnerBrowseCategory ul.browse li#geefmewatikben a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_naargeefmewatikben.png) no-repeat 70px 30px;
}
#contentInnerBrowseCategory ul.browse li#ikbenwatiklees a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_naarikbenwatiklees.png) no-repeat 70px 30px;
}
/**
* = Page Content : 3. contentInner : BROWSECATEGORY : ik ben wat ik lees : ze linkz
* ----------------------------------------------------------
*/
#contentInnerBrowseCategory ul li#ibwil_geschiedenis {
top: 22px;
}
#contentInnerBrowseCategory ul li#ibwil_geschiedenis.selected a,
#contentInnerBrowseCategory ul li#ibwil_geschiedenis a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -22px;
}
#contentInnerBrowseCategory ul li#ibwil_liefde {
top: 68px;
}
#contentInnerBrowseCategory ul li#ibwil_liefde.selected a,
#contentInnerBrowseCategory ul li#ibwil_liefde a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -68px;
}
#contentInnerBrowseCategory ul li#ibwil_spanning {
top: 114px;
}
#contentInnerBrowseCategory ul li#ibwil_spanning.selected a,
#contentInnerBrowseCategory ul li#ibwil_spanning a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -114px;
}
#contentInnerBrowseCategory ul li#ibwil_fantasiewerelden {
top: 161px;
}
#contentInnerBrowseCategory ul li#ibwil_fantasiewerelden.selected a,
#contentInnerBrowseCategory ul li#ibwil_fantasiewerelden a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -161px;
}
#contentInnerBrowseCategory ul li#ibwil_problemenenellende {
top: 208px;
}
#contentInnerBrowseCategory ul li#ibwil_problemenenellende.selected a,
#contentInnerBrowseCategory ul li#ibwil_problemenenellende a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -208px;
}
#contentInnerBrowseCategory ul li#ibwil_anderelandenenculturen {
top: 254px;
}
#contentInnerBrowseCategory ul li#ibwil_anderelandenenculturen.selected a,
#contentInnerBrowseCategory ul li#ibwil_anderelandenenculturen a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -254px;
}
#contentInnerBrowseCategory ul li#ibwil_feiten {
top: 300px;
}
#contentInnerBrowseCategory ul li#ibwil_feiten.selected a,
#contentInnerBrowseCategory ul li#ibwil_feiten a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -300px;
}
#contentInnerBrowseCategory ul li#ibwil_gedichten {
top: 347px;
}
#contentInnerBrowseCategory ul li#ibwil_gedichten.selected a,
#contentInnerBrowseCategory ul li#ibwil_gedichten a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -347px;
}
#contentInnerBrowseCategory ul li#ibwil_klassiekers {
top: 393px;
}
#contentInnerBrowseCategory ul li#ibwil_klassiekers.selected a,
#contentInnerBrowseCategory ul li#ibwil_klassiekers a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -393px;
}
#contentInnerBrowseCategory ul li#ibwil_oorlog {
top: 440px;
}
#contentInnerBrowseCategory ul li#ibwil_oorlog.selected a,
#contentInnerBrowseCategory ul li#ibwil_oorlog a:hover {
background: transparent url(../images/algemeen/schijf_ikbenwatiklees_over.gif) no-repeat -216px -440px;
}
/**
* = Page Content : 3. contentInner : BROWSECATEGORY : geefmewatikben : ze linkz
* ----------------------------------------------------------
*/
#contentInnerBrowseCategory ul li#gmwib_jongen,
#contentInnerBrowseCategory ul li#gmwib_meisje {
top: 22px;
}
#contentInnerBrowseCategory ul li#gmwib_jongen.selected a,
#contentInnerBrowseCategory ul li#gmwib_jongen a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -22px;
}
#contentInnerBrowseCategory ul li#gmwib_meisje.selected a,
#contentInnerBrowseCategory ul li#gmwib_meisje a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -333px -22px;
}
#contentInnerBrowseCategory ul li#gmwib_sport,
#contentInnerBrowseCategory ul li#gmwib_lachen {
top: 68px;
}
#contentInnerBrowseCategory ul li#gmwib_sport.selected a,
#contentInnerBrowseCategory ul li#gmwib_sport a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -68px;
}
#contentInnerBrowseCategory ul li#gmwib_lachen.selected a,
#contentInnerBrowseCategory ul li#gmwib_lachen a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -333px -68px;
}
#contentInnerBrowseCategory ul li#gmwib_techniekenwetenschap {
top: 114px;
}
#contentInnerBrowseCategory ul li#gmwib_techniekenwetenschap.selected a,
#contentInnerBrowseCategory ul li#gmwib_techniekenwetenschap a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -114px;
}
#contentInnerBrowseCategory ul li#gmwib_muziekenkunst {
top: 161px;
}
#contentInnerBrowseCategory ul li#gmwib_muziekenkunst.selected a,
#contentInnerBrowseCategory ul li#gmwib_muziekenkunst a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -161px;
}
#contentInnerBrowseCategory ul li#gmwib_dromer,
#contentInnerBrowseCategory ul li#gmwib_doener {
top: 208px;
}
#contentInnerBrowseCategory ul li#gmwib_dromer.selected a,
#contentInnerBrowseCategory ul li#gmwib_dromer a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -208px;
}
#contentInnerBrowseCategory ul li#gmwib_doener.selected a,
#contentInnerBrowseCategory ul li#gmwib_doener a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -333px -208px;
}
#contentInnerBrowseCategory ul li#gmwib_grenzenverleggen {
top: 254px;
}
#contentInnerBrowseCategory ul li#gmwib_grenzenverleggen.selected a,
#contentInnerBrowseCategory ul li#gmwib_grenzenverleggen a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -254px;
}
#contentInnerBrowseCategory ul li#gmwib_natuurendieren {
top: 300px;
}
#contentInnerBrowseCategory ul li#gmwib_natuurendieren.selected a,
#contentInnerBrowseCategory ul li#gmwib_natuurendieren a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -300px;
}
#contentInnerBrowseCategory ul li#gmwib_boekenfreak {
top: 347px;
}
#contentInnerBrowseCategory ul li#gmwib_boekenfreak.selected a,
#contentInnerBrowseCategory ul li#gmwib_boekenfreak a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -347px;
}
#contentInnerBrowseCategory ul li#gmwib_altijddruk {
top: 393px;
}
#contentInnerBrowseCategory ul li#gmwib_altijddruk.selected a,
#contentInnerBrowseCategory ul li#gmwib_altijddruk a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -393px;
}
#contentInnerBrowseCategory ul li#gmwib_films,
#contentInnerBrowseCategory ul li#gmwib_verbodentoegang {
top: 440px;
}
#contentInnerBrowseCategory ul li#gmwib_films.selected a,
#contentInnerBrowseCategory ul li#gmwib_films a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -216px -440px;
}
#contentInnerBrowseCategory ul li#gmwib_verbodentoegang.selected a,
#contentInnerBrowseCategory ul li#gmwib_verbodentoegang a:hover {
background: transparent url(../images/algemeen/schijf_geefmewatikben_over.gif) no-repeat -333px -440px;
}
/**
* = Page Content : 3. contentInner : zeContentBox (rechts)
* ----------------------------------------------------------
*/
#zeContentBox, #rechts {
width: 490px;
height: 400px;
position: absolute;
right: 65px;
top: 21px;
overflow:scroll; /* Hook Safari, IE and Firefox with scrollbars */
_overflow:hidden; /* Override IE */
overflow-x: hidden; /* Fix Firefox on the Safari hook : hide hor scrollbar */
overflow-y: scroll; /* Fix IE on its own hook: enfore vert scrollbar */
}
#categoryImage {
position: relative;
height: 152px;
overflow: hidden;
background: #fff;
padding-bottom: 10px;
}
#categoryImage #naarIkbenwatiklees, #categoryImage #naarGeefmewatikben {
display: block;
height: 164px;
width: 257px;
text-indent: -999px;
background: lime;
position: absolute;
right: 40px;
top: 0;
}
#categoryImage #naarIkbenwatiklees { background: transparent url(../images/wit/02.png) no-repeat top left; }
#categoryImage #naarGeefmewatikben { background: transparent url(../images/wit/01.png) no-repeat top left; }
#categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/wit/02_mo.png) no-repeat top left; }
#categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/wit/01_mo.png) no-repeat top left; }
#b_rood #categoryImage #naarIkbenwatiklees { background: transparent url(../images/rood/02.png) no-repeat top left; }
#b_rood #categoryImage #naarGeefmewatikben { background: transparent url(../images/rood/01.png) no-repeat top left; }
#b_rood #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/rood/02_mo.png) no-repeat top left; }
#b_rood #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/rood/01_mo.png) no-repeat top left; }
#b_roze #categoryImage #naarIkbenwatiklees { background: transparent url(../images/roze/02.png) no-repeat top left; }
#b_roze #categoryImage #naarGeefmewatikben { background: transparent url(../images/roze/01.png) no-repeat top left; }
#b_roze #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/roze/02_mo.png) no-repeat top left; }
#b_roze #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/roze/01_mo.png) no-repeat top left; }
#b_oranje #categoryImage #naarIkbenwatiklees { background: transparent url(../images/oranje/02.png) no-repeat top left; }
#b_oranje #categoryImage #naarGeefmewatikben { background: transparent url(../images/oranje/01.png) no-repeat top left; }
#b_oranje #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/oranje/02_mo.png) no-repeat top left; }
#b_oranje #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/oranje/01_mo.png) no-repeat top left; }
#b_blauw #categoryImage #naarIkbenwatiklees { background: transparent url(../images/blauw/02.png) no-repeat top left; }
#b_blauw #categoryImage #naarGeefmewatikben { background: transparent url(../images/blauw/01.png) no-repeat top left; }
#b_blauw #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/blauw/02_mo.png) no-repeat top left; }
#b_blauw #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/blauw/01_mo.png) no-repeat top left; }
#b_groen #categoryImage #naarIkbenwatiklees { background: transparent url(../images/groen/02.png) no-repeat top left; }
#b_groen #categoryImage #naarGeefmewatikben { background: transparent url(../images/groen/01.png) no-repeat top left; }
#b_groen #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/groen/02_mo.png) no-repeat top left; }
#b_groen #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/groen/01_mo.png) no-repeat top left; }
#b_geel #categoryImage #naarIkbenwatiklees { background: transparent url(../images/geel/02.png) no-repeat top left; }
#b_geel #categoryImage #naarGeefmewatikben { background: transparent url(../images/geel/01.png) no-repeat top left; }
#b_geel #categoryImage #naarIkbenwatiklees:hover { background: transparent url(../images/geel/02_mo.png) no-repeat top left; }
#b_geel #categoryImage #naarGeefmewatikben:hover { background: transparent url(../images/geel/01_mo.png) no-repeat top left; }
/**
* = Page Content : 3. contentInner : links
* ----------------------------------------------------------
*/
#links {
display: block;
margin: 0;
padding: 0;
width: 326px;
height: 510px;
position: relative;
top: -15px;
left: -10px;
overflow: visible;
z-index: 1000;
}
#b_wit #links { background: url(../images/wit/camera.gif) no-repeat -45px 20px; }
#b_blauw #links { background: url(../images/blauw/camera.gif) no-repeat -45px 20px; }
#b_geel #links { background: url(../images/geel/camera.gif) no-repeat -45px 20px; }
#b_groen #links { background: url(../images/groen/camera.gif) no-repeat -45px 20px; }
#b_oranje #links { background: url(../images/oranje/camera.gif) no-repeat -45px 20px; }
#b_rood #links { background: url(../images/rood/camera.gif) no-repeat -45px 20px; }
#b_roze #links { background: url(../images/roze/camera.gif) no-repeat -45px 20px; }
#links #super {
width: 51px;
height: 411px;
background: url(../images/algemeen/super.png) no-repeat top left;
position:absolute;
right: -25px;
top: 28px;
}
#links img {
display: block;
width: 148px;
height: 39px;
position: absolute;
right: 0px;
top: 85px;
}
/* rune + dimitri */
/* titel voor boekcategorie */
.titelcategorie
{
font-weight: bold;
}
.vet
{
font-weight: bold;
}
.rood
{
color: #D53439;
}
.border {
text-decoration: none;
border-top: thin solid #CCCCCC;
border-right: thin solid #CCCCCC;
border-bottom: thin none #CCCCCC;
border-left: thin none #CCCCCC;
height: 20px;
padding: 2px 2px 2px 4px;
}
A:link {text-decoration: none; color: #D53439;}
A:visited {text-decoration: none; color: #D53439;}
A:active {text-decoration: none; color: #D53439;}
A:hover {text-decoration: underline; color: #D53439;}
#b_wit th { background-color: #FF0000; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_blauw th { background-color: #1596AC; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_geel th { background-color: #FACE25; color: #000000; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_groen th { background-color: #89A038; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_oranje th { background-color: #E6793A; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_rood th { background-color: #D53439; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_roze th { background-color: #E68283; color: #ffffff; height:20px; indent:3px; vertical-align:middle; font-weight:bold; }
#b_wit .tekstkleurlink { color: #ffffff; }
#b_blauw .tekstkleurlink { color: #ffffff; }
#b_geel .tekstkleurlink { color: #000000; }
#b_groen .tekstkleurlink { color: #ffffff; }
#b_oranje .tekstkleurlink { color: #ffffff; }
#b_rood .tekstkleurlink { color: #ffffff; }
#b_roze .tekstkleurlink { color: #ffffff; }
#b_wit kleurlink { color: #FF0000; }
#b_blauw kleurlink { color: #1596AC; }
#b_geel kleurlink { color: #666666; }
#b_groen kleurlink { color: #89A038; }
#b_oranje kleurlink { color: #E6793A; }
#b_rood kleurlink { color: #D53439; }
#b_roze kleurlink { color: #ffffff; }
/* TOPNAV BETA
#topnav ul { background-image: url(../images/algemeen/topNav_beta2.gif); }
#topnav ul #loginLink { display: none; } */