/**
 * viega.catalog.css
 * viega Product Catalog
 *
 * @author       ecomplexx, www.ecomplexx.com
 * @version      $Revision: 296 $ 
 * @date         $Date: 2009-05-12 17:42:27 +0200 (Di, 12 Mai 2009) $
 */

/* Fix default style from style.css */
#catalog ul li, #catalog-fallback ul li, #shop ul li {
    background-image: none;
    background-position: left top;
}
#catalog-fallback ul.group li a span {
    padding-left: 10px;
    font-size: 12px;
    font-weight: bold;
}

#loading, #error, #productgroups, #tabs, #productscopes, #productmodels, #model { display: none; }

#formerror {
    font-weight: bold;
    color: #ff0000 !important;
}

.hidden { display:none; }

/* -- Button --------------------------------------------------------------- */
#catalog button, #shop button, #shop-sidebar button {
    background: url(/s/viega_DE/p/images/structure/catalogshop/button_bg.png) repeat-x;
    border: 1px solid #dbdbdb;
    font-weight: bold;
    padding: 2px;
    color: #333;
}

#catalog button span.arrow, #shop button span.arrow, #shop-sidebar button span.arrow {
    background: url(/s/viega_DE/p/images/structure/catalogshop/arrow_gray.gif) right center no-repeat;
    padding-right: 10px;
}

#catalog button span.basket, #shop button span.basket, #shop-sidebar button span.basket {
    background: url(/s/viega_DE/p/images/structure/catalogshop/icon_basket.png) right center no-repeat;
    padding-right: 25px;
    display: block;
}

#shop button span.edit {
    background: url(/s/viega_DE/p/images/structure/catalogshop/icon_edit.png) right center no-repeat;
    padding-right: 25px;
    display: block;
}


#basket-buttons button {
    text-align: right;
    width: 190px;
    margin-bottom: 5px;
}


/* -- General catalog styles ----------------------------------------------- */
#catalog, #catalog-fallback {
    margin-bottom: 50px;
    color: #333;
    }
    
    #catalog h1 {
        background-color: #FFFF00;
        font: bold 16px/18px Arial,sans-serif;
        margin: 0 0 6px;
        padding: 24px 8px 11px;
    }
    
    #catalog h2 {
        background-color: #ECEEED;
        font: bold 16px/18px Arial,sans-serif;
        margin: 0 0 12px;
        padding: 6px 8px 6px;
    }

    #catalog h3, #catalog-fallback h3 {
        background: #fff url(/s/viega_DE/p/images/structure/catalogshop/header_catalog.gif) repeat-x bottom;
        border: 1px solid #bebebe;
        border-right: 0 none;
        cursor: pointer;
        margin: 5px 0 0;
        padding: 0 0 0 5px;
        }
        #catalog h3.slideropen { background-color: #fff; }
        #catalog-fallback h3 { border-right: 1px solid #bebebe; }

        #catalog h3 span {
            background: url(/s/viega_DE/p/images/structure/catalogshop/header_closed.gif) no-repeat right;
            display: block;
            font-size: 12px;
            height: 19px;
            line-height: 19px;
        }

        #catalog-fallback h3 a {
            display: block;
            font-size: 12px;
            height: 19px;
            line-height: 19px;
        }

            
        #catalog h3.slideropen span { background-image: url(/s/viega_DE/p/images/structure/catalogshop/header_open.gif) !important; }

    #catalog h3.tab {
        background: none;
        margin: 0;
        padding: 5px 10px 0;
        cursor: auto;
        position: relative;
        display: inline;
        top: 2px !important;
        top: 1px; /* Fix for IE */
        border: 1px solid #dbdbdb;
        border-bottom: 0 none;
        background: #fff;
        }
        
        #catalog h3.tab span {
            background-image: none;
            display: inline;
            font-size: 16px;
        }

    #catalog h4 {
        border-bottom: 1px solid #bebebe;
        color: #474747;
        font-size: 16px;
        line-height: 20px;
        margin: 6px 0 23px;
        padding-bottom: 6px;
    }

    #catalog a, #catalog button { cursor: pointer; }

    
