@font-face {
  font-family: Evolventa;
  src: url("fonts/Evolventa.ttf") format("truetype");
}

.test {border: 2px solid red; color: red;}
.clear {clear: both;}
.left {text-align: left;}
.right {text-align: right;}
.center {text-align: center;}
.vcenter {vertical-align: middle;}
.vtop {vertical-align: top;}
.floatLeft {float: left;}
.floatRight {float: right;}
.wide {padding-left: 10px !important; padding-right: 10px !important;}
.bigger {font-size: 1.6em;}
.arrowLeft:before {content:'\1F868'; margin-right: 10px;}
.arrowRight:after {content:'\1F86A'; margin-left: 10px;}
.pointer {cursor: pointer;}
.sideSpacer {padding-left: 5px; padding-right: 5px;}
.underline {text-decoration: underline;}
.pointer {cursor: pointer;}
.mini {font-size: 0.5em; position: relative; top: -3px;}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.w20 {width: 20px;}
.w40 {width: 40px;}
.w50 {width: 50px;}
.w75 {width: 75px;}
.w80 {width: 80px;}
.w120 {width: 120px;}
.w150 {width: 150px;}
.w200 {width: 200px;}
.w100p {width: 100%;}
.mw200 {min-width: 200px;}
.table {display: table;}
.tablecell {display: table-cell;}
.inlineBlock {display: inline-block;}
.hidden {display: none;}
.spacer20 {clear: both; margin-bottom: 20px;}

