/*
default
===============================================================================
*/

.top-banner {
    background: #f9f9f9;
    border-bottom: 1px solid #e1e1e1;
    position: fixed;
    top:80px;
    width:100%;
    z-index: 999;
    display: inline-flex;
    align-items: center;
    justify-content: space-evenly;
}
.top-banner h1.title{
    font-size: 18px;
    line-height: 85px;
    text-align: center;
}


.product-float-save-wrapper {display: none;}

.product-review-wrapper {margin-right: 5px; display: none;}
/*.product-review-wrapper.product-review {background: #333; border: 1px solid #333;}*/
.product-review-wrapper.product-review img.eye {float: left; width: 20px; margin: 10px 3px 0 0;}


/*.profile-review-wrapper.profile-review {background: #333; border: 1px solid #333;}*/
.profile-review-wrapper.profile-review img.eye {float: left; width: 20px; margin: 10px 3px 0 0;}



/*
product builder tour
===============================================================================
*/

#tour-steps-dlg {
    display: none;
    width:705px; background: #f9f9f9; border: 1px solid #e1e1e1;
    position: absolute; top: 87px; left:0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.75);
}

#tour-steps-dlg .carrot {position: absolute; top: -21px;}
#tour-steps-dlg .carrot img {width:26px;}

#tour-steps-dlg .hide {position: absolute; top: 7px; right: 7px; cursor: pointer; line-height: 0;}
#tour-steps-dlg .hide img {width:15px;}

#tour-steps-dlg .step-back span.img {
    background: rgba(0, 0, 0, 0) url("/images/arrow_left_999.png") no-repeat scroll 0 0 / 8px 12px;
    float: left;
    height: 12px;
    margin-top: 4px;
    width: 8px;
}
#tour-steps-dlg .step-next span.img {
    background: rgba(0, 0, 0, 0) url("/images/arrow_right_999.png") no-repeat scroll 0 0 / 8px 12px;
    float: right;
    height: 12px;
    margin-top: 4px;
    width: 8px;
}

#tour-steps-dlg .step-back:hover span.img {background-image: url("/images/arrow_left_green.png")}
#tour-steps-dlg .step-next:hover span.img {background-image: url("/images/arrow_right_green.png")}
#tour-steps-dlg .step-back:hover span.txt,
#tour-steps-dlg .step-next:hover span.txt { color: #00A94F}

#tour-steps-dlg .step-back { bottom: 20px; left:  20px; position: absolute; }
#tour-steps-dlg .step-next { bottom: 20px; right: 20px; position: absolute; }

#tour-steps-dlg .step-title {
    font-size: 18px;
    color: #00A94F;
    margin: 40px 0 0 40px;
    float:left; width: calc(100%-80px);
}

#tour-steps-dlg .step-desc {
    font-size: 15px;
    color: #777;
    line-height: 22px;
    margin: 22px 25px 55px 40px;
    float:left; min-width: 70%;
}

#tour-steps-dlg .step-back span.txt,
#tour-steps-dlg .step-next span.txt {
    color: #000; font-size: 11px; letter-spacing: 0.14em; margin-left: 8px;
}
#tour-steps-dlg .step-next span.txt {margin-right: 8px;}


#tour-steps {
    margin: 20px auto 0; width: 605px; position: relative;
}
#tour-steps .status-circle {
    cursor: pointer;
}
#tour-steps li.step {
    border: 1px solid #ccc; float: left; height: 40px; width: 60px; text-align: center;
}
#tour-steps  li.step.long{ width:80px; }

#tour-steps li.step .title {
}
#tour-steps li.step .mark {
    border: 1px solid #ccc; border-radius: 5px; height: 10px; width: 10px;
}

#tour-top-nav {
    background: #f9f9f9 none repeat scroll 0 0;
    border-bottom: 1px solid #cdcdcd;
    top:0; left:0; display:none;
    height: 85px;
    position: fixed;
    width: 100%;
    z-index: 9999999;
}

.tour-title {
    left: 60px; position: absolute; top: 35px; font-size: 18px; letter-spacing: 0.02em;
}
#tour-top-nav .tour-close {
    cursor: pointer; right: 60px; position: absolute; top: 35px; width: auto; background: none;
}

