
/* Import reset & grid stylesheet
----------------------------------------------------------------------------------------------------*/

@import url("reset.css");
@import url("grid_6.css");
@import url("forms.css");
@import url("help.css");
@import url("lightbox.css");

/* Html & body reset
----------------------------------------------------------------------------------------------------*/

html {
	text-align: center;
}

html, body {
	height: 100%;
}

body {
	text-align: center;
	margin: 0;
	padding: 0;
	font-size: 10px;
	background: #F0F0F0 url(../img/achtergronden/bg.gif) repeat-y center top;
	font-family: 'trebuchet ms',tahoma,verdana,sans-serif;
}

/* Headings
----------------------------------------------------------------------------------------------------*/

h1,h2,h3,h4,h5,h6 {
    color: #44d5ff;
    font-family: 'trebuchet ms',tahoma,verdana,sans-serif;
    font-weight: bold;
}

/* Container
----------------------------------------------------------------------------------------------------*/

.container {
    text-align: left;
    min-height: 100%;
	height: auto !important;
	height: 100%;
	position: relative;
	z-index: 5;
}

a, a:hover {
    color: #00AEEF;
}

.christmas-left {
    position: absolute;
    top: 0;
    left: -300px;
    width: 295px;
    height: 144px;
    background: #F0F0F0 url(../img/achtergronden/christmas2009-left.jpg) no-repeat top left;
}

.christmas-right {
    position: absolute;
    top: 0;
    left: 965px;
    width: 295px;
    height: 144px;
    background: #F0F0F0 url(../img/achtergronden/christmas2009-right.jpg) no-repeat top left;
}

/* Header
----------------------------------------------------------------------------------------------------*/

.header {
    height: 78px;
}

    .header h1 {
    	margin: 0;
    	padding: 0;
    	font-size: 10px;
    	line-height: 10px;
    }

        .header h1 a {
        	width: 268px;
        	height: 78px;
        	display: block;
        	text-decoration: none;
        	background: url(../img/algemeen/logo.png) no-repeat;
        }

        .header h1 a span {
        	visibility: hidden;
        }

    .header .toplinks {
        height: 38px;
        padding-top: 10px;
        text-align: right;
    }

        .header .toplinks a, .header .toplinks a:hover {
            color: #000;
            text-decoration: none;
        }

    .header .search {
        width: 50%;
        float: left;
    }

        .header .search input.search, .main input.search {
            color: #666666;
            width: 140px;
            height: 16px;
            line-height: 16px;
            font-size: 11px;
        }

    .header .login {
        width: 50%;
        float: left;
        text-align: left;
    }

        .header .login input.login {
            color: #666666;
            width: 76px;
            height: 16px;
            line-height: 16px;
            font-size: 11px;
        }

        .header .login .right {
            float: right;
        }

        .header .login .account {
            font-size: 10px;
        }

            .header .login .account span {
                font-weight: bold;
                font-size: 11px;
            }

.topnav {
    height: 22px;
    line-height: 22px;
    background-color: #00AEEF;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}

        .topnav .nav ul {
        	margin: 0;
        	padding: 0;
        	list-style: none;
        }

        .topnav .nav ul li {
        	float: left;
        	margin: 0;
        	padding: 0 10px;
        }

        .topnav a, .topnav a:hover {
            display: block;
            color: #fff;
            text-decoration: none;
        }

    .topnav .cartlink {
        text-align: right;
        position: relative;
    }

        .topnav .cartlink a {
            padding-right: 14px;
            background: url(../img/icons/arrow-right.png) no-repeat center right;
        }

        .topnav .cartlink span#cart_loading {
            position: absolute;
            top: 2px;
            right: 96px;
        }

/* Content
----------------------------------------------------------------------------------------------------*/

.content {

}

.crumpath {
    height: 24px;
    line-height: 22px;
    text-indent: 20px;
    color: #b2b2b2;
    border-bottom: 1px solid #b2b2b2;
}

    .crumpath a {
        color: #b2b2b2;
        text-decoration: none;
    }

    .crumpath a:hover {
        color: #b2b2b2;
        text-decoration: underline;
    }

