/*
 * Table Product Listing
 * http://impleCode.com
 *
 * Copyright 2015 impleCode
 * Free to use under the GPLv3 license.
 * http://www.gnu.org/licenses/gpl-3.0.html
 *
 * Contributing author: Norbert Dreszer
 */

.table-listing-element.table, .table-listing-element.table-row {
    width: 100%;
    margin: 0;
    margin-top: 20px;
}

.table-listing-element.table-row > div{
    min-width: 50px;
}
.table-listing-element.table-row > div.product-price {
    min-width: 100px;
}
.table-listing-element.table-row > div.product-button{
    min-width: 193px;
}
.table-listing-element.table-row select {
    width: auto;
    margin-bottom: 0;
}

.table-listing-element.table-row .product-image {
    max-width: 100px;
}
.table-listing-element h3.product-name, .table-listing-element > div {
    margin: 0;
    padding: 10px;
    font-size: 1em;
    font-weight: normal;
    line-height: 1.2;
}

.table-listing-element h3.product-name > a {
    font-size: 1.4em;
}

.table-listing-element img {
    max-width: 100%;
}


.table-listing td {
    vertical-align:top;
}

#shopping-cart-container table.cart-products th.name-head,
#shopping-cart-container table.cart-products td.product-name,
#shopping-cart-submit-container table.cart-products th.name-head,
#shopping-cart-submit-container table.cart-products td.product-name {
    text-align: left;
}

#shopping-cart-container table.cart-products td.product-name,
#shopping-cart-container table.cart-products td,
#shopping-cart-submit-container table.cart-products td {
    vertical-align: middle;
}

.table-listing-element .add_to_cart_form_container .cart-added-info {
    font-size: 1em;
}

@media (max-width: 700px) {
    .responsive .table-listing-content .table-cell, .responsive.table-listing .table-cell {
        display: block;
        width: 100%;
    }
    .responsive.table-listing.table-description .product-image.table-cell, .responsive.table-listing.table-description .product-name.table-cell {
        display: inline-block;
        width: auto;
    }
    .responsive.table-listing.table-description .product-image.table-cell {
        max-width: 20%;
        min-width: auto;
    }
    .responsive.table-listing.table-description .product-name.table-cell {
        max-width: 80%;
    }

    .responsive.table-listing .table-header, .responsive.table-listing .product-variation, .responsive.table-listing .product-price, .responsive.table-listing .product-button {
        display: none;
    }
}