#loading, #error {
    position: absolute;
    width: 360px;
    margin: 0 100px;
    height: 50px;
    z-index: 90;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    line-height: 50px;
    color: #fff;
    background-color: #454d4f;
    border: 1px solid #bebebe;
}

#error {
    height: auto;
    padding: 20px 20px;
    line-height: 1.5em;
    cursor: pointer;
}

#backlink {
    float: right;
    background: url(/s/viega_DE/p/images/structure/catalogshop/arrow_blue_back.gif) left 0.4em no-repeat;
    padding-left: 6px;
}

ul.group {
    border: 1px solid #dbdbdb;
    border-top: 0 none;
    margin: 0;
    overflow: hidden;
    padding: 10px 12px;
    
    
    list-style-type: none;
    display: inline-block;
    }
        
    ul.group li {
        float: left;
        margin: 0 25px 9px 0;
        width: 252px;
        border: 1px solid #DBDBDB;
        height: 58px;
        padding: 0;
    }
    ul.group li.even { margin-right: 0; }
    
        ul.group li a {
            display: block;
            height: 58px;
            color: #474747;
            background: url(/s/viega_DE/p/images/structure/catalogshop/button.png) right no-repeat;
            padding: 0 30px 0 0px;
            }
            ul.group li a:hover {
                text-decoration: none;
                background-image: url(/s/viega_DE/p/images/structure/catalogshop/button_hover.png);
            }
            ul.group li a.decorative { padding-left: 10px; }
            ul.group li a.noclick, ul.group li a.noclick:hover {
                text-decoration: none;
                padding-left: 10px;
                background-image: url(/s/viega_DE/p/images/structure/catalogshop/button_noclick.png);
            }

            ul.group li a img {
                float: left;
                display: block;
                margin-right: 10px;
            }
    
            ul.group li a strong {
                font-size:22px;
                vertical-align:middle;
                line-height: 58px;
                display: table-cell !important;
                display: block;
                float: left;
                width: 30px;
            }
            
            ul.group li a span {
                display: table-cell;
                height: 58px !important;
                height: auto;
                vertical-align:middle;
                line-height: 15px;
            }
    

.tab-content {
    padding: 10px 12px;
    margin-bottom: 30px;
    overflow: hidden;
    border: 1px solid #dbdbdb;
    }

    .tab-content ul.group {
        padding: 0;
        background: transparent;
        border: 0 none;
    }


ul.sub {
    background: #e7e7e7;
    list-style-type: none;
    margin: 0;
    padding: 10px 12px;
    }
    
    ul.sub li {
        background-image: none !important;
        border-bottom: 1px solid #dbdbdb;
        padding: 2px 0;
        font-size: 11px;
    }
    ul.sub li:last-child { border-bottom: 0 none; }
    
    ul.sub a {
        color: #0050A0;
        background: url(/s/viega_DE/p/images/structure/catalogshop/arrow_blue.gif) 2px 0.4em no-repeat;
        padding-left: 10px;
    }
    
/* -- Navigation ----------------------------------------------------------- */
/* #sub-navigation ul li ul { display: none; } */


/* -- Model/Article List --------------------------------------------------- */
#model { height: 1%; } /* IE6 floating fix */

#model p { margin-bottom: 1em; }

#model button {
    float:right;
    margin: 5px 0;
    width: 200px;
    }

#model-image {
    width: 190px;
    float: left;
    text-align: center;
    }
    
    #model-image img { margin-bottom: 2em; }
#model-description {
    margin-left: 190px;
    }
    * html #model-description { width: 341px; }                                /* IE6 3px Bug */
    
    #model-description h5 {
        font-size: 14px;
        line-height: 16px;
        margin: 0;
    }