.main {

    font-size: 11px;
}

    .main h2 {
        font-size: 11px;
        line-height: 22px;
        font-weight: bold;
        text-transform: uppercase;
        color: #000;
        background: url(../img/achtergronden/bg-h2.png) no-repeat left bottom;
        padding: 0 0 11px 4px;
        margin: 0;
    }

    .main p {
        margin: 0 0 1em;
        padding: 0 0 0 4px;
    }

        .main .row {
            height: 168px;
            margin-top: 10px;
            padding-bottom: 0px;
            border-bottom: 1px solid #b2b2b2;
            text-align: center;
        }
            .main .row.first {
                margin-top: 5px;
            }
            .main .row .grid_1 {
                padding-top: 5px;
            }

            .main .row h3 {
                font-size: 14px;
                line-height: 14px;
                margin: 5px 0 2px 0;
            }

                .main .row a, .main .row a:hover {
                    color: #000;
                    text-decoration: none;
                }

                .main .row h3 a, .main .row h3 a:hover {
                    color: #00AEEF;
                }

                .main .row a.continue {
                    font-weight: bold;
                    padding-right: 14px;
                    background: url(../img/icons/arrow-right-black.png) no-repeat right center;
                }

    .main .search-inline input  {
        vertical-align: middle;
    }

/* Homepage (featured content)
----------------------------------------------------------------------------------------------------*/

.featured {
    border-bottom: 1px solid #b2b2b2;
}
    .featured, .featured table {
        font-size: 13px;
        font-family: 'trebuchet ms',verdana,sans-serif;
    }

    .featured a {
        text-decoration: none;
    }

    .featured .mainitem {
        height: 236px;
        overflow: hidden;
    }

    .featured .grid_2 {
        height: 168px;
        margin-top: 10px;
    }

    .featured .grid_1 {
        margin-top: 10px;
        padding-bottom: 0px;
        min-height: 168px;
        height: auto !important;
        height: 168px;
    }

    .featured h2 {
        color: #000;
        font-size: 24px;
        font-weight: bold;
        line-height: 30px;
        margin: 0;
        text-transform: none;
        background: none;
    }

    .featured h3, .main span.h2 {
        color: #00AEEF;
        font-size: 14px;
        font-weight: bold;
        line-height: 18px;
        margin: 0;
    }

    .featured p {
        margin: 4px 0;
    }

    .featured .prijs-groot, .featured .prijs-groot a, .featured .prijs-groot a:hover {
        color: #00AEEF;
        font-size: 24px;
        font-weight: bold;
        line-height: 30px;
        text-decoration: none;
    }

    .featured .kleine-tekst, .featured .kleine-tekst a, .featured .kleine-tekst a:hover {
        color: #000;
        font-size: 9px;
        line-height: 14px;
        text-decoration: none;
        margin: 4px 0;
    }

    .featured .kleine-tekst-cyaan, .featured .kleine-tekst-cyaan a, .featured .kleine-tekst-cyaan a:hover {
        color: #00AEEF;
        font-size: 11px;
        line-height: 14px;
        text-decoration: none;
        margin: 4px 0;
    }

.logos {
    border-bottom: 1px solid #b2b2b2;
}

    .logos .grid_1 {
        height: 64px;
        text-align: center;
    }

/* Product details
----------------------------------------------------------------------------------------------------*/