#tour-top-nav .tour-close img { float:right; width: 9px; }
#tour-top-nav .tour-close span { float:right; color: #000; font-size: 11px; letter-spacing: 0.14em; margin-right: 4px; }

.tour-start {
    position: fixed; top:165px; right:22px; cursor: pointer; z-index: 15;
}
.tour-start-icon {width: 27px;}
.tour-start-text { color: #00a94f; font-size: 11px; letter-spacing: 0.14em; float: right; padding: 8px 0 8px 10px;}


#tour-welcome-dialog {
    display: none; position: absolute; top: 160px; left: 350px; width:600px;
}

.tour-welcome-title {
    font-size: 18px; letter-spacing: 0.02em; text-align: center;
}
.tour-welcome-text {
    font-size: 14px; letter-spacing: 0.02em; text-align: center; margin-top: 20px;
}

#tour-welcome-dialog .tour-close {
    cursor: pointer; background: none; text-align: center; position: static;
}

#tour-ending-dialog {
    display: none; position: absolute; top: 160px; left: 350px; width:600px;
}

.tour-ending-title {
    font-size: 18px; letter-spacing: 0.02em; text-align: center;
}
.tour-ending-text {
    font-size: 14px; letter-spacing: 0.02em; text-align: center; margin-top: 20px; line-height: 140%;
}

#tour-ending-dialog .button-wide {
    width: 230px;
}

/*
    vendor portal dashboard chart
===============================================================================
*/

.dashboard .flex-ele{width: 50%; height: 338px; overflow: hidden;}
.dashboard .flex-ele img.right-arr{width: 8px; margin-left: 5px; margin-bottom: 5px;}
.con-header .zs-header{margin-bottom: 10px; font-size: 18px;}
.con-header p span {float: right;}

.dashboard .mid-sec{margin-top: 20px; width: 90%;}
.dashboard .mid-sec-con{display:flex;}
.dashboard.mobile .mid-sec{margin-top: 30px; width: 100%;}
.dashboard.mobile .mid-sec-con{display:block;}

#dashboard-todolist {
    height: 303px; overflow: hidden; background-color: #f9f9f9;
    border: 1px solid #e1e1e1;
}
#dashboard-todolist .top-sec {display:none;}
#dashboard-todolist .bucket_container {background:#fff;}
#dashboard-todolist .bucket_title {border-left:0; border-right: 0;}
#dashboard-todolist .package_div {border-left:0; border-right: 0;}
#dashboard-todolist .package_div.pastdue {border-left: 5px solid #fd6340;}

#dashboard-todolist .todo_list_container {margin:0; padding:0}
#dashboard-todolist .todo_list_container .mid-sec {margin:0;}

#dashboard-chart {width:100%;}
#dashboard-chart p.zs-header { float: left; margin-bottom: 0; margin-top: 8px; }

.dashboard .no-data-div {height: 302px; width:auto; text-align:center}
.dashboard .no-data-div img {margin-top: 90px;}

.ifonly_debug {display:none}
#statistics-options-wrapper {float: right; padding-left: 12px; box-sizing: border-box; width: 50%;}
#statistics-options { width: 100%;}

#stat-charts {width: 100%; float:left; border: 1px solid #e1e1e1; box-sizing: border-box; margin-top:10px;}
#stat-charts .tabs {}
#stat-charts .tabs .tab {
    position: relative;
    background-color:#fafafa; cursor: pointer;
    width: 20%; height:120px; float:left;
    box-sizing: border-box;
    border-left: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
}
#stat-charts .tabs .tab:first-child {box-sizing: content-box; height:119px; border-left: none; }
#stat-charts .tabs .tab.current {background-color:#fff; border-bottom:none;}
#stat-charts .tabs .thumb {margin: 2px 6px 0 10px;}
#stat-charts .tabs .tab-title {margin-top:4px;}
#stat-charts .tabs .tab-title .text {color:#333; font-size: 11px; line-height: 28px; letter-spacing: 0.12em; text-transform: uppercase;}
#stat-charts .tabs .tab-title .info {
    float:right; height: 28px; width: 28px;
}

