/*
Use the following colours:
Buttons:
   Blue Standard: #0172bc; - previously #1c84c6;
   Blue Rollover: #186ca0;
   Green Standard: #1ab394;
   Green Rollover: #367f6f;
   Red Standard: #ed5e6c;
   Red Rollover: #ce404e;
Text:
   Prominent text on light background: #222222;
   Muted text on light background: #888888;
   Headings on light background: #676a6c;
Backgrounds :
   Left menu and top and bottom of jqgrid: #24384a; - (very dark blue)
   Standard Body: #24384a - (very dark blue)
   Login page: #0172bc; -(Blue Standard)
   Banner top and background bottom of main pages: #e3e3e4 - (light grey))
   centre of main pages: #f3f3f4;
*/

body {
    font-size: 13px;
    background-color: #24384a;
}

.navbar-fixed-top, .navbar-static-top {
    background: #e3e3e4;
    border-bottom: 1px solid #aaaaaa;
}

.navbar-header {
    margin-left: 5px;
}

.warning-banner {
    background-color: #ed5e6c;
    color: white;
    padding: 10px;
}
 .warning-banner a {
     color: #e3e3e4;
     text-decoration: underline;
     font-weight: 600;
 }
.inmodal .modal-body {
    background: #f3f3f4;
}

.modal-content {
    background-color: #f3f3f4;
}

.vesta-blue-bkg {
    background-color: #0172bc;
}

.vesta-green-bkg {
    background-color: #1ab394;
    color: white;
}

.vesta-grey-bkg {
    background-color: #f3f3f4;
}

.vesta-dark-grey-bkg {
    background-color: #CECECE;
    color: #FFFFFF;
}

.vesta-mid-grey-bkg {
    background-color: #DADADA;
    color: black;
}

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*jqGrid loves Verdana and overrides all widgets. I hate Verdana...*/
.ui-widget {
    font-family: inherit;
}

/*A 1.5 wide column */
.col-md-1_5 {
    width: 12.5%;
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

/* Reduce the modal dialog slightly */
.inmodal .modal-header {
    padding: 15px 15px;
}

/* Override Summernote's override... */
.modal-dialog {
    padding: 0px;
}
.dropzone {
     border: 1px solid rgba(0,0,0,0.08);
     background: rgba(0,0,0,0.02);
     max-height: 380px;
     overflow-y: auto;
     padding: 12px 20px;
}
 .dropzone .dz-preview.dz-image-preview {
     background: transparent;
}
 .dropzone .dz-message {
     margin: 50px 0 0;
     font-size: 14px;
     color: #b9b9b9;
 }
 .dropzone .dz-preview .dz-remove {
     margin-top: 5px;
 }
 .dropzone::-webkit-scrollbar {
     width: 7px;
 }
 .dropzone::-webkit-scrollbar-track {
     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
     border-radius: 20px;
 }
 .dropzone::-webkit-scrollbar-thumb {
     background-color: darkgrey;
     outline: 1px solid slategrey;
     border-radius: 20px;
 }
 .dropzone .dz-preview .dz-error-message {
     top: 155px;
     opacity: 1;
 }


/* product image with ezdz */
.product_ezdz_div .ezdz-dropzone {
    width: 300px;
    height: initial;
    border: 2px dotted lightgrey;
    border-radius: 4px;
    font-weight: bold;
    font-size: 12px;
    font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0px;
    float: left;
    margin: 15px 17px 0px 0px;
    position: relative;
}

.product_ezdz_div .btn-danger {
    float: right;
    position: absolute;
    left: 278px;
    z-index: 1;
    margin-top: 15px;
}

/* Styles for the promo images for ezdz */
#edit_profile .ezdz-dropzone,
#edit_template .ezdz-dropzone {
    width: 652px;
    height: initial;
    border: 2px dotted lightgrey;
    border-radius: 4px;
    font-weight: bold;
    font-size: 15px;
    font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0px;
}