.productdetails {
	min-height: 455px;
    height: auto !important;
    height: 455px;
    background: #fff url(../img/achtergronden/bg-productdetails.gif) no-repeat center top;
}

    .nav-buttons {
        text-align: center;
        padding-bottom: 4px;
    }

        .nav-buttons input.button {
            height: 20px;
            line-height: 16px;
        }

        .nav-buttons input.walk {
            background-color: #66DDFF;
            border-color: #66DDFF;
        }

    .productdetails .visuals {
        position: relative;
        min-height: 215px;
        height: auto !important;
        height: 215px;
    }

        .productdetails .visuals .big {
            position: absolute;
            left: 0px;
            bottom: 0px;
            width: 186px;
            text-align: center;
        }

        .productdetails .visuals .thumbs {
            position: absolute;
            right: 0px;
            bottom: 0px;
            text-align: right;
            width: 120px;
            min-height: 125px;
            height: auto !important;
            height: 125px;
            padding: 0 0 0 3px;
            background: url(../img/achtergronden/bg-thumbs.gif) no-repeat left bottom;
        }

            .productdetails .visuals .thumbs .zoom {
                position: absolute;
                bottom: -20px;
                left: -13px;
                z-index: 10;
            }

            .productdetails .visuals .thumbs .thumb1 {
                position: absolute;
                bottom: 0px;
                left: 3px;
            }

            .productdetails .visuals .thumbs .thumb2 {
                position: absolute;
                bottom: 0px;
                right: 0px;
            }

    .productdetails h3 {
        position: relative;
        color: #fff;
        font-size: 12px;
        background-color: #66ddff;
        padding: 3px 10px 3px 10px;
        margin: 0;
    }

    .productdetails h4 {
        position: relative;
        color: #fff;
        font-size: 12px;
        background-color: #00AEEF;
        padding: 20px 10px 3px 10px;
        margin: 0;
    }

        .productdetails h3 a, .productdetails h3 a:hover, .productdetails h4 a, .productdetails h4 a:hover {
            color: #fff;
            text-decoration: none;
        }

        .productdetails span.toggle {
            font-size: 11px;
            line-height: 16px;
            color: #3c4e8a;
            position: absolute;
            right: 10px;
            padding-right: 20px;
            text-align: right;
            background: url(../img/icons/icon-toggle-close.gif) no-repeat right center;
        }

            .productdetails span.toggle a {
                color: #3c4e8a;
            }

        .productdetails .hide span.toggle {
            background: url(../img/icons/icon-toggle-open.gif) no-repeat right center;
        }

        .productdetails .open span.toggle {
            background: url(../img/icons/icon-toggle-close.gif) no-repeat right center;
        }

    .productdetails .related ul {
        margin-bottom: 0;
        list-style: none;
    }

    .productdetails .info {
        padding: 14px 6px 6px 10px;
    }

    .productdetails .hide .info {
        display: none;
    }

    .productdetails .options {
        min-height: 106px;
        height: auto !important;
        height: 106px;
        padding: 10px 6px 6px 10px;
    }

        .productdetails .options input {
        	margin: 1px 0 0 0;
        	line-height: 10px;
        	font-size: 11px;
        }

            .productdetails .options input.small {
                width: 50px;
            }

            .productdetails .options input.medium {
                width: 100px;
            }

            .productdetails .options input.large {
                width: 200px;
            }

        .productdetails .option-radio {
        	float: left;
        	margin-left: 0px;
        }

        .productdetails .options .option1, .productdetails .options .option2, .productdetails .options .option3 {
            clear: both;
        }

        .productdetails .options span {
        	display: block;
        	text-transform: uppercase;
        	color: #00AEEF;
        	font-weight: bold;
        }

        .productdetails .options .icon {
        	float: left;
        	padding-right: 6px;
        }

    .productdetails .order {
        width: 280px;
    }

        .productdetails .order .artnr {
            font-size: 11px;
            color: #6d6d6d;
            float: left;
            width: 230px;
            height: 20px;
            padding-top: 20px;
        }

        .productdetails .order .number {
            float: left;
            width: 50px;
            height: 40px;
        }

            .productdetails .order .number span {
                display: block;
            	text-transform: uppercase;
            	color: #00AEEF;
            	font-weight: bold;
            }

            .productdetails .order .number input.normal {
                width: 50px;
                float: right;
            }

    .productdetails .buttons {
        width: 280px;
    }

        .productdetails .buttons .price-from {
            float: left;
            width: 158px;
            line-height: 20px;
            font-size: 10px;
            background: url(../img/achtergronden/bg-price-from.gif) no-repeat right top;
        }

            .productdetails .buttons .price-from span {
                color: #8a2828;
                font-size: 11px;
                text-decoration: line-through;
            }

        .productdetails .buttons .submit {
            float: left;
            width: 122px;
        }

        .productdetails .price span {
            font-size: 20px;
            font-weight: bold;
            color: #00AEEF;
            padding-right: 3px;
        }

