﻿
.padding10 {
    padding: 10px 10px 10px 10px;
}

.pagination-ys {
    /*display: inline-block;*/
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

    .pagination-ys table > tbody > tr > td {
        display: inline;
    }

        .pagination-ys table > tbody > tr > td > a,
        .pagination-ys table > tbody > tr > td > span {
            position: relative;
            float: left;
            padding: 8px 12px;
            line-height: 1.42857143;
            text-decoration: none;
            color: #dd4814;
            background-color: #ffffff;
            border: 1px solid #dddddd;
            margin-left: -1px;
        }

        .pagination-ys table > tbody > tr > td > span {
            position: relative;
            float: left;
            padding: 8px 12px;
            line-height: 1.42857143;
            text-decoration: none;
            margin-left: -1px;
            z-index: 2;
            color: #aea79f;
            background-color: #f5f5f5;
            border-color: #dddddd;
            cursor: default;
        }

        .pagination-ys table > tbody > tr > td:first-child > a,
        .pagination-ys table > tbody > tr > td:first-child > span {
            margin-left: 0;
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px;
        }

        .pagination-ys table > tbody > tr > td:last-child > a,
        .pagination-ys table > tbody > tr > td:last-child > span {
            border-bottom-right-radius: 4px;
            border-top-right-radius: 4px;
        }

        .pagination-ys table > tbody > tr > td > a:hover,
        .pagination-ys table > tbody > tr > td > span:hover,
        .pagination-ys table > tbody > tr > td > a:focus,
        .pagination-ys table > tbody > tr > td > span:focus {
            color: #97310e;
            background-color: #eeeeee;
            border-color: #dddddd;
        }


.shadow-box {
    -webkit-box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.75);
    box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.75);
}

h3 > .badge {
    vertical-align: middle;
}

