@import url("alvara.modern.patch.css");
@import url("alvara.basic.css");

/* pre-defined color codes 

  color       dark        light/cold
  ******      ******      ******
  green       #01A301     #80D280
  yellow      #E3A219     #F1D18C
  orange/red  #DB532C     #EDA995
  red/cold    #B91C47     #DB8BA3
  blue        #2E88F0     #95C4F7
  
  red alternative         #282828   (nearly ALVARA)
  dark blue               #00597E
  
  grey tones  percent
  #4D4D4D     70
  #666666     60
  #808080     50
  #999999     40
  #B3B3B3     30
  #CCCCCC     20
  #E6E6E6     10

*/




html, body {
  min-height: 100%;
}

body.pre-script, body.unload-script #content {
  /*display: none !important;*/
  opacity: 0.4;
}
body.unload-script div.sleepapp {
  opacity: 1;
}

tr.pointer {
 coursor: pointer;
}
body.pre-script #content {
	opacity: 0;
}

body.pre-script #sleepapp, body.pre-script #msgboxviewer, body.pre-script #message, body.pre-script #viewmessage, body.pre-script #generate-one-time-code-dialog {
  display: none;
}

body, div, dl, dt, dd, li, pre, form, fieldset, input, textarea, p, blockquote, th, td, h1, h2, h3, h4, b, strong, button {
  font-family: Arial, Calibri, sans-serif !important;
}

div.logo {
  background-image: url(/images/alvara_logo_white_hotline_v2.png);
  background-position: 0 2px;

  
  text-align: center;
}

div.header {
  position: relative;
  /* background-image: url(../images/blue-red-line.png); */
  background: linear-gradient(#363FBF, #363FBF);
  background-color: #FFF;
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: 100% 32px;
  height: 110px;
  border-bottom: 1px solid white;
}

div.leftbar {
  overflow-y: auto;
  position: relative;
  top: auto;
  bottom: auto;
  z-index: auto;
  width: auto;
  min-width: 200px;
  padding: 0px 15px 0px 15px;
  margin: 1px 0px 0px 5px;
  border-right: 1px solid #CCC;
}

div.leftbar hr {
  background-color: #CCC;
  border-style: solid;
  height: 1px;
  border: 0px;
  margin: 2px;
}


.wrap {
  display:flex
}
.lineLong {
  border-bottom:2px solid #D5D5D5;
  width:60%;
  margin:10px;
}
.lineShort {
  border-bottom:2px solid #D5D5D5;
  width:40%;
  margin:10px;
}


div.mainmenu, div.submenues {
  border: 0px;
  background-color: transparent;
}
div.mainmenu {
  margin: 8px 8px 1px 8px;
}

.activeButton:not([disabled]) {
  font-size: 9pt;
  background-color: #182c61;
  color: #ffffff;
  padding: 7px;
  border-radius: 5px;
  font-weight: bold;
}
#leftbar div.submenues > a, #leftbar div.submenues > a:visited, #leftbar div.submenues > a:link, #leftbar div.submenues > a.submenulinkactive, #leftbar div.submenues > a:hover {
  font-size: 13px;
  margin: 2px 0px 1px 0px;
}
#leftbar div.submenues > a, #leftbar div.submenues > a:visited, #leftbar div.submenues > a:link {
  color: #282828;
}
#leftbar .submenulinkactive {
  color: #363FBF;
  border-radius: 6px;
  background: #d7d9ed;
  scroll-margin-bottom: 200px;
}

#leftbar a:hover {
  color: #363FBF;
  border-radius: 6px;
  background: #e8e8f1;
  scroll-margin-bottom: 200px;
}


#leftbar .submenulinkactive {
  font-weight: bold;
}

ul.sideMainMenu li > a.menuLevel2 {
  padding-left: 20px;
}
ul.sideMainMenu li > a.menuLevel3 {
  padding-left: 30px;
}


div.navigation {
  background-color: #686868;
}

.portlet {
  margin: 0 5px 15px 10px;
  box-shadow: rgb(0 0 0 / 35%) 0px 2px 6px;
}
.portlet-header {
  height: 20px;
  line-height: 20px;
  vertical-align: middle;
  padding: 2px 2px 2px 5px;
  background-color: #282828;
  border: 1px solid #686868;
  border-radius: 4px;
}