/* Sitemap
----------------------------------------------------------------------------------------------------*/

.sitemap {
    background-color: #00AEEF;
}

    .sitemap ul {
        margin: 15px 0 0 5px;
        list-style: none;
    }

        .sitemap ul li a, .sitemap ul li a:hover {
            color: #000;
            font-weight: bold;
            text-decoration: none;
            text-transform: uppercase;
        }

    .sitemap ul ul {
        margin: 0;
    }

        .sitemap ul ul li a, .sitemap ul ul li a:hover {
            color: #fff;
            font-weight: bold;
            text-decoration: none;
            text-transform: none;
        }

/* Sidebars
----------------------------------------------------------------------------------------------------*/

.left {

}

    .left ul {
        margin: 0;
        list-style: none;
    }

        .left ul li a, .left ul li a:hover {
            background: url(../img/achtergronden/bg-li-left.png) no-repeat 0px 0px;
            color: #272727;
            font-weight: bold;
            text-decoration: none;
            text-transform: uppercase;
            line-height: 23px;
            height: 23px;
            display: block;
            padding-left: 10px;
        }

        .left ul li a:hover {
            color: #272727;
            text-decoration: none;
        }

        .left ul li.first a {
            height: 24px;
            line-height: 24px;
            background: none;
        }

        .left ul li.last a {
            height: 32px;
            background: url(../img/achtergronden/bg-li-left.png) no-repeat 0px 23px;
        }

        .left ul li a:hover {
            background-color: #ECECEC;
        }

        .left ul li a.active {
            background-color: #89e3fd;
            background-image: none;
            color: #fff;
        }

    .left ul ul {
        margin: 0;
    }

        .left ul ul li a, .left ul ul li a:hover {
            color: #3c4e8a;
            font-weight: bold;
            text-decoration: none;
            text-transform: none;
            background: none;
        }

        .left ul ul li.first a {
            padding-top: 5px;
            background: url(../img/achtergronden/bg-li-left.png) no-repeat 0px 0px;
        }

        .left ul ul li.last a {
            height: 25px;
            background: none;
        }

        .left ul ul li a:hover, .left ul ul li a.active {
            background-color: #ECECEC;
            color: #3c4e8a;
        }

