/* base.css: Styles shared by most themes */

body {
    margin: 0;
    padding: 0;
    font-size: 0.75em;          /* 12px / 16px */
    line-height: 1.5;
}

a img {
    border:none;
}

table {
    font-size: 1em;
}

.page {
    margin: 0 auto;
    overflow: hidden;
}

.header {
    position: relative;
}

.content-wrapper {
    overflow: hidden;
}

#content {
    float: left;
    overflow: hidden;
}

#content .box table {
    border-collapse: collapse;
    width: 100%;
}

/* Common */

.price .original {
    text-decoration: line-through;
}

.mandatory-symbol {
    color: red;
}

.mandatory-description {
    color: red;
}

.figure {
    text-align: center;
}

.figure img {
    max-width: 100%;
}

.button, input[type="submit"] {
    border: 0;
    cursor: pointer;
}

/* Icons */

.icon {
    background: url(../img/icons.png);
    border: 0;
    color: transparent;
    display: inline-block;
    height: 16px;
    margin-right: 0.5em;
    overflow: hidden;
    position: relative;
    top: 3px;
    width: 16px;
}

.box-icon {
    background-position: -112px 0;
}

.email-icon {
    background-position: 0 -32px;
}

.error-icon {
    background-position: -16px -32px;
}

.help-icon {
    background-position: -16px -80px;
    margin: 0;
    position: static;
}

.house-icon {
    background-position: -48px -32px;
}

.info-icon {
    background-position: -64px -32px;
}

.remove-icon {
    background-position: -112px -64px;
    cursor: pointer;
    margin: 0;
    position: static;
}

.refresh-icon {
    background-position: -80px -48px;
    cursor: pointer;
    margin: 0;
    position: static;
}

.success-icon {
    background-position: 0 0;
}

.user-icon {
    background-position: -80px -64px;
}

/* Messages */

.errorBox {
    background: #fef1ec;
    border: 1px solid #cd0a0a;
    color: #cd0a0a;
    margin: 0 0 10px 0;
    padding: 10px;
}

.errorBox a {
    color: #cd0a0a;
    font-weight: bold;
    text-decoration: underline;
}

.errorBox ul {
    list-style-type: none;
}

.successBox {
    background: #dbfdd9;
    border: 1px solid #090;
    color: #060;
    margin: 10px auto 10px auto;
    padding: 10px;
    width: 90%;
}

.infoBox {
    background: #BDE5F8;
    border: 1px solid;
    color: #00529B;
    padding: 5px;
    width: 90%;
}

.infoBox span {
    background: url(../../../../img/icons/info.png) no-repeat top left;
    padding: 1px 0 3px 20px;
}

.cartMessage {
    width: 250px;
    float: left;
}

/* Category menu */

.hitarea {
    background: url(../img/plus-minus.png) no-repeat;
    cursor: pointer;
    float: left;
    height: 9px;
    width: 9px;
    margin: 0.25em 0 0 -1.25em;
}

.open > .hitarea {
    background-position: 0 -9px;
}

/* Subcategories */

.subcategory {
    float: left;
    margin: 0 2% 2% 0;
    width: 100px;
}

.subcategory .image-wrapper {
    display: block;
    height: 100px;
    width: 100px;
    text-align: center;
}

.subcategory .name {
    height: 2.4em;
    line-height: 1.2em;
    text-align: center;
}

/* Product boxes */

.product-box {
    float: left;
    overflow: hidden;
}

.product-box .figure {
    overflow: hidden;
    height: 95px;
}

.product-box .name {
    display: block;
    height: 3.75em;
    line-height: 1.25em;
    overflow: hidden;
    padding: 5% 0 0;
}

.first-in-row .product-box {
    /* the first product-box in its row */
    margin-left: 0;
}

.stock-level .indicator {
    background: url(../img/stock.png) no-repeat;
    display: inline-block;
    height: 10px;
    width: 10px;
}

.out-of-stock .indicator {
    background-position: 0 -10px;
}

/* Product page */

.product-header,
.infoBox {
    overflow: hidden;
}

.product-page .images {
    float: left;
    overflow: hidden;
}

.product-page .thumbnails img {
    cursor: pointer;
}

.product-page .info {
    float: right;
}

.product-page .info h1 {
    margin: 0 0 0.5em 0;
    padding: 0;
}

/* Misc. */

.vat-picker label {
    cursor: pointer;
}
/* ===== Growl notifications ===== */

div.jGrowl { z-index: 9999; color: #fff; font-size: 12px; }
div.ie6.top-right { 
	right: 				auto;
	bottom: 			auto;
	left: 				expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
	top: 				expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}

div.ie6.top-left {
	left: 				expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
	top: 				expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}

div.ie6.bottom-right {
	left: 				expression( ( 0 - jGrowl.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
	top: 				expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}

div.ie6.bottom-left {
	left: 				expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
	top: 				expression( ( 0 - jGrowl.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}

div.ie6.center {
	left: 				expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
	top: 				expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
	width: 				100%;
}

/** Normal Style Positions **/
div.jGrowl { position: absolute; }
body > div.jGrowl { position: fixed; }
div.jGrowl.top-left { left: 0px; top: 0px; }
div.jGrowl.top-right { right: 0px; top: 36px; }
div.jGrowl.bottom-left { left: 0px; bottom: 0px; }
div.jGrowl.bottom-right { right: 0px; bottom: 0px; }
div.jGrowl.center { top: 0px; width: 50%; left: 25%; }

/** Cross Browser Styling **/
div.center div.jGrowl-notification, div.center div.jGrowl-closer { margin-left: auto; margin-right: auto; }
div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer {
background-color: #263138;
border:1px solid #FFDB1F;
opacity: .85;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
zoom: 1;
width: 235px;
padding: 10px;
margin-top: 5px;
margin-bottom: 5px;
font-family: Tahoma,Arial,Helvetica,sans-serif;
font-size: 1em;
text-align: left;
display: none;
}

div.jGrowl div.jGrowl-notification { min-height: 40px; }
div.jGrowl div.jGrowl-notification, div.jGrowl div.jGrowl-closer { margin: 10px; }
div.jGrowl div.jGrowl-notification div.jGrowl-header { font-weight: bold; font-size: .85em; }
div.jGrowl div.jGrowl-notification div.jGrowl-close { z-index: 99; float: right; font-weight: bold; font-size: 1em; cursor: pointer; }
div.jGrowl div.jGrowl-closer { padding-top: 4px; padding-bottom: 4px; cursor: pointer; font-size: .9em; font-weight: bold; text-align: center; }

/** Hide jGrowl when printing **/
@media print { div.jGrowl { display: none; } }

.inactive_input {
    background: #DDD;
}

#paymentOptions ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.price .original {
    color: black;
}

.price .reduced {
    color: red;
    font-weight: bold;
}

.products .image {
    width: 10%;
}

.products .name {
    width: 30%;
}

.products .item-price {
    width: 20%;
}

.products .amount {
    width: 10%;
}

.products .item-total {
    width: 20%;
    text-align: right;
}

.products .remove {
    width: 10%;
}

.bonus-offer-image {
    width: 15%;
}

.bonus-offer-price {
    width: 20%;
    padding-right: 10px;
    text-align: right;
}

.bonus-offer-price .original, .bonus-offer-price .reduced {
    display: block;
    float: left;
    width: 50%;
}

.bonus-offer-price .original {
    text-align: right;
}

.bonus-offer-price .reduced {
    text-align: left;
}

.bonus-wrapper {
    margin: 5px 0 10px 0;
}

.ui-effects-transfer {
    border: 1px solid #000;
    z-index: 100;
}