#content {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  background: transparent;
  display: flex;
  flex: 1;
  height: calc(100vh - 140px);
}

#footer, div.footerSpacer {
  height: 25px;
}
#footer {
  bottom: auto;
  position: relative;
  background-image: none !important;
  background-color: #686868;
  /*
  left: 0px;
  width: auto;
  right: 18px;
  */
}

div#main, div#wrapper {
  height: auto;
  margin: 0px;
}
div#wrapper {
  /*margin-bottom: 30px;*/
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin-bottom: -30px;
}

div.introLogo {
  display: none;
}

table.tbllist, table.tblform {
  background-color: transparent;
}

table.tbllist .columnDateTime {
  width: 150px;
}

div.calendar div.weekday, div.calendar {
  background-color: transparent;
}

div.calendar div.row {
  height: 100px;
}

div.calendar .calendarValue {
  color: inherit;
  float: left;
  width: 23% !important;
  padding: 2px !important;
  margin-top: 5px;
}
div.calendar div.fgreen {
  background-color: #17AB75;
  color: white;
}
div.calendar div.fyellow {
  background-color: #FAD05A;
  color: black;
}
div.calendar div.fred {
  background-color: #F55050;
  color: white;
}

div.badge_none {
  color: white;
  font-weight: bold;
  border-radius: .25em;
  text-align: center;
}

div.badge_green {
  background-color: #809F45; 
  color: white;
  font-weight: bold;
  border-radius: .25em;
  text-align: center;
}

div.badge_yellow {
  background-color: #FAD05A; 
  color: black;
  font-weight: bold;
  border-radius: .25em;
  text-align: center;
}

div.badge_red {
  background-color: #B92F3E; 
  color: white;
  font-weight: bold;
  border-radius: .25em;
  text-align: center;
}


table.tbllist, table.tblform {
  border-collapse: separate;
}

.toggleButton {
  width: 190px;
  margin-right: 10px;
}

.toggleButton:hover {
  width: 190px;
  margin-right: 10px;
  background-color: #eeeeee !important;
}

.toggleButton:active {
  width: 190px;
  margin-right: 10px;
  background-color: #eeeeee !important;
}

table.tbllist td {
  padding: 5px 2px 5px 8px;
}
tr.row1, tr.rowNoHover1 {
  background-color: #F4F4F4;
}
tr.row0, tr.rowNoHover0 {
  background-color: #FFF;
}
tr.rowhead, tr.row1:hover, tr.row0:hover {
  background-color: #E6E6E6;
}

tr.tabletitle, td.tabletitle {
  background-color: #282828;
  color: white;
}

.menuCaptionTag {
  border-radius: 7px;
  height: 40px;
}

tr.tabletitle > td:first-child {
  border-radius: 6px 0px 0px 6px;
}
tr.tabletitle > td:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  padding-right: 4px !important;
}
tr.tabletitle > td {
  padding: 8px 0px 8px 20px !important;
  vertical-align: middle;
}
tr.tableColumns > td {
  border-top: 10px solid white;
}
tr.tableSpacer > td {
  border-top: 10px solid white;
}
table.singleTable {
  margin-top: 20px !important;
}

div.sleepapp, div.progressbar {
  opacity: 1;
  background-color: transparent;
  color: black;
  font-size: 1.7em;
  color: #4D4D4D;
}
div.progressbar {
  width: auto;
}

div.tableSearch {
  float: right;
  padding-right: 5px;
}

div.tableSearch input {
  box-shadow: #E6E6E6 0px 0px 1px 1px;
  border: 1px solid #999;
  margin-left: 3px;
}

div.messagebox {
  font-size: 14px;
}

div.messagebox span.underline {
  text-decoration: underline;
}
div.messagebox span.bold {
  font-weight: bold;
}


#infoRevokeCodes {
  width: 16px;
  padding: 0;
  margin: 0 0 8px 0 !important;
}

#infoRevokeCodes:hover {
  cursor: pointer;
}

