﻿/*
    This css file contains specific styles for embedding the confi into nopCommerce.
    So the common styling in the theme is taken away from the specific new elements, which are needed for embedding the confi.
    The CSS is (must be) included in Shared/Head.cshtml as last CSS file. So overriding is possible.
*/

.flyout-cart {
    width:500px !important;
}

/* In product-grid hide the add-info because of adding lenses only via confi and not directly */
.product-grid .add-info {
    display:none;
}

/* Specific for product-lens-page */
.product-lens-page .overview {
    float:none !important;
    margin: 0 0px;
}

.product-lens-page .short-description {
    margin: 0 0px !important;
}

.product-lens-page .add-to-cart {
    margin: 0 0px !important;
    display:none;
}

.product-lens-page .add-to-wishlist {
    margin: 0 0px !important;
    display:none;
}

.product-lens-page .overview-buttons {
    margin: 0 0px !important;
}

/* InfoBox specific styles*/
.f-left
{
    float: left;
    padding-left:5px;
}

.f-right
{
    float: right;
}

.f-c
{
    clear: both;
}

.bg-pricehighlight
{
    background-color: #f6f6f6;
}

#infoBox h3 span
{
    font-weight: normal;
}
#infoBox .lens-name
{
font-size: 1.1em;
font-weight: 400;
text-decoration: none;
text-indent:1em;
margin-top:7px;
margin-bottom:7px;
}

#infoBox .value-container
{
    background-color: #F5F5F5;
    width: 52px;
    margin-bottom: 0px;
}

#infoBox .value-container div
{
    text-align: center;
}

#infoBox .value-container+.value-container
{
    margin-right: 2px;   
}

#infoBox .value-container div, #infoBox .label-container div
{
    height: 2em;
    line-height: 2em;
}

#infoBox .add-info
{
    margin-bottom: 8px;
    margin-top: 8px; 
    padding: 0px 0px 0px 4px;
}

#infoBox .overview
{
    margin-bottom: 4px;
    margin-top: 0px;
    padding: 4px 0px 2px 4px;
    width:100%;
}
#infoBox .add-info+.add-info
{
    margin-top: 2px;
}

#infoBox .add-info span, #infoBox h3 span
{
    width: 120px;
}

#Price .add-info-price
{
    height: 30px;
    line-height: 30px;
    text-align: right;
    margin-top: 4px;
    margin-right: 7px;
}

#Price .add-info-price .price-val
{
    padding: 5px;
}

#infoBox .m-pic
{
    width: 35px;
    height: 35px !important;
    margin: 10px auto;
}

#infoBox .m-pic-l
{
    background-image: url(../images/glasnavigation-left.png);
}

#infoBox .m-pic-r
{
    background-image: url(../images/glasnavigation-right.png);
}


#infoAdressBox {
    margin-top: 15px;
    padding-top: 5px;
}
#infoAdressBox .add-info {
    margin-bottom: 8px;
    margin-top: 8px;
    padding: 0 0 0 4px;
}
#infoAdressBox .overview {
    margin-bottom: 4px;
    padding: 4px 0 2px 4px;
}
#infoAdressBox .add-info + .add-info {
    margin-top: 2px;
}
#infoAdressBox .add-info span, #infoAdressBox h3 span {
    width: 120px;
}
#infoAdressBox h3 span {
    font-weight: normal;
}