﻿@import url('/Library/Css/grid.css');
@import url('/Library/Css/Form.css');

/* xhtml tags */

/* body */

html 
{
    height: 100%;
    overflow-y: scroll;
}

body, body.transparent
{
    background-color:#fbb000;
    font-family:'Lucida Sans Unicode', Arial;
    font-size:13px;
    color:#2e2e2e;
    margin:0px 0px 0px 0px;
    padding:0px;
    line-height:18px;
}

body.transparent
{
    background-color:transparent;
}

body.consent {
    background: #2e2e2e;
    height: 100%;
}

    body.consent p {
        color: #fff;
    }

    body.consent a:not(.button) {
        color: #fbb000;
    }

    /* headers */
    h1, h2, h3, h4 {
        font-family: 'EB Garamond', serif;
        margin: 0px;
        color: #2e2e2e;
        font-size: 36px;
        font-weight: normal;
        line-height: normal;
    }

h1, h2
{
    color:#2e2e2e;
}

    h1.action {
        background-image:url('/images/icon-action.png');
        background-repeat:no-repeat;
        padding-left:50px;
    }

    h1.bottles {
        background-image:url('/images/icon-bottles.png');
        background-repeat:no-repeat;
        padding-left:36px;
    }

    h1.envelope {
        background-image:url('/images/icon-envelope.png');
        background-repeat:no-repeat;
        background-position-y:7px;
        padding-left:50px;
    }

h2
{
    font-size:32px;  
    margin-bottom:5px;
}

    h2.shopping-cart {
        color:#ffffff;
        background-image:url('/images/icon-shopping-cart.png');
        background-repeat:no-repeat;
        padding-left:140px;
        padding-top:10px;
        height:110px;
    }

#teaser h1 {
    color:#ffffff;
}

h3 {
    font-size:25px;
    margin-bottom:5px;
}

.product-details h3 {
    margin-top:-10px;
}

h4,
h5 {
    color:#f0a800;
    font-size:22px;
    margin:0px 0px 20px 0px;
    padding:0px;
}

h5 {
    font-size:16px;
    margin:5px 0px 5px 0px;
}

/* hyperlinks */

a {
    color:#222222;
}

a img {
    border:none;
}

/* header */

#header
{
    background-image:url('/images/bg-header.jpg');
    background-repeat:repeat-x;
    text-align:center;
    color:#ffffff;
}

    #header #service-links {
        margin-top:10px;
        width:960px;
        text-align:right;
        color:#ffffff;
        position:absolute;
    }

    #header #service-links a {
        color:#ffffff;
    }

    #header #service-links a:hover {
        color:#fbb000;
    }

#logo {
    padding:40px 0px 0px 0px;
}

/* menu */

#menu
{
    border-right:solid 1px #A9A5C3;
    border-left:solid 1px #A9A5C3;
    border-bottom:solid 1px #A9A5C3;
    padding:6px 0px 6px 0px;
    overflow:hidden;
}

#menu a
{
    padding:8px 10px 8px 10px;
}

#menu a:hover
{
    background-color: #A9A5C3;
    color:#262564;
}

/* teaser & footer */

#teaser,
#footer {
    overflow:hidden;
    padding:20px;
    text-align:center;
}

#sections {
    background-color:#ffffff;
    overflow:hidden;
}

#teaser div,
#footer div {
    margin:auto;
}

#footer {
    text-align:left;
}

/* hidden */

.hidden
{
    display:none;
}

/* highlight */

.highlight
{
    background-color:#eeeeee;
}

.highlight.yellow
{
    background-image:url('/images/bg-highlight-yellow.jpg');
    background-repeat:repeat-x;
    background-color:#ffc600;
    color:#595959;
}

/* seperator */

.h-seperator
{
    border-top:dashed 1px #333333;
    display:block;
    height:1px;
}

/* popup */

.popup {
    position: absolute;
    padding: 16px;
    font-weight: bold;
    z-index: 9999;
    margin: auto;
    width: auto;
    display: none;
    background-color: #ffffff;
}

.modal
{
    position:absolute;
	display:none;
	margin:auto;
	background-color:#000000;
	color:#ffffff;
	height:auto;
	z-index:9000;
}

/* tooltip */

.tooltip
{
    position:absolute;
	padding:5px;
	z-index:9999;
	margin:auto;
	width:auto;
	display:none;
}

.tooltip-message
{
	padding:10px;
	font-weight:bold;
	background-color:#d9dbc4;
	line-height:20px;
}

/* masterpage */

/* header */

.header
{
    margin-top:0px;
}

.logo
{
    margin-top:15px;
}

/* menu */

#product-groups
{
	margin-top:30px;
}

/* content */

#product-finder-shoppingcart,
#productlist {
    margin-top:10px;
}

#product-categories-shoppingcart {
    padding:20px 0px 20px 0px;
    border-bottom:solid 1px #c7c7c7;
    overflow:hidden;
}

    #shoppingcart {
        font-size:18px;
        float:right;
    }

        #shoppingcart a.cart {
            background-image:url('/images/icon-shopping-cart-small.png');
            background-repeat:no-repeat;
            background-position: left 1px;
            padding:0px 0px 0px 30px;
            text-decoration:none;
        }

.products {
    width:220px;
    margin-bottom:20px;
}

.product-specification {
    padding-bottom:30px;
}

/* breadcrumb */

