@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Black.woff2') format('woff2'),
        url('../fonts/Inter-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Bold.woff2') format('woff2'),
        url('../fonts/Inter-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-ExtraBold.woff2') format('woff2'),
        url('../fonts/Inter-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-ExtraLight.woff2') format('woff2'),
        url('../fonts/Inter-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Medium.woff2') format('woff2'),
        url('../fonts/Inter-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Light.woff2') format('woff2'),
        url('../fonts/Inter-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-SemiBold.woff2') format('woff2'),
        url('../fonts/Inter-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Thin.woff2') format('woff2'),
        url('../fonts/Inter-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Regular.woff2') format('woff2'),
        url('../fonts/Inter-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../fonts/GLYPHICONSHalflings-Regular.woff2') format('woff2'),
        url('../fonts/GLYPHICONSHalflings-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}










main {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

input.hamburger {
  display: none;
}
input.hamburger:checked ~ label > i {
  background-color: transparent;
  transform: rotate(90deg);
}
input.hamburger:checked ~ label > i:before {
  transform: translate(-50%, 0%) rotate(45deg);
}
input.hamburger:checked ~ label > i:after {
  transform: translate(-50%, 0%) rotate(-45deg);
}
input.hamburger:checked ~ label > div::after {
  width: 100%;
}
input.hamburger:checked ~ label > div::before {
  width: 0;
}


.checkboxs input[type="checkbox"] {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}

.checkboxs label {
  position: relative;
  cursor: pointer;
}

.checkboxs label:before {
  content:'';
  -webkit-appearance: none;
  background-color: transparent;
  border: 1px solid #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
  padding: 7px;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  cursor: pointer;
  margin-right: 5px;
}
.checkboxs input[type="checkbox"]:checked + label:before
{
	background:#fff;
}
.checkboxs input[type="checkbox"]:checked + label:after {
  content: '';
  display: block;
  position: absolute;
     top: 7px;
    left: 6px;
    width: 5px;
    height: 9px;
    border: solid #124634;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.ui-autocomplete {
    max-height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
    top: 65px;
    left: 15px;
}

.pop:before {
    content: '';
    width: 100%;
    background: #124634;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
}
.closeme:before {
    content: "";
    width: 100%;
    height: 70px;
    position: absolute;
    background: #104533;
    top: 0;
    left: 0;
    z-index: -1;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
.ui-timepicker-standard .ui-menu-item {
    text-align: left;
    font-size: 14px;
}
.fas {
    font: normal normal normal 17px/1 'FontAwesome';
}
.green-text label {
    margin-bottom: 0px;
    font-size: 14px;
}
.green-text {
    color: #104533;
    font-size: 14px;
}
.over-lay-div {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    display: none;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.69);
}
.loader {
    background: url(../images/loder.svg)no-repeat;
    width: 50px;
    height: 50px;
    margin: 20% auto;
}
.loader::after {
        content: " Please wait, processing....";
        font-size: 16px;
        color: #000;
        position: relative;
        top: 13px;
        left: 50px;
        right: 0px;
        width: 228px;
        display: block;
    }


.btn {
    background: #104533;
    margin: 5px 0px;
    font-size: 12px;
    border-radius:8px;
    color: #fff;
	width:100%;
    text-align: center;
    padding:10px 10px; border: 0;
}
.v-align{align-items: center;}
.v-align label{ margin:0px;}
table tr td select {
    height: 25px;
    padding-right: 30px !important;
}
select {
    -moz-appearance: none; /* Firefox */
    -webkit-appearance: none; /* Safari and Chrome */
    appearance: none;
    border-radius: 5px;
    border: 1px solid #ccc;
    padding-left: 10px;
    height: 34px;
    margin: 10px 0px;
    background: url(../images/select-arrow.svg) no-repeat right;
    -webkit-appearance: none;
    background-position-x: calc(100% - 12px);
    width: 100%;
}
.popup-box .control-label {width:100%; display:block;}
.popup-box .select2-container {    width: 100% !important;}
.popup-box .select2-container .select2-selection--single .select2-selection__rendered {
    padding-right: 32px;    padding-top: 4px;}
.popup-box .select2-search__field:focus-visible {    border: 0px !important;    outline: 0;}
.popup-box input[type="search"]:focus-visible {    border: 0px !important;    outline: 0;}
.popup-box .select2-container--default .select2-selection--single .select2-selection__arrow {    display: none;}
.select2-results__option {    padding: 6px 6px 6px 16px !important;}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {  background-color: #0a6a46 !important;}
.popup-box .select2-container .select2-selection.select2-selection--single {
    -moz-appearance: none; /* Firefox */
    -webkit-appearance: none; /* Safari and Chrome */
    appearance: none;
    border-radius: 5px;
    border: 1px solid #ccc;
    padding-left: 10px;
    height: 40px;
    margin: 0px;
    background: url(../images/select-arrow.svg) no-repeat right;
    -webkit-appearance: none;
    background-position-x: calc(100% - 12px);
    width: 100%;
}



.select-box {
    -moz-appearance: none; /* Firefox */
    -webkit-appearance: none; /* Safari and Chrome */
    appearance: none;
    background: url(../images/select-arrow.svg) no-repeat right;
    -webkit-appearance: none;
    background-position-x: calc(100% - 12px);
}


select:focus-visible{outline:0px;}
input[type="radio"]:checked {
 background:#114634;
}

/* Checkbox element, when checked */
input[type="checkbox"]:checked {
 background:#114634;
}

.form-input {
	width:100%;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    height: 35px;
    padding: 5px 10px;
    margin: 10px 0px;
}
.form-input:focus-visible{outline:0px;}
label { font-size:12px;}
label.hamburger {
  z-index: 9999;
  position: relative;
  display: block;
  height: 50px;
  width: 50px;
}
label.hamburger:hover {
  cursor: pointer;
}
label.hamburger > div {
  font-size: 0.8em;
}
label.hamburger > div::after, label.hamburger > div::before {
  top: 100%;
  width: 100%;
  text-align: center;
  position: absolute;
  overflow: hidden;
  transition: width 0.25s 0.35s, color 0.45s 0.35s;
}
label.hamburger > div::after {
  content: "CLOSE";
  right: 0;
  width: 0;
}
label.hamburger > div::before {
  content: "MENU";
  left: 0;
}
label.hamburger > i {
  position: absolute;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  top: 50%;
  background-color:#000;
  pointer-events: auto;
  transition-duration: 0.35s;
  transition-delay: 0.35s;
}
label.hamburger > i:before, label.hamburger > i:after {
  position: absolute;
  border-radius: 2px;
  display: block;
  width: 100%;
  height: 2px;
  left: 50%;
  background-color: #000;
  content: "";
  transition: transform 0.35s;
  transform-origin: 50% 50%;
}
label.hamburger > i:before {
  transform: translate(-50%, -14px);
}
label.hamburger > i:after {
  transform: translate(-50%, 14px);
}

html {
  font-family: "Inter", sans-serif;
}

body {
	  font-family: "Inter", sans-serif;
  margin: 0 auto;font-size: 14px;
  font-weight:400;
  background-color:#FAFAFA;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.main-wraper {
    width: 70%;
}
.primnav li img.active{display:none;}
.primnav li.active img.active{display:inline-block;}
.primnav li.active img{display:none;}

.primnav li img.active{display:none;}
.primnav li:hover img.active{display:inline-block;}
.primnav li:hover img{display:none;}

.primnav li.active {
  background-color: #124634;
  background-color: #124634;border-radius: 10px; 
  filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, 0.35));
}
.primnav li ul li.active {
    background-color: #ae862e;
    background-color: #ae862e;
    border-radius: 10px;
    filter: none;
    padding: 15px 8px;
}
.primnav li.active a{color:#fff;}
.primnav expand:hover, .primnav li:hover {
  background-color: #124634;
  background-color: #124634;border-radius: 10px; 
  filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, 0.35));
}
.arrow {
  border: solid black;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
}