#stat-charts .tabs .main-val {color:#000; font-size: 26px; line-height: 1; margin: 6px 0 12px 0;}
#stat-charts .tabs .sub,
#stat-charts .tabs .sub .val {color:#777; font-size: 13px;}
#stat-charts .tabs .sub .val {float:right; padding-right:4px;}

#stat-charts .tabs .tooltip {
    display: none; padding: 10px; position: absolute; width: 120px; z-index: 100;
    bottom: 115px; right: 3px;
    background: #fff; border: 1px solid #e1e1e1;
    box-shadow: 8px 8px 8px #aaa;
}
#stat-charts .tabs .tooltip .close-tip {position:absolute; bottom:2px; right:2px; width: 24px; height:24px;}

#stat-charts .panes {float:left; width:100%; }
#stat-charts .panes .chart {width:100%; height: 400px; float: left; position: relative;}


.proHeader, .sec-header, .edit-block.center {text-align: center;}

.custom-form.vendor-page input[type='text'].checkBox{width: 35px; height: 35px; cursor: pointer;}

.custom-form.vendor-page input[type='text']{width: 100%; height: 40px;}

.custom-form.vendor-page .form-row {border-bottom: 1px solid #e2e2e2;}


.custom-form.vendor-page .state {margin-bottom: 10px;}

.custom-form.vendor-page input[type=text].checkBox.select{background: url(/images/io/icon_checkmark_FFF.png) no-repeat 5px 5px;
                                                            background-size: 15px;
                                                            background-color: #00a94f;
                                                            background-position: center;}

.status-label {cursor: pointer;}



/* FLIGHT DELAY */

.flight_delay_orders_overlay {z-index:10000;}
.ui-autocomplete{z-index:10001;}
.flight_delay_orders_overlay .flight-delay-header {margin: 0 20px 20px;}
.flight_delay_orders_overlay  .ifonly_pop {width:500px; height:500px; padding-bottom:0;}
.flight_delay_orders_overlay .warning_icon {width:60px; }
.flight_delay_orders_overlay .body_row > * {margin-top:20px;}
.flight_delay_orders_overlay .btn_row {margin-top: 50px;}
.flight_delay_orders_overlay .btn_row .button {margin: 0 10px;}
.flight_delay_orders_pop_content {margin-bottom: 50px;}
.flight-delay-content { padding: 20px 0; overflow: auto; height:445px;}
.flight_delay_orders_overlay .flight-delay-button {width: 100%; height: 100%; justify-content: center;}
.flight_delay_orders_overlay .flight-info-section-row {width: 100%; /*height: 50px;*/ padding: 0 20px;}
.flight_delay_orders_overlay .flight-info-section-template {display: none;}
.js-flight-delay-text {height: 30px;}
.flight_delay_orders_overlay .flight-info-section input[type='text'] {display: none; height: 30px; border-radius: 5px; width: 90%;}
.flight_delay_orders_overlay .flight-info-section.edit .js-flight-delay-text {display: none;}
.flight_delay_orders_overlay .flight-info-section.edit .js-flight-delay-input {display: block;}

.flight_delay_orders_overlay .flight-info-section .js-additional-passengers {cursor: pointer; text-decoration: underline; display: none;}
.flight_delay_orders_overlay .flight-info-section.edit .js-additional-passengers {display: block;}
.flight_delay_orders_overlay .flight-delay-button {cursor: pointer; height: 50px; width: 100%; position: absolute; bottom: 0;}
.flight_delay_orders_overlay .flight-delay-button.disabled {cursor: auto; background-color: #e1e1e1; color: #000;}
.flight_delay_orders_overlay .circle-container {margin: 3px 5px;}
.flight_delay_orders_overlay .circle-container .circle {cursor: pointer; background-color: #808080; width: 25px; height: 25px; border-radius: 50%;}
.flight_delay_orders_overlay .additional-passengers-container {position: relative; padding-right: 31px;}
.flight_delay_orders_overlay .flight-info-section:last-of-type hr {display: none;}