/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 22/12/2014, 5:43:07 PM
    Updated Flex on : 28/03/2017 - DJC
    Author     : duncanc
*/

/*.woocommerce .products,
.woocommerce .product,*/
.woocommerce .related.products {
    clear: both;
    float: left;
    width: 100%;
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

/*Woo-cart*/
@media screen and (max-width: 768px) { 

    .woocommerce table.shop_table,
    .woocommerce table.shop_table tr,
    .woocommerce table.shop_table tbody,
    .woocommerce-page table.shop_table th,
    .woocommerce-page table.shop_table td {
        display: block;
        border: none;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        max-width: 100%;
    }


    .woocommerce table.shop_table thead {
        display: none;
    }

    .shop_table.cart tr.cart_item{
        box-shadow: 0 0 3px rgba(0,0,0,0.33);
        border:1px solid #f0f0f0;
        margin: 15px 0;
        border-radius: 5px;
    }

    .woocommerce #content table.cart .product-thumbnail, .woocommerce table.cart .product-thumbnail, .woocommerce-page #content table.cart .product-thumbnail, .woocommerce-page table.cart .product-thumbnail {
        display: block;
    }

    .shop_table.cart td.product-thumbnail a {
        display: block;
    }

    .woocommerce #content table.cart img, .woocommerce table.cart img, .woocommerce-page #content table.cart img, .woocommerce-page table.cart img {
        width: 50%;
        max-width: 100%;
        display: block;
    }

    .shop_table.cart td.product-name::before {
        content: 'Item: ';
        display: block;
        font-weight: bold;
    }

    .shop_table.cart td.product-price::before {
        content: 'Price: ';
        display: inline-block;
        font-weight: bold;
    }


    .shop_table.cart td.product-quantity::before {
        content: 'Qty: ';
        display: inline-block;
        font-weight: bold;
    }

    .shop_table.cart td.product-subtotal::before {
        content: 'Subtotal: ';
        display: inline-block;
        font-weight: bold;
    }

    .woocommerce #content table.cart td.actions .button, .woocommerce #content table.cart td.actions .input-text, .woocommerce #content table.cart td.actions input, .woocommerce table.cart td.actions .button, .woocommerce table.cart td.actions .input-text, .woocommerce table.cart td.actions input, .woocommerce-page #content table.cart td.actions .button, .woocommerce-page #content table.cart td.actions .input-text, .woocommerce-page #content table.cart td.actions input, .woocommerce-page table.cart td.actions .button, .woocommerce-page table.cart td.actions .input-text, .woocommerce-page table.cart td.actions input {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        margin: 0 auto 15px;
    }



    /*.woocommerce .cart-collaterals .cart_totals*/

    .woocommerce .cart-collaterals .cart_totals {
        box-shadow: 0 0 3px rgba(0,0,0,0.33);
        padding: 1ex;
        margin: 15px auto 0;
        border-radius: 5px;
    }

    .woocommerce .cart-collaterals .cart_totals th { 
        display: none;
    }

    .woocommerce .cart-collaterals .cart-subtotal td::before { 
        content: 'Subtotal: ';
        display: inline-block;
        font-weight: bold;
    }

    .woocommerce .cart-collaterals .shipping td::before { 
        content: 'Shipping: ';
        display: inline-block;
        font-weight: bold;
    }

    .woocommerce .cart-collaterals .order-total td::before { 
        content: 'Order Total: ';
        display: inline-block;
        font-weight: bold;
    }

    .woocommerce .cart-collaterals .cart_totals table, 
    .woocommerce .cart-collaterals .cart_totals tbody, 
    .woocommerce .cart-collaterals .cart_totals tr, 
    .woocommerce .cart-collaterals .cart_totals td { 
        width: 100%;
        display: block;
    }
    .woocommerce .cart-collaterals .cart_totals td span { 
        display: inline-block;
        margin-left: 1ex;
    }

    .woocommerce ul.products li.product h3, .woocommerce-page ul.products li.product h3 {
        padding: 1ex;
    }
    .related.products h2 {
        text-align: center;
        display: block;
        width: 100%;
    }
}

/*
* ------------------------------------------------------------------------------
* 
* Woocommerce Product Grid
* 
* ------------------------------------------------------------------------------
*/

.woocommerce .products ul:after,
.woocommerce .products ul:before,
.woocommerce ul.products:after,
.woocommerce ul.products:before {
    content: '';
    display: inline;
}

.woocommerce .content-main  {
    box-shadow: 0 0 3px rgba(0,0,0,0.15);
    background-color: #fff;
        padding: 15px 30px;
}

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: transparent;
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 80%;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background-color: #fff;
    text-align: center;
}

.woocommerce ul.products li.product a {
    float: left;
    width: 100%;
}

.woocommerce ul.products li.product a > img {
    width: auto;
    max-height: 150px;
    margin: 30px auto;
}



.woocommerce ul.products {
    width: 100%;
    display: block;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -ms-flex-wrap: wrap;
    -ms-flex-direction: row;

    -ms-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}


.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 100%;
    margin: 0;
    background-color: #fff;
    box-shadow: 0 0 3px rgba(0,0,0,0.15);

    display: inline-block;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -ms-flex-wrap: nowrap;
    -ms-flex-direction: column;
    -ms-flex-flow: column nowrap;
    -moz-flex-flow: column nowrap;
    -webkit-flex-flow: column nowrap;
    flex-flow: column nowrap;

    -ms-flex-align: stretch;
    -o-align-items: stretch;
    -ms-align-items: stretch;
    -moz-align-items: stretch;
    -webkit-align-items: stretch;
    align-items: stretch;
    -ms-flex-align: stretch;
    -o-align-content: stretch;
    -ms-align-content: stretch;
    -moz-align-content: stretch;
    -webkit-align-content: stretch;
    align-content: stretch;
    
}

.woocommerce ul.products li.product>.woocommerce-LoopProduct-link, 
.woocommerce-page ul.products li.product>.woocommerce-LoopProduct-link {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-box-flex: 1;
    -moz-flex: 1 1 auto;
    -webkit-flex: 1 1 auto;
    /* -ms-flex: 1 1 100%; */
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

@media screen and (min-width: 480px) {
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product {
        width: 50%;
    }
}

@media screen and (min-width: 992px) {
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product {
        width: 33.3334%;
        width: calc(33.3334%);
    }
}


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

.woocommerce ul.products li.product h3 {
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-left: 15px;
    padding-right: 15px;
}

.woocommerce ul.products li.product .button {
    text-transform: uppercase;
    font-size: 80%;    
    padding: 10px 15px;
    letter-spacing: 1px;
}

.woocommerce #respond input#submit, 
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    color: #fff;
    background-color: #396;
    border-radius: 0;
}

.woocommerce #respond input#submit:hover, 
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    color: #fff;
    background-color: #111;
}

/*
* ----------------------------------------
* No FlexBox - ie9
* ----------------------------------------
*/

.no-flexbox .woocommerce ul.products li.first {clear: none;}

.no-flexbox .woocommerce ul.products li.product {
    height: 300px;
    min-height: 350px;
    padding-bottom: 50px;
}

.no-flexbox .woocommerce ul.products li.product .button {
    position: absolute;
    top: auto;
    left: 0;
    right: 0;
    width: auto;
    bottom: 0;
}