br.clear { clear: both; }
#model-articles, .dito-articles {
    margin: 5px 0;
    border-collapse: collapse;
    }
    #model-articles *, .dito-articles * { color: #333; }
    #model-articles tr, .dito-articles tr { background: #e5e5e5; }
    #model-articles tr.even, .dito-articles tr.even { background: #f5f5f5;  }

    #model-articles tr.blankline td, .dito-articles tr.blankline td { border-bottom: 0.5em solid #fff; }
    #model-articles th, .dito-articles th {
        text-align: left;
        font-weight: normal;
        background: #dbdbdb;
        border-left: 1px solid #bebebe;
        border-bottom: 1px solid #fff;
        padding: 2px 4px;
    }
    
    #model-articles td, .dito-articles td {
        border-left: 1px solid #bebebe;
        padding: 2px 4px;
    }
    
    #model-articles .first, .dito-articles .first { border-left: 0 none; }
    #model-articles .right, .dito-articles .right { text-align: right }
    
    #model-articles input, .dito-articles input { font-size: 10px; }

    div.model-number { margin-left: 190px; }
    * html div.model-number { margin-left: 193px; } /* IE6 3 Pixel bug */
    
/* -- Sidebar: Shop-Integration -------------------------------------------- */    
#shop-sidebar h3 {
    background: url(/s/viega_DE/p/images/structure/catalogshop/header_catalog.gif) repeat-x bottom;
    border: 1px solid #bebebe;
    clear: both;
    cursor: pointer;
    margin: 5px 0 0;
    padding: 0 0 0 5px;
    
    float: right;
    width: 183px;
    
    font-size: 12px;
    height: 19px;
    line-height: 19px;
    }

    #shop-sidebar h3#quickorder { border-right: 1px solid #bebebe; }

    #shop-sidebar h3 span {
        display: block;
        font-size: 12px;
        height: 19px;
        line-height: 19px;
    }

    #shop-sidebar h3 a {
        display: block;
        font-size: 12px;
        height: 19px;
        line-height: 19px;
    }

    #shop-sidebar button {
        width: 190px;
        float: right;
        text-align: right;
        margin: 5px 0 0;
        }

    #shop-sidebar .sideBarTeaserContainer {
        border-top: 0 none;
        background: #d5d5d5;
        padding: 0 7px;
        }

        #shop-sidebar .sideBarTeaserContainer h4 { margin-bottom: 4px; }

        #shop-sidebar .sideBarTeaserContainer div {
            background: #ededed;
            padding: 10px;
            margin: 7px 0;
        }
        
        #shop-sidebar .sideBarTeaserContainer a {
            background: url(/s/viega_DE/p/images/structure/catalogshop/arrow_blue.gif) 2px 0.4em no-repeat;
            padding-left: 10px;
        }    

        #shop-sidebar .sideBarTeaserContainer label {
            background-color: transparent;
            float: left;
            font-size: inherit !important;
            line-height: 20px;
        }

        #shop-sidebar .sideBarTeaserContainer input,
        #shop-sidebar .sideBarTeaserContainer button {
            width: 110px;
            float: right;
        }

        #shop-sidebar .sideBarTeaserContainer button {
            text-align: left;
        }

    #sidebar-basket strong {
        font-size: 22px !important;
        vertical-align:middle;
        line-height: 22px;
    }

/* -- CMS Content ---------------------------------------------------------- */
#cmscontent li {
    padding: 0;
    width: 100%;
    overflow: hidden;
    
}
* html #cmscontent li { zoom: 100%; } /* IE6 Fix */
#cmscontent .w550 { width: 526px; }
#cmscontent .w360 { width: 336px; }
#cmscontet table.triPtychon td { padding: 0 0 2px 0; }

#cmscontent div.download_icon_pdf, #cmscontent div.download_icon_doc, #cmscontent div.download_icon_rtf,
#cmscontent div.download_icon_d81, #cmscontent div.download_icon_xls, #cmscontent div.download_icon_exe,
#cmscontent div.download_icon_zip, #cmscontent div.download_icon_gaeb, #cmscontent div.download_icon_mov,
#cmscontent div.download_icon_mpg, #cmscontent div.download_icon_wmv {
    width: 18px;
    background-position: left center;
}