.right {

}

    .right table.mini-cart {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 0px;
    }

        .right table.mini-cart td {
            padding: 2px 4px 2px 0;
            text-align: right;
            color: #777777;
        }

            .right table.mini-cart td a, .right table.mini-cart td a:hover {
                color: #777777;
                text-decoration: none;
            }

            .right table.mini-cart td.last, .right table.mini-cart th.last {
                padding-right: 5px;
            }

            .right table.mini-cart td.name {
                text-align: left;
            }

        .right table.mini-cart th {
            text-align: right;
        }

            .right table.mini-cart th a, .right table.mini-cart th a:hover {
                color: #000;
                text-decoration: none;
            }

    .right .vatlink {
        text-align: right;
        line-height: 26px;
        background: url(../img/achtergronden/bg-li-right.png) no-repeat center top;
        margin: 0 0 10px 0;
    }

        .right .vatlink a, .right .vatlink a:hover {
            color: #3c4e8a;
            text-decoration: none;
            padding-right: 5px;
        }

    .right .checkoutlink {
        text-align: right;
        margin: 0 0 10px 0;
    }

    .right .special {
        padding: 0px 5px 10px 5px;
        width: 140px;
        overflow: hidden;
        border-bottom: 1px solid #b2b2b2;
    }

        .right .special, .right .special table {
            font-size: 13px;
            font-family: 'trebuchet ms',verdana,sans-serif;
        }

        .right .special a {
            text-decoration: none;
        }

        .right .special h2 {
            color: #000;
            font-size: 24px;
            font-weight: bold;
            line-height: 30px;
            margin: 0;
            text-transform: none;
            background: none;
        }

        .right .special h3 {
            color: #00AEEF;
            font-size: 14px;
            font-weight: bold;
            line-height: 18px;
            margin: 0;
        }

        .right .special p {
            margin: 4px 0;
        }

        .right .special .prijs-groot, .right .special .prijs-groot a, .right .special .prijs-groot a:hover {
            color: #00AEEF;
            font-size: 24px;
            font-weight: bold;
            line-height: 30px;
            text-decoration: none;
        }

        .right .special .kleine-tekst, .right .special .kleine-tekst a, .right .special .kleine-tekst a:hover {
            color: #000;
            font-size: 9px;
            line-height: 14px;
            text-decoration: none;
            margin: 4px 0;
        }

        .right .special .kleine-tekst-cyaan, .right .special .kleine-tekst-cyaan a, .right .special .kleine-tekst-cyaan a:hover {
            color: #00AEEF;
            font-size: 11px;
            line-height: 14px;
            text-decoration: none;
            margin: 4px 0;
        }

    .right ul {
        margin: 0;
        list-style: none;
        text-align: right;
        padding-bottom: 2px;
        background: url(../img/achtergronden/bg-li-right.png) no-repeat center bottom;
    }

        .right ul li a, .right ul li a:hover {
            background: url(../img/achtergronden/bg-li-right.png) no-repeat 0px 0px;
            color: #272727;
            font-weight: bold;
            text-decoration: none;
            line-height: 23px;
            height: 23px;
            display: block;
            padding-right: 5px;
        }

        .right ul li a:hover {
            color: #272727;
            text-decoration: none;
        }

        .right ul li a.active {
            background-color: #89e3fd;
            background-image: none;
            color: #fff;
        }

        .right ul li.first a {
            height: 24px;
            line-height: 24px;
            background: none;
        }

        .right ul li.last a {
            height: 32px;
        }

        .right ul li a:hover {
            background-color: #ECECEC;
        }

/* Cart, order and customer pages
----------------------------------------------------------------------------------------------------*/

.navcart {
    margin: 0;
    padding: 0 0 20px 0;
}