#edit_profile .ezdz-dropzone img,
#edit_template .ezdz-dropzone img {
    max-width: 100%;
    max-height: 100%;
}

/* Summernote for promo templates and profile */
#edit_profile .note-editor, #edit_template .note-editor, #sending_to_existing_div .note-editor {
    border: thin solid #808080;
    background-color: #fcfcfc;
}

.profile_ezdz_div .btn-danger,
.promo_ezdz_div .btn-danger {
    float: right;
    position: absolute;
    right: 56px;
    z-index: 1;
}

/* Promo styles */
.promo_scroll {
    background-color: white;
    border-radius: 5px;
}

.promo_template {
    display: inline-block;
    margin: 10px;
    width: 47%;
    max-width: 600px;
    min-width: 300px;
    vertical-align: top;
    border: 1px #999999 solid;
    border-radius: 4px;
    background-color: #fcfcfc;
}

.promo_name {
    background-color: #f0f0f0;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    border-bottom: 1px solid #cccccc;
    border-top-left-radius: 5px;
}

.promo_div {
    margin-bottom: 5px;
    text-align: center;
}

.promo_title {
    background-color: #002140;
    color: white;
    text-align: center;
    font-family: helvetica;
    font-size: x-large;
    padding: 5px;
}

.promo_desc {
    font-family: Helvetica;
    margin: 5px;
    text-align: left;
}

/* Allow Select2 dropdown to show over a modal */
.select2-close-mask {
    z-index: 2099;
}

.select2-dropdown {
    z-index: 3051;
}

.multiselect-container.dropdown-menu {
    z-index: 2202;
}

.multiselect-container > li > a > label {
    padding: 3px 20px 3px 32px;
}

/* Allow easyautocomplete dropdown to show */
#promo_mapping_grid tr td:nth-child(5) {
    overflow: visible;
}

.easy-autocomplete-container ul li, .easy-autocomplete-container ul .eac-category {
    overflow-x: hidden;
}

.btn-primary {
    background-color: #0172bc;
    border-color: #0172bc;
    color: #FFFFFF;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary,
.btn-primary:active:focus,
.btn-primary:active:hover,
.btn-primary.active:hover,
.btn-primary.active:focus {
    background-color: #186ca0;
    border-color: #186ca0;
    color: #FFFFFF;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success,
.btn-success:active:focus,
.btn-success:active:hover,
.btn-success.active:hover,
.btn-success.active:focus {
    background-color: #186ca0;
    border-color: #186ca0;
    color: #FFFFFF;
}

/*Make blue slabs on Customer/Home page into buttons */
.widget.blue-bg.p-sm.text-center.top-boxes:hover {
    /*background-color: #186ca0;*/ /*Now overide this per button colour in Vesta Mods section at end of document*/
    cursor: pointer;
}

label {
    font-weight: normal;
}

.form-control {
    border-radius: 3px;
}

.form-control:focus, .single-line:focus {
    border-color: #186ca0 !important;
}

.icheckbox_square-green, .iradio_square-green {
    border-radius: 3px;
}

.red .iradio_square-green, .red .icheckbox_square-green {
    background-image: url('plugins/iCheck/red.png') !important;
}

.black .iradio_square-green, .black .icheckbox_square-green {
    background-image: url('plugins/iCheck/black.png') !important;
}

.green .iradio_square-green, .green .icheckbox_square-green {
    background-image: url('plugins/iCheck/green.png') !important;
}

label#i_agree-error {
    min-width: 300px;
    padding-top: 25px;
    display: inline-block;
}

.has-error .form-control {
    border-color: #ed5565;
    background-color: #fdeded;
    -webkit-box-shadow: 0 0 0px 1000px #fdeded inset;
}

.m-t {
    margin-top: 15px;
    width: 210px;
    margin-left: 170px;
}

.nav > li.active {
    border-left: 4px solid #0172bc;
}

.top-boxes {
    min-height: 123px;
}

.btn-green {
    background-color: #1ab394;
    border-color: #1ab394;
    color: white;
}

.btn-green:hover {
    background-color: #367f6f;
    color: white;
}

.btn-danger {
    background-color: #ed5e6c;
}

.btn-danger:hover {
    background-color: #ce404e;
}

.wrapper-content {
    padding: 0px 10px 40px;
}

.switchery {
    background-color: #ed5e6c;
}

.onoffswitch-label {
    background-color: #0087f7;
    border: 2px solid #0087f7;
}

.onoffswitch-switch {
    border: 2px solid #0087f7;
}

.onoffswitch-inner::before {
    background-color: #0087f7;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    background: #24384a;
    /*border: 1px solid #24384a;*/
    line-height: 15px;
    font-weight: bold;
    color: #ffffff;
    text-shadow: none;
}

.ui-jqgrid .ui-pg-button:hover {
    color: #ffffff;
    background: #24384a;
    font-weight: bold;
}

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
    opacity: 0.7;
}