.stroke {text-decoration: line-through;}
.noDecoration {text-decoration: none;}
.bold {font-weight: bold;}
.black {color: #000;}
.red {color: #F00; font-weight: bold;}
.white {color: #FFF;}
.errorField {border-color: red !important; box-shadow:  0 0 0 1px #F00;}
.highlightRed {border: 2px solid red !important;}
.highlightGreen {border: 2px solid green !important;}
.attention {background-color: #FDD;}
.brightGreen {background-color: #AFA;}
.brightBlue {background-color: rgba(30,220,255,1);}
.brightRed {background-color: #F00;}
.brightPink {background-color: #FBB;}
.brightYellow {background-color: #FFB;}
.brightGrey {background-color: #AAA;}
.lightGrey {background-color: #EEEEEE;}
.topRightIcon {float: right; cursor: pointer; margin: 15px 15px 0px 0px;}

.dialog {display: none; font-size: 0.7em;}

body {margin: 0px; font-family: Evolventa; font-size: 20px;}
fieldset,legend {display: inline-block;}
h1 {font-size: 1.6em; margin: 0px 0px 20px 0px;}
button {padding: 4px; background-color: #FFF; border: thin solid #000; font-family: Evolventa;}
.stoOuter {position: absolute; display: table; width: 100%; height: 100%; background-color: #000; }
.stoInner {display: table-cell; vertical-align: middle; text-align: center;}
.stoLoginForm {text-align: left; display: inline-block; color: #AAA;}
.stoPw {font-size: 3em; text-align: center; margin-top: 10px; border: 2px solid #777; border-radius: 8px; outline: none; color: #AAA; background-color: transparent; max-width: 300px;}
.empLoginButton {display: inline-block; width: 220px; color: #FFF; margin: 0px 25px 25px 0px; padding: 10px; border: 2px solid transparent; border-radius: 8px; cursor: pointer;}
.empLoginButton:hover,.selectedButton {border-color: #FFF;}
.empPosition {font-size: 0.65em; color: #FFF;}
.empPass {display: none; margin-top: 30px; font-size: 0.8em;}
.stoEmpPw {font-size: 3em; text-align: center; margin-top: 6px; border: 2px solid #FFF; outline: none; color: #FFF; background-color: transparent; width: 215px;}
.linkBack {color: #AAA; text-decoration: none;}
.linkBack:before {content:'\2039  ';}

#mainMenu {position: fixed; top: 0px; left: 0px; z-index: 10; width: 250px; height: 100%; background-color: #E5E5E5; padding-top: 8px; overflow-y: auto;}
#mobileMenu {position: absolute; top: 8px; left: 8px; z-index: 5; display: none; cursor: pointer;}
.menuTableContainer {width: 100%; margin-bottom: 30px;}
.quitIconTd {padding-right: 10px; width: 40px; text-align: right;}
.img32 {width: 32px; height: auto; margin-top: 7px;}
.menuUserLabel {width: 100%; padding: 6px; color: #FFF;}
.menuItem {background-color: #AAA; padding: 5px 0px; margin-bottom: 3px; width: 100%; cursor: pointer;}
.menuItem:hover,.menuItemActive {background-color: #E09900;}
.menuItemIcon {padding: 0px 8px; display: table-cell; }
.menuItemIconItself {vertical-align: middle;}
.menuItemLabel {display: table-cell; vertical-align: middle; padding-top: 3px; font-size: 18px;}
.menuMessage {margin: 8px;}
#mainArea {margin-left: 250px; padding: 8px;}
.loader {text-align: center; }

.button {cursor: pointer; border-radius: 6px; outline: none;}
.buttonMB {margin-bottom: 10px;}
.button:hover {box-shadow: 0 0 15px 3px #999;}

.accItem {margin-bottom: 2px;}
.accHeader {padding: 15px; cursor: pointer; display: table; width: calc(100% - 30px); background-color: #DDD;}
.accHeaderActive {color: #FFF; background-color: #007FFF;}
.accPlus {display: table-cell; width: 40px; font-size: 1.6em; vertical-align: middle;}
.accPlus:before {content: '+';}
.accHeaderActive .accPlus:before {content: '\02013';}
.accData {display: table-cell; vertical-align: middle;}
.accContent {display: none; padding: 20px 0px; }
.accArrow {display: table-cell; vertical-align: middle; width: 40px;}
.accArrow img {vertical-align: middle;}
.accMainData,.accColorData,.accPrivData,.accDeactivate {margin-top: 6px;}
.deactivateEmp {display: inline-block; font-size: 0.8em; border: 1px solid #000; padding: 6px 10px;}
.deactivateYes,.deactivateNo {display: inline-block; font-size: 1.2em; border: 1px solid #000; padding: 6px 10px; margin-right: 30px;}
.deactivateDo {display: none; font-size: 0.65em; margin: 10px 0px 15px 0px;}
.accMainDataCell {display: inline-block; margin: 0px 6px 6px 0px;}
.accContent label {display: block; font-size: 0.6em; } 
.accMainData input {padding: 10px; border: thin solid #777; font-family: Evolventa; font-size: 1em; }
.colorItem {width: 30px; height: 30px; display: inline-block; margin: 0px 6px 6px 0px; cursor: pointer; border: 0px;}
.colorItemSelected {box-shadow: 0 0 0 5px #F00;}
.privItem {display: inline-block; font-size: 0.8em; border: 1px solid #AAA; margin: 0px 6px 6px 0px; padding: 6px 10px; color: #AAA;}
.privItemEnabled {background-color: #0C3; color: #FFF; border-color: #0C3;}

.accAddNew,.savePlan,.saveSendPlan {display: inline-block; font-size: 1em; border: 1px solid #000; padding: 6px 10px; margin-top: 15px; margin-right: 30px;}

#actionResult {display: none; margin-bottom: 20px;}
.formDataSet {display: block; margin: 0px 0px 10px 0px; }
.formDataItem {display: inline-block; margin: 0px 6px 6px 0px;}
.formDataItem label {display: block; font-size: 0.6em;}
.formDataItem input {padding: 10px; border: thin solid #777; font-family: Evolventa; font-size: 1em; background-color: #E0FFE0;}
.formDataItem input.required {background-color: #FFFFC0;}
.submitButton {background-color: #FFF !important;}
.whiteBG {background-color: #FFF !important;}

.formDataItem2 {display: inline-block; float: left; margin: 0px 10px 10px 0px;}
.formDataItem2 label {display: block; font-size: 0.6em;}
.formDataItem2 input {padding: 10px; border: thin solid #777; font-family: Evolventa; font-size: 1em; background-color: #F6F6F6;}

.locGroup {margin: 0px 50px 50px 0px; display: inline-block; }
.locItem {display: inline-block; border: 1px solid #BBB; margin: 0px 20px 20px 0px; box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.7);}
.locHeader {background-color: #BBB; font-size: 0.8em; color: #000; padding: 4px; cursor: pointer;}
/*.locHeader:hover {cursor: pointer;}*/
.locCore {min-width: 115px; min-height: 115px; padding: 15px 0px 0px 15px;}
.locPlaces {font-size: 0.8em;}
.vehItem {position: relative; float: left; width: 100px; height: 100px; border: 0px; margin: 0px 5px 5px 0px; text-align: center; background-color: #DDD; cursor: pointer;}
.vehItemLow {height: 66px;}
.vehItem:hover {}
.vehItemSelected {background-color: #007FFF; color: #FFF;}
.vehItemComplected {background-color: #FF0; color: #000;}
.vehHeader {background-color: #FFF; font-size: 0.8em; color: #000; padding: 2px; margin: 2px;}
.vehDetails {font-size: 0.6em; padding: 2px; position: relative;}
.vehDetails img {position: absolute; top: 0; left: 0; z-index: 1;}
.vehDetailsInner {position: relative; z-index: 2;}
.smallModelFont {font-size: 0.8em; line-height: 1.2em;}
.vehStatus,.vehStatusIdle {position: absolute; bottom: 0px; font-size: 0.6em; color: #FFF; width: 100%; }
.vehStatus:hover {box-shadow: 0 0 6px 4px rgba(30,220,255,1); background-color: rgba(30,220,255,1) !important; color: #000;}
.vehStatusSetting {display: none; padding: 4px;}
.vehStatusLabel {height: 32px; vertical-align: middle; display: table-cell; padding: 0px 2px;}
.vehStatusActive {box-shadow: 0 0 6px 4px rgba(30,220,255,1); background-color: rgba(30,220,255,1) !important; cursor: default; color: #000;}
.updateStatusImage {cursor: pointer;}
.vehStatusList {position: absolute; left: -11px; z-index: 3; width: 120px; border: solid #999; border-width: 2px; background-color: #FFF; color: #FFF; cursor: pointer; box-shadow: 0 0 2px 2px #999; display: none;}
.vehStatusItem {border: solid #999; border-width: 2px; z-index: 4; padding: 10px;}
.vehStatusItem:hover,.vehStatusItemActive {border-color: rgba(30,220,255,1);}
.loading1 {position: absolute; top: 0px; left: 0px; z-index: 2; background-color: rgba(255,255,255,0.8);}
.releaseList td {padding: 5px 30px 5px 0px;}

.vehLowMargin {position: absolute; bottom: 2px; right: 2px; z-index: 3; width: auto; height: auto; background-color: #BB00FF; font-size: 10px; color: #FFF; padding: 2px 2px 0; border-radius: 3px;}
.lowMargin {background-color: #BB00FF; color: #FFF;}
.vehLowMargin2 {position: absolute; bottom: 2px; right: 2px; z-index: 3; width: auto; height: auto; background-color: #6600FF; font-size: 10px; color: #FFF; padding: 2px 2px 0; border-radius: 3px;}
.lowMargin2 {background-color: #6600FF; color: #FFF;}

.vehUrgent {position: absolute; top: 0; right: 2px; z-index: 1; width: 18px; height: 18px; background-image: url(../images/bolt.png); display: none;}
.vehItemUrgent .vehUrgent {display: block;}

/* vehicle context menu */
.clrContextMenu {position: fixed; z-index: 100; background-color: #AAA; border: 1px solid #AAA; font-size: 14px; display: none;}
.clrCtxMenuItem {padding: 12px 8px 10px; cursor: pointer; background-color: #FFF;}
.clrCtxMenuItem:not(:last-child) {margin-bottom: 1px;}
.clrCtxMenuItem:hover {color: #EA8825; background-color: #000;}
.clrCtxIcon {display: inline-block; width: 18px; height: 18px; vertical-align: middle; position: relative; top: -3px; margin-right: 10px; background-position: center; background-repeat: no-repeat; background-size: 100%;}
.clrCtxMenuItem:hover .clrCtxIcon1,.clrCtxMenuItem:hover .clrCtxIcon2,.clrCtxMenuItem:hover .clrCtxIcon3,.clrCtxMenuItem:hover .clrCtxIcon4 {filter: invert(1);}
.clrCtxIcon1 {background-image: url(../images/bolt.png);}


.plan {display: none; clear: both;}
.planSectionCaption {font-weight: bold; margin-bottom: 10px;}
#complains {margin: 10px 0px 25px 0px;}
.planModeSelector {margin-bottom: 20px;}
.planItem {width: 70%; padding: 5px; border: 1px solid #777; font-family: Evolventa; font-size: 16px; display: inline; margin-top: -1px;}
/*.planItem:last-child {border-bottom: 1px solid #777;} */
.planQty,.planPrice {width: 7%; padding: 5px; border: 1px solid #777; font-family: Evolventa; font-size: 16px; text-align: center; display: inline; margin-top: -1px;}

.vehFooter {position: absolute; bottom: 0px; font-size: 0.6em; width: 100%; }
.progressBarLabel {width: 100%; text-align: center; background-color: transparent; position: absolute; z-index: 5;}

.standardButton,.smallButton {display: inline-block; border: 1px solid #000; padding: 6px 10px; margin: 0px 30px 20px 0px;}
.smallButton {font-size: 0.7em;}
.smallSingleButton {border: 1px solid #000; padding: 6px 10px; font-size: 0.7em; display: inline-block;}
.distrButton {border: 1px solid #000; padding: 1px 4px; }

.vehicleData {float: left; margin-right: 30px;}
.vehicleData table {border: 1px solid #CCC; border-collapse: collapse;}
.vehicleData table th {padding: 3px 5px 0px 5px; font-size: 0.7em; text-align: left; background-color: #EEE;}
.vehicleData table td {padding: 3px 30px 0px 5px; font-size: 0.7em;}

.currentDataTable {float: left; margin-right: 20px; margin-bottom: 20px; border: 1px solid #CCC; border-collapse: collapse;}
.currentDataTable th {padding: 10px 10px 10px 10px; font-size: 17px; text-align: left; background-color: #EEE;}
.currentDataTable th.subheader {padding: 10px 10px 10px 10px; font-size: 14px; text-align: left; background-color: #DDD; font-family: Arial; font-weight: bold; }
.currentDataTable td {padding: 3px 10px 0px 10px; font-size: 12px; vertical-align: top;}
.dc {font-weight: bold; font-family: Arial;}
.dv {font-family: Arial;}
.rowsUnderline td {border-bottom: 1px solid #CCC;}

.sparesList table,.positionList table {border: 1px solid #CCC; border-collapse: collapse;}
.sparesList table th,.positionList table th {padding: 3px 5px 0px 5px; font-size: 0.7em; background-color: #EEE;}
.sparesList table td,.positionList table td {padding: 3px 5px 0px 5px; font-size: 0.7em; }
.cancelButton,.acceptButton {cursor: pointer;}
.fitPosID,.varID {border: thin solid black; padding: 3px 15px 0px 15px; width: 30px; text-align: center; border-radius: 4px; cursor: pointer;}
.activePosition,.activeVariant {background-color: rgb(30,220,255);}

.fitting table,.orderList table,#supplyTable,.type01 {border: 1px solid #CCC; border-collapse: collapse;}
.fitting table th,.fitting table td,.orderList table th,.orderList table td,#supplyTable th,#supplyTable td,.type01 th,.type01 td {padding: 3px; font-size: 0.7em; border: thin solid #CCC;}
.fitting table th,.orderList table th,#supplyTable th,.type01 th {background-color: #EEE;}

.type02 {border: 1px solid #CCC; border-collapse: collapse; margin-bottom: 20px;}
.type02 tr:not(.noHover) {cursor: pointer;}
.type02 tr:not(.noHover):not(.rowSelected):hover {background-color: rgba(30,220,255,0.2);}
.type02 th {padding: 3px 5px; font-size: 12px; border-bottom: 1px solid #CCC; background-color: #EEE;}
.type02 td {padding: 2px 5px; font-size: 12px; font-family: Arial; border-bottom: 1px solid #CCC;}
.rowSelected {background-color: rgb(30,220,255);}

.type03 {font-size: 0.7em;}

.resultsTable,.resultsTableAlt {border: 1px solid #CCC; border-collapse: collapse;}
.resultsTable th,.resultsTable td,.resultsTableAlt th,.resultsTableAlt td {padding: 3px 8px; font-size: 0.7em; border: thin solid #CCC;}
.resultsTable th,.resultsTableAlt th {background-color: #EEE;}
.resultsTable tr:not(.noHover),.resultsTableAlt tr:not(.noHover),.orderPositions tr:not(.noHover){cursor: pointer;}
.resultsTable tr:not(.noHover):hover,.resultsTableAlt tr:not(.noHover):hover,.orderPositions tr:not(.noHover):not(.activePosition):hover {background-color: rgba(30,220,255,0.2);}

.vehicleData,.sparesList,.fitting,.searchResults,.searchResultsAlt {margin-bottom: 20px; }
.poltavaSupplier {background-color: #9BF;}
.ownSupplier {background-color: #FF0;}


.lineInput {padding: 4px; border: thin solid #777; font-family: Evolventa;}
.lineInput2 {padding: 2px; border: none; font-family: Evolventa;} 
.varNumber {padding-top: 6px !important;}
.tProducer,.tSerial,.tRemark,.tSupplier {width: 140px;}
.tDays,.tQty {width: 30px;}
.tPrice {width: 80px;}
.tPriceOut {width: 60px;}
#spName {width: 200px;}
#spQty {width: 30px; text-align: center;}
.saveFitting {display: inline-block; font-size: 1em; border: 1px solid #000; padding: 6px 10px; margin-top: 15px; margin-right: 30px;}
.fitControl {display: inline-block; font-size: 0.7em; border: 1px solid #000; padding: 6px 10px; margin-right: 30px;}
.saveFittingRed {color: #F00; border-color: #F00;}
.minimize1 {width: 32px; height: 32px; float: right; background-image: url(../images/up.png); cursor: pointer; margin: 15px 15px 0px 0px;}
.minimizeActive {background-image: url(../images/down.png); }
.delRow,.searchPS,.searchS {vertical-align: middle; cursor: pointer;}
#closeResults,#closeResultsAlt {float: right; cursor: pointer;}

.localMenu {display: none;}
.positionList,.orderList {float: left;}
.positionList {margin-right: 30px; margin-bottom: 20px;}
.qtySelect {font-size: 1em; font-family: Evolventa;}
.orderedVariant {background-color: rgba(30,220,255,0.2);}
.controls {margin: 30px 10px; width: 25%;}

.setState {cursor: pointer;}

.operations,.spares {margin: 20px 0px;}
.intHeader {display: none;}

.deliveryItem {max-width: 1000px;}
.deliveryHead {background-color: #DDD;}
.delSupplier {display: table-cell; vertical-align: middle;}
.delFlag {display: table-cell; vertical-align: middle; width: 40px;}
.delFlags {display: table-cell; vertical-align: middle; text-align: right;}
.meetFlag {display: inline-block; vertical-align: middle; width: 20px; height: 20px; border-radius: 5px; margin: 0px 2px 4px;}
.deliveryData {padding: 20px 10px;}
.deliveryList {clear: both;}
.delDate,.delCargo,.delDecl,.delCod,.delSave {float: left; margin-right: 15px;}
.delSave {margin-bottom: 10px !important;}
.delWait {float: left;}
.dSentDate,.dCargo,.dDecl,.dLookup { font-size: 1em; font-family: Evolventa; border: 1px solid #CCC;}
.dSentDate {width: 130px; text-align: center; height: 28px;}
.dCargo {width: 230px; height: 32px;}
.dDecl {width: 200px; text-align: center; height: 28px;}
.dLookup {width: 120px; text-align: center; height: 28px;}
.nalP {width: 60px !important; padding: 3px 5px; font-size: 1em !important;}
.accDeliveryActive {background-color: #007FFF; color: #FFF;}
.accDeliveryActive .accPlus:before {content: '\02013';}

.meetData {padding: 0px 10px;}
.meetItem {border: 1px solid #DDD; background-color: #F9F9F9; margin: 20px 0px; padding: 10px;}
.deliveryStatusLabel {margin-right: 30px; }
.sentLabel {display: inline-block; padding: 2px 8px 0px;}
.codLabel {display: inline-block; padding: 2px 8px 0px; background-color: #FFA;}
.codHeadLabel {display: inline-block; margin: 0px 10px 0px 5px; padding: 3px 8px 0px; background-color: #FFA; color: #000;}
.declLabel {display: inline-block; padding: 2px 0px 0px;}
.arrivalLabel {display: inline-block; color: #FFF; padding: 2px 8px 0px;}
.arronWay {background-color: #AAA;}
.arrarrivesToday {background-color: #0B0;}
.arrarrived {background-color: #B00;}

.checkBox {width: 32px; height: 32px; background-image: url(../images/unchecked.png); cursor: pointer;}
.checkBoxChecked {background-image: url(../images/checked.png);}

legend {font-size: 0.75em;}
.meetSettings {min-height: 54px;}
.planModeSelector .ui-checkboxradio-label {width: 190px; margin-bottom: 5px; font-size: 0.75em;}
.meetSettings .ui-checkboxradio-label {width: 120px; margin-bottom: 5px; font-size: 0.75em;}
#resetLookup {position: relative; top: 2px;}
.qtyArrived {width: 24px; text-align: center; margin-right: 12px; display: none;}
.explanation {font-size: 0.7em; margin-bottom: 20px; font-style: italic;}
.indicator {width: 100%; margin: 0px 0px 15px 0px; height: 14px; }
.print {display: none;}

.invoice,.nar {display: inline-block; padding: 5px 20px; box-shadow: 5px 5px 9px 4px #777;}
.invoiceSuperHeader {font-size: 2em;}
.invoiceHeader {margin: 20px 0px 5px;}
.hiddenSerial {display: none;}

.expandButton {display: inline-block; margin-left: 5px; width: 12px; height: 12px; background-image: url(../images/expand.png); cursor: pointer; background-size: contain;}
.expandButtonExpanded {background-image: url(../images/collapse.png);}
.plan1Data,.plan2Data,.completeData,.setData {display: none;}
.editButton {display: inline-block; margin-left: 10px; width: 12px; height: 12px; background-image: url(../images/pencil.png); cursor: pointer; background-size: contain;}


.year {display: inline-block; cursor: pointer; padding: 5px 15px 2px; margin: 0px 10px 10px 0px; border: 1px solid #CCC;}
.yearSelected {background-color: #007FFF; border-color: #007FFF; color: #FFF;}
.yearDisabled {background-color: #DDD; border-color: #DDD; color: #888; cursor: default;}
#return {cursor: pointer;}

.flagged {color: #FFF; }
.flagSelector {display: none; width: 96px; text-align: center; padding: 2px 0px; border: 2px solid #CCC; position: absolute; left: 0px; top: -34px; background-color: #CCC;}
.flagCB {transform: scale(1.5);}

#st_comp {color: #000;}



.ui-progressbar {height: 1.2em;}
.ui-progressbar-value {background-color: rgb(30,220,255);}
/*.ui-widget.ui-widget-content {border-width: 0px; margin: 0px 2px;} */
.ui-widget-overlay {background-color: #000; opacity: 0.5;}
.ui-slider {border: 1px solid #c5c5c5 !important;}
/*.ui-selectmenu-button {padding: 12px 20px;} */

#custom-handle {
  width: 3em;
  height: 1.6em;
  top: 50%;
  margin-top: -.8em;
  text-align: center;
  line-height: 1.6em;
}

@media (max-width: 800px) {
  h1 {font-size: 1.2em; margin-left: 50px;}
  .vehItem {margin: 0px 10px 10px 0px;}
  #mainMenu {margin-left: -250px;}
  #mobileMenu {display: block;}
  #mainArea {margin-left : 0px;}
  .minimize1 {margin: 0px;}
  .controls {width: 75%;}
  .meetData {padding: 0px;} 
  .deliveryStatusLabel {margin-right: 20px; }   
}

@media print {
  .noPrint,#mobileMenu {display: none;}  
  .print {display: block;}
  .invoice,.nar {padding: 0px; box-shadow: none;}
}