.navcart ul {
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .navcart ul li {
        float: left;
        width: 157px;
        border-right: 1px solid #ffffff;
        text-transform: uppercase;
    }

        .navcart ul li.last {
            border-right: none;
            width: 156px;
        }

            .navcart ul li a {
                padding-left: 8px;
                display: block;
                height: 24px;
                line-height: 24px;
                background-color: #CCFFFF;
                font-size: 12px;
                font-weight: bold;
                color: #00AEEF;
                color: #000;
                text-decoration: none;
            }

            .navcart ul li a.active, .navcart ul li a:hover {
                color: #ffffff;
                background-color: #00AEEF;
            }


            .login input.login {
                color: #666666;
                width: 76px;
                height: 16px;
                line-height: 16px;
                font-size: 11px;
            }

table.cart {
    width: 100%;
    font-size: 11px;
    border-bottom: 2px solid #00AEEF;
    margin: 6px 0px;
}

    table.cart th.first, table.cart td.first {
        padding-left: 8px;
    }

    table.cart th.right, table.cart td.right {
        text-align: right;
        padding-right: 20px;
    }

    table.cart th {
        font-size: 11px;
        font-weight: bold;
        line-height: 22px;
        height: 22px;
    }

        table.cart tr.head th {
            color: #000;
            background-color: #89E3FD;
        }

    table.cart td {
        border-top: 1px solid #00AEEF;
        padding: 4px 0px 4px 4px;
        vertical-align: middle;
    }

        table.cart td.quant {
            width: 24px;
            padding-left: 6px;
        }

            table.cart td.quant input {
                font-size: 11px;
                width: 24px;
                height: 16px;
            }

        table.cart td.updown {
            width: 14px;
            padding-left: 0;
        }

            table.cart td.updown img {
                float: left;
                padding-top: 1px;
            }

        table.cart td.spacer {
            width: 20px;
        }

        table.cart td.artnr {
            width: 74px;
            font-size: 10px;
        }

        table.cart td.descr {
            padding-bottom: 6px;
        }

            table.cart td.descr a {
                font-weight: bold;
            }

        table.cart td.price {
            width: 64px;
        }

        table.cart td.total {
            width: 64px;
        }

        table.cart td.type {
            width: 8px;
            color: #CC0000;
            font-weight: bold;
            padding-right: 4px;
        }

        table.cart td.delete {
            width: 18px;
            padding-right: 4px;
        }

    table.cart tr.sum th {
        border-top: 1px solid #00AEEF;
        height: 32px;
    }

        table.cart tr.sum th, table.cart tr.btw th, table.cart tr.discount th {
            font-size: 11px;
            font-weight: bold;
        }

    table.cart tr.discount th {
        padding-top: 15px;
        border-top: 2px solid #d6d6d6;
    }

    table.cart th.totalprice {
        font-size: 12px;
    }

    table.cart td.log-radio {
        padding-left: 6px;
        width: 24px;
    }

    table.cart td.log-label {
        width: 350px;
    }

    table.cart td.log-price {
        padding-right: 22px;
        width: 62px;
    }

    table.cart td.pay-radio {
        padding-left: 6px;
        width: 24px;
    }

    table.cart td.pay-label {
        width: 350px;
    }

    table.cart td.pay-price {
        padding-right: 22px;
        width: 62px;
    }

.cart-nav {
    float: right;
    margin: 10px 0 20px 0;
}

    .cart-nav a {
        padding-left: 6px;
    }

.cart-backtoshop {
    float: left;
    margin: 10px 0;
}

table.useraccount {
    font-size: 10px;
    margin-left: 12px;
}

    table.useraccount input {
        font-size: 10px;
    }

table.checkout {
    width: 100%;
    margin-bottom: 10px;
}

    table.checkout th {
        padding-left: 10px;
        font-weight: bold;
    }

    table.checkout td {
        padding: 4px 4px 4px 10px;
    }

    input.checkout, textarea.checkout {
        width: 240px;
        font: 11px/14px tahoma, arial, verdana, sans-serif;
        height: 18px;
        line-height: 18px;
    }

    textarea.checkout {
        height: 50px;
        min-height: 50px;
    }

    input.reference {
        width: 140px;
        font: 11px/14px tahoma, arial, verdana, sans-serif;
        height: 18px;
        line-height: 18px;
    }

td.error {
    background-color: #FFDDDD;
    border: 1px solid #FF0000;
    padding: 20px 10px 10px 10px;
}

table.customer {
    width: 100%;
    margin: 6px;
}

    table.customer input.normal{
        width: 200px;
    }

    table.customer input.small {
        width: 24px;
    }

    table.customer input.medium {
        width: 48px;
    }

    table.customer textarea.normal {
        width: 200px;
        height: 60px;
    }

    table.customer input, table.customer select, table.customer textarea {
        font-size: 11px;
    }

    table.customer span {
        color: #CC0000;
        font-weight: bold;
    }

    .contact-left {
        float: left;
        width: 426px;
        padding: 0 10px 0 4px;
    }

    .contact-right {
        float: left;
        width: 190px;
    }

/* Search page
----------------------------------------------------------------------------------------------------*/

#hide_result {
    display: none;
}

#show_result li.margin {
    list-style-type: none;
    margin-top: 8px;
}