.ui-widget-content {
    border: 0px;
}

.ui-jqgrid-hdiv {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.ui-jqgrid .ui-jqgrid-pager, .ui-jqgrid .ui-jqgrid-toppager input.ui-pg-input {
    font-size: 14px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.ui-jqgrid tr.jqgrow {
    background-color: #eeeeee;
}

.ui-jqgrid-jquery-ui.ui-jqgrid .ui-jqgrid-bdiv tr.ui-row-ltr > td {
    border-color: #eeeeee;
    border-bottom-color: #aaaaaa;
/ / background-color: #ffffff;
}

.ui-jqgrid-toppager {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.ui-state-default.ui-corner-top.ui-jqgrid-hdiv {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.ui-jqgrid .ui-pg-button:not(.ui-state-hover), .jqgrow .ui-jqgrid-actions .ui-pg-div:not(.ui-state-hover) {
    border: none;
}

:hov
.cls
element.style {
    width: 993px;
}

.ui-jqgrid .ui-jqgrid-pager.ui-corner-bottom {
    border: none;
}

#gview_notifications_grid .ui-jqgrid-bdiv {
    overflow-y: auto;
/ / overflow-x: hidden;
}

.ui-widget-content tr.jqgrow {
    background-color: #ffffff;
}

.ui-widget-content tr.jqgrow:hover {
/ / background-color: #cecece;
}

tr.jqgrow td {
    cursor: pointer;
}

#promo_mapping_grid tr.jqgrow td {
    cursor: auto;
}

.ui-jqgrid.ui-widget.ui-widget-content.ui-corner-all {
    border-color: #888888;
    border-width: 1px;
    border-style: solid;
    border-radius: 5px;
}

ui-widget-content jqgrow ui-row-ltr {
    vertical-align: middle;
}

.ui-jqgrid .ui-pg-table td {
    font-weight: 100;
}

.ui-jqgrid .ui-paging-info {
    font-weight: 100;
}

.ui-jqgrid .ui-pager-control {
    margin-top: 3px;
}

.ui-jqgrid .ui-jqgrid-view {
    margin-bottom: -1px;
    font-size: 14px;
}

.ui-jqgrid .ui-pg-input {
    border-radius: 3px;
    height: 20px;
    color: #363636;
}

.ui-jqgrid .ui-jqgrid-hbox {
    margin-left: -1px;
}

.ui-jqgrid tr.jqgrow td.jqgrid-wrap {
    white-space: normal;
}

.ui-jqgrid .ui-jqgrid-hbox .ui-search-toolbar div {
    margin-bottom: 4px;
}

.ui-jqgrid-htable {
    border-collapse: collapse;
}

/*No white border on the table header*/
.ui-th-ltr, .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr {
    border-left: 1px solid;
    border-right: 0 none;
}

ui-jqgrid-labels {
    color: #ffffff;
}

tr.ui-jqgrid-labels {
    height: 40px;
}

tr.ui-search-toolbar {
    display: none;
}

/*add the ids of the Right hand jqgrid table headers here to remove a 1px gap*/
th#my_products_grid_ProductDescription,
th#my_products_grid_LastUpdateDiff,
th#supplier_grid_RequestStatus
{
    border-right: 1px solid #24384a !important;
}

a.clearsearchclass {
    color: #ffffff;
}

.ui-search-input input {
    color: #24384a;
    padding-left: 3px !important;
    padding-right: 3px !important;
    height: 20px !important;
}

.customer_new {
    margin-top: -4px;
    margin-left: 4px;
    position: absolute;
}

.customer-info-box {
    border: 1px #cccccc solid;
    border-radius: 4px;
    padding: 4px;
    margin-top: 8px;
}

.inmodal .modal-header {
    padding: 18px 18px;
    text-align: left;
}

.tooltip {
    z-index: 2080;
}

/*Make blue slabs on Customer/Home page into buttons */
.custom-button:hover, .blue-bg:hover {
    background-color: #186ca0;
    cursor: pointer;
}

.sk-spinner-cube-grid .sk-cube {
    background-color: #0172bc;
}

.mouse_pointer {
    cursor: pointer;
}

/*sweetalert CSS mods....*/
.sweet-alert {
    padding: 12px;
}

.sweet-alert h2 {
    color: #676a6c;
    font-size: 24px;
    text-align: center;
    font-weight: 600;
    text-transform: none;
    position: relative;
    margin: 0px 0px 15px;
    padding: 0;
    line-height: inherit;
    display: block;
}

.sweet-alert p {
    font-size: 14px;
    color: #222222;

}

.sweet-alert .sa-button-container button {
    color: white;
    border: none;
    box-shadow: none;
    font-size: 14px;
    font-weight: 400;
    -webkit-border-radius: 4px;
    padding: 6px 12px;
    margin: 26px 5px 0 3px;
    cursor: pointer;
    line-height: 1.42857143;
    -ms-touch-action: manipulation;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    background-image: none;
    border: 1px solid #0172bc;
    background-color: #0172bc;
    border-radius: 4px;
}

.sweet-alert button:focus {
    outline: none;
    box-shadow: 0 0 2px rgba(128, 179, 235, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.05);
}

.sweet-alert button:hover {
    background-color: #186ca0;
    border: 1px solid #186ca0;
}

.sweet-alert button:active {
    background-color: #186ca0;
    border: 1px solid #186ca0;
}

.sweet-alert button.cancel {
    background-color: #0172bc;
    background-color: #0172bc;
}

.sweet-alert button.cancel:hover {
    background-color: #186ca0;
    border: 1px solid #186ca0;
}

.sweet-alert button.cancel:active {
    background-color: #186ca0;
    border: 1px solid #186ca0;
}

.sweet-alert button.cancel:focus {
    box-shadow: rgba(197, 205, 211, 0.8) 0px 0px 2px, rgba(0, 0, 0, 0.0470588) 0px 0px 0px 1px inset !important;
}

.sweet-alert textarea {
    width: 100%;
    box-sizing: border-box;
    border-radius: 3px;
    border: 1px solid #d7d7d7;
    height: 100px;
    margin-top: 10px;
    margin-bottom: 17px;
    font-size: 12px;
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.06);
    padding: 6px 12px;
    display: block;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }
.sweet-alert textarea:focus {
    outline: none;
    box-shadow: 0px 0px 3px #c4e6f5;
    border: 1px solid #b4dbed; }
.sweet-alert textarea:focus::-moz-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5; }
.sweet-alert textarea:focus:-ms-input-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5; }
.sweet-alert textarea:focus::-webkit-input-placeholder {
    transition: opacity 0.3s 0.03s ease;
    opacity: 0.5; }