div.messagebox #msgmessage {
  font-size: 12px !important;
}

table.dlgMaindata a.dashboard, table.dlgMaindata a.dashboard:visited, table.dlgMaindata a.dashboard:link, table.dlgMaindata a.dashboard:hover {
  display: block;
  float: right;
  margin: 12px;
}

table.noDashboard a.dashboard, table.noDashboard a.dashboard:visited, table.noDashboard a.dashboard:link, table.noDashboard a.dashboard:hover {
  display: none;
}

#contracts tbody tr.deprecated td {
  color: #777;
}
#contracts tbody tr.deleted td {
  color: #777;
  text-decoration: line-through;
}

#content div.infobox, #content div.contractinfo {
  border-color: #CCC;
  border-radius: 4px;
  padding: 6px;
  margin: 4px 13px 4px 13px !important;
}

table.mobuleStoreOrder div.infobox {
  width: 310px;
}

div.contractinfo {
  width: 320px !important;
}
#headerMinMaxValueMaxWeight {
  clear: left;
}

table.moduleUsers td.actionColumn {
  min-width: 105px;
}

div.formOptionBlock {
  display: inline-block;
  margin-right: 15px;
  padding: 2px 2px 2px 0px;
}
div.formOptionBlock input {
  margin: 0px 3px 0px 0px;
}

table.moduleDrivers tr.tabletitle td:last-child {
  min-width: 300px;
}

ul.sideMainMenu li, ul.sideMainMenu ol li {
  list-style: none;
  line-height: normal;
}
ul.sideMainMenu ol li {
  line-height: 1.3;
}
ul.sideMainMenu, ul.sideMainMenu ol {
  padding-left: 0px;
}
ul.sideMainMenu a, ul.sideMainMenu a:visited, ul.sideMainMenu a:link, ul.sideMainMenu a.mainmenulinkactive, ul.sideMainMenu a:hover {
  color: #333;
  font-size: 13px;
  display: block;
  padding-left: 10px;
  padding-right: 10px;
  padding-block: 5px;
}
ul.sideMainMenu > li > a, ul.sideMainMenu > li > a:visited, ul.sideMainMenu > li > a:link, ul.sideMainMenu > li > a.mainmenulinkactive, ul.sideMainMenu > li > a:hover {
  font-weight: bold;
  font-size: 14px;
  color: #000;
  padding-bottom: 5px;
  display: block;
}
ul.sideMainMenu li > a {
  padding-left: 10px;
}
ul.sideMainMenu ol {
  border-top: 1px solid #CCC;
  padding-top: 5px;
}
ul.sideMainMenu > li {
  padding-bottom: 10px;
  padding-block: 10px;
  width: 195px;
}
#leftbar div.submenues > a.submenulinkactive, #leftbar div.submenues > a:hover {
  color: #B91C47;
}

div.infoboxSelectable {
  cursor: pointer;
  color: #888;
  border-color: #686868 !important;
}

div.infoboxSelected {
  border-color: #363FBF !important;
  background-color: #d7d9ed!important;
  color: #000;
}

td.alignBottom {
  vertical-align:bottom;
}
td.alignTop {
  vertical-align:top !important;
}

div.identifiersWrapper{
  width:100%;
  overflow: hidden;
}

div.idents {
  width:50%;
  float:left;
}
p.placeHolder{
  visibility:hidden;
}
img.receiptView {
	max-height: 600px;
}

img.documentView {
  max-height: 270px;
}

#approach div.firstContent {
  margin-bottom: 0px !important;
  border-radius: 3px 3px 0px 0px;
  border-bottom: 0px;
}
#approach div.lastContent {
  margin-top: 0px !important;
  border-radius: 0px 0px 3px 3px;
  border-top: 0px;
}
#approach div.additionalContent {
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  border-radius: 0px;
  border-top: 0px;
  border-bottom: 0px;
}


#approach div.monitoringLayer {
  position: relative;
}

#approach div.monitoringLayer button.ui-widget-header {
  height: 25px;
}

#approach div.monitoringLayer div.footerButtons {
  position: absolute;
  bottom: 3px;
  height: 30px;
  width: 100%;
}