.right {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.left {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.up {
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}

.down {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
.primnav ul .sub-menu {
    display: flex;
    height: auto;
    min-height: 40px;
    flex-direction: column;
    align-items: flex-start;
    padding-top: 8px;
}

.primnav ul li ul {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
    margin: 5px 0px 15px 0px;
    width: 100%;
    overflow: hidden;
    display: none;
}
.primnav ul .sub-menu .menu-arrow {
    position: absolute;
    right: 5px;
    top: 9px;
    background: url(../images/select-arrow.svg) no-repeat center center;
    width: 25px;
    height: 25px;
    transform: rotate(270deg);
}
.primnav ul .sub-menu.su-active .menu-arrow {
    transform: rotate(0deg);
}
    .primnav ul .sub-menu.su-active {
    padding-top: 8px;
    background-color: #124634;
    border-radius: 10px;
}
.primnav li.sub-menu.su-active img {display:none;}
.primnav li.sub-menu.su-active img.active{display:inline-block;}
.primnav ul .sub-menu.su-active a{color:#fff;}
.primnav ul .sub-menu.su-active ul li.active a {
    border-bottom: 0px solid #124634;
}
.primnav ul .sub-menu.su-active ul li a {
    color: #fff;
    white-space: normal;
    font-size: 14px;
    border-bottom: 1px solid #124634;
}
.primnav ul .sub-menu ul li a {
    font-size: 14px;
}

.action-bu {
    padding: 5px;
    box-sizing: content-box;
    cursor: pointer;
}
    .action-bu:hover {
        background: #ae862e52;
        padding: 5px;
        box-sizing: content-box;
        border-radius: 5px;
    }
    .primnav ul li ul li {
        margin: 5px 5px 5px 33px;
        filter: none;
        height: 20px;
        width: 80%;
    }
.primnav ul li ul li:hover{background:none; color:#fff;}
.primnav ul .sub-menu.su-active ul li:hover a {
    border-bottom: 1px solid #ccc;
}
input.hamburger:checked ~ nav.primnav ul .sub-menu .menu-arrow{display:none}
.profile-wrap .head-copy {
    margin: 32px 5px 40px 0px;
}
.l-panel.profile .form-area {
    width: 50%;
    display: contents;
}
.l-panel.profile {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.primnav {
    position: relative;
    z-index: 9;
    height: 58px;
    margin: 20px;
    width: 100vw;
    font-size: 0.8em;
    text-transform: uppercase;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    transition: 0.6s;
    box-sizing: border-box;
    margin-bottom: 0px;
}
@media (min-width: 650px) {
  .primnav {
    height: auto;
    width: 20%; max-width:300px; border-radius: 5px;
    transition: 0.6s ;
	filter: drop-shadow(1px 0px 8px rgba(0, 0, 0, 0.15));
  }
}
.primnav > ul {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;    margin: 15px 10px;
}
.primnav li {
    font-weight: 400;
    position: relative;
    margin: 10px 10px;
    height: 40px;
	display: flex;padding-left: 7px;
    align-items: center; cursor:pointer;
	  color: #000000;
}

.primnav li img{
	margin-right: 15px;
    width: auto;
	max-width:19px;
}
.primnav li .tag {
  background-color: #005aa3;
  background-color: rgba(0, 112, 204, 0.8);
  color: rgba(255, 255, 255, 0.8);
  color: #e6e6e6;
  color: rgba(255, 255, 255, 0.9);
  padding: 0 0.5em;
  border-radius: 2em;
  margin-left: auto;  
  margin-right: 0.75em;
}

.primnav li a {
    position: relative;
    cursor:pointer;
    align-items: center;
    white-space: nowrap;
    color: #000000;
    width: 100%;
    text-decoration: none;
    font-size: 16px;
    text-transform: capitalize;
}

    .primnav li:hover a {
        color: #fff !important;
    }


    .primnav li a:hover {
        color: #fff !important;
    }

.primnav .icon {
  height: 20px;
  flex-shrink: 0;
  width: 20px;
  padding: 19px;
  margin-right: 5px;
  padding-bottom: 15px;
  color: #e6e6e6;transition: 0.6s;
  color: rgba(255, 255, 255, 0.9);
}
.secnav {
  margin-left: 63px;
  border-left: 1px solid black;
  border-left-color: #0065b8;
  border-left-color: rgba(0, 112, 204, 0.9);
  overflow: hidden;
}
.secnav li {
  color: #e6e6e6;
  color: rgba(255, 255, 255, 0.9);
  max-height: 100px;
  transition: max-height 0.1s;
}
@media (min-width: 650px) {
  .secnav li {
    max-height: 0px;
    transition: max-height 0.5s 0.5s;
  }
}
.secnav li a {
  text-transform: initial;
  display: block;
  color: inherit;
  padding: 0.75em 10px;
}

user {
  padding: 5px;
  padding-bottom: 3px;
  flex-shrink: 0;
  position: fixed;
  font-weight: 400;
  right: 0;
  color: white;
  color: rgba(255, 255, 255, 0.9);
  z-index: 99999;
}
user > section {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
}
user > section > section {
  display: flex;
  flex-direction: column;
  white-space: nowrap;
}
user img {
  height: 51px;
  width: 48px;
  -webkit-clip-path: circle(50% at 50% 50%);
          clip-path: circle(50% at 50% 50%);
  margin-left: 10px;
  min-height: 51px;
  min-width: 48px;
  align-items: flex-end;
}
user name {
  font-weight: 400;
}
user actions {
  padding: 0.1em 0;
  font-size: 0.8em;
  display: flex;
  justify-content: flex-end;
}
user actions a {
  padding: 0 0.5em;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
}
user actions a:last-child {
  padding-right: 0;
}

content {
  
  color: rgba(255, 255, 255, 0.9);
  font-size: 8vw;
  letter-spacing: 1px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #FAFAFA;
  height: 100%;
  padding-top: 58px;
  box-sizing: border-box;
  position: relative;
}
@media (min-width: 650px) {
  content {
    padding-left: 58px;
    padding-top: 0;
  }
}

.features {
  
  font-size: 1rem;
  text-transform: uppercase;
}
.features li {
  width: 100%;
  text-align: center;
  padding: 0.25em;
}

/**
    SCROLLBAR STYLE FOR IE
*/
body {
  scrollbar-base-color: #0070cc;
  scrollbar-3dlight-color: #fff;
  scrollbar-highlight-color: #0070cc;
  scrollbar-track-color: #0070cc;
  scrollbar-arrow-color: #0070cc;
  scrollbar-shadow-color: #0070cc;
  scrollbar-dark-shadow-color: #0070cc;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

.icon {
  display: inline-block;
  width: 5vw;
  height: 4vw;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}

/** hamburger */
input.hamburger {
  display: none;
}
input.hamburger:checked ~ nav.primnav {  height:600px;}
@media (min-width: 650px) {
    input.hamburger:checked ~ nav.primnav .sub-menu.su-active:hover {
        filter:none;
    }
    input.hamburger:checked ~ nav.primnav .su-active ul {
        display: block;
        position: fixed;
        z-index: 999;
        bottom: -25px;
        width: 200px;
        height: auto;
        top: auto;
        background: #124634;
        left: 20px;
        border-radius: 5px;
    }

  input.hamburger:checked ~ nav.primnav {
    width: 71px;
    transition: 0.6s;
  }
  input.hamburger:checked ~ nav.primnav > ul {
    overflow-x: visible;
  }
   input.hamburger:checked ~ nav.primnav i {
     transform: rotate(-45deg);
	 margin-left: -2px;
  }
  
  /* Hide text when collapsed but keep icons visible */
  input.hamburger:checked ~ nav.primnav li a {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    overflow: visible;
    padding: 0;
    min-width: 0;
  }
  
  /* Prevent list items from clipping icons when collapsed */
  input.hamburger:checked ~ nav.primnav ul li {
    overflow: visible;
  }
  
  /* Ensure regular icons are visible when collapsed (for inactive items) */
  input.hamburger:checked ~ nav.primnav li:not(.active) img:not(.active) {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-right: 0;
    max-width: 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: auto;
    text-indent: 0;
    position: relative;
    z-index: 1;
    flex-shrink: 0;
  }
  
  /* Hide regular icon for inactive items when collapsed */
  input.hamburger:checked ~ nav.primnav li:not(.active) img.active {
    display: none !important;
  }
  
  /* Ensure active icons are visible when collapsed (for active items) */
  input.hamburger:checked ~ nav.primnav li.active img.active {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-right: 0;
    max-width: 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: auto;
    text-indent: 0;
    position: relative;
    z-index: 1;
    flex-shrink: 0;
  }
  
  /* Hide regular icon for active items when collapsed */
  input.hamburger:checked ~ nav.primnav li.active img:not(.active) {
    display: none !important;
  }
}
@media (min-width: 650px) {
  input.hamburger:checked ~ nav.primnav .secnav > li {
    max-height: 100px;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(1) {
    transition: max-height 0.5s 0.67s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(2) {
    transition: max-height 0.5s 0.69s ;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(3) {
    transition: max-height 0.5s 0.71s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(4) {
    transition: max-height 0.5s 0.73s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(5) {
    transition: max-height 0.5s 0.75s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(6) {
    transition: max-height 0.5s 0.77s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(7) {
    transition: max-height 0.5s 0.79s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(8) {
    transition: max-height 0.5s 0.81s;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(9) {
    transition: max-height 0.5s 0.83s ;
  }
  input.hamburger:checked ~ nav.primnav .secnav > li:nth-child(10) {
    transition: max-height 0.5s 0.85s;
  }
}
input.hamburger:checked ~ label > i {
  background-color: transparent;
  transform: rotate(90deg);
}
input.hamburger:checked ~ label > i:before {
  transform: translate(-50%, -50%) rotate(45deg);
}
input.hamburger:checked ~ label > i:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
input.hamburger:checked ~ label close {
  color: rgba(255, 255, 255, 0.8);
  width: 100%;
}
input.hamburger:checked ~ label open {
  color: rgba(0, 0, 0, 0);
  width: 0;
}

label.hamburger {
  z-index: 9999;
  position: relative;
  display: block;
  height: 24px;
  width: 24px;
}
label.hamburger:hover {
  cursor: pointer;
}
label.hamburger text close,
label.hamburger text open {
  text-transform: uppercase;
  align-text: center;
  position: absolute;
  transform: translateY(24px);
  text-align: center;
  overflow: hidden;
  transition: width 0.25s 0.35s, color 0.45s 0.35s;
  font-size: 6px;
}
label.hamburger text close {
  color: rgba(255, 255, 255, 0.8);
  right: 0;
  width: 0;
}
label.hamburger text open {
  color: rgba(255, 255, 255, 0.8);
  width: 100%;
}
label.hamburger > i {
  position: absolute;
  width: 100%;
  height: 2px;
  top: 50%;
  background-color:#000;
  pointer-events: auto;
  transition-duration: 0.35s;
  transition-delay: 0.35s;
}
label.hamburger > i:before, label.hamburger > i:after {
  position: absolute;
  display: block;
  width: 100%;
  height: 2px;
  left: 50%;
  background-color: #000;
  content: "";
  transition: transform 0.35s;
  transform-origin: 50% 50%;
}
label.hamburger > i:before {
  transform: translate(-50%, -7px);
}
label.hamburger > i:after {
  transform: translate(-50%, 7px);
}

label.hamburger {
 position: relative;
  top: 14px;
  left: 17px;
}

.tabs {
 
  text-transform: uppercase;
  font-size: 1rem;
  position: fixed;
  top: 58px;
  left: 0;
  background-color: #007ee6;
  border-bottom: 1px solid #0062b3;
  width: 100vw;
  box-sizing: border-box;
}
@media (min-width: 650px) {
  .tabs {
    padding-left: calc(58px + .5rem);
    top: calc(58px - 3em);
    background-color: #0070cc;
    border: 0;
  }
}
.tabs > ul {
  display: flex;
  justify-content: space-around;
  overflow-x: auto;
  flex-wrap: wrap;
}
@media (min-width: 650px) {
  .tabs > ul {
    justify-content: flex-start;
  }
}
.tabs .tab {
  font-weight: 300;
  font-size: 0.7em;
  padding: 1em 0.75em;
  white-space: nowrap;
  flex-shrink: 0;
  display: block;
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
}
.tabs .tab:hover {
  background-color: #0062b3;
  cursor: pointer;
}















/* Custom green checkbox */
input[type="checkbox"].completed-checkbox {
    accent-color: #00703c;
    margin-top:1px;
}
.align-checkbox {
    display: flex;
    align-items: center;
    margin-top: 10px;
}

    .align-checkbox label {
    margin-bottom: 0;
    margin-right: 8px;
    }

.barcode {
    float: right;
    cursor: pointer;
    width: 111px;
    margin-top:-50px;
}

.corporate-header {
    display: flex;
    height: 58px;
}

.corporate-header .topbar {
    min-height: 60px;
    position: fixed;
    z-index: 99;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
}
.corporate-header .topbar .flex-bx {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    min-height: 60px;
    max-height: 60px;
    border-bottom: 1px solid #E6E6E6;
    overflow: visible !important;
}
.corporate-header .shop-menu-btn {
    display: none;
}
.corporate-header .topbar .flex-bx a {
    padding: 20px 20px;
    max-height: 59px;
    height: 59px;
}
.corporate-header .topbar .flex-bx a {
  
    text-transform: none; 
    font-style: normal;
     font-weight: 500;
    color: #000;
    text-decoration: none;   
    flex-shrink: 1;
    font-size: 14px;
    min-height: 58px;
}
.sp-border{ border-right: 1px solid #E6E6E6;}
.corporate-header .topbar .flex-bx .navbar {
    flex: 1 1 auto;
    padding: 0;
    height: 100%;
}
.corporate-header .topbar .flex-bx .navbar .navbar-primary {
    display: flex;
	justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 100%;
    transition: transform 0.2s cubic-bezier(0.19, 1, 0.22, 1),
                -webkit-transform 0.2s cubic-bezier(0.19, 1, 0.22, 1);
}

.substitutes-top .select2-container--default .select2-selection--single {
    display: flex;
    align-items: center;
    height: 40px;
    background: #fff0 url(../images/select-arrow.svg) no-repeat right;
    -webkit-appearance: none;
    background-position-x: calc(100% - 12px);
}
.required {
    color: red;
    margin-left: 5px;
}
.substitutes-top .select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none;
}
    table.dataTable {
        border: 1px solid #ddd;
        font-size: 14px;
        order: 3;
        border-spacing: 0;
        margin-top: 20px !important;
    }
[type="search"] {    outline: 0px solid #ccc;}
.dataTable .odd {    background: #F5F5F5 !important;}
.dataTable .even {    background: #fff !important;}
.table-striped tbody tr:nth-of-type(odd) {    background: #F5F5F5 !important;}
.table-striped tbody tr:nth-of-type(even) {    background: #fff !important;}
table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected {
    background: #ae862eab !important;
}
table.dataTable.display tbody > tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody > tr.even.selected > .sorting_1 {
    background: #ae862eab !important;
}
table.dataTable.display tbody > tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody > tr.odd.selected > .sorting_1 {
    background: #ae862ecc !important;
}
table.dataTable.display tbody > tr.selected:hover > .sorting_1, table.dataTable.order-column.hover tbody > tr.selected:hover > .sorting_1 {
    background: #ae862eab !important;
}
.table.dataTable td {
    font-weight: 500;
    vertical-align: middle !important;
    font-size: 12px;
}
.dataTables_wrapper .dt-buttons .mRightExport, .dataTables_wrapper .dt-buttons .mRightExport:hover, .dataTables_wrapper .dt-buttons .mRightExport:focus, .dataTables_wrapper .dt-buttons .mRightExport:active {
    width: 29px;
    height: 29px;
    background: #124634 url(../images/xl.svg) no-repeat scroll 6px 6px;
    padding: 5px;
    border: 0px;
    border-radius: 5px;
    background-size: 15px;
    vertical-align: bottom;
}
.dataTables_wrapper .dt-buttons .buttons-colvis, .dataTables_wrapper .dt-buttons .buttons-colvis:hover, .dataTables_wrapper .dt-buttons .buttons-colvis:focus, .dataTables_wrapper .dt-buttons .buttons-colvis:active {
    width: 29px;
    height: 29px;
    background: #124634 url(../images/table-settings.svg) no-repeat scroll 8px 7px;
     padding: 5px;
    border: 0px;
    border-radius: 5px;
    background-size: 16px;
    vertical-align: bottom;
}
.dataTables_wrapper .dt-buttons .filtertab, .dataTables_wrapper .dt-buttons .filtertab:hover, .dataTables_wrapper .dt-buttons .filtertab:focus, .dataTables_wrapper .dt-buttons .filtertab:active {
    width: 29px;
    height: 29px;
    background: #124634 url(../images/filter.svg) no-repeat scroll 6px 8px;
 padding: 5px;
    border: 0px;
    border-radius: 5px;
    background-size: 19px;
    vertical-align: bottom;
}
.dataTables_wrapper .dt-buttons .mRightFifteen, .dataTables_wrapper .dt-buttons .mRightFifteen:hover, .dataTables_wrapper .dt-buttons .mRightFifteen:focus, .dataTables_wrapper .dt-buttons .mRightFifteen:active {
    width: 29px;
    height: 29px;
    background: #124634 url(../images/search.svg) no-repeat scroll 7px 6px;
  padding: 5px;
    border: 0px;
    border-radius: 5px;
    background-size: 15px;
    vertical-align: bottom;
}
.dataTables_wrapper .dt-buttons .download-order, .dataTables_wrapper .dt-buttons .download-order:hover, .dataTables_wrapper .dt-buttons .download-order:focus, .dataTables_wrapper .dt-buttons .mRightExport:active {
    width: 29px;
    height: 29px;
    background: #124634 url(../images/download.svg) no-repeat scroll 6px 6px;
    padding: 5px;
    border: 0px;
    border-radius: 5px;
    background-size: 15px;
    vertical-align: bottom;
}
.dataTables_length div{
    width: 25px;
    height: 25px;  
    padding: 5px; cursor:pointer;
    border: 0px;
    margin: 0px 10px 0px 10px;
}






.dataTable th.sorting {
    position: relative;
}

    .dataTable th.sorting:after {
        position: absolute;
        content: "" !important;
        opacity: 0.8 !important;
        top: 17px !important;
        height: 10px;
        width: 16px;
        background: url(../images/sort-l.png) no-repeat right;
    }

    .dataTable th.sorting:before {
        position: absolute;
        content: "" !important;
        opacity: 0.0 !important;
        height: 10px;
        width: 16px;
        background: url(../images/sort-r.png) no-repeat right;
    }


    .dataTable th.sorting.sorting_asc:after {
        display: none;
    }

    .dataTable th.sorting.sorting_asc:before {
        position: absolute;
        opacity: 1 !important;
        top: 16px;
        height: 10px;
        width: 16px;
        content: "" !important;
        background: url(../images/sort-l.png) no-repeat right;
    }

.dataTable th.sorting_asc:after {
    position: absolute;
    top: 16px;
    height: 10px;
    width: 16px;
    content: "" !important;
    background: url(../images/sort-r.png) no-repeat right;
}

    .dataTable th.sorting.sorting_desc:before {
        display: none;
    }

.pagination li:first-child a,
.pagination li:last-child a {
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-weight: 600;
    color: #000 !important;
    min-width: 90px;
    font-family: "Inter", sans-serif;
    font-weight: 500;
}





.multiple .multiselect-native-select .btn-group {margin-top:0px;}
#sort-1:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}
#sort-1 {
    background: url(../images/sort.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px; position:relative;
}

#sort-1.select-on {
    background: #cccc url(../images/sort-green.svg) no-repeat scroll 2px 6px;
    background-size: 75%; pointer-events: auto;
    border-radius: 5px;
}

#assign-vehicle:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#assign-vehicle {
    background: url(../images/driver.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

#assign-vehicle.select-on {
    background: #cccc url(../images/driver-a.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: auto;
    border-radius: 5px;
}
#reset-to-reload:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#reset-to-reload {
    background: url(../images/reloadOrder.jpeg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

    #reset-to-reload.select-on {
        background: #cccc url(../images/reloadOrder-active.jpeg) no-repeat scroll 2px 6px;
        background-size: 75%;
        pointer-events: auto;
        border-radius: 5px;
    }

#cancel-delivery:after {
        content: "";
        position: absolute;
        height: 28px;
        width: 1px;
        left: -13px;
        z-index: 9;
        top: 0;
        background: #cccc;
    }

#cancel-delivery {
    background: url(../images/cancelDelivery.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

    #cancel-delivery.select-on {
        background: #cccc url(../images/cancelDelivery-active.svg) no-repeat scroll 2px 6px;
        background-size: 75%;
        pointer-events: auto;
        border-radius: 5px;
    }
#assign-route:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#assign-route {
    background: url(../images/route.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

#assign-route.select-on {
    background: #cccc url(../images/route-active.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: auto;
    border-radius: 5px;
}

#assign-route:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#assign-route {
    background: url(../images/route.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

#assign-route.select-on {
    background: #cccc url(../images/route-active.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: auto;
    border-radius: 5px;
}


#assign-googlemap:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#assign-googlemap {
    background: url(../images/gmap.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

#assign-googlemap.select-on {
    background: #cccc url(../images/gmap-a.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: auto;
    border-radius: 5px;
}

#reset:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#reset {
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

    #reset.select-on {
        background-size: 75%;
        pointer-events: auto;
        border-radius: 5px;
    }

    #reset:after {
        content: "";
        position: absolute;
        height: 28px;
        width: 1px;
        left: -13px;
        z-index: 9;
        top: 0;
        background: #cccc;
    }

#reset {
    background: url(../images/reset.jpeg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

    #reset.select-on {
        background: #cccc url(../images/reset-a.jpeg) no-repeat scroll 3px 5px;
        background-size: 75%;
        pointer-events: auto;
        border-radius: 5px;
    }


#add-vehicle:after {
    content: "";
    position: absolute;
    height: 28px;
    width: 1px;
    left: -13px;
    z-index: 9;
    top: 0;
    background: #cccc;
}

#add-vehicle {
    background: #cccc url(../images/driver-a.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: none;
    margin-left: 35px;
    position: relative;
}

    #add-vehicle.select-on {
        background-size: 75%;
        pointer-events: auto;
        border-radius: 5px;
    }

#sort-2.select-on {
    background: #cccc url(../images/time.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
    pointer-events: auto;
    border-radius: 5px;
}
.dataTables_length #sort-1.select-on:hover {
    background: #10453399 url(../images/sort-green.svg) no-repeat scroll 2px 6px;
    background-size: 75%;
}

#sort-2{  background:  url(../images/time.svg) no-repeat scroll 6px 6px; background-size: 60%;}
#sort-3{  background:  url(../images/refresh.svg) no-repeat scroll 6px 6px; background-size: 60%;}

.dataTables_length {
    width: auto;
    flex-grow:1;
    text-align: left;
    display: flex;
	    align-content: center;
    align-items: center; font-size:13px;
}

.dataTables_wrapper .dt-buttons {
    float: right;
	order:2;margin-left: 5px;
}
.dataTables_paginate {order:6;}
.dataTables_info {order:5;}
.dataTables_filter{order:1;}
.dataTables_filter label{ font-weight:600 !important;}
.dataTables_wrapper.form-inline {
    justify-content: space-between;
}
.store .btn-group button {
    background-color: #fff0;
}
.table.table-bordered.dataTable th {
    border-left-width: 0;
    font-size: 12px;
    padding-right: 30px !important;
    background: #124634;
    min-width: 20px;
    color: #fff !important;
}
#substitutes.table.table-bordered.dataTable th:nth-child(1){min-width:100px;}
#barCodeReaderTable.table.table-bordered.dataTable th:nth-child(1) {
    min-width: 10px !important;
}
.order-id{text-decoration:underline;}
.order-id.sorting.sorting_asc{text-decoration:none;}
.table.table-bordered.dataTable th:nth-child(1) {
  min-width:20px;padding-right: 13px !important;
    margin: 0px;

}
.table.table-bordered.dataTable td{ padding-left: 17px !important;}
.table.table-bordered.dataTable .col-2 {
  min-width: 250px;
}


.sorting_1 a {
    text-decoration: underline;
    color: #000
}



.assignment {
    border: 1px solid #ccc;
    padding: 10px 20px;
    border-radius: 20px;
    margin: 0px 0px 0px 20px;
    font-weight: 500;
    border-bottom: 3px solid #AE862E;
}

.user-name {
    background: #FAFAFA;
    padding: 8px 20px 11px 0px;
    border-radius: 20px;
}
.regular-in{    padding-left: 10px;}

.nav-arrow {
    width: 30px;
    height: 30px;
    border: 1px solid #ccc;
    border-radius: 50%;
    padding: 5px 7px 7px 11px;
    position: absolute;
    right: -14px;top: 24px;
    cursor: pointer;
    background: #fff;
}

/* Change arrow direction when sidebar is collapsed */
input.hamburger:checked ~ nav.primnav .nav-arrow .arrow.left {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}


.input-sm {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
table.dataTable thead .sorting_asc:after{ color:#CE9B2C;}
table.dataTable thead .sorting:after{color:#CE9B2C;}
.head-copy{ font-size:28px; margin:32px 5px 40px 13px}
.multiselect-native-select .btn-group {
    width: 100%;
    margin-top: 15px;
}

.assigned, .waiting, .preparing, .done, .cancelled, .online, .offline,
.order-placed, .order-assigned, .order-preparing, .order-completed, .order-canceled,
.order-parked, .order-waiting, .delivered, .ready-dispatch, .order-loaded, .order-reloaded, .order-processing {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
    cursor: pointer;
    border-radius: 5px;
}

.order-loaded {
    background: #a1413f
}
.waiting { background:#FFDF00}
.preparing{ background:#2DC36A}
.assigned { background:#4174FF}
.done{ background:#C2C2C2}
.online {    background: #146348}
.offline {    background: #bd2222}
 
.order-placed {background: #ADD8E6}
.order-assigned {background: #0000FF}
.order-preparing {background: #FFFF00}
.order-completed {background: #008000}
.order-reloaded {
    background: #ec6502
}
.order-canceled {background: #000;}
.order-parked{background: #808080}
.order-waiting {background: #FFA500}
.delivered {background: #00FF00}
.ready-dispatch {    background: #7fffd4}
.order-processing {
    background-color: #6948a9
}


.dataTable span img {
    width: 15px;
    margin: 5px 5px;
    display: inline-block;
}

.dataTable img {
    width: 15px;
    margin: 0px 5px;
    display: inline-block;
}
.data-wrap{width:100%;order: 3; }
.loginwrap{
display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: space-between;
height: 100vh;}

.clear-link {
    cursor: pointer;
    color: #104533;
    border: 1px solid #104533;
    padding: 5px;
    margin-top: 13px;
    display: inline-block;
    border-radius: 5px;
    text-decoration: none;
}
    .clear-link:hover {
        text-decoration: none;
        color:#fff;
        background: #104533;
    }
#createHeading {
    margin: -25px 0px 30px 0px;
}
.over-poup, .over-poup-filter, .download-order-popup, .over-poup-sort, .over-poup-transfer-order, .over-poup-create-driver-request {
    display: none;
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100vh;
    background: #1a1a1a8c;
    top: 0;
    left: 0px;
}

    .over-poup .popup-box {
        position: absolute;
        z-index: 9999;
        background: #fff;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        min-width: 300px;
        border-radius: 10px;
    }
div.dataTables_wrapper div.dataTables_processing { z-index:999;
}
.over-poup .top {
    padding: 25px;
    background: #114634;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
.over-poup .bottom {    padding: 15px 25px; }
.over-poup .top h3 {
    font-size: 20px;
    margin-top: -2px;
    margin-bottom: 0px;
    color: #fff;
    margin-left: -8px;
}
.over-poup .top input {
    background: #fff url(../images/select-search.svg) no-repeat right;
    background-position-x: calc(100% - 12px);
}
.over-poup .bottom select {
    /*margin: 0px;*/
    background-position-x: calc(100% - 12px);
}
.closeme .close {
    color: #06442f;
    font-weight: 400;
    position: absolute;
    top: 20px;
    right: 20px;
    text-shadow: navajowhite;
    opacity: 1;
    font-size: 20px;
    cursor: pointer;
    padding: 8px 10px 12px 10px;
    line-height: 8px;
    background: #fff;
    font-weight: 200;
}
.daterangepicker .drp-buttons .btn {
    padding: 9px 8px !important;
    width: 30%;
}
.sp-delete {
    background: #104533 url(../images/white-delete.svg) no-repeat right;
    background-position-x: 12%;
    padding: 8px 14px 8px 28px;
    width: auto;
    margin-bottom: 25px;
}
    .sp-delete:hover {
        background-color: #ae862e;
        color:#fff;
    }
    .ms-options-wrap button {
        padding-right: 35px;
        overflow: hidden;
    }
.btn-danger:focus, .btn-danger.focus {
    background-color: #ae862e;
    color: #fff;
}
.dataTable .dt-checkboxes[type='checkbox']:after {
    line-height: 1.5em;
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-top: -4px;
    border: 1px solid rgb(192,192,192);
    margin-left: -4px;
    border-radius: 0.25em;
    background: rgb(255 255 255);
}

.dataTable .dt-checkboxes[type='checkbox']:checked:after {
    width: 18px;
    height: 16px;
    color: #fff;
    background: #124634;
    content: '\2713';
    padding: 0px 0px 5px 5px;
    font-size: 10px;
    position: relative;
    top: -4px;
    border-radius: 3px;
    border: 0px;
}
.closeme h3 {
    width: 100%;
    margin-bottom: 35px;
    color: #fff;
    opacity: 1;
    font-size: 24px;
    padding-left: 2%;
}
.filter-popup.closeme .close {    color: #06442f;}
.sort-popup.closeme .close {    color: #06442f;}
.filter-popup {
    width: 76%; 
    background: #fff;
    display: flex;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    flex-wrap: wrap; border-radius:10px;
    justify-content: center;
}
.filter-popup:focus-visible {border:0px; outline:0px;
}
.filter-popup .form-input {
    margin: 10px 0px 0px 0px;
}
.filter-popup.search-popup .col-sm-2 {
    padding-top: 10px;
    font-size: 13px;
    font-weight: 500;
}
.filter-popup .row {
    align-items: center;
}

.edit-delivery-filter-popup.closeme .close {    color: #06442f;}
.edit-delivery-filter-popup {
    background: #fff;
    display: flex;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    flex-wrap: wrap; border-radius:10px;
    justify-content: center;
}
.edit-delivery-filter-popup:focus-visible {border:0px; outline:0px;
}
.edit-delivery-filter-popup .form-input {
    margin: 10px 0px 0px 0px;
}
.edit-delivery-filter-popup.search-popup .col-sm-2 {
    padding-top: 10px;
    font-size: 13px;
    font-weight: 500;
}
.edit-delivery-filter-popup .row {
    align-items: center;
}


.orderline-item-popup-container, .orderline-item-correction-container {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(1px);
}
.orderline-item-popup .popup {
    width: 45%;
    background: #fff;
    display: flex;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    flex-wrap: wrap;
    border-radius: 10px;
    justify-content: center;
}

    .orderline-item-popup .popup:focus-visible {
        border: 0px;
        outline: 0px;
    }

    .orderline-item-popup .popup .form-input {
        margin: 10px 0px 0px 0px;
    }

    .orderline-item-popup .popup.d-popup .col-sm-2 {
        font-size: 13px;
        font-weight: 500;
    }

    .orderline-item-popup .popup .row {
        align-items: center;
    }



.orderline-item-correction-popup .popup {
    width: 37%;
    background: #fff;
    display: flex;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    flex-wrap: wrap;
    border-radius: 10px;
    justify-content: center;
}

    .orderline-item-correction-popup .popup:focus-visible {
        border: 0px;
        outline: 0px;
    }

    .orderline-item-correction-popup .popup .form-input {
        margin: 10px 0px 0px 0px;
    }

    .orderline-item-correction-popup .popup.d-popup .col-sm-2 {
        font-size: 13px;
        font-weight: 500;
    }

    .orderline-item-correction-popup .popup .row {
        align-items: center;
    }

.download-order-popup .popup {
    width: 30%;
    background: #fff;
    display: flex;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    flex-wrap: wrap;
    border-radius: 10px;
    justify-content: center;
}

.download-order-popup .popup:focus-visible {
    border: 0px;
    outline: 0px;
}

.download-order-popup .popup .form-input {
    margin: 10px 0px 0px 0px;
}

    .download-order-popup .popup.d-popup .col-sm-2 {
        padding-top: 10px;
        font-size: 13px;
        font-weight: 500;
    }

    .download-order-popup .popup .row {
        align-items: center;
    }


.sort-popup {
    width: 24%;
    background: #fff;
    display: flex;
    max-width: 330px;
    min-width: 330px;
    padding: 25px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    position: absolute;
    z-index: 9999;
    left: 50%;
    top: 50%;
    border-radius: 10px;
    transform: translate(-50%,-50%);
}
#sortable{margin-top:15px;}
#sortable li {
    list-style: none;
    width: 48%;
    background: #114634;
    color: #fff;
    display: inline-block;
    padding: 5px 10px;
    margin: 2px 2px;
    border: 0px;
    border-radius: 5px;
}
#sortable li.active{opacity:0.5;}


.loginwrap form{ background:#fff; padding:50px; border-radius:5px;filter: drop-shadow(0px 4px 5px rgba(0, 0, 0, 0.35));}
.loginwrap h3 {
    max-width: 300px;
    text-align: center;
    font-weight: 300;
}

.loginwrap h3 b {
    display: inline-block;
    font-weight: 600;
}
.login-logo {
    width: 100px;
    margin: 0px 0px 10px 0px;
    display: inline-block;
    text-align: center;
	padding:10px;
}
.login-logo-one{padding-right:15px; border-right:1px solid #ccc;}
.login-logo img{width:100%;}
.login-forgot{ color:#114634; text-decoration:underline; font-weight:600;}
.loginwrap:after {
    content: "";
    background: #114634;
    width: 100%;
    position: absolute;
    bottom: 0;
    z-index: -1;
    height: 50vh;
}
.set-line-target-popup {
    flex-wrap: wrap;
    justify-content: center;
    display: flex;
}
.daily-target-close.close {    color: #114634;}

.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, .show > .btn-danger.dropdown-toggle {
    background-color: #ae862e;
    border-color: #ae862e;
}
.btn-danger:hover {
    background-color: #ae862e;
    border-color: #ae862e;
}

.expiry-pop {
    top: 31%;
}

.dataTable {
    width: 100% !important;
}

.bb-reversal-table .text-danger {
    float: left;
}

div.sortIt {
    width: 131px;
    background-color: rgb(16 69 51);
    margin: 4px;
    text-align: left;
    padding: 7px 10px;
    color: #eee;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.6em;
    white-space: nowrap;
    outline: none !important;
    border-radius: 4px;
    float: left;
    font-family: "Inter", sans-serif;
}
.sortIt.active {    background-color: #ae862e;}

.rs-table-form div.dt-button-collection.two-column {
    width: 290px;
    display: none !important;
}

.dt-button-background {
    display: none !important;
}

#dvSorting {
    display: inline-block;
}

.wrapper1, .table-scroll {
    width: 100%;
    order: 3;
}

.payroll-scroll {
    height: 20px;
}

.payroll-scroll-bottom {
    overflow: none;
}

progress.progressBar:hover:before {
    display: inline;
    content: attr(value);
    width: 100%;
    text-align: center;
    position: absolute;
    top: 0;
}

progress.progressBar {
    position: relative;
}

.col-sm-12.filter-text.from-div {
    padding: 0 5px 0 0;
    width: 45%;
}

.col-sm-12.filter-text.to-div {
    padding: 0 0 0 5px;
    width: 45%;
}

span.to {
    float: left;
    padding: 5px 0 0 0;
}


#orderPriorityTable {
    cursor: all-scroll;
}
.dt-rowReorder-moving {
    background: #ae862e !important;
    cursor: all-scroll;
}

ul.list-unstyled {
    height: 30px;
    width: 200px;
    position: relative;
    white-space: normal;
    background: url(../images/select-arrow.svg) no-repeat right;
}
ul.list-unstyled li {padding: 5px 10px;  width: 100%; position: absolute;  left: -17px; }
ul.selectthis.list-unstyled li {
    padding: 5px 10px;
    width: 100%;
    position: absolute;
    left: -17px;
}

    ul.selectthis.list-unstyled li.init {
        padding: 15px 10px 15px 25px;
        width: 117%;
        position: absolute;
        left: -17px;
        background: #ae862e url(../images/select-arrow.svg) no-repeat right;
        background-position-x: calc(100% - 12px);
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        top: -7px;
    }

ul.selectthis.list-unstyled li:last-child { border-bottom-left-radius: 5px;  border-bottom-right-radius: 5px; }
.list-unstyled.selectthis {    z-index: 55}
ul.list-unstyled li:not(.init) {
    height: 43px;
    float: left;
    width: 117%;
    padding: 11px 10px 11px 25px;
    display: none;
}

ul.selectthis.list-unstyled li:not(.init) {    background: #fff;    z-index: 15;}
.selectthis.list-unstyled li:not(.init):hover {    color: #fff;}
.selectthis.list-unstyled li:not(.init):hover, ul.list-unstyled li.selected:not(.init) {    cursor: pointer;}
.list-unstyled li.init {    cursor: pointer;    z-index: 10;}

.selectthis.list-unstyled li:not(.init):hover:after {
    content: "";
    background: #8d7032;
    width: 100%;
    height: 42px;
    position: absolute;
    left: 0px;
    z-index: -1;
    top: 0;
}
.selectthis.list-unstyled li:nth-child(2) {    top: 40px;}
.selectthis.list-unstyled li:nth-child(3) {    top: 83px;}
.selectthis.list-unstyled li:nth-child(4) {    top: 126px;}
.selectthis.list-unstyled li:nth-child(5) {    top: 169px;}
.selectthis.list-unstyled li:nth-child(6) {    top: 212px;}









.order-details .head-copy {
    margin-left: -3px;
}
.order-detail .head {
    align-items: center;
    flex-wrap: wrap;
}
.orderdetail-table-wrap {    overflow-x: auto;    margin-bottom: 20px;}
 .order-detail-order-lines{ margin-top:15px}
.order-detail .head.r-panel{    margin-top: -85px;    margin-bottom: 45px;}
.order-detail .map.order-detail h4 {    margin-bottom: 40px;}

.order-detail .l-panel .l-panel-bg {transition: width 246ms 0.5s ease;border-radius:5px;  padding:0px 15px;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));}
.order-detail .head h6 {
    margin-left: -2px;
    padding: 0px;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0px;
}

    .order-detail .head h6 span {
        color: #ae862e;
    }
.pickername {
    padding: 0px; display:block;
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 600;
    width: 100%;
}
.order-detail .head .btn{ font-size:14px; font-weight:600; pointer:none; background:none; color:#000; width:auto; padding:5px 15px; border:1px solid #cccccc59; border-radius:25px;}
.order-detail .head .btn .tooltip-point{ padding-right:10px;}
.order-detail .l-panel .d-bg {    background: #E6E6E6;    padding: 15px 30px;}
.order-detail .l-panel .w-bg {    background: #fff;    padding: 15px 30px;}
.order-detail .l-panel .map {
    background: #fff;
    padding: 0px;
    overflow: hidden;
    height: 250px;
}
    .order-detail .l-panel .map iframe {        width: 100%;        border: 0px;        height: 100%;    }
.order-detail .l-panel .map h4{padding-left:30px;font-size:14px;font-weight:600; margin-bottom:15px; }
.order-detail .l-panel table{width:100%;}
.order-detail .l-panel table td{font-size:12px; padding:10px 0px}
.order-detail .l-panel.profile table td:first-child {    width: 30%;    font-weight: 400;}
.order-detail .l-panel table td:first-child {    width: 40%;    font-weight: 400;}
        .order-detail .l-panel table td img {            padding-right: 10px;        }
    .order-detail .l-panel table td:nth-child(even) {        font-weight: 600;        font-size: 14px;    }
.order-detail .r-panel .head{ margin-top: -75px; margin-bottom: 28px; }
.order-detail .r-panel .btn img{padding-right:5px; width:20px;}
.order-detail .r-panel .btn.spb{padding:3px 5px 3px 10px; min-width:200px;}
.order-detail .r-panel .w-bg-2{ border-radius:5px; filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));background:#fff; padding:0px;}
.order-detail .r-panel .w-bg{background:#fff;padding:30px; }
.order-detail .r-panel .map{}

.order-detail .r-panel h3{font-size:24px; margin-bottom:25px; text-align:center;}
.order-detail .r-panel .btn {
    min-width: 30%;
	width:auto;
    background: #104533;
    margin: 5px;
    font-size: 12px;
    border-radius: 10px;
    color: #fff;
    text-align: left;
    display: flex; padding:10px;
    align-items: center;border: 0;
    justify-content: flex-start;
}
.order-detail .btn:focus{border: 0;box-shadow:0 0 0 0.2rem rgb(255 255 255 / 0%);}
.order-detail .r-panel .btn span {
    padding: 5px 10px;
    background: #ccc; margin:3px;
    border-radius: 6px;
}
.order-detail .r-panel .btn span.active{background:#AE862E;}
.col-md-6.r-panel {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-end;
}
.order-detail .r-panel .d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
    flex-wrap: wrap;
	max-width:450px;
    align-items: center;
    justify-content: flex-end;
}
.order-detail .r-panel .map {
    margin: 0px;
    padding: 0px 0px;
}
.order-detail .r-panel .w-bg-2 .row .box {
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
    text-align: center;
    font-size: 12px;padding: 30px 20px 30px 20px; 
    margin-bottom: 0px; border-right:1px solid #ccc; border-bottom:1px solid #ccc;
}
.order-detail .r-panel .w-bg-2 .col-sm-6 span{font-weight:600;}
.order-detail .r-panel .w-bg-2 .col-sm-6 span b{ color:#AE862E;}
.order-detail .r-panel .w-bg table th:first-child{text-align:left;}
.order-detail .r-panel .w-bg table td {
    text-align: center;
    font-size: 12px;
    padding: 14px 5px;
    vertical-align: middle;
}
.order-detail .r-panel .w-bg table th {
    border-left-width: 0;
	padding: 10px 16px;
    background: #124634; text-align:center;
    color: #fff !important;
}
.order-detail .r-panel .w-bg table td:first-child img{width:20px;}
.order-detail .r-panel .w-bg table td .active{text-decoration: line-through;}
.order-detail .r-panel .w-bg table td:first-child {
    text-align: left;
	text-decoration:underline;
    display: flex;
    align-items: center;
    justify-content: space-between;
}



.order-detail .r-panel .w-bg table .has-details {
  position: relative;
}
.order-detail .r-panel .w-bg table .details {
    position: absolute;
    transform: translateY(20%) scale(0);
    transition: transform 0.1s ease-in;
    transform-origin: left;
    display: inline;
    background: white;
    z-index: 20;
    min-width: 88px;
    padding: 0.5rem 0.5rem 0.5rem 3rem;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    display: flex;
    flex-wrap: wrap;
    align-items: center;
	border: 1px solid #fff;
}
.order-detail .r-panel .w-bg table .has-details .pop .close {
    position: absolute;
    top: 0px;
    right: 10px;
    font-weight: 400;
    font-size: 20px;
    cursor: pointer;
    background: #fff;
    color: #124634;
    padding: 1px 5px 4px 5px;
    line-height: 16px;
    height: 21px;
    width: 22px;
    transform: translate(-86px, 8px);
}
.order-detail .r-panel .w-bg table .has-details .pop h6 {width:70%;}

.order-detail .r-panel .w-bg table .has-details .pop .info {
    display: flex;
    align-items: center;
    flex-direction: row;
    margin-top: 15px;
    font-weight: 600;
    width: 100%;
    justify-content: space-between;
}
.order-detail .r-panel .w-bg table .has-details .pop .info span{font-weight:400;}
.order-detail .r-panel .w-bg table .has-details .pop {  transform: translateY(0%) scale(1);}
.order-detail .r-panel .w-bg table .pop:before {
    content: '';
    width: 38px;
    background: #124634;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.order-detail .r-panel .w-bg table td:first-child .details img {
    width: 70px;
    border: 1px solid #e7e7e7;
    border-radius: 5px;
}

.order-detail .r-panel .w-bg table .details:after {
    content: " ";
    position: absolute;
    left: 0px;
    bottom: 0px;
    border-top: none;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-bottom: 15px solid #124634;
    transform: translate(4px, 94px) rotate(180deg);
    height: 30px;
}



.order-detail .r-panel .t-box, .order-detail .r-panel .t-box-2 {
    display: flex;
    justify-content: space-between;
    align-items: center;margin: 0px;
}
.order-detail .r-panel .t-box span{color:#AE862E;}

.order-detail .r-panel .t-box{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 5px solid #124634;
    padding-bottom: 15px;
}
.order-detail .r-panel .t-box-2 {border-top: 1px solid #124634;
    padding-top: 15px; margin-top:5px; margin-bottom:50px;} 
	
.order-detail .r-panel .gren-box {
    background: #124634;
    margin: 0px;
    padding: 15px;
    color: #fff;
}
.order-detail .r-panel .gren-box ul {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap; width:100%;
}
.order-detail .r-panel .gren-box ul li {
    padding: 5px 5px 5px 35px;
    min-width: 190px; font-size:12px;
    background: url(../images/foc-li.png) no-repeat 3px 8px;
    background-size: 16px;
}
.psw {
    background: url(../images/psw.svg) no-repeat 10px 12px;
    background-size: 17px;
    background-position-x: calc(100% - 12px);
}
.datepickers {
    background: url(../images/date-icon.svg) no-repeat 3px 8px;
    background-size: 16px;
    background-position-x: calc(100% - 12px);
}
.reports .w-bg{ border-radius:5px;     display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15)); background:#fff; padding:20px;    width: 31%; }

.reports-info .w-bg{ border-radius:5px;     display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15)); background:#fff; padding:20px;    width: 30%; }

.reports .w-bg h3 {
    font-size: 14px;
    width: 50%;
    display: inline-block;
}
.reports .w-bg select{ margin:0px;}

.reports .w-bg .btn {
    background: #104533;
    margin: 5px;
    font-size: 12px;
    border-radius:3px;
    color: #fff; width:auto;
    text-align: center;
    padding:5px 10px; border: 0;
}

.reports .w-bg .col-6 {
    display: flex; 
    flex-direction: column;
    justify-content: center;
}
.reports-info .row .row{align-items: center;}
.reports-info .row label{margin:0px;}
.profile .row{align-items: center;}
.profile .btn { width:60%;}
.profile h4{font-size:20px; margin-bottom:20px;}
table.dataTable.substitutes {
    border: 1px solid #ddd;
    font-size: 14px;
    order: 3;
    border-spacing: 0;
    min-width: 1030px;
	width:100%;
    margin-top: 20px !important;
}
.substitutes-top {
    background: #EFEFEF;
    border-radius: 5px;
    height: 125px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}



.caret {
	  float: right;
    margin-top: 5%;
}

#menu1 {
    width: 160px; 
    text-align: left;
}

.paginate_button {
    background: #fff !important;
    margin: 15px 5px 5px 5px;
    border-radius: 5px !important;
    border: 1px solid #ccc !important;
}
.paginate_button:hover{background: #f1f1f1 !important;}
.paginate_button a{ color:#000; text-decoration:none; display:block; }
.paginate_button.active{width: auto;}
.paginate_button.previous a {text-align:left!important; position:relative; padding-left:25px!important; }
.paginate_button.previous a:after {
    content: "";
    background: url(../images/select-arrow.svg) no-repeat right;
    display: block;
    position: absolute;
    height: 20px;
    width: 20px;
    left: -3px;
    top: -2px;
    bottom: 90%;
    transform: rotate(90deg);
}

.paginate_button.next a {text-align:right!important; position:relative; padding-right:25px!important;}
.paginate_button.next a:after {
    content: "";
    background: url(../images/select-arrow.svg) no-repeat right;
    display: block;
    position: absolute;
    height: 20px;
    width: 20px;
    right: -3px;
    top: 4px;
    bottom: 90%;
    transform: rotate(270deg);
}

.foc label{font-size:14px;}
.foc .btn{font-size:14px;}
.foc-tab-th{width:45%}
.foc .dataTables_wrapper{width:100%}
.foc .dataTables_wrapper .row {
    width: 100%;
    margin: 0px;
}
.foc .datepickers {
    background-position-x: calc(100% - 12px);
    height: 40px;
}
.foc input.form-control{background-color:transparent;}
.foc h3.head-copy{margin-bottom:0px;}
.foc .pagination{margin-bottom:20px !important;}
.foc .foc-based-box .col{background:#EFEFEF; padding:20px;}
.foc .foc-based-box .col-md-12 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.popup table .has-details {
    position: relative;
    text-decoration: underline;
    display: flex;
    justify-content: center;
}

.popup table .details {
    position: absolute;
    top: -48px;
    left: 13%;
    transform: translateY(70%) scale(0);
    transition: transform 0.1s ease-in;
    transform-origin: left;
    display: inline;
    background: white;
    z-index: 20;
    min-width: 220px;
    padding: 1rem 1rem 0.2rem 1rem;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.popup table .has-details .pop .close {
    position: absolute;
    top: 10px;
    right: 11px;
    opacity: 1;
    text-shadow: none;
    font-weight: 400;
    font-size: 20px;
    color: #124634;
    cursor: pointer;
    background: #fff;
    padding: 3px 5px;
    line-height: 15px;
}
.popup .info a { text-decoration:none;
}
.popup .info span {
    text-decoration: none;
    color: #000;
    margin: 0px 0px;
    font-size: 12px;
    padding: 4px 0px;
    display: block;
    font-weight: 500;
}
.popup.order table .has-details .pop .info{ max-height:200px; width:150px;}
.popup table .has-details .pop .info { width:100%;
    align-items: center; max-height:100px;
    flex-direction: row; font-weight:600; margin-top:30px;
}
.popup table .has-details .pop {  transform: translateY(70%) scale(1);}
.popup table .details:after {
    content: " ";
    position: absolute;
    left: 30px;
    top: -9px;
    border-top: none;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #124634;
}
.dataTable tr td a { text-decoration:underline; color:#000;}
.dataTable tr td a:hover {    text-decoration: none;    color: #000;}
.dataTables_wrapper .dataTable tr:last-child .details:after {
    top: auto;
    transform: rotate(270deg);
    bottom: 12px;
    border-bottom: 10px solid #fff;
    left: -15px;
}
.dataTables_wrapper .dataTable tr:nth-last-child(2) .details:after {
    top: auto;
    transform: rotate(270deg);
    bottom: 12px;
    border-bottom: 10px solid #fff;
    left: -15px;
}
.dataTables_wrapper .dataTable tr:nth-last-child(3) .details:after {
    top: auto;
    transform: rotate(270deg);
    bottom: 12px;
    border-bottom: 10px solid #fff;
    left: -15px;
}
.dataTables_wrapper .dataTable tr:nth-last-child(4) .details:after {
    top: auto;
    transform: rotate(270deg);
    bottom: 12px;
    border-bottom: 10px solid #fff;
    left: -15px;
}

.dataTables_wrapper .dataTable tr:last-child .details {    top: -211px;    left: 70px;}
.dataTables_wrapper .dataTable tr:nth-last-child(2) .details {
    top: -211px;
    left: 70px;
}
.dataTables_wrapper .dataTable tr:nth-last-child(3) .details {    top: -211px;    left: 70px;}
.dataTables_wrapper .dataTable tr:nth-last-child(4) .details {    top: -211px;    left: 70px;}

/* Fix positioning when there are only 2 list items */
.dataTables_wrapper .dataTable tr:last-child .details.two-items {    top: -150px;    left: 70px;}
.dataTables_wrapper .dataTable tr:nth-last-child(2) .details.two-items {
    top: -150px;
    left: 70px;
}
.dataTables_wrapper .dataTable tr:nth-last-child(3) .details.two-items {    top: -150px;    left: 70px;}
.dataTables_wrapper .dataTable tr:nth-last-child(4) .details.two-items {    top: -150px;    left: 70px;}

.foc .foc-based-box .col-md-12 label{margin:0px;}
.foc input[type="radio"] {visibility:hidden;}
.foc input[type='radio']:after {
        width: 17px;
        height: 17px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: transparent;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid #ccc;
    }

   .foc input[type='radio']:checked:after {
        width: 17px;
        height: 17px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: #0070cc;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 2px solid #ccc;
    }
.foc-repeat {
    background: #FAFAFA;
    filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.15));
    display: flex;
    flex-wrap: wrap;
}
    .foc-repeat .sp-delete {
        padding: 17px 15px;
        float: right; cursor:pointer;
        background-position: 5px;
        background-color: #cf3030;
    }
        .foc-repeat .sp-delete:hover {
            background-color: #ae862e !important;
        }

        #deleteRule_1 {
            cursor: not-allowed !important;
            background-color: #cf3030 !important;
            pointer-events: none;
            padding: 17px 15px;
            float: right; cursor:pointer;
            background-position: 5px;
        }
            #deleteRule_1:hover {background-color: #ae862e !important;}
            .foc-repeat .wb-bg {
                background: #fff;
                padding: 20px;
            }
.foc-repeat select{margin:0px;}
.foc-repeat .sort {
    display: flex;
    justify-content: space-around;
    background: #efefef;
    align-items: center;
    padding: 8px 5px;
}
.foc .more-button {
    width: 150px;
    margin: 20px auto;
    display: flex;
    flex-direction: row;
    justify-content:space-evenly;
    align-items: center;
    padding: 10px 20px;
    background: #124634;
    border-radius: 10px;
}
.foc .more-button p{font-size:14px; color:#fff;}
.foc .more-button label{font-size:14px; color:#fff; margin:0px;}
.foc-repeat .sort label{ margin:0px;}

.foc textarea {
    width: 100%;
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 5px;
}

label.priority {
    font-size: 16px;
}

#container-2, #container {
    display: block; 
    position:relative
} 
.ui-autocomplete {
    position: absolute;
}
.dataTables_wrapper .dataTables_length select{margin: 10px 5px;}
.footer{ margin-top:50px; font-size:12px; border-top:1px solid #ccc; padding-top:20px; margin-bottom:25px;}


.common-scroll {
    scrollbar-width: thin;
    scrollbar-color: #000 #E6E6E6;
    padding-right: 10px;
}


    .common-scroll::-webkit-scrollbar {
        width: 6px !important;
        height: 10px !important;
        display: block !important;
        cursor:pointer;
    }

    .common-scroll::-webkit-scrollbar-track {
        background-color: #E6E6E6;
        cursor: pointer;
    }

    .common-scroll::-webkit-scrollbar-thumb {
        background-color: #124634;
        cursor: pointer;
    }

    .common-scroll::-webkit-scrollbar-track, .scrollbar-2::-webkit-scrollbar-thumb {
        border-radius: 12px;
        cursor: pointer;
    }

/* scroll-style-ends */
.table-scroll-top, .table-scroll-bottom {
    width: 100%;
    border: none 0px RED;
    overflow-x: scroll;
    overflow-y: hidden;
    order: 3; padding:0px;
}

.table-scroll-top {
    height: 20px;
    margin-bottom: 8px;
    cursor: pointer;
}

.table-scroll-top-in {
    width: auto;
    height: 20px;
    cursor: pointer;
}

.table-scroll-bottom-in {
    width: auto;
}





.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {
    line-height: 30px !important;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #114634 !important;
}
.daterangepicker td.start-date, .daterangepicker td.end-date {
    border-radius: 50% !important;
}
.tooltip-point {
    position: relative;
}

    .tooltip-point[title]:hover::after {
        content: attr(title);
        position: absolute;
        bottom: 150%;
        left: 0;
        background-color: #AE862E;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 5px;
        margin-left: -20px;
        box-sizing: border-box;
    }
    .tooltip-point[title]:hover::before {
        content: "";
        position: absolute;
        top: -50%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #AE862E transparent transparent transparent;
    }

    .tooltips {
        position: relative;
    }

.tooltips .tooltiptext {
  visibility: hidden;
  background-color: #AE862E;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 5px;
  position: absolute;
  z-index: 100;
  bottom: 150%;
  left: 50%;
  margin-left: -20px;
  box-sizing:border-box;
}

.tooltips .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #AE862E transparent transparent transparent;
}

.tooltips:hover .tooltiptext {
  visibility: visible;
}
span.setLineTarget {
    border: 1px solid #1246347a;
    display: inline-block;
    border-radius: 5px;
    margin: 0px 10px;
}
    span.setLineTarget:hover {
        background: #ae862e61;
    }
.ex-5, .ex-10 {
    background: #6a6a6a;
    padding: 5px 10px;
    border-radius: 5px; border:0px;
    margin: 5px;
    color: #fff;
	cursor:pointer;
}
.ex-5.active, .ex-10.active { background: #124634;}











@media only screen and (min-width:1900px) and (max-width:3000px) {

    .table.dataTable td {        font-size: 16px;    }
    .table.dataTable th {        font-size: 18px;    }
    label {        font-size: 16px;    }
        label.nav-arrow {
            font-size: 12px;
        }
}

    @media only screen and (min-width:850px) and (max-width:1100px) {
        .l-panel.profile .d-bg {
        min-width: 300px;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }
    .order-detail .l-panel .w-bg {
        min-width: 100%;
    }
    .primnav { margin-left:10px;}
        .primnav ul .sub-menu.su-active ul li a {font-size: 12px;}
        .primnav li {margin-left: 0px;}
            .primnav li a { font-size: 12px; margin-left: 6px;}
	.primnav li img {    margin-right: 6px;    width: auto;}
	input.hamburger:checked ~ nav.primnav ul li { overflow: visible; }
	.corporate-header .topbar .flex-bx a{ font-size:12px;padding: 20px 10px;}
	.assignment{    margin: 0px 0px 0px 5px;}
	.position-toright img{width:20px}
	.logo-link img{    width: 85px;}
	.reports .w-bg{min-width: 296px; padding: 15px;}
	.reports-info .w-bg{min-width: 296px; padding: 15px;}
	.col-sm-8.foc-based-box {    width: 100%;    max-width: 100%;}
		.foc-repeat .col-md-3{width: 50%;
    max-width: 50%;
		-ms-flex: 0 0 50%;
    flex: 0 0 50%;}
	}


@media only screen and (min-width:300px) and (max-width:850px) {
    .substitutes-top {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

	.t-box .col-sm-6 {max-width: 40%; padding: 5% !important;}
	.t-box-2 .col-sm-6 {max-width: 40%; padding: 5% !important;}
	
    .store-cl {width:20% !important;    }
    .pr-1.store {        width: 80% !important;    }
    .l-panel.profile .d-bg {
        min-width: 300px;
    }
    .order-detail .r-panel .w-bg {
        padding: 5px;
    }
    .primnav ul .sub-menu.su-active ul li a {
        font-size: 12px;
    }
    .foc label {
        font-size: 12px;
    }
.foc-based-box .row {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
}
	.col-sm-8.foc-based-box {    width: 100%;   }
	.foc .foc-based-box .col {
    padding: 15px;
    max-width: 100%;
    margin: 5px;
}
	.reports-info .w-bg{min-width: 296px; padding: 15px;}
	.reports .w-bg{min-width: 296px; padding: 15px;}
.corporate-header .topbar .flex-bx {
    flex-wrap: wrap;
    max-height: initial;
    justify-content: center;
}
.corporate-header {    display: flex;    height: 130px;}
.navbar.mobile-show{border-top:1px solid #ccc;}
.corporate-header .topbar .flex-bx .position-toright {    margin-bottom: 10px;  }
.corporate-header .topbar .flex-bx .position-toright a {
    padding: 10px 10px 0px 10px;min-height: 40px;
    width: auto;
    display: inline-block;
    font-size: 12px;
    min-height: 30px;
    height: 40px;
}
.corporate-header .topbar .flex-bx .position-toright a img{width:30px;}
.corporate-header .topbar .flex-bx .position-toright a .assignment{margin:0px;}
.corporate-header .topbar .flex-bx .navbar .navbar-primary{    justify-content: center; align-items: center;}
.sp-border{border-left:1px solid #ccc;}
.primnav li{padding:5px; margin-left: 0px;height:30px;}
.primnav li a{font-size:12px;}
.primnav li.active {    border-radius: 7px;    filter: none;}
.primnav li img {    margin-right: 5px;    width: 12px;}
.primnav{margin:5px; width: 25%; min-height:450px;}
.primnav expand:hover, .primnav li:hover{ filter:none}
.main-wraper {
    width: 68%;
    margin: 0px !important;
    padding: 0px;
}
.primnav li {
    padding: 5px;
    margin-left: 0px;overflow: hidden;
}
.dataTables_length label{display: contents;}

}
@media only screen and (min-width:450px) and (max-width:850px) {
    .l-panel.profile .d-bg {
        min-width: 300px;
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }
    .order-detail .l-panel .w-bg {
        min-width: 100%;
    }
    .foc-repeat .col-md-3 {
        width: 50%;
        max-width: 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
    }
.dataTables_wrapper.form-inline {
    justify-content: space-between;
}
.dataTables_filter {    margin-right: 0px;}	
input.hamburger:checked ~ nav.primnav {    width: 65px; height: auto;}
}
@media only screen and (min-width:300px) and (max-width:450px) {
	.order-detail .head.r-panel{    margin-top: 20px;    margin-bottom: 25px; flex-wrap: wrap;}
	.order-detail .head h6{width:50%;}
    .barcode {        margin-top: -40px;    }
    .closeme h3 {        font-size: 20px;    }
    .order-detail .r-panel .head {        justify-content: flex-start !important;    }
    .corporate-header .topbar .flex-bx .position-toright {
        margin-bottom: 10px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        padding: 0px 5px;
    }
    div.dataTables_wrapper div.dataTables_filter input {        max-width:140px;    }
    .nav-bar-mob .regular-in {        display: none;    }
    .nav-bar-mob a:hover .regular-in {
        display: block;
        position: absolute;
        width: auto;
        right: 0;
        top:50px;
        background: #ccc;
        padding: 5px;
        border-radius: 5px;
    }
    .primnav li a {
        font-size: 14px;
    }
    .dataTables_wrapper .dataTables_length select {
        margin: 10px 5px 10px 19px;
    }
    .nav-bar-mob .user-name { padding: 8px 0px 11px 0px; }
    .order-detail .r-panel .w-bg { padding: 0px; }
	.order-detail .r-panel .btn.spb2 { min-width: 120px;}
    .head-copy {        margin: 0px 5px 0px 13px;    }
	.primnav li img {    margin-right:10px;    width: 15px;}
    .primnav{width:80%}
    table.dataTable {        margin-top: 10px !important;    }
    .corporate-header {
        display: flex;
        height: 130px;
    }
input.hamburger:checked ~ nav.primnav {
    height: 100vh;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;   transition: 0.6s;
	margin: 0;
    filter: drop-shadow(19px 3px 34px black);
}
.corporate-header .topbar .flex-bx {
    flex-wrap: wrap;
    max-height: initial;
    justify-content: left;
}
.primnav li {
    padding: 8px 15px;
    margin:5px 10px;
    height:40px;
}
.primnav {
    width: 100%;
    position: absolute;
    height: 100vh;
    z-index: 99;
    left: -350px;
    max-width: 300px;
	    transition: 0.6s;
    top: 0;
}
.corporate-header .topbar .flex-bx a {
    padding: 20px 13px;
}
input.hamburger {
    width: 40px;
    height: 40px;
    display: block;
    position: fixed;
    top: 9px;
    z-index: 99;
    right: 14px;
    -webkit-appearance: none;
    background: url(../images/menu.png) no-repeat left;
    background-size: 90%;
    border-radius: 5px;

}

input.hamburger[type="checkbox"]:checked {
	 background: url(../images/close.png) no-repeat left;
    background-size: 90%;
}
    .dataTables_filter label {
        font-weight: 600 !important;
        display: inline-flex;
        align-items: center;
        margin-bottom: 0;
    }
.dataTables_wrapper.form-inline {
    justify-content: flex-start;
}
.order-detail .head {
    align-items: baseline;
    margin-bottom: 30px;
}
.reports-info .w-bg{min-width: 320px; padding: 15px;}
	.reports .w-bg{min-width: 320px; padding: 15px;}

}
@media only screen and (min-width:1100px) and (max-width:1300px) {
    .primnav {        width: 24%;    }    
}
 @media only screen and (min-width:300px) and (max-width:1100px) {
.col-sm-6.map.order-detail {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
}
	.order-detail .head.r-panel{    margin-top: 20px;    margin-bottom: 25px; flex-wrap: wrap;}
	.orderdetail-table-wrap {
    margin-bottom: 20px;
    padding: 0px;
}
	.order-detail-order-lines {    margin-top: 210px;}
    .filter-popup {
        max-height: 500px;
        overflow: scroll;
    }
    .col-md-6.l-panel {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
    }

        .col-md-6.r-panel {
            width: 100%;
            max-width: 100%;
            flex: 0 0 100%;
        }

        .order-detail .r-panel .head {
            margin-top: 25px;
            margin-bottom: 28px;
        }
    }

    .open .multiselect-container {
        display: block;
    }

    .logo-link {
        cursor: pointer;
    }

    .details {
        position: fixed;
        display: none;
    }

    .cancelled {
        background: red;
    }
    .ui-timepicker{
        z-index: 9999;
        position: relative;
    }
    }
    #orderPriorityTable tr {
        cursor: move;
    }
    #order_line_item_title {
        font-size:17px;
    }
    .cursor_pointer {
        cursor:pointer;
    }
.paginate_button active {
    background: #124634 !important;
}

    .paginate_button active a {
        color: white !important;
    }
a.disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
}
.order-detail-section-header {
    margin-left: 10px;
}