/*Menu Component*/

.showmenu{height:calc(100vh - 25px)}
.displayFavMenuBar{display:block;}

#block .newMenu .toggleSideMenu{/*float:right;margin-right:15px;*/position:absolute;top:35px;right:-7px;cursor: pointer;transition-duration: 500ms;transition-property: transform;}


.menuHamburger{ padding: 15px 0px 0px 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box; text-align: center; position: absolute; right: -50px;}
.hamburger .line{width: 30px; height: 3px;background-color: #2c3e50;display: block;margin: 4px 4px;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.hamburger:hover{cursor: pointer;}
#hamburger-9{ position: relative;-webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#hamburger-9.is-active{-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
#hamburger-9:before{content: ""; position: absolute;-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;width: 50px;height: 50px;border: 5px solid transparent; top: calc(50% - 25px); left: calc(50% - 25px); border-radius: 100%;-webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#hamburger-9.is-active:before{border: 5px solid #2c3e50;}
#hamburger-9.is-active .line{width: 35px;}
#hamburger-9.is-active .line:nth-child(2){ opacity: 0;}
#hamburger-9.is-active .line:nth-child(1){-webkit-transform: translateY(7px);-ms-transform: translateY(7px);-o-transform: translateY(7px); transform: translateY(7px);}
#hamburger-9.is-active .line:nth-child(3){ -webkit-transform: translateY(-7px) rotate(90deg); -ms-transform: translateY(-7px) rotate(90deg);-o-transform: translateY(-7px) rotate(90deg);transform: translateY(-7px) rotate(90deg);}

.menuList .menuMH { padding:16px 0px 16px 10px; border-bottom: 0px solid #CCC;display: flex;}
.menuList .menuMH .inputText{padding: 5px 10px;height: 40px;font-size: 100%;outline-offset: -2px;border-style: solid;border-radius: 30px;border-width: 2px;background-color: rgba(8, 0, 255, 0);width: 80%;position: relative;left:15px}
.menuSearch:focus { outline: 0; }
.menuList .menuMH .menuSearchSubmit{background: rgba(0,0,0,0);border: none;cursor: pointer;margin: 0;padding: 0;position: absolute;top: 0;bottom:0;right: 40px;}
  .menuList .menuMH .menuSearchSubmit i {
    font-size: 18px
  }
.menuList .menuMH .menuClearButton{background: rgba(0,0,0,0);border: none;cursor: pointer;margin: 0;padding: 0;position: absolute;top: 0;bottom:0;right: 70px;}
.menuList .menuMH .menuClearButton i {color: lightgray; font-size: 18px;}
.menuList .menuMH .display .btn-blue {margin-right:10px !important;width:130px !important;height:30px !important;border-radius: 5px;}
.menuList .menuMH .display{display: flex;position: relative;left:45px;top:-5px;width:80%}
.menuList .menuMH .searchStatus{display:none; position: absolute;  height: calc(100% - 75px); width: 100%; opacity: 0; top:53px; left:350px;z-index:1; overflow: auto;}
.menuList .menuMH .favStatus{display:none; position: absolute;  height:100%; width: 100%; opacity: 0; top:0px; left:350px;z-index:1; overflow: auto;}

.favMenuBar .favMenuItem{float:left; padding:0px 10px; font-family: Helvetica; font-size:0.8em;height:100%; border-right: 1px solid #fff;  cursor: pointer;}
.favMenuBar .favMore{display:inline;top:3px;right:10px;position: relative;}
.favMenuBar .vertical-center { margin: 0; position: relative; top: 5px;}

.tableOutline{display: table; width: 95%; margin: 0px auto; vertical-align: top; border:1px solid #dddddd;font-size: .8em;}
.tableHeaderRow {display: table-row; background-color: #527bd3; color:#ffffff;}
.tableRow {display: table-row; background-color: #ffffff;}
.tableAltRow {display: table-row; background-color: #f9f9f9;}
.cellHeader {display: table-cell; padding: 8px 0px 8px 8px; text-align: left; border:1px solid #dddddd;}
.cellTitle{display: table-cell; padding: 8px 0px 8px 8px; text-align: left; border:1px solid #dddddd; }
.nuggetTitle{font-size:1.5em; color:#fff;padding:15px 0px 10px 20px; text-align: left;}
.nuggetSeperator {height: 1px; background-color: #fff; width: 80%; margin:0px 0px 0px 20px;}
.nuggetContent {color:#fff; padding:5px 0px 0px 20px; text-align: left;}
.nuggetTitle i {padding-right: 20px;}
.scroller {scrollbar-color: #005491 #fff;scrollbar-width: thin;}
.scroller::-webkit-scrollbar {width: 7px; height:7px;}
.scroller::-webkit-scrollbar-track {background: #fff;}
.scroller::-webkit-scrollbar-thumb {background: #005491;border-right: 1px solid #fff;}
.goBackButton { position:absolute; top:10px; left:10px; width:20px; height:20px; cursor: pointer; color: #fff; }
.icons { font-family: "Font Awesome 5 Free" !important; }

.pageWidget { height: 100%;}
.mainPageWidget { height: 100%;}


.login .logo {width: 650px;margin-left: 46px;position: fixed;left: 0; right: 0; top: 0;  bottom: 0;margin-top: 40px !important;margin: auto;overflow: hidden;}
.content { width: 43%; min-height: 800px;position: fixed; left: 0; right: 0; top: 0;bottom: 0; margin: auto;max-width: 100%;max-height: 100%;overflow: hidden;color: #000 !important;}
.content h1 {color: #111;font-family: Arial, Helvetica, sans-serif;margin-top: 40px;font-size: 24px;}
.content h2 {color: #111; font-family: Arial, Helvetica, sans-serif;font-size: 22px;}
.divform { margin-top: 40px; border: 1px solid #fff;background-color: #fff;  border-radius: 3px; min-height: 530px;margin-left: 10px;margin-right: 10px;}
.divposition {margin-top: 40px;margin-left: 60px;margin-right: 55px;}
.divposition .cfield-title {/* width: 100%; */ margin-top: 10px;font-family: Arial, Helvetica, sans-serif;font-size: 14px;color: #202020; margin-bottom: 2px; text-align: left;  margin-right: 4px;font-weight: 600;}
.divposition .cfield input { float: left;background: no-repeat;  width: 96%;font-family: Arial, Helvetica, sans-serif;font-size: 13px; color: #474747;  padding: 10px;border: 1px solid #424f5c; -webkit-border-radius: 4px;-moz-border-radius: 4px;-ms-border-radius: 4px;-o-border-radius: 4px;border-radius: 4px;display: flex;flex: 1 1 auto;}
.divposition .cfield input:focus {outline: none !important; border: 1px solid #004284;  box-shadow: 0 0 2px #004284;}
.divposition .cfield-div-check {border: 1px solid #eee; border-radius: 4px;float: right; margin-right: 20px;padding: 10px;}
.divposition .cfield-div-check > label {float: left; margin-top: 2px;font-weight: 600;}
.scroll{overflow-y: hidden;}
.divposition .btn {display: inline-block;font-weight: 400;line-height: 1.5;  color: #212529;text-align: center; text-decoration: none;vertical-align: middle;cursor: pointer; -webkit-user-select: none;-moz-user-select: none;user-select: none; background-color: transparent;border: 1px solid transparent;padding: .375rem .75rem;font-size: 14px;border-radius: .25rem;transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;width: 100%;}
.divposition .btn i {margin-left: 0px !important;margin-top: 4px;margin-right: 8px;}
.divposition .btn-disabled {background-color: #4a4949 !important;box-shadow: none !important;border: 1px solid #4a4949 !important;}
.divposition .btn-primary {color: #fff;background-color: #1d4f91;border-color:#1d4f91 ;}
.divposition .btn-primary:hover {box-shadow: 0 0 4px #1421ca;}
.divposition .btn-light {  color: #000;background-color: #ddd;border-color: #ddd;}
.divposition .btn-back {background-color: #424f5c;border-color: #424f5c;  color: #fff;}
.divposition .btn-back:hover {box-shadow: 0 0 4px #1421ca;}
.divposition .btn-back i {color: #fff;}
.divposition .btn-pos{position: relative;}
.divposition .btn-contact {position:absolute;transform: translate(0%,200px);}
.divposition .mt-60 {margin-top: 60px;}
.divposition.mt-20 {  margin-top: 20px;}
.divposition .mt-40 {margin-top: 40px;}
.divposition .ml-10 { margin-left: 10px;;}
.divposition .mt-10{margin-top:10px;}
.divposition .pull-right { float: right !important;}
.divposition.pull-left {float: left !important;}
.divposition .error-label {color: red;font-size: 12px !important;}
.divposition .spinner-icon {margin-top: 10px !important;line-height: 0px;font-size: 14px;color: #fff !important;}

.displayLogo {
    display: none;
}

/***GUIDED TOUR***/





.guidedTour {  
  width: calc(100% - 10px); height: calc(100% - 30px);max-height: 600px;margin: auto;
  background: #165193 url(/assets/images/guidedTour.png) no-repeat center center; background-size: cover;
  position: absolute; top: 0; bottom: 0; right: 0; left: 0;
}


.guidedTour button {display: block;margin: 10px auto;color: white;cursor: pointer;padding: 10px 50px; border:none;font-weight: bold;}
.guidedTour button:active{opacity: .8;}
.guidedTour button:focus{outline:2px solid black!important;}
.guidedTour button.start {  color: #1D4F91; background: white;}
.guidedTour button.exit {  background: transparent;  font-size: 20px;}
.guidedTour button.exit:focus{outline:none!important;}
.guidedTour button.next {background: #1D4F91; margin: unset;}


.guidedTour .fa-times { cursor: pointer; margin: 20px 10px; top: 0;right: 0;position: absolute;z-index: 4;color:white;}
.guidedTour h1{font-size: 30px;}
.guidedTour p{ font-size: 20px; line-height: 28px; margin-bottom: 0;}


.guidedTour .slide {position:absolute;top:0;bottom:0;right:0; left:0; z-index: 1;}
.guidedTour .slide.show  {z-index: 2;}

.guidedTour [class*='section'] {position: absolute;left:0;right:0;top:0;bottom:0;}
.guidedTour .section1 { margin: 10px 35px;}
.guidedTour .section1 .body{ overflow: auto;height: 100%;width:100%;}


.guidedTour .section2 .videotag{background:black;width: calc(100% - 12%);aspect-ratio: 1920 / 1080;margin: auto;display: block; }
.guidedTour .section2 video{width:100%;opacity:0;aspect-ratio: 1920 / 1080;} 

.guidedTour .show .section2 video{
  animation-name: videoA;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes videoA {from {opacity: 0;} to  {opacity: 1;}}




/*** COVER PAGE  ***/
.guidedTour.cover {color:white;} 
.guidedTour.cover .section1 {display:flex; align-items: center;}
.guidedTour.cover .section1 .body{ text-align: center;height:auto;}
.guidedTour.cover .section1 .footer   {display:none;}
.guidedTour.cover .section2 {display:none;}



/*** TOUR  ***/
.guidedTour.tour  {color:black;} 
.guidedTour.tour .white-panel { background:white;position: absolute;left: 0; top: 0; bottom: 0; right: 65%;}

.guidedTour.tour .section1 { right:65%;}
.guidedTour.tour .section2 { left:35%; display:flex;align-items: center;}

.guidedTour.tour        .body {position:relative;overflow:hidden;}
.guidedTour.tour        .body .text{left:-100%;opacity:0;height: calc(100% - 74px); overflow: auto;position:absolute;width:100%;transition: left 1s, opacity 1s;}
.guidedTour.tour .show  .body .text{left: 0;opacity:1;}
.guidedTour.tour .left  .body .text{left:-100%;}
.guidedTour.tour .right .body .text{left: 100%;}


.guidedTour .footer { position: absolute; bottom: 0px;}
.guidedTour .footer .dots {  margin-top: 10px; white-space: nowrap;}
.guidedTour .footer .dots .dot { cursor: pointer; height: 15px;width: 15px;margin: 0 5px; background-color: #bbb;border-radius: 50%; display: inline-block;transition: background-color 0.6s ease;}
.guidedTour .footer .dots .dot.active {background-color: #1D4F91;}
.guidedTour .footer .dots .dot:hover  {background-color: #717171;}

.guidedTour .arrows {z-index:4; color: #FFFFFF; cursor: pointer; position: absolute; top: 45% ;padding: 2px;font-size: 45px;}
.guidedTour .arrows.prev { left:0; text-shadow: 3px 0px 1px black;}
.guidedTour .arrows.next { right:0;text-shadow:-3px 0px 1px black;}

.guidedTour.tour .arrows.prev {color: #1D4F91;} 
.guidedTour.cover.front .arrows.prev, 
.guidedTour.cover.back  .arrows.next { display:none;}



/*Part Order*/

.partOrder .partflex { display: flex;flex-direction: row;} 
.partOrder .partflex .flex1 {flex: 70%;padding: 15px;}
.partOrder .partflex .flex2 { flex: 20%;padding: 10px;}
.partOrder .partflex .partOrder-messages td, .partOrder .partflex .partOrder-messages th { padding: 5px;border-bottom: none;}
.partOrder .nav-tabs ul{list-style-type: none; border-bottom: 1px solid grey;display: flex;}
.partOrder .nav-tabs li{color:#888888;display:block;text-align: center;padding:10px;margin-right:10px;font-size: 16px; cursor: pointer;font-weight: 700; }
.partOrder .topSection  .topSectionPartContainer{ padding:10px }
.partOrder .topSection .topSectionPartContainer .topSectionPartOrder {display: grid;grid-template-columns: repeat(10, minmax(0, 1fr));grid-gap:10px;margin: 10px auto; }
.partOrder .topSection  .topSectionPartContainer .topSectionPartOrder .grid1{grid-column: span 1;align-self: center; }
.partOrder .topSection  .topSectionPartContainer .topSectionPartOrder .grid2{ grid-column: span 2;}
.partOrder .topSection  .topSectionPartContainer .topSectionPartOrder .grid2 .inputText{width:95%; height:35px}
.partOrder .topSection  .topSectionPartContainer .topSectionPartOrder .grid1 .inputText{width:95%; height:35px}
.partOrder .topSection  .topSectionPartContainer .topSectionPartOrder .grid2 .btn-tertiary{width:95%; height:35px}
.partOrder .topSection  .topSectionPartContainer .topSectionPartInfo{display: flex;flex-direction: row; }
.partOrder .topSection  .topSectionPartContainer .duplicateMessage{ margin:10px auto;color:red;}
.partOrder .partflex .flex1 .partsContainer {  border: 1px solid #D3D3D3; margin: 20px auto}
.partOrder .partflex .flex1 .partsTitle { padding: 2px 2px 2px 10px; display: flex; justify-content: space-between; align-items: center; }
.partOrder .partsContainer .partstable { width: 100%; border: 1px solid lightgrey; border-spacing: 0;font-size: 13px; }
.partOrder .partsContainer .partstable i {cursor: pointer;}
.partOrder .partsContainer .partstable th { border: none; padding: 5px; }
.partOrder .partsContainer .partstable td { border: none; padding: 5px;  border-top: 1px solid lightgray; }
.partOrder .partsContainer .partstable td #partqty{  width:50%; }
.partOrder .partsContainer .partstable .greenBlock{background-color:#008000 ;width:15px;  height:30px; display: block; }
.partOrder .importDms .btn-tertiary{ width:15%;height:35px;}
.partOrder .importDms{  margin: 20px auto;display: flex;justify-content: end;}
.partOrder label { font-weight: bold; }
.partOrder .partflex .flex2 .partOrder-table {width: 100%; margin-top: 15px; margin-bottom: 15px;border-spacing: 0;}
.partOrder .partflex .flex2 .partOrder-table .col2{text-align: right;}
.partOrder .partflex .flex2 .partOrder-table td {padding: 5px;border-bottom: 1px solid grey;}
.partOrder .bulk {position: absolute; top: 0px;right: 0px;border: 2px solid #ccc;margin-right: -6px;display: none;z-index: 2;width: 40%;height: 100%;overflow-y:scroll}
.partOrder .bulkshow {display: block;-webkit-animation: fadein 300ms; animation: fadein 300ms;}
.partOrder .bulk-list {position: absolute; top: 1px;right: 0px;margin-right: -6px; border: 1px solid #ccc;display: none;z-index: 2;width: 60%; height: 100%;border-radius: 3px; }
.partOrder .bulk .title { display: flex;padding: 10px;justify-content: space-between;font-weight: bold;border-bottom: 1px solid lightgray;}
.partOrder .bulk .title i {cursor: pointer;}
.partOrder .bulk .body {margin-top: 20px; padding: 10px;}
.partOrder .bulk .body .order { align-items: center;margin-top: 20px;}
.partOrder .bulk .body .order .label {font-weight: bold;margin-right: 10px;}
.partOrder .bulk .body .order .inputText {height: 30px;width:95%}
.partOrder .bulk .body .order .btn-blue{ height: 30px;width: 40%;}
.partOrder .desktopDisNone{ display: none; }
.partOrder .partflex .flex1 .flex .left .inputText{ width:95%; height:35px}
.partOrder .partflex .flex1 .flex .left .grid2 .btn-blue{width:100%;height:35px}
.partOrder .partflex .flex1 .flex .right .btn-blue{width:50%;height:35px;}
.partOrder .partflex .flex1 .flex .right .btn-black{width:50%;height:35px;}
.partOrder .partflex .flex1 .flex .inputText{width:95%; height:35px}
.partOrder .partflex .clear-btns .btn-blue{margin:10px;width:20%;height:35px;}
.partOrder .partflex .clear-btns .btn-black{margin:10px;width:20%;height:35px;}
.partOrder .partflex .table-striped .inputText{width:45%;margin:2px;height:25px;}
.partOrder .partflex .flex2 .btn-blue{width:100%;height:35px}
.partOrder .bulk .btn-blue{width:45%;height:35px;margin:10px}
.partOrder .bulk .btn-black{width:45%;height:35px;margin:10px}
.partOrder .DMSParts{display: block;}
.partOrder .bulkTextarea{height:50vh;}


/* Misc */
.partReturn .grid .grid3 .btn-blue{width:70%;height:35px;}
.partReturn .grid .grid2 .inputText{width:90%;height:35px;}
.partReturn .table-striped .inputText {width: 45%; text-align: center; margin-left: 2px; margin-right: 2px;}
.partReturn{ margin:50px auto;width:90%;}
.partReturn .submit .btn-blue{width:20%;height:35px;}
.partReturn .grid{  display:grid;grid-template-columns: repeat(8, minmax(0, 1fr));  grid-gap:10px;margin:20px auto;}
.partReturn .grid .grid1{grid-column: span 1;text-align: center;  align-self: center;}
.partReturn .grid .grid2{ grid-column: span 2;}
.partReturn .grid .grid3{grid-column: span 2;}
.partReturn .table-striped { width: 100%;border-spacing: 0;border: 1px solid #ddd;border-bottom: none;}
.partReturn .table-striped td, .partReturn .table-striped th{padding: 10px;}
.partReturn .table-striped th{border-bottom: 1px solid lightgray;}
.partReturn .table-striped i{cursor: pointer;}
.partReturn .spinner-icon-partReturn {margin-top: 10px !important; line-height: 0px;font-size: 14px;color: #fff !important;}
.partReturn .processing-partReturn {padding-top: 2px; padding-bottom: 3px; display: none;}
.partReturn .flex-partReturn { flex-direction: row;display:flex;margin:15px auto;}

.showPartbatch .table-striped {width: 100%;border: 1px solid #ddd;border-spacing: 0;}
.showPartbatch table td,.showPartbatch table th { border-width: 0;font-size: 13px; padding: 10px;}
.showPartbatch .table-striped i {cursor: pointer;}


.showraDoc table td {text-align: left;}
.showraDoc table tr.border_bottom td {border-bottom: 4px solid black;}
.showraDoc table tr.borderline td {border-bottom: 2px solid black;}
.showraDoc .pLeft {padding-left: 20px;}
.showraDoc .pBottom {padding-bottom: 10px;}
.showraDoc .center { margin-left: auto;margin-right: auto;}

.batchListEntry .table-striped{width:90%; border:2px solid lightgrey;border-spacing: 0; }
.batchListEntry .table-striped th, .batchListEntry .table-striped td{padding: 5px;}
.batchListEntry .totalRow{padding: 5px;border-top: 2px solid lightgray; }
.batchListEntry .failure-message{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;  border-radius: 5px; padding : 10px;}

/* Parts Unpacking List*/
.snebolsearch .div1 .grid-container .grid3 .btn-blue{width:90%;height:35px}
.snebolsearch .div1 .grid-container .grid3 .btn-black{width:90%;height:35px}
.snebolsearch .div1 .grid-container .grid2 .inputText{width:90%;height:35px}
.snebolsearch .div1{margin-top:50px; margin-left:10px;}
.snebolsearch .div2{ margin-top:10px;}
.snebolsearch .div1 .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));  width:90%;grid-gap:10px;}
.snebolsearch .div1 .grid-container .grid1{ grid-column: span 1;margin-top:10px;text-align: end;}
.snebolsearch .div1 .grid-container .grid2{grid-column: span 2;}
.snebolsearch .div1 .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;}


.soashipperref .div1 .grid-container .grid3 .btn-blue {width:90%;height:35px}
.soashipperref .div1 .grid-container .grid3 .btn-black {width:90%;height:35px}
.soashipperref .div1 .grid-container .grid2 .inputText { width:90%;height:35px}
.soashipperref .div1{margin-top:50px;  margin-left:10px;}
.soashipperref .div2{margin-top:10px;}
.soashipperref .div1 .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.soashipperref .div1 .grid-container .grid1{  grid-column: span 1; margin-top:10px;text-align: end;}
.soashipperref .div1 .grid-container .grid2{ grid-column: span 2;}
.soashipperref .div1 .grid-container .grid3{ grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));    grid-gap:10px;}

.packingInvoice table {font-size: 9pt; font-family: arial, verdana;  font-weight: normal;border-spacing: 0; border-collapse: collapse;}
.packingInvoice #barcode {  font-weight: normal;font-style: normal;line-height: normal;font-family: sans-serif; font-size: 2pt;}
.packingInvoice .auto-style1 {height: 19px;}
.packingInvoice .vat { vertical-align: top;}
.packingInvoice .bold {  font-weight: bold;}
.packingInvoice .em1 {font-size: 1.3em;}
.packingInvoice .em15 {font-size: 1.5em;}
.packingInvoice .pt2 {  padding-top: 1em;}
.packingInvoice input.lCb {width: 18px; height: 18px;float: left; margin-top: 32px}
.packingInvoice {margin-left: 60px; margin-top: 30px;}
.packingInvoice .td-border {border-bottom: 1px solid lightgray; padding-bottom: 20px;}
.packingInvoice .span-desc { float: left; margin-top:-24px; }


/*Parts AIM*/
.aimPoNumber .table-striped{width:90%;margin:10px auto;border-spacing: 0;border:2px solid grey;}
.aimPoNumber .table-striped th, .aimPoNumber .table-striped td{padding:10px;}

.part-history .grid-container .grid3 .btn-blue{width:90%;height:35px}
.part-history .grid-container .grid3 .btn-black{width:90%;height:35px}
.part-history .grid-container .grid2 .inputText { width:90%;height:35px}
.part-history{margin-top:50px;margin-left:50px;}
.part-history .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.part-history .grid-container .grid1{grid-column: span 1;align-self: center;text-align: end;}
.part-history .grid-container .grid2{grid-column: span 2;}
.part-history .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;   }

.pending-suggestion .div1 .grid-container .grid3 .btn-blue{width:90%;height:35px}
.pending-suggestion .div1 .grid-container .grid3 .btn-black{width:90%;height:35px}
.pending-suggestion .div1 .grid-container .grid2 .inputDate{width:90%;height:35px}
.pending-suggestion .div1 .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-gap:10px;width:80%;margin:10px auto;}
.pending-suggestion .div1 .grid-container .grid1{grid-column: span 1;}
.pending-suggestion .div1 .grid-container .grid2{grid-column: span 2;}
.pending-suggestion .div1 .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;}
.pending-suggestion .div1 .grid-container .textAlign{text-align: center;align-self: center;}

.aim-feedback .textarea{width:100%;}
.aim-feedback .aim-feedbackBtns .btn-blue{margin:20px;margin-left:0px;width:20%;height:35px;}
.aim-feedback .aim-feedbackBtns .btn-black{margin:20px;margin-left:0px;width:20%;height:35px;}
.aim-feedback{margin:50px auto;width:90%;  }
.aim-feedback .aim-feedbackBtns{display: flex;}
.aimReturnEntry .table .inputText{width:90%;height:35px;}
.aimReturnEntry  .btn-blue{width:20%;height:35px;margin:5px; }
.aimReturnEntry  .btn-black{width:20%;height:35px;margin:5px; }
.aimReturnEntry .table {width: 95%;margin: 30px auto}
.aimReturnEntry .table th, .aimReturnEntry .table td{border-width: 0;font-size: 13px; padding: 10px;border: 1px solid #f1f1f1; text-align: center;}
.aimReturnEntry .table .span-code {cursor: pointer;background: #525252;  color: #fff;padding: 4px; border-radius: 4px;cursor: pointer; }
 

/*Parts Invoices*/
.dailyInvoice .fielset {width: 50%; margin-left: auto; margin-right: auto;margin-top: 50px;  border: 1px solid #ccc; border-radius: 3px;}
.dailyInvoice #inner {display: table; margin: 0 auto;  color: #1179F7;font-weight: 600;}
.dailyInvoice .btn-blue{ width:125px;height:30px;} 


.ackbyref .grid-container .grid3 .btn-blue{width:90%;height:35px;}
.ackbyref .grid-container .grid3 .btn-black{width:90%;height:35px;}
.ackbyref .grid-container .grid2 .inputText {width:90%;height:35px;}
.ackbyref{margin-top:50px;margin-left:10px;}
.ackbyref .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.ackbyref .grid-container .grid1{grid-column: span 1;align-self:center;text-align: end;}
.ackbyref .grid-container .grid2{grid-column: span 2;}
.ackbyref .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;   }

.invoiceFinder .grid-container .grid3 .btn-blue {width: 90%;height: 35px;}
.invoiceFinder .grid-container .grid3 .btn-black {width: 90%;height: 35px;}
.invoiceFinder .grid-container .grid2 .inputText {width: 90%;height: 35px;}
.invoiceFinder {margin-top: 50px;margin-left: 10px;}
.invoiceFinder .grid-container { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));width: 90%;grid-gap: 10px;}
.invoiceFinder .grid-container .grid1 {grid-column: span 1;align-self: center;text-align: end;}
.invoiceFinder .grid-container .grid2 {grid-column: span 2;}
.invoiceFinder .grid-container .grid3 {grid-column: span 2;display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap: 10px;}



.partByInvoice .grid-container .grid3 .btn-blue{width:90%;height:35px;}
.partByInvoice .grid-container .grid3 .btn-black{width:90%;height:35px;}
.partByInvoice .grid-container .grid2 .inputText{width:90%;height:35px;}
.partByInvoice{margin-top:50px;margin-left:10px;}
.partByInvoice .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.partByInvoice .grid-container .grid1{grid-column: span 1;align-self: center;text-align: end;}
.partByInvoice .grid-container .grid2{grid-column: span 2;}
.partByInvoice .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;}

.genericInvoice{margin:10px;}
.genericInvoice .genInvoice-grid{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr));margin:10px auto;width:95%;}
.genericInvoice .flex-container{display: flex;justify-content: space-between;width:95%;margin:10px auto;}
.genericInvoice .table3Div{overflow-x: auto;}
.genericInvoice .genInvoice-table1{margin-bottom: 10px;}
.genericInvoice .genInvoice-table2{margin-bottom: 10px;}
.genericInvoice .genInvoice-table3 {margin: 10px auto;width: 95%;border: none;border-spacing: 0;padding-top: 20px;}
.genericInvoice .genInvoice-table3 td {padding: 5px;}
.genericInvoice #inner {display: table;margin: 0 auto;color: #1179F7;text-align: center;}
.genericInvoice #outer-c {width:100%;margin-top: 10px;margin-bottom: 30px;}

.partInvoice{overflow-x: auto;margin:10px;}
.partInvoice .invoice-grid{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr));margin:10px auto;width:95%;}
.partInvoice .flex-container{display: flex;justify-content: space-between;width:95%;margin:10px auto;}
.partInvoice .table3Div{overflow-x: auto;}
.partInvoice .invoice-table1 {margin-bottom: 10px;}
.partInvoice .invoice-table2 {margin-bottom: 10px;}
.partInvoice .invoice-table3 {margin: 10px auto;width: 95%;border: none;border-spacing: 0;padding-top: 20px;}
.partInvoice .invoice-table3 td {padding: 5px;}
.partInvoice #inner {display: table; margin: 0 auto;color: #1179F7;font-weight: 600;text-align: center;}
.partInvoice #outer-c {width:100%;margin-top: 10px; margin-bottom: 30px;}

.navisionStatus .nav-grid{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr));margin:10px auto; width:95%;} 
.navisionStatus .navInvoice-table1 {float: left;margin-bottom: 10px;}
.navisionStatus .navInvoice-table2 {float: right;margin-bottom: 10px;}
.navisionStatus .navInvoice-table3 {margin: 10px auto; width: 95%;border: none;border-spacing: 0;padding-top: 20px;}
.navisionStatus .navInvoice-table3 td { padding: 5px;}
.navisionStatus #inner {display: table; margin: 0 auto;color: #1179F7; font-weight: 600;}
.navisionStatus #outer-c {width:100%; margin-top: 10px;  margin-bottom: 30px;}


/*References*/
.accrual .grid-container .grid2 .select{width:90%;height:35px;}
.accrual .grid-container .grid3 .btn-blue{width:80%;height:35px;}
.accrual{margin:10px;}
.accrual .grid-container{display:grid;grid-template-columns: 15% 25% 20%;grid-gap:15px;justify-content: center;}
.accrual .grid-container .grid1{text-align: center;align-self: center;font-weight:bold;}
.accrual .mainTable{border:none; width:45%; margin-left:auto;margin-right:auto;}
.accrual .mainTable .acctable{border:none;width:100%;}
.accrual .mainTable .acctable td{padding:5px;}
.accrual .nodata{margin: 10px;text-align: center;}
.accrual .mainTable .accuralLink {cursor: pointer;color: red;}
.accrual .mainTable .disableLink{cursor:auto;color: currentColor;}

.accuralBatch .accDiv { margin:10px;}
.accuralBatch .mainTable {border:none; width:35%;margin-left:auto;margin-right:auto;}
.accuralBatch .pointer-cursor {cursor: pointer;color: #1179F7; text-decoration: underline;}
   


.partBulletin .bulletin-table1 .btn-blue{width:50%;height:35px }
.partBulletin .bulletin-table1 .bulletinViewallBtn{width:76%;}
.partBulletin .bulletin-table1 .inputText{width:95%;height:35px;}
.partBulletin{margin-top:50px;/*margin-left:50px;*/}
.partBulletin .bulletin-table1{table-layout: fixed;width:95%; margin:auto;}
.partBulletin .bulletin-table1 th, .partBulletin .bulletin-table1 td{padding:10px;}
.partBulletin .bulletin-table2{table-layout: fixed; width:95%;margin:auto;}
.partBulletin .bulletin-table2 th, .partBulletin .bulletin-table2 td{padding:10px;}
.partBulletin .bulletin-table1 .display-mobile{display: none;}
 .sliderContent #theBulletin form input {display:none;}
.sliderContent  #theBulletin .commonAppsHeader{FONT-WEIGHT: bold;FONT-SIZE: 16pt;LINE-HEIGHT: 17pt;padding-left:0px !important;}
 .sliderContent #theBulletin .commonAppsSubHeader{ padding-left:0px !important;FONT-WEIGHT: bold;FONT-SIZE: 10pt;}
 .sliderContent #theBulletin EM{FONT-WEIGHT: bold;FONT-STYLE: normal;}
 .sliderContent #theBulletin .commonAppsHLine{BACKGROUND-COLOR: #1179F7;HEIGHT: 5px;MARGIN-BOTTOM: -30px;MARGIN-TOP: 0px;}
 .sliderContent #theBulletin .commonAppsHLineThin{COLOR: #293D84;HEIGHT:1px; width:90%;}
 .sliderContent #theBulletin TABLE{BACKGROUND-POSITION: left top;FONT-SIZE: 8pt; MARGIN-LEFT: 0px;MARGIN-TOP: 0px;VERTICAL-ALIGN: top;LINE-HEIGHT: 11pt;FONT-FAMILY: Verdana, Arial, sans-serif ; BORDER: none;BORDER-COLLAPSE: collapse;EMPTY-CELLS:  show;width:95%;}
 .sliderContent #theBulletin form TABLE{BACKGROUND-POSITION: left top;FONT-SIZE: 8pt; MARGIN-LEFT: 0px;MARGIN-TOP: 0px;VERTICAL-ALIGN: top;LINE-HEIGHT: 11pt;FONT-FAMILY: Verdana, Arial, sans-serif ; BORDER: none;BORDER-COLLAPSE: collapse;EMPTY-CELLS:  show;width:90%;}
.sliderContent #theBulletin TD{VERTICAL-ALIGN: middle;}
 .sliderContent #theBulletin TD, #theBulletin TH{padding:5px;}




/* can be used with all report headers and footers*/
.report-header .btn-align-right {display: flex;justify-content: end;}
.report-header .btn-align-right .btn-blue {width: 15%;height: 35px;margin:10px;}

.report-footer .btn-align-center {text-align: center;}
.report-footer .btn-align-center .btn-blue {width: 25%;height: 35px;margin:10px; position: relative; }

/*Other*/

.backOrderConfirm .table-striped {border: 1px solid #ddd; margin-top:20px;margin-left: auto;  margin-right: auto;  width: 70%;border-spacing: 0;}
.backOrderConfirm .table-striped th,.backOrderConfirm .table-striped td {font-size: 14px;padding: 8px;border-bottom: 1px solid lightgray;}
.backOrderConfirm .statement {text-align:center;font-size:12pt;   color:#1179F7;  font-weight:bold;}
.backOrderStatus .table-striped .btn-blue{width:30%;height:35px;margin:10px;}
.backOrderStatusHeader .btn-align-locator{display: flex;justify-content: end;}
.backOrderStatusHeader .btn-align-locator .btn-blue {width: 15%;height: 35px;margin:10px;}
.backorderStatusFooter .btn-blue {width: 25%;height: 35px;margin:10px; position: relative; }


.bqResponse .table{width:26%;border-spacing:0;margin:15px auto}
.bqResponse .div1{width:80%;margin:15px auto}
.bqResponse .flex-container .table1{width:50%;table-layout: fixed;}
.bqResponse .flex-container{display: flex;flex-direction: row;width:80%;margin:15px auto}
.bqResponse .boldFont{FONT-WEIGHT: bold;FONT-SIZE: 12pt;FONT-FAMILY: Arial;text-align:right;}
.bqResponse .normalFont{FONT-SIZE: 12pt;FONT-FAMILY: Arial;text-align:right;}
.bqResponse .ylwBg	{font-family:arial;font-size:12pt;background-color:rgba(29,79,145, .25);border:2px #c0c0c0 solid;padding:10px;line-height:1.25} 
.bqResponse .closed{  color :#ff0000}
.bqResponse .open{ color :#2f7f2f}
.bqResponse .pending{color :#2f7f2f}

.billingInquiry .billingselect{width:40%;height:35px;}
.billingInquiry .table-billing .fullRow .inputText{width:99%;height:35px;}
.billingInquiry .table-billing .inputText{width:98%;height:35px;}
.billingInquiry .table-billing .select{width:99%;height:35px;}
.billingInquiry .table-billing .textarea{width:99%;}
.billingInquiry .btn-blue{width:15%;height:35px;margin:10px;}
.billingInquiry .btn-black{width:15%;height:35px;margin:10px;}
.billingInquiry{ margin:20px;}
.billingInquiry p{ line-height: 1.2;margin: 9px 0px;font-size:16px;}
.billingInquiry .table-billing{ width:100%; padding:10px; border:2px solid gray;}
.billingInquiry table-billing th, .billingInquiry table-billing td{ width:50%;}
 


.nationalPart .table-striped {width: 100%;border-spacing: 0;border: 1px solid lightgrey; margin-top: 10px; margin-bottom: 10px; }
.nationalPart .table-striped th,.nationalPart .table-striped td { padding: 5px; }
.nationalPart .table-striped td a {cursor: pointer;color: #1179F7; text-decoration: underline;}
.nationalPart .table-striped .span-code {cursor: pointer;background: #525252;color: #fff;padding: 4px;border-radius: 4px;}

.partInquiry .table-striped{width:100%;border-spacing: 0;border:1px solid lightgrey;  margin-top: 10px;margin-bottom: 10px;}
.partInquiry .table-striped th,.partInquiry .table-striped td{ padding:5px;}
.partInquiry .table-striped td a {cursor: pointer;color:#1179F7;text-decoration: underline;}
.partInquiry .table-striped .span-code {cursor: pointer;background: #525252;color: #fff;padding: 4px;border-radius: 4px;cursor: pointer;}

.massPartInquiry .massPartDiv .btn-blue{width:15%;height:35px;margin:10px;}
.massPartInquiry .massPartDiv .btn-black{width:15%;height:35px;margin:10px;}
.massPartInquiry .massPartDiv{margin:30px;}

.dealerDetail .table {width:50%;margin:20px auto;border-spacing: 0;}
.dealerDetail .table.table td,.dealerDetail .table.table th{border-width: 0;font-size: 13px;  padding: 7px;border: 1px solid lightgray;}
.dealerDetail .table a {cursor: pointer; color:#1179F7;text-decoration-line: underline;}


.onHandInquiry .btn-blue {	width:15%;height:35px;margin:10px;}
.onHandInquiry .btn-black{	width:15%;height:35px;margin:10px;}
.onHandInquiry .inputText{width:90%;height:35px}
.onHandInquiry .onhand-table {width: 95%;margin:0px auto;}
.onHandInquiry .onhand-table td, .onHandInquiry .onhand-table th {border-width: 0;font-size: 13px;padding: 10px; border: 1px solid #f1f1f1;text-align: center;}

.partDetails .grid .grid2 .inputText{width: 90%;height:35px;}
.partDetails .grid .grid3 .btn-blue{width: 100%;height:35px; }
.partDetails .inquiryBtn .btn-blue{width:100%;height:35px}
.partDetails { width: 80%;margin:30px auto;}
.partDetails .grid{display: grid;grid-template-columns:repeat(4, minmax(0, 1fr));margin:20px 10px;}
.partDetails .grid .grid1{ grid-column: span 1;text-align: left;align-self: center;}
.partDetails .grid .grid2{grid-column: span 2;}
.partDetails .grid .grid3{grid-column: span 1;}
.partDetails .table {  width:100%;border-spacing: 0;border:none;}
.partDetails .table td,.partDetails .table th{border-bottom: 1px solid lightgray;padding: 7px;text-align: left;width: 50%;}
.partDetails .table td a{cursor: pointer;}
.partDetails .processing { display: none;  color: #666;float: right;}
.partDetails .inquiryBtn{width:50%;margin:5px auto;}

/*Print/Reports*/
.soaAch .table td, .soaAch .table th{border:1px solid lightgray;   padding:5px; width:50%}
.soaAch .table{width:50%}

.paymentHistory .grid-container .grid3 .btn-blue{width:90%;height:35px;}
.paymentHistory .grid-container .grid3 .btn-black{width:90%;height:35px;}
.paymentHistory .grid-container .grid2 .inputText {width:95%;height:35px;}
.paymentHistory{margin-top:50px;margin-left:10px;}
.paymentHistory .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.paymentHistory .grid-container .grid1{grid-column: span 1;align-self: center;text-align: end;}
.paymentHistory .grid-container .grid2{grid-column: span 2;}
.paymentHistory .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;}

.returnNotice .table{ margin:10px auto;width:30%;}
.returnNotice .failure{ color: #721c24;background-color: #f8d7da;border-color: #f5c6cb; border-radius: 5px;padding : 10px;}



/* Sales*/
.buildACar .carlines { padding:10px 0px 10px 0px;font-size: .9em; border-bottom: 2px solid #1179F7; font-weight: bold;}
.buildACar .selected {font-weight: bold;}
.buildACar .carlines .lineTitle{padding:10px;float: left;text-align: center;font-size: 1.2em;}
.buildACar .carlines .carline-grid{display:grid;grid-template-columns: repeat(8, minmax(0, 1fr));}
.buildACar .carlines .carline-grid .allocationNumber{padding:10px;color:#ccc;text-align:center}
.buildACar .carlines .carline-grid .allocationActive {color:#1179F7; font-weight: bold;}
.buildACar .modelTitle{padding:10px;float: left;text-align: center;font-size: 1.0em;font-weight: bold;}
.buildACar .buildcar-models{ display: flex;}
.buildACar .buildcar-models .modelTrim {font-size: 0.9em; padding:10px;color: #ccc;cursor:pointer;font-weight:bold}
.buildACar .buildcar-models .selectedTrim { color: #1179F7;}
.buildACar .buildcar-flex{display: flex;flex-direction: row;}
.buildACar .buildcar-flex .buildcar-flex1, .buildACar .buildcar-flex .buildcar-flex2,
.buildACar .buildcar-flex .buildcar-flex3,.buildACar .buildcar-flex .buildcar-flex4{border-right:2px solid #1179F7;}
.buildACar .buildcar-flex .accModel { text-align: center; font-size: 1.2em; padding: 10px 0px; }
.buildACar .buildcar-flex .optAcc-grid{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr)); }
.buildACar .buildcar-flex .custInfo-flex{display:flex; width: 100%;}  
.buildACar .buildcar-slider{display:none}
.buildACar .buildcar-flex .buildcar-flex4 .inline-flex{display: inline-flex;width:100%}
.buildACar .buildcar-slider .btn-blue{display: none;}
.buildACar .buildcar-slider .btn-black{display: none;}
.buildACar .buildcar-flex .buildcar-flex4 .btn-blue{width:95%;height:30px;margin: 5px;}
.buildACar .buildcar-flex .buildcar-flex4 .inline-flex .btn-black{display: none;}
.buildACar .buildcar-flex .custInfo-flex .btn-black{width:80%;height:15px;margin:0px;text-align: center;}
.buildACar .inputBoxComponent .defaultLabel { padding:8px 0px 0px 10px; font-size: .8rem; }
.buildACar .inputBoxComponent .defaultInput { padding:1px 10px 3px 10px; box-sizing: border-box; }
.buildACar .inputBoxComponent .inputText{ padding:2px;width:100%;height:25px}
.buildACar-submit{width:60%;margin:20px auto;border-spacing: 0;}
.buildACar-submit td{padding:5px;border:1px solid lightgray}
.buildACar .btn-draft {text-align: center; margin-top: 10px; margin-bottom: 10px;}
.buildACar .btn-draft .btn-blue {width: 100%;height: 30px;font-weight: 700;font-size: 12px;font-family: Helvetica;text-transform: uppercase;}
.buildACar .view-draft {float: right; margin-top: -26px; margin-right: 20px; cursor: pointer;}

.accessoryItem .accessorySelect {display: table-cell; text-align: left; width:15px;}

.buyademoheader p{font-size: 14px;}

.vehicleInvoice .showInvoiceBtn{display:flex; margin-top:30px;justify-content: flex-end;width: 90%;}
.vehicleInvoice .showInvoiceInfo{margin:30px;margin-top: 5px; page-break-after: always;}
.vehicleInvoice .showInvoiceInfo .table1{ width:90%;border-spacing: 0;margin:10px 0px;}
.vehicleInvoice .showInvoiceInfo  .table1 th, .vehicleInvoice .showInvoiceInfo  .table1 td{padding:5px;}
.vehicleInvoice .showInvoiceInfo .table2{ width:90%;border-spacing: 0;margin:10px 0px;}
.vehicleInvoice .showInvoiceInfo  .table2 th, .vehicleInvoice .showInvoiceInfo  .table2 td{padding:5px;border-bottom: 2px solid lightgrey;}
.vehicleInvoice .showInvoiceInfo .table-striped{width:90%;border-spacing: 0;table-layout: fixed;border:2px solid grey;margin:10px 0px;}
.vehicleInvoice .showInvoiceInfo .table-striped th, .vehicleInvoice .showInvoiceInfo .table-striped td{padding:5px;}
.vehicleInvoice .showInvoiceBtn .btn-blue{width:30%;height:35px;margin:5px; }
.vehicleInvoice .redText{color:red;}

.vehicleLocatorFooter .btn-blue {width: 20%;height: 35px;margin:10px;padding:5px;}
.vehicleLocator2 { display: flex;align-items: center;justify-content: center;padding: 10px;}
.vehicleLocator2 button {height: 36px;width: 250px;}
.vehicleLocator .locator2-grid .btn-blue {width: 90%;height: 35px;}
.vehicleLocator .locator2-grid{ display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));grid-column-gap:5px;grid-row-gap:10px;width:95%;margin:15px auto;}
.vehicleLocator .select{width: 80%;height:35px;}
.vehicleLocatorHeader .btn-align-locator{display: flex;justify-content: end;}
.vehicleLocatorHeader .btn-align-locator .btn-blue {width: 15%;height: 35px;margin:10px;}

.vehicleInquiry .grid-container .grid3 .btn-blue{width:90%;height:35px;}
.vehicleInquiry .grid-container .grid3 .btn-black{width:90%;height:35px;}
.vehicleInquiry .grid-container .grid2 .inputText{width:90%;height:35px;}
.vehicleInquiry{ margin-top:50px;margin-left:10px; margin-bottom: 50px;}
.vehicleInquiry .grid-container{display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));width:90%;grid-gap:10px;}
.vehicleInquiry .grid-container .grid1{grid-column: span 1;text-align: end;margin-top:10px;}
.vehicleInquiry .grid-container .grid2{grid-column: span 2;}
.vehicleInquiry .grid-container .grid3{grid-column: span 2;display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-gap:10px;}
.vehicleInquiry .error-me {padding-top: 10px;color: red;font-size: 15px;width: 90%;}

#VehicleSale{margin:20px;}
#VehicleSale .label1{font-weight: bold;color:#1179F7;}
#VehicleSale .saleinfo{margin:10px auto;}
#VehicleSale  .grid-container1{ display:grid;grid-template-columns: repeat(4, minmax(0, 1fr));margin:10px auto;grid-column-gap:40px;grid-row-gap: 10px;} 
#VehicleSale   .grid-item1 {width:100%;}
#VehicleSale .grid-item2 {width:100%;grid-column: span 2;}
#VehicleSale .grid-container{display:grid;grid-template-columns: repeat(4, minmax(0, 1fr)); margin: auto;width:100%;  grid-column-gap:40px;grid-column: span 4;grid-row-gap:10px;}
#VehicleSale  .marginleft{display:flex;   width:90%; margin:10px auto}
#VehicleSale #mysaletype{height:30px; width:150px; border:2px solid lightgrey; padding:5px;  box-sizing: border-box; }
#VehicleSale .vehinfo1{ width:50%;table-layout: fixed; display: inline-table;border-spacing: 0; margin-right: 25px;}
#VehicleSale  .vehinfo2{width:50%; table-layout: fixed; display: inline-table; border-spacing: 0;margin-left: 25px;}
#VehicleSale .vehinfo1 th ,#VehicleSale  .vehinfo1 td{padding:5px;    border-bottom: 2px solid lightgrey;}
#VehicleSale .vehinfo2 th ,#VehicleSale .vehinfo2 td{  padding:5px;border-bottom: 2px solid lightgrey; }
#VehicleSale .table-striped{ width:100%;border-spacing: 0;border:2px solid lightgrey;margin:20px 0px;}  
#VehicleSale  .table-striped th,#VehicleSale .table-striped td{padding:5px;}
#VehicleSale  .val-req{font-weight: bold;color: red;}
#VehicleSale .inputText{height:30px;width:100%;}
#VehicleSale .select{width: 100%;height:30px}
#VehicleSale .btn-blue{width:20%;height:30px;}


.outWithinRegion #getvin .grid-container .grid2 .inputText{width:90%;height:40px}
.outWithinRegion #getvin .grid-container .grid3 .btn-blue{width:90%;height:40px}
.outWithinRegion #showvin .flex-container .inputText{width:20%;height:40px}
.outWithinRegion #showvin .showvinBtn .btn-blue{width:20%;height:40px;margin:10px;}
.outWithinRegion #showvin .showvinBtn .btn-black{width:20%;height:40px;margin:10px;}
.outWithinRegion #getvin{margin-top: 50px;}
.outWithinRegion #showvin {margin-top: 50px; margin-left:50px;}
.outWithinRegion #showresult{margin-top: 50px; margin-left:50px;float:left}
.outWithinRegion #getvin .grid-container{display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:60%;grid-gap:10px;}
.outWithinRegion #getvin .grid-container .grid1{grid-column: span 1;text-align: center;margin-top:5px;}
.outWithinRegion #getvin .grid-container .grid2{grid-column: span 3;}
.outWithinRegion #getvin .grid-container .grid3{grid-column: span 2;}
.outWithinRegion #showvin .flex-container{display: flex;flex-direction: row;}
.outWithinRegion #showvin .flex-container label{align-self: center;}
.outWithinRegion #showvin .group-table .table{margin:20px;border-spacing: 0;}
.outWithinRegion #showvin .group-table .table th,.outWithinRegion #showvin .group-table .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.outWithinRegion #showvin .row .table{margin:20px;border-spacing: 0;}
.outWithinRegion #showvin .row .table th,.outWithinRegion #showvin .row .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.outWithinRegion #showvin .group-table{display:grid;grid-template-columns:auto auto auto;}
.outWithinRegion #showresult .showvinBtn .btn-blue{width:95%;height:40px;margin:10px}

.inWithinRegion #getvin,.inWithinRegion #showvin,.inWithinRegion #showresult{margin-top: 50px;margin-left:50px;}
.inWithinRegion #getvin .grid-container{ display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:60%;grid-gap:10px;}
.inWithinRegion #getvin .grid-container .grid1{grid-column: span 1;text-align: center;margin-top:5px;}
.inWithinRegion #getvin .grid-container .grid2{grid-column: span 3;}
.inWithinRegion #getvin .grid-container .grid3{grid-column: span 2;}
.inWithinRegion #getvin .grid-container .grid2 .inputText{width:90%;height:40px}
.inWithinRegion #getvin .grid-container .grid3 .btn-blue{width:90%;height:40px}
.inWithinRegion #showvin .table{ margin:20px 10px;border-spacing: 0;}
.inWithinRegion #showvin .table th, .inWithinRegion #showvin .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.inWithinRegion #showvin .showvinBtn .btn-blue{width:20%;height:40px;margin:10px}
.inWithinRegion #showvin .showvinBtn .btn-black{width:20%;height:40px;margin:10px}
.inWithinRegion #showresult .showvinBtn .btn-blue{width:50%;height:40px;margin:10px}

.inOutOfRegion #getvin, .inOutOfRegion #showvin,.inOutOfRegion #showresult{margin-top:50px;margin-left:50px;}
.inOutOfRegion #getvin .grid-container{display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:70%;grid-column-gap:10px;grid-row-gap: 15px;}
.inOutOfRegion #getvin .grid-container .grid1{grid-column: span 1;align-self: center; }
.inOutOfRegion #getvin .grid-container .grid2{grid-column: span 3;}
.inOutOfRegion #getvin .grid-container .grid3{grid-column: span 2;}
.inOutOfRegion #getvin .grid-container .grid2 .inputText{width:95%;height:40px}
.inOutOfRegion #getvin .grid-container .grid3 .btn-blue{width:95%;height:40px}
.inOutOfRegion #showvin .table{margin:20px;border-spacing:0}
.inOutOfRegion #showvin .table th,.inOutOfRegion #showvin .table td{padding:10px;text-align: left; border-bottom: 2px solid lightgrey;}
.inOutOfRegion #showvin .showvinBtn .btn-blue{width:20%;height:40px;margin:10px}
.inOutOfRegion #showvin .showvinBtn .btn-black{width:20%;height:40px;margin:10px}
.inOutOfRegion #showresult .showvinBtn .btn-blue{width:90%;height:40px;margin:10px}

.sslp #getvin{margin-top: 50px; margin-left:50px}
.sslp #getvin .grid-container{display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:60%;grid-gap:10px;}
.sslp #getvin .grid-container .grid1{grid-column: span 1;text-align: center;margin-top:5px;}
.sslp #getvin .grid-container .grid2{grid-column: span 3;}
.sslp #getvin .grid-container .grid3{grid-column: span 2;}
.sslp #showvin .flex-container{display: flex;flex-direction: row;}
.sslp #getvin .grid-container .grid2 .inputText{width:90%;height:40px}
.sslp #getvin .grid-container .grid3 .btn-blue{width:90%;height:40px}
.sslp #showvin .showvinBtn .btn-blue{width:20%;height:40px;margin:10px;}
.sslp #showvin .showvinBtn .btn-black{width:20%;height:40px;margin:10px;}
.sslp #showvin {margin-top: 50px; margin-left:50px;}
.sslp #showresult{margin-top: 50px; margin-left:50px;}
.sslp #showvin .group-table .table{margin:20px;border-spacing: 0;}
.sslp #showvin .group-table .table th,.sslp #showvin .group-table .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.sslp #showvin .group-table{display:grid;grid-template-columns:auto auto auto;}
.sslp #showresult .showvinBtn{display: flex;justify-content: flex-start;width:40%}
.sslp #showresult .showvinBtn .btn-blue{width:95%;height:40px;margin:10px}

.retailCancel{margin-top:50px;margin-left:50px;}
.retailCancel .retailCancel-table{margin: 10px; border-spacing: 0;}
.retailCancel .retailCancel-table td{ padding: 10px;border-bottom: 2px solid lightgrey;}
.retailCancel  .textarea{width:50%;margin-top:10px;}
.retailCancel  .btn-blue{  width:20%;height:35px}


.allocationFooter .table td{border:1px solid lightgray;font-weight: bold;padding:5px;}
.allocationFooter .table{width:50%}

.allocationAcc .allocacc-header{ font-size: 20px;font-weight: bold;margin: 5px;}
.allocationAcc .allocationAcc-grid{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));grid-column-gap:5px;margin:10px auto;}
.allocationAcc .btn-blue{ margin: 10px;width: 20%;height: 35px;}
.allocationAcc .btn-black{ margin: 10px;width: 20%;height: 35px;}

.bulkAcc .allocations { padding:10px 0px 10px 0px; font-family: helvetica;font-size: 1.2em; /*height: 20px;*/ border-bottom: 2px solid #1179F7; font-weight: bold;}
.bulkAcc .carlines {padding:10px 0px 10px 0px;  border-bottom: 2px solid #1179F7; font-weight: bold; font-size: .9em;}
/*.selected {font-weight: bold;}*/
.bulkAcc .allocations .allocationTitle,.bulkAcc .carlines .lineTitle {float:left;padding: 10px; }
.bulkAcc .allocations .allocationPNVW { flex:10%;text-align:end; font-size: .9rem;}
.bulkAcc .allocations .reportPNVW { cursor: pointer; border-bottom: 2px solid; color: #005491;}
.bulkAcc .allocations .mobileDisplay{display: none;}
.bulkAcc .allocations .bulk-Allocation{display: flex;}
.bulkAcc .allocationNumber {  padding: 10px; color:#ccc;}
.bulkAcc .allocationActive {color:#1179F7; font-weight: bold;}
.bulkAcc .carlines .bulk-carline{display:flex}
.bulkAcc .bulk-models{display:flex}
.bulkAcc .bulk-modelTitle{padding:10px;float: left;font-size: 1.0em;font-weight: bold;text-decoration: underline;cursor: pointer;}
.bulkAcc .modelTrim {  padding:10px;color: #ccc;cursor:pointer;font-weight:bold;font-size: 0.9em;}
.bulkAcc .selectedTrim { color: #1179F7;}   
.bulkAcc .bulk-grid{display:flex;flex-direction:row;/*grid-template-columns: repeat(3, minmax(0, 1fr));*/}
.bulkAcc .bulk-grid .bulk-grid1{border-right:2px solid #1179F7;padding:10px;flex:30%}
/*.bulkAcc .bulk-grid .bulk-grid1 .btn-blue{width:125px;height:25px;margin:5px}*/
.bulkAcc .bulk-grid .bulk-grid2{overflow-y:auto;overflow-x:hidden;position: relative;border-right:2px solid #1179F7;padding:10px 0px;flex:40%}
.bulkAcc .bulk-grid .bulk-grid3{border-right:2px solid #1179F7;padding: 10px;flex:30%;overflow-y: auto;}
.bulkAcc .bulk-grid .accModel { text-align: center; font-size: 1.2em; padding: 10px 0px;text-decoration: underline;}
.bulkAcc .bulk-grid .summaryTrim { font-size: .9em; margin: 10px 0px 0px 20px;}
.bulkAcc .bulk-grid .summaryTitle { font-weight: bold;}
.bulkAcc .bulk-grid .bulk-trimAcc-grid{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));}
.bulkAcc .bulk-grid .summaryAcc { font-size: .9em; margin: 5px 20px 0px 10px; text-transform: capitalize;}
.bulkAcc .bulk-grid .summaryNeedAtt { color: rgb(255, 140, 0)}
.bulkAcc .bulk-grid .summaryNotAvail { color:#f00; text-decoration: line-through;}
.bulkAcc .bulk-grid .modelArrow {border:0.5rem solid black; width: .75rem; height: .75rem; text-align: center; border-radius:50%; background-color: #000;color:#fff; font-weight: bold; margin:0px auto; line-height: .8; cursor:pointer}
.bulkAcc .bulk-slider{display: none;}
.bulkAcc .btn-blue{width:95%;height:30px;margin: 5px;}
.bulkAcc .bulk-grid .arrowDisabled {border:0.5rem solid #ddd;background-color: #ddd;}

.pulseContainer {width: 100%;height: 100%;position: relative;}
.pulseContainer .pulseButton {z-index: 100; height: 100%;width: 100%; position:absolute; display: flex; vertical-align: middle; align-items: center; justify-content: center;}
.pulseContainer .pulseBtnEnabled {cursor: pointer; color: #fff; background-color:#005491; }
.pulseContainer .pulseBtnDisabled {cursor: not-allowed; color: #333; background-color:#ddd; }
.pulseContainer .pulseChild {background-color: red;width: 100%;height: 100%;position: absolute;opacity: 0;animation: scaleIn 4s infinite cubic-bezier(.24,.1,.87,1.00); }
.pulseContainer .pulseNone { display: none; }
.pulseContainer .pulseButton:hover ~ .pulseChild { display: none;}


.bulkAccSubmit .flexContainer{display: flex;justify-content: space-between;padding: 15px 10px;border-bottom: 2px solid #1179F7;}
.bulkAccSubmit .flexContainer label{font-weight: bold;font-size: 18px;}
.bulkAccSubmit .carlineFlex{display: flex;flex-direction: row; padding: 15px 10px; border-bottom: 2px solid #1179F7;}
.bulkAccSubmit .carlineFlex .carlines{ display: flex;flex-wrap: wrap;font-size: 15px;}
.bulkAccSubmit .carlineFlex .carlines .carline-number{ margin:0px 10px;}
.bulkAccSubmit .carModelFlex{display: flex;flex-direction: row; padding: 15px 10px; border-bottom: 2px solid #1179F7;}
.bulkAccSubmit .carModelFlex .carModels{ display: flex;flex-wrap: wrap;font-size: 15px;}
.bulkAccSubmit .carModelFlex .carModels .carmodel-number{ margin:0px 10px;}
.bulkAccSubmit .bulkAcc-table{width:95%;margin:10px auto;border-spacing: 0;border:1px solid lightgray}
.bulkAccSubmit .bulkAcc-table th, .bulkAccSubmit .bulkAcc-table td{padding:5px}
.bulkAccSubmit .bulkAcc-table .accCode-list{display: flex;flex-wrap: wrap;}
.bulkAccSubmit .bulkAcc-table .accCode-list .accCodes{padding-right: 15px}

.updateCustomerInfo .alert{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb; border-radius: 5px; padding : 10px;}
.updateCustomerInfo .flex-container{/*text-align: right !important*/ display:flex;justify-content: left;width:90%; margin:auto;}
.updateCustomerInfo .flex-container .btn-blue { height: 35px;margin:15px;width:20%}
.updateCustomerInfo .flex-container .btn-black { height: 35px;margin:15px;width:20%}
.updateCustomerInfo .grid-container{ display:grid;grid-template-columns: repeat(7, minmax(0, 1fr));margin-bottom: 10px;width:70%;}
.updateCustomerInfo .grid-container .grid1{ margin-top:20px; grid-column: span 1;}
.updateCustomerInfo .grid-container .grid2{ margin:10px;  grid-column: span 4;}
.updateCustomerInfo .grid-container .grid3{ margin:10px; grid-column: span 2;}
.updateCustomerInfo .grid-container .grid3 .btn-blue{width:95%;height:35px;   }
.updateCustomerInfo .grid-container .grid2 .inputText { height:35px;width:100%;}
.updateCustomerInfo .updateinfo-table{width:100%;margin-bottom:15px;}
.updateCustomerInfo .updateinfo-table td{padding:10px;}
.updateCustomerInfoPrimary .primaryinfo{width:90%;margin:5px auto;}
.updateCustomerInfoPrimary .primaryinfo .grid-changeinfo-title{  display: flex;}
.updateCustomerInfoPrimary .primaryinfo .form-title {margin-right:10px;font-weight: bold;text-decoration: underline;}
.updateCustomerInfoPrimary .grid-container{display:grid;grid-template-columns: repeat(4, minmax(0, 1fr));margin:10px auto;width:90%;grid-column-gap:40px;}
.updateCustomerInfoPrimary .grid-container .grid-item1 {width:100%; padding: 5px;}
.updateCustomerInfoPrimary .grid-container .grid-item2 {width:100%;padding: 5px;grid-column: span 2;}
.updateCustomerInfoPrimary .grid-container1{display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));width: 100%;grid-column-gap: 40px;grid-column: span 4;}
.updateCustomerInfoPrimary  label {font-weight:bold;}
.updateCustomerInfoPrimary .inputText {height:30px;margin-top:5px;width:100%; display:block;}
.updateCustomerInfoPrimary .select { height:30px;margin-top:5px;width:100%;display:block;}
.updateCustomerInfoSecond .secondaryinfo{width:90%;margin:5px auto;}
.updateCustomerInfoSecond .secondaryinfo .grid-changeinfo-title{display: flex;}
.updateCustomerInfoSecond .secondaryinfo .grid-changeinfo-title .form-title {margin-right:10px;font-weight: bold;text-decoration: underline;}
.updateCustomerInfoSecond .secondaryinfo label {font-weight:bold;}
.updateCustomerInfoSecond .secondaryinfo .grid-container{display:grid;grid-template-columns: repeat(4, minmax(0, 1fr));margin:10px auto;width:100%;grid-column-gap:40px;}
.updateCustomerInfoSecond .secondaryinfo .grid-container .grid-item1 {width:100%;padding: 5px;}
.updateCustomerInfoSecond .secondaryinfo .grid-container .grid-item2 {width:100%;padding: 5px;grid-column: span 2;}
.updateCustomerInfoSecond .secondaryinfo .inputText {height:30px; margin-top:5px;width:100%;display:block;}
.updateCustomerInfoSecond .secondaryinfo .select { height:30px; margin-top:5px; width:100%; display:block;}


.demoReg #showVec,.demoReg #showresult{margin-top:50px;margin-left:50px;}
.demoReg #showVec .grid-container{display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:70%;grid-column-gap:10px;grid-row-gap: 15px;}
.demoReg #showVec .grid-container .grid1{grid-column: span 1;align-self: center; }
.demoReg #showVec .grid-container .grid2{grid-column: span 3;}
.demoReg #showVec .grid-container .grid3{grid-column: span 2;align-self: end;}
.demoReg #showVec .grid-container .grid2 .inputText{width:95%;height:40px}
.demoReg #showVec .grid-container .grid2 .inputDate{width:95%;height:40px}
.demoReg #showVec .grid-container .grid3 .btn-blue{width:95%;height:40px;}
.demoReg #showVec .group-table{display:grid;grid-template-columns:auto auto auto;}
.demoReg #showVec .group-table .table{ margin:20px;border-spacing: 0;}
.demoReg #showVec .group-table .table th,.demoReg #showVec .group-table .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.demoReg #showVec .showvecBtn .btn-blue{width:20%;height:40px;margin:10px}
.demoReg #showVec .showvecBtn .btn-black{width:20%;height:40px;margin:10px}
.demoReg #showresult .showvinBtn .btn-blue{width:90%;height:40px;margin:10px}

.cancelSale #getvin,.cancelSale #showvin,.cancelSale #showresult{margin-top: 50px;margin-left:50px;}
.cancelSale #getvin .grid-container{ display:grid;grid-template-columns: repeat(6, minmax(0, 1fr));width:70%;grid-gap:10px;}
.cancelSale #getvin .grid-container .grid1{grid-column: span 1;text-align: center;margin-top:5px;}
.cancelSale #getvin .grid-container .grid2{grid-column: span 3;}
.cancelSale #getvin .grid-container .grid3{grid-column: span 2;}
.cancelSale #getvin .grid-container .grid2 .inputText{width:90%;height:40px}
.cancelSale #getvin .grid-container .grid3 .btn-blue{width:90%;height:40px}
.cancelSale #getvin .grid-container .grid2 #msgrtn{margin-top:5px;display:block;color:red;font-weight: bold;}   
.cancelSale #showvin .table{ margin:20px 10px;border-spacing: 0;}
.cancelSale #showvin .table th, .cancelSale #showvin .table td{padding:10px;text-align: left;border-bottom: 2px solid lightgrey;}
.cancelSale #showvin .reason-textarea{margin-left:15px}
.cancelSale #showvin  #msgrtn{margin-top:5px;margin-left:15px;display:block;color:red;font-weight: bold;}
.cancelSale #showvin .textarea{width:70%}
.cancelSale #showvin .showvinBtn .btn-blue{width:20%;height:40px;margin:15px}
.cancelSale #showvin .showvinBtn .btn-black{width:20%;height:40px;margin:15px}


.vehicleDrilldown .div-buttons { height: 50px; width: 90%; margin-left: auto;margin-right: auto;display: flex;justify-content: end;}
.vehicleDrilldown .div-buttons .btn-blue { height: 30px; width:15%; margin-left: 10px;}
.vehicleDrilldown .textBlue{color:#1179F7}
.vehicleDrilldown .textRed{color:red}
.vehicleStatus{display: grid; grid-template-columns: 10% 45% 45%;border: 1px solid lightgrey;margin:10px;font-size: 10pt;}
.vehicleOwner{ display: grid; grid-template-columns: 10% 45% 45%;border: 1px solid lightgrey;margin:10px;font-size: 10pt;}
.vehicleDealer{display: grid;grid-template-columns: 10% 45% 45%;border: 1px solid lightgrey;margin:10px;font-size: 10pt;}
.vehicleDetails{ display: grid;grid-template-columns: 10% 45% 45%;border: 1px solid lightgrey;margin:10px;font-size: 10pt;}
.VehicleSales .btn-blue{width:20%;height:35px;}
.VehicleSales .table-striped{width:100%; border-spacing: 0;table-layout: fixed;border:2px solid grey; margin:10px 0px;}
.VehicleSales .table-striped th, .VehicleSales .table-striped td {padding:10px;}   


.inputBoxComponent .defaultLabel { padding:8px 0px 0px 10px; font-size: .8rem; }
.inputBoxComponent .defaultInput { padding:1px 10px 3px 10px; box-sizing: border-box; }
.inputBoxComponent .inputText{ padding:2px;width:100%;height:25px}

.popup .slider {margin:0px 25px; font-family: helvetica;}
.popup .sliderHeader { height: 40px; font-size: 1.2em; font-weight: bold; padding: 10px 0px 0px 0px; } 
.popup .sliderClose { position: absolute;font-size: 1.25em;height: 24px;width: 24px;border-radius: 50%;font-weight: bold;font-family: Helvetica;text-align: center;line-height: 1.25em;margin-left: 20px;right: 10px;top: 10px;}

.priceItemComponent .defaultItemClass { margin:0px auto; padding:5px 0px 0px 10px;box-sizing: border-box;font-size: .8rem; width: 100%; display:flex}
.priceItemComponent .itemDesc { flex:50% }
.priceItemComponent .itemValue { flex:50%;text-align: right;  }

.tooltip {position: relative;}
.tooltip .tooltiptext { text-transform: none;visibility: hidden;width: 200%; background-color: #525252;color: #fff;text-align: center; 
    border-radius: 6px;padding: 10px 10px;position: absolute;z-index: 5000; top: 100%; left: -50%;
    /*margin-left: -60px;*//* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */ 
    opacity: 0; transition: opacity 0.5s;font-size: 12px; }
.tooltip .tooltiptext::after { content: "";position: absolute;bottom: 100%; left: 50%;margin-left: -10px;border-width: 10px;border-style: solid; border-color: transparent transparent #525252 transparent;} 
.tooltip:hover .tooltiptext {visibility: visible; opacity: 1; }
.createTooltip .submit_button{height: 30px;width:100px;margin-bottom:15px}
.createTooltip .failure{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;}
.createTooltip .success{border-radius: 5px;padding : 10px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;}
.deleteTooltip .submit_button{height: 30px;width:100px;margin-bottom:15px}
.deleteTooltip .failure{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;}
.deleteTooltip .success{border-radius: 5px;padding : 10px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;}
.tooltip2 .submit_button{height: 30px;width:100px;margin-bottom:15px}
.tooltip2 .failure{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;}
.tooltip2 .success{border-radius: 5px;padding : 10px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;}




/*Report*/
 #ReportGrid.OutbackReport tr td{padding:0 0 0 3px;} 
 #ReportGrid.OutbackReport tr.Header td{padding: 2px;}
 #ReportGrid.OutbackReport tr.SearchOption td{padding: 0px;}
#ReportGrid .dataTableCss{ border-collapse: collapse; width: 100%; }
#ReportGrid .dataTableCss .desc{margin-top: 1px; cursor:pointer; }
#ReportGrid .dataTableCss .descActive{ border-top-color: #1179F7 !important;margin-top: 1px; }
#ReportGrid .dataTableCss .asc{ margin-top: -12px; cursor:pointer; }
#ReportGrid .dataTableCss .ascActive{ border-bottom-color: #1179F7 !important;margin-top: -12px; }
#ReportGrid .dataTableCss .SearchOption .export{ float:right;margin-top:15px; padding:0px 5px; }
#ReportGrid .dataTableCss .SearchOption .export:hover{cursor: pointer;}
#ReportGrid .dataTableCss .SearchOption .customize{ padding:0px 5px; float: right; margin-top: 15px; }
#ReportGrid .dataTableCss .SearchOption .customize:hover{cursor: pointer;}
#ReportGrid .dataTableCss .SearchOption .filter { padding:0px 5px; float: right; margin-top: 10px;}
#ReportGrid .dataTableCss .SearchOption .filter .filterIcon{margin-top: 5px;float: right;}
#ReportGrid .dataTableCss .SearchOption .search { float:right; margin-right: 5px;position:relative}
#ReportGrid .dataTableCss .SearchOption .search .inputText{margin: 10px auto;padding: 0px 10px;height: 30px;border-style: solid;border-radius:30px;width: 100%;background-color: rgba(8, 0, 255, 0);}
#ReportGrid .dataTableCss .SearchOption .search .menuSearchSubmit{background: transparent;border: none;cursor: pointer;position: absolute; top:0;bottom:0; right: 2px;}
#ReportGrid .dataTableCss .SearchOption .search .menuSearchSubmit i { font-size: 16px}
#ReportGrid .dataTableCss .SearchOption .search .menuClearButton{background: transparent;border: none;cursor: pointer;position: absolute;top:0;bottom:0;right: 25px;}
#ReportGrid .dataTableCss .SearchOption .search .menuClearButton i {color: lightgray; font-size: 16px;}
#ReportGrid .datatable-grid .datatable-flex .datatable-flexselect .select{width: 90%;height:30px;}
#ReportGrid .dataTableCss .btn-blue{width:170px;height:35px;}
#ReportGrid .dataTableCss .searchDiv .inputText { padding:5px 0px; width:100%;border: 0px solid #fff; }
#ReportGrid .dataTableCss .searchDiv{ width:100%; position:relative; height: 30px; }
#ReportGrid .dataTableCss .searchDiv .searchIcon { padding: 8px 10px 8px 0px; position: absolute; right: 0px; color: #999;}
#ReportGrid .datatable-grid{ display:grid;grid-template-columns:auto auto auto auto;grid-column-gap:5px;grid-row-gap:10px;margin:10px auto}
#ReportGrid .datatable-grid .datatable-flex{display:flex;flex-direction:row}
#ReportGrid .datatable-grid .datatable-flex .datatable-optionTitle{flex:25%;margin-right:5px;text-align:right;align-self: center;}
#ReportGrid .datatable-grid .datatable-flex .datatable-flexselect{ flex:70%;align-self: center;}
#ReportGrid .edit-popup {display: none;position: absolute;bottom: 45%;left:33%;border: 2px solid grey;z-index: 1;}
#ReportGrid .editpopup-form {max-width: 400px;padding: 10px;} 
#ReportGrid .ReportOptions .datatable-list{/*float:left*/width:100%}
#ReportGrid .ReportOptions ul.background-grey{list-style-type: none; overflow: hidden; margin:0px; margin-bottom: 10px; border:1px solid lightgray;padding-left:0px;display: flex;justify-content: space-between;}
#ReportGrid .ReportOptions ul.background-grey a{ cursor: pointer; }
#ReportGrid .ReportOptions .greyBackground {background-color: grey;color:white!important}


#ReportGrid .dataTableCss .headerSort { padding-right: 18px;	position: relative; }
#ReportGrid .dataTableCss .sortBy { position:absolute; display: block; top:50%; right:5px; border: 5px solid transparent;height: 0px;width: 0px; }
#ReportGrid .dataTableCss .searchandfilter { white-space: nowrap;}

#ReportGrid .iconMargin { width: 20px; }
#ReportGrid .iconMargin a { width: 20px; height:20px; background-color:red;display: block}
/*.searchDiv:before {content:"• ";}*/
/*.searchField {background-image: url(../../assets/images/core/searchIcon.png); background-position: 0px 6px; background-repeat: no-repeat;}
.searchField:focus {background-image:none;}*/
#ReportGrid .invoiceBtnColValue { background-image: url('../images/core/invoice.png'); background-repeat: no-repeat;width: 70px; background-size: 70px 20px; top:-2px; height: 27px;}
#ReportGrid .wStickerBtn {  background-image: url('../images/core/wStickerNew.png'); background-repeat:no-repeat ; background-position: center; width: 65px; background-size: 65px 18px;display: block;height: 18px;}
#ReportGrid .filterItem { display: inline-block; font-size: 0.8em; border:1px solid #999999; padding-right: 5px; margin-right: 10px; }
#ReportGrid .filterItemIcon { padding:3px 3px; background-color: #999999; color:#FFFFFF; margin: 5px; cursor: pointer; }
#ReportGrid .stickerIco {  background-image: url('../images/core/stickerIco.jpg');  width: 30px;   height: 19px;  background-repeat: no-repeat;display: inline-block; cursor: pointer;}
#ReportGrid .transferBtn { background-image: url('../images/core/xferBtn.png'); background-repeat: no-repeat;background-position: bottom;width: 70px;background-size: 65px 20px;display: inline-block;height: 22px;}
#ReportGrid .transferIco { background-image: url('../images/core/transferIco.png'); background-repeat: no-repeat; width: 20px; background-size: 20px 20px; display: inline-block;}
#ReportGrid .hapBtn { background-image: url('../images/core/hap.png'); background-repeat: no-repeat;width: 85px;background-size: 86px 20px;display: inline-block;height: 27px;}
#ReportGrid .pencilIco { background-image: url('../images/core/edit.png'); width: 15px;  height: 15px; display: inline-block; cursor: pointer;}
#ReportGrid .sslpBtn { background-image: url('../images/core/sslpBtn.png'); background-repeat: no-repeat;width: 45px;background-size: 45px 20px;display: inline-block;height: 20px;}
#ReportGrid .rdrIco { background-image: url('../images/core/rdrBtn.png'); background-repeat: no-repeat;width: 45px;background-size: 45px 20px;display: inline-block;height: 20px;}
#ReportGrid .demoRegBtn { background-image: url('../images/core/demoRegBtn.png'); background-repeat: no-repeat;width: 70px;background-size: 70px 20px;display: inline-block;height: 27px;}
#ReportGrid .editIco { background-image: url('../images/core/editIco.png'); background-repeat: no-repeat;background-position: center;width: 45px;background-size: 45px 20px;display: inline-block;height: 22px;}
#ReportGrid .submitBtnColValue { background-image: url('../images/core/submit.png'); background-repeat: no-repeat;width: 45px;background-size: 45px 20px;display: inline-block;height: 27px;}
#ReportGrid .colSettingsIco { background-image: url('../images/core/colSettingsIco.PNG'); background-repeat: no-repeat;width: 44px;background-size: 45px 20px;display: inline-block;height: 27px;}
#ReportGrid .spParamIco { background-image: url('../images/core/spParamIco.PNG'); background-repeat: no-repeat;width: 44px;background-size: 45px 20px;display: inline-block;height: 27px;}   
#ReportGrid .paging {display: flex;justify-content: right;margin-top: 20px;padding-right: 20px;padding-bottom: 20px;}


.Modalcontainer {display:none; position:fixed; z-index:1; /*padding-top:100px;*/ left:0; top:0; width:100%; height:100%; overflow:auto; background-color:rgba(0,0,0,0.8); }
.Modalcontainer p:first-child {background-color: #fff; border-radius: 5px; padding:5px 0px 10px 5px;}
.Modalcontainer .buttons{text-align: center;}
.Modalcontainer .accessory {float:left; background-color:#fefefe; margin:auto; padding:20px; border:2px solid #333;/*width:200px;*/ border-radius: 10px; background:#888; position:relative; animation-name:modeal; animation-duration:1.5s; animation-fill-mode:forwards;left:50%;transform: translate(-50%, -50%);}
.Modalcontainer.accessory img { max-width: 400px; max-height: 400px;}

.pager { display: flex; align-items: center; font-size: 14px }
.pager .pagerContainer { display: flex; align-items: center; margin: 0 4px; padding: 0 4px; margin: 0 4px; position: relative; }
.pager .ellipsisButton { cursor: unset !important; }
.pager .pagerBackground { position: absolute; top: 2px;  left: 0; width: 100%;height: calc(100% - 4px); z-index: 1; }
.pager .pagerButton { z-index: 2; cursor: pointer; height: 30px; width: 30px; display: flex; align-items: center; justify-content: center; border-radius: 15px;margin:auto 2px;padding:initial;border: 1px solid #ddd; }
.pager .pagerButtonWide { padding: 0 4px; }
.pager .pagerButton:hover:not(.btn-blue):not(.ellipsisButton):not(.pagerArrowButtonDisabled) {  background-color: #bfbfbf; }
.pager .ellipsis { align-self: end; padding-bottom: 2px; }
.pager .btn-blue { /*background-color: #00205B !important; color: white; */ border:none}
.pager .pagerArrowButton { display: flex; align-items: center; justify-content: center; border-radius: 50%;  height: 28px; width: 28px; text-align: center; border: 1px solid #ddd; margin-top: 2px;background-color: transparent; } 
/*.pager .pagerArrowButton:active:not(.pagerArrowButtonDisabled) { background-color: #00205B !important; color: white !important; }*/
 .pager .pagerArrowButtonDisabled { color:currentColor; cursor: unset; }

.customizeColumns { font-family: Helvetica;margin:5px }
.customizeColumns .title { font-weight: bold; font-size: 20px; } 
 /*.customizeColumns .title .reportTitle { color: green; } */
.customizeColumns .description { font-size: 16px; margin-top: 10px; } 
.customizeColumns .row { display: grid;grid-template-columns: 40% 20% 20% 20%; align-items: center; padding: 2px; margin: 2px;  font-size: 14px;  }
.customizeColumns .row:hover:not(.header) { background-color: #B0B0B0; cursor: pointer; } 
.customizeColumns .header { font-weight: bold; border-bottom: 1px solid #aaa; padding-bottom: 4px;font-size: 14px; }
.customizeColumns .row .visible {/* flex: 0 70px;*/ text-align: center; } 
.customizeColumns .row .sort {/* flex: 0 50px;*/ display: flex; align-items: center; justify-content: left; } 
.customizeColumns .row .sort input { margin-top: 0; } 
.customizeColumns .row .sort i { /*color: #555;*/ margin-left: 4px; font-size: 20px; line-height: 10px; }
.customizeColumns .row .sort i:hover { color: #1179F7; }
.customizeColumns .row .sort .up { margin-top: 4px; }
.customizeColumns .row .order { /*flex: 0 40px;*/ display: flex; align-items: center; justify-content: center; } 
.customizeColumns .row .order i { /*color: #555;*/ margin: 0 4px; font-size: 16px; }
.customizeColumns .row .order i:hover:not(.disbled) { color: #1179F7;}
.customizeColumns .row .order .disabled { opacity: .2; cursor: auto;}
.customizeColumns .buttonContainer { display: flex; justify-content: center;  align-items: center; margin-top: 20px; }
.customizeColumns .buttonContainer button { height: 35px; padding: 0 10px; }
.customizeColumns .tableContainer { border: 1px solid #aaa; margin-top: 20px; }

.colorSelector .filterCircle{ width:32px; height: 32px; border-radius: 16px; box-shadow: 0px 0px 2px #000; margin: 3px auto; position: relative; }
.colorSelector .colorSelected:before { content: "\2713"; }
.colorSelector .colorSelected {position: absolute; font-size: 1.5em; top: 50%; left: 50%; transform: translate(-50%, -50%);  cursor: pointer;}
.colorSelector .blackChecked{ color: #000000;}
.colorSelector .whiteChecked{ color: #FFFFFF;}

.dateRangeSelector { display: flex; align-items: top; }
.dateRangeSelector .dateItem { width: 50%; }
.dateRangeSelector .dateItem .errorMessage { color: red; margin-left: 10px; font-size: 13px; }
.dateRangeSelector .dateItem .dateGroup { display: flex; align-items: center;}
.dateRangeSelector .dateItem .dateGroup label { flex: 1; margin: 5px; font-weight: bold;line-height: 20px;  }
.dateRangeSelector .dateItem .dateGroup .inputDate { height: 35px;/* flex: 1;*/width:75%;margin:5px }
.dateRangeSelector .btn-blue { height: 35px; width: 20%; margin: 5px }
.dateRangeSelector .btn-black { height: 35px; width: 20%; margin: 5px }

.dateSelector .inputText{width: 90%;height: 30px;}

.numberSelector .list-filter{width: 90%;}
.numberSelector .drop-filter{width: 90%;height: 30px;}
.numberSelector .inputText{width: 90%;height: 30px;}


/*Slider */
.mainSlider{display:none; position: fixed;overflow-y:auto;  height: 100%; top:0px;z-index:5}
.mainSlider .slider {font-family: helvetica;}
.mainSlider .sliderHeader { height: 40px; font-size: 1.2em; font-weight: bold; padding: 10px 0px 0px 0px; } 

.mainSlider .sliderBar {background:white;position:sticky;top:0;height: 30px;z-index: 3; text-align: right;padding-top:4px;}
.mainSlider .sliderBar>div{cursor:pointer;display:inline-block; text-align: center;padding:5px 2px 0 2px;margin: 1px; font-size: 1.25em;height: 24px;width: 24px;border-radius: 50%;font-weight: bold;font-family: Helvetica; }



.rdrDraft .header {height: 12px;padding: 10px;margin-top: 10px;/* box-shadow: 0px 0px 10px #666; */}
.rdrDraft .header >span {float: left;margin-left: 14px;font-weight: bold;} 
.rdrDraft .divflex {border-radius: 5px;}
.rdrDraft .divflex .grid-container{display: grid;grid-template-columns: repeat(2, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 30px auto; width: 90%;}
.rdrDraft .divflex .grid-container .grid2 {grid-column: span 2;}
.rdrDraft .divflex .grid-container .grid1 { grid-column: span 1;}
.rdrDraft .divflex .grid-container .inputText {width:100%; height:30px}
.rdrDraft .divflex .grid-container .inputDate{ width:100%;height:30px}
.rdrDraft .divflex .grid-container .select{ width:100%; height:30px}
.rdrDraft .divflex .grid-container .label {font-size: 13px;font-weight: bold;line-height: 24px;}
.rdrDraft .divflex .grid-container .label-check {font-size: 13px;font-weight: bold;line-height: 21px;}
.rdrDraft .btn-blue {margin: 10px;width: 43%; height: 35px;} 
.rdrDraft .btn-black {margin: 10px; width: 43%; height: 35px; }
.rdrDraft .divflex .grid-container .invalid {font-size: 12px;line-height: 24px;color: red; }
.rdrDraft .divflex .mt-10 { margin-top: 10px;}
.rdrDraft .divflex .info-header {margin-top: 14px; margin-bottom: 14px; padding: 10px; margin-left: -10px;border-radius: 4px; width: 100%;}
.rdrDraft .divflex .info-header span {font-size: 14px;font-weight: 600;}

.userFeedback{margin: 10px;}
.userFeedback .btn-blue{float:right ;width:40%;height:40px;margin-right:10px;}
.userFeedback .feedback-table .flex-container .flexCol1 .btn-blue{width:80%;height:20px;padding:8px;text-align: center;float:left;font-size:13px;}
.userFeedback .feedback-table .inputText{width:100%}
.userFeedback .feedback-table .textarea{width: 100%;}
.userFeedback .feedback-table th,.userFeedback .feedback-table td{padding:5px;}
.userFeedback .feedback-table .label{font-weight: bold;text-align: left;}
.userFeedback .feedback-table .flex-container .flexCol1{flex:25%;}
.userFeedback .feedback-table .flex-container .flexCol2{flex:70%;border: 2px solid lightgrey;}
.userFeedback .feedback-table .flex-container{display:flex;}
.userFeedback .feedback-table .printSubject{display: none;}





/*Retailer Resources*/

.accessMenuItem ul {list-style-type: none;margin: 0;padding: 0;}
.accessMenuSpecial  ul {list-style-type: none;margin: 0;padding: 0;}
.accessMenuSpecial li {list-style-type: none;  margin: 0;padding: 0;}
.eyeballMenu ul {list-style-type: none; margin: 0;padding: 0;}
.eyeballMenu input[type=checkbox] { display:none; }

.addattritubeCssStyler { margin-left: 50px; margin-top: 30px;width:60%}
.addattritubeCssStyler .background-blue { margin-bottom: 10px; padding-top: 10px; padding-bottom: 10px; padding-right: 0px; border-radius: 4px;}
.addattritubeCssStyler .background-blue span {margin-left: 10px; font-weight: bold; }
.addattritubeCssStyler .cfield-title { font-size: 15px;font-weight: bold;line-height: 24px;}
.addattritubeCssStyler .cfield span {font-size: 14px;float: right;width: 100%; margin-left: 4px;font-weight: 600;  height: 26px;}
.addattritubeCssStyler .cfield input { width: 100%;height:35px;}
.addattritubeCssStyler .cfield select { width: 95%;height:35px;}
.addattritubeCssStyler .btn-blue{ width:100%;height:35px;}
.addattritubeCssStyler .pull-right { float: right;}
.addattritubeCssStyler .icons-container { margin-top: 24px; cursor: pointer;  text-align: center; }
.addattritubeCssStyler .icon-remove { color: #ff0000;}
.addattritubeCssStyler .icon-add {color: #1179F7;}
.addattritubeCssStyler .btn-disabled { background-color: #4a4949 !important;box-shadow: none !important;border: 1px solid #4a4949 !important;cursor:default;}

.addChildCssStyler {margin-left: 50px; margin-top: 30px;   width:60%;}
.addChildCssStyler .background-blue { margin-bottom: 10px;  padding-top: 10px;padding-bottom: 10px; padding-right: 0px; border-radius: 4px;}
.addChildCssStyler .background-blue span { margin-left: 10px;font-weight: bold;}
.addChildCssStyler .cfield-title {  font-size: 15px;font-weight: bold;line-height: 24px;}
.addChildCssStyler .cfield span { font-size: 14px; float: right;  width: 100%;margin-left: 4px;  font-weight: 600;height: 26px;}
.addChildCssStyler .cfield input {width: 100%;height:35px;}
.addChildCssStyler .cfield select {  width: 95%;height:35px;}
.addChildCssStyler .btn-blue{ width:100%;height:35px;}
.addChildCssStyler .pull-right {float: right;}
.addChildCssStyler .icons-container { margin-top: 24px;cursor: pointer;text-align: center;}
.addChildCssStyler .icon-remove {color: #ff0000;}
.addChildCssStyler .icon-add {  color: #1179F7;}
.addChildCssStyler .btn-disabled { background-color: #4a4949 !important; box-shadow: none !important;border: 1px solid #4a4949 !important; cursor:default;  }

.appErrorLog .table { width: 95%;margin: 30px auto;margin-bottom: 10px;}
.appErrorLog .table th, .appErrorLog .table td { border-width: 0;font-size: 13px; padding: 10px;  border: 1px solid #f1f1f1;text-align: left;}
.appErrorLog .table th {color: black; text-align: left;}
.appErrorLog .table span {font-size: 14px;}

.createCssClass {margin-left: 50px; margin-top: 30px;width:60%}
.createCssClass .background-blue {   margin-bottom: 10px;padding-top: 10px;  padding-bottom: 10px;padding-right: 0px;border-radius: 4px; }
.createCssClass .background-blue span {margin-left: 10px;  font-weight: bold;}
.createCssClass  .cfield-title {font-size: 15px;font-weight: bold;line-height: 24px;}
.createCssClass .inputText { width: 100%; height:35px;}
.createCssClass .select {width: 95%; height:35px;}
.createCssClass .pull-right {float: right;} 
.createCssClass .icons-container { margin-top: 24px;   cursor: pointer;  text-align: center;}
.createCssClass .icon-remove {color: #ff0000;}  
.createCssClass .icon-add{ color:#1179F7 }
.createCssClass .btn-blue{ width:100%; height:35px;}
.createCssClass .btn-disabled {background-color: #4a4949 !important;box-shadow: none !important;border: 1px solid #4a4949 !important; cursor:default;}

.createPageComponent {margin-left: 50px; margin-top: 30px; width:60%;}
.createPageComponent .background-blue { margin-bottom: 10px;padding-top: 10px;padding-bottom: 10px;padding-right: 0px; border-radius: 4px;}
.createPageComponent .background-blue span { margin-left: 10px;font-weight: bold;}
.createPageComponent .cfield-title { font-size: 15px;font-weight: bold;  line-height: 24px;}
.createPageComponent .cfield .inputText {width:100%;height:35px;}
.createPageComponent .cfield .select {  width:100%;height:35px;}
.createPageComponent .cfield-div-check {padding: 5px;padding-left: 2px;}
.createPageComponent .cfield-div-check > label {float: left;margin-top: 2px;  font-weight: 600; font-size: 13px;}
.createPageComponent .pull-right {float: right;}
.createPageComponent .icons-container { margin-top: 24px;cursor: pointer;}
.createPageComponent .icon-remove {color: #ff0000;}
.createPageComponent .icon-add{color:#1179F7}
.createPageComponent .btn-blue{ width:100%; height:35px;}  
.createPageComponent .btn-disabled {background-color: #4a4949 !important;box-shadow: none !important;border: 1px solid #4a4949 !important; cursor:default;}

.adminselect .header{color:white;background: #1D4F91;width: 75%; margin-top:10px;padding:20px;box-sizing: border-box;margin-right: auto; margin-left:auto;}
.adminselect .dropDownContainer{   margin-right:auto;  margin-left:auto;width:75%;  height:70vh;padding: 20px;box-sizing: border-box;}
.adminselect .flex{ display: flex;}
.adminselect .inputText{  width:70%;    height:30px;margin:auto 10px;}
.adminselect .flex .btn-blue{width:70%;height:30px;   margin:auto 10px;}
.adminselect .populatedList{ display: grid;grid-template-columns:repeat(2, minmax(0, 1fr));   margin:10px;column-gap: 15px;}
.adminselect .feedbackItem{display: flex; padding:15px;}
.adminselect  .feedbackItem .btn-blue{    width:50%;height:30px;}
.adminselect  .btn-blue{  width:20%; height:30px; margin:10px;}
.adminselect .btn-black{  width:20%; height:30px;margin: 10px;}

.dealerFeedback .table{ margin:20px auto; width:60%; border-spacing: 0;}
.dealerFeedback .table td{padding:10px;}
.dealerFeedback .table th{padding-left:10px;}
.dealerFeedback .inputText{width:100%;height:35px;}
.dealerFeedback .select{   width:100%; height:35px;}
.dealerFeedback .table .btn-blue{ padding: 10px; width: 75%;   height: 20px;  float: left;text-align: center; font-size:13px;}
.dealerFeedback .flex-container{margin:30px auto;width:60%;}
.dealerFeedback .flex-container .btn-blue{ margin:10px;    width:30%;height:35px;}
.dealerFeedback .flex-container .btn-black{margin:10px;  width:30%;height:35px;}
.dealerFeedback .table .flex1{flex:25%;}
.dealerFeedback .table .flex2{flex:70%;border: 2px solid lightgrey;}
.dealerFeedback .icon-add {    color: #1179F7;cursor: pointer;}
.dealerFeedback .div-container { display: flex; float: left;}
.dealerFeedback .img-container { padding: 10px; border: 1px solid #eee; border-radius: 4px; width: 120px;}
.dealerFeedback .img { width: 120px; height: 80px; border-radius: 4px;}
.dealerFeedback .div-img-margin {margin-left: 20px;}
.dealerFeedback .div-img-margin-5-11 {margin-left: 0px;margin-top: 10px;}
.dealerFeedback .delete-icon { float: right; margin-top: -16px; margin-right: -16px; cursor: pointer;}

.toggleContainer { display: flex; align-items: center; }
.toggleContainer .toggleLabel { border-radius: 20px; border-width: 2px;border-style: solid;height: inherit;cursor: pointer;transition: all 250ms;width: 100%;padding: 2px;display: flex;}
.toggleContainer .toggle { height: 100%; }
.toggleContainer .toggleAlignLeft .toggleText{ margin-right: 6px; }
.toggleContainer .toggleAlignRight { flex-direction: row-reverse; }
.toggleContainer .toggleAlignRight .toggleText { margin-left: 6px; }
.toggleContainer .toggleAlignTop { flex-direction: column; }
.toggleContainer .toggleAlignTop .toggleText { margin-bottom: 6px; }
.toggleContainer .toggleAlignBottom { flex-direction: column-reverse; }
.toggleContainer .toggleAlignBottom .toggleText { margin-top: 6px; }
.toggleContainer .checkboxInput { position: absolute; opacity: 0; cursor: inherit; height: 0; width: 0; }
.toggleContainer .svgContainer { text-align: right; flex: 0 0; height: inherit; transition: all 250ms; position: relative; }
.toggleContainer .toggleChecked { flex-grow: 1; }
.toggleContainer .checkboxDisabled { cursor: default; }

.feedbackList p{ margin: 0;;}
.feedbackList a{  font-weight: bold;text-decoration: underline; cursor: pointer;}
.feedbackList .noFeedback{   text-align: center;padding:20px;}
.feedbackList .select{width:100%;height:30px;}
.feedbackList .dropDownContainer{ margin-right:auto;  margin-left:auto;width:75%;   padding: 10px;box-sizing: border-box;}
.feedbackList .feedbacktabs{ margin:10px auto;  width:89%;height:40px;}
.feedbackList .feedbacktabs .buttontabs{width:33%; height:40px;margin:1px;background-color: #D3D3D3;border-radius: none; border:none;float: left;cursor: pointer;font-weight:bold;}
.feedbackList .feedbacktabs .bluetab{background-color: #1D4F91;color: white;}
.feedbackList .header{ color:white;background: #1D4F91; width: 75%; margin-top:10px;padding:20px;box-sizing: border-box;margin-right: auto;margin-left:auto;  text-align: center;}
.feedbackList .feedbackItem {padding:10px;  width:85%;margin:10px auto;border:2px solid lightgray}
.feedbackList .feedbackRow {display: flex;align-items: center;   justify-content: space-between;}
.feedbackList .btn-blue{  width:20%;height:35px;margin:15px;}
.feedbackList .btn-black{ width:20%;height:35px;margin:15px; }
.feedbackList .feedback-detail{position:absolute;top:0px;right:0px;border:2px solid #ccc;margin-right: -6px;background-color: white; z-index:11; width:70%;height:100%;     overflow-y: auto;}
.feedbackList .cdk-drag-preview {   font-family: Arial, Helvetica, sans-serif;border-radius: 4px; box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);background-color: white;margin: 0;    padding-top: 0;}
.feedbackList .cdk-drag-placeholder {opacity: 0;}
.feedbackList .cdk-drag-animating {transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);}
.feedbackList .dropDownContainer.cdk-drop-list-dragging .background-whiteblack:not(.cdk-drag-placeholder) {  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);}

.feedbackDetail .imageList li{float: left;margin:10px;}
.feedbackDetail .editImage{ float: left;margin:10px;}
.feedbackDetail .update .flex{display: flex; margin:10px;justify-content: space-between; width:70%;}
.feedbackDetail .update .flex .inputText{ width:100%;   height:30px}
.feedbackDetail .update .textarea{ width:100%;}
.feedbackDetail .btn-blue{ width:20%;height: 30px;  margin:10px;}
.feedbackDetail .btn-black{width:20%;height: 30px; margin:10px;}
.feedbackDetail .delete-icon {float: right; margin-top: -16px; margin-right: -16px; cursor: pointer;}

.deleteCssClass .table { width: 100%;margin-top: 4px;margin-bottom: 1rem;color: #212529;  vertical-align: top;}
.deleteCssClass .table>tbody {vertical-align: inherit;}
.deleteCssClass .table-striped {  width: 100%; border: 1px solid #ddd;} 
.deleteCssClass .table-striped  td,.deleteCssClass .table-striped th {border-width: 0;font-size: 13px;  padding: 10px;} 
.deleteCssClass .table-striped i { cursor: pointer;}
.deleteCssClass .table>:not(caption)>*>* {padding: .2rem .4rem;}
.deleteCssClass .warning {  margin-top: 30px;  font-size: 14px;margin-bottom: 10px; color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;padding: 10px;}
.deleteCssClass .warning span {margin-left: 10px;}
.deleteCssClass .btn-blue{ width:170px; height:30px;}

.editPageComponent {margin-left: 50px; margin-top: 30px;width:60%;}
.editPageComponent  .background-blue {  margin-bottom: 10px;  padding-top: 10px;padding-bottom: 10px; padding-right: 0px; border-radius: 4px;}
.editPageComponent  .background-blue span {margin-left: 10px; font-weight: bold;}
.editPageComponent .cfield-title { font-size: 15px;font-weight: bold; line-height: 24px;}
.editPageComponent .cfield .inputText { width:100%; height:35px;}
.editPageComponent .cfield .select {  width:100%;height:35px;}
.editPageComponent .btn-blue{width:100%;height:35px;}
.editPageComponent .cfield-div-check {padding: 5px;padding-left: 2px;}
.editPageComponent .cfield-div-check > label {float: left;  margin-top: 2px;font-weight: 600; font-size: 13px;}
.editPageComponent .pull-right {float: right;}
.editPageComponent .icons-container {margin-top: 24px;cursor: pointer;}
.editPageComponent .icon-remove {  color: #ff0000;}
.editPageComponent .icon-add{ color:#1179F7}
.editPageComponent .btn-disabled {background-color: #4a4949 !important; box-shadow: none !important;border: 1px solid #4a4949 !important; cursor:default;}

.subFormComponent .alert{ color: #721c24;background-color: #f8d7da;border-color: #f5c6cb; border-radius: 5px;padding : 10px;  text-align:center;}
.subFormComponent .inputText{width:100%; height:35px;}
.subFormComponent .icon-remove {color: #ff0000;}


.manageEnumTypes {   width:50%; margin:50px 20px;}
.manageEnumTypes .inputText{ width:100%; height:35px;}
.manageEnumTypes .icon-add{ color:#1179F7}
.manageEnumTypes .btn-blue{height: 35px;width:100%;margin-bottom:15px}
.manageEnumTypes .alert{  color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;text-align: center;}
.manageEnumTypes .success{border-radius: 5px;padding : 10px; color: #155724;background-color: #d4edda;border-color: #c3e6cb;text-align: center;}

.reportColumnSettings{ width:80%;margin:20px auto;}
.reportColumnSettings .grid-container{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportColumnSettings .grid-container .grid-item1{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 1;}
.reportColumnSettings .grid-container .grid-item1 .label{font-weight: bold;}
.reportColumnSettings .inputText{width:100%; height:30px;}
.reportColumnSettings .select{  width:100%; height:30px;}
.reportColumnSettings .alert{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;  padding : 10px;}
.reportColumnSettings .alert-border {border: 1px solid #ff0000;}
.reportColumnSettings .btn-blue{   height: 30px;width:30%;margin:20px auto}
.reportColumnSettings .success{border-radius: 5px;padding : 10px; color: #155724;background-color: #d4edda;  border-color: #c3e6cb;}


.reportColumnFilterSettings{ width:80%;margin:20px auto;}
.reportColumnFilterSettings .grid-container{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportColumnFilterSettings .grid-item1{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 1;align-self: center;}
.reportColumnFilterSettings .grid-item2{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 2;align-self: center;}
.reportColumnFilterSettings .label{font-weight: bold;}
.reportColumnFilterSettings .inputText{width:100%; height:30px;}
.reportColumnFilterSettings .select{  width:100%; height:30px;}
.reportColumnFilterSettings .alert{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;  padding : 10px;}
.reportColumnFilterSettings .alert-border {border: 1px solid #ff0000;}
.reportColumnFilterSettings .btn-blue{   height: 30px;width:30%;margin:20px auto}
.reportColumnFilterSettings .success{border-radius: 5px;padding : 10px; color: #155724;background-color: #d4edda;  border-color: #c3e6cb;}
.reportColumnFilterSettings .paramContainerText label {text-align: center;}
/*.paramContainerText a {flex:0 10px;margin-left: 10px;}*/
.reportColumnFilterSettings .paramContainer {display: flex; flex-direction: column;}
.reportColumnFilterSettings .paramContainer .grid-container1{display: grid; grid-template-columns: 1fr 1fr 1fr 10px;margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportColumnFilterSettings .paramContainer .paramRow {display: flex; margin-top: 10px; align-items: center;}
.reportColumnFilterSettings .paramContainer .paramRow .inputText {flex:1;height: 35px;margin-right: 5px;}

.reportSettings{ width:80%; margin:20px auto;}
.reportSettings .grid-container{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportSettings .grid-container .grid-item1{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 1;}
.reportSettings .grid-container .grid-item1 .label{font-weight: bold;}
.reportSettings .inputText{  width:100%; height:30px;}
.reportSettings .select{ width:100%;height:30px;}
.reportSettings .alert{    color: #721c24;background-color: #f8d7da; border-color: #f5c6cb;border-radius: 5px;  padding : 10px;}
.reportSettings .alert-border {border: 1px solid #ff0000;}
.reportSettings  .btn-blue{height: 30px; width:25%;margin:20px auto}
.reportSettings .success{ border-radius: 5px;padding : 10px;color: #155724; background-color: #d4edda;border-color: #c3e6cb;}

.reportPageSettings { width:80%; margin:20px auto;}
.reportPageSettings .grid-container{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportPageSettings .grid-container .grid-item1{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 1;}
.reportPageSettings .grid-container .grid-item2{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 2;}
.reportPageSettings .grid-container .label{font-weight: bold;}
.reportPageSettings .inputText{  width:100%; height:30px;}
.reportPageSettings .select{ width:100%;height:30px;}
.reportPageSettings .alert{    color: #721c24;background-color: #f8d7da; border-color: #f5c6cb;border-radius: 5px;  padding : 10px;}
.reportPageSettings .alert-border {border: 1px solid #ff0000;}
.reportPageSettings  .btn-blue{height: 30px; width:25%;margin:20px auto}
.reportPageSettings .success{ border-radius: 5px;padding : 10px;color: #155724; background-color: #d4edda;border-color: #c3e6cb;}

.reportSpParams{  width:80%;margin:20px auto;}
.reportSpParams .grid-container{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));margin: 10px auto;width: 100%; grid-column-gap: 40px;}
.reportSpParams .grid-container .grid-item1{width: 100%;padding: 10px 0px 5px 0px;grid-column: span 1;}
.reportSpParams .grid-container .grid-item1 .label{font-weight: bold;}
.reportSpParams .alert{color: #721c24;background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;   padding : 10px;}
.reportSpParams .inputText{width:100%; height:30px;}
.reportSpParams .select{width:100%; height:30px;}
.reportSpParams .alert-border {border: 1px solid #ff0000;}
.reportSpParams .success{border-radius: 5px;padding : 10px; color: #155724;background-color: #d4edda;border-color: #c3e6cb;}
.reportSpParams .btn-blue{height: 30px;  width:30%;margin:15px auto;}

.newsGalleryImage{  width:50%;margin:15px}
.newsGalleryImage .table td{padding:5px;}
.newsGalleryImage .btn-black{padding:10px;}
.newsGalleryImage .inputText{   width:100%;height:35px}
.newsGalleryImage .inputDate{width:100%; height:35px;}
.newsGalleryImage .btn-blue{height: 35px;  width:100%;margin-bottom:15px}
.newsGalleryImage .alert{  color: #721c24; background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;}
.newsGalleryImage .success{ border-radius: 5px;padding : 10px;color: #155724;background-color: #d4edda;border-color: #c3e6cb;}


.paymentProfileInfo .header {background-color: #666666;color: #fff; height: 10px;padding: 10px; border-radius: 2px;/* box-shadow: 0px 0px 10px #666; */}
.paymentProfileInfo .header >span {margin-top: -2px; float: left; margin-left: 14px;} 
.paymentProfileInfo .divflex {margin: 40px auto;border: 1px solid #777;border-radius: 5px;width:80%; }
.paymentProfileInfo .divflex .grid-container{display: grid; grid-template-columns: repeat(2, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 30px auto;  width: 90%;}
.paymentProfileInfo .divflex .grid-container .grid2 {grid-column: span 2; }
.paymentProfileInfo .divflex .grid-container .grid1 {grid-column: span 1;}
.paymentProfileInfo .divflex .grid-container .inputText{ width:100%; height:30px}
.paymentProfileInfo .divflex .grid-container .inputDate{ width:100%; height:30px}
.paymentProfileInfo .divflex .grid-container .select{  width:100%; height:30px}
.paymentProfileInfo .divflex .grid-container .label {font-size: 13px;font-weight: bold; line-height: 24px;}
.paymentProfileInfo .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
.paymentProfileInfo .btn-black {margin: 10px; width: 20%;height: 35px;}
.paymentProfileInfo .divflex .grid-container .invalid { font-size: 12px; line-height: 24px;  color: red;}

.paypalUpload .table1{width:60%;margin:20px auto}
.paypalUpload .table1 td{    padding:10px}
.paypalUpload .inputText{ width:100%;  height:40px}
.paypalUpload .disabled{background-color: #cccccc !important;}
.paypalUpload  .preview {width:60%;margin:20px auto}
.paypalUpload  .preview .btn-blue{width:75%;height: 30px;}
.paypalUpload  .preview .btn-black{width:75%;height: 30px;}
.paypalUpload  .preview .table2{width:100%;border-spacing: 0;}
.paypalUpload  .preview .table2 th,  .paypalUpload  .preview .table2 td {   padding:10px;border:1px solid lightgray;text-align:center;}
.paypalUpload .table1 .uploadLabel .btn-blue{ padding: 10px; width: 75%; height: 20px;float: left;text-align: center;}
.paypalUpload .table1 .btn-blue{ width:30%;    height:40px}


.automateContainer {   margin: 20px auto; display: flex;width:90%}
.automateContainer .leftContainer,.automateContainer .rightContainer {border: 1px solid #888;  margin:20px;flex: 1;/*min-width: 350px;*/ padding: 35px;}
.automateContainer .formGroup { display: grid; margin-top: 15px;align-items: center; grid-template-columns: 1fr 3fr; }
.automateContainer .formGroup .error { padding-top: 6px; color: red; }
.automateContainer .buttonContainer {margin-top: 20px;display: flex;justify-content: center; }
.automateContainer .titleBar button {  width:20%;height:35px;   }
.automateContainer .leftContainer button {width:50%; height:35px;   }
.automateContainer .btn-blue {padding: unset;}
/*.automateContainer button:hover {background-color: #0E3A87;}*/
.automateContainer button:disabled {background-color: #ccc;cursor: initial;} 
.automateContainer label { font-weight: bold;}
.automateContainer .inputText { height: 35px; font-size: 14px; }
.automateContainer .select { height: 35px; font-size: 14px; }
.automateContainer .titleBar { display: flex;justify-content: space-between;align-items: center; padding-bottom: 10px; }
.automateContainer .titleBar .title {   font-size: 20px;font-weight: bold;color:#1179F7}
.automateContainer .rightContainer .working {text-align: center; margin-top: 28px;}
.automateContainer .rightContainer .working i {margin-right: 10px;}
.automateContainer table {width: 100%;border-spacing:0px}
.automateContainer table .label { /*min-width: 120px;*/font-weight: bold; text-align: left; padding:7px;border-bottom: 2px solid lightgray;}
.automateContainer table .labelTop {vertical-align: top;}
.automateContainer table .val { padding: 7px; text-align: left;border-bottom: 2px solid lightgray;word-break: break-all;}


.templateContainer {    height: 65vh;   border: 2px solid #777;border-radius: 10px;margin: 50px;overflow: hidden;margin-bottom: 0px;    display: flex; flex-direction: row;}
.templateContainer .column {   overflow-y: scroll;overflow-x: hidden; padding: 0 15px 10px 15px;}
.templateContainer .column1 {  flex: 35%;border-right: 1px solid #777;}
.templateContainer .column2 {   flex: 35%;border-right: 1px solid #777;}
.templateContainer .column3 {  flex: 22%;}
.addEditTemplate .buttons { display: flex; align-items: center;justify-content: center;}
.addEditTemplate .buttons button { margin: 15px; width: 20%;  height: 35px;}
.addEditTemplate .title {padding: 8px 0px; margin-top: 10px;}
.addEditTemplate .title p { font-weight: bold;font-size: 20px;  margin: 0;}
.addEditTemplate .title button {height: 25px;    padding: 0 10px;margin-top: 10px;}
.addEditTemplate .formGroup {margin-top: 10px;font-size: 13px;}
.addEditTemplate .formGroup .blockLabel {font-weight: bold;display: block;margin-top: 4px;}
.addEditTemplate .formGroup .inline {display: flex;  align-items: center;justify-content: left}
.addEditTemplate .formGroup .inline label {  font-weight: bold;margin-right: 10px;}
.addEditTemplate .formGroup .inline input { height: 15px;  width: 15px;}
.addEditTemplate .formGroup input,.addEditTemplate .formGroup textarea,.addEditTemplate .formGroup select {  margin-top: 4px;width: 100%;}
.addEditTemplate .formGroup input,.addEditTemplate .formGroup select {height: 30px;}
.addEditTemplate .formGroup textarea { font-family: Arial, Helvetica, sans-serif;}
.addEditTemplate .formGroup .invalid {   color: red; margin-top: 2px;font-size:12px;}
.addEditTemplate .cloneText {  font-size: 12px;margin-left: 10px;}
.addEditTemplate .dealers {  height: 70px;}
.addEditTemplate .cloneButtonContainer {  display: flex; justify-content: space-between;margin-top: 4px;flex-direction: row-reverse;align-items: center;}
.addEditTemplate .cloneButtonContainer button {  height: 25px; padding: 0 15px;}
.addEditTemplate .dealerSelected {font-style: italic;    font-size: 12px;}

.ascentPageImg{width:65%;margin:10px auto;display: block;}


.changeRetailer .lists{ margin:20px 0px 0px 20px;}
.changeRetailer .searchBar {  position:relative; display: flex;justify-content: flex-end;margin:20px 10px;}
.changeRetailer .searchBar .inputText{ padding: 0px 10px; height: 30px;border:2px solid grey;border-radius:30px;background-color: rgba(8, 0, 255, 0);}
.changeRetailer .searchBar .searchSubmit{background: rgba(0,0,0,0);border: none;cursor: pointer;padding: 0;position: absolute; top:0;bottom:0; right: 8px; color: grey;}
.changeRetailer .searchBar .searchSubmit i { font-size: 16px;}
.changeRetailer .searchBar .clearButton{background: rgba(0,0,0,0);border: none;cursor: pointer;padding: 0;position: absolute;top:0;bottom:0;right: 30px;}
.changeRetailer .searchBar .clearButton i { color: lightgray;font-size: 16px;}
.changeRetailer .lists .grid-container {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-column-gap:20px;}
.changeRetailer .lists .border{border-top: 1px solid grey; }
.changeRetailer .lists .grid-container .retail-header{/*height: 30px;*/  padding: 4px 0px; font-size: 0.9rem; border-right:1px solid grey;display:flex; }
.changeRetailer .lists .grid-container .retail-flex{ /*height: 30px; */padding: 4px 0px; font-size: 0.9rem; cursor: pointer;  border-right:1px solid grey;display:flex;}
.changeRetailer .lists .grid-container .retail-flex:hover{ color:#1179F7; font-weight: bold; }
.changeRetailer .lists .grid-container .retail-div1 {box-sizing: border-box;  width: 60px;   margin:10px;}
.changeRetailer .lists .grid-container .retail-div2 {box-sizing: border-box;width: 240px;  margin:10px;}
.changeRetailer .lists .grid-container .header{font-weight: bold;}
.changeRetailer .lists .grid-container .mobile{display: none;}


.createAnnouncement{ margin:30px;}
.createAnnouncement .maindiv{border:1px solid #777;border-radius:5px; margin-bottom: 15px;}
.createAnnouncement .maindiv .flex-container{display:flex;padding:7px 10px; border-bottom:1px solid lightgrey;}
.createAnnouncement .maindiv .grid-container{ display:grid;padding: 5px;grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid lightgrey;}
.createAnnouncement .maindiv .flex-container .flex-items{  flex:80%;  }
.createAnnouncement .distname, .createAnnouncement .retailname{ display:inline;}
.createAnnouncement .maindiv .grid-container .grid-items{  margin:5px;   }
.createAnnouncement .maindiv .grid-container .grid-items1{margin:5px;align-self: center;text-align: center;}
.createAnnouncement .maindiv .expand-div{padding:10px;border-bottom: 1px solid lightgrey;overflow-y: scroll; height: 22vh;}
.createAnnouncement .maindiv .expand-div .grid-retail{display:grid; padding: 5px; grid-template-columns: repeat(3, minmax(0, 1fr));}
.createAnnouncement .maindiv .inputText{ border:none; width:50%}
.createAnnouncement .maindiv .inputDate{width:95%;margin-top: 5px; height:30px;}
.createAnnouncement .maindiv .flex-container .btn-black{width: 100px;height: 15px;font-size: 13px; margin: 0px;padding: 5px;text-align: center;}
.createAnnouncement .maindiv .flex-container .inputText{ width:50%;border:none;}
.createAnnouncement .bold{font-weight: bold;margin-right: 5px;}
.createAnnouncement .maindiv .flex-container .unfocus{font-weight: bold; margin-right: 10px;color:lightgrey;}
.createAnnouncement .maindiv .flex-container .dark{ color:currentColor;}
.createAnnouncement .maindiv ul { list-style-type: none;}
.createAnnouncement .maindiv li{ padding:5px;}
.createAnnouncement .maindiv .flex-container .textarea{width:100%;border:none;}
.createAnnouncement .btn-blue{ width:20%;height:35px;margin:10px;}
.createAnnouncement  .btn-black{ width:20%;height:35px;margin:10px;}


.fixedoperations {width: 86%; margin: 0px auto;}
.fixedoperations * {   box-sizing: border-box;}
.fixedoperations .divider { font-size: 30px;display: flex;align-items: center;}
.fixedoperations .divider::before, .fixedoperations .divider::after {  flex: 1;content: '';  padding: 3px;background-color: #16a3dc;margin: 5px;}
.fixedoperations .column {float: left;width: 25%;padding: 0 0px;}
.fixedoperations .row:after {    content: "";display: table; clear: both;}
.fixedoperations .card { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);  padding: 16px;text-align: center;background-color: #fff;color: white;   margin: 8px;}
.fixedoperations .card img {border-radius: 4px;}
.fixedoperations *:before,.fixedoperations *:after {  box-sizing: inherit;}
.fixedoperations .info-section {padding: 50px;text-align: center;background-color: #fff;color: #474e5d;}
.fixedoperations .container {padding: 0 16px;}
.fixedoperations .container h4 {  color: #222;}
.fixedoperations .container::after, .fixedoperations .row::after {  content: "";clear: both;display: table;}
.fixedoperations .title { color: grey;}
.fixedoperations .anchor {cursor: pointer; color: blue;text-decoration: underline;}
.fixedoperations .button {border: none;outline: 0;  display: inline-block; padding: 8px;color: white;background-color: #16a3dc;  text-align: center;cursor: pointer;width: 94%;}
.fixedoperations .containerTab {margin-left: 6px;padding-bottom: 50px;padding-top: 20px}
.fixedoperations .containerTab img {border-radius: 6px;}
.fixedoperations .containerTab > ul > li {list-style-type: disc; margin-left: 16px;padding-top: 2px;}
.fixedoperations .containerTab > ul > li a {  color: blue;}
.fixedoperations .boulder {font-weight: 600;}
.fixedoperations .sub-li {margin-left: 50px !important;margin-top: 4px;}
.fixedoperations .sub-li-2 {margin-left: 100px !important;margin-top: 4px;}

.final-goals { width: 450px; margin: 0 auto; }
.final-goals img { object-fit: cover; width: 100%; }


.lovePromisePage .lp-logo-grid{margin:20px 0px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));}
.lovePromisePage .grid-item1{grid-column: span 2;align-self: center;}
.lovePromisePage .mainlogo{  height: auto;width: -webkit-fill-available;width: -moz-available;}
.lovePromisePage .logo{width:100%;height:100%; image-rendering: -webkit-optimize-contrast;}
.lovePromisePage .hr{height:20px;background-color: #16a3dc;border: none;}
.lovePromisePage .lp-text-summary{margin: 30px 0px;width:65%;transform: translate(27%, 0%);}
.lovePromisePage #lp-text-head{ font-weight: 800;font-size: 30px;line-height: 1.5;text-align: center;display:block;}
.lovePromisePage #lp-text{font-weight: 800;font-size: 20px;text-align: center;line-height: 1.5;display:block;}
.lovePromisePage .lp-links{margin:30px 0px;display:grid;grid-template-columns: repeat(4, minmax(0, 1fr));grid-column-gap: 60px;width:65%;transform: translate(27%, 0%);}
.lovePromisePage .lp-pillars{margin:50px 0px;display:grid;grid-template-columns: repeat(5, minmax(0, 1fr));grid-column-gap: 50px;width:80%;transform: translate(13%, 0%);}
.lovePromisePage .pillar-text{font-size: 13px;text-align: center;}
.lovePromisePage .calendar{width:90%;height:100%;transform: translate(6%, 0%);}
.lovePromisePage .align1{ height:30%;}
.lovePromisePage .button-links{margin-top:20px;}
.lovePromisePage .button{ background-color:#16a3dc; color:white;width:100%;height:35px;border: none;    }
.lovePromisePage .commit{width:50%;height:100%;image-rendering: -webkit-optimize-contrast;}
.lovePromisePage .lp-commit{display: flex;justify-content: center; margin-top:30px;}
.lovePromisePage ul{padding-left:35px;line-height: 1.5;}
.lovePromisePage li{list-style-type: disc;}
.lovePromisePage p{line-height: 1.5;}
.lovePromisePage .lp-award{margin:30px;margin-top:50px;}
.lovePromisePage .lp-event{margin:30px;margin-top:50px;}
.lovePromisePage .pillar-header-text{margin:30px;display:flex;justify-content: center; text-align: center;}
.lovePromisePage .pillar-heading{font-weight:800;font-size: larger;}
.lovePromisePage .pillar-detail{ margin:20px;}
.lovePromisePage .pillar-image{width:50%;}
.lovePromisePage .terracycle{width:10%;}
.lovePromisePage .sublist { margin-left: 20px; }
.lovePromisePage .sublist .dash { list-style-type: "-"; padding-left: 10px; }
.lovePromisePage fieldset { margin: 20px; padding: 10px 30px; width: fit-content; }
.lovePromisePage .link { margin-top: 7px; }

/*carousel styles*/
.lovePromisePage .carousel{ display:none;}
.lovePromisePage .lp-pillar-mb{ display: none;}

.createUser .flex-container {height: 70vh;border: 2px solid #777;border-radius: 10px;margin: 50px;overflow: hidden;margin-bottom: 0px;display: flex;flex-direction: row;}
.createUser .form .invalid {font-size: 12px;line-height: 24px;color: red;font-weight: 300;}
.createUser .flex-container #col-1 {padding: 20px;border-right: 1px solid #777;flex: 35%;overflow-y: scroll;overflow-x: hidden;}
.createUser .flex-container #col-2 { flex: 35%;padding: 15px;border-right: 1px solid #777;overflow-y: scroll;}
.createUser .flex-container #col-3 { flex: 22%; padding: 15px;}
.createUser .btn-blue {margin: 15px;width: 20%;height: 35px;}
.createUser .btn-black {margin: 15px; width: 20%; height: 35px;}
.createUser .flex-container .select { font-size: 13px; width: 100%; height:30px;}
.createUser .flex-container .inputText{font-size: 13px;width: 100%;height:30px}
.createUser .flex-container .table {width: 100%;}
.createUser .flex-container .table i{ cursor:pointer;}
.createUser .cfield-title {font-size: 13px;font-weight: bold;line-height: 24px;}
.createUser .tooltip {display: inline;}
.createUser .tooltiptext {width: 150px;background-color: grey;color: #fff;text-align: center;border-radius: 5px;padding: 5px 0;position: absolute; z-index: 1; top: 25px; left: -60px;}
.createUser .btn-disabled { background-color: #4a4949 !important; box-shadow: none !important; border: 1px solid #4a4949 !important;cursor:default; }
 
.userProfile .divflex {margin: 30px;display: flex;flex-direction: row;margin-bottom: 10px; border: 1px solid #777; border-radius: 5px; /* margin-top: 10px;*/}
.userProfile .divflex .div-col-1 {flex: 50%;padding: 20px;border-right: 1px solid #777;}
.userProfile .divflex .div-col-2 {flex: 50%;padding: 20px;}
.userProfile .divflex .div-col-2 .div-scroll {height: 575px;  overflow-y: scroll; /* width: 101.5%;*/}
.userProfile .table { width: 100%; border-spacing: 0 5px;}
.userProfile .table i {cursor: pointer;  font-size: 14px; }
.userProfile .btn-blue {margin: 15px;width: 20%;height: 35px;border: none;cursor: pointer;}
.userProfile .table-scheme { margin-top: -20px;width: 38%;}
.userProfile .btn-black { margin: 15px;width: 20%; height: 35px;}
.userProfile .divflex .cfield-title { font-size: 15px ;margin-bottom: 2px;font-weight: bold; line-height: 24px;}
.userProfile .divflex .cfield .inputText { height:30px;width: 100%;}
.userProfile .divflex .cfield .select { width:100%;height:30px;}
.userProfile .form .invalid {font-size: 12px;line-height: 24px;color: red;}
.userProfile .btn-disabled { background-color: #4a4949 !important; box-shadow: none !important; border: 1px solid #4a4949 !important;cursor:default;}
 
.calendarMain .calendar-header{font-family: Arial, Helvetica, sans-serif, sans-serif;margin: 30px auto;width: 90%;}
.calendarMain .datepicker{ position:absolute;top: 100px;left: 30px;background-color: white;z-index:10;box-shadow: rgba(100, 100, 111, 0.5) 0px 7px 29px 0px;}
.calendarMain .monthly-calendar{ z-index:0;}
.calendarMain .date{font-weight: 700; font-size: 18px;}
.calendarMain .calendar-topheader{display: flex;justify-content: space-between;margin: 0px 40px 0px 0px;}
.calendarMain .btn-new-event { background-color:#002469;color: white;box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);border: none;font-size: 14px;padding: 7px 14px;cursor: pointer;}
.calendarMain .btn-monthly-view, .calendarMain .btn-weekly-view, .calendarMain .btn-daily-view { border: none; border-right: .5px solid #000000; outline: none; padding: 7px 20px;background-color: transparent; cursor: pointer; }
.calendarMain .btn-daily-view {border-right:none;}
.calendarMain .buttons{ display: flex; }
.calendarMain .btn-group{display: inline-flex;margin-left: 20px;border: .5px solid #000000;}
.calendarMain button.clicked{font-weight: bold; color:#002469;}
.calendarMain .createEvent{position:absolute;top:0px;right:0px;border:2px solid #ccc; margin-right: -6px; background-color: white; z-index:11; width:70%; height:100%;overflow-y: auto; }
.calendarMain .details h4{background-color: #525252; padding: 5px;color: white;} 
.calendarMain .details p{  padding: 0px 20px;}
.calendarMain .eventinfo{ column-count: 2;margin: 10px;}
.calendarMain .eventinfo p:first-child { margin: 0;}
.calendarMain .btn-blue{width:100px; height:25px; margin:0px 20px}

.createEvent .flex{ display: flex;flex-direction: row; border-top:1px solid lightgray ; border-bottom:1px solid lightgray ;padding:10px;font-size: 15px;}
.createEvent .expand-div{ padding:10px;border: 1px solid lightgrey;overflow-y: scroll;height: 22vh;}
.createEvent .inputText{border:none;}
.createEvent .flex .flex1{ flex:80%}
.createEvent .flex .flex1 .showSelected{display: inline;}
.createEvent .inputDate{width:100%;height:30px;}
.createEvent .select{ width:100%;height:30px;}
.createEvent .textarea{width:100%;}
.createEvent .btn-blue{width:20%;height:30px;margin:10px;}
.createEvent .btn-black{width:20%; height:30px;margin:10px;}

.calendarMonthView{font-family: Arial, Helvetica, sans-serif;border: 1px solid #525252;margin: 50px;}
.calendarMonthView ul{ margin: 0;  padding: 0;  list-style: none;}
.calendarMonthView .monthdates{display: grid;grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: minmax(100px, 112px);}
.calendarMonthView li.days{display: inline-block;border-bottom: 1px solid #ccc;text-align: center;width: calc(100% / 7);padding: 10px 0;}
.calendarMonthView li.dates{border-left: 1px solid #ccc;border-bottom: 1px solid #ccc;padding-bottom: 100px;padding-top: 10px;}
.calendarMonthView .blue-date {color: white;background-color: #002469; padding: 5px 5px;border-radius: 50%;margin: auto 5px;width: 15%;}
.calendarMonthView li.grey-date{color:rgb(94, 94, 94);background-color: rgb(224, 224, 224) !important;}
.calendarMonthView li.blue-month{color:#002469;font-weight: bold;}
.calendarMonthView .blue-event{background-color: #002469;color: white; padding: 2px; text-align: center;font-size: 15px;margin:3px auto; border-radius: 12px;position: relative;}

.calendarWeekView{font-family: Arial, Helvetica, sans-serif;}
.calendarWeekView .weekdays {float:left;text-align: center;list-style: none; }
.calendarWeekView .timeList{/* height: 24px;*/height:30px;list-style-type: none; padding: 1px;}
.calendarWeekView .weekview {display: grid;grid-template-columns: repeat(7, minmax(0, 1fr)); text-align: center; width: 90%;margin-left: 5%;}
.calendarWeekView .times{list-style: none;/*height:22px;*/ height:30px; border:1px solid lightgray;}
.calendarWeekView .weektimeGrid{/* border: 1px solid black;*/display: grid;grid-template-columns: repeat(7, minmax(0, 1fr));text-align: center;width: 90%; margin-left: 5%;}
.calendarWeekView .timebox{ border-left:1px solid black; border-right:1px solid black;border-bottom:2px solid black;border-top:2px solid black}
.calendarWeekView  span.blue-date { color: white; background-color: #002469;padding: 5px 5px; border-radius: 50%;}
.calendarWeekView .blue-event{background-color: #002469;color: white; padding: 2px; text-align: center;font-size: 12px;position: relative; z-index: 1; border: 1px solid lightgray;}

.calendarDayView .timeList{/*height: 21.5px;*/height:27px;padding:1px;list-style-type: none;}
.calendarDayView .weekview {display: grid;grid-template-columns: 1fr;text-align: center;width: 90%; margin-left: 5%;border:1px solid black}
.calendarDayView .times{list-style: none;/* height:20px;*/height:28px;border-top:1px solid lightgray; }
.calendarDayView span.blue-date {color: white;background-color: #002469;padding: 5px 5px;border-radius: 50%;}
.calendarDayView .showtime{height:2px;background-color:red;}
.calendarDayView .blue-event{background-color: #002469;color: white;padding: 2px;text-align: center;font-size: 12px;position: relative;z-index: 1; border: 2px solid lightgray;}

.mobile-calendar{font-family: Arial, Helvetica, sans-serif, sans-serif;margin: 30px;width: 300px;}
.mobile-calendar .date{font-weight: 700; font-size: 16px;}
.mobile-calendar .calendar-topheader{display: flex;justify-content: space-between;margin-bottom: 20px;}
.mobile-calendar ul{margin: 0; padding: 0; list-style: none;}
.mobile-calendar li.days{ display: inline-block;text-align: center;width: calc(100% / 7);padding: 15px 0px;font-size: 14px;}
.mobile-calendar li.dates{display: inline-block;text-align: center;width: calc(100% / 7 - 1px); padding-bottom: 20px;padding-top: 10px;}
.mobile-calendar span.blue-date {color: white;background-color: #002469;padding: 8px 8px;border-radius: 50%;}
.mobile-calendar li.grey-date{color:rgb(94, 94, 94);background-color: rgb(224, 224, 224) !important;}
.mobile-calendar li.blue-month{ color:#002469; font-weight: bold; }


/*Report header Footer*/
.feedbackReportFooter .table {  width: 90%;margin: 30px auto;margin-bottom: 10px;}
.feedbackReportFooter .table th, .feedbackReportFooter .table td { border-width: 0;font-size: 13px;  padding: 10px;border: 1px solid #f1f1f1; text-align: left;}
.feedbackReportFooter .table th {color: black; text-align: left; text-align: center;}
.feedbackReportFooter .table th strong { color: red;}
.feedbackReportFooter .table th a { color: blue; cursor: pointer; text-decoration: underline;}
.feedbackReportFooter .table span {font-size: 14px; }
.vehicleDamageHeader .btn-blue {   width: 120px;height: 35px;}
.vehicleDamageHeader { float:right;margin:15px;}
.applicationStyleHeader .btn-blue { width: 120px;height: 35px;}
.applicationStyleHeader .right {float:right;  margin:15px;}
.createEnumHeader .btn-blue {width: 120px; height: 35px;}
.createEnumHeader .right {  float:right;  margin:15px}
.createAnnouncementHeader .btn-blue {    width: 120px; height: 35px;}
.createAnnouncementHeader .right { float:right; margin:15px}
.createPageHeader .btn-blue{ width: 120px; height: 35px;}
.createPageHeader .right {float:right; margin:15px;}
.dealerFeedbackHeader  .btn-blue { float: right; margin: 30px;width:200px;height:35px;}
.eomClaim .table td{ padding:5px;   border: 1px solid lightgray;}
.eomClaim .table th{     padding: 5px;border-right: 1px solid lightgray;border-left: 1px solid lightgray;}
.newColSettingReport .btn-blue { width: 120px; height: 35px;}
.newColSettingReport .right {   float:right;margin:15px;}
.newReportSettingHeader .btn-blue {     width: 120px; height: 35px;}
.newReportSettingHeader .right { float:right; margin:15px;}
.spParamHeaderReport .btn-blue {width: 120px; height: 35px;}
.spParamHeaderReport .right {   float:right;margin:15px}
.newsGalleryImageHeader .btn-blue { width: 120px;height: 35px;}
.newsGalleryImageHeader .right {   float:right; margin:15px;}
.newsGalleryImageHeader .btn-blue {width: 120px; height: 35px;}
.newsGalleryImageHeader .right{ float:right;margin:15px;}
.pendingDropship {width:80%; margin: 20px auto; border: 1px solid lightgray; padding: 0; border-spacing: 0; }
.pendingDropship tr { padding: 0; margin: 0; }
.pendingDropship td, .pendingDropship th { text-align: center; padding: 7px; margin: 0;border: 1px solid lightgray; }
.userProfileTemplate { display: flex; justify-content: right; padding: 10px; }
.userProfileTemplate button { height: 35px;}
.viewUserHeader .btn-blue {width: 120px;height: 35px;}
.viewUserHeader .right { float:right;margin:15px;}

/*Announcement info slider*/
.announcementInfo{margin:10px}
.announcementInfo .annHeader { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: .7em; margin:10px 0px 30px 0px; padding: 15px 0px 15px 0px; font-size: 1.1em;display:flex;flex-direction:row }
.announcementInfo .annHeader .annAction { margin:5px 0px; font-size: 1em; }
.announcementInfo .annHeader .annAction i { padding: 0px 10px; cursor: pointer;}
.announcementInfo .annDownload { width:150px }
.announcementInfo .annHeader .annAction .red {color:red}
.announcementInfo .annHeader .annTitle {margin:5px 0px;flex:50%}

/*Home Page*/
.partswidget { margin: 0 20px; }  
.partswidget .title { font-weight: bold; margin: 10px 0 0 5px; }
.partswidget .accrualItem { display: flex; align-items: center; margin-top: 10px; border-bottom: 2px dashed #ccc; margin-left: 20px; justify-content: space-between; padding-bottom: 4px; font-size: 15px; }
.partswidget .accrualItem .label { font-weight: bold; width: 130px; }

.partswidget2{ margin:10px;}
.partswidget2 .underline{text-decoration: underline;font-weight: bolder;}
.partswidget2 .bold{font-weight: bolder;margin:3px 0px;font-size: 15px;}
.partswidget2 .divs{margin-bottom: 10px;text-align: center;}
.partswidget2 .para{font-size:15px;}

.saleswidget{ margin:15px 0px 2px 15px;}
.saleswidget .displayflex{ display: flex;justify-content: center;margin-left: 10px;}
.saleswidget table{ margin:5px 0px;table-layout: fixed;border-spacing: 0; width:90%;font-size: .9em; line-height: 90%;}
.saleswidget table th,.saleswidget table td{padding:3px;border-bottom: 2px dashed lightgrey;}
.saleswidget table td{font-weight: bolder;text-align: right; font-size: 15px;}
.saleswidget b{color:#1179F7; text-decoration: underline; cursor: pointer;}

/*Boston Port*/
.vehicleHistory .vehHistory-table{ border-spacing: 0;margin-bottom:15px;margin-right:auto;margin-left:auto; width:50%;font-size: 14px;}
.vehicleHistory .vehHistory-table td{padding:5px;width:50%;border:1px solid lightgray;}
.vehicleHistory caption{color:red;padding-bottom:10px;}

.damageVehicle-details .table-striped {width: 90%;margin:10px auto;border: 2px solid #ddd;border-spacing: 0;}
.damageVehicle-details .table-striped td, .table-striped th{border-width: 0;font-size: 12px;padding: 5px;}
.damageVehicle-details .table-striped i {cursor: pointer;}
/*.damageVehicle-update .flex-row-container .label{ font-weight: bold;display:block; padding-bottom: 5px;}
.damageVehicle-update .flex-row-container .inputText{width:95%;height:25px}
.damageVehicle-update .flex-row-container .inputDate{ width:95%;height:25px}
.damageVehicle-update .submitContainer{ display: flex;justify-content: center;margin:10px auto}
.damageVehicle-update .submitContainer .btn-blue{width:20%;height:30px;margin:5px;}
.damageVehicle-update .submitContainer .btn-black{ width:20%;height:30px; margin:5px;}
.damageVehicle-update textarea{ width: 100%;}
.damageVehicle-update .failure{color: #721c24; background-color: #f8d7da;border-color: #f5c6cb;border-radius: 5px;padding : 10px;}
.damageVehicle-update .alert {color:#ff0000;margin:5px;}
.damageVehicle-update .alert-border {border: 1px solid #ff0000;}
.damageVehicle-update .flex-row-container {display: flex;align-items: flex-start;border:1px solid grey;border-radius: 4px;margin:5px}
.damageVehicle-update .flex-row-container .flex-row-item {margin:10px auto;width:95%}
.damageVehicle-update .flex-row-container .flex-row-item td{padding:5px;}*/
.damageVehicle-update .getInfo .getInfoSearch{display: flex;align-items: center;width:80%;margin:10px auto;}
.damageVehicle-update .getInfo .getInfoSearch label{font-weight: bold;}
.damageVehicle-update .getInfo .inputText{width:75%; height:35px;margin:10px 20px;}
.damageVehicle-update .getInfo .btn-blue{width:25%;height:35px}
.damageVehicle-update .grid-container{display:grid;grid-template-columns: repeat(4, minmax(0, 1fr));margin:10px auto;width:80%;grid-column-gap:40px;}
.damageVehicle-update .grid-container .grid-item1{width:100%;padding:10px 0px 5px 0px;;grid-column: span 2;align-self: flex-end;}
.damageVehicle-update .grid-container .grid-item2{width: 100%;padding: 10px 0px 5px 0px;;grid-column: span 1;align-self: flex-end;}
.damageVehicle-update .grid-container .inputText{width:100%;height:35px;}
.damageVehicle-update .grid-container .inputDate{width:100%;height:35px;}
.damageVehicle-update .grid-container label{font-weight: bold;}
.damageVehicle-update .submitContainer{ display: flex;justify-content: center;margin:10px auto}
.damageVehicle-update .submitContainer .btn-blue{width:20%;height:35px;margin:5px;}
.damageVehicle-update .submitContainer .btn-black{ width:20%;height:35px; margin:5px;}


.actualDelivery .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto 10px auto;}
.actualDelivery .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
.actualDelivery .form-inline .inputText {vertical-align: middle;margin: 5px;width:20%; height:35px}
.actualDelivery .form-inline .inputDate {vertical-align: middle;margin: 5px;width:20%; height:35px}
.actualDelivery .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.actualDelivery .error { color: red; margin: 0 0 0 130px; }


.loadLaneSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.loadLaneSearch .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
.loadLaneSearch .form-inline .inputText {vertical-align: middle;margin: 5px;width:20%; height:35px}
.loadLaneSearch .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.loadLaneSearch .form-inline .btn-black {margin: 5px;width: 20%;height: 35px; }

.editContractMiles{width:80%;margin:40px auto}
.editContractMiles .grid-container{ display: grid; grid-template-columns: 10px 2fr 2fr 2fr 2fr; column-gap: 15px; align-items: center;margin:20px 10px;}
 .editContractMiles .label{font-weight: bold;}
 .editContractMiles .inputText{width:100%;height:35px}
 .editContractMiles  .btn-blue{width:80%;height:35px}
 .editContractMiles .displayMobile{display:none}
 .editContractMiles .displayDesktop{display:block}
 .editContractMiles .textAlign{text-align: right;}

 .managedriver .divflex {margin: 40px auto;width:70%;  }
  .managedriver .divflex .grid-container{display: grid;grid-template-columns: repeat(2, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 30px auto;}
  .managedriver .divflex .grid-container .grid2 {grid-column: span 2; }
  .managedriver .divflex .grid-container .grid1 {grid-column: span 1;}
  .managedriver .divflex .grid-container .grid3 {grid-column: span 3;}
  .managedriver .divflex .grid-container .inputText{ width:100%; height:35px}
  .managedriver .divflex .grid-container .inputDate{ width:100%; height:35px}
  .managedriver .divflex .grid-container .select{  width:100%; height:35px}
  .managedriver .divflex .grid-container .label {font-size: 13px;font-weight: bold; line-height: 24px;}
  .managedriver .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .managedriver .btn-black {margin: 10px; width: 20%;height: 35px;}
  .managedriver .divflex .grid-container .invalid { font-size: 12px; line-height: 24px;  color: red;}
  .managedriver .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .managedriver .btn-black {margin: 10px; width: 20%;height: 35px;}

  .managetractor .divflex {margin: 40px auto;width:70%;  }
  .managetractor .divflex .grid-container{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 30px auto;}
  .managetractor .divflex .grid-container .grid2 {grid-column: span 2; }
  .managetractor .divflex .grid-container .grid1 {grid-column: span 1;}
  .managetractor .divflex .grid-container .grid3 {grid-column: span 3;}
  .managetractor .divflex .grid-container .inputText{ width:100%; height:35px}
  .managetractor .divflex .grid-container .inputDate{ width:100%; height:35px}
  .managetractor .divflex .grid-container .select{  width:100%; height:35px}
  .managetractor .divflex .grid-container .label {font-size: 13px;font-weight: bold; line-height: 24px;}
  .managetractor .divflex .grid-container .invalid { font-size: 12px; line-height: 24px;  color: red;}
  .managetractor .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .managetractor .btn-black {margin: 10px; width: 20%;height: 35px;}

  .managetrailer .divflex {margin: 40px auto;width:70%;  }
  .managetrailer .divflex .grid-container{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 30px auto;}
  .managetrailer .divflex .grid-container .grid2 {grid-column: span 2; }
  .managetrailer .divflex .grid-container .grid1 {grid-column: span 1;}
  .managetrailer .divflex .grid-container .grid3 {grid-column: span 3;}
  .managetrailer .divflex .grid-container .inputText{ width:100%; height:35px}
  .managetrailer .divflex .grid-container .inputDate{ width:100%; height:35px}
  .managetrailer .divflex .grid-container .select{  width:100%; height:35px}
  .managetrailer .divflex .grid-container .label {font-size: 13px;font-weight: bold; line-height: 24px;}
  .managetrailer .divflex .grid-container .invalid { font-size: 12px; line-height: 24px;  color: red;}
  .managetrailer .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .managetrailer .btn-black {margin: 10px; width: 20%;height: 35px;}

/*Navision*/
 
.accrualkeepscrapsearch .form-inline {display: flex;align-items: center;width: 90%; margin: 40px auto;}
.accrualkeepscrapsearch .form-inline label { margin: 5px ;font-size: 13px;font-weight: bold;line-height: 20px;}
.accrualkeepscrapsearch .form-inline .inputDate {vertical-align: middle;margin: 5px ;padding: 10px;width:20%; height:35px}
.accrualkeepscrapsearch .form-inline .btn-blue { margin: 10px; width: 20%; height: 35px;  }
.accrualkeepscrapsearch .form-inline .btn-black { margin: 10px; width: 20%; height: 35px;     }

.aimDashboradMonthly .form-inline { display: flex;align-items: center;width: 90%;margin: 40px auto;}
.aimDashboradMonthly .form-inline label {margin: 5px ;font-size: 15px;font-weight: bold; line-height: 20px;}
.aimDashboradMonthly .form-inline .select {vertical-align: middle;margin: 5px;width:20%;height:35px}
.aimDashboradMonthly .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.aimDashboradMonthly .form-inline .btn-black {margin: 5px;width: 20%;height: 35px;}


.accInquiry .form-inline { display: flex;align-items: center;width: 90%;margin: 40px auto;}
.accInquiry .form-inline label {margin: 5px ;font-size: 15px;font-weight: bold; line-height: 20px;}
.accInquiry .form-inline .inputText {vertical-align: middle;margin: 5px;width:20%;height:35px}
.accInquiry .form-inline .select {vertical-align: middle;margin: 5px;width:20%;height:35px}
.accInquiry .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.accInquiry .form-inline .btn-black {margin: 5px;width: 20%;height: 35px;}

.aimMonthlyOrder .form-inline {display: flex;align-items: center; width: 90%; margin: 40px auto;}
.aimMonthlyOrder .form-inline label { margin: 5px;font-size: 14px;font-weight: bold;line-height: 20px;}
.aimMonthlyOrder .form-inline .inputDate { vertical-align: middle;margin: 5px; padding: 10px; width:20%; height:35px}
.aimMonthlyOrder .form-inline .btn-blue { margin: 5px; width: 20%; height: 35px;  }
.aimMonthlyOrder .form-inline .btn-black {margin: 5px;width: 20%; height: 35px;     }
.aimMonthlyReturns .form-inline {display: flex; align-items: center;width: 90%; margin: 40px auto;}
.aimMonthlyReturns .form-inline label {margin: 5px;font-size: 14px;font-weight: bold;line-height: 20px;}
.aimMonthlyReturns .form-inline .inputDate { vertical-align: middle; margin: 5px;width:20%; height:35px}
.aimMonthlyReturns .form-inline .btn-blue {margin: 5px; width: 20%; height: 35px;  }
.aimMonthlyReturns .form-inline .btn-black {margin: 5px; width: 20%; height: 35px;}

.navisionFillRateContainer { margin: 40px auto }
.navisionFillRateContainer .header { text-align: center; padding: 4px 0;margin:20px; font-size: 20px;font-weight: bold;line-height: 20px; }
.navisionFillRateContainer .controls { display: flex; align-items: center; margin: 20px auto;width:90% } 
.navisionFillRateContainer .controls .dates { flex: 1.5; } 
.navisionFillRateContainer .controls .summary {  display: flex; align-items: center;margin:10px } 
.navisionFillRateContainer .controls .summary .label { font-weight: bold; } 
.navisionFillRateContainer .controls .summary label { margin-left: 6px; }
.navisionFillRateContainer .controls  .btns{display: flex; justify-content: center;flex:1} 
.navisionFillRateContainer .controls .btn-blue { height: 35px; width: 50%; margin: 5px }
.navisionFillRateContainer .controls .btn-black { height: 35px; width: 50%; margin: 5px }

.functionSaleSearch .form-inline {display: flex;align-items: center; width: 90%; margin: 40px auto;}
.functionSaleSearch .form-inline label { margin: 5px;font-size: 14px; font-weight: bold;line-height: 20px;}
.functionSaleSearch .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:20%;height:35px}
.functionSaleSearch .form-inline .btn-blue {margin: 5px; width: 20%; height: 35px;  }
.functionSaleSearch .form-inline .btn-black {margin: 5px; width: 20%;height: 35px;}

.inventoryValuationSearch .form-inline {display: flex;flex-flow: row wrap;align-items: center;width: 90%;margin: 40px auto;}
.inventoryValuationSearch .form-inline label {margin: 5px 10px 5px 0;font-size: 14px;font-weight: bold;line-height: 24px;} 
.inventoryValuationSearch .form-inline .inputDate {vertical-align: middle;margin: 5px 10px 5px 0;padding: 10px; width:20%; height:30px}
.inventoryValuationSearch .form-inline .btn-blue {margin: 10px;width: 20%;height: 35px;  }
.inventoryValuationSearch .form-inline .btn-black { margin: 10px;width: 20%; height: 35px;     }

.navisionFunctionCodeContainer { margin: 40px auto }
.navisionFunctionCodeContainer .header { text-align: center; padding: 4px 0; margin: 20px;font-size: 20px; font-weight: bold; line-height: 24px; }
.navisionFunctionCodeContainer .layout { display: flex; flex-direction: column; }
.navisionFunctionCodeContainer .controls { flex: 1;width:90%;margin:10px auto }
.navisionFunctionCodeContainer .controls .dates { margin-left: 5px; }
.navisionFunctionCodeContainer .controls .controlGroups { display: flex; flex: 1; margin-top: 10px;  }
.navisionFunctionCodeContainer .controls .controlGroups .controlGroup { display: flex; flex-direction: column; flex:1; margin-left: 10px; }
.navisionFunctionCodeContainer .controls label { font-weight: bold; }
.navisionFunctionCodeContainer .controls .select { width: 100%; margin-top: 5px; height: 220px; }
.navisionFunctionCodeContainer .controls span { font-size: 13px; }
.navisionFunctionCodeContainer .buttons { display: flex;  margin-top: 15px;justify-content: center; }
.navisionFunctionCodeContainer .buttons .btn-blue {  width: 20%; margin: 5px; height: 35px;}
.navisionFunctionCodeContainer .buttons .btn-black {  width: 20%; margin: 5px; height: 35px;}

  .navisionReportDateRangeContainer { margin: 40px auto }
  .navisionReportDateRangeContainer .header { text-align: center; padding: 4px 0;margin:20px; font-size: 20px;font-weight: bold;line-height: 24px; }
  .navisionReportDateRangeContainer .controls { display: flex; align-items: top; margin: 20px auto;width:90% } 
  .navisionReportDateRangeContainer .controls .dates { flex: 1.5; } 
  .navisionReportDateRangeContainer .controls .btns{display: flex;justify-content: center;flex:1;align-items:center}
  .navisionReportDateRangeContainer .controls .btn-blue { height: 35px; width: 50%; margin: 5px }
  .navisionReportDateRangeContainer .controls .btn-black { height: 35px; width: 50%; margin: 5px }

  /*.navisionReportMonthYearContainer {  margin: 40px auto }
  .navisionReportMonthYearContainer .header { text-align: center; padding: 4px 0;margin:20px; font-size: 20px;font-weight: bold;line-height: 24px; }
  .navisionReportMonthYearContainer form { display: flex; align-items: center; width: 90%; margin: 10px auto;}
  .navisionReportMonthYearContainer form .group { display: flex;flex:30%;margin:5px; align-items: center;  }
  .navisionReportMonthYearContainer form .group label {  margin-right: 5px; font-weight: bold; text-align: right; }
  .navisionReportMonthYearContainer form .group .select { height: 35px; width:100% }
  .navisionReportMonthYearContainer form .btn-blue { height: 35px; margin: 5px;width:20% }
  .navisionReportMonthYearContainer form .btn-black { height: 35px; margin: 5px; width:20% }*/

  .navisionReportTextInputContainer { margin: 40px auto;width: 90%; }
  .navisionReportTextInputContainer .header { text-align: center; padding: 4px 0;margin:20px; font-size: 20px;font-weight: bold;line-height: 24px; }
  .navisionReportTextInputContainer form { display: flex; align-items: center; margin:20px auto; } 
  .navisionReportTextInputContainer form  label {  font-size: 16px; font-weight: bold; margin: 5px; } 
  .navisionReportTextInputContainer form  .inputText { height: 35px; margin: 5px;width:40% } 
  .navisionReportTextInputContainer form .btn-blue { height: 35px; width: 20%; margin: 5px }
  .navisionReportTextInputContainer form .btn-black { height: 35px; width: 20%; margin: 5px }

  .partBinVelocity .form-inline {display: flex;align-items: center;width: 90%; margin: 40px auto;}
  .partBinVelocity .form-inline .inputs{ display: flex; align-items: center;flex:2}
  .partBinVelocity .form-inline .btns{display: flex;align-items: center;flex:1}
  .partBinVelocity .form-inline label { margin: 5px ;font-size: 14px;font-weight: bold;line-height: 21px;}
  .partBinVelocity .form-inline .inputDate {vertical-align: middle;margin: 5px; width:25%; height:35px}
  .partBinVelocity .form-inline .select {vertical-align: middle;margin: 5px ;width:20%; height:35px}
  .partBinVelocity .form-inline .btn-blue {margin: 5px; width: 50%; height: 35px;  }
  .partBinVelocity .form-inline .btn-black {margin: 5px;width: 50%;height: 35px; }

  .pickStatsSearch .form-inline {display: flex;align-items: center; width: 90%; margin: 40px auto;}
  .pickStatsSearch .form-inline label {margin: 5px ;font-size: 14px; font-weight: bold;line-height: 20px;}
  .pickStatsSearch .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:20%;height:35px}
  .pickStatsSearch .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
  .pickStatsSearch .form-inline .btn-black {margin: 5px;width: 20%;height: 35px;     }

  .referalLines .form-inline {display: flex;flex-flow: row wrap;align-items: center;width: 90%;margin: 40px auto;}
  .referalLines .form-inline label {margin: 5px 10px 5px 0;font-size: 13px;font-weight: bold;line-height: 24px;}
  .referalLines .form-inline .inputDate {vertical-align: middle; margin: 5px 10px 5px 0;padding: 10px;width:20%;height:30px }
  .referalLines .form-inline .btn-blue { margin: 10px; width: 20%; height: 35px;  }
  .referalLines .form-inline .btn-black { margin: 10px;width: 20%;height: 35px;     }

  .retailSummaryFreight .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
  .retailSummaryFreight .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
  .retailSummaryFreight .form-inline .inputDate {vertical-align: middle;margin: 5px;width:20%;height:35px}
  .retailSummaryFreight .form-inline .btn-blue { margin: 5px;width: 20%;height: 35px;  }
  .retailSummaryFreight .form-inline .btn-black {margin: 5px;width: 20%; height: 35px;     }

  .soaFreightSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
  .soaFreightSearch .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
  .soaFreightSearch .form-inline .inputDate {vertical-align: middle;margin: 5px;width:20%; height:35px}
  .soaFreightSearch .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
  .soaFreightSearch .form-inline .btn-black {margin: 5px;width: 20%;height: 35px; }


  .soaInvoiceLineSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
  .soaInvoiceLineSearch .form-inline label { margin: 5px;font-size: 15px;font-weight: bold; line-height: 20px;}
  .soaInvoiceLineSearch .form-inline .inputDate {vertical-align: middle;margin: 5px ; width:20%; height:35px}
  .soaInvoiceLineSearch .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
  .soaInvoiceLineSearch .form-inline .btn-black {margin: 5px;width: 20%;height: 35px; }

  .stdFreight .form-inline {display: flex;align-items: center; width: 90%;margin: 40px auto;}
.stdFreight .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
.stdFreight .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:20%;height:35px}
.stdFreight .form-inline .btn-blue {margin: 5px; width: 20%;height: 35px;  }
.stdFreight .form-inline .btn-black { margin: 5px;width: 20%;height: 35px;  }

.unfilledinSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.unfilledinSearch .form-inline label { margin: 5px;font-size: 15px;font-weight: bold;line-height: 20x;}
.unfilledinSearch .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:20%; height:35px}
.unfilledinSearch .form-inline .btn-blue { margin: 5px; width: 20%; height: 35px;  }
.unfilledinSearch .form-inline .btn-black {margin: 5px; width: 20%; height: 35px; }

.waybillSummary .form-inline { display: flex;align-items: center;width: 90%;margin: 40px auto;}
.waybillSummary .form-inline label { margin: 5px ;font-size: 15px;font-weight: bold;line-height: 20px;}
.waybillSummary .form-inline .inputDate {vertical-align: middle; margin: 5px;padding: 10px;width:20%; height:35px}
.waybillSummary .form-inline .btn-blue { margin: 5px; width: 20%; height: 35px;  }
.waybillSummary .form-inline .btn-black { margin: 5px; width: 20%;height: 35px;  }

.comSearchCode .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.comSearchCode .form-inline label {margin: 5px;font-size: 14px;font-weight: bold;line-height: 21px;}
.comSearchCode .form-inline .inputDate {vertical-align: middle;margin: 5px;width:20%;height:35px}
.comSearchCode .form-inline .btn-blue {margin: 5px; width: 20%;height: 35px;  }
.comSearchCode .form-inline .btn-black {margin: 5px;width: 20%;height: 35px; }


.rfScans .form-inline {display: flex;align-items: center;width: 96%;margin: 40px auto;flex-direction: column;}
.rfScans .form-inline .inputs{display: flex;align-items: center;width:100%;}
.rfScans .form-inline .btns{ display: flex; justify-content: center;width:100%; margin-top: 10px;}
.rfScans .form-inline label { margin: 5px ;font-size: 14px;font-weight: bold;line-height: 20px;text-align: center;}
.rfScans .form-inline .inputDate {vertical-align: middle;width:15%;height:30px}
.rfScans .form-inline .select {vertical-align: middle;margin: 5px;width:15%;height:30px}
.rfScans .form-inline .btn-blue {margin: 10px;width: 20%;height: 35px;  }
.rfScans .form-inline .btn-black {margin: 10px; width: 20%;height: 35px;  }

.comSaleSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.comSaleSearch  .form-inline label { margin: 5px;font-size: 14px;font-weight: bold;line-height: 20px;}
.comSaleSearch  .form-inline .inputDate {vertical-align: middle; margin: 5px ;width:20%;height:35px}
.comSaleSearch  .form-inline .btn-blue { margin: 5px;width: 20%; height: 35px;  }
.comSaleSearch  .form-inline .btn-black {margin: 5px; width: 20%;height: 35px;     }

.topPartSearch .form-inline {display: flex;align-items: center;width: 90%; margin: 40px auto;flex-direction: column;}
.topPartSearch .form-inline .inputs{display: flex; align-items: center;width:100% }
.topPartSearch .form-inline .btns{display: flex;justify-content: center; width:100%;margin-top:10px}
.topPartSearch .form-inline label { margin: 5px ;font-size: 14px;font-weight: bold;line-height: 20px;}
.topPartSearch .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:25%; height:30px}
.topPartSearch .form-inline .select {vertical-align: middle;margin: 5px;width:20%; height:30px}
.topPartSearch .form-inline .btn-blue { margin: 10px; width: 20%;height: 35px;  }
.topPartSearch .form-inline .btn-black { margin: 10px;width: 20%;height: 35px;}

.soldAccessoryCount .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.soldAccessoryCount .form-inline label { margin: 5px ;font-size: 15px;font-weight: bold;line-height: 20px;}
.soldAccessoryCount .form-inline .select {vertical-align: middle;margin: 5px;width:20%;height:35px}
.soldAccessoryCount .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.soldAccessoryCount .form-inline .btn-black {margin: 5px;width: 20%;height: 35px; } 

.modelByMonth .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.modelByMonth .form-inline label {margin: 5px ;font-size: 14px;font-weight: bold;line-height: 20px;}
.modelByMonth .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:20%; height:35px}
.modelByMonth .form-inline .btn-blue {margin: 5px;width: 20%;height: 35px;  }
.modelByMonth .form-inline .btn-black {margin: 5px;width: 20%;height: 35px;}

.managePartDetail { width: 80%; margin: 0px auto; }
.managePartDetail .header {width: 90%;margin: 30px auto;font-weight: bold;text-align: center;font-size: 18px;}
.managePartDetail .divflex {border-radius: 5px;}
.managePartDetail .divflex .grid-container{display: grid;grid-template-columns: repeat(4, 1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 15px auto; width: 90%;}
.managePartDetail .divflex .grid-container .grid2 {grid-column: span 2;}
.managePartDetail .divflex .grid-container .grid1 { grid-column: span 1;}
.managePartDetail .divflex .grid-container .textarea{ width:100%;height:90px;}
.managePartDetail .divflex .grid-container .inputText {width:100%; height:30px}
.managePartDetail .divflex .grid-container .inputDate{ width:100%;height:30px}
.managePartDetail .divflex .grid-container .select{ width:100%; height:30px}
.managePartDetail .divflex .grid-container .label {font-size: 13px;font-weight: bold;line-height: 24px;}
.managePartDetail .divflex .grid-container .label-check {font-size: 13px;font-weight: bold;line-height: 21px;}
.managePartDetail .btn-blue {margin: 10px;width: 25%; height: 35px;} 
.managePartDetail .btn-black {margin: 10px; width: 25%; height: 35px; }
.managePartDetail .divflex .grid-container .invalid {font-size: 12px;line-height: 24px;color: red; }
.managePartDetail .divflex .mt-10 { margin-top: 10px;}
.managePartDetail .divflex .info-header {margin-top: 14px; margin-bottom: 14px; padding: 10px; margin-left: -10px;border-radius: 4px; width: 100%;}
.managePartDetail .divflex .info-header span {font-size: 14px;font-weight: 600;}

.managePartDetailSearch .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.managePartDetailSearch .form-inline label {margin: 5px 10px 5px 0;font-size: 15px;font-weight: bold;line-height: 24px;}
.managePartDetailSearch .form-inline .inputText {vertical-align: middle;margin: 5px 10px 5px 0;padding: 10px;width:30%;height:35px}
.managePartDetailSearch .form-inline .btn-blue {margin: 10px;width: 16%;height: 35px;  }
.managePartDetailSearch .form-inline .btn-black {margin: 10px;width: 16%; height: 35px; }

.printinvoice .form-inline {display: flex;align-items: center; width: 90%;margin: 40px auto;}
.printinvoice .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
.printinvoice .form-inline .inputText {vertical-align: middle;margin: 5px ;width:26%;height:35px}
.printinvoice .form-inline .btn-blue { margin: 5px;width: 14%;height: 35px;  }
.printinvoice .form-inline .btn-black { margin: 5px;width: 14%;height: 35px;  }

.vehicletransactionhistorysearch .form-inline {    display: flex;flex-flow: row wrap;align-items: center;  margin-top: 50px;margin-left: 70px}
.vehicletransactionhistorysearch .form-inline label {  margin: 5px 10px 5px 0; font-weight: 600;}
.vehicletransactionhistorysearch .form-inline .inputText {vertical-align: middle; margin: 5px 10px 5px 0;height:35px;width: 30%;}
.vehicletransactionhistorysearch .form-inline .btn-blue { padding: 10px 20px;width: 14%;height: 35px;}
/*.form-inline .btn-blue:hover {background-color: #12439f;}*/
.vehicletransactionhistorysearch .form-inline .btn-black { margin: 10px;width: 14%;height: 35px; }
.vehicletransactionhistorysearch .vehicletransactionhistory .table {width: 85%;margin:20px auto;border-spacing: 0;}
.vehicletransactionhistorysearch .vehicletransactionhistory .table.table td, .vehicletransactionhistorysearch .vehicletransactionhistory .table.table th{border-width: 0;font-size: 13px;  padding: 7px;border: 1px solid lightgray;}
.vehicletransactionhistorysearch .vehicletransactionhistory .table-final {  width: 85%;margin:20px auto;border-spacing: 0;}
.vehicletransactionhistorysearch .table-final td, .table-final th{border-width: 0;font-size: 13px;  padding: 7px;border: 1px solid lightgray;}
.vehicletransactionhistorysearch .vehicletransactionhistory .mt-20 {margin-top: 20px;}
.vehicletransactionhistorysearch .vehicletransactionhistory .green {color: green;}
.vehicletransactionhistorysearch .vehicletransactionhistory .red {  color: red;}
.vehicletransactionhistorysearch .vehicletransactionhistory .boldText {font-weight: bold;}

.salesbydaterange .form-inline {display: flex;align-items: center; width: 90%;margin: 40px auto;}
.salesbydaterange .form-inline label {margin: 5px;font-size: 15px;font-weight: bold;line-height: 20px;}
.salesbydaterange .form-inline .inputDate {vertical-align: middle;margin: 5px ;width:18%;height:35px}
.salesbydaterange .form-inline .select {margin: 5px; width: 18%;height: 35px;  }
.salesbydaterange .form-inline .btn-blue { margin: 5px;width: 14%;height: 35px;  }
.salesbydaterange .form-inline .btn-black { margin: 5px;width: 14%;height: 35px;  }

.vehicleInventoryStatus {padding-bottom: 20px;}
.vehicleInventoryStatus .table1 ,.vehicleInventoryStatus .table2 {width:50%;margin:20px auto;border-spacing: 0;}
.vehicleInventoryStatus .table2 td, .vehicleInventoryStatus .table2 th{border-width: 0;font-size: 14px; font-weight: 600; padding: 7px;border-bottom: 1px solid lightgray;}
.vehicleInventoryStatus .table2 span { font-weight: 300; }
.vehicleInventoryStatus .table1 h5 { color: #1179f7; font-size: 16px;}
.vehicleInventoryStatus .table2 .mttDraftted { color: red }
.vehicleInventoryStatus .table2 .other-b { color: #1179f7;}

.portArrival .form-inline {display: flex;flex-flow: row wrap;align-items: center;width: 90%;margin: 40px auto;}
.portArrival .form-inline label {margin: 5px 10px 5px 0;font-size: 13px;font-weight: bold;line-height: 24px;}
.portArrival .form-inline .inputText {vertical-align: middle; margin: 5px 10px 5px 0;padding: 10px;width:20%;height:35px }
.portArrival .form-inline .btn-blue { margin: 5px; width: 20%; height: 35px; }
.portArrival .form-inline .btn-black { margin: 5px;width: 20%;height: 35px; }

.miscArrivalDates { width: 50%; margin: 20px auto 0 auto; }
.miscArrivalDates .title { font-weight: bold; font-size: 20px; text-align: center;}
.miscArrivalDates .container { margin-top: 20px; padding-top: 10px;  }
.miscArrivalDates .row label { flex: 0 100px; font-weight: bold; margin-right: 10px; } 
.miscArrivalDates .row .inputDate { flex: 1; height: 35px;width:100%;margin:10px auto }  
.miscArrivalDates .vinTitle { display: flex; align-items: center; padding-bottom: 10px;  }  
.miscArrivalDates .vinTitle div { font-weight: bold;margin-right: 10px;}  
.miscArrivalDates .vinTitle i { font-size: 20px; color: #1179F7; cursor: pointer; } 
.miscArrivalDates .vinContainer { display: flex; flex-direction: column; }
.miscArrivalDates .vinContainer .vinRow { display: flex; margin-top: 10px; align-items: center;}
.miscArrivalDates .vinContainer .vinRow label { flex: 0 10px; margin-right: 5px; }
.miscArrivalDates .vinContainer .vinRow .inputText { flex: 1; height: 35px; }
.miscArrivalDates .vinContainer .vinRow a { flex: 0 10px; margin-left: 10px;;}
.miscArrivalDates .error { color: red; margin-top: 10px; }
.miscArrivalDates .submitContainer { display:flex;justify-content: center; margin-top: 20px;  }
.miscArrivalDates .submitContainer .btn-blue { height: 35px; width: 50%; margin-right:5px}
.miscArrivalDates .submitContainer .btn-black { height: 35px; width: 50%; margin-left:5px}



.driverPayContainer { width: 60%; margin: 0 auto; }
.driverPayContainer .container{border:2px solid lightgray; padding: 20px; margin-top: 30px;}
.driverPayContainer .title { margin-top: 30px; font-size: 20px; font-weight: bold; text-align: center; }
.driverPayContainer .heading{font-weight: bold;color:#1179f7 ;font-size: 20px; padding: 0 4px;}
.driverPayContainer fieldset { padding-top: 20px; margin-top: 20px; }
.driverPayContainer fieldset legend { font-weight: bold; padding: 0 4px; }
.driverPayContainer .buttons { display: flex; /*align-items: center; margin-left: 20px; justify-content: space-evenly;*/ }
.driverPayContainer .dates { margin: 10px 5px; } 
.driverPayContainer .btn-black { height: 35px;flex:1 ;margin:10px }
.driverPayContainer .options { display: flex; justify-content: space-evenly; border: 2px solid lightgrey; }
.driverPayContainer .selects { display: flex; margin:15px auto;/*align-items: center; justify-content: space-evenly; */}
.driverPayContainer .selects  .selectGroup { display: flex; align-items: center;width:50%;margin:auto 5px; }
.driverPayContainer .selects label { font-weight: bold;flex:1;margin:5px; }
.driverPayContainer .selects .select { height: 35px; width: 75%;margin:5px; }
.driverPayContainer .submit { text-align: center; margin-top: 20px; }
.driverPayContainer .submit .btn-blue { width: 50%;height:35px; }

.retailDiscrepancy { width: 60%;margin:20px auto }
.retailDiscrepancy .title { font-weight: bold; text-align: center; }
.retailDiscrepancy .titleTop { font-size: 20px; line-height: 24px; }
.retailDiscrepancy .info { margin-top: 20px; display: grid; grid-template-columns: 1fr 2fr; row-gap: 16px; align-items: center;}
.retailDiscrepancy .info span { text-align: right; margin-right: 6px; }
.retailDiscrepancy .bold{font-weight: bold;}
.retailDiscrepancy .info .infoItem { margin-top: 6px; }
.retailDiscrepancy .reason { margin-top: 20px; }
.retailDiscrepancy .reason .textarea { font-size: 18px; margin-top: 6px; width: 100%;}
.retailDiscrepancy .enteredBy { margin-top: 20px; display: flex; align-items: center; }
.retailDiscrepancy .enteredBy .inputText { font-size: 18px; margin-left: 6px; flex: 1; height: 30px; }
.retailDiscrepancy .buttons { margin-top: 20px; display: flex; align-items: center; justify-content: center; }
.retailDiscrepancy .buttons button { margin: 10px; height: 35px; width: 20%; }
.retailDiscrepancy .blue { color: #1179f7 }
.retailDiscrepancy .red { color: red; }
.retailDiscrepancy .error { font-size: 14px; margin: 4px 0 0 4px; text-align: right; }

.etaUpdate .form-inline {display: flex;align-items: center;width: 90%;margin: 40px auto;}
.etaUpdate .form-inline label {margin: 5px ;font-size: 15px;font-weight: bold;line-height: 16px;}
.etaUpdate .form-inline .inputDate {vertical-align: middle;margin: 5px ;  width:25%; height:35px}
.etaUpdate .form-inline .select {vertical-align: middle; margin: 5px ;width:25%; height:35px;}
.etaUpdate .form-inline .btn-blue { margin: 5px;width: 25%;height: 35px; }

.postedAimCredits .form-inline { display: flex;align-items: center;width: 90%;margin: 40px auto;}
  .postedAimCredits .form-inline label { margin: 5px 10px 5px 0; font-size: 13px;font-weight: bold; line-height: 24px;}
  .postedAimCredits .form-inline .inputDate {vertical-align: middle;margin: 5px 10px 5px 0;  padding: 10px;width:20%;height:35px}
  .postedAimCredits .form-inline .btn-blue {margin: 10px; width: 20%;height: 35px;  }
  .postedAimCredits .form-inline .btn-black {margin: 10px;width: 20%;height: 35px;  }

  .noradPoUnpackingList .form-inline {display: flex; flex-flow: row wrap;align-items: center;width: 90%;margin: 40px auto;}
  .noradPoUnpackingList .form-inline label {margin: 5px 10px 5px 0; font-size: 15px;font-weight: bold;line-height: 24px;}
  .noradPoUnpackingList .form-inline .inputText {vertical-align: middle;margin: 5px 10px 5px 0; padding: 10px;width:20%;height:35px}
  .noradPoUnpackingList .form-inline .btn-blue {margin: 10px;width: 20%;height: 35px;  }
  .noradPoUnpackingList .form-inline .btn-black { margin: 10px;width: 20%;height: 35px; }

  /*.shippingInfoNotAtPortHeader .divTable{ display: table;width: 50%; text-align: center; margin:0 auto;}
.shippingInfoNotAtPortHeader .divTableRow { display: table-row;}
.shippingInfoNotAtPortHeader .divTableHeading {background-color: #ffffff;display: table-header-group;}
.shippingInfoNotAtPortHeader .divTableCell,.shippingInfoNotAtPortHeader .divTableHead {border: 1px solid lightgray;display: table-cell;padding: 5px;}
.shippingInfoNotAtPortHeader .divTableHeading {background-color: #ffffff;display: table-header-group;font-weight: bold;}
.shippingInfoNotAtPortHeader .divTableBody { display: table-row-group;}*/

.shippingInfoNotAtPortHeader {width:90% ;margin:20px auto}
  .shippingInfoNotAtPortHeader .grid{display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 50px;}
  .shippingInfoNotAtPortHeader .flex{ display: flex;border-bottom: 2px solid lightgray;}
  .shippingInfoNotAtPortHeader .key{font-weight: bold;padding:5px;flex:1;font-size: 13px;}
  .shippingInfoNotAtPortHeader .value{padding:5px; flex:1;text-align: center;font-size: 13px;}

.shipmentInformationHeader{width:90% ;margin:20px auto}
  .shipmentInformationHeader .grid{display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 50px;}
  .shipmentInformationHeader .flex{ display: flex;border-bottom: 2px solid lightgray;}
  .shipmentInformationHeader .key{font-weight: bold;padding:5px;flex:1;font-size: 13px;}
  .shipmentInformationHeader .value{padding:5px; flex:1;text-align: center;font-size: 13px;}

  .salestoSoaHeader .table {width:50%;margin:20px auto;border-spacing: 0;}
.salestoSoaHeader .table.table td,.salestoSoaHeader .table.table th{border-width: 0;font-size: 13px;  padding: 7px;border: 1px solid lightgray;}
.salestoSoaHeader .table a {cursor: pointer; color:#1179F7;text-decoration-line: underline;}


.manageSuggestedLines{Margin:15px;}
  .manageSuggestedLines .header {height: 12px;padding: 10px 0px;margin-top: 10px;/* box-shadow: 0px 0px 10px #666; */}
  .manageSuggestedLines .header >span {font-weight: bold;} 
  .manageSuggestedLines .divflex {border-radius: 5px;}
  .manageSuggestedLines .divflex .grid-container{display: grid;grid-template-columns: 1fr;grid-row-gap:15px;margin: 30px auto;margin-top: 10px;}
  .manageSuggestedLines .divflex .grid-container .inputText {width:100%; height:30px}
  .manageSuggestedLines .divflex .grid-container .label {font-size: 13px;font-weight: bold;line-height: 24px;}
  .manageSuggestedLines .btn-blue {margin-right: 10px;width: 50%; height: 35px;} 
  .manageSuggestedLines .btn-black {margin-left: 10px; width: 50%; height: 35px; }
  .manageSuggestedLines .divflex .grid-container .invalid {font-size: 12px;line-height: 24px;color: red; }

  .manageStdParts{margin:20px 40px ;}
  .manageStdParts .grid-container1{display:grid;grid-template-columns: repeat(2, minmax(0, 1fr));grid-column-gap:20px;margin:10px auto;width:95%}
  .manageStdParts .grid-container1 .grid1{grid-column: span 1;}
  .manageStdParts .inputGroup{margin:10px auto}
  .manageStdParts .label{font-weight: bold;}
  .manageStdParts .flex{display: flex;}
  .manageStdParts .alert{color:red;margin:5px auto}
  .manageStdParts .grid-container2{display: grid;grid-template-columns: 1fr 1fr 50px; grid-column-gap: 20px;grid-row-gap:10px;align-items: center;margin:10px auto}
  .manageStdParts .grid-container2 .grid1{text-align: center;}
  .manageStdParts .flex-btns{display: flex;justify-content: center;margin:20px auto}
  .manageStdParts .inputText{height:30px;width:100%}
  .manageStdParts .btn-blue{height:30px;width:50%;}
  .manageStdParts .flex-btns .btn-blue{height:30px;width:30%;margin-right:10px}
  .manageStdParts .flex-btns .btn-black{height:30px;width:30%;margin-left:10px}

  .mutualExclusive{width:70%;margin:40px auto;}
  .mutualExclusive .grid-container{display: grid;grid-template-columns: repeat(2, 1fr);grid-column-gap: 50px;grid-row-gap: 5px;margin: 10px auto;border:2px solid lightgrey;padding:7px}
  /*.mutualExclusive .grid-container2{display: grid;grid-template-columns: 10px 1fr 1fr 10px;grid-column-gap: 15px;grid-row-gap: 10px;margin: 10px auto;align-self: center;}*/
  .mutualExclusive .grid-container .grid-item1{align-self:center}
  .mutualExclusive .desc{border:none; width:100%; height:35px}
  .mutualExclusive  .inputText{ width:100%; height:35px;border: 1px solid lightgrey;}
  .mutualExclusive  .inputDate{ width:100%; height:35px}
  .mutualExclusive  .select{  width:100%; height:35px}
  .mutualExclusive  .label {font-size: 13px;font-weight: bold; line-height: 24px;}
  .mutualExclusive .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .mutualExclusive .btn-black {margin: 10px; width: 20%;height: 35px;}
  .mutualExclusive .error{  margin: 5px;color: red;}
  .mutualExclusive .table{width:100%;border-spacing: 0;border: 2px solid lightgray;margin:15px auto;border-bottom: none;}
  .mutualExclusive .table .header{background-color: #F6F6F6;}
  .mutualExclusive .table th, .mutualExclusive .table td{padding: 10px;border-bottom: 2px solid lightgray;}

  .requiredParts{width:70%;margin:40px auto;}
  .requiredParts .grid-container{display: grid;grid-template-columns: repeat(1fr);grid-column-gap: 15px;grid-row-gap: 5px;margin: 15px auto;}
  /*.requiredParts .grid-container2{display: grid;grid-template-columns: 10px 1fr 1fr 1fr 10px;grid-column-gap: 15px;grid-row-gap: 10px;margin: 10px auto;align-self: center;}
  .requiredParts .grid-container2 .grid-item1{align-self:flex-start}*/
  .requiredParts  .inputText{ width:100%; height:35px;border: 1px solid lightgrey;}
  .requiredParts  .inputDate{ width:100%; height:35px}
  .requiredParts  .select{  width:100%; height:35px}
  .requiredParts  .label {font-size: 13px;font-weight: bold; line-height: 24px;}
  .requiredParts .btn-blue { margin: 10px;   width: 20%;height: 35px;}   
  .requiredParts .btn-black {margin: 10px; width: 20%;height: 35px;}
  .requiredParts .error{    margin: 10px;color: red;}
  .requiredParts .alignCenter{align-self: center;}
  .requiredParts .table{width:100%;border-spacing: 0;border: 2px solid lightgray;margin:15px auto;border-bottom: none;}
  .requiredParts .table .header{background-color: #F6F6F6;}
  .requiredParts .table th, .requiredParts .table td{padding: 10px;border-bottom: 2px solid lightgray;}


/* START - Vehicle Delivery Receipt*/
.vehicleDeliveryReceipt{width: 90%;margin: 0 auto;font-size: 14px;}
.vehicleDeliveryReceipt .header {display: flex;justify-content: space-between;align-items: flex-start;}
.vehicleDeliveryReceipt .header .logos{display: flex;justify-content: flex-start;}
.vehicleDeliveryReceipt .header .logos .subaruLogo {margin-top:12px;margin-right:12px;}
.vehicleDeliveryReceipt .header .logos .subaruLogo img {width:80px;}
.vehicleDeliveryReceipt .header .logos .bostonPort h2{color: red;}
.vehicleDeliveryReceipt .header .logos .bostonPort p{margin-top: -10px;}
.vehicleDeliveryReceipt .subheader {display: flex;justify-content: space-between;gap: 10px;}
.vehicleDeliveryReceipt table{width: 100%;border-collapse: collapse;border-top: 1px solid #666666;border-right: 1px solid #666666; table-layout: auto;}
.vehicleDeliveryReceipt table .table-item{    border-left: 1px solid #666666;border-bottom: 1px solid #666666;text-align:left; padding-left:4px; padding-top:7px; padding-bottom:7px;}
.vehicleDeliveryReceipt table td.remarks{height: 112px; vertical-align: top;}
.vehicleDeliveryReceipt .footer{margin-top: 30px;}
.vehicleDeliveryReceipt .footer .signatures {    display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 10px;}
.vehicleDeliveryReceipt .footer .signatures .signature {display: flex;align-items: center;margin-bottom:10px;}
.vehicleDeliveryReceipt .footer .signatures .signature .signature-line {flex-grow: 1;border-top: 1px solid #666666;margin-left: 10px;}
.vehicleDeliveryReceipt .removeSapce{margin:0;}
.vehicleDeliveryReceipt .removeSapceBottom{margin-bottom:0;}
.vehicleDeliveryReceipt .addSapceRight{margin-right:140px;}
.vehicleDeliveryReceipt .fontSizeLoad{font-size: 20px; color: red;}
/*::-webkit-scrollbar {width: 6px;}
::-webkit-scrollbar:horizontal {height: 6px;}
::-webkit-scrollbar-track {    background: #f1f1f1;}
::-webkit-scrollbar-thumb {    background: #00205b;}*/
.vehicleDeliveryReceipt .alignCellTitle{vertical-align:top;text-align:left;padding:1px;}
@media print{
  .vehicleDeliveryReceipt{width: 100%;}
  .vehicleDeliveryReceipt table .table-item{font-size: 12px;}
  .vehicleDeliveryReceipt table td.remarks{height: 80px; vertical-align: top;}
   #numbers, #vinkey, #desc, #colorcode, #alloc, #location {font-size: 18px;}
  ::-webkit-scrollbar{display: none;} 
  .pagebreak{page-break-after: always;} 
  .fa-chevron-left:before{display: none;}

  .partOrder .partflex {  display: flex;flex-direction: column-reverse;}
  .partOrder .partflex .flex1 .partsContainer {page-break-inside: avoid;}
  .partOrder .partsContainer .partstable td {padding: 0px;white-space: nowrap;font-size: .7rem;border-top: none;}
  .partOrder .partsContainer .partstable td.printRightPadding{padding-right: 10px;}
  

  .vehicleDrilldown .textBlue{color:black}
  .vehicleDrilldown .textRed{color:black}
  .vehicleStatus{page-break-inside: avoid;font-size: .8rem;}
  .vehicleOwner {page-break-inside: avoid;font-size: .8rem;}
  .vehicleDealer {page-break-inside: avoid;font-size: .8rem;}
  .vehicleDetails {page-break-inside: avoid;font-size: .8rem;}
  .VehicleSales .table-striped{page-break-inside: avoid;white-space: nowrap; font-size: .8rem;}
  .VehicleSales .table-striped th,  .VehicleSales .table-striped td{ padding: 0px;}
  .VehicleSales .table-striped td.printRightPadding{padding-right: 10px;}

  .genericInvoice #inner{color:black}
  .genericInvoice .genInvoice-table1 table, .genericInvoice .genInvoice-table2 table{font-size: .7rem;}
  .genericInvoice .genInvoice-table3{font-size: .7rem;width:100%}
  .genericInvoice .table3Div{page-break-inside: avoid;}

  
  .partInvoice .table3Div{page-break-inside: avoid;}

  .vehicleInvoice .showInvoiceInfo{page-break-after: always; font-size: .7rem;zoom: 0.75; -moz-transform: scale(0.75);}
  .vehicleInvoice .showInvoiceInfo .table2 th, .vehicleInvoice .showInvoiceInfo .table2 td { padding: 0px; border-bottom: 0px solid lightgrey; white-space: nowrap; }
  .vehicleInvoice .showInvoiceInfo .table-striped th, .vehicleInvoice .showInvoiceInfo .table-striped td {padding: 0px; white-space: nowrap;}
  .vehicleInvoice .showInvoiceInfo .table-striped td.redText{color:black}

  /* User Feedback*/
  .userFeedback .feedback-table .printSubject{display: block; border: 2px solid lightgray;margin-left:5px;width:99%}
  .userFeedback .feedback-table .inputText{display:none}
  .userFeedback .btn-blue{display:none}
  .userFeedback .maxFileLabel{display:none}
  .userFeedback .feedback-table .flex-container .flexCol1 .btn-blue{display:block}
  .angular-editor-toolbar{display: none;}
  .angular-editor  .angular-editor-wrapper.show-placeholder .angular-editor-placeholder { display: none;}
  .angular-editor .angular-editor-wrapper .angular-editor-placeholder {display:none}
  
}


/*START - Vehcicle Delivery Search Form*/
.vehicleDeliveryForm .grid-container{display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); width:80%; grid-column-gap:10px; grid-row-gap: 15px;margin: 20px auto;}
.vehicleDeliveryForm .grid-container .grid1{grid-column: span 2; align-self: center;}
.vehicleDeliveryForm .grid-container .grid2{grid-column: span 3; align-self: center;}
.vehicleDeliveryForm .grid-container .grid3{grid-column: span 1; align-self: center; text-align: center;}
.vehicleDeliveryForm .grid-container .grid4{grid-column: span 3; align-self: center;}
.vehicleDeliveryForm .grid-container .grid5{grid-column: span 2; align-self: center;}
.vehicleDeliveryForm .grid-container .grid2 .inputText{width:100%; height:35px;}
.vehicleDeliveryForm .grid-container .grid4 .inputText{width:100%; height:35px;}
.vehicleDeliveryForm .grid-container .grid5 .btn-blue{width:100%; height:35px; margin:10px}


.masterList .grid-container{display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); width:80%; grid-column-gap:10px; grid-row-gap: 15px; margin: 20px auto}
.masterList .grid-container .grid1{grid-column: span 2; align-self: center;}
.masterList .grid-container .grid2{grid-column: span 3; align-self: center;}
.masterList .grid-container .grid3{grid-column: span 1; align-self: center; text-align: center;}
.masterList .grid-container .grid4{grid-column: span 3; align-self: center;}
.masterList .grid-container .grid5{grid-column: span 2; align-self: center;}
.masterList .grid-container .grid2 .inputText{width:100%; height:35px;}
.masterList .grid-container .grid4 .inputText{width:100%; height:35px;}
.masterList .grid-container .grid5 .btn-blue{width:100%; height:35px; margin:10px}







/********  Form Styles *******************/
ss-form {display:block; margin: 5px 10px 10px 10px;}
ss-form table{width:100%; display:inline-table;}
ss-form td {padding:5px 0;} 

ss-form .bold  {font-weight:bold;}
ss-form .right {float:right;}
ss-form .block {display:block}

ss-field, ss-text, ss-checkbox,ss-password,  ss-switch, ss-textarea, ss-select, ss-editor, ss-password{display:contents}

ss-text input, ss-password input, ss-textarea textarea, ss-select select{display:block; height: 30px; width:100%;}
ss-textarea textarea{ resize:none; height:unset; }



ss-switch   input   { display:inline-block; width:auto; height:auto; min-width: 15px;}
ss-checkbox input   { display:inline-block; width:auto; height:15px; width: 15px; vertical-align: middle;}
ss-checkbox {display:inline-block; vertical-align: middle;}

ss-form button.btn-blue { padding: 10px 50px;}
ss-form button.btn-blue:active { background-color: #00379e;}

/*****  Form Editor  ***********/
angular-editor {  display:block;  border: solid lightgrey 2px;}
angular-editor:focus-within{ outline: 2px solid black; border-radius: 2px;}
angular-editor div.angular-editor-textarea { outline: none; margin-top:0!important;}


/* on mobile devices, focus outline is orange. Is there a better way? DCardin*/
@media (pointer:none), (pointer:coarse) {  angular-editor:focus-within{  outline: 2px solid orange; }}



/******* Label *************/
ss-form label { font-size: 15px; font-weight: bold; line-height: 20px; padding-right: 5px;}
ss-form label.asterisk:after{ content: " *"; color: red; position: absolute; padding: 0 2px;}


/*****  Form Upload  ***********/
ss-upload{ margin-top: 10px; display: block;}
ss-upload label { line-height: 20px;}
ss-upload .flexCol2{flex:100%;border: 2px solid lightgrey;}
ss-upload .flex-container{display:flex;}
ss-upload i{ color:#1179F7; cursor: pointer;}
 

/********** List Component ******************/
ss-list .list-container{overflow-y: hidden; }

ss-list .list-item{height: 0px; white-space: nowrap; overflow-y:hidden;transition: height .2s;}
ss-list .list-item[open=true]{height: 34px;}
ss-list .list-item span{ display:inline-block;margin-right: 5px;}

ss-list button{ background: none; padding:0; border:none; color: #2d2d2d; cursor: pointer;}
ss-list button:active{color:#9a9a9a}

ss-list ss-text input, ss-list ss-textarea textarea, ss-list ss-select select, 
ss-list ss-editor{ display:inline-block; max-width: 300px;}


ss-list .list-item input, ss-list .list-item select {
  display:inline-block;
  max-width:300px;
  margin: 2px 5px 2px 0px;
}

ss-list .fa {display:none;cursor:pointer;}
ss-list .dynamic .fa {display:inline;}

/*********** Eyeball Menu **********************/
ss-eyeballitem {margin: 5px 0 5px 20px ;display: block;}
ss-eyeballitem .eyeball-folder{overflow-y:hidden; max-height: 0;}
ss-eyeballitem .eyeball-folder.show{ max-height:1000px; }
ss-eyeballitem .fa-eye{  padding: 1px; }
ss-eyeballitem .eyeball-toggle, ss-eyeballitem label{cursor:pointer;}
ss-eyeballitem input[type=checkbox] {display:none;} 
ss-eyeballmenu input{ display:inline-block; }
 


/********** ERROR HIGHLIGHTING ******************/

ss-form .submitted .ng-invalid{ border: solid #dd5454 2px;outline:none;}
ss-form error-msg { display: none;  font-size:14px;  color:#ff0000;  font-weight: 300;}
ss-form .submitted error-msg{ display:none;}
ss-form .submitted angular-editor.ng-invalid:focus-within{ outline: none;}

/** Styles for "Open in new window" functionality **/
.widgetPageSectionPopup  {margin:0px auto!important;position:static}

.widgetPageSectionPopup .fa-chevron-left {top:0;line-height: 30px;position:fixed;}
.widgetPageSectionPopup .fa-external-link-alt{display:none!important;}

.widgetPageSectionPopup [ss-widget]{top:30px;height:calc(100% - 30px)!important;}

.widgetPageSectionPopup header.printWidget {position:fixed;top:0;left:0;right:0;}
.widgetPageSectionPopup header.printWidget { flex: 0 0 auto; height: 1.1rem; background-color: #eee; font-size: 1.0rem; padding:8px 10px 5px 30px; line-height: 1rem; text-align: left; }
.widgetPageSectionPopup header.printWidget .title{ float:left; }
.widgetPageSectionPopup header.printWidget .setting { float:right;}
.widgetPageSectionPopup header.printWidget .settings { float: right; }
.widgetPageSectionPopup header.printWidget .setting ul, 
.widgetPageSectionPopup header.printWidget .settings { list-style-type: none; }
.widgetPageSectionPopup header.printWidget .setting li, 
.widgetPageSectionPopup header.printWidget .settings li { background-color:transparent !important; padding:2px 0px 2px 10px; display: inline;  cursor: pointer;font-size:0.7em}
.widgetPageSectionPopup header.printWidget ul {padding: 0px;margin: 0px;z-index:1;}
.widgetPageSectionPopup header.printWidget + section{ display:flex; border-top-left-radius: 0px; border-top-right-radius: 0px; justify-content: center; align-items: center; }


.widgetPageSectionPopup #PageWidget {width:100%;}