#approach table.storeOrders span.error {
  border: 0px !important;
  color: #F55050;
  box-shadow: none !important;
}

#approach table.dynamicContainerList  {
  border-collapse: separate;
}
#approach table.dynamicContainerList td, #approach table.bagsTbl td {
  padding: 4px 8px;
  vertical-align: top;
}

#approach table.dynamicContainerList tr.pending {
  border: 1px solid transparent;
}

#approach table.dynamicContainerList tbody tr.unknownSscc {
  border: 1px solid #363FBF;
}

#approach table.dynamicContainerList tbody tr.alreadyInUse {
  -moz-box-shadow:    inset 0 0 10px #ffcc00;
  -webkit-box-shadow: inset 0 0 10px #ffcc00;
   box-shadow:        inset 0 0 10px #ffcc00;
   font-weight: bold;
}

#approach table.dynamicContainerList tbody tr.duplicateNo {
  -moz-box-shadow:    inset 0 0 10px #ffcc00;
  -webkit-box-shadow: inset 0 0 10px #ffcc00;
   box-shadow:        inset 0 0 10px #ffcc00;
   font-weight: bold;
}

#approach table.dynamicContainerList tbody tr:hover {
  background-color: #ccc;
  cursor: pointer;
}

#approach table.bagsTbl {
  box-shadow: rgb(0 0 0 / 35%) 0px 2px 6px;
  border-collapse: collapse;
}

#approach div.fixedWidth {
  width: 235px !important;
}
table.singleTable tr.inactive td {
  color: #444;
  font-style: italic;
}

#md-details-content tr.masterdataHistory td {
  height: 20px;
  vertical-align: middle;
}

#approach table.denominationTable {
  width:60% !important;
  border: 1px solid lightgray;
  box-shadow: 5px 5px 5px lightgray;
  margin:15px;
}

#approach table tr.denominationHeader td{
  background-color:#F4F4F4;
  font-weight: bolder;
  text-align: center;
  padding: 4px;
}

.ui-widget-content a.showHistory, .ui-widget-content a.showHistory:link, .ui-widget-content a.showHistory:visited {
  color: #363fbf;
}

.ui-widget-content a.historyAvailable, .ui-widget-content a.historyAvailable:link, .ui-widget-content a.historyAvailable:visited {
  color: #000;
}

.bagTableWrapper {
	height: auto !important; 
	height: 601px;           
	min-height: 601px; 
	align:center;	
}
.weekDays {
  font-size:11px !important;
  font-weight:bold;
}
.ui-jqgrid-btable .ui-state-highlight {
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, .15)), to(rgba(0, 0, 0, .25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .1)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
  background: -moz-linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  background: linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
  border: 1px solid  rgba(255, 255, 255, .15);
  box-shadow: rgba(25,25,25,.04) 0 0 1px 0,rgba(0,0,0,.1) 0 3px 4px 0;


}

#file-upload {
  display: none;
}
.custom-file-upload {
  display: inline-block;
  padding: 2px;
  cursor: pointer;
}
#openChildStr {
  cursor:alias !important;
}

.unreadBubble {
  border: 0.1em solid #282828;
  border-radius: 100%;
  height: 15px;
  width: 15px;
  text-align: center;
  float:right;
  background: #282828;
}

.unreadBubble p {
  margin-top: 1px;
  margin-right: 0.5px;
  font-size: 10px;
  font-weight: bold;
  color: #FFFFFF;
}

.driverFrm .largeSelect {
  width: 522px !important;
  margin-left:3px;
}

.driverFrm .largeInput {
  width: 515px !important;
  margin-left:3px;
}

.driverFrm .mediumInput {
  width: 250px !important;
}