.breadcrumb
{
    clear:both;
    color:#999999;
}

.breadcrumb a.active
{
    color:#0070bb;
    font-weight:bold;
    text-decoration:none;
}

/* miscellaneous */

.bold
{
    font-weight:bold;
}

.info
{
    background-color:#9ca66b;
    padding:2px 5px 2px 5px;
}

/* ul */

ul
{
    margin:0px 0px 0px 0px;
    padding:0px;
    list-style-position:outside;
    list-style:none;
}

ul li
{
    background-image:url('/images/ul-bullet-gray.gif');
    background-position-y:4px;
    background-repeat:no-repeat;
    padding:0px 0px 0px 20px;
}

#product-groups ul.main-menu {
    margin:0px 0px 0px 0px;
    padding:0px;
    list-style-position:outside;
    list-style:none;
}

    #product-groups ul.main-menu li,
    #product-groups ul.main-menu li.active {
        float:left;
        font-size:24px;
        padding:0px 20px 0px 0px;
        background-image:none;
    }

        #product-groups ul.main-menu li a {
            color:#ffffff;
            text-decoration:none;
        }

        #product-groups ul.main-menu li.active {
            float:left;
            padding:0px 20px 0px 20px;
            background-image:url('/images/icon-arrow-right.png');
            background-repeat:no-repeat;
            background-position: left 1px;
        }

        #product-groups ul.main-menu li.active a {
            color:#222222;
            text-decoration:none;
        }

#product-categories-shoppingcart ul.sub-menu {
    margin:0px 0px 0px 0px;
    padding:0px;
    list-style-position:outside;
    list-style:none;
}
    
    #product-categories-shoppingcart ul.sub-menu li,
    #product-categories-shoppingcart ul.sub-menu li.active {
        float:left;
        font-size:18px;
        padding:0px 20px 0px 0px;
        background-image:none;
        color:#222222;
    }

        #product-categories-shoppingcart ul.sub-menu li a {
            text-decoration:none;
        }

        #product-categories-shoppingcart ul.sub-menu li.active {
            float:left;
            padding:0px 20px 0px 20px;
            background-image:url('/images/icon-arrow-right.png');
            background-repeat:no-repeat;
            background-position: left 1px;
            color:#222222;
        }

#product-finder {
    width:940px;
}

#product-finder ul.alphabet {
    margin:0px 0px 0px 0px;
    padding:0px;
    list-style-position:outside;
    list-style:none;
}

    #product-finder ul.alphabet li,
    #product-finder ul.alphabet li.active {
        float:left;
        font-size:14px;
        padding:0px 5px 0px 5px;
        background-image:none;
    }

        #product-finder ul.alphabet li.active {
             font-weight:bold;
        }

.product-short-details {
    border:solid 1px #cccccc;
    padding:20px;
    width:418px;
}

    .product-short-details .product-image {
        border:none;
        padding:0px;
    }

    .product-short-details .product-image img {
        width:140px;
        border:none;
    }

    .product-short-details .product-details {
        width:255px;
    }

.product-image {
    border:solid 1px #cccccc;
    padding:20px;
    overflow:visible;
}

/* tables */

table
{
    width:100%;
    border-spacing:0px;
}

table thead
{
    background-color:#ffffff;
    color:#121212;
}

    table thead td
    {
        text-align:left;
        padding:0px 10px 10px 10px;
        border-bottom:none;
        height:28px;
    }

table tbody
{
    background-color:#cccccc;
    border-bottom:none;
}

    table tbody td
    {
        text-align:left;
        padding:10px;
        border-bottom:solid 1px #bbbbbb;
        height:28px;
    }

table tfoot {
    background-color:#ffffff;
    color:#121212;
}

    table tfoot td
    {
        text-align:left;
        padding:10px;
        color:#121212;
        font-weight:bold;
        border-bottom:none;
        height:28px;
    }

/* tabs */

.tabcontainer
{
    overflow:hidden;
}

.tabnavigation
{
    padding:10px 10px 0px 10px;
    display:block;
    background-color:#9ecfff;
    overflow:hidden;
    margin-bottom:10px;
}

.tabnavigation a,
.tabnavigation a:hover
{
    font-weight:bold;
    text-decoration:none;
    float:left;
    color:#ffffff;
    background-color:#00aeef;
    padding:10px;
    margin-right:1px;
    border-radius:5px 5px 0px 0px;
}

.tabnavigation a:hover
{
    color:#888888;
    background-color:#ffffff;
}

.tabnavigation a.active
{   
    color:#00aeef;
    background-color:#ffffff;
    background-image:url('/Images/active-arrow-menu.png');
    background-position:bottom center;
    background-repeat:no-repeat;
}

.tabcontainer .tabcontent
{
    display:none;
}

/* consent */

/* consent */

#consent-container-modal {
    display: flex;
    position: fixed;
    align-items: center;
    justify-content: center;
    background-color: #000;
    opacity: 0.5;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 8;
}

#consent-container-content {
    width: 100%;
    height: 100%;
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    z-index: 10;
    flex-direction: column;
}

.consent {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff;
    padding: 16px;
    width: 100%;
    box-sizing: border-box;
}

.consent > p.cookies {
    font-size: 12px;
    color: #A9A5C3;
    text-align: center;
}

/* button container */

.button-container > a:first-of-type {
    margin: 0 16px 0 0;
}