/**************************************************************************************************
1. useraccount.inc.php
**************************************************************************************************/
/**************************************************************************************************
    1.1 Main Container Layers
**************************************************************************************************/
/*
 *
 * Collection Of Block Wrappers
 * Inherit and change these layouts to change the sizes of the blocks.
 * Default: Left - 25% | Right - 25%
 *
 */

.responsive_wrappers {
    position: relative;
    float: left;
    margin-bottom: 10px;
}

#user_account_layer .responsive_wrapper_1 {width: 25%;}
#user_account_layer .responsive_wrapper_2 {width: 75%;}

#post_order_shipping_layer .responsive_wrapper_1 {float: left; margin-bottom: 20px; width: 50%;}
#post_order_shipping_layer .responsive_wrapper_2 {float: right; margin-bottom: 20px; width: 48%;}

#post_order_payment_method_layer .responsive_wrapper_1 {float: left; margin-bottom: 20px; width: 50%;}
#post_order_payment_method_layer .responsive_wrapper_2 {float: right; margin-bottom: 20px; width: 48%;}

#post_order_shipping_layer .responsive_wrapper_1, #post_order_payment_method_layer .responsive_wrapper_1,
#post_order_shipping_layer .responsive_wrapper_2, #post_order_payment_method_layer .responsive_wrapper_2 {
    border: 1px solid #C6C5C5;
    padding: 20px;
    height: auto;
}

#post_order_shipping_layer .title,
#registration_layer .title,
#forgot_password_layer .title {
    font-size: 21px;
    line-height: 22px;
    font-weight: 400;
    text-transform: capitalize;
    margin: 0px 0px 10px;
    border-bottom: 1px solid #CCC;
    padding-bottom: 12px;
    position: relative; float: left; width: 100%; height: auto;
}

#user_account_layer .menu_container_myaccount ul li a {}

#user_account_layer .form_field_container {}
#user_account_layer .form_field_label_container {}
#user_account_layer .form_field_field_container {}

.mobile_only {display: none;}

/* Responsive */
@media (max-width: 768px) {
    #user_account_layer .responsive_wrapper_1,
    #user_account_layer.responsive_wrapper_2 {width: 100%;}

    #post_order_shipping_layer .responsive_wrapper_1,
    #post_order_shipping_layer .responsive_wrapper_2 {width: 100%;}

    #post_order_payment_method_layer .responsive_wrapper_1,
    #post_order_payment_method_layer .responsive_wrapper_2 {width: 100%;}

    .mobile_only { display:inline;}
}

