.tracking-panel {
    font-family: "Roboto", Helvetica, Arial, sans-serif;
    max-width: 100%;
    width: 100%;
}

    .tracking-panel table {
        max-width: 100%;
        width: 100%;
        border-spacing: 0;
        border-collapse: collapse;
        margin-bottom: 1.5em;
    }

        .tracking-panel table th {
            text-align: left
        }

        .tracking-panel table td {
            text-align: left
        }

        .tracking-panel table th, .tracking-panel table td {
            border: 1px solid rgba(240,240,240,1);
            padding: 6px;
            vertical-align: middle;
        }

    .tracking-panel .error-message {
        border: solid 1px #CC0000;
        background: #F7CBCA;
        color: #CC0000;
        padding: 9px;
        text-align: center;
        -moz-border-radius: 4px;
        border-spacing: 0;
        khtml-border-radius: 4px;
        webkit-border-radius: 4px;
        border-radius: 4px;
        margin: 5px 0;
        font-size: 14px;
    }

    .tracking-panel .tracking-number {
        font-size: 24px;
        font-weight: bold;
        color: #f6852a;
        text-align: center;
        text-transform: capitalize;
        padding: 20px 20px
    }

    .tracking-panel .from-location, .tracking-panel .to-location {
        font-size: 16px;
        color: #f6852a
    }

    .tracking-panel .from-country, .tracking-panel .to-country {
        font-size: 18px;
        color: #666
    }

    .tracking-panel .track-history {
        color: #f6852a;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin-bottom: 10px
    }

    .tracking-panel .where-your-shipment-has-been {
        text-align: center;
        font-size: 14px;
        text-transform: capitalize
    }

    /*  --------------------------- Agent Table  -----------------------------------*/
    .tracking-panel .agent-tracking-number {
        color: #666;
        font-size: 18px;
    }




    /*  --------------------------- Status Table  -----------------------------------*/
    .tracking-panel .status-table tr:nth-child(even) {
        background-color: #f0f0f0;
    }

    .tracking-panel .status-table th.date {
        text-align: center
    }

    .tracking-panel .status-table td.text-center {
        text-align: center
    }

    .tracking-panel .panel-title {
        color: #214283;
        text-align: center;
        font-weight: bold
    }

    .tracking-panel .second-line {
        color: #808284;
        font-size: 14px;
    }

    /*  --------------------------- Shipment Deatils  -----------------------------------*/
    .tracking-panel .shipment-detail-head {
        color: #f6852a;
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        margin-bottom: 10px
    }

    .tracking-panel .more-about-your-shipment {
        text-align: center;
        font-size: 14px;
        text-transform: capitalize
    }

    .tracking-panel .shipment-detail-title {
        color: #666;
        font-size: 16px;
        padding-bottom: 5px
    }

    .tracking-panel .shipment-details {
        color: #666;
        font-size: 18px;
    }

    /*----------------- Button details -------------------------------*/

    .tracking-panel .btn-tracknow {
        background-color: #004aaa;
        border-color: #e08e0b;
        text-decoration: none;
    }

    .tracking-panel .btn-status {
        background-color: #196bd6;
        border-color: #e08e0b;
        text-decoration: none;
    }

    .tracking-panel .btn {
        display: inline-block;
        padding: 4px 10px;
        margin-bottom: 0;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.42857143;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        -ms-touch-action: manipulation;
        touch-action: manipulation;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        background-image: none;
        border: 1px solid transparent;
        border-radius: 4px;
        color: #fff;
    }

/*------------- Status Bar One ---------------------*/
.icon-background1 {
    color: #1d83c5;
}

.icon-background2 {
    color: #c3c3c3;
}

.icon-background3 {
    color: #FFFFFF;
}

.status-disabled {
    display: none
}
/*------------- Status Bar Two  ---------------------*/
.text-center {
    text-align: center;
}

.progress {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #016dcf;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

.progress-striped .progress-bar,
.progress-bar-striped {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    -webkit-background-size: 40px 40px;
    background-size: 40px 40px;
}

.progress.active .progress-bar,
.progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
}