/**
 * END: viega.catalog.css
 *//**
 * BEGIN: viega.shop.css
 */
.error { border: 1px solid #ff0000; }
.nonorder {
    border: 1px solid #333;
    background: #ccc;
}
.disabled {
    color: #ccc !important;
    background-color: #ccc;
}
.right { float: right; }

#formerror, #sidebar-error, #orderdata-error, #basket-error, #basket-save-error {
    font-weight: bold;
    color: #ff0000 !important;
}

#sidebar-error {
    display: block;
    margin-bottom: 6px;
}

.deleteHighlight { background-color: #fcffc0 !important; }

a, button { cursor: pointer; }

a.delete {
    display: block;
    background: url(/s/viega_DE/p/images/structure/catalogshop/icon_delete.png) no-repeat;
    width: 16px;
    height: 16px;
    text-indent: -100px;
    overflow: hidden;
}

label {
    font-size: 11px !important;
    line-height: 13px;
    background: transparent !important;
}

input.radio { margin-right: 4px; }

/* -- General shop styles -------------------------------------------------- */
#status {
    position: absolute;
    left: 0;
    height: 12px;
    width: 528px;

    padding: 4px 4px 4px 26px;
    border: 1px solid #dbdbdb;
    margin-bottom: 5px;
    background: #fcffc0 url(/s/viega_DE/p/images/structure/catalogshop/icon_check.png) 4px center no-repeat;
    display: none;
}

.available, .availableonrequest, .notavailable {
    text-indent: -100px;
    overflow: hidden;
    background-position: center center;
    background-repeat: no-repeat;
}

div.available, div.availableonrequest, div.notavailable {
    text-indent: 0;
    background-position: 5px center;
    padding-left: 20px;
}

.available          { background-image: url(/s/viega_DE/p/images/structure/catalogshop/icon_available.gif); }
.availableonrequest { background-image: url(/s/viega_DE/p/images/structure/catalogshop/icon_availableonrequest.gif); }
.notavailable       { background-image: url(/s/viega_DE/p/images/structure/catalogshop/icon_notavailable.gif); }


#shop {
    position: relative;
    margin-bottom: 50px;
    color: #333;
    }
    
    #shop a { color: #0050A0 !important; }
    
    #shop h1 {
        background-color: #FFFF00;
        font: bold 16px/18px Arial,sans-serif;
        margin: 0 0 6px;
        padding: 24px 8px 11px;
    }
    
    #shop h2 {
        background-color: #ECEEED;
        font: bold 16px/18px Arial,sans-serif;
        margin: 0 0 12px;
        padding: 6px 8px 6px;
    }
    
    #shop br.cBoth { line-height: 1px; }

#shop-content {
    margin: 40px 0 30px !important;
    margin: 30px 0 30px;
    padding: 10px 12px;
    border: 1px solid #dbdbdb;
    }
    
    #shop-content h3 {
        border-bottom: 1px solid #dbdbdb;
        padding-bottom: 4px;
        }    
        
        #shop-content h3 strong {
            font-size: 14px;
            line-height: 20px;
            font-weight: bold;
        }

    #shop-content table {
        margin: 5px 0;
        border-collapse: collapse;
        }
        
        #shop-content tbody tr { background: #e5e5e5; }
        #shop-content tbody tr.even { background: #f5f5f5;  }

        #shop-content table th {
            text-align: left;
            font-weight: normal;
            background: #dbdbdb;
            border-right: 1px solid #bebebe;
            border-bottom: 1px solid #fff;
            padding: 2px 4px;
        }
        #shop-content table td {
            border-right: 1px solid #bebebe;
            padding: 2px 4px;
            }
        #shop-content table th.last,
        #shop-content table td.last { border-right: 0 none; }
        #shop-content table input { font-size: 10px; }
        
