/* Website: www.kranenberg-juweliers.nl CSS : Kranenberg Juweliers: general body CSS ----------------------------------------------------------- */ /* RESET */ html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; } h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; } ul,ol { list-style: none; } fieldset,img { border: none; } /* ALTIJD SCROLLBAR RECHTS AFDWINGEN */ html {overflow: -moz-scrollbars-vertical; overflow-y: scroll;} body { margin: 0; padding: 0; background-image:url(../images/basic/i_body_top.jpg); background-repeat: no-repeat; background-position: top; font: 12px/18px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; background-color: #fff; color: #444; } #container { margin: 0px auto 0px auto; width: 984px; } #main { width: 100%; margin: 25px 0 0 0; *margin: 0; /*margin subheader plus space */} /* #main { width: 100%; position: relative; color: #333; height: inherit; float: left;} */ h1 { font-weight: bold; font-size: 24px; line-height: 36px; margin-bottom: 5px; color: #222; } h2 { font-weight: bold; font-size: 18px; line-height: 20px; margin-bottom: 5px; color: #333;} h3 { font-weight: bold; font-size: 1em; line-height: inherit; color: #333; /*display: inline; */} h4 { font-weight: bold; font-size: 10px; line-height: 18px; color: #333;} h5 { font-weight: bold; font-size: 10px; line-height: 18px; color: #333;} a { color: #990099; text-decoration: none; } a:visited{ color: #990099;} a:hover{ color: #FF0099; text-decoration: underline; } a.more {color: #990099; text-decoration: none; white-space: nowrap; padding-right: 10px; background: url(../images/basic/morearrow.gif) no-repeat 100% 50%; zoom: 1;} a.more:hover { text-decoration: underline; } /* Tekstaccenten */ strong { font-size: 1em; font-weight: bold; color: #333;} /*standaard list items */ ul.stndlist { list-style-position: outside; margin: 0 5px 0 20px; padding: 0 20px 0 0; list-style-image: url(../images/basic/morearrow.gif); } #box_980x400 { width: 980px; height: 400px; margin: 0px auto 0px auto; border: 1px solid #999; background-color: #FFF;} #box_980xVH { width: 980px; min-height: 400px; height: auto; *height: 100%; /*margin: 0px auto 0px auto;*/ background-color: #FFF; } /* Kolommen */ #kolom3A { width: 33%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom3B { width: 33%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom3C { width: 33%; margin:0; height: 400px; float: left;} #kolom3AB { width: 65%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom3BC { width: 65%; margin:0; height: 400px; float: left;} #kolom4A { width: 24%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom4B { width: 24%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom4C { width: 24%; margin:0; border-right: 1px solid #CCC; height: 400px; float: left;} #kolom4D { width: 25%; margin:0; height: 400px; float: left;} #kolom4AB { width: 49%; margin: 0; border-right: 1px solid #CCC; height: 400px; float: left; } #kolom4CD { width: 49%; margin: 0; height: 400px; float: left; } #kolom4BCD { width: 74%; margin: 0; height: 400px; float: left; } #kolom4ABC { width: 74%; margin: 0; border-right: 1px solid #CCC; height: 400px; float: left; } /* margebox */ .mbox1{margin: 10px;} .mboxR1{margin: 10px 120px 10px 10px;} /* Variable Hoogte */ #kolom3_VH { padding: 0px; margin: 0px; height: auto;} #kolom3_VH #kolom3A_VH { width: 33%; border-right: 1px solid #CCC; height: inherit; *height:100%; float: left;} #kolom3_VH #kolom3AB_VH { width: 65%; border-right: 1px solid #CCC; height: inherit; *height:100%; float: left;} #kolom3_VH #kolom3C_VH { width: 33%; height: inherit; *height:100%; float: left;} #kolom3_VH #kolom3BC_VH { width: 65%; height: inherit; *height:100%; float: left;} #kolom4ABC_VH { width: 74%; margin: 0; border-right: 1px solid #CCC; height: inherit; *height:100%; float: left; } #kolom4D_VH { width: 25%; margin:0; height: inherit; *height:100%; float: left;} /* block-link: lage grijze balken met links 40 hoog 100% breed [zie voorbeeld:] */ /* -------------------- */ /* KOP */ /* -------------------- */ /* 50x30 png link 1 */ /* -------------------- */ /* 50x30 png link 2 */ /* -------------------- */ /* 50x30 png link 3 */ /* -------------------- */ #block_link { position: relative; border: 0; /*padding: 0.2em 0 0.2em;*/ overflow: hidden; width: 100%; margin: 0px; } #block_link ul { border-top: 1px #BBB solid; list-style:none; list-style-position: outside;} #block_link ul li { height: 40px; line-height: 40px; border-bottom: 1px #CCC solid; background-color: #F8F8F8; *margin: -2px 0 0 0; } #block_link ul li#head { height: 19px; line-height: 19px; border-bottom: 1px #BBB solid; background-color: #C8C8C8; font-size: 10px; font-weight: bold; padding-left: 1em; color:#FFFFFF; } #block_link ul li#foot { height: 18px; line-height: 18px; background-color: #C8C8C8; font-size: 10px; font-weight: bold; text-align:right; padding-right: 1em; color:#990099;} #block_link ul li#foot a {color:#990099;} #block_link ul li#logo { height: 150px; background-color:#F8F8F8; text-align: center; } /*STANDAARD weergave*/ #block_link ul li a { /*float: left !important; */ margin: auto 0 auto 0; padding: 0; color: #333333; text-decoration: none; font-weight: bold; font-size: 1.0em;} #block_link ul li a img { vertical-align: middle; border: none; margin: auto 1em auto 0.5em; *margin: 0; *padding: 5px; } #block_link ul li a:hover { color: #FF0099; background:url(../images/basic/morearrow.gif) no-repeat 90% 55%; padding-right: 10px; font-size: 1.0em; font-weight: bold;background-color: #F9CAFF; display: block; } /* Actieve link */ #block_link ul li#blklk_act { background-color:#FFCBFE; } #block_link ul li#blklk_act a { /*float: left !important; */ margin: auto 0 auto 0; padding: 0; color: #333333; text-decoration: none; font-weight: bold; font-size: 1.0em;} #block_link ul li#blklk_act a img { vertical-align: middle; border: none; margin: auto 1em auto 0.5em; *margin: 0; *padding: 5px; } #block_link ul li#blklk_act a:hover { color: #FF0099; background:url(../images/basic/morearrow.gif) no-repeat 90% 55%; padding-right: 10px; font-size: 1em; font-weight: bold;background-color: #F9CAFF; display: block; } /* NIET actieve link */ #block_link ul li#blklk_na { background-color:#F8F8F8; color:#6600FF; } #block_link ul li#blklk_na a { /*float: left !important; */ margin: auto 0 auto 0; padding: 0; color: #999999; text-decoration: none; font-weight: bold; font-size: 1.0em;} #block_link ul li#blklk_na a img { vertical-align: middle; border: none; margin: auto 1em auto 0.5em; *margin: 0; *padding: 5px; } #block_link ul li#blklk_na a:hover {color: #333; background:url(../images/basic/nolink.gif) no-repeat 90% 50%; padding-right: 10px; font-size: 1em; font-weight: bold;background-color: #D3D3D3; display: block; } /* FOOTER */ #block_link ul li#foot a:hover { background: none; display: block; padding: 0px; color: #FF0099; text-decoration: underline;} /* end: block-link */