.content_table-response {
    width: 98%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

/* Status Shipment Tracking */

.shop-tracking-status .form-horizontal {
    margin-bottom: 50px
}

.shop-tracking-status .order-status {
    margin-left:12px;
    margin-right:25px;
    margin-top: 50px;
    position: relative;
    margin-bottom: 50px
}

.shop-tracking-status .order-status-timeline {
    height: 12px;
    border: 1px solid #aaa;
    border-radius: 7px;
    background: #eee;
    box-shadow: 0px 0px 5px 0px #ecf0f5 inset
}

    .shop-tracking-status .order-status-timeline .order-status-timeline-completion {
        height: 8px;
        margin: 1px;
        border-radius: 7px;
        background: #32af61;
        width: 0px
    }

        .shop-tracking-status .order-status-timeline .order-status-timeline-completion.c1 {
            width: 22%
        }

        .shop-tracking-status .order-status-timeline .order-status-timeline-completion.c2 {
            width: 46%
        }

        .shop-tracking-status .order-status-timeline .order-status-timeline-completion.c3 {
            width: 70%
        }

        .shop-tracking-status .order-status-timeline .order-status-timeline-completion.c4 {
            width: 100%;
            background: #d9534f;
        }

.shop-tracking-status .payment-status-timeline {
    width: 46%;
    height: 12px;
    border: 1px solid #aaa;
    border-radius: 7px;
    background: #eee;
    box-shadow: 0px 0px 5px 0px #ecf0f5 inset
}

    .shop-tracking-status .payment-status-timeline .payment-status-timeline-completion {
        height: 8px;
        margin: 1px;
        border-radius: 7px;
        background: #32af61;
        width: 0px
    }

        .shop-tracking-status .payment-status-timeline .payment-status-timeline-completion.c1 {
            width: 48%
        }

        .shop-tracking-status .payment-status-timeline .payment-status-timeline-completion.c2 {
            width: 100%
        }

        .shop-tracking-status .payment-status-timeline .payment-status-timeline-completion.c4 {
            width: 48%;
            background: #d9534f;
        }

.shop-tracking-status .image-order-status {
    border: 1px solid #ddd;
    padding: 7px;
    background-color: #fdfdfd;
    position: absolute;
    margin-top: -25px
}

    .shop-tracking-status .image-order-status.active {
        box-shadow: 0px 0px 10px 0px #cf7400
    }

        .shop-tracking-status .image-order-status.active .status {
            color: #cf7400;
            text-shadow: 0px 0px 1px #777
        }

    .shop-tracking-status .image-order-status .icon {
        height: 20px;
        width: 20px;
        text-align: center;
    }

        .shop-tracking-status .image-order-status .icon .fa {
            vertical-align: middle;
            font-size: large;
            color: white;
        }

    .shop-tracking-status .image-order-status .status {
        position: absolute;
        color: #333;
        top: 40px;
        left: -10px;
        width: 180px;
    }
    @media only screen and (max-width: 600px){
        .max-string {
            width: 90px !important;
        }
    }
@media only screen and (max-width: 600px) {
    .max-string-phone {
        width: 70px !important;
    }
}
@media only screen and (max-width: 790px) {
    .max-string {
        width: 90px !important;
    }
}
@media only screen and (max-width: 1071px) {
    .max-string {
        width: 90px !important;
    }
}
@media only screen and (max-width: 1250px) {
    .min-string {
        width: 90px !important;
    }
}
@media only screen and (max-width: 992px) {
    .media-title {
        margin-bottom: 50px !important;
        margin-left: 0px !important;
        margin-top: 10px !important;
    }
}
.completed {
    background-color: #32af61 !important;
}

.failed {
    background-color: #d9534f !important;
}

.shop-tracking-status .image-order-status-new {
    left: 0
}

.shop-tracking-status .image-order-status-active {
    left: 22%
}

.shop-tracking-status .image-order-status-intransit {
    left: 45%
}

.shop-tracking-status .image-order-status-delivered {
    left: 70%
}


    .shop-tracking-status .image-order-status-delivered .status:before {
        display: none
    }

.shop-tracking-status .image-order-status-completed {
    right: 0px
}

    .shop-tracking-status .image-order-status-completed .status:before {
        display: none
    }

/* ------------------------------- ORDER ------------------------------------*/
.shop-tracking-status .image-order-status-pending {
    left: 20%
}

.shop-tracking-status .image-order-status-confirmed {
    left: 60%
}

.shop-tracking-status .image-order-status-ready {
    left: 40%
}

.shop-tracking-status .image-order-status-closed {
    left: 80%
}

.shop-tracking-status .image-order-status-refunded {
    right: 0px
}

/* STATO PAGAMENTO*/
.shop-tracking-status .payment-order-status-timeline {
    width: 61%;
    height: 12px;
    border: 1px solid #aaa;
    border-radius: 7px;
    background: #eee;
    box-shadow: 0px 0px 5px 0px #ecf0f5 inset
}

    .shop-tracking-status .payment-order-status-timeline .status-timeline-completion {
        height: 8px;
        margin: 1px;
        border-radius: 7px;
        background: #32af61;
        width: 0px
    }

        .shop-tracking-status .payment-order-status-timeline .status-timeline-completion.c1 {
            width: 33%
        }

        .shop-tracking-status .payment-order-status-timeline .status-timeline-completion.c2 {
            width: 66%
        }

        .shop-tracking-status .payment-order-status-timeline .status-timeline-completion.c3 {
            width: 100%
        }

        .shop-tracking-status .payment-order-status-timeline .status-timeline-completion.c4 {
            width: 33%;
            background: #d9534f;
        }
/* STATO PAGAMENTO*/

/* STATO CONSEGNA*/
.shop-tracking-status .shipment-order-status-timeline {
    width: 61%;
    height: 12px;
    border: 1px solid #aaa;
    border-radius: 7px;
    background: #eee;
    box-shadow: 0px 0px 5px 0px #ecf0f5 inset
}

    .shop-tracking-status .shipment-order-status-timeline .status-timeline-completion {
        height: 8px;
        margin: 1px;
        border-radius: 7px;
        background: #32af61;
        width: 0px
    }

        .shop-tracking-status .shipment-order-status-timeline .status-timeline-completion.c1 {
            width: 33%
        }

        .shop-tracking-status .shipment-order-status-timeline .status-timeline-completion.c2 {
            width: 66%
        }

        .shop-tracking-status .shipment-order-status-timeline .status-timeline-completion.c3 {
            width: 100%;
        }

        .shop-tracking-status .shipment-order-status-timeline .status-timeline-completion.c4 {
            width: 100%;
            background: #d9534f;
        }
/* STATO CONSEGNA*/

/* STATO ORDINE */
.shop-tracking-status .order-order-status-timeline {
    width: 100%;
    height: 12px;
    border: 1px solid #aaa;
    border-radius: 7px;
    background: #eee;
    box-shadow: 0px 0px 5px 0px #ecf0f5 inset
}

    .shop-tracking-status .order-order-status-timeline .status-timeline-completion {
        height: 8px;
        margin: 1px;
        border-radius: 7px;
        background: #32af61;
        width: 0px
    }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c1 {
            width: 21%
        }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c2 {
            width: 41%
        }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c3 {
            width: 61%;
        }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c4 {
            width: 81%;
        }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c5 {
            width: 100%;
        }

        .shop-tracking-status .order-order-status-timeline .status-timeline-completion.c6 {
            width: 100%;
            background: #d9534f;
        }
/* STATO ORDINE */


/* ------------------------------- ORDER ------------------------------------*/

.m-bot-50 {
    margin-bottom: 50px;
}

.m-top-50 {
    margin-top: 50px;
}