div.box {
    background-color: #F5F5F5;
    margin-bottom: 18px;
    padding: 5px;
    line-height: 20px;
    }

    div.box p { margin-bottom: 1em; }    
    
    div.box label {
        font-size: inherit !important;
        line-height: 20px;
        display: block;
        float: left;
        }

    /* Form elements for basket */
    div.box label.basket { width: 120px; }
    div.box input {
        vertical-align: top;
        border: 1px solid #999;
        height: 16px;
        }

        div.box input#address-database, div.box input#address-custom { border: 0 none; }

        div.box input.basket { width: 98px; }    

    div.box select.basket { width: 130px; }
    * html div.box select.basket { width: 127px; }                             /* Hack for IE6 */
    div.box button.imageonly {
        padding: 0 !important;
        margin-left: 2px;
    }

    /* Form elements for order form */
    div.box label.orderform { width: 70px; }
    div.box input.orderform {
        width: 174px;
        margin: 1px 0 1px 0;
    }
    * html div.box input.orderform { width: 171px; }                            /* Hack for IE6 */
    div.box input.error { border: 1px solid #ff0000; }    
    div.box input#zip {
        width: 50px;
        margin-right: 2px;
        float: left;
    }
    * html div.box input#zip { margin: 1px 2px 0px 3px }
    div.box input#city {
        width: 120px;
        margin-top: 1px;
    }
    * html div.box input#city { width: 110px; }                                    /* Hack for IE6 */
    *:first-child+html div.box input#city {                                     /* Hack for IE7 */
        width: 118px;
        margin-top: 0px;
    }
    
    div.box textarea { width: 519px; }

    /* Box headline */
    div.box h4 {
        margin: -5px -5px 10px;
        background-color: #dbdbdb;
        padding: 4px;
        line-height: 14px;
        font-size: 12px;
        }
        
        div.box h4 label {
            float: none;
            display: inline;
            font-weight: bold;
            line-height: 14px;
            font-size: 12px !important;
        }
    div.box.submit {
         background-color: #ddd;
         margin-bottom: 0;
    }

    
div.halfsize {
    width: 250px;
    margin-right: 14px;
    float: left;
}

div.last { margin-right: 0; }
    

/* -- Basket ------------------------------------------------------------- */    
td.order-position, td.order-amount, td.order-list-price, td.order-customer-price {
    text-align: right;
    white-space: nowrap;
}

#shop-content table tfoot td {
    padding: 5px 4px 20px;
    border: 0 none;
    }

    #shop-content table tfoot label {
        font-size: 11px !important;
        line-height: 16px;
        padding-right: 10px;
    }
    
    #shop-content table tfoot #delete-all {
        background: url(/s/viega_DE/p/images/structure/catalogshop/icon_delete.png) no-repeat;
        padding-left: 16px;
        line-height: 16px;
    }
    
#total-list-price, #total-customer-price, #check-total-customer-price {
    font-size: 14px;
    font-weight: bold;
    text-align: right;
    white-space: nowrap;
}    

    
#basket-buttons {
    float: right;
    }
    
    #basket-buttons button { display: block; }

/* -- Direct Order --------------------------------------------------------- */
#order button { width:220px; }


/* -- Order Form ----------------------------------------------------------- */
#orderstep2, #orderstep3 { display: none; }


/* -- Order Form: Print ---------------------------------------------------- */
@media print {
    #Page {
        width: 100%;
    }
    
    h2#orderform, button { display: none; }
    
    .available, .notavailable {
        text-indent: 0px;
        background-image: none;
    }
}
/**
 * END: viega.shop.css
 *//**
 * BEGIN: jquery.datepick.css
 */
