/**
 * @site Isover DoItYourself portal site
 * @revision $Revision: 1.1.2.1.2.9 $
 *
 * @styleguide:
 *  colors {
 *   white:  #fff;
 *   black:  #000;
 *   darkgrey:  #424242;
 *   orange: #f60;
 *   yellow: #fadc2f;
 *  }
 *  fonts {
 *   headers: Bliss Light;
 *   text:    Verdana, Helvetica, sans-serif;
 *  }
 */

/**
 * This stylesheet overrules the styles in DIY where necessary
 */
html, body { background: #fadc2f url(/images/diy_portal/bg_shadow.gif) repeat-y center top; }

#mainnav { display: none; }

.subsite #content { margin: 0 20px 0 285px; padding-top: 540px; }

.subsite #mainnav { display: block; top: 55px; width: 100%; height: 439px; background: transparent url(/images/diy_portal/portal_house.jpg) no-repeat left top; z-index: 2; }
    .subsite #mainnav h3 { position: absolute; top: 80px; left: 285px; margin: 0; padding: 0; }
    .subsite #mainnav ul { position: absolute; top: 105px; left: 285px; list-style-type: none; margin: 0; padding: 0; }
        .subsite #mainnav li { padding-left: 15px; border-left: 0; }
        .subsite #mainnav li.item-number { background-color: transparent; background-repeat: no-repeat; background-position: 0 .4em; }
            .subsite #mainnav li.number-1 { background-image: url(/images/diy_portal/portal_bullet_1.gif); }
            .subsite #mainnav li.number-2 { background-image: url(/images/diy_portal/portal_bullet_2.gif); }
            .subsite #mainnav li.number-3 { background-image: url(/images/diy_portal/portal_bullet_3.gif); }
            .subsite #mainnav li.number-4 { background-image: url(/images/diy_portal/portal_bullet_4.gif); }
            .subsite #mainnav li.number-5 { background-image: url(/images/diy_portal/portal_bullet_5.gif); }
            .subsite #mainnav li.number-6 { background-image: url(/images/diy_portal/portal_bullet_6.gif); }
            .subsite #mainnav li.number-7 { background-image: url(/images/diy_portal/portal_bullet_7.gif); }
            .subsite #mainnav li.number-8 { background-image: url(/images/diy_portal/portal_bullet_8.gif); }
            .subsite #mainnav li.number-9 { background-image: url(/images/diy_portal/portal_bullet_9.gif); }
            .subsite #mainnav li.number-10 { background-image: url(/images/diy_portal/portal_bullet_10.gif); }
            .subsite #mainnav li.number-11 { background-image: url(/images/diy_portal/portal_bullet_11.gif); }
            .subsite #mainnav li a { display: inline; }
                .subsite #mainnav li a:hover { text-decoration: underline; }
                .subsite #mainnav li a span { visibility: visible; }

    .subsite #mainnav ul.blocklinks { position: absolute; top: 0; left: 0; list-style-type: none; margin: 0; padding: 0; }
        .subsite #mainnav ul.blocklinks li { position: absolute; border: 0; padding: 0; width: 50px; height: 50px; }
        .subsite #mainnav ul.blocklinks li.item-number { background-image: none; }
            .subsite #mainnav ul.blocklinks li a { display: block; padding: 0; width: 100%; height: 100%; background: transparent no-repeat 1px 1px; }
                .subsite #mainnav ul.blocklinks li a span { visibility: hidden; }
                .subsite #mainnav ul.blocklinks li a:hover { text-decoration: none; }
        .subsite #mainnav ul.blocklinks li.number-1 { top: 51px; left: 709px; }
            .subsite #mainnav ul.blocklinks li.number-1 a:hover { background-image: url(/images/diy_portal/mo_01.jpg); }
        .subsite #mainnav ul.blocklinks li.number-2 { top: 49px; left: 841px; }
            .subsite #mainnav ul.blocklinks li.number-2 a:hover { background-image: url(/images/diy_portal/mo_02.jpg); }
        .subsite #mainnav ul.blocklinks li.number-3 { top: 130px; left: 744px; }
            .subsite #mainnav ul.blocklinks li.number-3 a:hover { background-image: url(/images/diy_portal/mo_03.jpg); }
        .subsite #mainnav ul.blocklinks li.number-4 { top: 174px; left: 648px; }
            .subsite #mainnav ul.blocklinks li.number-4 a:hover { background-image: url(/images/diy_portal/mo_04.jpg); }
        .subsite #mainnav ul.blocklinks li.number-5 { top: 239px; left: 599px; }
            .subsite #mainnav ul.blocklinks li.number-5 a:hover { background-image: url(/images/diy_portal/mo_05.jpg); }
        .subsite #mainnav ul.blocklinks li.number-6 { top: 238px; left: 743px; }
            .subsite #mainnav ul.blocklinks li.number-6 a:hover { background-image: url(/images/diy_portal/mo_06.jpg); }
        .subsite #mainnav ul.blocklinks li.number-7 { top: 297px; left: 563px; }
            .subsite #mainnav ul.blocklinks li.number-7 a:hover { background-image: url(/images/diy_portal/mo_07.jpg); }
        .subsite #mainnav ul.blocklinks li.number-8 { top: 353px; left: 715px; }
            .subsite #mainnav ul.blocklinks li.number-8 a:hover { background-image: url(/images/diy_portal/mo_08.jpg); }
        .subsite #mainnav ul.blocklinks li.number-9 { top: 297px; left: 839px; }
            .subsite #mainnav ul.blocklinks li.number-9 a:hover { background-image: url(/images/diy_portal/mo_09.jpg); }

#header { background-image: url(/images/diy/logo.jpg); }

#breadcrumbs { display: none; }

#footer { background-image: url(/images/diy/logo_footer.jpg); }

.subsite #bannercolumn { top: 164px; left: 0; width: 258px; z-index: 3; }
    .subsite #bannercolumn img { display: block; }

.menu #content { margin: 0 0 0 0; padding: 110px 0 8em 20px; min-height: 400px; background: transparent url(/images/diy_portal/portal_headerbg.gif) no-repeat 0 102px; }
.menu .contenttext { margin: 0; }
.menu .contenttext .imgbox { position: relative; margin: -50px 75px 0 0; z-index: 5; }

.menu .menu_rich { margin: 0 0 2em 0; width: 720px; }
    .menu .menu_rich li { float: left; width: 240px; height: auto; margin: 0 0 1em 0; background-color: transparent; }
    .menu .menu_rich li.first-row-item { clear: both; }
        .menu .menu_rich li div { width: 213px; margin: 0; background: transparent url(/images/diy_portal/bg_header.gif) no-repeat left top; }
        .menu .menu_rich li img { display: block; margin: 0; }
        .menu .menu_rich li a { display: block; padding-top: 31px; border: 0; }
            .menu .menu_rich li a span { position: absolute; top: 0; display: block; margin: 0 5px 0 30px; padding-bottom: 1px; border-bottom: 1px solid black; text-indent: -9000px; }
                .menu .menu_rich li a:hover span { border-color: #424242; cursor: pointer; }
        .menu .menu_rich li p { margin: 0; padding: 0; border-top: 2px solid #fadc2f; background-color: white; }
            .menu .menu_rich li p.link { padding-top: .5em; border: 0; }
        .menu .menu_rich li .readmore { float: none; display: inline; color: black; font-variant: small-caps; font-weight: bold; margin: 0; padding: .2em .5em .2em 0; border: 0; background-color: white; }
            .menu .menu_rich li .readmore:hover { text-decoration: underline; }
        .menu .menu_rich li .readmore-suffix { float: left; visibility: visible; text-indent: 0; font-variant: small-caps; margin: 2px 0 0 -2px; padding: 0; border: 0; }

#choose-product { margin: 0 0 5px 0; padding: 0; width: 165px; height: 83px; text-indent: -9000px; background: transparent url(/images/diy_portal/button_choose.png) no-repeat left top; }

.menu #mainnav, .menu #bannercolumn { display: none; }