.view_table {width:100%;}
.view_table th {padding:10px; border:1px solid #ececec; font-weight:bold; white-space:nowrap; color:#000; }
.view_table td {padding:10px; border:1px solid #ececec; vertical-align: middle;}
.view_table thead { }
.view_table tbody {}
.view_table tfoot {}
.view_table tr.first {}
.view_table tr.first th.label {}
.view_table tr.last {}
.view_table tr.odd th.label{}
.view_table tr.even {}
.view_table tbody.odd {}
.view_table tbody.odd td {border-width:0 1px; }
.view_table tbody.even { }
.view_table tbody.even td {border-width:0 1px; }
.view_table tbody.odd tr.border td,
.view_table tbody.even tr.border td {border-bottom-width:1px; }
.view_table th .tax-flag {white-space:nowrap; font-weight:normal; }
.view_table td.label,
.view_table th.label {font-weight:bold; color:#7e7e7e; }
.view_table td.value {}
.view_table-indent {margin-bottom: 20px;}

@media (max-width: 767px) {
    /*Shopping Cart Responisve*/
    .view_table {position: relative; padding-bottom: 10px;}
    .view_table thead,
    .view_table colgroup {display: none; }
    .view_table tfoot {width: 100%; display: block;}
    .view_table td,
    .view_table tr,
    .view_table tbody {display: block; text-align: center !important;}
    .view_table td {margin: 0 10px; border: 0; border-bottom: 1px solid #ddd;}
    .view_table td.last,
    .view_table td:last-child  {border: 0;}
    .view_table tr {
        margin: 4px 0 25px;
        border: 1px solid #ddd;
        box-shadow:0 0px 13px rgba(0,0,0,0.15);
        -moz-box-shadow:0 0px 13px rgba(0,0,0,0.15);
        -webkit-box-shadow:0 0px 13px rgba(0,0,0,0.15);
    }
}
/**************************************************************************************************
2. Form Field Layers
**************************************************************************************************/
/*
 *
 * Collection of form components.
 * Includes:
              a. div container (form_field_container)
              b. label container (form_field_label_container)
              c. field/input container (form_field_field_container)
 *
 */

.cc-container, .form_field_container {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    clear: left;
}

.cc-label, .form_field_label_container {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
}

.cc-field, .form_field_field_container {
    position: relative;
    float: left;
    width: 45%;
    height: auto;
}

#post_order_shipping_layer .form_field_field_container {
    width: 100%;
}

.cc-valid {
    position: relative;
    float: left;
    width: 5%;
    height: auto;
    text-align: right;
}

.cc-mini-containers {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    margin-bottom: 1rem;
}

.form_field_label_container label {
    display: inline-block;
    margin-top: 7px;
    margin-bottom: 7px;
}

.bg-grey {
    text-decoration: underline;
}

#registration_layer .form_field_container, #registration_layer .form_field_label_container, #registration_layer .form_field_field_container {
    width: 100%;
}

/* Responsive Layouts*/

@media (max-width: 991px) {
    .cc-container {
        width: 100%;
    }
}

@media (max-width: 767px) {
    /*    .top-header-list {
            text-align: center;
        }
        .top-header-list li {
            font-size: 15px;
            width: 100%;
        }*/
    .cc-container, .form_field_container {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .cc-label, .form_field_label_container {
        width: 100%;
    }
    .cc-field, .form_field_field_container {
        width: 90%;
    }
    .cc-valid {
        width: 10%;
    }
}

/**************************************************************************************************
2. Shopping Cart
**************************************************************************************************/
/*
 *
 * Shopping Cart Values.
 * Includes:
              a. class="class" : bottom cart summary section
              b.
              c.
 *
 */

.shopping_cart_buttons a.button {
    float: right;
}

.cart {}

/* Shopping Cart Totals */
.cart .totals {background:#F4F4F4; overflow:hidden; padding:0px 0px 0px 0px; width: 34%; float: right;}
.cart .totals table {width:100%; font-size:12px; color:#7f7f7f; margin-bottom:0px; }
.cart .totals table tr{border-bottom:1px solid #606060;}
.cart .totals table th,
.cart .totals table td {padding:7px 11px; font-size:13px; line-height:17px; color:#777; text-transform:uppercase; vertical-align:middle; width:50%;  }
.cart .totals table tr td:first-child {}
.cart .totals table td:first-child.a-right {text-align: left !important;}
.cart .totals table strong {font-weight:normal; }
.cart .totals table th {font-weight:bold; }
.cart .totals table tfoot th {}
.cart .totals .price {color:#777; display:inline-block; padding: 0; font-size: 13px; line-height: 17px;}
.cart .totals a.button > span {
    font-size:15px;
    padding:0 5px;
    height:49px;
    line-height:49px;
    font-size: 15px;
    padding: 0px 17px;
    height: 49px;
    line-height: 49px;
    display: block;
    float: left;
}

.cart .totals a.button:hover > span{}
.checkout-types li {padding-top:15px;}
.checkout-types li:first-child {padding-top:0;}
.checkout-types li a {color:#a6a6a6; text-decoration:underline; margin: 0px;}
.checkout-types li a:hover{text-decoration:none;}
.cart .totals .checkout-types li a {width:auto;}

.cart .totals table {
    width: 100%;
    font-size: 12px;
    color: #7F7F7F;
    margin-bottom: 0px;
}

@media screen and (max-width: 768px) {
    .cart .totals {
        width: 100%;
    }
    .cart .view_table tfoot .button {
        margin: 3px 0px;
        width: 100%;
        display: inline-block;
    }

    .shopping_cart_buttons a.button {
        float: none;
    }

    .shopping_cart_buttons a.button span {
        text-align: center;
        width: 100%;
    }

    .shopping_cart_buttons a.button span span {
        float: none;
    }
}

#post_order_shipping_layer #post_order_delivery_details_layer, #post_order_shipping_layer #post_order_delivery_method_layer {
    position: relative;
    float: none;
    width: 100%;
    margin: 0px;
}
div#list_of_shipping_methods {
    border: none;
    margin-bottom: 10px;
    padding: 0px;
}


div#delivery_methods_layer #list_of_shipping_methods .shipping_fields_group {
    display: block;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: auto;
    line-height: 1.42857;
    min-height: 0px;
    border: none;
    background-color: #fff;
}
div#delivery_methods_layer #list_of_shipping_methods .shipping_fields_group:hover {
    background-color: #eee;
}
div#delivery_methods_layer #list_of_shipping_methods .shipping_fields_group.selected_shipping_method,
div#delivery_methods_layer #list_of_shipping_methods .shipping_fields_group.selected_shipping_method:hover {
    background-color: #e0e0e0;
}
div#list_of_shipping_methods div.shipping_fields_group div.shipping_field {
    position: relative;
    float: none;
    display: table-cell;
    vertical-align: middle;
    cursor: pointer;
}
div#list_of_shipping_methods div.shipping_fields_group div#radio {
    padding: 5px;
}
div#list_of_shipping_methods div.shipping_fields_group div#description {
    padding: 5px;
    width: 10000px;
    line-height: 1.42857;
}
div#list_of_shipping_methods div.shipping_fields_group div#description a {
    color: #000
}
div#list_of_shipping_methods div.shipping_fields_group_clear {
    height: 1px;
    clear: both;
    background-color: #ccc;
}
div#list_of_shipping_methods div.shipping_fields_group_clear:last-child {
    height: 0px;
    clear: both;
}
div#shipping_cost_layer {
    margin-top: 0px;
}
div.shipping_cost_total_layer {
    padding: 5px 0px 15px 0px;
}