#datepick-div, .datepick-inline {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 14px;
    padding: 0;
    margin: 0;
    background: #ddd;
    color: #000;
    width: 185px;
}
#datepick-div {
    display: none;
    border: 1px solid #777;
    z-index: 100; /*must have*/
}
.datepick-inline {
    float: left;
    display: block;
    border: 0;
}
.datepick-rtl {
    direction: rtl;
}
.datepick-dialog {
    padding: 5px !important;
    border: 4px ridge #ddd !important;
}
.datepick-disabled {
    position: absolute;
    z-index: 100;
    background-color: white;
    opacity: 0.5;
    filter: alpha(opacity=50);
}
button.datepick-trigger {
    width: 25px;
    padding: 0px;
}
img.datepick-trigger {
    margin: 2px;
    vertical-align: middle;
}
.datepick-prompt {
    float: left;
    padding: 2px;
}
* html .datepick-prompt {
    width: 185px;
}
.datepick-control, .datepick-links, .datepick-header, .datepick {
    clear: both;
    float: left;
    width: 100%;
    color: #fff;
}
.datepick-control {
    background: #400;
    padding: 2px 0px;
}
.datepick-links {
    background: #000;
    padding: 2px 0px;
}
.datepick-control, .datepick-links {
    font-weight: bold;
    font-size: 80%;
}
.datepick-links label {
    padding: 2px 5px;
    color: #888;
}
.datepick-clear, .datepick-prev {
    float: left;
    width: 34%;
}
.datepick-rtl .datepick-clear, .datepick-rtl .datepick-prev {
    float: right;
    text-align: right;
}
.datepick-current {
    float: left;
    width: 30%;
    text-align: center;
}
.datepick-close, .datepick-next {
    float: right;
    width: 34%;
    text-align: right;
}
.datepick-rtl .datepick-close, .datepick-rtl .datepick-next {
    float: left;
    text-align: left;
}
.datepick-header {
    background: #333;
    text-align: center;
    font-weight: bold;
    height: 1.6em;
}
.datepick-header select, .datepick-header option {
    background: #333;
    color: #fff;
    border: 0px;
    font-weight: bold;
}
.datepick-header span {
    position: relative;
    top: 3px;
}
.datepick {
    background: #ccc;
    text-align: center;
    font-size: 100%;
}
.datepick a {
    display: block;
    width: 100%;
}
.datepick-title-row {
    background: #777;
}
.datepick-title-row th {
    text-align: center;
    font-weight: normal;
}
.datepick-days-row {
    background: #eee;
    color: #666;
}
.datepick-week-col {
    background: #777;
    color: #fff;
}
.datepick-days-cell {
    color: #000;
    border: 1px solid #ddd;
}
.datepick-days-cell a {
    display: block;
}
.datepick-other-month {
    background: #fff;
}
.datepick-week-end-cell {
    background: #ddd;
}
.datepick-title-row .datepick-week-end-cell {
    background: #777;
}
.datepick-week-over {
    background: #ddd;
}
.datepick-unselectable {
    color: #888;
}
.datepick-today {
    background: #fcc;
}
.datepick-current-day {
    background: #777;
    color: #fff;
}
.datepick-days-cell-over {
    background: #fff;
    color: #000;
    border: 1px solid #777;
}
.datepick-status {
    background: #ddd;
    width: 100%;
    font-size: 80%;
    text-align: center;
}
#datepick-div a, .datepick-inline a {
    cursor: pointer;
    margin: 0;
    padding: 0;
}
.datepick-inline .datepick-links a {
    padding: 0 5px !important;
}
.datepick-control a, .datepick-links a {
    padding: 2px 5px !important;
    color: #eee;
}
.datepick-title-row a {
    color: #eee;
}
.datepick-control a:hover {
    background: #fdd;
    color: #333;
}
.datepick-links a:hover, .datepick-title-row a:hover {
    background: #ddd;
    color: #333;
}
.datepick-multi .datepick {
    border: 1px solid #777;
}
.datepick-one-month {
    float: left;
    width: 185px;
}
.datepick-new-row {
    clear: left;
}
/* ___________ IE6 IFRAME FIX ________ */
.datepick-cover {
    display: none; /*sorry for IE5*/
    display/**/: block; /*sorry for IE5*/
    position: absolute; /*must have*/
    z-index: -1; /*must have*/
    filter: mask(); /*must have*/
    top: -4px; /*must have*/
    left: -4px; /*must have*/
    width: 200px; /*must have*/
    height: 200px; /*must have*/
}
/**
 * END: jquery.datepick.css
 */