.progress-bar-success {
    background-color: #5cb85c;
}

.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-info {
    background-color: #5bc0de;
}

.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-warning {
    background-color: #f0ad4e;
}

.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.progress-bar-danger {
    background-color: #d9534f;
}

.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
}

.bs-wizard {
    padding: 0 0 10px 0;
}

    .bs-wizard > .bs-wizard-step {
        padding: 0;
        position: relative;
    }

        .bs-wizard > .bs-wizard-step + .bs-wizard-step {
        }

        .bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
            color: #595959;
            font-size: 16px;
            margin-bottom: 5px;
        }

        .bs-wizard > .bs-wizard-step .bs-wizard-info {
            color: #999;
            font-size: 14px;
        }

        .bs-wizard > .bs-wizard-step > .bs-wizard-dot {
            position: absolute;
            width: 30px;
            height: 30px;
            display: block;
            background: #016dcf;
            top: 45px;
            left: 50%;
            margin-top: -15px;
            margin-left: -15px;
            border-radius: 50%;
        }

            .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
                content: ' ';
                width: 14px;
                height: 14px;
                background: #f6852a;
                border-radius: 50px;
                position: absolute;
                top: 8px;
                left: 8px;
            }

        .bs-wizard > .bs-wizard-step > .progress {
            position: relative;
            border-radius: 0px;
            height: 8px;
            box-shadow: none;
            margin: 12px 0;
        }

            .bs-wizard > .bs-wizard-step > .progress > .progress-bar {
                width: 0px;
                box-shadow: none;
                background: #016dcf;
            }

        .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
            width: 100%;
        }

        .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
            width: 50%;
        }

        .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
            width: 0%;
        }

        .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
            width: 100%;
        }

        .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
            background-color: #e0e0e0;
        }

            .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {
                opacity: 0;
            }

        .bs-wizard > .bs-wizard-step:first-child > .progress {
            left: 50%;
            width: 50%;
        }

        .bs-wizard > .bs-wizard-step:last-child > .progress {
            width: 50%;
        }

        .bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot {
            pointer-events: none;
        }


        .bs-wizard > .bs-wizard-step > .bs-wizard-dot-returned {
            position: absolute;
            width: 30px;
            height: 30px;
            display: block;
            background: #F00;
            top: 45px;
            left: 50%;
            margin-top: -15px;
            margin-left: -15px;
            border-radius: 50%;
        }

            .bs-wizard > .bs-wizard-step > .bs-wizard-dot-returned :after {
                content: ' ';
                width: 14px;
                height: 14px;
                background: #F00;
                border-radius: 50px;
                position: absolute;
                top: 8px;
                left: 8px;
            }

        .bs-wizard > .bs-wizard-step > .progress > .progress-bar-returned {
            width: 0px;
            box-shadow: none;
            background: #F00;
        }

        .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar-returned {
            width: 100%;
        }

        .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar-returned {
            width: 50%;
        }

        .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar-returned {
            width: 0%;
        }

        .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar-returned {
            width: 100%;
        }

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

    .alert h4 {
        margin-top: 0;
        color: inherit;
    }

    .alert .alert-link {
        font-weight: bold;
    }

    .alert > p,
    .alert > ul {
        margin-bottom: 0;
    }

        .alert > p + p {
            margin-top: 5px;
        }

.alert-dismissable,
.alert-dismissible {
    padding-right: 35px;
}

    .alert-dismissable .close,
    .alert-dismissible .close {
        position: relative;
        top: -2px;
        right: -21px;
        color: inherit;
    }

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

    .alert-success hr {
        border-top-color: #c9e2b3;
    }

    .alert-success .alert-link {
        color: #2b542c;
    }

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

    .alert-info hr {
        border-top-color: #a6e1ec;
    }

    .alert-info .alert-link {
        color: #245269;
    }

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

    .alert-warning hr {
        border-top-color: #f7e1b5;
    }

    .alert-warning .alert-link {
        color: #66512c;
    }

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

    .alert-danger hr {
        border-top-color: #e4b9c0;
    }

    .alert-danger .alert-link {
        color: #843534;
    }