.sweet-alert textarea::-moz-placeholder {
    color: #bdbdbd; }
.sweet-alert textarea:-ms-input-placeholder {
    color: #bdbdbd; }
.sweet-alert textarea::-webkit-input-placeholder {
    color: #bdbdbd; }

.sweet-alert textarea::placeholder{
    padding:2px;
}

.sweet-alert .sa-input-error.show{
    display:none!important;
}

.sa-button-container {
    text-align: right;
}

.ui-jqgrid .ui-jqgrid-view button {
    font-size: 14px;
}

.btn {
    padding: 6px 12px;
}

/* summer note buttons */
.modal-footer .btn + .btn {
    margin-left: 7px;
    margin-bottom: 0;
}

/*add the ids of the Right hand jqgrid table headers here to remove a 1px gap*/
th#products_grid_ProductDescription,
th#customer_grid_Permission {
    border-right: 1px solid #24384a !important;
}

.wrapper .ui-widget-content .loading {
    background: #ffffff;
    border: none;
    border-radius: 4px;
}

@media screen and (min-width: 768px) {
    .modal-dialog {
        width: 740px;
    }

}

/*Vesta Mods*/

.dash-cust {
    border-left: solid 6px #337AB7;
    border-radius: 0px;
    background-color: #CECECE;
    color:white;
}

.dash-map {
    border-left: solid 6px #1AB394;
    border-radius: 0px;
    background-color: #CECECE;
    color:white;
}

.dash-img {
    border-left: solid 6px #f8ac59;
    border-radius: 0px;
    background-color: #CECECE;
    color:white;
}

.dash-desc {
    border-left: solid 6px #ED5565;
    border-radius: 0px;
    background-color: #CECECE;
    color:white;
}

/*Hover States*/

.dash-cust:Hover {

    background-color: #337AB7;
}

.dash-map:Hover {

    background-color: #1AB394;
}

.dash-img:Hover {

    background-color: #f8ac59;
}

.dash-desc:Hover {

    background-color: #ED5565;
}

/*Notifications jqgrid css*/
#notifications_grid tr.jqgrow td {
    vertical-align: top !important;
}

/*Style css overide for dashboard*/

.dashboard-header h2 {
    font-size: 50px;
}

.footer {
    border-top: none;
    background: none;
}

/* Display of payment plans */

@media screen and (min-width: 768px) {
    .plan_row {
        display: flex;
    }

    .plan_cell {
        align-items: stretch;
        background-color: white;
        padding: 0;
        height: 100%;
    }
}

@media screen and (max-width: 768px) {

}

/*Make sure when hovering over the wysiwyg no message is showed and dropzone not visible*/
.note-dropzone-message {
    display: none !important;
}

.note-dropzone {
    opacity: 0 !important;
}

/*Increase size of Summernote edit box to make it easier to select */
.note-editable {
    height: 254px;
}

/*Font size increase for notifications panel*/
.nav.navbar-top-links .dropdown-alerts a {
    font-size: 14px;
}

/*Increase width for notifications panel*/
.navbar-top-links .dropdown-messages, .navbar-top-links .dropdown-tasks, .navbar-top-links .dropdown-alerts {
    min-width: 0;
    width: 360px;
}

/*When mouse down and notifications open don't display white background for notification icon*/
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: transparent;
}
 nav ul.metismenu > li {
     border-left: 4px solid #293846;
 }

 .report-progress {
     display: none;
 }

.other-industry-type {
    display: none;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .login-box-welcome {
        margin-top: -50%;
    }
}

.login-box .control-label {
    margin-bottom: 15px;
    text-shadow: 1px 1px #000;
    background-color: rgba(0, 0, 0, .5);
    padding: 10px;
}
.import-additional-stage-td-container {
    max-height: 130px;
    overflow-y: auto;
}

.page-heading{
    margin-top:40px;
}

.previous{
    float:right;
    color:#808285;
    padding-right:10px;
    cursor:pointer;
}

.datepicker_price_summary{
    padding-left:0px;
}

#date_price_summary{
    width:40%;
}

.price-icon{
    font-size:11px;
}