@charset "UTF-8";
audio, canvas, iframe, img, svg, video { vertical-align: middle; }
fieldset { border: 0; margin: 0; padding: 0; }
textarea { resize: vertical; }
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html { -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
body { margin: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
mark { background: #ff0; color: #000; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border: 0; }
svg:not(:root) { overflow: hidden; }
hr { box-sizing: content-box; height: 0; }
pre { overflow: auto; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
legend { border: 0; padding: 0; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }
* { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 62.5%; }
ul, ol { list-style-position: inside; }
img { max-width: 100%; }
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
[class^="icon_"], [class*=" icon_"], .icon { display: inline-block; width: 1em; height: 1em; fill: currentColor; }
[disabled], .disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
.clearfix::before, .row::before, .tabs_head::before, .clearfix::after, .row::after, .tabs_head::after { content: " "; display: table; }
.clearfix::after, .row::after, .tabs_head::after { clear: both; }
.clearfix, .row, .tabs_head { *zoom: 1; }
.table { display: table; }
.tcell { display: table-cell; vertical-align: middle; }
.tc { text-align: center; }
.tl { text-align: left; }
.tr { text-align: right; }
.fl { float: left; }
.fr { float: right; }
.noselect, input[type='checkbox'] + label, input[type='radio'] + label { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.light { font-weight: 300; }
.regular { font-weight: 400; }
.strong { font-weight: 600; }
.italic { font-style: italic; }
.underline { text-decoration: underline; }
.uppercase { text-transform: uppercase; }
.truncate { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
hr { border-top: 1px solid #DBDBDB; border-bottom: 0; border-right: 0; border-left: 0; clear: both; margin: 2rem 0; }
hr.dotted { border-style: dotted; }
hr.dashed { border-style: dashed; }

.update_all_permission{color: #000;}
.devmode{position: fixed; width: 100%; height: 15px; text-align: center; background: red; top: 0; left: 0; color: #fff; font-size: 10px; z-index: 999999999999;}

.row { margin: 0 -1.5rem; }
.row:after { content: ''; display: block; clear: both; }
.row .col_1, .row .col_10, .row .col_11, .row .col_12, .row .col_2, .row .col_3, .row .col_4, .row .col_5, .row .col_6, .row .col_7, .row .col_8, .row .col_9 { float: left; margin: 0 1.5rem; }
.row .col_1 { width: -webkit-calc(100% / 12 - 3rem); width: calc(100% / 12 - 3rem); }
.row .col_2 { width: -webkit-calc(100% / 6 - 3rem); width: calc(100% / 6 - 3rem); }
.row .col_3 { width: -webkit-calc(100% / 4 - 3rem); width: calc(100% / 4 - 3rem); }
.row .col_4 { width: -webkit-calc(100% / 3 - 3rem); width: calc(100% / 3 - 3rem); }
.row .col_5 { width: -webkit-calc(100% / 2.4 - 3rem); width: calc(100% / 2.4 - 3rem); }
.row .col_6 { width: -webkit-calc(100% / 2 - 3rem); width: calc(100% / 2 - 3rem); }
.row .col_7 { width: -webkit-calc(100% / 1.714285714285714 - 3rem); width: calc(100% / 1.714285714285714 - 3rem); }
.row .col_8 { width: -webkit-calc(100% / 1.5 - 3rem); width: calc(100% / 1.5 - 3rem); }
.row .col_9 { width: -webkit-calc(100% / 1.3333333333 - 3rem); width: calc(100% / 1.3333333333 - 3rem); }
.row .col_10 { width: -webkit-calc(100% / 1.2 - 3rem); width: calc(100% / 1.2 - 3rem); }
.row .col_11 { width: -webkit-calc(100% / 1.0909090909091 - 3rem); width: calc(100% / 1.0909090909091 - 3rem); }
.row .col_12 { width: -webkit-calc(100% / 1 - 3rem); width: calc(100% / 1 - 3rem); }

.green_btn {background-color:#009688 !important;}
.green_btn:hover {background-color:#5ab046 !important;}

.order_options:hover .order_icons {display: block !important;}
.order_icons {position: absolute; background: #272727; padding: 0.5rem; right: 6rem; margin-top: -2.7rem;}
.order_icons > a{color:#fff; margin: 0px 2px;}

.pagination { padding: 1rem 0; text-align: center; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.pagination li { display: inline-block !important; padding: 0 !important; margin: .4rem .3rem; list-style: none; }
.pagination li:before { display: none !important; }
.pagination li:after { display: none !important; }
.pagination li a { display: block; min-width: 3.8rem; height: 3.8rem; padding: 0 .5rem; border: 2px solid #253c50; font-size: 1.8rem; line-height: 3.5rem; font-weight: 700; color: #253c50; text-align: center; }
.pagination li a:hover { background-color: #5ab046; color: #fff !important; }
.pagination li.active a { background-color: #5ab046; color: #fff; pointer-events: none; }
.small_btn {max-width: 20rem;}
.colour {display:inline-block; vertical-align:middle; width: 3rem; height: 3rem; border:1px solid #000; border-radius: 50%;background-size:cover;}
.small_height_textarea {min-height: initial !important;}
.ui-sortable-helper td {background: #5ab046;}
.input.flashing {background-color: #5ab046;}
.input:disabled {  cursor: not-allowed; pointer-events: all !important;}

ul.ui-autocomplete {max-width: 30rem; max-height: 20rem; overflow-y: scroll;-webkit-box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);
-moz-box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);
box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);}
ul.ui-autocomplete li {list-style: none;padding-left: 1.2rem;line-height: 3rem; cursor: pointer;background: #f1f1f1;}
ul.ui-autocomplete li:hover {background: #ccc;}
.ui-helper-hidden-accessible {display: none;}


.dialog_emailSanding .form_group,
.dialog_emailSandingOrder .form_group 
{display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;}
.dialog_emailSanding .form_group input,
.dialog_emailSandingOrder .form_group input 
{width: 60%;}
.dialog_emailSanding .form_group .button,
.dialog_emailSandingOrder .form_group .button 
{width: 35%; margin-left: 20px}
.dialog_emailSanding .form_group svg,
.dialog_emailSandingOrder .form_group svg
{font-size: 18px;}





.flex_block{  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}

.flex_block .process_item_sortable{ padding: 1rem .5rem; min-height: 120px;}

/* DASHBOARD */
#dashboard .process_item {display: inline-block; width: calc(100% / 4 - .2rem); padding:  1rem; background: #f9f9f9; margin-bottom: 1rem; margin-right: .2rem;  min-height: 15rem; vertical-align: top;
-webkit-box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);
-moz-box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);
box-shadow: 3px 2px 5px 0px rgba(204,204,204,1);
}
#dashboard .process_item:hover {background: #f3f3f3;}
#dashboard .process_item .title {text-align: center; font-weight: bold;}
#dashboard .process_item ul li, #dashboard .small_section ul li {list-style: none;}

/*#dashboard  ul.aside_ul li .sort_item {display:none;}*/
#dashboard  ul.aside_ul li .sort_item svg{position: relative; top: -.1rem; color: #3d4cf9;    font-size: 1.6rem;}

#dashboard  ul.aside_ul li .alert_message{display: block; width: 100%; font-size: 1.4rem; line-height: 1.5; color: #f44336;}
#dashboard .aside  h3{margin-bottom: 0;}

.modal_process_open{cursor: pointer;}

#dashboard .process_item .eye_icon{position: relative;top: -.1rem; color: #5ab046; font-size: 1.8rem;}
#dashboard .process_item .sort_item svg{position: relative;top: -.1rem; color: #3d4cf9; font-size: 1.6rem;}
.status_item{display: inline-block;}
.label_colour {display: inline-block; width: 1.5rem; height: 1.5rem;border-radius: 50%;background-size: cover; border: 1px solid #272727;vertical-align: middle; margin-right: 0.5rem;}
span.time_total {margin-left: 1rem;color: #da0bca !important;}
span.time_total svg{margin-right: 0.2rem;margin-bottom: 0.2rem;}
.transparent_section {background: transparent;padding: 0; box-shadow: none;}
/* END DASHBOARD */

#subtotal_block {font-size: 1.6rem;color: #3F51B5; }
#subtotal_block span{min-width: 8rem; display: inline-block;font-weight: bold;}
#subtotal_block span.customer_paid{color: green;}

.subtotal_titles {font-size: 1.6rem !important;color: #3F51B5; }
.subtotal_amounts span{min-width: 8rem; display: inline-block;font-weight: bold;font-size: 1.6rem;color: #3F51B5; }
.subtotal_amounts span.customer_paid{color: green;}
.retail_amounts span{color: grey; }

.tr_red td {background:red;}

/* PRINT */
.body_print {background: #fff;}
.body_print .main_heading{border: none; margin-bottom: 0}
.print_table {width: 100%;}
.print_table tbody {border: 1px solid; border-color: #dedede;}
.print_table tr {border-bottom: 1px solid; border-color: #dedede;}
.print_table td{border: 1px solid;border-color: #dedede !important;padding: .8rem 1rem; font-size: 1.3rem;}


#payment_log_wrapper {border:2px solid #f1f1f1;  padding: 1rem; background: #9E9E9E;}
#payment_log_wrapper .button.active{   height: 3.6rem;}
#payment_log_wrapper .button.active:hover{  background-color: #000;}

.icon.icon_star {color: #ff9800;  font-size: 1.3rem !important; margin-right: 1rem; cursor: initial;}

#tab3 .comment_item:last-child {border-bottom: 0;}
.comment_item {border-bottom: 1px dotted #ccc;margin-bottom: 1rem;padding-bottom: 1rem;}
.comment_item h4{margin-bottom: 0;}

aside .additional_menu {display: none;}
aside .additional_menu.show {display: block;}
aside #menu_view_more {background-color: #3d3d3d;}

#pagination_limit {display: inline-block; max-width: 10rem;}

.customer_shortinfo {background: #f3f3f3;padding: 0.8rem;border: 1px solid #eae9e9;}
.customer_shortinfo svg{margin-right: 0.5rem;color: #e91e63;}
.tabs_head .paid{padding: .5rem 2rem;
  background: #4CAF50;
  display: inline-block;
  vertical-align: middle;
  margin-top: .1rem;
  color: #ffff;
  float: right;}

.tabs_head a.red_pulse_btn, .tabs_head a.blue_pulse_btn {color: #fff !important; }
.biggest_btn {font-size: 2.3rem; text-align: center; margin-top: 0.6rem; padding: 0.4rem 1rem; width: 100%; display: block;}
.red_pulse_btn, .blue_pulse_btn {color: #fff !important; font-weight: bold;text-transform: uppercase;
animation-name: backgroundColorPaletteRed;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes backgroundColorPaletteRed {
  0% {
    background-color: red;
  }
  50% {
    background-color: #f44336;
  }
  100% {
    background-color: red;
  }
}


.blue_pulse_btn {color: #fff !important; font-weight: bold;text-transform: uppercase;
animation-name: backgroundColorPalette;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes backgroundColorPalette {
  0% {
    background-color: #003eff;
  }
  50% {
    background-color: #0c205f;
  }
  100% {
    background-color: #003eff;
  }
}



#create_order_btn:disabled {
  cursor: not-allowed;
  pointer-events: all !important;
}
.checkout_warning {color:red; font-weight: bold; text-align: center;}

.disabled_body {pointer-events: none;}
.disabled_body .modal_close{display: none;}

.approved_dealer_text {font-size: 1.6rem; text-align: center;color:#4CAF50;padding-top: 0.6rem;}
.declined_dealer_text {font-size: 1.6rem; text-align: center;color:red;padding-top: 0.6rem;}
.retail_column {display: none;}
.retail_column.active {display: table-cell;}

@media print {
  .body_print .label_colour  {display: none !important;}
}
/* PRINT */
fieldset.fieldset {border:1px solid #c4d0da;padding: 1rem 2rem;}
fieldset.fieldset legend {padding: 0 1rem;}
.remove_item_process {margin-top: -2.7rem;color: red;float:right;}
.icon_eye {color:#5ab046;}
#item_processlist .sort_item {margin-right: 1rem;}

@media screen and (max-width: 550px) { [class*='col_'] { width: 100%; margin-left: 0; } }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: hidden; line-height: 1.6; font-size: 1.5em; font-family: 'Lato', sans-serif; color: #272727; background-color: #f5f5f5; }
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { margin-top: 0; margin-bottom: 2rem; font-weight: 300; display: block; }
h1, .h1 { font-size: 3.6rem; line-height: 1.2; display: block; }
h2, .h2 { font-size: 2.8rem; line-height: 1.25; display: block; }
h3, .h3 { font-size: 2.2rem; line-height: 1.2; display: block; }
h4, .h4 { font-size: 2rem; line-height: 1.35; display: block; }
a { text-decoration: none; color: inherit; -webkit-transition: all .3s; transition: all .3s; }
a:hover { color: #272727; }
.bg_main { background-color: #272727; }
.bg_dark { background-color: #212121; color: #fff; }
.bg_grey { background-color: #f5f5f5; }
.color_main { color: #272727; }
.color_accent { color: #009688; }
.color_red { color: #f44336; }
.color_grey { color: #9e9e9e; }
.color_green { color: #4caf50 !important; }






@-webkit-keyframes flash {
  0% { box-shadow: 0px 2px 10px rgb(229, 5, 43, .3); } 
  50% {  box-shadow: 0px 2px 10px rgb(229, 5, 43, .8); }
  100% { box-shadow: 0px 2px 10px rgb(229, 5, 43, .3); }
}
@keyframes flash {
   0% { box-shadow: 0px 2px 10px rgb(229, 5, 43, .3);} 
  50% {  box-shadow: 0px 2px 10px rgb(229, 5, 43, .8);}
  100% {  box-shadow: 0px 2px 10px rgb(229, 5, 43, .3);}
}

section { padding: 3rem; background-color: #fff; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.15); margin-bottom: 2rem; }
.alert_section {  -webkit-animation: flash linear 2.5s infinite;  animation: flash linear 2.5s infinite; }
.content ul, .content ol, .content table, .content img, .content iframe { margin-bottom: 2rem; }
.content ul:last-child, .content ol:last-child, .content table:last-child, .content img:last-child, .content iframe:last-child { margin-bottom: 0; }
.content p { margin-bottom: 1.5rem; }
.content p:last-child { margin-bottom: 0; }
.content ul { padding-left: 2rem; }
.content a { color: #272727; }
.content a:hover { text-decoration: underline; }

.wrapper { width: 100%; max-width: 1464px; padding: 0 3rem; margin: 0 auto; position: relative; }
.wrapper:after { content: ""; display: table; clear: both; }
.wrapper.small { max-width: 600px; }
section .table { width: 100%; text-align: center; }
section .table a:hover { color: #5ab046; }
section .table a.delete_item:hover { color: red; }
section .table .button { font-size: 1.4rem; height: 3rem; line-height: 3rem; padding: 0 2rem; color: #fff !important; }
section .table .icon { font-size: 2rem; }
section .table thead { border: 1px solid #272727; border-bottom: 0 !important; }
section .table th { font-weight: 500; padding: 1rem 1rem; border-right: 1px solid #3e3e3e; background-color: #272727; color: #fff; }
section .table th:last-child { border-right: 0; }
section .table td { padding: .8rem 1rem; border-right: 1px solid #e1e1e1; font-size: 1.3rem; }
section .table tbody { border-left: 1px solid #D0D0D0; border-bottom: 1px solid #D0D0D0; }
/* section .table tbody tr { border-bottom: 1px solid #D0D0D0; } */

.button { display: inline-block; text-align: center; white-space: nowrap; cursor: pointer; text-decoration: none; height: 38px; line-height: 38px; border-radius: 0; padding: 0 30px; border: 0; background-color: #272727; color: #fff; -webkit-transition: all .3s; transition: all .3s; }
.button:focus { outline: 0; }
.button:hover { background-color: #5ab046; color: #fff; }
.button.primary { background-color: #5ab046; }
.button.primary:hover { background-color: #fff;  color: #000;}
.button.decline { background-color: red; }
.button.decline:hover { background-color: #fff; color: #000; }
.button.outlined { border: 1px solid #272727; background-color: transparent; color: #272727; }
.button.outlined:hover { background-color: #272727; color: #fff; }
.button.flat { font-weight: bold; background-color: rgba(1, 59, 109, 0.2); color: #272727; }
.button.flat:hover { background-color: rgba(1, 59, 109, 0.4); }

.input { box-shadow: none; display: block; width: 100%; height: 38px; border-radius: 0; margin-bottom: 1.5rem; padding: 6px 10px; border: 1px solid #EAE9E9; background-color: #F3F3F3; -webkit-transition: border .3s; transition: border .3s; }
.input:focus { outline: 0; }
.input:focus { border: 1px solid #ccc; }
textarea.input { min-height: 90px; }
select.input { padding: 6px 5px; }
.validate_error { border: 1px solid #e57373 !important; }
::-moz-selection { background: #0156a0; color: #fff; }
::selection { background: #0156a0; color: #fff; }
::-webkit-input-placeholder { color: #9e9e9e; -webkit-transition: all .3s; transition: all .3s; }
::-moz-placeholder { color: #9e9e9e; -webkit-transition: all .3s; transition: all .3s; }
:-ms-input-placeholder { color: #9e9e9e; -webkit-transition: all .3s; transition: all .3s; }
::placeholder { color: #9e9e9e; -webkit-transition: all .3s; transition: all .3s; }
.input:focus::-webkit-input-placeholder { opacity: 0; }
.input:focus::-moz-placeholder { opacity: 0; }
.input:focus:-ms-input-placeholder { opacity: 0; }
.input:focus::placeholder { opacity: 0; }
.placeholder { color: #9e9e9e; }

.ui-datepicker { background-color: #fff; border: 1px solid #ccc; border-radius: 3px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); display: none; margin-top: 4px; max-width: 240px; }
.ui-datepicker table { border-collapse: inherit; padding: 1rem; }
.ui-datepicker a { display: block; float: left; width: 100%; margin-top: .1rem; }
.ui-datepicker a:hover, .ui-datepicker td:hover a { color: #fff; }
.ui-datepicker .ui-datepicker-header { margin-bottom: 4px; text-align: center; background-color: #272727; padding: 1rem; color: #fff; }
.ui-datepicker .ui-datepicker-title { font-weight: 700; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { cursor: pointer; height: 20px; line-height: 1; margin-top: 1px; width: 17px; }
.ui-datepicker .ui-datepicker-prev { float: left; text-align: left; }
.ui-datepicker .ui-datepicker-next { float: right; text-align: right; }
.ui-datepicker .ui-datepicker-prev:before { content: "‹"; font-size: 3rem; line-height: .6; }
.ui-datepicker .ui-datepicker-next:before { content: "›"; font-size: 3rem; line-height: .6; }
.ui-datepicker .ui-icon { display: none; }
.ui-datepicker .ui-datepicker-calendar { table-layout: fixed; width: 100%; }
.ui-datepicker .ui-datepicker-calendar th, .ui-datepicker .ui-datepicker-calendar td { text-align: center; width: 3rem; height: 3rem; }
.ui-datepicker .ui-datepicker-calendar td { border-radius: 50%; -webkit-transition: background-color .3s ease; transition: background-color .3s ease; }
.ui-datepicker .ui-datepicker-calendar td:hover { background-color: #5ab046; cursor: pointer; color: #fff; }
.ui-datepicker .ui-datepicker-calendar td a { text-decoration: none; }
.ui-datepicker .ui-datepicker-today { background-color: #eeeeee; }
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover { background-color: #fff; cursor: default; }

table.tablesorter thead tr .header { background-image: url(/img/bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer; }
table.tablesorter tr:nth-child(even){background-color:#f3f3f3;}
table.tablesorter thead tr .headerSortUp { background-image: url(/img/asc.gif); }
table.tablesorter thead tr .headerSortDown { background-image: url(/img/desc.gif); }

table.tablesorter2 thead tr .header { background-image: url(/img/bg.gif); background-repeat: no-repeat; background-position: center right; cursor: pointer; }
table.tablesorter2 tr:nth-child(even){background-color:#f3f3f3;}
table.tablesorter2 thead tr .headerSortUp { background-image: url(/img/asc.gif); }
table.tablesorter2 thead tr .headerSortDown { background-image: url(/img/desc.gif); }

.clock_timer{color: red}

.upload_row .upload_buttons { margin-top: 2.6rem; }
.upload { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; }
.upload + label { font-size: 1.25rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; display: inline-block; overflow: hidden; padding: 0; margin-bottom: 2rem; border-radius: 3px; border: 1px solid #CCCCCC; background-color: #fff; color: #272727; width: 100%; position: relative; }
.upload:focus + label, .upload.has-focus + label { outline: 1px dotted #000; outline: -webkit-focus-ring-color auto 5px; }
.upload + label .icon { margin-right: 0.5rem; font-size: 1.8rem; margin-top: -.2rem; }
.upload:focus + label, .upload.has-focus + label, .upload + label:hover { outline: none; }
.upload + label span, .upload + label strong { padding: 0.8rem 1.25rem; }
.upload + label span { min-height: 2em; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; vertical-align: top; font-weight: normal; }
.upload + label strong { height: 100%; float: right; color: #fff; background-color: #272727; display: inline-block; -webkit-transition: all .3s ease; transition: all .3s ease; }

.file_deleted { color: #f44336; font-weight: bold !important; position: absolute; left: 0rem; opacity: 0; }
.file_deleted.active { -webkit-animation-name: fileDeleted; animation-name: fileDeleted; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes fileDeleted { 0% { opacity: 0; }
  30% { opacity: 1; }
  70% { opacity: 1; }
  100% { opacity: 0; } }

@keyframes fileDeleted { 0% { opacity: 0; }
  30% { opacity: 1; }
  70% { opacity: 1; }
  100% { opacity: 0; } }

.upload:focus + label strong, .upload.has-focus + label strong, .upload + label:hover strong { background-color: #5ab046; }
.pre_input span { float: right; font-size: 1.9rem; margin-left: .4rem; cursor: pointer; -webkit-transition: all .2s ease; transition: all .2s ease; margin-top: -0.4rem; display: inline-block; color: #616161; -webkit-transform: scale(0); transform: scale(0); }
.pre_input span.active { -webkit-transform: scale(1); transform: scale(1); }
.pre_input .watch_thumbnail { margin-top: -0.3rem; }

input[type='checkbox'], input[type='radio'] { position: absolute; left: -9999px; }
input[type='checkbox'] + label, input[type='radio'] + label { position: relative; padding-left: 3rem; cursor: pointer; display: inline-block; margin-bottom: 1rem; margin-right: 1rem; }
input[type='checkbox'] + label:before, input[type='radio'] + label:before { content: ''; position: absolute; left: 0; top: .1rem; width: 2rem; height: 2rem; border: 1px solid #aaa; background: #fff; border-radius: 3px; -webkit-transition: all .3s ease; transition: all .3s ease; }
input[type='checkbox'] + label:after, input[type='radio'] + label:after { content: '✔'; position: absolute; top: 0.15rem; left: 0.55rem; font-size: 1.4rem; color: #fff; -webkit-transition: all .2s; transition: all .2s; }
input[type='checkbox']:not(:checked) + label:after, input[type='radio']:not(:checked) + label:after { opacity: 0; -webkit-transform: scale(0); transform: scale(0); }
input[type='checkbox']:checked + label:after, input[type='radio']:checked + label:after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
input[type='checkbox']:checked + label:before, input[type='radio']:checked + label:before { background-color: #5ab046; border: 1px solid #5ab046; }

input[type='checkbox']:disabled + label, input[type='radio']:disabled + label {
  cursor: not-allowed;
  pointer-events: all !important;
}


.fixed_footer { position: fixed; bottom: 0; left: 0; width: 100%; }

.dialog_wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: table; vertical-align: middle; display: none; z-index: 500; padding: 4rem 0; }
.dialog_wrapper .main_table { width: 100%; height: 100%; padding-right: 2rem; }
.dialog_wrapper .main_tcell { padding: 0 4rem; }
.dialog { max-width: 350px; margin: 0 auto; background-color: #fff; box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.25); display: none; z-index: 503; position: relative; color: #333; }
.dialog .h2 { padding: 2rem; border-bottom: 2px solid #272727; color: #272727; }
.dialog p { display: block; padding: 0 2rem 2rem; }
.dialog .icon_close { position: absolute; top: -3.5rem; right: -3.5rem; color: #fff; cursor: pointer; font-size: 3.5rem; -webkit-transition: color .3s ease; transition: color .3s ease; }
.dialog .icon_close:hover { color: #009688; }
.dialog .icon_close svg { float: left; }
.dialog_bg { position: fixed; left: 0; top: 0; background-color: rgba(33, 33, 33, 0.55); display: none; width: 100%; height: 100%; }
.dialog_opened { position: fixed; overflow-y: scroll; width: 100%; height: 100%; }
.dialog_opened .dialog_bg { -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.dialog_opened .dialog { -webkit-animation-name: showDialog; animation-name: showDialog; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.dialog_opened .dialog_wrapper { display: block; }
.dialog_scrollable_mobile .dialog_wrapper { width: 100% !important; }
.dialog_scrollable_mobile .main_table { padding-right: 0 !important; }
.dialog_scrollable .dialog_wrapper { overflow-y: scroll; width: calc(100% + 4rem); }



.modal_wrapper.visible, .modal_bg.visible, .modal.visible { display: block; }
.modal_wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; vertical-align: middle; display: none; z-index: 1500; padding: 4rem 0; }
.modal_wrapper .main_table { width: 100%; height: 100%; padding-right: 2rem; }
.modal_wrapper .main_tcell { padding: 0 2rem; }
.modal { max-width: 60rem; margin: 0 auto; padding: 3rem 4.3rem 3.8rem; background-color: rgba(255, 255, 255, 1); border: none; display: none; z-index: 1503; position: relative; }
.modal .modal_title {color: #000; font-size: 2rem; margin-bottom: 2rem; }
.modal p,
.modal ul li,
.modal ol li,
.modal span{color: #000; }
.modal ul li {list-style: none; border-bottom: .1rem solid #000; padding: 1rem;}
.modal ul li .status_ico{display: inline-block; vertical-align:  middle; position: relative; top: -0.4rem;  margin-right: 0.2rem;}
.modal ul li .alert_p{margin: 1rem 0; padding: .5rem 1.2rem; position: relative; color: #fff;}
.modal.large { max-width: 85rem; }
.modal.Xlarge { max-width: 70%; }
.modal.small { max-width: 40rem; }
.modal.Xsmall { max-width: 30rem; }
.modal.fullwidth_modal { max-width: 100%; height: 100%;}
.modal .icon_close { position: absolute; top: -3.5rem; right: -0.5rem; color: #ffffff; cursor: pointer; font-size: 3.5rem; -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; }
.modal .icon_close:hover, .modal .icon_close:focus { color: #000000; }
.modal .icon_close svg { float: left; }
.modal_bg { position: fixed; left: 0; top: 0; background-color: rgba(33, 33, 33, 0.55); display: none; width: 100%; height: 100%; }
.modal_opened { position: fixed; overflow-y: scroll; width: 100%; height: 100%; }
.modal_opened .modal_bg { -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.modal_opened .modal { -webkit-animation-name: showDialog; animation-name: showDialog; -webkit-animation-duration: .3s; animation-duration: .3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.modal_opened .modal_wrapper { display: block; }
.modal_scrollable_mobile .modal_wrapper { width: 100% !important; }
.modal_scrollable_mobile .main_table { padding-right: 0 !important; }
.modal_scrollable .modal_wrapper { overflow-y: scroll; width: -webkit-calc(100% + 4rem); width: calc(100% + 4rem); }

#toast { position: fixed; z-index: 1503; width: 100%; max-width: 280px; left: 2rem; right: 2rem; bottom: 2rem; background-color: #fff; color: #fff; display: none; -webkit-box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.25); box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.25); padding: 1rem 2rem; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
#toast p { display: block; margin-bottom: 0; margin-top: .3rem; color: #fff; font-size: 1.4rem; font-family: "Roboto", sans-serif; }
#toast.error { background-color: rgba(237, 28, 36, 0.8); }
#toast.success { background-color: rgba(90, 176, 70, 0.8); }
.toast_close { position: absolute; color: #ffffff; top: .3rem; right: 1rem; font-size: 2.5rem; cursor: pointer; }
.toast_icon { color: #ffffff; float: left; margin-right: 2rem; font-size: 3rem; }


.status_progress {display: block;  font-size: 0; }
.status_progress span {margin-bottom: .5rem;display: inline-block; padding: .5rem 1rem; color: #fff; font-size: 1.4rem; position: relative; }
.status_progress span small{display: block; }
.status_progress span .icon_info{position: absolute; right: .7rem; top: -.8rem;  color: #fff;}

.alert_content p{display: none;}
.alert_content p.visible:last-child{display: block;}
.alert_content p.active{display: block;}
.alert_content .alert_color_0 { background-color: #A0A0A0!important; }
.alert_content .alert_color_1 { background-color: #03a753!important; }
.alert_content .alert_color_2 { background-color: #e3ac1f!important; }
.alert_content .alert_color_3 { background-color: #ff1212!important; }
.alert_content .alert_color_4 { background-color: #1724a5!important; }
.alert_content .alert_color_5 { background-color: #ff1212!important; }
.alert_content .alert_color_6 { background-color: #424242!important; }


.status_progress .progress_0 { background: #A0A0A0; }
.status_progress .progress_1 { background: #03a753; }
.status_progress .progress_2 { background: #e3ac1f; }
.status_progress .progress_3 { background: #ff1212; }
.status_progress .progress_4 { background: #1724a5; }
.status_progress .progress_5 { background: #ff1212; }
.status_progress .progress_6 { background: #424242; }


@-webkit-keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

@-webkit-keyframes showDialog { 0% { opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0); } }

@keyframes showDialog { 0% { opacity: 0;
    -webkit-transform: translateY(40px);
            transform: translateY(40px); }
  100% { opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0); } }

.login_page { background-image: url(/img/banner_image.jpg); background-size:cover; height: 100vh; color: #fff; }
.login_page.front_login { background-image: none; background-color:black; }

.login_page .table { height: 100%; width: 100%; text-align: left !important; }

.login_page h1 { text-align: center; text-transform: uppercase; position: absolute; top: -7rem; color: #B2BBBF; left: 0; font-weight: bold; text-shadow: 0px 2px 5px #C6C8CC; opacity: 0; }

.login_page input { background-color: #A7AEB3; border: 1px solid #BEC1C1; padding-left: 3rem;   color: #1b1b1b; font-weight: bold;}

.login_page span { display: block; margin-bottom: .1rem; }

.login_page .validate_error { border-color: #EFBABA !important; }

.login_page .button { background-color: #5ab046; border-radius: 50%; padding: 0; width: 6rem; height: 6rem; position: absolute; right: -3.3rem; top: 50%; margin-top: -3rem; font-size: 3rem; line-height: 1; box-shadow: 0px 2px 20px rgba(134, 124, 124, 0.22); opacity: 0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; }

.login_page .button:hover { background-color: #3e842d; }

.login_page .button svg { font-size: 3.7rem; }

.login_input { position: relative; }

.login_input svg { position: absolute; top: 0.8rem; left: 0.6rem; }

.login_form { max-width: 450px; margin: 0 auto; background-color: rgba(142, 142, 142, 0.3); padding: 1rem; position: relative; }

.form_inner { padding: 3rem 5rem; background-color: rgba(28, 28, 28, 0.2); }

aside { position: fixed; left: 0; top: 0; background-image: linear-gradient(to right top, #1c1b1b, #181718, #141414, #0f0f0f, #090909);height: 100vh; color: #fff; width: 23rem; overflow: hidden; z-index: 2; }

aside h2 { padding: 2.9rem 3rem; text-transform: uppercase; font-size: 1.6rem; box-shadow: 0px 1px 39px #35526B; color: #5ab046; font-weight: 500; }

aside li { display: block; position: relative; overflow: hidden; }

aside li svg { font-size: 2rem; float: left; margin-top: 0.25rem; }

aside li .icon_agent { font-size: 1.7rem; margin-top: 0.4rem; margin-left: 0.2rem; }

aside li span { display: inline-block; float: left; width: 2rem; text-align: center; margin-right: 1.5rem; color: #5ab046; -webkit-transition: all .3s; transition: all .3s; }

aside ul a { display: block; padding: 1rem 3rem; position: relative; z-index: 2; overflow: hidden; }
aside ul li ul li a { display: block; padding: 0rem 0rem 0rem 6.5rem; position: relative; z-index: 2; overflow: hidden; }

aside ul a:hover, aside ul .active { color: #fff; background-color: #5ab046; }

aside ul a:hover span, aside ul .active span { color: #fff; }

.exit { position: absolute; bottom: 4rem; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

.exit:hover { color: #fff; }

.exit:hover:after { width: 95px; background-color: #5ab046; }

.exit:after { content: ''; position: absolute; left: -1.3rem; top: -2px; height: 4.2rem; width: 4.2rem; border-radius: 200px; background-color: #e91e63; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

.exit span:first-child { position: relative; z-index: 2; display: inline-block; font-size: 2rem; text-align: center; }

.exit span:last-child { position: relative; z-index: 2; text-transform: uppercase; font-size: 1.4rem; display: inline-block; margin-left: 1.4rem; -webkit-transform: translateY(1px); transform: translateY(1px); }

main { margin-left: 23rem; padding: 2rem 0; }

.main_heading { margin-bottom: 2rem; color: #0f3a5f; padding-bottom: 2rem; border-bottom: 1px solid #E4E4E4; }

.main_heading:first-letter { color: #272727; }

.small_section .button { width: 100%; }

.small_section .input { margin-bottom: 0; }

.small_section h2 { font-size: 2rem; line-height: 1; }

._th { cursor: pointer; }

th .icon_sort { position: absolute; right: .5rem; top: 1.3rem; }

.add_new_button .button { margin-left: 1rem; }

.add_new_button svg { font-size: 2rem; float: left; margin-right: 0.7rem; margin-top: 0.9rem; }

.main_buttons { position: absolute; top: 0; right: 3rem; }

.hidden_section { display: none; }

.td_textarea { position: relative; padding: 0 !important; }

.td_textarea .input {top: 0; left: 0; min-height: 100%; height: 6rem; margin-bottom: 0; border: 0; }

.bread_crumbs { margin-bottom: 1.8rem; position: relative; display: inline-block; }

.bread_crumbs a { display: inline-block; margin-right: 1rem; float: left; position: relative; z-index: 2; }

.bread_crumbs svg { float: left; margin-right: 1rem; margin-top: 0.6rem; color: #B9B9B9; position: relative; z-index: 2; }

.bread_line { position: absolute; left: 0; width: 0; height: 67px; top: -20px; background-color: #CFE0EF; }

.bread_second_line { position: absolute; left: 0; width: 0; height: 5px; bottom: -23px; background-color: #0a8cfd; z-index: 1; }

.bread_item { -webkit-transition: color 0.3s; transition: color 0.3s; }

.tabs { margin-bottom: 1.5rem; }

.tabs_body { border-top: 0 !important; border: 1px solid #e0ecf7; }

.tab { display: none; padding: 2rem; }

.tabs_head { background-color: #F3F3F3; width: 100%;}

.tabs_head a { display: inline-block; float: left; padding: 0.5rem 1.2rem; background-color: #C4E2DF; border: 1px solid #e0ecf7; border-left: 0 !important; color: #333 !important; }

.tabs_head a:first-child { border-left: 1px solid #e0ecf7 !important; }

.tabs_head a.active { background-color: #5ab046 !important; color: #fff !important; font-weight: bold; border-bottom: 1px solid transparent !important; }

.tabs_head a:hover { background-color: #e0ecf7; }

.category_star svg { font-size: 3rem !important; display: inline-block; margin-top: .1rem; }
.icon_exchange {-webkit-transition: color 0.3s; transition: color 0.3s;}
.icon_exchange:hover {color: red; cursor: pointer;}

.validate_form .label {font-size: 1.3rem;display: block;}
.find_form {width: 30rem;display: inline-block;}
.find_form .input{max-width: 20rem;display: inline-block;background: #fff;}

.pagination { text-align: center; }
.pagination .pagi { display: inline-block; border: 1px solid #e0e0e0; -webkit-transition: all .2s ease; transition: all .2s ease; margin: 0 .3rem; border-radius: 2px; padding: .3rem 1rem; }
.pagination .pagi.active, .pagination .pagi:hover { border: 1px solid #529044; background-color: #5ab046; color: #fff; }
.pagination .pagi .icon {font-size: 1.2rem;  margin-top: -0.5rem;}

.rotate180 {transform: rotate(180deg);}

@media screen and (max-width: 450px) { html { font-size: 56%; } }

@media screen and (max-width: 550px) { h1, .h1 { font-size: 2.6rem; }
  h2, .h2 { font-size: 2.2rem; }
  h3, .h3 { font-size: 1.9rem; }
  h4, .h4 { font-size: 1.7rem; } }

  
.tablesorter table {
    max-width: 250px;
    border: none;
    box-shadow: none;
}
section .tablesorter table td, section  .tablesorter table tr, section .tablesorter table tbody {text-align: center; border: none !important; padding: 3px; font-size: 1.2rem; vertical-align: top;}
section .tablesorter table td:nth-child(2) {color:#5ab046;}

.loginlogo{width: 100%; position: relative; text-align: center; margin-top: -30px;}
.loginlogo img{width: 230px;}
.innerlogo{width: 160px; margin: 15px;}

.togle_on_hover {position: absolute; width: 200px; z-index:9; -webkit-transition: all 0.3s; transition: all 0.3s;}
.togle_on_hover:hover {height: 200px;}
.destination option:first-child {margin-bottom: 1.2rem;}
.toggle_menu svg {position: absolute;right: 0.3rem; top: 0.3rem; height: 3rem;width: 3rem;color: #5ab046;}
.toggle_menu svg:hover {color:#fff;}
.hide_menu {width: 4rem;padding-top: 4rem;}
.hide_menu div, .hide_menu .innerlogo {display: none;}
.hide_menu ul a {padding: 1rem;}
.full_main {margin-left: 2rem;}
.order_cancelled {background: #d85353 !important;	color: #fff;text-decoration: line-through;}
.order_refund {background: #e57373 !important;  color: #fff;}
.order_hold {background: #FFEB3B !important;}
.show_remarks {  position: absolute; background: #fff; margin-top: -7rem; padding: 1rem; border: 2px solid;}
.icon {cursor: pointer;}
.bulk_remove {background-color: #F44336 !important;color: #fff !important; display: none;}


@media screen and (max-width: 1400px){
#dashboard .process_item{width: 32%}
}
@media screen and (max-width: 1300px){
#dashboard .process_item{width: 49%}
}