.driverFrm .containerImagePlaceHolder {
  height:190px;
  width:170px;
  border-radius: 10px;
  text-align: center;
  background: #686868;
  box-shadow: 12px 12px 24px 0 rgba(0, 0, 0, 0.2), -12px -12px 24px 0 rgba(255, 255, 255, 0.5);
  margin:10px 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.driverFrm .containerImageDriver {
  max-height:350px;
  max-width: 350px;
  border-radius:10px;
  height:300px !important;
}

.driverFrm .containerImageDriverUpdate {
  max-height:350px;
  max-width: 350px;
  border-radius:40px;
}

.driverFrm .smallSelect {
  width: 65px !important;
  margin-left:3px;
}

.driverFrm .imgPlaceHolder {
  margin-top: 18px;
  opacity: 60%;
}


.driverFrm #employeeCardsContainer {
  width:100%;
  display: table;
  height:1px;
}

.driverFrm .employeeCardBox{
  border-collapse: collapse;
}

.driverFrm .employeeCardBox tr td{
 /* background: #ccc;*/
  color:#f1f1f1;
}

.driverFrm .employeeCardBox tr:nth-child(1) td:nth-child(1){
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
}

.driverFrm .employeeCardBox tr:nth-child(1) td:nth-child(2){
  border-top-right-radius: 7px;
}
.driverFrm .employeeCardBox tr:nth-child(2) td:nth-child(1){
  border-bottom-right-radius: 7px;
}

.driverFrm .employeeCardTblFrame {
  border-radius: 7px;
  width: 25% !important;
  float: left;
  margin-right: 15px;
  background: #686868;
  box-shadow: 12px 12px 24px 0 rgba(0, 0, 0, 0.2), -12px -12px 24px 0 rgba(17, 16, 16, 0.03);
}


.driverFrm .employeeCardTblFrame img ,.driverFrm .employeeCardTblFrame img {
  opacity:75%;
}

.driverFrm .employeeCardTblFrame:not(.inactive):hover{
  cursor: pointer;
  transform: scale(1.04);
}

.driverFrm .inactive{
  opacity: 35%;
  color: #4f4f4f;
}


#employeeCardsMarked .selectedBar {
  width:25%;
  height:5px;
  border: 0;
  background-image:linear-gradient(to right, #282828, #282828, #282828);;
  float:left;
  margin-right:15px;
  padding-left: 2px;
  margin-top: 3px;
}

#employeeCardsMarked .bar {
  width:25%;
  height:5px;
  border: 0;
  float:left;
  margin-right:15px;
  padding-left: 2px;
  margin-top: 3px;
}


.hideBar {
  visibility: hidden;
}

#addEmployeeCardBtn, #removeEmployeeCardBtn {
  height: 74px;
 border: 1px solid #d4d4d4;
  background: #686868;
  box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.2), -6px -6px 10px 0 rgba(17, 16, 16, 0.03);
  color: #282828;
  float: right;
  margin-right: 10px;
  border-radius: 5px;
}

#addEmployeeCardBtn p, #removeEmployeeCardBtn p {
  color: #f1f1f1;
  font-size: xx-large;
  padding: 16px 6px;
}

#addEmployeeCardBtn img,#removeEmployeeCardBtn img{
  margin-top: 27px;
  padding:2px 6px;
}


#addEmployeeCardBtn:hover {
  cursor:pointer;
  transform: scale(1.04);
}

#addEmployeeCardBtn:hover, #removeEmployeeCardBtn:hover {
  cursor:pointer;
  transform: scale(1.08);
}

#newImg {
  border-radius: 15px;
}
.driverFrm input[type="button"] {
  border-radius: 4px;
  padding: 3px 8px;
  cursor: pointer;
  background-color: #FFF !important;
  font-weight: bold;
  margin: 3px 2px 3px 2px;
}

#createDriverTbl tr td:first-child, #updateDriverTbl tr td:first-child  {
  width:25% !important;
}

.driverTbl tr td:nth-child(2)  {
  width:65% !important;
}


#createDriverTbl .placeholder {
  height:20px !important;
  padding:0;
}


.driverFrm #driverFoto, .driverFrm #nextDriverFoto {
  max-height:350px !important;
  max-width: 350px !important;
  border-radius: 10px;
}


.driverFrm .imgSector {
  width:40%;
  float:left;
}

.driverFrm #licensePlaceholder, .driverFrm #newLicensePlaceholder, .driverFrm #nextLicensePlaceholder  {
  position:relative;
}

