/*
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 : 18-mei-2018, 13:06:05
    Author     : martijn
*/

@media only screen and (max-width: 1024px) and (min-width: 768px) {
    /* GENERAL */
    #header #mainmenu .menu { padding-left: 0; }
        #header #mainmenu .menu .menu-item { margin-left: 15px; }
        #header #mainmenu .menu .menu-item:first-of-type { margin-left: 0 }
    .title-wrapper { width: 100%; } 
        
}
@media only screen and (max-device-width: 568px) and (min-device-width: 320px) {
    
    /* GENERAL */
    #header { background-color: white; }
    #logo .logo-icon { height: 80%; }
    #logo .logo-text { height: 30px; }
    .error-v { width: 100%; }
    .title-wrapper { width: 100%; }
    
    /* FAQ */
    #transparent-canvas,
    #transparent-canvas .column-group,
    #transparent-canvas .columns-2 .column,
    #contact-form-faq { width: 100%; }
    #transparent-canvas .column-group { margin-left: 0 }
    #transparent-canvas .column { margin-right: 0 }
    .ufaq-faq-title-text { width: 82%; }
    #contact-form-faq { padding: 5% 0; }
    .form-title-faq { 
        margin-right: 20px;
        margin-left: 20px;
    }
    
    /* CONTACT */
    #contact-form { 
        width: 90%;
        padding: 5% 0;
        margin-right: 5%;
        margin-left: 5%;
    }
        #contact-form .color-moss { padding: 0 5%; }
        #contact-button { float: none }
    
    /* HOMEPAGE */
    .codes-page { margin-top: 30px; }
    .home #step-nav .nav { width: 100%; }
    
    /* STAP 2 */
    div.center1120.mobile-previews { margin-bottom: 0 }
    .stap-2 .columns { 
        margin-bottom: 0;
        overflow: hidden;
    }
    .stap-2 .columns .preview {
        background-image: none;
    }
        .stap-2 .columns .preview .img-wrap {
            width: 100%;
            height: 100%;
        }
        .stap-2 .columns .preview .img-remove { 
            width: 100%;
            height: 40px;
        }
        .stap-2 .columns #codeadd { width: 100%; }
        .stap-2 .entry-content h2 {
            padding: 2px 20px;
            border-radius: 40px;
            background-color: rgba(255,255,255,.75);
        }
        .stap-2 .entry-content h2 .title-wrapper {
            padding: 0;
            background-color: transparent;
            border-radius: 0;
        }
    .div-horizontal-center { width: 75%; }
    #product-tabs-wrap { 
        top: 0;
        padding: 0;
        background-image: none;
    }
    .product-type-title { padding: 0 15px; }
    .product .product-view { padding-bottom: 60px; }
    .product-price,
    .product .wrap { 
        position: absolute;
        width: 50%;
        height: 50px;
    }
    .product .wrap { padding: 0; }
        .product .wrap .product-quantity {
            width: 100%;
            padding: 0;
            margin: 0;
        }
        .product .wrap .button,
        .product .wrap .quantity {
            float: none;
            margin: 0;
            margin-top: 7px;
            vertical-align: top;
        }
        .product .wrap .button {
            padding-top: 0;            
            font-size: 22px;
            line-height: 35px;
        }
        .product .wrap .button.minus,
        .product-quantity div.button.minus { 
            margin-right: -2px;
            margin-left: 0;
        }
        .product .wrap .button.plus,
        .product-quantity div.button.plus { 
            margin-right: 0;
            margin-left: -2px;
        }
        .product .wrap .quantity .qty { border-radius: 0 }
        
    /* CART */
    .woocommerce-cart a.button-ak { 
        max-width: 100vw;
        width: auto;
    }
        .woocommerce input.button span, 
        .woocommerce-checkout input.button span, 
        .woocommerce-cart input.button span, 
        .woocommerce button.button span,
        .woocommerce div.button span,
        .woocommerce-checkout button.button span,
        .woocommerce-cart button.button span,
        .woocommerce a.button-update span,
        .woocommerce-checkout a.button-update span,
        .woocommerce-cart a.button-update span,
        .woocommerce a.button-ak span,
        .woocommerce-checkout a.button-ak span,
        .woocommerce-cart a.button-ak span { float: right !important; }
    .entry-content .woocommerce { 
        width: 100vw;
        padding-right: 5%;
        padding-left: 5%;
    }
        .entry-content .woocommerce .center1120 { padding: 0 }
    .woocommerce table.shop_table tr { padding-top: 0 }
    .woocommerce table.shop_table_responsive tr td, 
    .woocommerce-page table.shop_table_responsive tr td {
        display: table-cell;
        float: none;
        height: auto;
        padding: 5%;
    }
        .woocommerce table.shop_table_responsive tr td::before, 
        .woocommerce-page table.shop_table_responsive tr td::before { display: none; }
    .photo-m,
    .cart-item-description { display: none; }
    form.woocommerce-cart-form table.center1120 { padding: 0 }
    .woocommerce table.shop_table td.product-remove { 
        display: block;
        float: left;
        width: 20%;
        text-align: center;
    }
        .woocommerce a.remove { 
            float: none;
            text-align: center;
        }
        .cart-item-title,
        .variation .ts-options-table { margin-left: 0 }
        .cart-item-title { 
            text-align: left;
            margin-bottom: 5%;
        }
        .woocommerce-cart table.shop_table .product-quantity .button { 
            width: 35px;
            padding-top: 7px;
            margin-top: 11px;
            margin-right: 0;
        }
        .woocommerce-cart table.shop_table .product-quantity .quantity { 
            margin-top: 11px;
            margin-right: 0;
        }
        .woocommerce table.shop_table_responsive tr:nth-child(2n) td,
        .woocommerce-page table.shop_table_responsive tr:nth-child(2n) td { background-color: transparent; }
        .woocommerce-cart table.shop_table td.product-quantity,
        .woocommerce-cart table.shop_table td.product-subtotal { background-color: #f7f6f7 !important; }
    .woocommerce table.shop_table td.actions,
    .woocommerce-checkout table.shop_table td.actions, 
    .woocommerce-cart table.shop_table td.actions { padding-bottom: 0 !important }
    .woocommerce .cart-collaterals div.button.pay { width: auto; }
    .woocommerce-cart a.button-ak.previous span { float: none !important }
        .woocommerce-cart a.button-ak.previous .icon { color: white;}
    .woocommerce table.shop_table .order_item td { 
        display: table-cell !important;
        padding: 5% 0;
        height: auto;
    }
        .woocommerce table.shop_table .order_item td.product-name,
        .woocommerce table.shop_table .order_item td.product-total {
            width: auto;
            float: none;
        }
            .woocommerce table.shop_table .order_item td.product-name p { display: none }
    .product-name__title,
    .woocommerce .woocommerce-order table.order_details td.product-quantity,
    .woocommerce .woocommerce-order table.order_details td.product-total { font-size: 18px }
    .woocommerce .woocommerce-order table.order_details tfoot th { vertical-align: top }
    .woocommerce .woocommerce-order table.order_details tfoot td { height: auto }
        
    /* CHECKOUT */
/*    #order_summary { display: none; }*/
    .woocommerce-checkout form.woocommerce-checkout { padding: 5%; }
    .order_item_line,
    .order_summary_underline_products,
    .order_summary_underline_totals { 
        width: 100%;
        padding-left: 0;
    }
    .woocommerce form #payment .form-row.place-order,
    .woocommerce-checkout form #payment .form-row.place-order,
    .woocommerce-cart form #payment .form-row.place-order { 
        padding: 0 !important;
        margin-bottom: 0;
    }
    .woocommerce #payment #place_order,
    .woocommerce-page #payment #place_order { 
        margin-top: 5%;
        margin-bottom: 0;
    }
    
    /* ORDER */
    .woocommerce-order .center1120 { 
        width: 100%;
        padding-right: 5% !important;
        padding-left: 5% !important;
    }
    .woocommerce-order ul.order_details { 
        padding-top: 5%;
        margin-bottom: 0;
    }
        .woocommerce-order ul.order_details li { 
            width: 45%;
            margin-bottom: 5%;
            border-right: 0;
        }
    .order_item_name { 
        width: 45%;
        padding-right: 5%;
        margin-left: 0;
    }
        .order_item_name .amount { display: none; }
    .order_item_quantity,
    .order_item_subtotal { 
        width: 25%;
        margin-left: 0;
    }
    .order_item_subtotal { text-align: right; }
    .order_items_text_left {
        padding-left: 0;
        word-break: break-word;
    }
    .order_summary_underline_totals { float: none; }
    .order_item_line.order_totals_line .order_item_name { display: none; }
    .order_item_line.order_totals_line .order_item_quantity { 
        width: 75%;
        text-align: right;
    }
}