ul#shipping_method_names {
    list-style: none;
    padding-left: 0px;
    margin-bottom: 10px;
}
ul#shipping_method_names li {
    list-style: none;
    font-weight: bold;
}
ul#shipping_method_names li .extended_description{
    font-weight: normal;
}


div#delivery_methods_layer {
    width: 100%;
    height: auto;
}

textarea.shipping_comments {
    resize: none;
    height: 200px;
    width: 100%;
}

textarea {
    max-width: 100%;
}

.button-float-left {
    float: left;
}

.button-float-right {
    float: right;
}

.form-list select{
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    color: #555;
    background-color: #FFF;
    background-image: none;
    border: 1px solid #CCC;
    border-radius: 0px;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}


div#shipping_street_number_field_container #street_number_input_layer input {
    width: 85px;
    margin-right: 15px;
}
div#shipping_street_number_field_container #street_number_input_layer {
    position: relative;
    float: left;
    min-width: 60px;
}
div#shipping_street_number_field_container #street_number_not_applicable_label_layer {
    position: relative;
    float: left;
    width: auto;
}
.uservieworders_filter_layer .form_field_title {
    padding: 0px;
}

/* More Defaults */
.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    color: #555;
    background-color: #FFF;
    background-image: none;
    border: 1px solid #CCC;
    border-radius: 0px;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

.form-list input.input-text {
    width: 100%;
}

input.input-text, textarea {
    padding: 6px;
    resize: none;
    border-radius: 0px;
}

/* Voucher Code */
div#enter_voucher_layer {
    position: relative;
    float: left;
    border: 1px solid #C6C5C5;
    padding: 7px;
    width: 100%;
}

div#enter_voucher_layer div#voucher_key_reverse_button_layer {
    position: relative;
    width: auto;
    float: left;
    margin-top: 0px;
}

div#enter_voucher_layer div#voucher_key_apply_button_layer {
    position: relative;
    width: auto;
    float: left;
    margin-left: 10px;
    margin-top: 0px;
}

div#enter_voucher_layer div#voucher_key_input_layer {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    clear: both;
}

div#enter_voucher_layer div#vouchers_id_list_layer {
    position: relative;
    float: left;
    width: auto;
    height: auto;
    clear: both;
    padding-bottom: 10px;
}

div#enter_voucher_layer div#voucher_key_error_layer {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    clear: both;
    padding-bottom: 10px;
    color: #F00;
}

div#voucher_key_wrapper_layer #voucher_key {
    position: relative;
    float: left;
    clear: both;
    margin-bottom: 15px;
    width: 269px;
}

div#voucher_key_wrapper_layer {
    margin-left: 0px;
    margin-top: 25px;
}

/* Order Summary */
div#payment_gateway_description {
    padding: 0px;
}

/* Post Order Progress Bar */

div#post_order_progress_bar, div#post_order_progress_bar div.post_order_progress_bar_container {
    height: auto;
}
div#post_order_progress_bar {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
    clear: both;
    margin: 10px 0px 20px 0px;
    text-align: center;
}

div#post_order_progress_bar, div#post_order_progress_bar div.post_order_progress_bar_container {
    height: auto;
}

div#post_order_progress_bar div.post_order_progress_bar_container div {
    position: relative;
    float: left;
    margin: auto;
}

.post {
    position: relative;
    float: left;
    width: 25%;
    height: auto;
    background-color: #EFEFEF;
    text-align: center;
    line-height: 50px;
    color: #000;
}

.post_order_progress_bar_container .active {
    background-color: #7F7F7F;
    color: #FFF;
}

.cart .totals .check_out_totals {
    font-size: 18px;
    font-weight: 600;
    color: #f90;
    display: inline-block;
    padding: 0px;
    line-height: 18px;
}

.cart-collaterals {
    margin-top: 15px;
}

.col2-set {
    overflow: hidden;
    padding: 0px;
    width: 100%;
    float: left;
}

.cart-collaterals .col2-set {
    width: 60%;
}

.cart-collaterals .col2-set .col-1, .cart-collaterals .col2-set .col-2 {
    width: 100%;
    float: left;
}
/* ======================= */

@media screen and (max-width: 768px) {
    div#payment_methods_layer ul li span.method {
        position: relative;
        float: left;
        width: 80%;
    }
    .post {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    div#enter_voucher_layer div#voucher_key_reverse_button_layer {
        width: 100%;
        margin: 5px 0px;
    }

    div#enter_voucher_layer div#voucher_key_reverse_button_layer span, #voucher_key_apply_button_layer span {
        width: 100%;
    }

    div#enter_voucher_layer div#voucher_key_apply_button_layer {
        margin-left: 0px;
        width: 100%;
    }

}