/*
.neumorphic {
  box-shadow: 12px 12px 24px 0 rgba(0, 0, 0, 0.2),
  -12px -12px 24px 0 rgba(255, 255, 255, 0.5);
  width: 200px;
  height: 200px;
  border-radius: 40px;
!*  overflow: hidden;*!
  padding: 1.3rem;
!*  display: flex;
  position:absolute;*!
!*  top:10px; *!
!*  top:10px;
  left:10px;*!
}
*/

.driverFrm .neumorphic:hover {
  cursor: pointer;
  transform: scale(1.04);
}

.driverFrm #driverPictureBtn {
  margin-top:5px;
}

.neumorphic--pressed {
  box-shadow: inset 6px 6px 10px 0 rgba(0, 0, 0, 0.2),
  inset -6px -6px 10px 0 rgba(255, 255, 255, 0.5);
}

.neumorphic:active{
  box-shadow: inset 6px 6px 10px 0 rgba(0, 0, 0, 0.2),
  inset -6px -6px 10px 0 rgba(255, 255, 255, 0.5);
  font-size: 5rem;
  width: 200px;
  height: 200px;
  border-radius: 40px;
  overflow: hidden;
  padding: 1.3rem;
  display: flex;
  position:absolute;
/*  top:100px;*/
  top:10px;
}

.variation1 {
  background: linear-gradient(
          -45deg,
          rgba(0, 0, 0, 0.2),
          rgba(255, 255, 255, 0.3)
  );
}

.variation1 span {
  display: flex;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  overflow: hidden;
  padding: 0.65rem;
  box-shadow: inset 8px 8px 16px 0 rgba(0, 0, 0, 0.2),
  inset -8px -8px 16px 0 rgba(255, 255, 255, 0.4);
}

.variation1 strong {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  overflow: hidden;
  background-color: #f13c20;
  color: white;
}

.driverFrm .separator{
  border: 0;
  height: 1px;
  background-image: linear-gradient(to right, #0000002e, #8C8C8C, #0000002e);
}

.variation1.pressed strong {
  background-color: #bb3c20;
}


section {
  width: 100%;
  height: auto;
}
#updateDriverTbl .ms-options-wrap.ms-has-selections > button {
  background: #FFF !important;
  color:#000;
}

#newCardPlaceholder img, #cardPlaceholder img {
  opacity:65%
}

.borderPic {
  border: 1px solid #cccccc57 !important;
  height: 230px !important;
  width: 220px !important;
  border-radius: 40px !important;
  margin-top:10px;
}

.borderLicense {
  border: 1px solid #cccccc78 !important;
}

.borderCard {
  border: 1px solid #ccc !important;
}
.driverFrm img:not(.ui-datepicker-trigger) {
  display: block;
}

.captionMarginLeft {
  margin-left:28px;
}

.driverFrm .hidden {
  display: none !important;
}

#curLicenseSection{
  min-height: 300px;

}

.roundedCorners {
  height:25px !important;
  border-radius: 5px;
}

#deliveryNotesTbl td:not(.multiple){
  vertical-align: top !important;
  padding-top: 10px !important;
}

div.weekdaysSelectable {
  cursor: pointer;
  color: #888;
  border:1px solid #686868 !important;
}

div.servicesSelectable {
  cursor: pointer;
  color: #888;
  border:1px solid #686868 !important;
}

div.weekdaysSelected {
  border: 1px solid #363FBF !important;
  background-color: #d7d9ed!important;
  color: #000;
}

.spacing{
  width:30px;
  float:left;
}

#licenseBarcode img {
  display: block;
  margin: 20px auto !important;
}

#serviceOrderTypeContainer {
  width:100%;

}

#selectedSOTypeInfo {
  width:auto ;
  font-size: 12px;
  font-style: italic;
  font-weight: bold;
  padding: 5px;
}


.soTypeInfoIcon {
  display: inline-block;
  margin-top: 0.25em !important;
  position: relative;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
  left: 4px !important;
}

#selectedSOTypeName {
  padding-top: 2px !important;
}

.expandDetails, .expandDetailsNodate {
  height: 17px;
}

.expandDetails:hover, .expandDetailsNodate:hover {
  cursor: pointer;
}