@import "CustomBootstrap.css";
#nav-icon1 {
  width: 2vw;
  height: 5vh;
  max-height: 50px;
  margin-right: 2vw;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}
#nav-icon1 span {
  display: inline;
  position: absolute;
  height: 0.75vh;
  max-height: 7.5px;
  width: 100%;
  background: crimson;
  border-radius: 15px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
div#InlineContent.Minified {
  height: 0;
}
#InlineContent>#inputArea>.container-fluid>.PageContent{
  width:600px;
}
#ReferenceInfoDetailInSpecForm {
  overflow: scroll;
}
div#ReferenceInfoDetailInSpecForm>.modal-dialog{
  left: 10%;
  position: absolute;
  margin-top: 2vh;
}
div#ReferenceInfoDetailInSpecForm>.modal-dialog>.modal-content {
  width:70vw;
}
#AllTaskRequestsForMyPriority>thead>tr>th{
  font-size: 1rem;
}
#nav-icon1 span:nth-child(1) {
  top: 10%
}
#nav-icon1 span:nth-child(2) {
  top: 40%
}
#nav-icon1 span:nth-child(3) {
  top: 70%
}
.mh-80vh {
  max-height: 80vh;
}
.autoScroll{
  overflow: scroll;
}
.disabled {
  pointer-events: none;
  cursor: default;
}
#nav-icon1.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
div#CustomInPutModal-Container {
  /*Moet hoger zijn dan de estimate form*/
  z-index: 1051;
}
.table-striped>thead>tr>th{
  cursor: pointer;
}
.bordered-dashed{
  border: 0.01vw dashed;
  padding: 0.5vw;
}
.modal-header {
  align-items: center;
  position: relative;
  flex-wrap: wrap;
  justify-content: space-between;
}
#recallListBtn {
  display: inline-block;
  margin-left: 50px;
  padding: 10px 10px;
  border: 1px solid black;
  border-radius: 5px;
  background-color: crimson;
  color: white;
}
#recallListBtn:hover {
  cursor: pointer;
  background-color: red;
}
.AlreadySelectedToChange {
  position: absolute;
  right: -16vw;
  width: 15vw;
  top: 0;
}
.row {
  margin: 0;
}
.AlreadySelectedToChange>button {
  max-width: 10vw;
}
#nav-icon1.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}
#nav-icon1.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.x-scroll-auto{
  overflow-x: auto;
}
.fr{
  float: right;
}
.margin-min{
  margin: 0.5vw;
}
.OverWriteNonModal-modal-body {
  max-height: 90vh;
  overflow-y: auto;
}
.OverWriteModal-modal-body {
  padding: 5px;
}
#EstimateDetail>.modal-dialog.modal-dialog-centered{
  max-width: 98%
}
#TitleHeaderEstimateForm > .close {
  opacity: 1;
}
pre.UserLog {
  max-height: 10vh;
  overflow-y: auto;
  max-width: 20vw;
}
.PageContent{
  width: 100vw;
  height: auto;
  float: left;
  top: 60px;
  text-align: center;
  background-color: #fff;
  position: relative;
}
.SideBarContent > div > .active {
  color: red;
}
#OverViewBufferModal {
  max-height: 95vh;
  overflow: hidden;
}
#OverViewBufferModal>.modal-dialog{
  max-width: 75vw;
}
.border-r-5{
  border-radius: 5px;
}
.c-red-fw600 {
  color: red;
  font-weight: 600;
}
.c-yellow-fw600 {
  color: yellow;
  font-weight: 600;
}
.close {
	opacity: 1;
	color: crimson;
}
.list-group-item-action:hover:not(.active),
.list-group-item-action:focus:not(.active) {
  background: #f8f8ff;
}
.list-group-item-action:hover > span, .list-group-item-action:focus > span {
  background: inherit;
  color: inherit;
}
/* NAVBAR */
nav.navbar.navbar-light.bg-light.border-bottom.fixed-top.navbar-expand-custom {
  max-height: 60px;
}
#WebPageMainNavbar {
  background-color: #f8f9fa !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.3s ease;
}
.navbar-gatebuttons {
  display: inline-block;
  min-width: 513px;
}
.navbar-gatebuttons.navbar-onegatebutton {
  min-width: 168px;
}
.navbar-icon-explanation {
  display: inline-block;
  padding-right: 10px;
  font-size: 1rem;
  margin:0;
}
#WebPageMainNavbar > .nav-button, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button {
  display: inline-block;
  margin: 0px 15px;
}
#WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
  position: relative;
  display: flex;
  align-items: center;
  padding: 5px 10px;
  border: 2px solid crimson;
  border-radius: 5px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.3s ease;
  background-color: ghostwhite;
}
#WebPageMainNavbar > .nav-button > .nav-button-btn:hover, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn:hover, #WebPageMainNavbar > .nav-search > .searchactive {
  background-color: crimson;
  color: white;
  cursor: pointer;
}
#WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
  width: 30px;
  height: auto;
}
.nav-button-btn > .nav-count:empty {
  display: none;
}
.nav-button-btn > .nav-count {
  position: absolute;
  top: -11px;
  right: -11px;
  background: crimson;
  color: ghostwhite;
  padding: 5px 9px;
  border-radius: 20px;
  font-size: 0.6rem;
}
#WebPageMainNavbar > ul > .nav-item > .nav-link {
  display: flex;
  align-items: center;
}
/* NAV SEARCH */
.nav-search {
  position: relative;
}
#navsearchbar {
  position: absolute;
  top: 50px;
  width: 250px;
  background: crimson;
  padding-left: 10px !important;
  padding: 10px;
  border-radius: 5px;
}
#navsearchbar > input {
  margin-right: 0 !important;
  width: 180px;
  height: 35px;
  border-radius: 5px 0px 0px 5px;
}
#navsearchbar > input:focus {
  border-color: unset;
  outline: 0;
  box-shadow: unset;
}
#navsearchbar > #SearchContainerMainNavbar {
  display: inline-block;
  height: 35px;
  width: 35px;
  border: none;
  background: #adff2f;
  border-radius: 0px 5px 5px 0px;
}
#navsearchbar > .nav-button > #CustomSearchBtn {
  display: flex;
  align-items: center;
  margin-top: 15px;
  border: none;
  border-radius: 5px;
}
#navsearchbar > .nav-button > #CustomSearchBtn > p {
  display: inline-block;
  width: 180px;
  text-align: center;
  color: black;
}
#navsearchbar > .nav-button > #CustomSearchBtn > img {
  display: inline-block;
  height: 35px;
  width: 35px;
}
#navsearchbar > .nav-search-ocr-button {
  margin: 15px auto 0px !important;
}
thead.header-fixed {
  /*Parent table needs position relative*/
  position: sticky;
  top: 0px;
  background-color: white;
}
.overflowXscroll{
  overflow-x: auto;
}
.w20{
  width:20px;
}
.w40{
  width:40px;
}
.min-w-100{
  min-width: 100px;
}
.min-w-160{
  min-width: 160px;
}
.min-w-180{
  min-width: 180px;
}
.min-w-90vw{
  min-width: 90vw;
}
.max-w-100{
  max-width: 100px;
}
.max-w-400{
  max-width: 400px;
}
.max-w-150{
  max-width: 150px;
}
.max-w-200{
  max-width: 200px;
}
.max-w-250{
  max-width: 250px;
}
.TextNotShown{
  text-indent: -9999px;
}
#PersonalMenuDropOptions>a>i {
  padding-left: 25px;
}
.DoubleLicensePlate{
  background-color: #adff2f !important;
  color: #28282b !important;
}
.blurry-text-big {
   color: transparent !important;
   text-shadow: 0 0 5px rgba(0,0,0,0.1) !important;
}
.Grid{
  display: grid;
}
.textUnderline {
  text-decoration: underline;
}
 /******* CUSTOM SEARCH *******/
 #CustomSearch {
  overflow: scroll;
}
#CustomSearch > .modal-dialog > .modal-content {
  padding-left:10px;
} 
@media (min-width: 1080px) {
  .RemoveThisTask{
    width: 10vw;
    height: 5vh;
    margin-bottom: 0.5rem;
    font-family: inherit;
    line-height: 1.2;
    color: inherit;
    font-size: 1.5rem;
  }
  .EditTruckerInfo, .RemovePendingBtn{
    width: 10vw;
    height: 5vh;
    margin-bottom: 0.5rem;
    font-family: inherit;
    line-height: 1.2;
    color: inherit;
    font-size: 1.5rem;
  }
  .navbar-expand-custom {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
  .navbar-expand-custom .navbar-nav {
    flex-direction: row;
  }
  .navbar-expand-custom .navbar-nav .nav-link {
    padding-right: .5rem;
    padding-left: .5rem;
  }
  .navbar-expand-custom .navbar-collapse {
    display: flex!important;
  }
  .navbar-expand-custom .navbar-toggler {
    display: none;
  }
  .navbar-expand-custom .navbar-nav .dropdown-menu {
    position: absolute;
  }
  .OnlyPortrait{
    display: none;
  }
}
div#notification-box {
  position: sticky;
    top: 4vh;
    left: 50%;
    width: fit-content;
    padding: 0.5vw;
    /* background-color: lightgreen; */
    z-index: 1100;
    font-size: 1.25rem;
    border-radius: 5px;
    text-align: center;
    pointer-events: none;
    transform: translate(-40%, 0);
}
div.Y_N_BB {
  z-index: 1075;
}
.MegaLb>div,.BackBtn,.Quay1207Overview>div,.Quay913Overview>div{
  cursor: pointer;
}
.modal-dialog-small {
  width: 80% !important;
  max-width: 800px;
}
#Non-Modal-InEstimate-Box-Complete > .modal-dialog-small {
  top: 40%;
  left: 50%; 
  transform: translate(-50%, -50%) !important;
}
/* DataTables */
div:has(> .dataTables_wrapper) {
  padding: 10px 25px;
}
.dataTables_length {
  display: inline-block;
  width: 15%;
  min-width: 200px;
  margin-right: 20px;
  margin-bottom: 15px;
}
.dataTables_filter {
  display: inline-block;
  width: 20%;
  min-width: 250px;
  margin-bottom: 15px;
}
.dataTables_length > label, .dataTables_filter > label {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 15px;
  border: 1px solid #28282b;
  border-radius: 10px;
  background-color: #dee2e6;
  color: #28282b;
}
.dataTables_length > label > select, .dataTables_filter > label > input {
  margin: 0px 15px;
  width: 100%;
  padding: 3px 5px;
  border: 1px solid #28282b;
  outline-offset: 0px;
}
.ref-info-extra-info {
  display: block;
  width: 100%;
  padding-top: 50px;
  font-size: 1.2rem;
  font-weight: 600;
  text-align: center;
  color: crimson;
}
.dataTables_paginate.paging_simple_numbers {
  margin-top: 15px;
}
.paginate_button.previous {
  font-size: 1rem;
  margin-right: 10px;
  color: black;
}
.paginate_button.next {
  font-size: 1rem;
  margin-left: 10px;
  color: black;
}
span > .paginate_button {
  margin: 0px 5px;
  color: #28282b;
}
.paginate_button.current {
  font-size: 1rem;
  color: ghostwhite;
  padding: 1px 5px;
  border: 1px solid #28282b;
  background: crimson;
  border-radius: 5px;
}
.paginate_button:hover {
  cursor: pointer;
}
.paginate_button.previous.disabled, .paginate_button.next.disabled {
  color: grey;
}
.paginate_button.previous.disabled:hover, .paginate_button.next.disabled:hover {
  cursor: default;
}
/* USER SETTINGS */
#SettingsContentSubBody > div {
  padding-bottom: 25px;
}
#SettingsContentSubBody > div:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.05);
}
.user-settings-label {
  font-weight: 500;
}
#SettingsContentSubBody > div > label, #SettingsContentSubBody > div > span, #SettingsContentSubBody > div > label > span {
  width: 100%;
}
#SettingsContentSubBody > div > div, #ViewCustomWordsList, #Estimate_RE_BackGroundColor, #EstimateDetailBgColor_When_Completed {
  margin: 0 auto;
  margin-bottom: 25px;
}
@media screen and (max-width: 1080px){
  /*HERE WE WRITE CSS FOR BOTH LANDSCAPE AND PORTRAIT*/
  #ReferencesBtn{
    display: none;
  }
  .MegaLb>div,.BackBtn,.Quay1207Overview>div,.Quay913Overview>div{
    font-size: 7px;
    cursor: pointer;
  }
  table#WaterWashTable,table#StockTable,table#ContainersWaitingRepairTable,table#StatusTable {
    overflow-x: auto;
    display: inline-block;
  }
  .PortraitFalse{
    display: none !important;
  }
  @media screen and (orientation:landscape) {
    .LandscapeFalse{
      display: none;
    }
    .OnlyPortrait{
      display: none;
    }
  }
  @media screen and (orientation:portrait) {
    .PortraitFalse{
      display: none !important;
    }
    /* Rates */
    #AddCafValidateBtn {
      font-size: 0.8rem;
    }
    #SettingsContentSubBody h1 {
      font-size: 1.5rem;
    } 
    .bbRegularMessage > .modal-dialog {
      max-width: 98vw;
    }
  }
}
.align-left{
  margin-left: -100px;
}
.EstimateViewed{
  background-color: green !important;
}
#start_button{
  max-height: 45px;
}
button.btn.btn-warning.quickEditEstimate {
  float: right;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
}
button.btn.btn-warning.StartSurveyEditEstimate {
  float: right;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
}
#PersonalMenuDropOptions{
  position: absolute;
  right: 0;
  left: auto;
  width: auto;
}
a#navbarDropdownMenuLink {
    float: right;
}
#PersonalMenuDropOptions > a, .list-group-flush > button {
  display: inline-flex;
  justify-content: space-between;
}
.dropdown-menu {
  min-width: unset;
}
body{
  background-color:white;
  height: max-content;
  min-height: 100vh;
  min-width: 100vw;
  width: max-content;
}
#WebPageMainNavbar > button {
  margin-right: 5px;
  border: 1px solid #28282b;
}
#WebPageMainNavbar > .btn-warning > i, #WebPageMainNavbar > .btn-primary > i, #WebPageMainNavbar > .btn-info > i, #WebPageMainNavbar > .btn-danger > i, #WebPageMainNavbar > .btn-light > i {
  padding-left: 10px;
}
.btn-light {
  border: 1px solid #28282b;
}
.btn-dark {
  border: 1px solid #f8f8ff;
}
.AddPlateBtn {
  background-color: #adff2f;
  color: #28282b;
}
.OverWriteInReferenceModal-modal-body {
  padding: 10px;
}
.inline-subpage-navbar {
  top: 3.2vh;
  right: 0;
  left: 0;
  z-index: 1030;
  height: 3vh;
}
.html-icon{
  background-image: url("../Images/html.svg");
  background-size: cover;
  background-repeat: no-repeat;
}
.testReefer{
  background-image: url("../Images/Units/Reefer.svg");
  background-size: cover;
  background-repeat: no-repeat;
}
#CloseBtnUnitSubCat, #CloseBtnEstQuantityModal {
  margin-bottom: 10px;
}
.ChooseOtherFormBtn {
  margin-left: 10px;
}
.noselect, #sidebar-wrapper, #PersonalMenuDropOptions, #navbarDropdownMenuLink {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.wrapper{
  width: 100vw;
  height: auto;
  float: left;
  text-align: center;
}
.blurry-text {
   color: transparent;
   text-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.favorite{
  background-image: url("../Images/star.svg");
  background-repeat: no-repeat;
  background-size: 30%;
  background-position: top center;
}
div#StockTable_wrapper {
  overflow-x: auto;
}
#slideshow {
    margin: 50px auto;
    position: absolute;
    width: 80vw;
    height: 80vh;
    margin-left: 10vw;
    margin-top: 10vh;
    padding: 10px;
    box-shadow: 0 0 20px rgba(0,0,0,0.4);
}
th.rotate {
  white-space: nowrap;
  position:relative;
}
th.rotate > div {
  transform: rotate(90deg);
  position:absolute;
  left:0;
  right:0;
  top: 10px;
  margin:auto;
}
#modal-content-AddContainerNotification {
  overflow-y: auto;
}
#modal-content-AddContainerNotification > .row, #modal-content-AddContainerNotification > .form-group > div > button {
  margin-bottom: 10px;
}
.AddContainerNotification-modal-body > .row {
  padding-top: 10px;
}
#OverWriteFlagModal {
  overflow-x: auto;
  overflow-y: auto;
}
#OverWriteFlagModal > div > .modal-content {
  border: 5px solid crimson;
}
.OverWriteFlagModal-modal-body > .CommentBtn {
  display: block;
  margin: 10px auto;
  width: 90%;
  white-space: normal;
  word-wrap: break-word;
  background-color: gold;
}
.modal-content-100 {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 65%;
    pointer-events: auto;
    background-color: #accdef;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3rem;
    outline: 0;
}
.EstimateOverLay-modal-body {
  height: 100%;
  height: 90vh;
  overflow-y: auto;
}
#EstimateOverLay {
  max-height: 99vh;
}
.Correct{
  background-color: #9cfca9 !important;
  color: #28282b !important;
}
.NotCorrect{
  background-color: #ff8c63 !important;
  color: #28282b !important;
}
.CompletedRepair{
  background-color: limegreen;
}
#inputArea{
  display: none;
}
#ConvertResult{
  display: block;
  float: right;
  padding-bottom: 10px;
}
#TextToConvertNumbers{
  width:8vw;
  height: 9vh;
}
.btn_active {
  border-color: #49f903 !important;
  border-width: 2px !important;
}
.scrollY{
  overflow-y: scroll;
}
.Status_SND{
  background-color: #adff2f !important;
  color: #000000;
}
.Status_NOR{
  background-color:  #0000ff !important;
  color: #ffffff !important;
}
.Status_AQC{
  background-color: #00ffff !important;
  color: #000000;
}
.Status_SPAQC{
  background-color: #00ffff !important;
  color: #000000;
}
.Status_DAUL{
  background-color: #73ff73 !important;
  color: #000000;
}
.Status_NOP{
  background-color: #808080 !important;
  color: #000000;
}
#slideshow > div {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
}
#ContainerCommentBox{
  background-color: #ffe396;
}
.lds-hourglass {
  display: none;
  position: relative;
  left:45%;
  width: 10vw;
  height: 10vw;
  color: red;
}
.hidden{
  display: none;
}
.hiddenimportant{
  display: none !important;
}
.hiddenImportant{
  display: none !important;
}
.show-inlineblock{
  display: inline-block;
}
#OverViewReferencesModal{
    overflow-y: scroll;
}
.References-modal-body {
    padding: 0.5vw;
}
.navbar-buttonlist > button, .navbar-buttonlist > a {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.navbar-buttonlist > button span, .navbar-buttonlist > a span {
  text-align: center;
}
.navbar-buttonlist > button .icon-container, .navbar-buttonlist > a .icon-container {
  display: flex;
  position: absolute;
  right: 25px;
}
.navbar-buttonlist > button .icon-container i, .navbar-buttonlist > a .icon-container i {
  margin-left: 5px;
}
.navbar-buttonlist > button .icon-container i:first-child, .navbar-buttonlist > a .icon-container i:first-child {
  margin-left: 0;
}
#OverViewReferencesBtn {
  background-color: #d4ff80;
  color: #28282b;
}
#AddReferenceInBtn, #RegisterATruckerAtGateBtn  {
  background-color: #c8ff66;
  color: #28282b;
}
#AddReferenceOutBtn, #RegisterATruckerAtGateOutBtn {
  background-color: #adff2f;
  color: #28282b;
}
#LocketsInfoBtn {
  background-color: #fc8148;
  color: #f8f8ff;
}
#InternalTransferBtn {
  background-color: #ff5f1f;
  color: #f8f8ff;
}
#ModifyMultiReferenceBtn {
  background-color: #c24c1d;
  color: #f8f8ff;
}
#GetBookedVsStockBtn, #OpenDBLane  {
  background-color: #ca221b;
  color: #f8f8ff;
}
#MovesStatsBtn, #OpenRELane  {
  background-color: #b82018;
  color: #f8f8ff;
}
#MovesBufferStatsBtn, #OpenLOLane  {
  background-color: #a61e14;
  color: #f8f8ff;
}
#OpenROLane {
  background-color: #6e1503;
  color: #f8f8ff;
}
#AddContainersToBuffer {
  background-color: #bd8012;
  color: #f8f8ff;
}
#RemoveContainersFromBufferBtn {
  background-color: #a97310;
  color: #f8f8ff;
}
#AllHandlingsBtn {
  background-color: #f5b5d3;
  color: #28282b;
}
#GetStorageBtn {
  background-color: #e176ac;
  color: #28282b;
}
#AddContainerCommentBtn {
  background-color: #a6519a;
  color: #f8f8ff;
}
#AddContainerNotificationBtn {
  background-color: #824078;
  color: #f8f8ff;
}
#GetBargeTasksBtn {
  background-color: #00ffff;
  color: #28282b;
}
#GetRegistrationsAtGateBtn, #MonitorRegistrationsAtGateBtn {
  background-color: #009999;
  color: #f8f8ff;
}
#ViewPreRegistrationsBtn {
  background-color: #0000ff;
  color: #f8f8ff;
}
#FlagLicensePlateBtn {
  background-color: #0000c8;
  color: #f8f8ff;
}
.PowerBIBtn {
  background-color: #ffff00;
  color: #28282b;
} 
.ContainersStockBtn {
  background-color: #f6a318;
  color: #28282b;
}
.ContainerRepairedAtBtn {
  background-color: #d4ff80;
  color: #28282b;
}
.AllLocationRepairBtn {
  background-color: #c8ff66;
  color: #28282b;
}
.ContainerRepairedBasedOnStatusChangeBtn {
  background-color: #adff2f;
  color: #28282b;
}
.ContainerHeavyRepairBtn {
  background-color: #268d37;
  color: #f8f8ff;
}
.ContainerPendingRepairBtn {
  background-color: #20ada4;
  color: #f8f8ff;
}
.IdleListBtn {
  background-color: #7c7c7b;
  color: #f8f8ff;
}
.EstimateMadeBtn {
  background-color: #0000e2;
  color: #f8f8ff;
}
.WashedContainerBtn {
  background-color: #00cccc;
  color: #f8f8ff;
}
.EDIReceivedAndTransmittedBtn {
  background-color: #b37911;
  color: #f8f8ff;
}
.BOXE-billingBtn {
  background-color: #941c0f;
  color: #f8f8ff;
}
.EIR-billingBtn {
  background-color: #941c0f;
  color: #f8f8ff;
}
.ML-dataBtn {
  background-color: #dc2317;
  color: #f8f8ff;
}
.FletecBtn {
  background-color: #e52321;
  color: #f8f8ff;
}
.WhatDriversDidBtn {
  background-color: #b82018;
  color: #f8f8ff;
}
.WhatPeopleDidBtn {
  background-color: #b82018;
  color: #f8f8ff;
}
.EstimatingLogicBtn {
  background-color: #a6519a;
  color: #f8f8ff;
}
.dateselectform > button {
  margin-right: 5px;
}
.searchbookedvsstock > .row, .conditionalsearchresult > .row {
  padding-top: 10px;
}
.searchbookedvsstock > button, .conditionalsearchresult > button {
  display: block;
  margin-top: 15px;
  background-color: #adff2f;
  color: #28282b; 
}
.GateMovesHeader > div > button, .BufferMovesResultDiv > div > button, .HandlingsContent > div > div > button, .StorageHeaderDiv > div > button, .ContainersRepairedHeader > div > button {
  margin-right: 5px;
}
.AddContainerComment-modal-body > .row {
  padding-bottom: 10px;
}
#SubmitTheCommentBtn {
  padding: 0.5rem;
  font-size: 1rem;
}
.StatsOptions-modal-body {
    padding: 0.5vw;
}
.btn-info-washed {
  color: black;
}
.fa-cubes {
  color: black;
}
.AddReferenceIn-modal-body > .row:first-child, .AddRefernceOut-modal-body > .row:first-of-type {
  padding-top: 10px;
}
.AddReferenceIn-modal-body > .row, .AddRefernceOut-modal-body > .row {
  margin-bottom: 10px;
}
.AddReferenceIn-modal-footer, .AddRefernceOut-modal-footer {
  margin-top: 15px;
}
.spacer-width {
  height: 0;
  padding: 0;
}
#ARIStatusDescription:empty, #ARIContainerType:empty, #ARIIsoDescription:empty, #IsoDescriptionAERO:empty, #StatusDescriptionAERO:empty {
  display: none;
}
.which-depot-row::before {
  display: none;
  width: 100%;
  content: var(--before-content, '');
  background-color: crimson;
  color: ghostwhite;
  border-radius: 5px;
  text-align: center;
  padding: 5px 10px;
  margin-bottom: 5px;
}
.show-before::before {
  display: block;
}
#ContainerNumbersResult, .ContainerNumbersResultlabel {
  margin: 20px 0px;
}
.ContainerNumbersResultTbl tr {
  border: 1px solid #28282b;
}
.ContainerNumbersResultTbl th, .ContainerNumbersResultTbl td {
  padding: 10px 20px;
}
.ContainerNumbersResultTbl th {
  font-size: 1rem;
}
.ContainerNumbersResultTbl > tbody > tr:nth-child(even), .ContainerNumbersResultTbl > tbody > tr:nth-child(even) > .cnr-delete > button {
  background-color: rgba(0, 0, 0, 0.05);
}
.cnr-delete, .delete-from-ori-ref {
  text-align: center;
}
.removeFromAEROBtn, .unlinkFromAEROBtn {
  border: none;
  text-align: center;
  background: none !important;
}
.removeFromAEROBtn > i, .unlinkFromAEROBtn > i {
  color: crimson;
  font-size: 1.3rem;
}
.aero-error-box {
  padding: 25px;
  width: 80vw;
  margin: 0 auto;
  background: crimson;
  color: ghostwhite;
}
.aero-error-box > .modal-header > .close {
  color: ghostwhite;
}
.aero-error-box > .modal-header {
  color: #28282b;
}
.aero-error-box > .modal-body-MessageBox {
  padding: 20px 0px;
  color: #28282b;
}
.aero-error-box > .modal-footer-MessageBox > button {
  background: ghostwhite;
  color: #28282b;
}
#ReferenceTable{
  width: 100%;
}
#ReferenceTable input,#MovesTable input, #HandlingsTable input{
  width: 90%;
  font-size: 0.8rem;
  padding: 5px 10px;
}
#BtnConvertStrToNumbers {
  background: #adff2f;
  color: #28282b;
  border-radius: 10px;
  font-weight: 700;
}
.funkyradio-primary input[type="radio"]:checked ~ label:before, .funkyradio-primary input[type="checkbox"]:checked ~ label:before {
  background-color: #adff2f;
  opacity: 1;
}
.funkyradio input[type="radio"]:checked ~ label:before, .funkyradio input[type="checkbox"]:checked ~ label:before, .funkyradio input[type="radio"]:hover:not(:checked) ~ label:before, .funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
  content: '\f00c';
  font-family: 'Font Awesome 5 Free'; 
  font-weight: 900;
  color: #28282b;
  text-indent: .8em;
  opacity: 1;
}
.search-movestable[placeholder="🔎 Iso"] {
  width: 136% !important;
}
.lds-hourglass:after {
  content: " ";
  display: block;
  border-radius: 50%;
  width: 0;
  height: 0;
  margin: 6px;
  box-sizing: border-box;
  border: 26px solid #ff1f1f;
  border-color: #ff1f1f transparent #ff1f1f transparent;
  animation: lds-hourglass 1.2s infinite;
}
@keyframes lds-hourglass {
  0% {
    transform: rotate(0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  50% {
    transform: rotate(900deg);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  100% {
    transform: rotate(1800deg);
  }
}
#QuantitySelectedOption, #ContainerNumberSelectedOption{
  display: none;
}
div#ContainerNumbersResult > button {
  margin: 10px 5px;
}
div#ContainerNumbersResult > button:first-child {
  margin-left: 0;
}
#PowerBiStats{
  top: 3vh;
  width: 100%;
  height: 95vh;
}
.ClientInStack{
  font-size: 0.5em;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
}
.table td.table-fit,
.table th.table-fit {
  white-space: nowrap;
  width: 1%;
}
.active-done{
  background-color: #41fc03 !important;
}
.smallFontSize {
  font-size: 0.9rem !important;
}
.smallerFontSize, .spcBtnBoxManu, .spcBtnUnitManu, .spcBtnEstimateLocationComment, .spcBtnCurrentLocationComment, .spcBtnBlockComment {
  font-size: 0.95rem !important;
}
.CustomSearch-modal-header > button {
  margin-top: 25px;
  margin-left: 15px;
}
#SearchBtnCustom {
  display: inline;
}
.CustomSearch-modal-body {
  overflow-x: auto;
  padding-bottom: 15px;
}
.containerstackspopup .h5 {
  margin-bottom: 0;
}
.MovesStatsForm-modal-body, .MovesContent{
  width: 90vw;
}
.whatsAppBtn{
  margin: 1rem;
  height: 3rem;
  width: 3rem;
  background-image: url("../Images/WhatsAppIcon.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center,center;
  display: inline-block;
  cursor: pointer;
}
.editBtn{
  height: 1.5vw;
  width: 1.5vw;
  position: absolute;
  right: 2.5vw;
  background-image: url("../Images/EditIcon.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center,center;
  display: inline-block;
}
.deleteValueBtn{
  height: 1.5vw;
  width: 1.5vw;
  position: absolute;
  right: 2.5vw;
  background-image: url("../Images/DeleteIcon.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center,center;
  display: inline-block;
}
.DropButton{
  background-image: url("../Images/DeleteIcon.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center,center;
  display: inline-block;
}
.dropbtn {
    background-color: #E30613;
    color: white;
    width:100%;
    padding: 1%;
    font-size: 1.5em;
    border: none;
    float:left;
  }
/* The container <div> - needed to position the dropdown content */
.dropdown {
  width:100%;
  position: relative;
  display: inline-block;
}
#WebPageMainNavbar > .navbar-nav > .dropdown {
  width:100%;
  position: relative;
  display: inline-block;
  padding: 5px 15px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.3s ease;
  background-color: ghostwhite;
}
.navbar-expand-custom .navbar-nav .nav-link {
  padding: 0 !important;
  opacity: 1;
}
/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  width:100%;
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  font-size: 1.5em;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
/* Links inside the dropdown */
.dropdown-content a {
  width:100vw;
  color: black;
  padding: 2vw;
  text-decoration: none;
  display: block;
}
.ContainersWaitingRepairContent > .modal-header2, #EdiReceived_tab > .modal-header2, #EdiSend_tab > .modal-header2, #ApiReceived_tab > .modal-header2, #ApiSend_tab > .modal-header2, .Ml_ResultContent > .modal-header2 {
  justify-content: right;
}
.ContainersWaitingRepairContent > .modal-header2 > button, #EdiReceived_tab > .modal-header2 > button, #EdiSend_tab > .modal-header2 > button, #ApiReceived_tab > .modal-header2 > button, #ApiSend_tab > .modal-header2 > button, .Ml_ResultContent > .modal-header2 > button {
  margin-left: 10px;
}
.loader {
  border: 1vw solid #f3f3f3; /* Light grey */
  border-top: 1vw solid #3498db; /* Blue */
  border-radius: 50%;
  width: 10vw;
  height: 10vw;
  animation: spin 2s linear infinite;
  display: none;
}
.AjaxLaderSmall{
  border: 0.5vw solid #f3f3f3; /* Light grey */
    border-top: 0.5vw solid #ff2a00; /* Blue */
    border-radius: 50%;
    width: 2.5vw;
    height: 2.5vw;
    animation: spin 2s linear infinite;
    display: inline-block;
}
.loadervisible {
  border: 1vw solid #f3f3f3; /* Light grey */
  border-top: 1vw solid #3498db; /* Blue */
  border-radius: 50%;
  width: 10vw;
  height: 10vw;
  animation: spin 2s linear infinite;
  display: block;
}
.loader1vwcentered {
  border: 0.2vw solid #f3f3f3; /* Light grey */
  border-top: 0.2vw solid #3498db; /* Blue */
  border-radius: 50%;
  width: 1vw;
  height: 1vw;
  animation: spin 2s linear infinite;
  display: block;
  margin-left:40%;
}
.form-control-NoBackGround {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #495057;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control-NoBackGround::-ms-expand {
  background-color: transparent;
  border: 0;
}
.form-control-NoBackGround:focus {
  color: #28282b;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.form-control-NoBackGround::-webkit-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround::-moz-placeholder {
  color: #6c757d;
  opacity: 1;
}
.SearchEstimateFrm{
  width: 99vw;
  height: 4vh;
  display: block;
  border: 1px solid;
  padding-top: 1vh;
}
.SearchEstimateFrm input[type="text"]{
  float: left;
  margin-left: 1vw;
}
.SearchEstimateFrm button{
  float: left;
  margin-left: 1vw;
}
.form-control-NoBackGround:-ms-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround::-ms-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround::placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround:disabled, .form-control-NoBackGround[readonly] {
  background-color: #e9ecef;
  opacity: 1;
}
select.form-control-NoBackGround:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px);
}
select.form-control-NoBackGround:focus::-ms-value {
  color: #495057;
}
.form-control-NoBackGround-Small {
  display: block;
  width: 18vw;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: #28282b;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-control-NoBackGround-Small::-ms-expand {
  background-color: transparent;
  border: 0;
}
.form-control-NoBackGround-Small:focus {
  color: #495057;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.form-control-NoBackGround-Small::-webkit-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround-Small::-moz-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround-Small:-ms-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround-Small::-ms-input-placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround-Small::placeholder {
  color: #6c757d;
  opacity: 1;
}
.form-control-NoBackGround-Small:disabled, .form-control-NoBackGround-Small[readonly] {
  background-color: #e9ecef;
  opacity: 1;
}
select.form-control-NoBackGround-Small:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px);
}
select.form-control-NoBackGround-Small:focus::-ms-value {
  color: #495057;
}
.blink_me {
  animation: blinker 1s linear infinite;
  color: #ff0000;
}
.NewNotificationCount,.NewMessages{
  color: red;
  font-size: medium;
}
@keyframes blinker {
  50% { opacity: 0.1; }
}
.bordered-greenSolid{
  background-color:#28a745;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  box-shadow: 0 0 5vw #28a745;
  -webkit-box-shadow: 0 0 5vw #28a745;
}
.bordered-green{
  background-color:#d8e4db;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  box-shadow: 0 0 5vw #28a745;
  -webkit-box-shadow: 0 0 5vw #28a745;
}
.bordered-orange{
  background-color:#ffa51e;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  box-shadow: 0 0 5vw #ffa51e;
  -webkit-box-shadow: 0 0 5vw #ffa51e;
}
.bordered-black{
  background-color:#f8f8ff;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  box-shadow: 5px 5px 10px #28282b;
  -webkit-box-shadow: 5px 5px 10px #28282b;
}
.bordered-orange-small{
  background-color:#ffa51e;
  border-radius: 0.01vw;
  -webkit-border-radius: 0.01vw;
  box-shadow: 0 0 0.5vw #ffa51e;
  -webkit-box-shadow: 0 0 0.5vw #ffa51e;
}
.bordered-green-small{
  background-color:#28a745;
  border-radius: 0.01vw;
  -webkit-border-radius: 0.01vw;
  box-shadow: 0 0 0.5vw #28a745;
  -webkit-box-shadow: 0 0 0.5vw #28a745;
}
.bordered-red-small{
  background-color: #f48341 !important;
  color: #28282b;
}
.bordered-flashygreen-small{
  background-color: #49f903 !important;
}
.TempInfo{
  display: none;
}
.VentInfo{
  display: none;
}
.HumidityInfo{
  display: none;
}
.DrainsInfo{
  display: none;
}
.PotentialReeferInfo{
  display: none;
}
#ShowMessageBox{
  display: none;
}
#ShowMessageBoxInEstimateDetail{
  display: none;
}
#MessageBox{
  z-index: 1099;
}
.ice{
  background-color: #cce6ff;
}
.hot{
  background-color: #ffb399;
}
.fa-gate {
  background-image: url("../Images/Gate.svg");
  content: url("../Images/Gate.svg");
  width: 25px;
}
.EstimateFileBlocked{
  background-image: url("../Images/Lock.svg") !important;
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
    top: 1px;
    display: block;
  width: 25px;
  height: 25px;
}
.EstimateFileNotBlocked{
  background-image: url("../Images/unlock.svg") !important;
  background-repeat: no-repeat;
  background-size: 100%;
  position: relative;
  top: 1px;
  display: block;
  width: 25px;
  height: 25px;
}
#StackLayoutRb .EstimateFileNotBlocked, .StackLayoutClass .EstimateFileNotBlocked{
  background-image: url(../Images/unlock.svg) !important;
  background-repeat: no-repeat;
  background-size: 20%;
  background-position: bottom right;
}
#LockOrNot > button {
  margin: 0px 5px;
}
.EstimateChatBtn {
  position: relative;
}
.EstimateChatBtn > .entryCount {
  position: absolute;
  top: -10px;
  right: -10px;
  background-color: #ff0000;
  border-radius: 50px;
  padding: 5px 10px;
  font-weight: bold;
  font-size: 10px;
}
#minimized-containers .EstimateFileNotBlocked{
  background-image: url(../Images/unlock.svg) !important;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right;
}
.alert-danger {
  color: ghostwhite;
  background-color: crimson;
  border-color: crimson;
}
#AllValidContainerNumbers > .ValidContainerNumberBtn {
  margin-bottom: 5px ;
}
#AllValidContainerNumbers > .ValidContainerNumberBtn:first-of-type {
  margin-top: 10px;
}
#PlusOrMin, #TemperatureValue, #VentValue, #VentSign, #HumidityValue, #DrainsValue {
  margin-bottom: 0.5rem;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.2;
  color: inherit;
  font-size: 1.5rem;
  width: 10vw;
  height: 40px;
  padding: 0px 5px;
}
#AddReferenceOutInfoBtn {
  background-color: #adff2f;
  color: #28282b;
}
#PendingTasks {
  overflow-x: scroll;
  overflow-y: scroll;
}
.PendingTasks-modal-body table td,th {
  margin-bottom: 0.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 1.5rem;
}
.ReferenceDetail-modal-body table td,th, #SummaryDescription {
  margin-bottom: 0.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: black;
  font-size: 1.5rem;
}
#ReferenceDetail{
  overflow-x: scroll;
}
.RefBtnInfo{
  width: 5vw;
  height: 5vh;
}
.AcceptThisTask, .PreBarrierCheckThisContainer, .RemoveThisTask{
  width: 10vw;
  height: 5vh;
  margin-bottom: 0.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 1.5rem;
}
.QuickAcceptTaskGateInBtn{
  width: 5vw;
  height: 5vh;
  margin-bottom: 0.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 1.5rem;
}
.QuickAcceptTaskGateOutBtn{
  width: 5vw;
  height: 5vh;
  margin-bottom: 0.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 1.5rem;
}
.ttpco-text {
  text-wrap: auto;
}
.TaskAcceptedBtn, .RefDetailSelectContainerForTask{
  width: 10vw;
  height: 5vh;
  font-size: 1.5rem;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
}
.UnAcceptedGateTaskBtn {
  display: flex;
  width: 200px;
  height: 75px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5px;
  font-size: 1rem;
  background-color: #f4b342;
  color: #28282b;
}
.AcceptedGateTaskBtn {
  display: flex  ;
  width: 250px;
  height: 75px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0px;
  font-size: 1.1rem;
}
.AcceptedGateTaskBtn > p {
  margin-bottom: 0;
  padding: 5px;
}
.AcceptedGateTaskBtn > p:first-child {
  padding-top: 5px;
  padding-bottom: 5px;
}
.AcceptedGateTaskBtn > p:nth-child(2) {
  padding-bottom: 5px;
}
.UnAcceptThisTask, #ConfirmGateOut > .modal-dialog > .modal-content > .UnAcceptThisTask > .modal-footer {
  width: auto;
  height: 6vh;
  margin-right: 25px;
  margin-left: 0;
  font-size: 0.9vw;
}
.CloseTaskBtn {
  width: 6vw;
  height: 6vh;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 0.9vw;
  background-color: #aaab9f;
  color: #28282b;
}
.RefDetailSelectContainerForTask {
  background-color: #D0CACA;
  color: #28282b;
}
.FinishTask {
  width: 6vw;
  height: 6vh;
  font-family: inherit;
  line-height: 1.2;
  color: inherit;
  font-size: 0.9vw;
  background-color: #a3f441;
  color: #28282b;
}
.SRF-form {
  padding-top: 10px;
  padding-bottom: 10px;
}
.SRF-form > div {
  padding-bottom: 10px;
}
#SRFRefIn {
	margin-right:10px;
	border: 1px dashed black;
}
#SRFRefOut {
	border: 1px dashed black;
}
#SRFRefIn.SND, #SRFRefOut.SND {
	border: 1px solid black;
}
#ReferenceOutTitle{
  margin-left: 10%;
  width: 80%;
  text-align: center;
  height: 20vh;
  background-image: url("../Images/ContainerOut.gif");
  background-repeat: no-repeat;
  background-size:100% 100%;
}
#ReferenceInTitle{
  margin-left: 10%;
  width: 80%;
  text-align: center;
  height: 20vh;
  background-image: url("../Images/ContainerIn.gif");
  background-repeat: no-repeat;
  background-size:100% 100%;
}
.popup-for-ref-out-confirm > .modal-dialog > .modal-content {
  max-width: 90%;
  margin: 90px auto 0px;
} 
.popup-for-ref-out-confirm > .modal-dialog > .modal-content, .popup-for-ref-out-confirm > .modal-dialog > .modal-content > .modal-header > .modal-title, .popup-for-ref-out-confirm > .modal-dialog > .modal-content > .modal-body {
  background-color: #28282b;
  color: ghostwhite;
}
.BackBtnSubPlanContent, .BackBtn {
  top: 1vh;
  right: 1vw;
}
.BackBtnSubPlanContentLittleMoreLeft{
  top: 1vh;
  right: 10vw;
  }
.BackBtnSubPlanContentBottom {
  bottom: 1vh;
  right: 1vw;
}
.BackBtn,.BackBtnSubPlanContent,.BackBtnSubPlanContentLittleMoreLeft,.BackBtnSubPlanContentBottom {
  position: absolute;
  background-image: none;
  background-repeat: no-repeat;
  background-size: 7vh;
  background-position: center;
  display: block;
  width: 7vh;
  height: 9vh;
  border-radius: 5px;
  -moz-border-radius: 5px;
  box-shadow: 0 0 #688099;
  -moz-box-shadow: 0 0 #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 0px #688099;
  font-size: 1.4vw;
  color: rgb(169,22,5) !important;
  cursor: pointer;
  padding-top: 20px;
  border: 1px solid white;
  font-size: 1vw;
  background-color: lavenderblush;
}
@keyframes spin {
  0% {  transform: rotate(0deg); }
  100% {  transform: rotate(360deg); }
}
@media screen and (orientation:landscape) {
  .CargoImage {
      right: 0;
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 10vh;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
  }
  .PageContent{
    width: 100vw;
    height: auto;
    float: left;
    text-align: center;
    background-color: #fff;
    position: relative;
  }
  .PageContent-marginTop{
    width: 100vw;
    height: auto;
    float: left;
    top: 4vh;
    text-align: center;
    background-color: #fff;
    position: relative;
  }
  .MonitoringHeaderMenu {
    margin-bottom: 2vh;
  }
  .StackMenuRb,.StackMenuMonitoring{
    position: absolute;
    top:  calc(calc(100vh / 8) + 1vh);
    right:1vw;
    border: 0.05vw solid black;
    width:calc(calc(100vw / 14)*2);
    height: calc(96vh - calc(100vh / 5.5));
    overflow-y: scroll;
  }
  .ChangeLocation{
    font-size: 1vw;
  }
  .LargerBtn{
    height: calc(100vh / 12);
    font-size: 0.9vw;
  }
  .ContainerRbSpecLocation{
    vertical-align: text-top;
    font-size: 0.9vw;
    margin: 0.2vw;
    width:calc(100vw / 14);
    height: calc(100vh / 8);
    background-color: transparent;
    position: relative;
    cursor: pointer;
  }
  .EightHighStack>tbody>tr>td>button.ContainerRbSpecLocation{
    height: calc(100vh / 9);
  }
  .SevenHighStack>tbody>tr>td>button.ContainerRbSpecLocation{
    height: calc(100vh / 8);
  }
  #StackLayoutRb.SevenHighStack > tbody > tr:nth-child(1) {
    display: none;
  }
  .SixHighStack>tbody>tr>td>button.ContainerRbSpecLocation{
    height: calc(100vh / 7);
  }
  #StackLayoutRb.SixHighStack > tbody > tr:nth-child(1), #StackLayoutRb.SixHighStack > tbody > tr:nth-child(2) {
    display: none;
  }
  .StackThickness12>tbody>tr>td>button.ContainerRbSpecLocation{
    width:calc(100vw / 19);
    font-size: 0.7vw;
  }
  .StackThickness13>tbody>tr>td>button.ContainerRbSpecLocation{
    width:calc(100vw / 19);
    font-size: 0.7vw;
  }
  .StackThickness14>tbody>tr>td>button.ContainerRbSpecLocation{
    width:calc(100vw / 19);
    font-size: 0.7vw;
  }
  .StackThickness15>tbody>tr>td>button.ContainerRbSpecLocation{
    width:calc(100vw / 19);
    font-size: 0.7vw;
  }
  .smallBorderRoundContainer{
    border: 0.01vw solid rgb(0, 0, 0);
  }
  .StackContentRb{
    width: 100vw;
    height: 96vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
  }
  .StackContentMonitoring{
    width: 100vw;
    height: 96vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
  }
  .SubPlanContent{
    width: 99vw;
    height: 96vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
  }
  .SubPlanContent > div > div{
    cursor: pointer;
  }
  .BackBtn.Small{
    position: absolute;
    top:0;
    right:1vw;
    background-image: url("../Images/MakeEstimate/Resources/Button-Back-1-512.png");
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
    display: inline-block;
    width:calc(100vw / 18);
    height: calc(100vh / 12);
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
    font-size: 1.5vw;
    color: white;
    cursor: pointer;
  }
  .SubPlanContentMonitoring1207{
    height: 92vh;
    width: 99vw;
    position: relative;
    display: block;
  }
  .SubPlanContentMonitoring1207 > *{
    display: none;
  }
  .StackContentMonitoring1207{
    width: 100vw;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }

  .StackA1,.StackB1,.StackC1,.StackD1,.StackE1,.StackA2,.StackB2,.StackC2,.StackD2,.StackE2,.StackA3,.StackB3,.StackC3,.StackD3,.StackE3,.StackA4,.StackB4,.StackC4,.StackD4,.StackE4,.StackA5,.StackB5,.StackC5,.StackD5,.StackE5,.StackA6,.StackB6,.StackC6,.StackD6,.StackE6,.StackA7,.StackB7,.StackC7,.StackD7,.StackE7{
    width:10vw;
    height: calc(100vh / 10);
    background-color:#42eef4;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
    position: absolute;
  }
  .StackA1{
    margin-left: 14vw;
    margin-top: 3vh;
  }
  .StackB1{
    margin-left: 26vw;
    margin-top: 3vh;
  }
  .StackC1{
    margin-left: 38vw;
    margin-top: 3vh;
  }
  .StackD1{
    margin-left: 50vw;
    margin-top: 3vh;
  }
  .StackE1{
    margin-left: 62vw;
    margin-top: 3vh;
  }
  .StackA2{
    margin-left: 14vw;
    margin-top: 15vh;
  }
  .StackB2{
    margin-left: 26vw;
    margin-top: 15vh;
  }
  .StackC2{
    margin-left: 38vw;
    margin-top: 15vh;
  }
  .StackD2{
    margin-left: 50vw;
    margin-top: 15vh;
  }
  .StackE2{
    margin-left: 62vw;
    margin-top: 15vh;
  }
  .StackA3{
    margin-left: 14vw;
    margin-top: 25.5vh;
  }
  .StackB3{
    margin-left: 26vw;
    margin-top: 25.5vh;
  }
  .StackC3{
    margin-left: 38vw;
    margin-top: 25.5vh;
  }
  .StackD3{
    margin-left: 50vw;
    margin-top: 25.5vh;
  }
  .StackE3{
    margin-left: 62vw;
    margin-top: 25.5vh;
  }
  .StackA4{
    margin-left: 14vw;
    margin-top: 37.5vh;
  }
  .StackB4{
    margin-left: 26vw;
    margin-top: 37.5vh;
  }
  .StackC4{
    margin-left: 38vw;
    margin-top: 37.5vh;
  }
  .StackD4{
    margin-left: 50vw;
    margin-top: 37.5vh;
  }
  .StackE4{
    margin-left: 62vw;
    margin-top: 37.5vh;
  }
  .StackA5{
    margin-left: 14vw;
    margin-top: 48vh;
  }
  .StackB5{
    margin-left: 26vw;
    margin-top: 48vh;
  }
  .StackC5{
    margin-left: 38vw;
    margin-top: 48vh;
  }
  .StackD5{
    margin-left: 50vw;
    margin-top: 48vh;
  }
  .StackE5{
    margin-left: 62vw;
    margin-top: 48vh;
  }
  .StackA6{
    margin-left: 14vw;
    margin-top: 60vh;
  }
  .StackB6{
    margin-left: 26vw;
    margin-top: 60vh;
  }
  .StackC6{
    margin-left: 38vw;
    margin-top: 60vh;
  }
  .StackD6{
    margin-left: 50vw;
    margin-top: 60vh;
  }
  .StackE6{
    margin-left: 62vw;
    margin-top: 60vh;
  }
  .StackA7{
    margin-left: 14vw;
    margin-top: 70.5vh;
  }
  .StackB7{
    margin-left: 26vw;
    margin-top: 70.5vh;
  }
  .StackC7{
    margin-left: 38vw;
    margin-top: 70.5vh;
  }
  .StackD7{
    margin-left: 50vw;
    margin-top: 70.5vh;
  }
  .StackE7{
    margin-left: 62vw;
    margin-top: 70.5vh;
  }
  .WrongLocation{
    position: absolute;
    margin-left: 78vw;
    margin-top: 3vh;
    width:20vw;
    height: 12vh;
    background-color:#ffad3a;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  .OnlySetpoint{
    position: absolute;
    margin-left: 78vw;
    margin-top: 48vh;
    width:20vw;
    height: 12vh;
    background-color:#89fffd;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  .Magazine{
    position: absolute;
    margin-left: 78vw;
    margin-top: 65vh;
    width:20vw;
    height: 12vh;
    background-color:#37a5ef;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  .ContainerMonitoringEFPSpecLocation{
    text-align: center;
    font-size: 0.9vw;
    margin: 0.2vw;
    width: calc(100vw / 8);
    height: calc(90vh / 4.1);
    background-color: transparent;
    visibility: hidden;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
    cursor: pointer;
    position: relative;
  }
  tfoot{
    font-weight: bold;
  }
  .ContainerMonitoringEFPSpecLocation h1{
    margin-top: 0;
    text-align: center;
    font-size: 1vw;
    width: 100%;
  }
  .ContainerMonitoringEFPSpecLocation p{
    text-align: center;
    margin-top: 0;
    font-size: 0.8vw;
    width: 100%;
  }
  .ToBeMonitored{
    background-color: #ffae91;
  }
  .RecentlyMonitored{
    background-color: #9acd32;
  }
  .MonitoredNotPluggedIn{
    background-color: #ffffff;
  }
  /*Monitoring DETAIL CONTAINER-------------------------------------------------------- */
  #ContainerNumber{
    float:left;
    width:100%;
  }
  #ContainerMonitoringInfoText{
    float:left;
    width: 30%;
  }
  #MonitoringHistory{
    float:left;
    width:60%;
  }
  #MonitoringHistory{
    margin-left: 10px;
  }
  .ContainerMonitoringDetail{
    float:left;
    width:100%;
    height:auto;
    border:1px solid black;
  }
  #SaveBtnMonitoring button{
    width:100%;
    background:#0F0;
    display: none;
  }
  #PopularItemsTbl_wrapper > .row:nth-child(2) {
    max-height: 45vh;
    overflow-y: scroll;
  }
}
@media screen and (orientation:portrait) {
  .CargoImage {
      right: 0;
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 10vw;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
  }
  .PageContent-marginTop{
    width: 100vw;
    height: auto;
    float: left;
    top: 7.5vh;
    text-align: center;
    background-color: #fff;
    position: relative;
  }
  .StackMenuRb,.StackMenuMonitoring{
    position: absolute;
    top:  12vh;
    right:1vw;
    border: 0.05vw solid black;
    width:calc(calc(100vw / 14)*2);
    height: calc(50vh - calc(100vh / 5.5));
    overflow-y: scroll;
  }
  .LargerBtn{
    height: calc(50vh / 12);
    font-size: 0.9vw;
  }
  .ContainerRbSpecLocation{
    font-size: 0.9vw;
    margin: 0.2vw;
    width:calc(100vw / 14);
    height: calc(45vh / 8);
    background-color: transparent;
    border:none;
    position: relative;
  }
  .StackContentMonitoring{
    width: 100vw;
    height: 50vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
  }
  .StackContentRb{
    width: 100vw;
    height: 50vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
  }
  .SubPlanContent{
    margin-top: 10vh;
    width: 99vw;
    height: 50vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
  }
  .SubPlanContentMonitoring1207{
    height: 85vh;
    width: 99vw;
    margin-left:-1vw;
    position: relative;
  }
  .SubPlanContentMonitoring1207 > *{
    display: none;
  }
  .SubPlanContentMonitoring1207 > div{
    cursor: pointer;
  }
  .StackContentMonitoring1207{
    width: 100vw;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }
  .Water{
    position: absolute;
    margin-left: 2.6vw;
    margin-top: 3vh;
    width:10vw;
    height: 80vh;
    background-color:blue;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 5px #688099;
    -moz-box-shadow:0 0 5px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 5px #688099;
  }
  .StackA1,.StackB1,.StackC1,.StackD1,.StackE1,.StackA2,.StackB2,.StackC2,.StackD2,.StackE2,.StackA3,.StackB3,.StackC3,.StackD3,.StackE3,.StackA4,.StackB4,.StackC4,.StackD4,.StackE4,.StackA5,.StackB5,.StackC5,.StackD5,.StackE5,.StackA6,.StackB6,.StackC6,.StackD6,.StackE6,.StackA7,.StackB7,.StackC7,.StackD7,.StackE7{
    width:10vw;
    height: calc(100vh / 10);
    background-color:#42eef4;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
    position: absolute;
  }
  .StackA1{
    margin-left: 14vw;
    margin-top: 3vh;
  }
  .StackB1{
    margin-left: 26vw;
    margin-top: 3vh;
  }
  .StackC1{
    margin-left: 38vw;
    margin-top: 3vh;
  }
  .StackD1{
    margin-left: 50vw;
    margin-top: 3vh;
  }
  .StackE1{
    margin-left: 62vw;
    margin-top: 3vh;
  }
  .StackA2{
    margin-left: 14vw;
    margin-top: 15vh;
  }
  .StackB2{
    margin-left: 26vw;
    margin-top: 15vh;
  }
  .StackC2{
    margin-left: 38vw;
    margin-top: 15vh;
  }
  .StackD2{
    margin-left: 50vw;
    margin-top: 15vh;
  }
  .StackE2{
    margin-left: 62vw;
    margin-top: 15vh;
  }
  .StackA3{
    margin-left: 14vw;
    margin-top: 25.5vh;
  }
  .StackB3{
    margin-left: 26vw;
    margin-top: 25.5vh;
  }
  .StackC3{
    margin-left: 38vw;
    margin-top: 25.5vh;
  }
  .StackD3{
    margin-left: 50vw;
    margin-top: 25.5vh;
  }
  .StackE3{
    margin-left: 62vw;
    margin-top: 25.5vh;
  }
  .StackA4{
    margin-left: 14vw;
    margin-top: 37.5vh;
  }
  .StackB4{
    margin-left: 26vw;
    margin-top: 37.5vh;
  }
  .StackC4{
    margin-left: 38vw;
    margin-top: 37.5vh;
  }
  .StackD4{
    margin-left: 50vw;
    margin-top: 37.5vh;
  }
  .StackE4{
    margin-left: 62vw;
    margin-top: 37.5vh;
  }
  .StackA5{
    margin-left: 14vw;
    margin-top: 48vh;
  }
  .StackB5{
    margin-left: 26vw;
    margin-top: 48vh;
  }
  .StackC5{
    margin-left: 38vw;
    margin-top: 48vh;
  }
  .StackD5{
    margin-left: 50vw;
    margin-top: 48vh;
  }
  .StackE5{
    margin-left: 62vw;
    margin-top: 48vh;
  }
  .StackA6{
    margin-left: 14vw;
    margin-top: 60vh;
  }
  .StackB6{
    margin-left: 26vw;
    margin-top: 60vh;
  }
  .StackC6{
    margin-left: 38vw;
    margin-top: 60vh;
  }
  .StackD6{
    margin-left: 50vw;
    margin-top: 60vh;
  }
  .StackE6{
    margin-left: 62vw;
    margin-top: 60vh;
  }
  .StackA7{
    margin-left: 14vw;
    margin-top: 70.5vh;
  }
  .StackB7{
    margin-left: 26vw;
    margin-top: 70.5vh;
  }
  .StackC7{
    margin-left: 38vw;
    margin-top: 70.5vh;
  }
  .StackD7{
    margin-left: 50vw;
    margin-top: 70.5vh;
  }
  .StackE7{
    margin-left: 62vw;
    margin-top: 70.5vh;
  }
  .WrongLocation{
    position: absolute;
    margin-left: 78vw;
    margin-top: 3vh;
    width:20vw;
    height: 12vh;
    background-color:#ffad3a;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  .OnlySetpoint{
    position: absolute;
    margin-left: 78vw;
    margin-top: 48vh;
    width:20vw;
    height: 12vh;
    background-color:#89fffd;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  .Magazine{
    position: absolute;
    margin-left: 78vw;
    margin-top: 65vh;
    width:20vw;
    height: 12vh;
    background-color:#37a5ef;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
  }
  #StackLayout{
    margin-top: 10vh;
  }
  .ContainerMonitoringEFPSpecLocation{
    text-align: center;
    font-size: 0.9vw;
    margin: 0.2vw;
    width: calc(100vw / 8);
    height: calc(90vw / 4.1);
    background-color: transparent;
    visibility: hidden;
    border-radius:5px;
    -moz-border-radius:5px;
    box-shadow:0 0 50px #688099;
    -moz-box-shadow:0 0 50px #688099;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: 0 0 50px #688099;
    cursor: pointer;
    position: relative;
  }
  .ContainerMonitoringEFPSpecLocation h1{
    margin-top: 0;
    text-align: center;
    text-align: center;
    font-size: 1.5vw;
    width: 100%;
  }
  .ContainerMonitoringEFPSpecLocation p{
    text-align: center;
    text-align: center;
    margin-top: 0;
    font-size: 1.2vw;
    width: 100%;
  }
  .ToBeMonitored{
    background-color: #ffae91;
  }
  .RecentlyMonitored{
    background-color: #9acd32;
  }
  .MonitoredNotPluggedIn{
    background-color: #FFFFFF;
  }
  /*Monitoring DETAIL CONTAINER-------------------------------------------------------- */
  .ContainerMonitoringDetail{
    width: 100vw;
    height: 47vh;
    border: 0.05vw solid black;
    position: relative;
    float: left;
    display: none;
  }
  .ContainerMonitoringDetail h1{
    font-size: 8vw;
  }
  .ContainerMonitoringDetail h2{
    font-size: 3vw;
  }
  .ContainerMonitoringDetail h3{
    font-size: 2vw;
  }
  #CommodityMonitoring{
    width: 100%;
  }
  #ContainerNumber{
    margin-top: 10vh;
    float:left;
    width:100%;
    margin-left: 1vw;
    text-align: left;
  }
  #ContainerMonitoringInfoText{
    float: left;
    width: 30%;
    font-size: 0.5vw;
    text-align: center;
  }
  #MonitoringHistory{
    float:left;
    width:60%;
  }
  #MonitoringHistory{
    margin-left: 10px;
  }

  #SaveBtnMonitoring button{
    width:100%;
    background:#0F0;
    display: none;
  }
  #EstimateOverLay > .modal-dialog {
    margin-top: 1rem;
  }
  .bbRegularMessage > .modal-dialog {
    max-width: 98vw;
  }
}

.Plugged{
  background-color: #42eef4;
}
.NotPlugged{
  background-color: rgb(237, 136, 99);
}
#loginformnotloggedintable{
  text-align: center;
  width: 98vw;
  border: 1px solid black;
}
#LoggedIn{
  background: rgba(148, 240, 190, .5);
  padding: 1%;
  width: 100vw;
  border-radius:10px;
  -moz-border-radius:10px;
  box-shadow:0 0 2px #3399FF;
  -moz-box-shadow:0 0 2px #3399FF;
  -webkit-border-radius: 10px;
  -webkit-box-shadow: 0 0 2px #3399FF;
}
.ImageClass{
  width: 20vw;
  margin: auto;
}
.SmallImageClass{
  width: 10%;
  height: auto;
  margin-left: 0%;
}
.InputTypeText{
  margin: auto;
  width: 90vw;
  text-decoration: none;
  color:#000;
  background-color: #FFFFFF;
  padding: 1%;
  border-radius:1%;
  -moz-border-radius:1%;
  box-shadow:0 0 1px #3399FF;
  -moz-box-shadow:0 0 1px #3399FF;
  -webkit-border-radius: 1%;
  -webkit-box-shadow: 0 0 1px #3399FF;
}
.InputTypeText:active{
  box-shadow:0 0 1px #E30613;
  -moz-box-shadow:0 0 1px #E30613;
  -webkit-box-shadow: 0 0 1px #E30613;
}
.SubmitBtn{
  width:90vw;
  text-decoration: none;
  color:#000;
  background-color: #FFFFFF;
  padding: 1%;
  border-radius:1%;
  -moz-border-radius:1%;
  box-shadow:0 0 1px #3399FF;
  -moz-box-shadow:0 0 1px #3399FF;
  -webkit-border-radius: 1%;
  -webkit-box-shadow: 0 0 1px #3399FF;
}
.SubmitBtn:hover{
  background-color: #E30613;
  box-shadow:0 0 1px #E30613;
  -moz-box-shadow:0 0 1px #E30613;
  -webkit-box-shadow: 0 0 1px #E30613;
}
.SubmitBtn:active{
  background-color: #E30613;
  box-shadow:0 0 1px #E30613;
  -moz-box-shadow:0 0 1px #E30613;
  -webkit-box-shadow: 0 0 1px #E30613;
}
@media only screen and (max-width: 1200px)  {
  .StackMenuRb>.btn {
    padding: 2px;
  }
  .References-modal-body > button, #SubmitTheCommentBtn, #ConvertToContainerNumbersACNM  {
    font-size: 0.8rem;
  }
  #StackContentTableWrapper:has( > .StackThickness15) {
    width: calc(97vw - calc((100vw / 14) * 2));
    overflow-x: scroll;
  }
  .DeletePreRegistration {
    font-size: 0.6rem !important;
    padding: 5px !important;
  }
  .UnAcceptedGateTaskBtn {
    display: flex;
    width: 60px;
    height: 60px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 5px;
    font-size: 0.6rem;
  }
  .AcceptedGateTaskBtn {
    display: flex;
    width: 100px;
    height: 60px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0px;
    font-size: 0.7rem;
  }
  .AcceptedGateTaskBtn > p {
    margin-bottom: 0;
    padding: 5px;
  }
  .AcceptedGateTaskBtn > p:first-child {
    padding-top: 5px;
    padding-bottom: 5px;
  }
  .AcceptedGateTaskBtn > p:nth-child(2) {
    padding-bottom: 5px;
  }
}
.EUJ10, .EUJ20, .EUJ21, .EUJ30, .EUJ31, .EUJ99, .EUJ40{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.EUJ30, .EUJ31{
  width: 20%;
  height: 11%;
}
.EUJ30{
  left: 35%;
  bottom:50%;
  background-color: #ffffff;
}
.EUJ31{
  left: 35%;
  bottom: 38%;
  background-color: #ffffff;
}
.EUJ10{
  bottom: 15%;
  right: 20%;
  width: 11%;
  height: 11%;
}
.EUJ20{
  bottom: 15%;
  left: 15%;
  width: 11%;
  height: 11%;
}
.EUJ21{
  bottom: 0%;
  left: 15%;
  width: 11%;
  height: 11%;
}
.WorkShopIctc1{
  position: absolute;
  top: 5%;
  left: 20%;
  width: 60%;
  height: 14%;
  border: 0.1vw solid black;
  background-color: red;
}
.EUJ99{
  top: 15%;
  left: 20%;
  width: 60%;
  height: 5%;
  border: 0.1vw solid black;
  background-color: red;
}
.EUJ40{
  top: 5%;
  left: 10%;
  width: 10%;
  height: 20%;
}
.MegaKLabels01{
  position: absolute;
  left : 32%;
  bottom : 47%;
  width:2%;
  height: 5%;
  text-align: center;
}
.LabelPtiK{
  position: relative;
  top:3%;
}
/*EUA CONTENT---------------------------------------------------- */
.MegaGLabels01{
  position: absolute;
  left: 0%;
  bottom : 0%;
  width:20%;
  height: 10%;
  text-align: center;
}
.GateInZone{
  position: relative;
  bottom:0%;
  left: 20%;
}
.MegaGLabels02{
  position: absolute;
  right: 3%;
  bottom : 6%;
  width:20%;
  height: 10%;
  text-align: center;
}
.PickUpZoneEUA{
  position: relative;
  bottom:0%;
  left: 20%;
  font-size: 1.2em;
}
.EUAContent{
  width: 100vw;
  height: 68vh;
}
.EUA06,.EUA07,.EUA08,.EUA09,.EUA10, .EUA11, .EUA12, .EUA13, .EUA14, .EUA15, .EUA16, .EUA17, .EUA20, .EUA21, .EUA22, .EUA23, .EUA24, .EUA25, .EUA30, .EUA31, .EUA32, .EUA33, .EUA34, .EUA35, .EUA36, .EUA37, .EUA40, .EUA41, .EUA42, .EUA43, .EUA44, .EUA45, .EUA46, .EUA47, .EUA50, .EUA60, .EUA70, .EUA80, .EUA90{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.EUA10, .EUA11, .EUA12, .EUA13, .EUA14, .EUA15, .EUA16, .EUA17{
  width: 11%;
  height: 6%;
}
.EUA10, .EUA12, .EUA14, .EUA16{
  left: 0%;
}
.EUA11, .EUA13, .EUA15, .EUA17{
  left: 11%;
}
.EUA16, .EUA17{
  top: 6%;
}
.EUA14, .EUA15{
  top: 13%;
}
.EUA12, .EUA13{
  top: 28%;
}
.EUA10, .EUA11{
  top: 35%;
}
.EUA06,.EUA07,.EUA08,.EUA09,.EUA20, .EUA21, .EUA22, .EUA23, .EUA24, .EUA25, .EUA30, .EUA31, .EUA32, .EUA33, .EUA34, .EUA35, .EUA36, .EUA37, .EUA40, .EUA41, .EUA42, .EUA43, .EUA44, .EUA45, .EUA46, .EUA47{
  width: 3.7%;
  height: 26.6%;
}
.EUA07,.EUA09,.EUA21, .EUA23, .EUA25, .EUA31, .EUA33, .EUA35,.EUA37, .EUA41, .EUA43, .EUA45, .EUA47{
  top: 0%;
}
.EUA06,.EUA08,.EUA20,.EUA22, .EUA24, .EUA30, .EUA32, .EUA34,.EUA36, .EUA40, .EUA42, .EUA44, .EUA46{
  top: 27%;
}
.EUA06,.EUA07{
  left: 29%;
}
.EUA08,.EUA09{
  left: 33%;
}
.EUA21,.EUA20{
  left: 37%;
}
.EUA23, .EUA22{
  left: 41%;
}
.EUA25, .EUA24{
  left: 45%;
}
.EUA31,.EUA30{
  left: 49%;
}
.EUA33, .EUA32{
  left: 53%;
}
.EUA35, .EUA34{
  left: 57%;
}
.EUA37, .EUA36{
  left: 61%;
}
.EUA40, .EUA41{
  left: 65%;
}
.EUA42, .EUA43{
  left: 69%;
}
.EUA44, .EUA45{
  left: 73%;
}
.EUA46, .EUA47{
  left: 77%;
}
.EUA51,.EUA52,.EUA53,.EUA54,.EUA55,.EUA56{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 7.5%;
  left: 84%;
}
.EUA51{
  top: 8%;
}
.EUA52{
  top: 16%;
}
.EUA53{
  top: 24%;
}
.EUA54{
  top: 32%;
}
.EUA55{
  top: 40%;
}
.EUA56{
  top: 48%;
}

.EUA50, .EUA60, .EUA70, .EUA80, .EUA90{
  width: 8.8%;
  height: 12.5%;
  top: 77%;
}
.EUA90{
  left: 32%;
}
.EUA80{
  left: 42%;
}
.EUA70{
  left: 52%;
}
.EUA60{
  left: 62%;
}
.EUA50{
  left: 72%;
}
.EUA91, .EUA92, .EUA93, .EUA94, .EUA95{
  width: 5%;
  height: 5%;
  top: 77%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUA91{
  left: 0%;
}
.EUA92{
  left: 6%;
}
.EUA93{
  left: 12%;
}
.EUA94{
  left: 18%;
}
.EUA95{
  left: 24%;
}
/*EINDE EUA CONTENT---------------------------------------------------- */
/*EUB CONTENT---------------------------------------------------- */
.EUBContent > div {
  cursor: pointer;
}
.EUB40, .EUB41, .EUB42, .EUB43, .EUB44, .EUB45, .EUB46, .EUB47, .EUB48, .EUB49, .EUB50, .EUB51{
  width: 5%;
  height: 5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUB18, .EUB19{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 41%;
}
.EUB16, .EUB17{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 36%;
}
.EUB14, .EUB15{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 31%;
}
.EUB12, .EUB13{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 26%;
}
.EUB10, .EUB11{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 21%;
}
.EUB08, .EUB09{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 16%;
}
.EUB06, .EUB07{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 11%;
}
.EUB54, .EUB55{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 6%;
}
.EUB52, .EUB53{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  left: 1%;
}
.EUB20, .EUB21, .EUB22, .EUB23, .EUB24, .EUB25, .EUB26, .EUB27, .EUB28, .EUB29{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUB30, .EUB31, .EUB32, .EUB33, .EUB34, .EUB35, .EUB36, .EUB37, .EUB38, .EUB39{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUB20, .EUB21{
  left: 46%;
}
.EUB22, .EUB23{
  left: 51%;
}
.EUB24, .EUB25{
  left: 56%;
}
.EUB26, .EUB27{
  left: 61%;
}
.EUB28, .EUB29{
  left: 66%;
}
.EUB30, .EUB31{
  left: 71%;
}
.EUB32, .EUB33{
  left: 76%;
}
.EUB34, .EUB35{
  left: 81%;
}
.EUB36, .EUB37{
  left: 86%;
}
.EUB38, .EUB39{
  left: 91%;
}

.EUB52,.EUB54,.EUB06,.EUB08,.EUB10,.EUB12,.EUB14,.EUB16,.EUB18,.EUB20, .EUB22, .EUB24, .EUB26, .EUB28, .EUB30, .EUB32, .EUB34, .EUB36, .EUB38{
  bottom: 5.5%;
}
.EUB53,.EUB55,.EUB07, .EUB09,.EUB11,.EUB13,.EUB15,.EUB17,.EUB19, .EUB21, .EUB23, .EUB25, .EUB27, .EUB29, .EUB31, .EUB33, .EUB35, .EUB37, .EUB39{
  bottom: 18%;
}
.EUB86, .EUB87, .EUB74, .EUB75, .EUB76, .EUB77, .EUB78, .EUB79,.EUB60, .EUB61, .EUB62, .EUB63, .EUB64, .EUB65, .EUB66, .EUB67, .EUB68, .EUB69{
  bottom: 50%;
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUB60{
  left: 0%;
}
.EUB61{
  left: 5%;
}
.EUB62{
  left: 10%;
}
.EUB63{
  left: 15%;
}
.EUB64{
  left: 20%;
}
.EUB65{
  left: 25%;
}
.EUB66{
  left: 35%;
}
.EUB67{
  left: 40%;
}
.EUB68{
  left: 45%;
}
.EUB69{
  left: 50%;
}
.EUB74{
  left: 55%;
}
.EUB75{
  left: 60%;
}
.EUB76{
  left: 65%;
}
.EUB77{
  left: 70%;
}
.EUB78{
  left: 75%;
}
.EUB79{
  left: 80%;
}
.EUB86{
  left: 85%;
}
.EUB87{
  left: 90%;
}
.EUB70, .EUB71, .EUB72, .EUB73{
  width: 11%;
  height: 5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
}
.EUB70,.EUB72{
  left: 28%;
}
.EUB71,.EUB73{
  left: 39%;
}
.EUB80, .EUB81, .EUB82, .EUB83, .EUB84, .EUB85, .EUB90, .EUB91, .EUB92, .EUB93, .EUB94, .EUB95{
  width: 10%;
  height: 5%;
  position: absolute;
  border: 0.05vw solid black;
  cursor: pointer;
  text-align: center;
  font-size: 1vw;
  cursor: pointer;
}
.EUB96,.EUB97,.EUB98,.EUB99{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  left: 45%;
  width:5%;
  height: 5%;
  cursor: pointer;
}
.EUB96{
  top:2%;
}
.EUB97{
  top:7%;
}
.EUB98{
  top:12%;
}
.EUB99{
  top:17%;
}
.EUB01,.EUB02,.EUB03,.EUB04{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  left: 50%;
  width:5%;
  height: 5%;
  cursor: pointer;
}
.EUB01{
  top:2%;
}
.EUB02{
  top:7%;
}
.EUB03{
  top:12%;
}
.EUB04{
  top:17%;
}
.EUB80, .EUB82, .EUB84, .EUB90, .EUB92, .EUB94{
  left: 60%;
}
.EUB81, .EUB83, .EUB85, .EUB91, .EUB93, .EUB95{
  left: 70%;
}
.EUB80, .EUB81{
  top:0%;
}
.EUB82, .EUB83{
  top: 5.5%;
}
.EUB84, .EUB85{
  top: 11%;
}
.EUB90, .EUB91{
  top: 16.5%;
}
.EUB92, .EUB93, .EUB94, .EUB95{
  top: 22%;
}
.EUB94, .EUB95{
  top: 27.5%;
}
.BUFFER{
  width: 25%;
  height: 22%;
  position: absolute;
  border: 0.05vw solid black;
  background-color: #808080;
  text-align: center;
  font-size: 1vw;
  top: 0;
  left: 0;
}
.BUFFERC{
  width: 15%;
  height: 22%;
  position: absolute;
  border: 0.05vw solid black;
  background-color: #808035;
  text-align: center;
  font-size: 1vw;
  top: 0;
  left: 25%;
}

.EUB40, .EUB42, .EUB44, .EUB46, .EUB48, .EUB50{
  left: 0%;
}
.EUB41, .EUB43, .EUB45, .EUB47, .EUB49, .EUB51{
  left: 5.5%;
}
.EUB40, .EUB41{
  bottom: 5%;
}
.EUB42, .EUB43{
  bottom: 10.5%;
}
.EUB44, .EUB45{
  bottom: 16%;
}
.EUB46, .EUB47{
  bottom: 21.5%;
}
.EUB48, .EUB49{
  bottom: 27%;
}
.EUB50, .EUB51{
  bottom: 32.5%;
}
.EUB72,.EUB73{
  bottom: 65.5%;
}
.EUB70,.EUB71{
  bottom: 71%;
}
/*EINDE EUB CONTENT---------------------------------------------------- */
/*EUM CONTENT---------------------------------------------------- */
.MegaMOverview {
  left: 16%;
  top: 4%;
  width: 16%;
  height: 7%;
}
.EUMContent > div {
  cursor: pointer;
}

.EUM01,.EUM02,.EUM03,.EUM04,.EUM05,.EUM06,.EUM07,.EUM08,.EUM09,.EUM10,.EUM11,.EUM12,.EUM13,.EUM14,.EUM15,.EUM16,.EUM17,.EUM18,.EUM19,.EUM20,.EUM21,.EUM22,.EUM23,.EUM24,.EUM25,.EUM26,.EUM27,.EUM28,.EUM29,.EUM30,.EUM31,.EUM32,.EUM33,.EUM34,.EUM35,.EUM36,.EUM37,.EUM38,.EUM39,.EUM40,.EUM41,.EUM42,.EUM43,.EUM44,.EUM45,.EUM46,.EUM47,.EUM48,.EUM49,.EUM50,.EUM51,.EUM52,.EUM53,.EUM54,.EUM55,.EUM56,.EUM57,.EUM58,.EUM59,.EUM60,.EUM61,.EUM62,.EUM63,.EUM64,.EUM65,.EUM66,.EUM67,.EUM68,.EUM69,.EUM70,.EUM71,.EUM72,.EUM73,.EUM74,.EUM75,.EUM76{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 5%;
}
.EUM01,.EUM02,.EUM03,.EUM04,.EUM05,.EUM06,.EUM07,.EUM08,.EUM09,.EUM10,.EUM11,.EUM12,.EUM13,.EUM14,.EUM15,.EUM16{
  left: 5%;
}
.EUM01{
  top:5%;
}
.EUM02{
  top:10.5%;
}
.EUM03{
  top:16%;
}
.EUM04{
  top:21.5%;
}
.EUM05{
  top:27%;
}
.EUM06{
  top:32.5%;
}
.EUM07{
  top:38%;
}
.EUM08{
  top:43.5%;
}
.EUM09{
  top:49%;
}
.EUM10{
  top:54.5%;
}
.EUM11{
  top:60%;
}
.EUM12{
  top:65.5%;
}
.EUM13{
  top:71%;
}
.EUM14{
  top:76.5%;
}
.EUM15{
  top:81%;
}
.EUM16{
  top:86.5%;
}

.EUM21,.EUM22,.EUM23,.EUM24,.EUM25,.EUM26,.EUM27,.EUM28,.EUM29,.EUM30,.EUM31,.EUM32,.EUM33,.EUM34,.EUM35,.EUM36{
  left: 20.5%;
}
.EUM21{
  top:5%;
}
.EUM22{
  top:10.5%;
}
.EUM23{
  top:16%;
}
.EUM24{
  top:21.5%;
}
.EUM25{
  top:27%;
}
.EUM26{
  top:32.5%;
}
.EUM27{
  top:38%;
}
.EUM28{
  top:43.5%;
}
.EUM29{
  top:49%;
}
.EUM30{
  top:54.5%;
}
.EUM31{
  top:60%;
}
.EUM32{
  top:65.5%;
}
.EUM33{
  top:71%;
}
.EUM34{
  top:76.5%;
}
.EUM35{
  top:81%;
}
.EUM36{
  top:86.5%;
}
.EUM41,.EUM42,.EUM43,.EUM44,.EUM45,.EUM46,.EUM47,.EUM48,.EUM49,.EUM50,.EUM51,.EUM52,.EUM53,.EUM54,.EUM55,.EUM56{
  right: 20.55%;
}
.EUM41{
  top:5%;
}
.EUM42{
  top:10.5%;
}
.EUM43{
  top:16%;
}
.EUM44{
  top:21.5%;
}
.EUM45{
  top:27%;
}
.EUM46{
  top:32.5%;
}
.EUM47{
  top:38%;
}
.EUM48{
  top:43.5%;
}
.EUM49{
  top:49%;
}
.EUM50{
  top:54.5%;
}
.EUM51{
  top:60%;
}
.EUM52{
  top:65.5%;
}
.EUM53{
  top:71%;
}
.EUM54{
  top:76.5%;
}
.EUM55{
  top:81%;
}
.EUM56{
  top:86.5%;
}

.EUM61,.EUM62,.EUM63,.EUM64,.EUM65,.EUM66,.EUM67,.EUM68,.EUM69,.EUM70,.EUM71,.EUM72,.EUM73,.EUM74,.EUM75,.EUM76{
  right: 5%;
}
.EUM61{
  top:5%;
}
.EUM62{
  top:10.5%;
}
.EUM63{
  top:16%;
}
.EUM64{
  top:21.5%;
}
.EUM65{
  top:27%;
}
.EUM66{
  top:32.5%;
}
.EUM67{
  top:38%;
}
.EUM68{
  top:43.5%;
}
.EUM69{
  top:49%;
}
.EUM70{
  top:54.5%;
}
.EUM71{
  top:60%;
}
.EUM72{
  top:65.5%;
}
.EUM73{
  top:71%;
}
.EUM74{
  top:76.5%;
}
.EUM75{
  top:81%;
}
.EUM76{
  top:86.5%;
}
/*EUC CONTENT---------------------------------------------------- */
.MegaCLabels01{
  position: absolute;
  left: 5%;
  bottom : 35%;
  width:40%;
  height: 8%;
  text-align: center;
}
.LabelCheckZoneEUC{
  position: relative;
  top:8%;
}
.LabelPickUpZoneEUC{
  position: relative;
  bottom:-300%;
  left:120%;
}
.EUC11,.EUC13,.EUC15,.EUC17,.EUC19,.EUC21,.EUC23,.EUC31,.EUC33,.EUC35,.EUC37,.EUC39,.EUC41,.EUC43{
  display: none;
  }
.EUC10,.EUC11,.EUC12,.EUC13,.EUC14,.EUC15,.EUC16,.EUC17,.EUC18,.EUC19,.EUC20,.EUC21,.EUC22,.EUC23,.EUC24,.EUC26,.EUC30,.EUC31,.EUC32,.EUC33,.EUC34,.EUC35,.EUC36,.EUC37,.EUC38,.EUC39,.EUC40,.EUC41,.EUC42,.EUC43{
  width: 5%;
  height: 12.5%;
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.EUC10,.EUC11,.EUC30,.EUC31{
  left: 5%;
}
.EUC12,.EUC13,.EUC32,.EUC33{
  left: 11%;
}
.EUC14,.EUC15,.EUC34,.EUC35{
  left: 17%;
}
.EUC16,.EUC17,.EUC36,.EUC37{
  left: 23%;
}
.EUC18,.EUC19,.EUC38,.EUC39{
  left: 29%;
}
.EUC20,.EUC21,.EUC40,.EUC41{
  left: 35%;
}
.EUC22,.EUC23,.EUC42,.EUC43{
  left: 41%;
}
.EUC24{
  left: 47%;
}
.EUC26{
  left: 53%
}
.EUC50,.EUC51,.EUC52,.EUC53,.EUC54,.EUC55,.EUC56,.EUC57,.EUC58,.EUC59,.EUC60,.EUC61,.EUC62,.EUC63,.EUC70,.EUC71,.EUC72,.EUC73,.EUC74,.EUC75,.EUC76,.EUC77{
  width: 5%;
  height: 20%;
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.EUC50,.EUC51{
  left:48%;
}
.EUC52,.EUC53{
  left:54%;
}
.EUC54,.EUC55{
  left:60%;
}
.EUC56,.EUC57{
  left:66%;
}
.EUC58,.EUC59{
  left:72%;
}
.EUC60,.EUC61{
  left:78%;
}
.EUC62,.EUC63{
  left:84%;
}
.EUC70,.EUC71,.EUC72,.EUC73,.EUC74,.EUC75,.EUC76,.EUC77{
  left:90%;
  height: 10%;
}
.EUC70{
  top: 1%;
}
.EUC71{
  top: 11.5%;
}
.EUC72{
  top: 22%;
}
.EUC73{
  top: 33.5%;
}
.EUC74{
  top: 44%;
}
.EUC75{
  top: 54.5%;
}
.EUC76{
  top: 65%;
}
.EUC77{
  top: 75.5%;
}
.EUC51,.EUC53,.EUC55,.EUC57,.EUC59,.EUC61,.EUC63{
  top:1%;
}
.EUC50,.EUC52,.EUC54,.EUC56,.EUC58,.EUC60,.EUC62{
  top:21%;
}
.EUC10,.EUC12,.EUC14,.EUC16,.EUC18,.EUC20,.EUC22,.EUC24,.EUC26{
  bottom: 5%;
}
.EUC30,.EUC32,.EUC34,.EUC36,.EUC38,.EUC40,.EUC42{
  bottom: 50%;
}
.EUC11,.EUC13,.EUC15,.EUC17,.EUC19,.EUC21,.EUC23{
  bottom: 17.5%;
}
.EUC31,.EUC33,.EUC35,.EUC37,.EUC39,.EUC41,.EUC43{
  bottom: 62.5%;
}
/*EINDE EUC CONTENT---------------------------------------------------- */
/*EUD CONTENT---------------------------------------------------- */
.MegaDLabels01 {
  position: absolute;
  left: 5%;
  top : 35%;
  width:30%;
  height: 10%;
  text-align: center;
}
.LabelLightRepairEUD {
  position: relative;
  top:4%;
}
.EUD10, .EUD11,.EUD12, .EUD13, .EUD14, .EUD15, .EUD16, .EUD17, .EUD18, .EUD19, .EUD20, .EUD21, .EUD22, .EUD23, .EUD24, .EUD25, .EUD26, .EUD27 {
  width: 5%;
  height: 15%;
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.EUD10, .EUD11 {
  left:5%;
}
.EUD12, .EUD13{
  left:11%;
}
.EUD14,.EUD15{
  left:17%;
}
.EUD16, .EUD17 {
  left:23%;
}
.EUD18, .EUD19 {
  left:29%;
}
.EUD20, .EUD21 {
  left:35%;
}
.EUD22, .EUD23 {
  left:41%;
}
.EUD24, .EUD25 {
  left:47%;
}
.EUD26, .EUD27 {
  left:53%;
}
.EUD11, .EUD13, .EUD15, .EUD17, .EUD19, .EUD21, .EUD23, .EUD25, .EUD27 {
  bottom:20%;
}
.EUD10, .EUD12, .EUD14, .EUD16, .EUD18, .EUD20, .EUD22, .EUD24, .EUD26 {
  bottom: 5%;
}
.EUD50, .EUD51, .EUD52, .EUD53, .EUD54, .EUD55, .EUD56, .EUD57, .EUD58, .EUD59, .EUD60, .EUD61, .EUD62, .EUD63, .EUD64, .EUD65 {
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 15%;
}
.EUD51, .EUD53, .EUD55, .EUD57, .EUD59, .EUD61, .EUD63, .EUD65{
  top: 0%;
}
.EUD50, .EUD52, .EUD54, .EUD56, .EUD58, .EUD60, .EUD62, .EUD64{
  top:15%;
}
.EUD50, .EUD51{
  left: 1%;
}
.EUD52, .EUD53{
  left: 6.5%;
}
.EUD54, .EUD55{
  left: 12%;
}
.EUD56, .EUD57{
  left: 17.5%;
}
.EUD58, .EUD59{
  left: 23%;
}
.EUD60, .EUD61{
  left: 28.5%;
}
.EUD62, .EUD63{
  left: 34%;
}
.EUD64, .EUD65{
  left: 39.5%;
}
.EUD30,.EUD31,.EUD32,.EUD33,.EUD34,.EUD35,.EUD36,.EUD37,.EUD38,.EUD39,.EUD40,.EUD41,.EUD42,.EUD43,.EUD44,.EUD45,.EUD46,.EUD47,.EUD48,.EUD49{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 5%;
}
.EUD30,.EUD31{
  top: 20%;
}
.EUD32,.EUD33{
  top: 25.5%;
}
.EUD34,.EUD35{
  top: 31%;
}
.EUD36,.EUD37{
  top: 36.5%;
}
.EUD38,.EUD39{
  top: 42%;
}
.EUD40,.EUD41{
  top: 47.5%;
}
.EUD42,.EUD43{
  top: 53%;
}
.EUD44,.EUD45{
  top: 58.5%;
}
.EUD46,.EUD47{
  top: 64%;
}
.EUD48,.EUD49{
  top: 69.5%;
}
.EUD30,.EUD32,.EUD34,.EUD36,.EUD38,.EUD40,.EUD42,.EUD44,.EUD46,.EUD48{
  right: 20%;
}
.EUD31,.EUD33,.EUD35,.EUD37,.EUD39,.EUD41,.EUD43,.EUD45,.EUD47,.EUD49{
  right: 5%;
}
.EUD70,.EUD71,.EUD72,.EUD73,.EUD74,.EUD75{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 15%;
  bottom: 5%
}
.EUD75{
  right: 3%;
}
.EUD74{
  right: 9%;
}
.EUD73{
  right: 15%;
}
.EUD72{
  right: 21%;
}
.EUD71{
  right: 27%;
}
.EUD70{
  right: 33%;
}

/*EINDE EUD CONTENT---------------------------------------------------- */
/*EUE CONTENT---------------------------------------------------- */
.EUE10,.EUE11,.EUE12,.EUE13,.EUE14,.EUE15,.EUE16,.EUE17,.EUE18,.EUE19,.EUE20,.EUE21,.EUE22,.EUE23,.EUE24,.EUE25,.EUE26,.EUE27,.EUE28,.EUE29,.EUE30,.EUE31,.EUE32,.EUE33,.EUE34,.EUE35,.EUE36,.EUE37{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 5%;
}
.EUE40,.EUE41,.EUE42,.EUE43,.EUE44,.EUE45,.EUE46,.EUE47,.EUE48,.EUE49,.EUE50,.EUE51,.EUE52,.EUE53,.EUE54,.EUE55,.EUE56,.EUE57,.EUE58,.EUE59,.EUE60,.EUE61,.EUE62,.EUE63,.EUE64,.EUE65,.EUE66,.EUE67{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 5%;
}
.EUE10,.EUE11,.EUE40,.EUE41{
  bottom: 5%;
}
.EUE12,.EUE13,.EUE42,.EUE43{
  bottom: 10.5%;
}
.EUE14,.EUE15,.EUE44,.EUE45{
  bottom: 16%;
}
.EUE16,.EUE17,.EUE46,.EUE47{
  bottom: 21.5%;
}
.EUE18,.EUE19,.EUE48,.EUE49{
  bottom: 27%;
}
.EUE20,.EUE21,.EUE50,.EUE51{
  bottom: 32.5%;
}
.EUE22,.EUE23,.EUE52,.EUE53{
  bottom: 38%;
}
.EUE24,.EUE25,.EUE54,.EUE55{
  bottom: 43.5%;
}
.EUE26,.EUE27,.EUE56,.EUE57{
  bottom: 49%;
}
.EUE28,.EUE29,.EUE58,.EUE59{
  bottom: 54.5%;
}
.EUE30,.EUE31,.EUE60,.EUE61{
  bottom: 60%;
}
.EUE62,.EUE63{
  bottom: 65.5%;
}
.EUE64,.EUE65{
  bottom: 71%;
}
.EUE66,.EUE67{
  bottom: 76.5%;
}
.EUE32,.EUE33{
  bottom: 65.5%;
}
.EUE34,.EUE35{
  bottom: 71%;
}
.EUE36,.EUE37{
  bottom: 76.5%;
}
.EUE10,.EUE12,.EUE14,.EUE16,.EUE18,.EUE20,.EUE22,.EUE24,.EUE26,.EUE28,.EUE30,.EUE32,.EUE34,.EUE36{
  left: 5%;
}
.EUE11,.EUE13,.EUE15,.EUE17,.EUE19,.EUE21,.EUE23,.EUE25,.EUE27,.EUE29,.EUE31,.EUE33,.EUE35,.EUE37{
  left: 20%;
}
.EUE40,.EUE42,.EUE44,.EUE46,.EUE48,.EUE50,.EUE52,.EUE54,.EUE56,.EUE58,.EUE60,.EUE62,.EUE64,.EUE66{
  left: 65%;
}
.EUE41,.EUE43,.EUE45,.EUE47,.EUE49,.EUE51,.EUE53,.EUE55,.EUE57,.EUE59,.EUE61,.EUE63,.EUE65,.EUE67{
  left: 80%;
}
.EUE70,.EUE71,.EUE72,.EUE73,.EUE74,.EUE75{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 10%;
  top: 6%
}
.EUE75{
  right: 7%;
}
.EUE74{
  right: 13%;
}
.EUE73{
  right: 19%;
}
.EUE72{
  right: 25%;
}
.EUE71{
  right: 31%;
}
.EUE70{
  right: 37%;
}
.EUE80,.EUE81,.EUE82,.EUE83,.EUE84,.EUE85{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 10%;
  top: 6%
}
.EUE85{
  left: 2%;
}
.EUE84{
  left: 8%;
}
.EUE83{
  left: 14%;
}
.EUE82{
  left: 20%;
}
.EUE81{
  left: 26%;
}
.EUE80{
  left: 32%;
}
/*EINDE EUE CONTENT---------------------------------------------------- */
/*EUF CONTENT---------------------------------------------------- */
.EUF10,.EUF11,.EUF12,.EUF13,.EUF14,.EUF15,.EUF16,.EUF17,.EUF18,.EUF19,.EUF20,.EUF21,.EUF22,.EUF23,.EUF24,.EUF25,.EUF26,.EUF27,.EUF28,.EUF29,.EUF30,.EUF31,.EUF32,.EUF33,.EUF34,.EUF35{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUF40,.EUF41,.EUF42,.EUF43,.EUF44,.EUF45,.EUF50,.EUF51,.EUF52,.EUF53,.EUF54,.EUF55,.EUF56,.EUF57,.EUF58,.EUF59,.EUF60,.EUF61,.EUF62,.EUF63,.EUF64,.EUF65,.EUF66,.EUF67,.EUF68,.EUF69{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUF10,.EUF11{
  bottom: 10.5%;
}
.EUF12,.EUF13{
  bottom: 17%;
}
.EUF14,.EUF15{
  bottom: 23.5%;
}
.EUF16,.EUF17{
  bottom: 30%;
}
.EUF18,.EUF19{
  bottom: 36.5%;
}
.EUF20,.EUF21{
  bottom: 43%;
}
.EUF22,.EUF23{
  bottom: 49.5%;
}
.EUF24,.EUF25{
  bottom: 56%;
}
.EUF26,.EUF27{
  bottom: 62.5%;
}
.EUF28,.EUF29{
  bottom: 69%;
}
.EUF30,.EUF31{
  bottom: 75.5%;
}
.EUF32,.EUF33{
  bottom: 82%;
}
.EUF34,.EUF35{
  bottom: 88.5%;
}
.EUF68,.EUF69{
  bottom: 10.5%;
}
.EUF66,.EUF67{
  bottom: 17%;
}
.EUF64,.EUF65{
  bottom: 23.5%;
}
.EUF62,.EUF63{
  bottom: 30%;
}
.EUF60,.EUF61{
  bottom: 36.5%;
}
.EUF58,.EUF59{
  bottom: 43%;
}
.EUF56,.EUF57{
  bottom: 49.5%;
}
.EUF54,.EUF55{
  bottom: 56%;
}
.EUF52,.EUF53{
  bottom: 62.5%;
}
.EUF50,.EUF51{
  bottom: 69%;
}
.EUF44,.EUF45{
  bottom: 78.5%;
}
.EUF42,.EUF43{
  bottom: 85%;
}
.EUF40,.EUF41{
  bottom: 91.5%;
}
.EUF10,.EUF12,.EUF14,.EUF16,.EUF18,.EUF20,.EUF22,.EUF24,.EUF26,.EUF28,.EUF30,.EUF32,.EUF34{
  left: 5%;
}
.EUF11,.EUF13,.EUF15,.EUF17,.EUF19,.EUF21,.EUF23,.EUF25,.EUF27,.EUF29,.EUF31,.EUF33,.EUF35{
  left: 20%;
}
.EUF68,.EUF66,.EUF64,.EUF62,.EUF60,.EUF58,.EUF56,.EUF54,.EUF52,.EUF50,.EUF44,.EUF42,.EUF40{
  left: 65%;
}
.EUF69,.EUF67,.EUF65,.EUF63,.EUF61,.EUF59,.EUF57,.EUF55,.EUF53,.EUF51,.EUF45,.EUF43,.EUF41{
  left: 80%;
}
.EUF70,.EUF71,.EUF72,.EUF73,.EUF74,.EUF75{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 8.5%;
  bottom: 1%
}
.EUF75{
  left: 3%;
}
.EUF74{
  left: 9%;
}
.EUF73{
  left: 15%;
}
.EUF72{
  left: 21%;
}
.EUF71{
  left: 27%;
}
.EUF70{
  left: 33%;
}
.EUF80,.EUF81,.EUF82,.EUF83,.EUF84,.EUF85{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 8.5%;
  bottom: 1%
}
.EUF85{
  right: 3%;
}
.EUF84{
  right: 9%;
}
.EUF83{
  right: 15%;
}
.EUF82{
  right: 21%;
}
.EUF81{
  right: 27%;
}
.EUF80{
  right: 33%;
}
/*EINDE EUF CONTENT---------------------------------------------------- */
/*EUT CONTENT---------------------------------------------------- */
.EUT10,.EUT11,.EUT12,.EUT13,.EUT14,.EUT15,.EUT16,.EUT17,.EUT18,.EUT19,.EUT20,.EUT21,.EUT22,.EUT23,.EUT24,.EUT25,.EUT26,.EUT27,.EUT28,.EUT29,.EUT30,.EUT31,.EUT32,.EUT33,.EUT34,.EUT35{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUT40,.EUT41,.EUT42,.EUT43,.EUT44,.EUT45,.EUT50,.EUT51,.EUT52,.EUT53,.EUT54,.EUT55,.EUT56,.EUT57,.EUT58,.EUT59,.EUT60,.EUT61,.EUT62,.EUT63,.EUT64,.EUT65,.EUT66,.EUT67,.EUT68,.EUT69{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUT10,.EUT11{
  bottom: 5.5%;
}
.EUT12,.EUT13{
  bottom: 12%;
}
.EUT14,.EUT15{
  bottom: 18.5%;
}
.EUT16,.EUT17{
  bottom: 25%;
}
.EUT18,.EUT19{
  bottom: 31.5%;
}
.EUT20,.EUT21{
  bottom: 38%;
}
.EUT22,.EUT23{
  bottom: 44.5%;
}
.EUT24,.EUT25{
  bottom: 51%;
}
.EUT26,.EUT27{
  bottom: 57.5%;
}
.EUT28,.EUT29{
  bottom: 64%;
}
.EUT30,.EUT31{
  bottom: 70.5%;
}
.EUT32,.EUT33{
  bottom: 77%;
}
.EUT34,.EUT35{
  bottom: 83.5%;
}
.EUT68,.EUT69{
  bottom: 5.5%;
}
.EUT66,.EUT67{
  bottom: 12%;
}
.EUT64,.EUT65{
  bottom: 18.5%;
}
.EUT62,.EUT63{
  bottom: 25%;
}
.EUT60,.EUT61{
  bottom: 31.5%;
}
.EUT58,.EUT59{
  bottom: 38%;
}
.EUT56,.EUT57{
  bottom: 44.5%;
}
.EUT54,.EUT55{
  bottom: 51%;
}
.EUT52,.EUT53{
  bottom: 57.5%;
}
.EUT50,.EUT51{
  bottom: 64%;
}
.EUT44,.EUT45{
  bottom: 73.5%;
}
.EUT42,.EUT43{
  bottom: 80%;
}
.EUT40,.EUT41{
  bottom: 86.5%;
}
.EUT10,.EUT12,.EUT14,.EUT16,.EUT18,.EUT20,.EUT22,.EUT24,.EUT26,.EUT28,.EUT30,.EUT32,.EUT34{
  left: 5%;
}
.EUT11,.EUT13,.EUT15,.EUT17,.EUT19,.EUT21,.EUT23,.EUT25,.EUT27,.EUT29,.EUT31,.EUT33,.EUT35{
  left: 20%;
}
.EUT68,.EUT66,.EUT64,.EUT62,.EUT60,.EUT58,.EUT56,.EUT54,.EUT52,.EUT50,.EUT44,.EUT42,.EUT40{
  left: 65%;
}
.EUT69,.EUT67,.EUT65,.EUT63,.EUT61,.EUT59,.EUT57,.EUT55,.EUT53,.EUT51,.EUT45,.EUT43,.EUT41{
  left: 80%;
}
/*EINDE EUT CONTENT---------------------------------------------------- */
/*EUG CONTENT---------------------------------------------------- */
.MegaHLabels01{
  position: absolute;
  left: 13%;
  bottom : 2%;
  width:30%;
  height: 10%;
  text-align: center;
}
.GateOutZoneEUG{
  position: relative;
  bottom:0%;
  left: 50%;
}
.EUG30,.EUG31,.EUG32,.EUG33,.EUG34,.EUG35,.EUG36,.EUG37,.EUG38,.EUG39,.EUG40,.EUG41,.EUG42,.EUG43,.EUG44,.EUG45,.EUG46,.EUG47,.EUG48,.EUG49,.EUG50,.EUG51,.EUG52,.EUG53,.EUG54,.EUG55,.EUG56,.EUG57{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUG30,.EUG31{
  bottom: 1.5%;
}
.EUG32,.EUG33{
  bottom: 8%;
}
.EUG34,.EUG35{
  bottom: 14.5%;
}
.EUG36,.EUG37{
  bottom: 21%;
}
.EUG38,.EUG39{
  bottom: 27.5%;
}
.EUG40,.EUG41{
  bottom: 34%;
}
.EUG42,.EUG43{
  bottom: 40.5%;
}
.EUG44,.EUG45{
  bottom: 47%;
}
.EUG46,.EUG47{
  bottom: 53.5%;
}
.EUG48,.EUG49{
  bottom: 60%;
}
.EUG50,.EUG51{
  bottom: 66.5%;
}
.EUG52,.EUG53{
  bottom: 73%;
}
.EUG54,.EUG55{
  bottom: 79.5%;
}
.EUG56,.EUG57{
  bottom: 85%;
}
.EUG30,.EUG32,.EUG34,.EUG36,.EUG38,.EUG40,.EUG42,.EUG44,.EUG46,.EUG48,.EUG50,.EUG52,.EUG54,.EUG56{
  left: 5%;
}
.EUG31,.EUG33,.EUG35,.EUG37,.EUG39,.EUG41,.EUG43,.EUG45,.EUG47,.EUG49,.EUG51,.EUG53,.EUG55,.EUG57{
  left: 20%;
}
.EUG22, .EUG23, .EUG24, .EUG25{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(5deg);
}
.EUG25{
  top: 2%;
  right: 7.8%;
}
.EUG24{
  top: 8%;
  right: 8%;
}
.EUG23{
  top: 14%;
  right: 8.2%;
}
.EUG22{
  top: 20%;
  right: 8.5%;
}
.EUG20, .EUG21{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(10deg);
}
.EUG21{
  top: 28%;
  right: 9%;
}
.EUG20{
  top: 34%;
  right: 9.5%;
}
.EUG10, .EUG11{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(20deg);
}
.EUG10{
  top: 41.5%;
  right: 10.7%;
}
.EUG11{
  top: 47%;
  right: 11.7%;
}
.EUG12, .EUG13{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(23deg);
}
.EUG12{
  top: 53.5%;
  right: 13%;
}
.EUG13{
  top: 59%;
  right: 14.2%;
}
.EUG14, .EUG15{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(27deg);
}
.EUG14{
  top: 65%;
  right: 16%;
}
.EUG15{
  top: 70.5%;
  right: 17.3%;
}
.EUG16, .EUG17{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(31deg);
}
.EUG16{
  top: 76.5%;
  right: 19%;
}
.EUG17{
  top: 82%;
  right: 20.5%;
}
.EUG60,.EUG61,.EUG62,.EUG63,.EUG64,.EUG65{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 4%;
  height: 8%;
  top: 0.5%
}
.EUG65{
  left: 3%;
}
.EUG64{
  left: 8%;
}
.EUG63{
  left: 13%;
}
.EUG62{
  left: 18%;
}
.EUG61{
  left: 23%;
}
.EUG60{
  left: 28%;
}
/*EINDE EUG CONTENT---------------------------------------------------- */
/*EUH CONTENT---------------------------------------------------- */
.EUH10,.EUH11,.EUH12,.EUH13,.EUH14,.EUH15,.EUH16,.EUH17,.EUH18,.EUH19,.EUH20,.EUH21,.EUH22,.EUH23,.EUH24,.EUH25,.EUH26,.EUH27,.EUH28,.EUH29,.EUH30,.EUH31,.EUH32,.EUH33,.EUH34,.EUH35{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 6%;
}
.EUH10,.EUH11{
  bottom: 15.5%;
}
.EUH12,.EUH13{
  bottom: 22%;
}
.EUH14,.EUH15{
  bottom: 28.5%;
}
.EUH16,.EUH17{
  bottom: 35%;
}
.EUH18,.EUH19{
  bottom: 41.5%;
}
.EUH20,.EUH21{
  bottom: 48%;
}
.EUH22,.EUH23{
  bottom: 54.5%;
}
.EUH24,.EUH25{
  bottom: 61%;
}
.EUH26,.EUH27{
  bottom: 67.5%;
}
.EUH28,.EUH29{
  bottom: 74%;
}
.EUH30,.EUH31{
  bottom: 80.5%;
}
.EUH32,.EUH33{
  bottom: 87%;
}
.EUH34,.EUH35{
  bottom: 93.5%;
}
.EUH10,.EUH12,.EUH14,.EUH16,.EUH18,.EUH20,.EUH22,.EUH24,.EUH26,.EUH28,.EUH30,.EUH32,.EUH34{
  left: 5%;
}
.EUH11,.EUH13,.EUH15,.EUH17,.EUH19,.EUH21,.EUH23,.EUH25,.EUH27,.EUH29,.EUH31,.EUH33,.EUH35{
  left: 20%;
}
.EUH50,.EUH51,.EUH52,.EUH53{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
  transform: rotateZ(5deg);
}
.EUH50{
  bottom: 2%;
  right: 10%;
}
.EUH51{
  bottom: 8.2%;
  right: 9.8%;
}
.EUH52{
  bottom: 14.8%;
  right: 9.5%;
}
.EUH53{
  bottom: 21%;
  right: 9.2%;
}
.EUH54,.EUH55,.EUH56,.EUH57,.EUH58,.EUH59,.EUH60,.EUH61,.EUH62,.EUH63,.EUH64{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 10%;
  height: 6%;
}
.EUH54{
  bottom: 28%;
  right: 9%;
}
.EUH55{
  bottom: 34.5%;
  right: 9%;
}
.EUH56{
  bottom: 41%;
  right: 9%;
}
.EUH57{
  bottom: 47.5%;
  right: 9%;
}
.EUH58{
  bottom: 54%;
  right: 9%;
}
.EUH59{
  bottom: 60.5%;
  right: 9%;
}
.EUH60{
  top: 28%;
  right: 9%;
}
.EUH61{
  top: 21%;
  right: 9%;
}
.EUH62{
  top: 14%;
  right: 9%;
}
.EUH63{
  top: 7%;
  right: 9%;
}
.EUH64{
  top: 0%;
  right: 9%;
}
.EUH40,.EUH41,.EUH42,.EUH43,.EUH44,.EUH45{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 12.5%;
  bottom: 2%
}
.EUH45{
  left: 3%;
}
.EUH44{
  left: 9%;
}
.EUH43{
  left: 15%;
}
.EUH42{
  left: 21%;
}
.EUH41{
  left: 27%;
}
.EUH40{
  left: 33%;
}
/*EINDE EUH CONTENT---------------------------------------------------- */
/*EUI CONTENT---------------------------------------------------- */
.EUI10,.EUI11,.EUI12,.EUI13,.EUI14,.EUI15,.EUI16,.EUI17{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 10%;
  left: 25%;
}
.EUI20,.EUI21,.EUI30,.EUI31{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 15%;
  height: 40%;
  left: 45%;
}
.EUI95,.EUI96,.EUI97,.EUI98,.EUI99{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7%;
  height: 10%;
  right: 2%
}
.EUI01,.EUI02,.EUI03,.EUI04,.EUI05{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7%;
  height: 10%;
  right: 10%
}
.EUI01,.EUI99{
  top: 15%;
}
.EUI02,.EUI98{
  top: 25%;
}
.EUI03,.EUI97{
  top: 35%;
}
.EUI04,.EUI96{
  top: 45%;
}
.EUI05,.EUI95{
  top: 55%;
}
.EUI21,.EUI31{
  left: 62%;
}
.EUI20,.EUI21{
  bottom: 6%;
}
.EUI30,.EUI31{
  bottom: 52%;
}
.EUI17{
  bottom: 89%;
}
.EUI16{
  bottom: 79%;
}
.EUI15{
  bottom: 62%;
}
.EUI14{
  bottom: 52%;
}
.EUI13{
  bottom: 40%;
}
.EUI12{
  bottom: 30%;
}
.EUI11{
  bottom: 16%;
}
.EUI10{
  bottom: 6%;
}
/*EINDE EUI CONTENT---------------------------------------------------- */
.EUL10,.EUL11,.EUL12,.EUL13,.EUL14,.EUL15,.EUL16,.EUL17,.EUL18,.EUL19{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7.5%;
  height: 5%;
  right: 5%
}
.EUL10{
  bottom: 10%;
}
.EUL11{
  bottom: 15%;
}
.EUL12{
  bottom: 20%;
}
.EUL13{
  bottom: 25%;
}
.EUL14{
  bottom: 30%;
}
.EUL15{
  bottom: 35%;
}
.EUL16{
  bottom: 40%;
}
.EUL17{
  bottom: 45%;
}
.EUL18{
  bottom: 50%;
}
.EUL19{
  bottom: 55%;
}
.EUL20,.EUL21,.EUL22,.EUL23,.EUL24,.EUL25,.EUL26,.EUL27,.EUL28,.EUL29{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7.5%;
  height: 7.5%;
  transform: rotateZ(31deg);
}
.EUL20{
  left: 48%;
  bottom: 17%;
}
.EUL21{
  left: 49.8%;
  bottom: 23.5%;
}
.EUL22{
  left: 51.6%;
  bottom: 29.8%;
}
.EUL23{
  left: 53.4%;
  bottom: 36.2%;
}
.EUL24{
  left: 55.3%;
  bottom: 42.5%;
}
.EUL25{
  left: 57.2%;
  bottom: 48.9%;
}
.EUL26{
  left: 59.1%;
  bottom: 55.4%;
}
.EUL27{
  left: 61%;
  bottom: 61.8%;
}
.EUL28{
  left: 62.9%;
  bottom: 68.2%;
}
.EUL29{
  left: 64.8%;
  bottom: 74.6%;
}
.EUL30,.EUL31,.EUL32,.EUL33,.EUL34,.EUL35,.EUL36,.EUL37,.EUL38,.EUL39{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7.5%;
  height: 7.5%;
  transform: rotateZ(31deg);
}
.EUL30{
  left: 41.3%;
  bottom: 25%;
}
.EUL31{
  left: 43.1%;
  bottom: 31.5%;
}
.EUL32{
  left: 44.9%;
  bottom: 37.8%;
}
.EUL33{
  left: 46.7%;
  bottom: 44.2%;
}
.EUL34{
  left: 48.6%;
  bottom: 50.5%;
}
.EUL35{
  left: 50.5%;
  bottom: 56.9%;
}
.EUL36{
  left: 52.4%;
  bottom: 63.4%;
}
.EUL37{
  left: 54.3%;
  bottom: 69.8%;
}
.EUL38{
  left: 56.2%;
  bottom: 76.2%;
}
.EUL39{
  left: 58.1%;
  bottom: 82.6%;
}
.EUL50,.EUL51{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7.5%;
  height: 7.5%;
  transform: rotateZ(31deg);
}
.EUL50{
  left: 28.1%;
  bottom: 82.6%;
}
.EUL51{
  left: 34.8%;
  bottom: 74.6%;
}
.EUL40,.EUL41,.EUL42,.EUL43,.EUL44,.EUL45,.EUL46,.EUL47,.EUL48,.EUL49{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 7.5%;
  height: 7.5%;
  transform: rotateZ(20deg);
}
.EUL40{
  left: 6.3%;
  bottom: 15%;
}
.EUL41{
  left: 7.5%;
  bottom: 22.0%;
}
.EUL42{
  left: 8.7%;
  bottom: 28.9%;
}
.EUL43{
  left: 10%;
  bottom: 36%;
}
.EUL44{
  left: 11.2%;
  bottom: 43%;
}
.EUL45{
  left: 12.4%;
   bottom: 50%;
}
.EUL46{
  left: 13.6%;
  bottom: 57.1%;
}
.EUL47{
  left: 14.8%;
  bottom: 64.2%;
}
.EUL48{
  left: 16%;
  bottom: 71.3%;
}
.EUL49{
  left: 17.2%;
  bottom: 78.4%;
}
.EUL60,.EUL61,.EUL62,.EUL63,.EUL64,.EUL65,.EUL66,.EUL67,.EUL68,.EUL69{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  width: 5%;
  height: 8.5%;
  bottom: 1%
}
.EUL60{
  left: 23%;
}
.EUL61{
  left: 29%;
}
.EUL62{
  left: 35%;
}
.EUL63{
  left: 41%;
}
.EUL64{
  left: 47%;
}
.EUL65{
  left: 53%;
}
.EUL66{
  left: 59%;
}
.EUL67{
  left: 65%;
}
.EUL68{
  left: 71%;
}
.EUL69{
  left: 77%;
}
.Mega1Overview, .Mega2Overview, .Mega3Overview, .MegaBOverview, .MegaWOverview, .MegaGOverview, .MegaAOverview, .MegaCOverview, .MegaDOverview, .MegaEOverview, .MegaFOverview, .MegaHOverview, .MegaIOverview, .MegaJOverview, .MegaKOverview, .MegaLOverview, .MegaMOverview,.MegaTOverview,.MegaSOverview {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  background-color: transparent;
  font-size: 1.2vw;
  color: red;
  font-weight: bold;
  cursor: pointer;
}
.height100vh{
  height: 100vh;
}
.width100vw{
  width: 100vw;
}
.QuayEmergencysOverview{
  max-height: 100vh;
  display: block;
  position: relative;
  aspect-ratio: 1/1;
}
.QEMER-stacknumber {
  cursor: pointer;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
}
div.QuayEmergencysOverview * {
  cursor: pointer;
}
.EMG01{
  position: absolute;
  margin-left: 1%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG02{
  position: absolute;
  margin-left: 12%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG03{
  position: absolute;
  margin-left: 23%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG04{
  position: absolute;
  margin-left: 34%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG05{
  position: absolute;
  margin-left: 45%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG06{
  position: absolute;
  margin-left: 56%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG07{
  position: absolute;
  margin-left: 67%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG08{
  position: absolute;
  margin-left: 78%;
  bottom: 10%;
  width: 10%;
  height: 12%;
}
.EMG09{
  position: absolute;
  margin-left: 1%;
  top: 10%;
  width: 10%;
  height: 12%;
}
.Quay736Overview{
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
  position: relative;
  z-index: 1;
  aspect-ratio: 2/1;
  background-image: url("../Images/Quay736.png");
  width: 100vw;
}
.Q736-stacknumber {
  position: absolute;
  cursor: pointer;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
  text-align: center;
  font-size: 1vw;
}
div.Quay736Overview * {
  cursor: pointer;
}
.ACI01{
  left:15%;
  top: 34%;
  width:10%;
  height: 53%;
}
.ACI02{
  left:29.2%;
  top: 34%;
  width:10%;
  height: 53%;
}
.ACI03{
  left:41.2%;
  top: 34%;
  width:15%;
  height: 12%;
}
.ACI04{
  left:57.8%;
  top: 34%;
  width:10%;
  height: 53%;
}
.ACI05{
  left:69.5%;
  top: 34%;
  width:10%;
  height: 25%;
}
.ACI06{
  left:69.5%;
  top: 59%;
  width:10%;
  height: 27.5%;
}
.ACI07{
  left:81%;
  top: 34%;
  width:10%;
  height: 25%;
}
.ACI08{
  left:81%;
  top: 59%;
  width:10%;
  height: 27.5%;
}
.ACI09{
  left: 1%;
  top: 15%;
  width: 10%;
  height: 15%;
}
.ACI10{
  left: 1%;
  top: 32%;
  width: 10%;
  height: 15%;
}
.ACI11{
  left: 1%;
  top: 49%;
  width: 10%;
  height: 15%;
}
.ACI12{
  left: 1%;
  top: 66%;
  width: 10%;
  height: 15%;
}
.Quay913Overview{
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
  position: relative;
  z-index: 1;
  aspect-ratio: 1.2/1;
  max-height: 100vh;
}
.Quay913Overview::after {
  content: "";
  background-image: url("../Images/Quay913.PNG");
  background-size: contain;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
}
div.Quay913Overview * {
  cursor: pointer;
}
.PSA01{
  border: 0.05vw solid black;
  position: absolute;
  width: 8.7%;
  height: 13%;
  left: 23.5%;
  top: 16.5%;
}
.PSA02{
  position: absolute;
  border: 0.05vw solid black;
  position: absolute;
  width: 8.7%;
  height: 17.5%;
  left: 23.5%;
  top: 29.5%;
}
.PSA03{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 26%;
  left: 34%;
  top: 15%;
}
.PSA04{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 26%;
  left: 46%;
  top: 15%;
}
.PSA05{
  border: 0.05vw solid black;
  position: absolute;
  width: 6%;
  height: 14%;
  left: 48%;
  top: 65%;
}
.PSA06{
  border: 0.05vw solid black;
  position: absolute;
  width: 6%;
  height: 14.4%;
  left: 48%;
  top: 79%;
}
.PSA07{
  border: 0.05vw solid black;
  position: absolute;
  width: 6%;
  height: 14%;
  left: 59%;
  top: 65%;
}
.PSA08{
  border: 0.05vw solid black;
  position: absolute;
  width: 6%;
  height: 14.4%;
  left: 59%;
  top: 79%;
}
.PSA09{
  border: 0.05vw solid black;
  position: absolute;
  width: 18%;
  height: 3.5%;
  left: 48%;
  top: 96%;
}
.PSA10{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 62%;
  top: 39%;
}
.PSA11{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 72%;
  top: 39%;
}
.PSA12{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 82%;
  top: 39%;
}
.PSA13{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 71%;
  top: 60%;
}
.PSA14{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 71%;
  top: 69%;
}
.PSA15{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 71%;
  top: 78%;
}
.PSA16{
  border: 0.05vw solid black;
  position: absolute;
  width: 10%;
  height: 9%;
  left: 71%;
  top: 87%;
}
.PSA17{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 20%;
  top: 5%;
}
.PSA21{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 20%;
  top: 15%;
}
.PSA18{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 15%;
  top: 5%;
}
.PSA22{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 15%;
  top: 15%;
}
.PSA19{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 10%;
  top: 5%;
}
.PSA23{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 10%;
  top: 15%;
}
.PSA20{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 5%;
  top: 5%;
}
.PSA24{
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
  position: absolute;
  width: 5%;
  height: 9%;
  right: 5%;
  top: 15%;
}


div.Quay869Overview * {
  cursor: pointer;
}

.MegaLb{
  width: 100vw;
  max-height: 95vh;
  display: block;
  z-index: 1;
  aspect-ratio: 2/1;
  position: relative;
}
div.MegaLb * {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.megaLB-stacknumber {
  position: absolute;
  cursor: pointer;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
}
.WorkShopLb{
  position: relative;
  left: 2.6%;
  top: 3%;
  width:39%;
  height: 15%;
  background-color:red;
}
.MLB99{
  left: 2.6%;
  top: 20%;
  width:39%;
  height: 10%;
  background-color:red;
}
.MLB14,.MLB12,.MLB11,.MLB10,.MLB09,.MLB08,.MLB07,.MLB06,.MLB05,.MLB04,.MLB03,.MLB02,.MLB01{
  position: absolute;
  width:10%;
  height: 32%;
}
.MLB07,.MLB06,.MLB05,.MLB04,.MLB03,.MLB02,.MLB01{
  bottom: 1%;
}
.MLB01{
  left: 1%;
}
.MLB02{
  left: 12%;
}
.MLB03{
  left: 23%;
}
.MLB04{
  left: 34%;
}
.MLB05{
  left: 45%;
}
.MLB06{
  left: 56%;
}
.MLB07{
  left: 67%;
}
.MLB08{
  left: 78%;
  bottom: 25%;
}
.MLB09{
  left: 89%;
  bottom: 25%;
}
.MLB15,.MLB16,.MLB17,.MLB18,.MLB19,.MLB20,.MLB21{
  width:10%;
  height: 12%;
  bottom: 34%;
}
.MLB15{
  left: 1%;
}
.MLB16{
  left: 12%;
}
.MLB17{
  left: 23%;
}
.MLB18{
  left: 34%;
}
.MLB19{
  left: 45%;
}
.MLB20{
  left: 56%;
}
.MLB21{
  left: 67%;
}
.MLB10,.MLB11,.MLB12{
  width:10%;
  height: 12%;
  top: 2.7%;
}
.MLB10{
  left: 56%;
}
.MLB11{
  left: 67%;
}
.MLB12{
  right: 3%;
}
.MLB13{
  /*GATE*/
  width:10%;
  height: 12%;
  left: 44%;
  top: 2.6%;
}
.MLB14{
  /*Foam*/
  left: 1%;
  top: 32%;
  width:10%;
  height: 21%;
}
.Quay1207Overview{
  max-height: 100vh;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
  position: relative;
  z-index: 1;
  aspect-ratio: 1/1;
  width: 100vw;
}
.Quay1207Overview::after {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
}
div.Quay1207Overview * {
  cursor: pointer;
}
.Q1207-stacknumber {
  cursor: pointer;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
}
.Water{
  position: absolute;
  margin-left: 1%;
  margin-top: 3%;
  margin-bottom: 3%;
  width:10%;
  height: 80%;
  background-color:blue;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
}
.EFP90{
  color:black;
  width: 8%;
  height: 10%;
  position: absolute;
  left: 12.5%;
  top:1%;
}

.EFP02{
  width: 8%;
  height: 20%;
  position: absolute;
  right: 15%;
  top:24%;
}
.EFP03{
  width: 8%;
  height: 20%;
  position: absolute;
  right: 15%;
  top: 50%;
}
.EFP01{
  position: absolute;
  width: 20%;
  height: 10%;
  right: 5%;
  top:12%;
}
.EFP04{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 12.5%;
  top:12%;
}
.EFP05{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 12.5%;
  top: 45%;
}
.EFP06{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 22.5%;
  top:12%;
}
.EFP07{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 22.5%;
  top: 45%;
}
.EFP08{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 32.5%;
  top:12%;
}
.EFP09{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 32.5%;
  top: 45%;
}
.EFP10{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 42.5%;
  top:12%;
}
.EFP11{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 42.5%;
  top: 45%;
}
.EFP12{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 52.5%;
  top:12%;
}
.EFP13{
  width: 8%;
  height: 25%;
  position: absolute;
  left: 52.5%;
  top: 45%;
}
.EFP99{
  background-color: #90ee90;
  position: absolute;
  width: 10%;
  height: 12%;
  right: 2%;
  bottom:12%;
}
.EFP98{
  position: absolute;
  width: 10%;
  height: 12%;
  right: 13%;
  bottom:12%;
}
.EFP97{
  background-color: #40c9ff;
  position: absolute;
  width: 10%;
  height: 12%;
  right: 24%;
  bottom:12%;
}

.EFP96{
  /*Repaired*/
  background-color: #adff2f;
  position: absolute;
  width: 8%;
  height: 8%;
  right: 27%;
  top:1%;
}
.EFP95{
  /*Repaired*/
  background-color: #adff2f;
  position: absolute;
  width: 8%;
  height: 8%;
  right: 16%;
  top:1%;
}

.QTMA-stacknumber {
  cursor: pointer;
  border-radius:5px;
  -moz-border-radius:5px;
  box-shadow:0 0 5px #688099;
  -moz-box-shadow:0 0 5px #688099;
  -webkit-border-radius: 5px;
  -webkit-box-shadow: 0 0 5px #688099;
}
.QuayTMAOverview{
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
  position: relative;
  z-index: 1;
  aspect-ratio: 2/1;
}
.QuayTMAOverview::after {
  content: "";
  background-image: url("../Images/QuayTMA.png");
  background-size: contain;
  background-repeat: no-repeat;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
}
div.QuayTMAOverview * {
  cursor: pointer;
}
.TMA01{
  left: 35.5%;
  top: 6%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 13.5%;
}
.TMA02{
  left: 35.5%;
  top: 20%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA03{
  left: 35.5%;
  top: 51%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA04{
  left: 51.5%;
  top: 6%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 13.5%;
}
.TMA05{
  left: 51.5%;
  top: 20%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA06{
  left: 51.5%;
  top: 51%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA07{
  left: 61.5%;
  top: 6%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 13.5%;
}
.TMA08{
  left: 61.5%;
  top: 20%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA09{
  left: 61.5%;
  top: 51%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 8%;
  height: 30%;
}
.TMA10{
  left: 1%;
  top: 5%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}
.TMA11{
  left: 1%;
  top: 25%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}
.TMA12{
  left: 1%;
  top: 45.5%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}
.TMA13{
  left: 1%;
  top: 66%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}
.TMA14 {
  left: 15%;
  top: 5%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}
.TMA15 {
  left: 15%;
  top: 25%;
  position: absolute;
  text-align: center;
  font-size: 1vw;
  width: 13%;
  height: 18%;
}

@media screen and (orientation:landscape) {
  .EucoreOverview{
    margin-left: 30vw;
    width: 40vw;
    height: 50.5vw;
    background-image: url("../Images/EucoreOverViewRb.PNG");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    position: relative;
  }
  .Mega1Overview{
    left: 0%;
    bottom: 24%;
    width: 12%;
    height: 10%;
  }
  .Mega1Overview > .RbLocationName {
    font-size: 0.8vw;
  }
  .Mega2Overview{
    left: 0%;
    bottom: 0.5%;
    width: 12%;
    height: 8.5%;
  }
  .Mega3Overview{
    left: 14.4%;
    bottom: 0%;
    width: 25.1%;
    height: 32.3%;
  }
  .Mega3Overview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 35%, 0 90%);
  }
  .Mega3Overview > .RbLocationName {
    position: absolute;
    top: 10%;
  }
  .MegaBOverview{
    left: 16%;
    bottom: 32.3%;
    width: 23.6%;
    height: 15%;
  }
  .MegaWOverview{
    left: 15.7%;
    bottom: 47.5%;
    width: 23.8%;
    height: 11.7%;
  }
  .MegaGOverview{
    left: 16%;
    bottom: 60%;
    width: 24%;
    height: 12.4%;
  }
  .MegaGOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 98% 0, 98% 92%,50% 92%, 0 53%)
  }
  .MegaTOverview{
    left: 0.1%;
    bottom: 61.2%;
    width: 11.9%;
    height: 9.8%;
  }
  .MegaAOverview{
    left: 16%;
    bottom: 72.5%;
    width: 23.6%;
    height: 16.6%;
  }
  .MegaCOverview{
    left: 40.3%;
    bottom: 61.6%;
    width: 21.8%;
    height: 10.8%;
  }
  .MegaDOverview{
    left: 40.2%;
    bottom: 72.6%;
    width: 22%;
    height: 16.6%;
  }
  .MegaEOverview{
    left: 63%;
    bottom: 61.5%;
    width: 17.8%;
    height: 13.5%;
  }
  .MegaFOverview{
    left: 63%;
    bottom: 75.1%;
    width: 17.8%;
    height: 14%;
  }
  .MegaHOverview{
    left: 80.8%;
    bottom: 61.5%;
    width: 16.5%;
    height: 13.5%;
  }
  .MegaHOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 90% 44%, 70% 82%, 53% 100%, 0 100%);
  }
  .MegaIOverview{
    left: 80.8%;
    bottom: 75.1%;
    width: 17.1%;
    height: 14%;
  }
  .MegaIOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 70%, 97% 100%, 0 100%);
  }
  .MegaJOverview{
    top: 0.9%;
    left: 55.7%;
    width: 11%;
    height: 9.7%;
  }
  .MegaJOverview > .RbLocationName {
    position: absolute;
    left: 10%;
    top: 0;
  }
  .MegaJOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 68% 0, 68% 61%, 100% 61%, 100% 100%, 0 100%);
  }
  .MegaKOverview{
    left: 40.4%;
    top: 43%;
    width: 15.5%;
    height: 15.7%;
  }
  .MegaKOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 38%, 69% 39%, 69% 100%, 5% 100%, 5% 39%, 0% 39%);
  }
  .MegaLOverview{
    left: 72.5%;
    top: 40.7%;
    width: 14.3%;
    height: 5.2%;
  }
  .MegaLOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 64% 100%, 0 100%);
  }
  .MegaLOverview > .RbLocationName {
    position: absolute;
    left: 2%;
  }
  .MegaMOverview{
    left: 16%;
    top: 5.3%;
    width: 15.6%;
    height: 5.2%;
  }
  .MegaSOverview{
    left: 41.3%;
    top: 63.3%;
    width: 14.2%;
    height: 14%;
  }
  .MegaSOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 63% 0, 100% 29.7%, 0 100%);
  }
  .MegaSOverview > .RbLocationName {
    position: absolute;
    left: 23%;
    top: 22%;
  }
  /*MEGA 1----------------------------------------------------*/
  .WorkShopMega1{
    position: absolute;
    left:10%;
    bottom: 10%;
    width:20%;
    height: 80%;
    border: 0.1vw solid black;
    background-color: red;
  }
  .MRB00{
    position: absolute;
    left:31%;
    bottom: 10%;
    width:2%;
    height: 80%;
    border: 0.1vw solid black;
    background-color: red;
  }
  .MRB01{
    right: 10%;
    bottom: 10%;
    width:9%;
    height: 20%;
  }
  .MRB02{
    right: 20%;
    bottom: 10%;
    width:9%;
    height: 20%;
  }
  .MRB03{
    right: 30%;
    bottom: 10%;
    width:9%;
    height: 20%;
  }
  .MRB04{
    right: 40%;
    bottom: 10%;
    width:9%;
    height: 20%;
  }
  .MRB05{
    right: 50%;
    bottom: 10%;
    width:9%;
    height: 20%;
  }
  .MRB06{
    right: 10%;
    bottom: 40%;
    width:9%;
    height: 20%;
  }
  .MRB07{
    right: 20%;
    bottom: 40%;
    width:9%;
    height: 20%;
  }
  .MRB08{
    right: 30%;
    bottom: 40%;
    width:9%;
    height: 20%;
  }
  .MRB09{
    right: 50%;
    bottom: 40%;
    width:9%;
    height: 20%;
  }
  .MRB10{
    right: 10%;
    bottom: 70%;
    width:9%;
    height: 20%;
  }
  .MRB11{
    right: 20%;
    bottom: 70%;
    width:9%;
    height: 20%;
  }
  .MRB12{
    right: 30%;
    bottom: 70%;
    width:9%;
    height: 20%;
  }
  .MRB13{
    right: 40%;
    bottom: 70%;
    width:9%;
    height: 20%;
  }

  .MRB01, .MRB02, .MRB03, .MRB04, .MRB05, .MRB06, .MRB07, .MRB08, .MRB09, .MRB10, .MRB11, .MRB12, .MRB13, .MRB14, .MRB15{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
  }
  .MRB14{
    right: 50%;
    top: 23%;
    width:9%;
    height: 15%;
    background-color: #ffffff;
  }
  .MRB15{
    right: 50%;
    top: 6%;
    width:9%;
    height: 15%;
    background-color: #ffffff;
  }
  /*EINDE MEGA 1----------------------------------------------------*/
  .Quay730Overview{
    width: 100vw;
    height: 50vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    position: relative;
    z-index: 1;
  }
  .Quay730Overview::after {
    content: "";
    background-image: url("../Images/AcotNieuw.PNG");
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
  }
  div.Quay730Overview * {
    cursor: pointer;
  }
  .ACO03, .ACO04, .ACO06, .ACO07{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 60%;
  }
  .ACO03{
    left: 53%;
    top: 13vh;
  }
  .ACO04{
    left: 44.8%;
    top: 13vh;
  }
  .ACO05{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 28%;
    left: 36.2%;
    top: 13vh;
  }
  .ACO06{
    left: 28%;
    top: 13vh;
  }
  .ACO07{
    left: 19.4%;
    top: 13vh;
  }
  .ACO08{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 22.2%;
    left: 11%;
    top: 13vh;
  }
  .ACO09{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 36.7%;
    left: 11%;
    top: 36vh;
  }
  .ACO10{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 22.2%;
    left: 1%;
    top: 13vh;
  }
  .ACO11{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 36.7%;
    left: 1%;
    top: 36vh;
  }
  .ACO12{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 70%;
    top: 3vh;
  }
  .ACO13{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 79%;
    top: 3vh;
  }
  .ACO14{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 88%;
    top: 3vh;
  }
  .ACO15{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 61%;
    top: 3vh;
  }
  .ACO16{
    position: absolute;
    border: 2px solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 52%;
    top: 3vh;
  }
  .Quay869Overview{
    width: 100vw;
    height: 45vw;
    background-image: url("../Images/Quay869.PNG");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    position: relative;
  }
  .Quay869Overview>div{
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    position: absolute;
  }
  .PSB01{
    width: 5%;
    height: 30%;
    left: 18%;
    top: 38%;
  }
  .PSB02{
    width: 5%;
    height: 17%;
    left: 24%;
    top: 35%;
  }
  .PSB03{
    width: 5%;
    height: 17%;
    left: 24%;
    top: 53%;
  }
  .PSB04{
    width: 5%;
    height: 17%;
    left: 30%;
    top: 35%;
  }
  .PSB05{
    width: 5%;
    height: 17%;
    left: 30%;
    top: 53%;
  }
  .PSB06{
    width: 5.5%;
    height: 17%;
    left: 45.5%;
    top: 2%;
  }
  .PSB07{
    width: 5.5%;
    height: 17%;
    left: 51.1%;
    top: 2%;
  }
  .PSB08{
    width: 12%;
    height: 11%;
    left: 56.6%;
    top: 2%;
  }
  .PSB09{
    width: 5%;
    height: 10%;
    left: 48%;
    top: 30%;
  }
  .PSB10{
    width: 5%;
    height: 12%;
    left: 53.4%;
    top: 28%;
  }
  .PSB11{
    width: 5%;
    height: 14%;
    left: 58.8%;
    top: 26%;
  }
  .PSB12{
    width: 5%;
    height: 17%;
    left: 64.2%;
    top: 23%;
  }
  .PSB13{
    width: 2.5%;
    height: 17%;
    left: 69.5%;
    top: 23%;
  }
  .PSB14{
    width: 2.5%;
    height: 17%;
    left: 72.1%;
    top: 23%;
  }
  .PSB15{
    width: 2.5%;
    height: 17%;
    left: 74.7%;
    top: 23%;
  }
  .PSB16{
    width: 2.5%;
    height: 17%;
    left: 77.3%;
    top: 23%;
  }
  .PSB17{
    width: 5.5%;
    height: 15%;
    left: 5%;
    top: 2%;
  }
  .PSB18{
    width: 5.5%;
    height: 15%;
    left: 11%;
    top: 2%;
  }
  .PSB19{
    width: 5.5%;
    height: 15%;
    left: 17%;
    top: 2%;
  }
  .PSB20{
    width: 5.5%;
    height: 15%;
    left: 23%;
    top: 2%;
  }
  .PSB21{
    width: 5.5%;
    height: 15%;
    left: 5%;
    top: 18%;
  }
  .PSB22{
    width: 5.5%;
    height: 15%;
    left: 11%;
    top: 18%;
  }
  .PSB23{
    width: 5.5%;
    height: 15%;
    left: 17%;
    top: 18%;
  }
  .PSB24{
    width: 5.5%;
    height: 15%;
    left: 23%;
    top: 18%;
  }
}
@media screen and (orientation:portrait) {
  .EucoreOverview{
    margin-left: 0vh;
    width: 100vw;
    height: 125vw;
    background-image: url("../Images/EucoreOverViewRb.PNG");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top;
    display: block;
    position: relative;
  }
  .Mega1Overview{
    left: 0%;
    bottom: 23.6%;
    width: 12%;
    height: 10%;
  }
  .Mega2Overview{
    left: 0%;
    bottom: 0.1%;
    width: 12%;
    height: 8.5%;
  }
  .Mega3Overview{
    left: 14.4%;
    bottom: 0%;
    width: 25.1%;
    height: 32.3%;
  }
  .Mega3Overview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 36%, 0 91%);
  }
  .Mega3Overview > .RbLocationName {
    position: absolute;
    top: 10%;
  }
  .MegaBOverview{
    left: 16%;
    bottom: 32.3%;
    width: 23.6%;
    height: 15%;
  }
  .MegaWOverview{
    left: 15.7%;
    bottom: 47.4%;
    width: 23.8%;
    height: 11.8%;
  }
  .MegaGOverview{
    left: 16%;
    bottom: 60.1%;
    width: 24%;
    height: 12.5%;
  }
  .MegaGOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 98% 0, 98% 92%,50% 92%, 0 53%)
  }
  .MegaTOverview{
    left: 0.1%;
    bottom: 61.4%;
    width: 11.9%;
    height: 9.8%;
  }
  .MegaAOverview{
    left: 16%;
    bottom: 72.7%;
    width: 23.6%;
    height: 16.8%;
  }
  .MegaCOverview{
    left: 40.3%;
    bottom: 61.6%;
    width: 21.8%;
    height: 11%;
  }
  .MegaDOverview{
    left: 40.2%;
    bottom: 72.6%;
    width: 22%;
    height: 16.9%;
  }
  .MegaEOverview{
    left: 63%;
    bottom: 61.6%;
    width: 17.8%;
    height: 13.6%;
  }
  .MegaFOverview{
    left: 63%;
    bottom: 75.3%;
    width: 17.8%;
    height: 14.1%;
  }
  .MegaHOverview{
    left: 80.8%;
    bottom: 61.6%;
    width: 16.5%;
    height: 13.7%;
  }
  .MegaHOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 90% 44%, 70% 82%, 53% 100%, 0 100%);
  }
  .MegaIOverview{
    left: 80.8%;
    bottom: 75.2%;
    width: 17.1%;
    height: 14.2%;
  }
  .MegaIOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 70%, 97% 100%, 0 100%);
  }
  .MegaJOverview{
    top: 0.5%;
    left: 55.6%;
    width: 11%;
    height: 9.8%;
  }
  .MegaJOverview > .RbLocationName {
    position: absolute;
    left: 10%;
    top: 0;
  }
  .MegaJOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 68% 0, 68% 61%, 100% 61%, 100% 100%, 0 100%);
  }
  .MegaKOverview{
    left: 40.4%;
    top: 43%;
    width: 15.5%;
    height: 15.9%;
  }
  .MegaKOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 100% 38%, 69% 39%, 69% 100%, 5% 100%, 5% 39%, 0% 39%);
  }
  .MegaLOverview{
    left: 72.5%;
    top: 40.7%;
    width: 14.3%;
    height: 5.2%;
  }
  .MegaLOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 100% 0, 64% 100%, 0 100%);
  }
  .MegaLOverview > .RbLocationName {
    position: absolute;
    left: 2%;
  }
  .MegaMOverview{
    left: 16%;
    top: 5.1%;
    width: 15.6%;
    height: 5.2%;
  }
  .MegaSOverview{
    left: 41.3%;
    top: 63.4%;
    width: 14.2%;
    height: 14.2%;
  }
  .MegaSOverview.RbLocationActive::before {
    clip-path: polygon(0 0, 63% 0, 100% 29.7%, 0 100%);
  }
  .MegaSOverview > .RbLocationName {
    position: absolute;
    left: 34%;
    top: 31%;
  }
  /*MEGA 1----------------------------------------------------*/
  .MRB01, .MRB02, .MRB03, .MRB04, .MRB05, .MRB06, .MRB07, .MRB08, .MRB09, .MRB10, .MRB11, .MRB12, .MRB13, .MRB14, .MRB15{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width: 12%;
    height: 12%;
  }
  .WorkShopMega1{
    position: absolute;
    left:0%;
    bottom: 10%;
    width:20%;
    height: 80%;
    border: 0.1vw solid black;
    background-color: red;
  }
  .MRB00{
    position: absolute;
    left:22%;
    bottom: 10%;
    width:2%;
    height: 80%;
    border: 0.1vw solid black;
    background-color: red;
    font-size: 1vw;
  }
  .MRB01,.MRB06,.MRB10{
    right: 2%;
  }
  .MRB02,.MRB07,.MRB11{
    right: 15%;
  }
  .MRB03,.MRB08,.MRB12{
    right: 28%;
  }
  .MRB05,.MRB09,.MRB14,.MRB15{
    right: 54%;
  }
  .MRB04,.MRB13{
    right: 41%;
  }
  .MRB01, .MRB02, .MRB03, .MRB04, .MRB05{
    bottom: 10%;
  }
  .MRB06, .MRB07, .MRB08, .MRB09{
    bottom: 37%;
  }
  .MRB10, .MRB11, .MRB12, .MRB13{
    top: 10%
  }
  .MRB15{
    top: 7%;
    background-color: #ffffff;
  }
  .MRB14{
    top: 20%;
    background-color: #ffffff;
  }
  /*EINDE MEGA 1----------------------------------------------------*/
  .Quay730Overview{
    width: 100vw;
    height: 50vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    position: relative;
    z-index: 1;
  }
  .Quay730Overview::after {
    content: "";
    background-image: url("../Images/AcotNieuw.PNG");
    background-size: contain;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
  }
  div.Quay730Overview * {
    cursor: pointer;
  }
  .ACO03, .ACO04, .ACO06, .ACO07{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 60%;
  }
  .ACO05{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 28%;
    left: 36.2%;
    top: 3vh;
  }
  .ACO07{
    left: 19.4%;
    top: 3vh;
  }
  .ACO06{
    left: 28%;
    top: 3vh;
  }
  .ACO04{
    left: 44.8%;
    top: 3vh;
  }
  .ACO03{
    left: 53%;
    top: 3vh;
  }
  .ACO08{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 22.2%;
    left: 11%;
    top: 3vh;
  }
  .ACO10{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 22.2%;
    left: 1%;
    top: 3vh;
  }
  .ACO09{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 36.7%;
    left: 11%;
    top: 9vh;
  }
  .ACO11{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 36.7%;
    left: 1%;
    top: 9vh;
  }
  .ACO15{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 61%;
    top: 0;
  }
  .ACO16{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 52%;
    top: 0;
  }
  .ACO12{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 70%;
    top: 0;
  }
  .ACO13{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 79%;
    top: 0;
  }
  .ACO14{
    position: absolute;
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    width:8%;
    height: 8%;
    left: 88%;
    top: 0;
  }
  .Quay869Overview>div{
    border: 0.05vw solid black;
    text-align: center;
    font-size: 1vw;
    position: absolute;
  }
  .Quay869Overview > div > .span-content-stacknumber {
    font-size: 0.2rem;
    border-radius: 3px;
  }
  .PSB01{
    width: 5%;
    height: 18%;
    left: 14.5%;
    top: 43%;
  }
  .PSB02{
    width: 5%;
    height: 10%;
    left: 21.5%;
    top: 41%;
  }
  .PSB03{
    width: 5%;
    height: 10%;
    left: 21.5%;
    top: 51%;
  }
  .PSB04{
    width: 5%;
    height: 10%;
    left: 28%;
    top: 41%;
  }
  .PSB05{
    width: 5%;
    height: 10%;
    left: 28%;
    top: 51%;
  }
  .PSB06{
    width: 5.5%;
    height: 9%;
    left: 45.5%;
    top: 24%;
  }
  .PSB07{
    width: 5.5%;
    height: 9%;
    left: 51.1%;
    top: 24%;
  }
  .PSB08{
    width: 14%;
    height: 5.5%;
    left: 57%;
    top: 24%;
  }
  .PSB09{
    width: 6%;
    height: 7%;
    left: 47.5%;
    top: 39%;
  }
  .PSB10{
    width: 6%;
    height: 7%;
    left: 53.7%;
    top: 38%;
  }
  .PSB11{
    width: 5.5%;
    height: 7%;
    left: 59.8%;
    top: 36%;
  }
  .PSB12{
    width: 5.5%;
    height: 9%;
    left: 66%;
    top: 35%;
  }
  .PSB13{
    width: 2.5%;
    height: 9%;
    left: 71.7%;
    top: 35%;
  }
  .PSB14{
    width: 2.5%;
    height: 9%;
    left: 75%;
    top: 35%;
  }
  .PSB15{
    width: 2.5%;
    height: 9%;
    left: 78.2%;
    top: 35%;
  }
  .PSB16{
    width: 2.5%;
    height: 9%;
    left: 81.1%;
    top: 36%;
  }
  .PSB17{
    width: 5.5%;
    height: 17%;
    left: 11%;
    top: 2%;
  }
  .PSB18{
    width: 5.5%;
    height: 17%;
    left: 17%;
    top: 2%;
  }
  .PSB19{
    width: 5.5%;
    height: 17%;
    left: 23%;
    top: 2%;
  }
  .PSB20{
    width: 5.5%;
    height: 17%;
    left: 29%;
    top: 2%;
  }
  .Quay869Overview{
    width: 110vw;
    height: 100vw;
    background-image: url("../Images/Quay869.PNG");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    position: relative;
    margin-left: -10vw;
  }
  #PopularItemsTbl_wrapper > .row:nth-child(2) {
    max-height: 48vh;
    margin-right: 10px;
    overflow-y: scroll;
  }
}
/*EINDE @media screen and (orientation:portrait) */

#StackContentDepot{
  width:100vw;
  height: 92vh;
}
#StackContentDepot button{
  /*hier zijn het 11rijen en 6 hoogte*/
  margin: 0.2vw;
  width:calc(100vw / 12);
  height: calc(100vh / 8);
  border: 0.01vw solid black;
  padding: 0%;
  font-size: 1vw;
}
#StackLayoutDepot button{
  font-size: 1vw;
  background-color: transparent;
}
.space-left {
  margin-right: 1vw;
}
.GateOverViewTitles{
  font-weight: bold;
  font-size: 3vw;
  position: absolute;
  top:1vh;
}
.GateOverView{
  position: absolute;
  top: 10vh;
  width: 80vw;
  height: 70vh;
}

.ContainerInBtn{
  font-size: 0.9vw;
  margin: 0.2vw;
  width:calc(100vw / 14);
  height: calc(100vh / 7);
  background-color: transparent;
  float:left;
}
.ContainerOutBtn{
  font-size: 0.9vw;
  margin: 0.2vw;
  width:calc(100vw / 14);
  height: calc(100vh / 7);
  background-color: transparent;
  float:left;
}
.Borderd{
  background-color: white;
  border: 0.01vw solid black !important;
  opacity: 1 !important;
}
.SubPlanContent > div > .RbLocationActive {
  box-shadow: 3px 2px 5px 0 rgba(0, 0, 0, 0.7), 0 3px 10px 0 rgba(0, 0, 0, 0.9);
}
.RbLocationActive::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #17a2b8;
  opacity: 0;
  pointer-events: none;
  animation: blinkEffect 2s ease-in-out infinite;
  z-index: 1;
}
@keyframes blinkEffect {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 0.6;
  }
}
.glowing-border{
  -webkit-animation: glowingAppleBlue 1500ms infinite;
  -moz-animation: glowingAppleBlue 1500ms infinite;
  -o-animation: glowingAppleBlue 1500ms infinite;
  animation: glowingAppleBlue 1500ms infinite;
}
@-webkit-keyframes glowingAppleBlue {
  0% {-webkit-box-shadow: 0 0 3px #42f5e9; }
  50% {-webkit-box-shadow: 0 0 40px #FF0000; }
  100% {-webkit-box-shadow: 0 0 3px #42f5e9; }
}
@-moz-keyframes glowingAppleBlue {
  0% {-moz-box-shadow: 0 0 3px #42f5e9; }
  50% {-moz-box-shadow: 0 0 40px #FF0000; }
  100% {-moz-box-shadow: 0 0 3px #42f5e9; }
}
@-o-keyframes glowingAppleBlue {
  0% {box-shadow: 0 0 3px #42f5e9; }
  50% {box-shadow: 0 0 40px #FF0000; }
  100% {box-shadow: 0 0 3px #42f5e9; }
}
@keyframes glowingAppleBlue {
  0% {box-shadow: 0 0 3px #42f5e9; }
  50% {box-shadow: 0 0 40px #FF0000; }
  100% {box-shadow: 0 0 3px #42f5e9; }
}
.LatestContainerAtLocation{
  -webkit-animation: glowingLatestLocation 1500ms infinite;
  -moz-animation: glowingLatestLocation 1500ms infinite;
  -o-animation: glowingLatestLocation 1500ms infinite;
  animation: glowingLatestLocation 1500ms infinite;
}
@-webkit-keyframes glowingLatestLocation {
  0% {-webkit-box-shadow: 0 0 3px #42f5e9; }
  50% {-webkit-box-shadow: 0 0 40px #3957db; }
  100% {-webkit-box-shadow: 0 0 3px #42f5e9; }
}
@-moz-keyframes glowingLatestLocation {
  0% {-moz-box-shadow: 0 0 3px #42f5e9; }
  50% {-moz-box-shadow: 0 0 40px #3957db; }
  100% {-moz-box-shadow: 0 0 3px #42f5e9; }
}
@-o-keyframes glowingLatestLocation {
  0% {box-shadow: 0 0 3px #42f5e9; }
  50% {box-shadow: 0 0 40px #3957db; }
  100% {box-shadow: 0 0 3px #42f5e9; }
}
@keyframes glowingLatestLocation {
  0% {box-shadow: 0 0 3px #42f5e9; }
  50% {box-shadow: 0 0 40px #3957db; }
  100% {box-shadow: 0 0 3px #42f5e9; }
}
#ChangeLocMenu {
  position: relative;
  flex-basis: 100%;
}
#ChangeLocMenu > button {
  margin-top: 25px;
  display: inline-block;
  width: auto;
}
#ChangeLocMenu > button:last-child {
  margin-left: 10px;
}
.LargerBtnActivatedCancel{
  font-size: 0.9vw;
  color:#ffffff;
  position: absolute;
  bottom:0%;
  -webkit-animation: glowingCancel 1500ms infinite;
  -moz-animation: glowingCancel 1500ms infinite;
  -o-animation: glowingCancel 1500ms infinite;
  animation: glowingCancel 1500ms infinite;
}
@-webkit-keyframes glowingCancel {
  0% {  background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
}
@-moz-keyframes glowingCancel {
  0% {  background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -moz-box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
}
@-o-keyframes glowingCancel {
  0% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}
@keyframes glowingCancel {
  0% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}
.LargerBtnActivated{
  font-size: 0.9vw;
  -webkit-animation: glowing 1500ms infinite;
  -moz-animation: glowing 1500ms infinite;
  -o-animation: glowing 1500ms infinite;
  animation: glowing 1500ms infinite;
}
@-webkit-keyframes glowing {
  0% {  -webkit-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; color:#ffffff;}
  100% {  -webkit-box-shadow: 0 0 3px #B20000; color:#ffffff;}
}
@-moz-keyframes glowing {
  0% {  -moz-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; color:#ffffff;}
  100% {  -webkit-box-shadow: 0 0 3px #B20000; color:#ffffff;}
}
@-o-keyframes glowing {
  0% {  box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; color:#ffffff;}
  100% {  -webkit-box-shadow: 0 0 3px #B20000; color:#ffffff;}
}
@keyframes glowing {
  0% {  box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; color:#ffffff;}
  100% {  -webkit-box-shadow: 0 0 3px #B20000; color:#ffffff;}
}
.PreBarrierLineItemChecked{
  -webkit-animation: glowingPreBarrierLineItemChecked 5000ms infinite;
  -moz-animation: glowingPreBarrierLineItemChecked 5000ms infinite;
  -o-animation: glowingPreBarrierLineItemChecked 5000ms infinite;
  animation: glowingPreBarrierLineItemChecked 5000ms infinite;
}
@-webkit-keyframes glowingPreBarrierLineItemChecked {
  0% {  background-color: #f5ad27; -webkit-box-shadow: 0 0 3px #f5ad27; }
  50% {  background-color: #B20000; -webkit-box-shadow: 0 0 40px #B20000; }
  100% {  background-color: #f5ad27; -webkit-box-shadow: 0 0 3px #f5ad27; }
}
@-moz-keyframes glowingPreBarrierLineItemChecked {
  0% {  background-color: #f5ad27; -moz-box-shadow: 0 0 3px #f5ad27; }
  50% {  background-color: #B20000; -moz-box-shadow: 0 0 40px #B20000; }
  100% {  background-color: #f5ad27; -moz-box-shadow: 0 0 3px #f5ad27; }
}
@-o-keyframes glowingPreBarrierLineItemChecked {
  0% {  background-color: #f5ad27; box-shadow: 0 0 3px #f5ad27; }
  50% {  background-color: #B20000; box-shadow: 0 0 40px #B20000; }
  100% {  background-color: #f5ad27; box-shadow: 0 0 3px #f5ad27; }
}
@keyframes glowingPreBarrierLineItemChecked {
  0% { background-color: #f5ad27; box-shadow: 0 0 3px #f5ad27; }
  50% { background-color: #B20000; background-color: #B20000; box-shadow: 0 0 40px #B20000; }
  100% { background-color: #f5ad27; box-shadow: 0 0 3px #f5ad27; }
}
#BufferTbl{
  width: 70vw;
}
.RefFinished{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  );
}
.DiffertentIsoThenRefOut{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #f28787,
    #999
  ) !important;
}
.EstimateInProgress{
  text-decoration: line-through;
}
.CWITEM{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  );
}
.DiffertentStatusThenRefOut{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  ) !important;
}
.gate-tasks-DiffertentStatusThenRefOut{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  );
}
.NOT_BOT{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #fcf9ed 10px,
    #fcf9ed 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #fff3d4,
    #ffb3b3
  );
}
.IsoOfContainerNotKnown{
  background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #0d75a6 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  ) !important;
}
.PersonalTaskRow{
  background-color: #adff2f !important;
}
.ConfirmGateOut-modal-body {
  padding: 25px 0px;
}
.ConfirmGateOut-modal-body > .label-info {
  font-size: 1.5rem;
  padding-left: 20px;
}
.ContainerPossibleToGiveToTruck {
  background-color:#e8fc03;
  border-radius: 5px;
  -webkit-border-radius: 5px;
}
#ConfirmGateOutBtn {
  width: 50vw;
}
.LargerBtnActivatedSelected, div > .LargerBtnActivatedSelected {
  margin: 5px 0px;
  border-radius: 0 !important;
  border-color: white;
  border-width: 4px !important;
  border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 1;
  border-image-slice: 1;
  border-width: 2px;
  -webkit-animation: glowingSelected 1500ms infinite, borderRotate var(--d)linear infinite forwards;
  -moz-animation: glowingSelected 1500ms infinite, borderRotate var(--d)linear infinite forwards;
  -o-animation: glowingSelected 1500ms infinite, borderRotate var(--d)linear infinite forwards;
  animation: glowingSelected 1500ms infinite, borderRotate var(--d)linear infinite forwards;
}
@-webkit-keyframes glowingSelected {
  0% {  background-color: #6ef442; -webkit-box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; -webkit-box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; -webkit-box-shadow: 0 0 3px #6ef442; }
}
@-moz-keyframes glowingSelected {
  0% {  background-color: #6ef442; -moz-box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; -moz-box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; -moz-box-shadow: 0 0 3px #6ef442; }
}
@-o-keyframes glowingSelected {
  0% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
}
@keyframes glowingSelected {
  0% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
}
.LargerBtnActivatedConfirm{
  font-size: 0.9vw;
  -webkit-animation: glowingConfirm 1500ms infinite;
  -moz-animation: glowingConfirm 1500ms infinite;
  -o-animation: glowingConfirm 1500ms infinite;
  animation: glowingConfirm 1500ms infinite;
  margin-bottom: 2vh;
}
@-webkit-keyframes glowingConfirm {
  0% {  background-color: #6ef442; -webkit-box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; -webkit-box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; -webkit-box-shadow: 0 0 3px #6ef442; }
}
@-moz-keyframes glowingConfirm {
  0% {  background-color: #6ef442; -moz-box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; -moz-box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; -moz-box-shadow: 0 0 3px #6ef442; }
}
@-o-keyframes glowingConfirm {
  0% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
}
@keyframes glowingConfirm {
  0% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
  50% {  background-color: #8cff00; box-shadow: 0 0 40px #8cff00; }
  100% {  background-color: #6ef442; box-shadow: 0 0 3px #6ef442; }
}
.modal-FitWidth {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90vw;
  max-width: 1200px;
  max-height: 90vh;
  overflow-y: auto;
}
.containerstackspopup > div > div > div > .specLocationBtnContent {
  padding-top: 20px;
  text-align: center;
}
.containerstackspopup > div > div > div > .specLocationBtnContent > .spcBtnContnr {
  margin-top: 25px;
}
.containerstackspopup > div > div > div:not(.HighlightContainer) {
  opacity: 0.7;
}
.HighlightContainer{
  -webkit-animation: HighLightContainerglowing 1500ms infinite;
  -moz-animation: HighLightContainerglowing 1500ms infinite;
  -o-animation: HighLightContainerglowing 1500ms infinite;
  animation: HighLightContainerglowing 1500ms infinite;
}
.HighlightContainer > span {
  color: #ffffff !important;
}
.WindSpeedAlertStopDriving{
  -webkit-animation: HighLightContainerglowing 1500ms infinite;
  -moz-animation: HighLightContainerglowing 1500ms infinite;
  -o-animation: HighLightContainerglowing 1500ms infinite;
  animation: HighLightContainerglowing 1500ms infinite;
  color: #ffffff !important;
}
.BgAlertImportantMessage{
  -webkit-animation: HighLightContainerglowing 1500ms infinite;
  -moz-animation: HighLightContainerglowing 1500ms infinite;
  -o-animation: HighLightContainerglowing 1500ms infinite;
  animation: HighLightContainerglowing 1500ms infinite;
  color: black !important;
}
.SelectedUnitPartByEstimator{
  -webkit-animation: HighLightContainerglowing 5000ms infinite;
  -moz-animation: HighLightContainerglowing 5000ms infinite;
  -o-animation: HighLightContainerglowing 5000ms infinite;
  animation: HighLightContainerglowing 5000ms infinite;
  color: black !important;
}
.ThickBorder{
  border: 0.5vw solid black;
}
@-webkit-keyframes HighLightContainerglowing {
  0% {  background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -webkit-box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; -webkit-box-shadow: 0 0 3px #B20000; }
}
@-moz-keyframes HighLightContainerglowing {
  0% {  background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; -moz-box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; -moz-box-shadow: 0 0 3px #B20000; }
}
@-o-keyframes HighLightContainerglowing {
  0% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}
@keyframes HighLightContainerglowing {
  0% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
  50% {  background-color: #FF0000; box-shadow: 0 0 40px #FF0000; }
  100% {  background-color: #B20000; box-shadow: 0 0 3px #B20000; }
}
.FolderBtn{
  background: url('/Images/Folder.png') no-repeat;
  cursor:pointer;
  width: 100px;
  height: 100px;
  text-align: left;
}
/*globalzicht van stack in de knop----------------------------------------------------*/
/*globalzicht van stack in de knop----------------------------------------------------*/
/*globalzicht van stack in de knop----------------------------------------------------*/
span.ClientsInStack, .ClientInStack{
  position: absolute;
  right: 0;
  top:0;
  max-width: 45%;
  font-size: 0.45vw;
  word-break: break-word;
  text-align: right;
  background-color: white;
  cursor: pointer;
  font-weight: 700;
}
.PosR01H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H01{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:0%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H02{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:12.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H03{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:25%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H04{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:37.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H05{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:50%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H06{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:62.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H07{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:75%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR01H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:0%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR02H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:9.1%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR03H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:18.2%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR04H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:27.3%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR05H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:36.4%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR06H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:45.5%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR07H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:54.6%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR08H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:63.7%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR09H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:72.8%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR10H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:81.9%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
.PosR11H08{
  font-size: 0.5vw;
  overflow: hidden;
  word-wrap:break-word;
  position: absolute;
  left:91%;
  bottom:87.5%;
  width:9%;
  height: 12.5%;
  background-color: blue;
  border: 0.02vw solid black;
}
/*EINDE VAN DE STACK LOCATIES IN DE KNOPPEN ----------------------------------------------------*/
#CurrentActiveTask{
  display: none;
}
/*EINDE VAN DE STACK LOCATIES IN DE KNOPPEN ----------------------------------------------------*/

/*MEGA 3----------------------------------------------------*/
.Mega3Labels01{
  position: absolute;
  left : 3%;
  top : 1%;
  width:2%;
  height: 90%;
  text-align: center;
}
.LabelPtiA{
  position: relative;
  top:3%;
}
.LabelPtiB{
  position: relative;
  top : 13%;
}
.LabelPtiC{
  position: relative;
  top : 21%;
}
.LabelPtiD{
  position: relative;
  top : 29%;
}
.LabelPtiE{
  position: relative;
  top : 43%;
}
.LabelPtiF{
  position: relative;
  top : 51%;
}
.LabelPtiG{
  position: absolute;
  left: 49.2%;
  top: 1%;
}
.LabelPtiH{
  position: absolute;
  left: 56.2%;
  top: 1%;
}
.WorkShopMega3A{
  position: absolute;
  left :55%;
  top : 12%;
  width:11%;
  height: 68%;
  border: 0.05vw solid black;
  background-color: red;
}
.MRB99{
  font-size: 1vw;
  position: absolute;
  left :67%;
  top : 12%;
  width:2%;
  height: 68%;
  border: 0.05vw solid black;
  background-color: red;
}
.WorkShopMega3B{
  position: absolute;
  left :43%;
  top : 12%;
  width:11%;
  height: 68%;
  border: 0.05vw solid black;
  background-color: red;
}
.MRB98{
  font-size: 1vw;
  position: absolute;
  left :40%;
  top : 12%;
  width:2%;
  height: 68%;
  border: 0.05vw solid black;
  background-color: red;
}
.MRB16{
  position: absolute;
  left : 5.5%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB17{
  position: absolute;
  left : 5.5%;
  top : 11.5%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB18{
  position: absolute;
  left : 5.5%;
  top : 22.5%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB19{
  position: absolute;
  left : 5.5%;
  top : 33%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB20{
  position: absolute;
  left : 5.5%;
  top : 49%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB21{
  position: absolute;
  left : 5.5%;
  top : 59.5%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;

  text-align: center;
  font-size: 1vw;
}
.MRB22{
  position: absolute;
  left : 5.5%;
  top : 71%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB97{
  position: absolute;
  left : 12.5%;
  top : 68%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB23{
  position: absolute;
  left : 5.5%;
  top : 81.5%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB24{
  position: absolute;
  left : 11.5%;
  top : 82%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB25{
  position: absolute;
  left : 17.5%;
  top : 82%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB26{
  position: absolute;
  left : 23.5%;
  top :82%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB27{
  position: absolute;
  left : 29.5%;
  top : 82%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB28{
  position: absolute;
  left : 29.5%;
  top : 71%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB29{
  position: absolute;
  left : 29.5%;
  top : 60%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB30{
  position: absolute;
  left : 29.5%;
  top : 49%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB31{
  position: absolute;
  left : 29.5%;
  top : 38%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB32{
  position: absolute;
  left : 29.5%;
  top : 27%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB33{
  position: absolute;
  left : 29.5%;
  top : 16%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB34{
  position: absolute;
  left : 29.5%;
  top : 6%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB35{
  position: absolute;
  left :40%;
  top : 82%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB36{
  position: absolute;
  left : 35.5%;
  top : 60%;
  width:4.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB37{
  position: absolute;
  left : 35.5%;
  top : 49.5%;
  width:4.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB38{
  position: absolute;
  left :37%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB39{
  position: absolute;
  left :43%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB40{
  position: absolute;
  left :50%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB41{
  position: absolute;
  left :57%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB42{
  position: absolute;
  left :63%;
  top : 1%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB43{
  position: absolute;
  right : 14%;
  top : 3%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB44{
  position: absolute;
  right : 8%;
  top : 3%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB45{
  position: absolute;
  right : 2%;
  top : 3%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB46{
  position: absolute;
  right : 4%;
  top : 16%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB47{
  position: absolute;
  right : 6%;
  top : 27%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB48{
  position: absolute;
  right : 8%;
  top : 38%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB49{
  position: absolute;
  right : 10%;
  top : 49%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB50{
  position: absolute;
  right : 12%;
  top : 60%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB51{
  position: absolute;
  right : 20%;
  top : 3%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB52{
  position: absolute;
  left : 5.5%;
  top : 45%;
  width: 8.5%;
  height: 3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRB53{
  position: absolute;
  right : 14%;
  top : 71%;
  width:5.5%;
  height: 10.3%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
/*EINDE MEGA 3----------------------------------------------------*/
/* MEGA B----------------------------------------------------*/
.MBBContent>.megaRB-stacknumber{
  position: absolute;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MBBContent>.megaRB-stacknumber.verticalStackLayout{
  width:4%;
  height: 9.5%;
}
.MBBContent>.megaRB-stacknumber.horizontalStackLayout{
  width:9.5%;
  height: 6%;
}
.MBB01{
	left: 1%;
	top: 1%;
}
.MBB02{
	left: 5.5%;
	top: 1%;
}

.MBB03{
	left: 14.5%;
	top: 1%;
}
.MBB04{
	left: 19%;
	top: 1%;
}
.MBB05{
	left: 23.5%;
	top: 1%;
}
.MBB06{
	left: 28%;
	top: 1%;
}
.MBB07{
	left: 32.5%;
	top: 1%;
}
.MBB08{
	left: 37%;
	top: 1%;
}
.MBB09{
	left: 41.5%;
	top: 1%;
}
.MBB10{
	left: 46%;
	top: 1%;
}
.MBB11{
	left: 50.5%;
	top: 1%;
}
.MBB12{
	left: 55%;
	top: 1%;
}
.MBB13{
	left: 59.5%;
	top: 1%;
}
.MBB14{
	left: 64%;
	top: 1%;
}
.MBB15{
	left: 68.5%;
	top: 1%;
}
.MBB16{
	left: 73%;
	top: 1%;
}
.MBB17{
	left: 76.5%;
	top: 1%;
}
.MBB18{
	left: 81%;
	top: 1%;
}
.MBB19{
	left: 1%;
	top: 11%;
}
.MBB20{
	left: 5.5%;
	top: 11%;
}

.MBB21{
	left: 14.5%;
	top: 11%;
}
.MBB22{
	left: 19%;
	top: 11%;
}
.MBB23{
	left: 23.5%;
	top: 11%;
}
.MBB24{
	left: 28%;
	top: 11%;
}
.MBB25{
	left: 32.5%;
	top: 11%;
}
.MBB26{
	left: 37%;
	top: 11%;
}
.MBB27{
	left: 41.5%;
	top: 11%;
}
.MBB28{
	left: 46%;
	top: 11%;
}
.MBB29{
	left: 50.5%;
	top: 11%;
}
.MBB30{
	left: 55%;
	top: 11%;
}
.MBB31{
	left: 59.5%;
	top: 11%;
}
.MBB32{
	left: 64%;
	top: 11%;
}
.MBB33{
	left: 68.5%;
	top: 11%;
}
.MBB34{
	left: 73%;
	top: 11%;
}
.MBB35{
	left: 76.5%;
	top: 11%;
}
.MBB36{
	left: 81%;
	top: 11%;
}
.MBB37{
	left: 1%;
	bottom: 21%;
}
.MBB38{
	left: 5.5%;
	bottom: 21%;
}

.MBB39{
	left: 14.5%;
	bottom: 21%;
}
.MBB40{
	left: 19%;
	bottom: 21%;
}
.MBB41{
	left: 23.5%;
	bottom: 21%;
}
.MBB42{
	left: 28%;
	bottom: 21%;
}
.MBB43{
	left: 32.5%;
	bottom: 21%;
}
.MBB44{
	left: 37%;
	bottom: 21%;
}
.MBB45{
	left: 41.5%;
	bottom: 21%;
}
.MBB46{
	left: 45%;
	bottom: 21%;
}
.MBB47{
	left: 49.5%;
	bottom: 21%;
}
.MBB48{
	left: 54%;
	bottom: 21%;
}
.MBB49{
	left: 58.5%;
	bottom: 21%;
}
.MBB50{
	left: 63%;
	bottom: 21%;
}
.MBB51{
	left: 67.5%;
	bottom: 21%;
}
.MBB52{
	left: 72%;
	bottom: 21%;
}
.MBB53{
	left: 76.5%;
	bottom: 21%;
}
.MBB54{
	left: 81%;
	bottom: 21%;
}
.MBB55{
	left: 1%;
	bottom: 11%;
}
.MBB56{
	left: 5.5%;
	bottom: 11%;
}

.MBB57{
	left: 14.5%;
	bottom: 11%;
}
.MBB58{
	left: 19%;
	bottom: 11%;
}
.MBB59{
	left: 23.5%;
	bottom: 11%;
}
.MBB60{
	left: 28%;
	bottom: 11%;
}
.MBB61{
	left: 32.5%;
	bottom: 11%;
}
.MBB62{
	left: 37%;
	bottom: 11%;
}
.MBB63{
	left: 41.5%;
	bottom: 11%;
}
.MBB64{
	left: 45%;
	bottom: 11%;
}
.MBB65{
	left: 49.5%;
	bottom: 11%;
}
.MBB66{
	left: 54%;
	bottom: 11%;
}
.MBB67{
	left: 58.5%;
	bottom: 11%;
}
.MBB68{
	left: 63%;
	bottom: 11%;
}
.MBB69{
	left: 67.5%;
	bottom: 11%;
}
.MBB70{
	left: 72%;
	bottom: 11%;
}
.MBB71{
	left: 76.5%;
	bottom: 11%;
}
.MBB72{
	left: 81%;
	bottom: 11%;
}
.MBB73{
	left: 1%;
	bottom: 1%;
}
.MBB74{
	left: 5.5%;
	bottom: 1%;
}
.MBB75{
	left: 28%;
	bottom: 55%;
}
.MBB76{
	left: 32.5%;
	bottom: 55%;
}
.MBB77{
	left: 28%;
	bottom: 45%;
}
.MBB78{
	left: 32.5%;
	bottom: 45%;
}
.MBB79{
	right: 1%;
	top: 1%
}
.MBB80{
	right: 1%;
	top: 7.5%
}
.MBB81{
	right: 1%;
	top: 14%
}
.MBB82{
	right: 1%;
	top: 20.5%
}
.MBB83{
	right: 1%;
	top: 27%
}
.MBB84{
	right: 1%;
	top: 33.5%
}
.MBB85{
	right: 1%;
	bottom: 43.5%
}
.MBB86{
	right: 1%;
	bottom: 37%
}
.MBB87{
	right: 1%;
	bottom: 30.5%
}
.MBB88{
	right: 1%;
	bottom: 24%
}
.MBB89{
	right: 1%;
	bottom: 17.5%
}
.MBB90{
	right: 1%;
	bottom: 11%
}
/*EINDE MEGA B---------------------------------------------------*/
/* MEGA W----------------------------------------------------*/
.MegaWLabels01{
  position: absolute;
  left : 26%;
  top : 18%;
  width:10%;
  height: 5%;
  text-align: center;
}
.WashZoneMBW{
  position: relative;
  top:3%;
}
.MegaWLabels02{
  position: absolute;
  right: 8%;
  top : 5%;
  width:10%;
  height: 5%;
  text-align: center;
}
.PickUpZoneMBW{
  position: relative;
  top:3%;
}
.MBW01,.MBW02,.MBW03,.MBW04,.MBW05,.MBW06,.MBW07,.MBW08,.MBW09,.MBW10,.MBW11,.MBW12,.MBW13,.MBW14,.MBW15,.MBW16,.MBW17,.MBW18,.MBW19,.MBW20,.MBW21,.MBW22,.MBW23,.MBW38,.MBW37,.MBW36,.MBW35,.MBW34,.MBW33,.MBW32,.MBW24,.MBW25,.MBW26,.MBW27,.MBW28,.MBW29,.MBW30,.MBW31,.MBW32,.MBW33,.MBW34,.MBW35,.MBW36,.MBW37,.MBW38,.MBW40,.MBW41,.MBW42,.MBW43,.MBW44,.MBW45,.MBW46,.MBW47,.MBW48,.MBW49,.MBW50{
  position: absolute;
  width:5%;
  height: 9.5%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}

.MBW01{
  right :1%;
  bottom : 16%;
  font-size: 1vw;
}
.MBW02{
  left :76%;
  bottom : 16%;
  font-size: 1vw;
}
.MBW03{
  left :70.5%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW04{
  left :65%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW05{
  left :59.5%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW06{
  left :54%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW07{
  left :48.5%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW08{
  left :43%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW09{
  left :37.5%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW10{
  left :32%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW11{
  left :26%;
  bottom : 16%;
  background-color: #00ffff;
  font-size: 1vw;
}
.MBW12{
  left :6%;
  bottom : 16%;

  font-size: 1vw;
}
.MBW13{
  left :6%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW14{
  left :6%;
  bottom : 36%;

  font-size: 1vw;
}
.MBW15{
  left :6%;
  bottom : 46%;

  font-size: 1vw;
}
.MBW16{
  left :6%;
  bottom : 56%;

  font-size: 1vw;
}
.MBW17{
  left :6%;
  bottom : 66%;

  font-size: 1vw;
}
.MBW18{
  left :6%;
  bottom : 76%;

  font-size: 1vw;
}
.MBW19{
  left :6%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW21{
  left :26%;
  bottom : 76%;
  background-color: #00ffff;
  font-size: 1vw;
  display: none;
}
.MBW23{
  left :26%;
  bottom : 86%;
  background-color: #00ffff;
  font-size: 1vw;
}
.MBW50{
  left :20%;
  bottom : 86%;
  font-size: 1vw;
}
.MBW20{
  left :32%;
  bottom : 76%;
  background-color: #00ffff;
  font-size: 1vw;
  display: none;
}
.MBW22{
  left :32%;
  bottom : 86%;
  background-color: #00ffff;
  font-size: 1vw;
}
.MBW38{
  right :1%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW37{
  right :1%;
  bottom : 36%;

  font-size: 1vw;
}
.MBW36{
  right :1%;
  bottom : 46%;

  font-size: 1vw;
}
.MBW35{
  right :1%;
  bottom : 56%;

  font-size: 1vw;
}
.MBW34{
  right :1%;
  bottom : 66%;

  font-size: 1vw;
}
.MBW33{
  right :1%;
  bottom : 76%;

  font-size: 1vw;
}
.MBW32{
  right :1%;
  bottom : 86%;
  font-size: 1vw;
}
.MBW24{
  left :37.5%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW25{
  left :43%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW26{
  left :48.5%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW27{
  left :54%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW28{
  left :59.5%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW29{
  left :65%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW30{
  left :70.5%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW31{
  left :76%;
  bottom : 86%;

  font-size: 1vw;
}
.MBW40{
  left :76%;
  bottom : 26%;
  font-size: 1vw;
}
.MBW41{
  left :70.5%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW42{
  left :65%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW43{
  left :59.5%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW44{
  left :54%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW45{
  left :48.5%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW46{
  left :43%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW47{
  left :37.5%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW48{
  left :32%;
  bottom : 26%;

  font-size: 1vw;
}
.MBW49{
  left :26%;
  bottom : 26%;
  background-color: #00ffff;
  font-size: 1vw;
}
/*EINDE MEGA W---------------------------------------------------*/
/* MEGA 2----------------------------------------------------
.MRM01{
  position: absolute;
  left:7%;
  top: 8%;
  width:8%;
  height: 19%;
  border: 0.1vw solid black;
  background-color: #808080;
  text-align: center;
  font-size: 1vw;
}
Parent is .SubPlanContent
*/

.MRM01{
  position: absolute;
  right:35%;
  top: 2%;
  height  :9%;
  width: 8%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM02{
  position: absolute;
  right:35%;
  top: 11.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM03{
  position: absolute;
  right:35%;
  top: 21%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM04{
  position: absolute;
  right:35%;
  top: 30.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM05{
  position: absolute;
  right:35%;
  top: 40%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM06{
  position: absolute;
  right:38%;
  top: 49.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM07{
  position: absolute;
  right:41%;
  top: 59%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM08{
  position: absolute;
  right:44%;
  top: 68.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM09{
  position: absolute;
  right:48%;
  top: 78%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM10{
  position: absolute;
  right:55%;
  top: 88%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM11{
  position: absolute;
  right: 63%;
  top: 2%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM12{
  position: absolute;
  right: 63%;
  top: 11.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM13{
  position: absolute;
  right: 63%;
  top: 21%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM14{
  position: absolute;
  right: 63%;
  top: 30.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM15{
  position: absolute;
  right: 63%;
  top: 40%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM16{
  position: absolute;
  right: 63%;
  top: 49.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM17{
  position: absolute;
  right: 63%;
  top: 59%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM18{
  position: absolute;
  right: 63%;
  top: 68.5%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
.MRM19{
  position: absolute;
  right: 63%;
  top: 78%;
  width:8%;
  height: 9%;
  border: 0.05vw solid black;
  text-align: center;
  font-size: 1vw;
}
/*EINDE MEGA 2---------------------------------------------------*/
button>i.fas.fa-link {
    font-size: 0.5vw;
}
div#RefenceInfoDetail {
  position: fixed;
  min-height: 90vh;
  overflow-y: auto;
  overflow-x: auto;
}
.ReeferContainer{
  border: 0.2vw solid #99ccff;
}
.TankContainer{
  border-radius: 2vw;
}
.FlatContainer{
  border-right: 0.5vw black solid;
  border-left: 0.5vw black solid;
  border-bottom: 0.5vw black solid;
}
.tableFixHead          { overflow: auto; height: 100px; }
.tableFixHead thead th { position: sticky; top: 0; z-index: 1; }
.HighLightSelectedContainer {
  border: 0.3vw solid #ff4419;
}
.TempHighLightSelectedContainer {
  border: 1vw solid #ff4419;
}
#EstimateDetail.modal-open .modal{
  overflow: hidden;
}
div#modal-content-EstimateDetail {
    max-height: 98vh !important;
    overflow: hidden;
}
.modal-content>.EstimateDetail-modal-body {
  /*do not change because this needs to be the minimum*/
    overflow-y: auto;
    min-height: 85vh;
}
#EstimateDetail>div>.modal-content>.EstimateDetail-modal-body {
  /*do not change because this needs to be the minimum*/
    overflow-y: hidden;
    min-height: 75vh;
}
.modal-content>.EstimateDetail-modal-body>.tabbable>.tab-content>.tab-pane>.tabbable>.tab-content>.tab-pane{
  height: 81vh;
}
#EstimateDetail>div>.modal-content>.EstimateDetail-modal-body>.tabbable>.tab-content>.tab-pane>.tabbable>.tab-content>.tab-pane{
  height: 70vh;
}
#EstimateDetail>div>.modal-content>.EstimateDetail-modal-body>.tabbable>.tab-content>.tab-pane>.tabbable>.tab-content.p-4>.tab-pane{
  height: 68vh;
}
.EstimateContentInQSE>.EstimateDetail-modal-body {
  /*do not change because this needs to be the minimum*/
    overflow-y: auto;
    min-height: 65vh;
}
.EstimateContentInQSE>.EstimateDetail-modal-body>.tabbable>.tab-content>.tab-pane>.tabbable>.tab-content>.tab-pane{
  height: 65vh;
}
.EstimateContentInQSE > #TitleHeaderEstimateForm > #minimize, .EstimateContentInQSE > #TitleHeaderEstimateForm > .close {
	display: none;
}
#ContainerLocationStatusHistory {
  padding: 5px 10px;
}
.EstimateContent{
  position: absolute;
  width: 81vw;
  height: 90vh;
  left: 17vw;
  overflow-y:hidden;
  overflow-x:auto;
}
#EstimateDetail > div > .modal-content {
  display: block;
}
#EstimateDetailTitleExtraComment > .editContainerLocationCommentBtn, .ViewTheReferenceBtn, #MovesTable > tbody > tr > td > .btn-info, #GateInfoIn > table > tbody > tr > td > .btn-info {
  margin-left: 5px;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
  color: #f8f8ff;
  background-color: crimson;
  border-color: #f8f8ff;
}
ul.list-group.LeftBottom {
  padding-bottom: 5vh;
}
table#ContainerLocationHistoryTable {
  position: relative;
}
div#EstimateDetail.show {
    overflow: hidden;
    transition: inset 0.6s ease, width 0.6s ease, height 0.6s ease;
}
.BoxEstimateTitle:nth-of-type(2) {
  margin-top: 25px;
}
.CancelBufferSelectionBtn {
    position: relative;
    margin-top: 50px;
}
.LocationChange,.StatusChange{
  background-size: 50px 40px;
  background-repeat: no-repeat;
  background-position: left;
}
.LocationChange{
  background-image: url("../Images/LocationChange.png");
}
.StatusChange{
  background-image: url("../Images/StatusChange.png");
}
#ContainerLocationStatusHistory> button {
  margin-top: 15px;
  border: 1px solid lightgrey;
}
#ContainerLocationStatusHistory> button:first-of-type {
  margin-top: 25px;
}
#ContainerLocationStatusHistory> button:last-of-type {
  margin-bottom: 25px;
}
#MarkUnitAsRepairedBtn, #MarkFoamAsRepairedBtn {
  margin-left: 10px;
}
@media screen and (max-width: 600px) {
  .smallFontSize {
    font-size: 0.4rem !important;
  }
  .smallerFontSize, .spcBtnBoxManu, .spcBtnUnitManu, .spcBtnEstimateLocationComment, .spcBtnCurrentLocationComment, .spcBtnBlockComment {
    font-size: 0.3rem !important;
  }
  /*************** TOP NAV *********************/
  .navbar {
    justify-content: flex-start;
  }
  #WebPageMainNavbar > .form-control {
    font-size: 0.7rem;
    width: 45%;
  }
  #WebPageMainNavbar > .mt-2 {
    margin-top: 0 !important;
  }
  #WebPageMainNavbar > .mt-2 > .nav-link {
    padding: 0rem 1rem;
  }
  #PersonalMenuDropOptions {
    right: 0;
  }
  .dropdown-item {
    font-size: 0.8rem
  }
  #PersonalMenuDropOptions> a > i {
    float: right !important;
  }
  .navbar-nav > li.nav-item.dropdown {
    width: auto;
  }

  /*************** HAMBURGER MENU *********************/
  .SideBarContent > .sidebar-heading img {
    padding-top: 35px;
    max-width: 70px;
    display: block;
    margin: 0 auto;
  }
  #sidebar-wrapper > .SideBarContent > .list-group {
    width: 90%;
  }
  .SideBarContent > div > .active {
    color: red;
  }
  /*************** SEARCH ESTIMATE *********************/
  #NavBarInQSE > div > ul > .nav-item > .dropdown-menu {
    position: absolute;
  }
  #NavBarInQSE > div > ul > .nav-item > .dropdown-menu > a {
    font-size: 0.65rem;
  }
  #ContainerNumberTxt_QSE {
    font-size: 0.8rem;
  }
  /*************** OVERVIEW *********************/
  .PendingAtGate {
    padding: 0rem 0.25rem;
    height: 9vh;
    font-size: 0.6rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .EstimateDetail-modal-body {
      font-size: 0.4rem;
  }
  h3.d-block {
      font-size: 1rem;
  }
  h6.d-block {
    font-size: 0.5rem;
  }
  .table.table-striped thead tr th {
    font-size: 0.5rem;
  }
  .table.table-striped tbody, .LoadVisitsBtn {
    font-size: 0.5rem;
  }
  .table.table-striped th, .table.table-striped td {
    padding: 0.3rem;
  }
  .AddABoxEstimateItemBtn,.AddAUnitEstimateItemBtn,button.btn.btn-warning.quickEditEstimate,button.btn.btn-warning.ShowEstimateBtn,button.btn.btn-info.ShowEstimateBtn,button#ShowWestimMessageBtn,button#CreateRevisedEstimateBtn,button#ChangeClientOfContainer,button#UpdatePoUser,button#UpdatePoOwner,button#ShowUnitInfoModal,button.btn.btn-dark.ShowWorkOrderBtn,button#CreateRevisedEstimateBtn1,button#CreateRevisedEstimateBtn2,button#CreateRevisedEstimateBtn3,button#CreateRevisedEstimateBtn4,button#CreateRevisedEstimateBtn5,button#CreateRevisedEstimateBtn6,button#MarkBoxAsUploadedBtn,button#MarkUnitAsUploadedBtn,button#PrintEirBtn,button#AddStatusBtn,button#CreateGateInEdiBtn, button#CreateStatusEdiBtn,button#CreateGateOutEdiBtn,button#CreateAndSendEstimateCompletionBtn,button#AutoRetrieveStatusBtn,button.SetAllSerialANDPictureBtns,button#ChangeContainerNumberBtn,button#MarkBoxAsRepairedBtn,button#MarkFoamAsRepairedBtn,button#MarkUnitAsRepairedBtn,button#MarkAsNoUnitRepairBtn,button#MarkAuthAndSNDAsRepairedBtn,button.ShowFISBtn, button.AddABoxEstimateItem3DBtn,button#MarkAuthAndAQCAsRepairedBtn, button#LoadAllUserLogBtn, button.QuickSelectAndCalcBtn, .AddCedexCoding, button.LoadRepairInfoBtn,button#AddSpecialGradeBtn,button#ReCreateOrEstimateBtn,button.editContainerLocationCommentBtn,button.takePictureFromEstimateBtn,button.CloseBtnEstimateDetailFooter,button.editDppAmountbtn,button.editUserOfContainerBtn,button.editDppCoveredBtn,button.toggleCWBtn,button.changeOnhireDateBtn,button.changeEstimateStartedDateBtn,button.RemoveEstimateInfo,button.OpenEstimateBtn,button.editIsoCodeBtn,button.editExteriorColorBtn, button.DeleteStatusBtn, button.CheckForASM_Case,button.QEE, button.ViewCostingUnitPartBtn, button.EditEC, button.DeleteFullRowQEE, button.addCostingBtn, button.DuplicateLineQEE, button.DuplicateLineAndPercentQEE, button.getPossibleCombisAndHighLightBtn, button.setLumpsumBtn, button#RemoveFromListNoUpload { 
    font-size: 0.5rem;
    margin: 5px;
    width: auto;
  }
  button#AddSpecialGradeBtn {
    margin-bottom: 100px;
  }
  .PtiResultOptions > button {
    margin: 0;
  }
  .EstimateFileNotBlocked, .EstimateFileBlocked{
    left: 0;
    top: 0;
    width:15px;
    height: 15px;
  }
  #LockOrNot > button > .fa-2x {
    font-size: 1em;
  }
  .EstimateDetail-modal-body .parentTabs .nav-tabs .nav-item .nav-link{
    padding: 0.4rem;
  }
  .modal-header2,h6#EstimateDetailTitleExtraComment {
    font-size: 0.5rem;
  }
  .LocationChange{
    background-size: 4vw 2vh;
  }
  .StatusChange{
    background-size: 4vw 2vh;
  }
  #PendingAtGateBtn {
    height: auto;
    font-size: 0.6rem;
    padding: 10px 5px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  div[class^="Pos"] {
    border: none;
  }
/*************** GATE TASKS *********************/
  #PendingTasks > .modal-dialog {
    -webkit-box-align: start;
    align-items: start;
  }
  #TruckersAtGateTbl {
    table-layout: fixed;
  }
  .gate-tasks-stop-buttons {
    background-color: darkslategrey;
    border-radius: 0;
  }
  .gate-tasks-stop-buttons button {
    padding: 0.5rem 0.5rem;
    line-height: 1;
    border-radius: 0.3rem;
    font-size: 1rem;
    margin-right: 10px;
    width: 27vw;
  }
  #PendingTasks > div:first-child {
    width:  96vw;
  }
  .PendingTasks-modal-body {
    width: 100%;
    overflow: scroll;
  }
  #TruckersAtGateTbl >thead > tr > td {
    font-weight: bold;
    padding: 10px 0px 10px 5px;
    text-align: left;
    font-size: 0.7rem;
  }
  .PendingTasks-modal-body table td,th {
    font-size: 0.6rem;
  }
  .gate-tasks-DiffertentStatusThenRefOut {
    background: linear-gradient(-45deg, #fff, #CCCC00);
    background-size: 400% 400%;
    animation: gateoutgrad 2s ease infinite;
  }
  @keyframes gateoutgrad {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }
  .truckers-at-gate-nr {
    width: 3vw;
  }
  .truckers-at-gate-container {
    width: 20vw;
  }
  .truckers-at-gate-task {
    width: 8vw;
  }
  .truckers-at-gate-license {
    width: 15vw;
  }
  .truckers-at-gate-client {
    width: 22vw;
  }
  .truckers-at-gate-iso {
    width: 9vw;
  }
  .truckers-at-gate-status, .dont-show-mobile {
    display: none;
  }
  .truckers-at-gate-temp {
    width: 10vw;
  }
  .truckers-at-gate-vent {
    width: 12vw;
  }
  .truckers-at-gate-hum {
    width: 21vw;
  }
  .truckers-at-gate-info {
    width: 9vw;
  }
  .truckers-at-gate-accept {
    width: 52vw;
  }
  .AcceptThisTask, .RemoveThisTask, #BtnContent > center > button {
    width: auto;
    min-width: 35%;
    border-radius: 5px;
    height: 5vh;
    margin-bottom: 0.5rem;
    font-family: inherit;
    line-height: 1.2;
    font-size: 0.5rem;
    border: none;
    margin-right: 10px;
    padding: 0px 10px;
  }
  .RemoveThisTask {
    float: right;
  }
  .ShowMultipleContainersInStackTaskForm {
    font-size: 0.4rem;
    padding: 3px;
  }
  #TruckersAtGateTbl .RefBtnInfo {
    background-color: transparent;
    border-color: transparent;
    padding: 0;
  }
  #TruckersAtGateTbl .RefBtnInfo .fa-info-circle:before {
    color: #17a2b8;
    font-size: 1rem;
  }
  .RefDetailGateOut > tbody > tr >td , .ReferenceDetail-modal-body > .RefDetailGateIn > tbody > tr >td {
    font-size: 0.7rem;
  }
  .RefDetailGateOut button {
    background-color: transparent;
    color: #17a2b8 !important;
    font-size: 0.6rem;
    border: 0px solid transparent;
    padding: 0;
    line-height: 1;
    border-radius: 0;
    text-decoration: underline;
  }
  .RefDetailGateOut .btn-margin-left {
    margin-left: 2vw;
    margin-top: -5px;
  }
  /******* CONTAINER STACKS*******/
  #MessageBox > .modal-dialog > .modal-content {
    width: 95%;
    margin: 0;
    overflow-x: scroll;
  }
  .modal-body-MessageBox > .FixedSquareW800 {
    width: 98%;
  }
  .modal-body-MessageBox > .FixedSquareW800 h1 {
    font-size: 1rem;
  }
  .modal-body-MessageBox >.FixedSquareW800 > div {
    font-size:  0.4rem;
  }
  .BackBtn, .BackBtnSubPlanContent, .BackBtnSubPlanContentLittleMoreLeft, .BackBtnSubPlanContentBottom {
    width: 8vw;
    height: 5vh;
    font-size: 0.4rem;
    padding: 2px 3px;
  }
  div > span.ClientsInStack, .ClientInStack  {
    font-size: 1px !important;
    max-height: 100%;
    overflow: hidden;
  }
  .monitoring-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber {
    font-size: 0.4rem;
    padding: 2px 2px !important;
  }
  #wrapper > #InlineContent {
    width: 52vw;
  }
  #ContainerLocationCommentEdit {
    display: block;
  }
  #EstimateDetailTitleExtraComment > #ContainerLocationCommentEdit {
    padding: 1px;
    width: auto;
    height: auto;
    margin-right: 10px;
  }
  #EstimateDetailTitleExtraComment > #ContainerLocationCommentEdit > span {
    font-size: 10px;
  }
  #ClientOfContainerLbl {
    width: 50px;
    padding-left: 10px;
  }
  #ClientOfContainerLbl > button {
    padding: 1px;
  }
  #ClientOfContainerLbl > button >span {
    font-size: 10px;
  }
  .StackMenuRb > button {
    font-size: 0.35rem;
    height: calc(100% / 9);
  }
  .btn-block + .btn-block {
    margin-top: 0.3rem !important;
  }
  /******* CONTAINER STACK BUTTONS *******/
  #OverViewBufferModal>.modal-dialog {
    max-width: 95vw;
  }
  /******* ESTIMATE DETAIL *******/
  #EstimateDetail>div>.modal-content>.EstimateDetail-modal-body {
    min-height: unset;
    height: auto;
  }
  /******* USER SETTINGS *******/
  #ViewCustomWordsList {
    font-size: 0.6rem;
    padding: 5px;
  }
  .FillSettingsBodyContent {
    font-size: 2.6vw;
  }
  /******* SETTINGS *******/
  .navbar-expand .navbar-nav .nav-link {
    padding-right: 0.15rem;
    padding-left: 0.15rem;
  }
  .nav-item > #NavBarServerSettings {
    left: 55vw;
  }
  .nav-item > #NavBarCedexConvertionsExceptions  {
    left: 45vw;
  }
  .nav-item > #NavBarLocationSettings  {
    left: 35vw;
  }
  .nav-item > #NavBarDropAdjustDb  {
    left: 25vw;
  }
  .nav-item > #NavBarDropUsers  {
    left: 15vw;
  }
  .nav-item > #NavBarDropBoxParts  {
    left: 10vw;
  }
  .nav-item > #NavBarDropUnitParts  {
    left: 5vw;
  }
  .nav-item > div > a  {
    font-size: 0.6rem;
  }
  .SettingsContent > .mb-4 > #TitleSettingsActive {
    margin: 0 !important;
  }
  /* Rates */

  /*******MESSAGING*******/
  .LeftSideMessaging {
    width: 35%;
  }
  .LeftSideMessaging > .searchContact > input, .LeftSideMessaging > .MessagesContactsFound > button  {
    font-size: 0.6rem;
  }
  .RightSideMessaging {
    width: 65%;
  }
  .MessageContainer > .talk-bubble {
    max-width: 80%;
    margin: 40px 20px;
    font-size: 0.8rem;
  }
  .MessageContainer > .TypeMessageField {
    width: 80%;
  }
  .MessageContainer > .SendMessage {
    width: 20%;
    font-size: 0.6rem;
    color: ghostwhite;
    background-color: green;
  }
  /******* SEARCH ALL INTERACTION LOG *******/
  .search-all-log-modal > .form-group {
    display: block;
  }
  .search-all-log-modal > .form-group > label {
    width: 100%;
    max-width: 100%;
  }
  .search-all-log-modal > .form-group > input {
    width: 90%;
    max-width: 100%;
    margin-left: 10px;
  }
  #Get_All_UserLog_InteractionBtn {
    margin: 10px 0px 30px;
  }
  /******* TUTORIALS*******/
  .TableTutorialsContainer {
    width: 100%;
  }
  /******* EDI RECEIVED ******/
  #QSE_SearchBar > div {
    float: none !important;
  }
  #QSE_SearchBar > div > #SearchFilterTxt {
    width: 70%;
    margin: 0px 15px;
  }
}
@media screen and (min-width: 601px) and (max-width: 900px){
  .smallFontSize {
    font-size: 0.6rem !important;
  }
  .smallerFontSize, .spcBtnBoxManu, .spcBtnUnitManu, .spcBtnEstimateLocationComment, .spcBtnCurrentLocationComment, .spcBtnBlockComment {
    font-size: 0.7rem !important;
  }
  .table.table-striped tbody {
    font-size: 0.5rem;
  }
  .table.table-striped th, .table.table-striped td {
    padding: 0.3rem;
  }
  /*************** TOP NAV *********************/
  .navbar {
    justify-content: flex-start;
  }
  #WebPageMainNavbar > .form-control {
    font-size: 0.7rem;
    width: 45%;
  }
  #WebPageMainNavbar > .mt-2 {
    margin-top: 0 !important;
  }
  #WebPageMainNavbar > .mt-2 > .nav-link {
    padding: 0rem 1rem;
  }
  #PersonalMenuDropOptions {
    right: 0;
  }
  .dropdown-item {
    font-size: 0.8rem
  }
  #PersonalMenuDropOptions> a >i {
    float: right !important;
  }
  .navbar-nav > li.nav-item.dropdown {
    width: auto;
  }
  /*************** HAMBURGER MENU *********************/
  .SideBarContent > .sidebar-heading img {
    padding-top: 35px;
    max-width: 70px;
    display: block;
    margin: 0 auto;
  }
  #sidebar-wrapper > .SideBarContent > .list-group {
    width: 90%;
  }
  h3.d-block {
      font-size: 1rem;
  }
  h6.d-block {
    font-size: 0.90rem;
  }

  .table.table-striped thead tr th {
    font-size: 0.90rem;
  }
  .table.table-striped tbody {
    font-size: 0.90rem;
  }
  .table.table-striped th, .table.table-striped td {
    padding: 0.3rem;
  }
  .AddABoxEstimateItemBtn,.AddAUnitEstimateItemBtn,button.btn.btn-warning.quickEditEstimate,button.btn.btn-warning.ShowEstimateBtn,button.btn.btn-info.ShowEstimateBtn,button#ShowWestimMessageBtn,button#CreateRevisedEstimateBtn, button.AddCedexCoding, button#ChangeClientOfContainer,button#UpdatePoUser,button#UpdatePoOwner,button#ShowUnitInfoModal,button.btn.btn-dark.ShowWorkOrderBtn,button#CreateRevisedEstimateBtn1,button#CreateRevisedEstimateBtn2,button#CreateRevisedEstimateBtn3,button#CreateRevisedEstimateBtn4,button#CreateRevisedEstimateBtn5,button#CreateRevisedEstimateBtn6,button#MarkBoxAsUploadedBtn,button#MarkUnitAsUploadedBtn,button#PrintEirBtn,button#AddStatusBtn,button#CreateGateInEdiBtn, button#CreateStatusEdiBtn,button#CreateGateOutEdiBtn,button#CreateAndSendEstimateCompletionBtn,button#AutoRetrieveStatusBtn,button.SetAllSerialANDPictureBtns,button#ChangeContainerNumberBtn,button#MarkBoxAsRepairedBtn,button#MarkFoamAsRepairedBtn,button#MarkUnitAsRepairedBtn,button#MarkAsNoUnitRepairBtn,button#MarkAuthAndSNDAsRepairedBtn,button.ShowFISBtn, button.AddABoxEstimateItem3DBtn,button#MarkAuthAndAQCAsRepairedBtn, button#LoadAllUserLogBtn, button.QuickSelectAndCalcBtn, button.LoadRepairInfoBtn,button#AddSpecialGradeBtn,button#ReCreateOrEstimateBtn,button.editContainerLocationCommentBtn,button.takePictureFromEstimateBtn,button.CloseBtnEstimateDetailFooter,button.editDppAmountbtn,button.editUserOfContainerBtn,button.editDppCoveredBtn,button.toggleCWBtn,button.changeOnhireDateBtn,button.changeEstimateStartedDateBtn,button.RemoveEstimateInfo,button.OpenEstimateBtn,button.editIsoCodeBtn,button.editExteriorColorBtn, button.DeleteStatusBtn, button.CheckForASM_Case,button.QEE, button.ViewCostingUnitPartBtn, button.EditEC, button.DeleteFullRowQEE, button.addCostingBtn, button.DuplicateLineQEE, button.DuplicateLineAndPercentQEE, button.getPossibleCombisAndHighLightBtn, button.setLumpsumBtn, button#RemoveFromListNoUpload { 
    font-size: 0.75rem;
    margin: 5px;
    width: auto;
  }
  button#AddSpecialGradeBtn {
    margin-bottom: 100px;
  }
  .PtiResults > .NegativePtiResults > .PtiResultOptions > button {
    margin: 0;
  }
  .AlterNativeLocations>button{
    font-size: 0.75rem;

  }
  .EstimateFileNotBlocked, .EstimateFileBlocked{
    left: 0;
    top: 0;
    width:15px;
    height: 15px;
  }
  button#ToggleLockBtn, button#PrintCorrectWorkOrder,button.ContainerChatBtn,button.EstimateChatBtn {
    position: relative;
    width:30px;
    height: 30px;
  }
  #PrintCorrectWorkOrder > i,button.ContainerChatBtn>i, button.EstimateChatBtn>i {
    font-size: 15px;
  }
  .EstimateDetail-modal-body .parentTabs .nav-tabs .nav-item .nav-link{
    padding: 0.4rem;
  }
  .modal-header2,h6#EstimateDetailTitleExtraComment {
    font-size: 0.5rem;
  }
  .LocationChange{
    background-size: 4vw 2vh;
  }
  .StatusChange{
    background-size: 4vw 2vh;
  }
  #LockOrNot > button {
    margin: 0px 3px;
  }
  .EstimateChatBtn > .entryCount {
    padding: 5px 8px;
    font-size: 7px;
  }
  /***************GATE TASKS *********************/

  #PendingTasks > .modal-dialog {
    -webkit-box-align: start;
    align-items: start;
    margin: 3vw;
  }
  #PendingTasks > .modal-dialog > .modal-content {
    width: 105%;
  }
  #TruckersAtGateTbl {
    table-layout: fixed;
  }
  .gate-tasks-stop-buttons {
    background-color: darkslategrey;
    border-radius: 0;
  }
  .gate-tasks-stop-buttons button {
    padding: 0.5rem 0.5rem;
    line-height: 1;
    border-radius: 0.3rem;
    font-size: 1rem;
    margin-right: 10px;
    width: 27vw;
  }
  #PendingTasks > div:first-child {
    width:  96vw;
  }
  .PendingTasks-modal-body {
    width: 100%;
    overflow: scroll;
  }
  #TruckersAtGateTbl >thead > tr > td {
    font-weight: bold;
    padding: 10px 0px 10px 5px;
    text-align: left;
    font-size: 0.7rem;
  }
  .PendingTasks-modal-body table td,th {
    font-size: 0.6rem;
  }
  .gate-tasks-DiffertentStatusThenRefOut {
    background: linear-gradient(-45deg, #fff, #CCCC00);
    background-size: 400% 400%;
    animation: gateoutgrad 2s ease infinite;
  }
@keyframes gateoutgrad {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
  }
  .truckers-at-gate-nr {
    width: 3vw;
  }
  .truckers-at-gate-container {
    width: 20vw;
  }
  .truckers-at-gate-task {
    width: 8vw;
  }
  .truckers-at-gate-license {
    width: 15vw;
  }
  .truckers-at-gate-client {
    width: 22vw;
  }
  .truckers-at-gate-iso {
    width: 9vw;
  }
  .truckers-at-gate-status, .dont-show-mobile {
    display: none;
  }
  .truckers-at-gate-temp {
    width: 10vw;
  }
  .truckers-at-gate-vent {
    width: 12vw;
  }
  .truckers-at-gate-hum {
    width: 21vw;
  }
  .truckers-at-gate-info {
    width: 9vw;
  }
  .truckers-at-gate-accept {
    width: 52vw;
  }
  .AcceptThisTask, .RemoveThisTask, #BtnContent > center > button {
    width: auto;
    min-width: 35%;
    border-radius: 5px;
    height: 5vh;
    margin-bottom: 0.5rem;
    font-family: inherit;
    line-height: 1.2;
    font-size: 0.5rem;
    border: none;
    margin-right: 10px;
    padding: 0px 10px;
  }
  .RemoveThisTask {
    float: right;
  }
  .ShowMultipleContainersInStackTaskForm {
    font-size: 0.6rem;
    padding: 3px;
  }
  #TruckersAtGateTbl .RefBtnInfo {
    background-color: transparent;
    border-color: transparent;
    padding: 0;
  }
  #TruckersAtGateTbl .RefBtnInfo .fa-info-circle:before {
    color: #17a2b8;
    font-size: 1rem;
  }
  #ReferenceDetail > .modal-dialog {
    margin: 3vw;
  }
  .RefDetailGateOut > tbody > tr >td , .ReferenceDetail-modal-body > .RefDetailGateIn > tbody > tr >td {
    font-size: 0.7rem;
  }
  .RefDetailGateOut button {
    background-color: transparent;
    color: #17a2b8 !important;
    font-size: 0.6rem;
    border: 0px solid transparent;
    padding: 0;
    line-height: 1;
    border-radius: 0;
    text-decoration: underline;
  }
  .RefDetailGateOut .btn-margin-left {
    margin-left: 2vw;
    margin-top: -5px;
  }
  /*******CONTAINER STACKS*******/
  #MessageBox > .modal-dialog > .modal-content {
    width: 95%;
    margin: 0;
    overflow-x: scroll;
  }
  .modal-body-MessageBox > .FixedSquareW800 {
    width: 98%;
  }
  .modal-body-MessageBox > .FixedSquareW800 h1 {
    font-size: 1rem;
  }
  .modal-body-MessageBox >.FixedSquareW800 > div {
    font-size:  0.4rem;
  }
  .BackBtn, .BackBtnSubPlanContent, .BackBtnSubPlanContentLittleMoreLeft, .BackBtnSubPlanContentBottom {
    width: 8vw;
    height: 5vh;
    font-size: 0.8rem;
    padding-top: 0px;
  }
  div > span.ClientsInStack, .ClientInStack {
    font-size: 2px !important;
  }
  .StackMenuRb > button {
    padding: 0;
  }
  .monitoring-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber {
    font-size: 0.5rem;
    padding: 2px;
  }
  #wrapper > #InlineContent {
    width: 35vw;
  }
  .StackMenuRb > button {
    display: block;
    font-size: 0.4rem;
    padding: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #PendingAtGateBtn {
    height: auto;
    font-size: 0.6rem;
    padding: 10px 5px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  /******* ESTIMATE DETAIL*******/
  #ContainerLocationCommentEdit {
    display: block;
  }
  #ClientOfContainerLbl {
    width: 50px;
    padding-left: 10px;
  }
  #ClientOfContainerLbl > button {
    padding: 1px;
  }
  #ClientOfContainerLbl > button {
    padding: 3px;
  }
  #EstimateDetail>div>.modal-content>.EstimateDetail-modal-body {
    overflow-y: scroll;
  }
  #EstimateDetail > div > .modal-content > .EstimateDetail-modal-body > .tabbable > .tab-content > .tab-pane > .tabbable > .tab-content > .tab-pane {
    height: 70%;
  }
  .OnlyAdmin #ShowWestimMessageBtn, .OnlyAdmin #CreateRevisedEstimateBtn, .OnlyAdmin #CreateCWRevisedEstimateBtn, .OnlyAdmin #RemoveFromListNoUpload {
    color: ghostwhite;
    float: none;
    font-size: 0.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .OnlyAdmin #CreateCWRevisedEstimateBtn {
    margin-bottom: 0.375rem;
  }
  #QuickAddLinesHeader > button {
    font-size: 0.6rem;
    margin: 5px;
  }
  .CheckForASM_Case {
    font-size: 0.6rem;
  }
  /*******USER SETTINGS*******/
  #ViewCustomWordsList {
    font-size: 0.6rem;
    padding: 5px;
  }
  /*******SETTINGS*******/
  #NavBarInSettings {
    position: relative;
    max-width: 100vw;
    font-size: 0.6rem;
  }
  .SubSubContentForm > fieldset > select, .SubSubContentForm > fieldset > input {
    margin: 0 auto;
  }
  #navBarSettings > .navbar-nav > .nav-item > .nav-link {
    font-size: 1.25vw;
  }
  .nav-item > #NavBarServerSettings {
    left: 55vw;
  }
  .nav-item > #NavBarCedexConvertionsExceptions  {
    left: 40vw;
  }
  .nav-item > #NavBarLocationSettings  {
    left: 30vw;
  }
  .nav-item > #NavBarDropAdjustDb  {
    left: 20vw;
  }
  .nav-item > #NavBarDropUsers  {
    left: 15vw;
  }
  .nav-item > #NavBarDropBoxParts  {
    left: 10vw;
  }
  .nav-item > #NavBarDropUnitParts  {
    left: 5vw;
  }
  .nav-item > div > a  {
    font-size: 0.6rem;
  }
  /*******MESSAGING*******/
  .LeftSideMessaging {
    width: 35%;
  }
  .LeftSideMessaging > .searchContact > input, .LeftSideMessaging > .MessagesContactsFound > button  {
    font-size: 0.6rem;
  }
  .RightSideMessaging {
    width: 65%;
  }
  .MessageContainer > .talk-bubble {
    max-width: 80%;
    margin: 40px 20px;
    font-size: 0.8rem;
  }
  .MessageContainer > .TypeMessageField {
    width: 80%;
  }
  .MessageContainer > .SendMessage {
    width: 20%;
    font-size: 0.6rem;
    color: ghostwhite;
    background-color: green;
  }
  /******* TUTORIALS*******/
  .TableTutorialsContainer {
    width: 100%;
  }
  /******* EDI RECEIVED ******/
  #QSE_SearchBar > div {
    float: none !important;
  }
  #QSE_SearchBar > div > #SearchFilterTxt {
    width: 70%;
    margin: 0px 15px;
  }
}
@media screen and (min-width: 901px) and (max-width: 1580px){
  .smallFontSize {
    font-size: 0.6rem !important;
  }
  .smallerFontSize, .spcBtnBoxManu, .spcBtnUnitManu, .spcBtnEstimateLocationComment, .spcBtnCurrentLocationComment, .spcBtnBlockComment {
    font-size: 0.5rem !important;
  }
  /*******CONTAINER STACKS*******/
  #MessageBox > .modal-dialog > .modal-content {
    width: 100%;
    margin: 0;
    overflow-x: scroll;
  }
  .modal-body-MessageBox > .FixedSquareW800 {
    width: 98%;
  }
  .modal-body-MessageBox > .FixedSquareW800 h1 {
    font-size: 1rem;
  }
  .modal-body-MessageBox >.FixedSquareW800 > div {
    font-size:  0.6rem;
  }
  .BackBtn, .BackBtnSubPlanContent, .BackBtnSubPlanContentLittleMoreLeft, .BackBtnSubPlanContentBottom {
    width: 4vh;
    height: 6vh;
    font-size: 1rem;
  }
  div > span.ClientsInStack, .ClientInStack  {
    font-size: 2px !important;
  }
  .monitoring-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber {
    font-size: 0.5rem;
  }
  #wrapper > #InlineContent {
    width: 25vw;
  }
  .PendingTasks-modal-body {
    width: 100%;
    overflow: scroll;
 }
  .PendingTasks-modal-body table td, .PendingTasks-modal-body table th {
    font-size: 0.8rem;
  }
  .RefBtnInfo {
    width: auto;
    font-size: 0.7rem;
  }
  .AcceptThisTask, .PreBarrierCheckThisContainer, .RemoveThisTask {
    width: auto;
    font-size: 0.8rem;
  }
  .QuickAcceptTaskGateInBtn {
    width: auto;
    font-size: 1rem;
  }
  .truckers-at-gate-nr {
    width: 3vw;
  }
  .truckers-at-gate-container {
    width: 20vw;
  }
  .truckers-at-gate-task {
    width: 8vw;
  }
  .truckers-at-gate-license {
    width: 15vw;
  }
  .truckers-at-gate-client {
    width: 22vw;
  }
  .truckers-at-gate-iso {
    width: 9vw;
  }
  .truckers-at-gate-status, .dont-show-mobile {
    display: none;
  }
  .truckers-at-gate-temp {
    width: 10vw;
  }
  .truckers-at-gate-vent {
    width: 12vw;
  }
  .truckers-at-gate-hum {
    width: 21vw;
  }
  .truckers-at-gate-info {
    width: 9vw;
  }
  .truckers-at-gate-accept {
    width: 90vw;
  }
}
.FixedSquareW800{
  width: 800px;
  height: 800px;
  position: relative;
  border: 1px solid black;
  margin: 1vw;
  padding: 0.5vw;
}
.FixedSquareW800 > .show-in-stack-title {
  display: inline-block;
  position: relative;
  top: -5%;
  z-index: 9999;
  padding: 0 10px;
  font-size: 2rem;
  background-color: white;
  border: 1px solid black;
}
.FixedSquareW800>div{
  font-size: 0.6rem;
  cursor:  pointer;
}
.SpecialGradeRow>td:first-child {
  cursor: pointer;
}
.ReferenceInfoDetailInSpecForm-modal-body>table>tbody>tr>td:nth-child(2) {
  min-width: 25vw;
  float: left;
}
.RefenceInfoDetailOutSpecForm-modal-body>table>tbody>tr>td:nth-child(2) {
  min-width: 25vw;
  float: left;
}
.PictureDetails {
  float: left;
}
/************** Global ********************/
.mw50P.bg-warning {
  background-color: #ff5f1f !important;
}
.mw50P.bg-warning > .modal-dialog {
  margin: 5vh auto;
}
.swal-fullscreen {
  width: 95vw !important;
  max-width: none !important;
  height: 90vh !important;
  margin: 0 auto;
  padding: 0 !important;
  overflow: hidden;
}
.swal-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  background-color: #f7f7f7;
  border-bottom: 1px solid #dee2e6;
  font-size: 1.25rem;
  font-weight: 500;
  color: #212529;
}
.swal-close-btn {
  padding: 0.5rem 1rem;
  margin: -0.5rem -1rem -0.5rem auto;
  background: none;
  border: none !important;
  outline: none !important;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  opacity: 0.5;
  cursor: pointer;
}
.swal-close-btn:hover {
  opacity: 0.75;
}
#swal2-html-container:has(#license-plate-modal) {
  overflow-y: hidden;
}
.swal-body-content {
  padding: 20px;
  max-height: calc(90vh - 60px);
  overflow: auto;
  scrollbar-gutter: stable;
}
/************** Stack Layout ****************/
span.ClientsInStack, .ClientInStack  {
    background-color: rgb(169,22,5);
    padding: 1px;
    z-index: 4;
    opacity: 0.8;
    font-weight: normal;
    font-size: 10px;
    color: ghostwhite;
}
.MonitoringMainStack, .megaLB-stacknumber, .megaRB-stacknumber, .Q730-stacknumber, .Q869-stacknumber, .Q913-stacknumber, .Q1207-stacknumber, .QEMER-stacknumber {
  display:flex;
  justify-content:center;
  align-items:center;
  font-size: 1.2rem;
}
.MonitoringMainStack > div, .megaLB-stacknumber > div, .megaRB-stacknumber > div, .Q730-stacknumber > div, .Q869-stacknumber > div, .Q913-stacknumber > div, .Q1207-stacknumber > div, .QEMER-stacknumber > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
.monitoring-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber, .span-content-stacknumber {
  padding: 2px 5px;
  position: relative;
  z-index: 5;
  background-color: ghostwhite;
  color: #28282b !important;
  opacity: 0.8;
  border-radius: 5px;
  font-weight: bold;
}
.MRB00 .ClientsInStack, .MRB98 .ClientsInStack, .MRB99 .ClientsInStack, .MRB52 .ClientsInStack {
  max-width: 100%;
}
.ContainerRbSpecLocation:empty {
  cursor: default;
  border: none;
  opacity: 0;
}
.ContainerRbSpecLocation:empty:hover {
  cursor: default ;
}
.StackMenuRb {
  overflow-y: auto;
  border: none;
}
#StackLayoutRb {
  margin: 0px 5px;
}
.StackLayoutClass {
  margin: 20px auto;
}
.LargerBtn {
  width: 90%;
  height: calc(100%/17);
  outline: solid 1px #f8f9fa;
  transition: outline 0.3s linear;
  margin: 0.5em;
}
.LargerBtn:hover {
  border-color: #f8f9fa;
  outline-width: 4px;
}
/** STACK DETAIL **/
#NoWOModal>.modal-dialog>.modal-content {
    border: 2px solid #dc3545;
    font-size: 1.3rem;
}

/************** ESTIMATE DETAIL ****************/
#getVesselEIRBtn {
  margin: 0px 10px;
}
.BoxEstimateTitle, .UnitEstimateTitle {
  padding: 10px;
}
.UnitEstimateTitle {
  margin-top: 75px;
}
/* PICTURES AWS */
.FileManagerResult_AWS > * {
  margin: 10px 0px 10px 10px;
}
.FileManagerResult_AWS > .data > .files {
  width: 400px;
  height: auto;
  z-index: 0 !important;
  margin: 15px;
  padding: 0;
  box-shadow: 0px 5px 18px darkgrey;
}
.FileManagerResult_AWS > .data > .folders {
  z-index: 0 !important;
}
.FileManagerResult_AWS > .data > .files > .icon, #SheetMetalDrawingContainer > .data > .files > .icon  {
  float: none;
  margin: 0;
  width: 100%;
  height: auto;
  max-height: 300px;
}
.FileManagerResult_AWS > .data > .files > span::after {
  display: none;
}
.FileManagerResult_AWS > .data > .files > span > a > img, .FileManagerResult_AWS > .data > .files > span > a > video, #SheetMetalDrawingContainer  > .data > .files > span > a > img  {
  width: 100%;
  height: auto;
}
.FileManagerResult_AWS > .data > .files > .AWS_CheckBox {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
}
.FileManagerResult_AWS > .data > .files > .name {
  position: absolute;
  z-index: 0;
  top: 0px;
  background: ghostwhite;
  right: 0;
  padding: 5px 10px;
  opacity: 0.85;
  font-size: 0.8rem;
  border-radius: 5px;
}
.FileManagerResult_AWS > .data > .files > .details {
    z-index: 0;
    bottom: 0;
    left: 0;
    top: unset;
    width: 100%;
    height: auto;
    background: ghostwhite;
    opacity: 0.85;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 0.8rem;
}
/************** USER INTERFACE SETTINGS ****************/
#navBarSettings {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-preferred-size: auto;
  flex-basis: auto;
  user-select: none;
}
#TitleSettingsActive{
  margin-left: 1.25rem !important;
  padding-bottom: 1rem;
}
#PreviewStack {
  align-items: center;
}
/************** SLIDER ****************/
.switch {
  --line: #505162;
  --dot: #f7f8ff;
  --circle: #9ea0be;
  --duration: 0.3s;
  --text: #9ea0be;
  cursor: pointer;
}
.switch input {
  display: none;
}
.switch input + div {
  position: relative;
}
.switch input + div:before, .switch input + div:after {
  --s: 1;
  content: "";
  position: absolute;
  height: 4px;
  top: 10px;
  width: 24px;
  background: var(--line);
  transform: scaleX(var(--s));
  transition: transform var(--duration) ease;
}
.switch input + div:before {
  --s: 0;
  left: 0;
  transform-origin: 0 50%;
  border-radius: 2px 0 0 2px;
}
.switch input + div:after {
  left: 28px;
  transform-origin: 100% 50%;
  border-radius: 0 2px 2px 0;
}
.switch input + div span {
  padding-left: 56px;
  line-height: 24px;
  color: var(--text);
}
.switch input + div span:before {
  --x: 0;
  --b: #dc3545;
  --s: 4px;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 var(--s) var(--b);
  transform: translateX(var(--x));
  transition: box-shadow var(--duration) ease, transform var(--duration) ease;
}
.switch input + div span:not(:empty) {
  padding-left: 64px;
}
.switch input:checked + div:before {
  --s: 1;
}
.switch input:checked + div:after {
  --s: 0;
}
.switch input:checked + div span:before {
  --x: 28px;
  --s: 12px;
  --b: limegreen;
}

body .switch + .switch {
  margin-top: 32px;
}
body .dribbble {
  position: fixed;
  display: block;
  right: 20px;
  bottom: 20px;
}
body .dribbble img {
  display: block;
  height: 28px;
}
/*************** Unit Estimate  *********************/
.EditUnitInfo-modal-body {
  padding: 10px;
}
/*************** Hours Personnel Table *********************/
.theResultHoursContent > .btn {
  margin: 5px 10px 5px 0px;
}
#ThePersonHoursTbl {
  margin-top: 3rem;
}
#ThePersonHoursTbl > thead > tr > th {
  font-weight: normal;
  font-size: 1rem;
  border-right: 2px solid lightgrey;
  border-bottom: none;
  border-top: none;
  text-align: center;
}
#ThePersonHoursTbl > thead > tr:first-child > th {
  font-weight: bold;
  font-size: 1.2rem;
}
.PerDayRow > td, .SumRow > th, .SumRow > td {
  text-align: center;
  vertical-align: middle;
  border-right: 2px solid lightgrey;
  border-top: none;
  border-bottom: none;
}

@media all and (max-width:30em){
  .SaveUserSettingBtn{
    display:block;
    margin:0.2em auto;
  }
}
#MyCustomWordsList {
  align-items: center;
  font-size: 1rem;
}
#MyCustomWordsList label {
  margin: 0;
}
input#ValidationInPutLast2LettersLicensePlate {
  font-size: 4em;
}
#ClientOfContainerLbl > button {
  margin-left: 10px;
}
#OriginalEstimate > .CostingSummaryTitle {
  margin-top:50px;
}
#OriginalEstimate > .CostingSummaryTitle, .BoxEstimateTitle > h3, .BoxEstimateTitle > h6 {
  padding-left: 5px;
}
/*#Non-Modal-InEstimate-Box {
  overflow-y: hidden;
}*/ /*Commented out bc this made dragging modal disappear outside of parent*/
#TitleHeaderEstimateForm > .close {
  float: right;
  margin: -1rem 0rem -1rem 0;
  border: none;
  background: none;
  padding: 1rem;
  cursor: pointer;
}
#TitleHeaderEstimateForm > .close > i {
  line-height: 1.4;
  font-size: 1.3rem;
  cursor: pointer;
  font-weight: 700;
}
#MinimizeMenuBtn {
  z-index: 1;
}
#minimize {
  float: right;
  margin: -1rem 0rem -1rem auto;
  border: none;
  background: none;
  padding: 1rem;
  cursor: pointer;
}
#minimize i {
  line-height: 1.4;
  font-size: 1.3rem;
  cursor: pointer;
  font-weight: 700;
}
#minimized-containers {
  width: auto;
  height: 3vh;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 9999;
  opacity: 1;
}
#minimized-containers button {
  float: left;
  width: 7vw;
  height: 1vw;
  font-size: 12px;
  padding: 0;
  margin: 0px 5px;
  color: black;
  background-color: GhostWhite;
  animation: none;
}
.minimizedButtonActive{
  background-color: black !important;
  color: GhostWhite !important;
}
.table-danger td {
  vertical-align: middle;
}
.ResultBookedVsStock .table-danger td {
  vertical-align: top;
}
#ChangeContainerNumberBtn {
    max-width: 300px;
}
.editIsoCodeBtn, #AcepDateField > button {
  margin-left: 5px;
}
#EC_BoxInfoTbl_IsoCode button span {
  top: 0px;
}
.SelectISOCode {
  border: 1px solid #28a745;
  color: grey;
  padding: 0.2rem;
}
/*Cancel button Edit loctation comment*/
#CancelYesNoForm {
  background-color: #dc3545;
  color: white;
}
/*Popup (auto retrieve new status Estimate Detail)*/
.ContainerInStackInEstimateForm {
  display: inline-block;
  width: 100%;
  padding: 5px;
}
.ContainerInStackInEstimateForm:empty {
  display: none;
}
#ClientOfContainerLbl > button {
  margin-left: 10px;
}
/**** SESSIONLOGOUT TIMER ****/
#btnLogoutNow {
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #428bca;
  color: #fff;
}
#btnOk {
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #428bca;
  color: #fff;
}
#btnSessionExpiredCancelled {
  background-color: #428bca;
  color: #FFF;
}
/* EINDE NATE LAYOUT---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*Ni vergeten, ook nog font-size gezet op .SpecialGrade*/
.PreBarrierSpecialGradeModal-modal-body > button {
  border-radius: 10px;
  margin: 5px;
}
.PreBarrierSpecialGradeModal-modal-body > button:hover {
  background-color: ghostwhite;
  color: darkslategrey;
}
/******PostRepairPictures*****/

#PostRepairPicturesBtn {
  background-color: transparent;
  border: 1px solid white;
  padding: 0;
}

#PostRepairPicturesBtn:focus {
  box-shadow: 0 0 0 0.2rem rgb(255 255 255 / 0%);
}

#PostRepairPicturesBtn .post-rep-cam {
  color: #28a745;
  font-size: 3rem;
  -webkit-transition: color 2s ease-out;
  -moz-transition: color 2s ease-out;
  -o-transition: color 2s ease-out;
  transition: color 2s ease-out;
}

#PostRepairPicturesBtn:focus .post-rep-cam {
  color: grey;
}

#PostRepairPicturesBtn .post-rep-wrench {
  font-size: 0.65rem;
  margin-top: -4.5px;
}
@media only screen and (max-width: 992px) {
  .navbar-expand-lg {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
  .navbar-expand-lg .navbar-collapse {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
  #AddBottleBtn, #GetAllFreonCasesBtn {
    font-size: 12px;
  }
  body > .TEST_VERSION.HighlightContainer {
    left: 34vw;
    width: 32vw;
    font-size: 1rem;
  }
  /* USER SETTINGS */
  .OverWriteModal-modal-body > .container > div > label, .OverWriteModal-modal-body > .container > div > button {
    font-size: 0.6rem;
  }
  .CopyToClipBoardTable {
    float: none !important;
    border: 1px solid #23272b;
  }
  /* SETTINGS */
  #navBarSettings > ul > li > .dropdown-toggle::after {
    display: block;
    margin-top: 5px;
    margin-left: 45%;
  }
  #SettingsContentBody > nav > div, #SettingsContentBody > nav > div > .navbar-nav {
    display: block !important;
  }
  #SettingsContentBody > nav > div > .navbar-nav > li {
    display: inline-block;
    width: auto;
  }
  #SettingsContentBody > nav > div > .navbar-nav > li > a {
    font-size: 0.6rem;
    padding: 8px 10px;
  }
  .SettingsContent > .mb-4 {
    margin: 0.75rem 0 !important;
  }
  .d-sm-flex > #TitleSettingsActive {
    margin-bottom: 0;
    padding-bottom: 0;
    margin-block-start: 0.2rem;
    font-size: 1.2rem;
  }
  .SettingsContent > .d-sm-flex {
    display: block !important;
  }
  #navBarSettings > .navbar-nav > .nav-item > .nav-link {
    font-size: 1.8vw;
  }
  #SettingsContentSubBody > div > div > div > fieldset {
    text-align: right;
  }
  #SettingsContentSubBody > div > div > div > fieldset > h1 {
    text-align: center;
    margin-bottom: 1rem;
  }
  #SettingsContentSubBody > div > div > div > fieldset > button {
    float: none !important;
    margin-bottom: 1rem;
    border: 1px solid #23272b;
  }
  #SettingsContentSubBody > div > div > div > fieldset > div > .row > .col-sm-12,  #ResultTablePeriodList_wrapper > .row > .col-sm-12 {
    overflow-x: auto;
    width: 100%;
  }
  #SettingsContentSubBody > div > div > div > fieldset > div > .row > .col-md-6, #ResultTablePeriodList_wrapper > .row > .col-md-6 {
    display: inline-block;
    flex: unset;
    width: 45%;
    margin-right: 5%;
  }
  .dataTables_length label, .dataTables_filter label {
    display: flex;
    align-items: center;
  }
  .dataTables_length select, .dataTables_filter input  {
    margin: 0% 5%;
  }
  .card-body {
    -webkit-box-flex: unset;
    -ms-flex: unset;
    flex: none;
    width: 98vw;
    padding: 1vw;
  }
  /* Unit parts settings */
  #SettingsContentBody > nav > div > .navbar-nav > .UnitpartsInSettings {
    width: 100%;
  }
  #SettingsContentBody > nav > div > .navbar-nav > .UnitpartsInSettings > a {
    padding: 0.5rem;
    font-size: 0.6rem;
  }
  td > .editPartPrice, td > .editPartDescription {
    float: none;
    display: block;
  }
  #ViewAllParts {
    overflow-x: auto;
  }
  /* Box parts settings */
  #PartsResultTable_wrapper > .row:first-child > div, #PendingEdiTbl_wrapper > .row:first-child > div {
    display: inline-block;
    width: 45%;
    margin: 10px 5px;
  }
  #AddBoxPartBtn {
    background-color: #dc3545;
    color: ghostwhite;
    padding: 8px 10px;
  }
  #PartsResultTable > tbody > tr > .NoSelect > button {
    display: block;
    margin-bottom: 5px;
  }
  /* Add or edit user settings */
  .EditCompanyUser > form > div > input {
    width: 85vw;
  }
  /* Adjust DB */
  .AddAUnitRepair > .matrixes-labels-inputs {
    width: 85vw;
    float: none;
    margin: 0 auto;
  }
  .user-settings-label, .user-settings-slider {
    display: inline-block;
    width: auto;
  }
  li > div#NavBarUISettings {
    left: 40vw;
  }
  li > div#NavBarCommunicationSettings {
    left: 50vw;
  }
  /* UI */
  #SettingsContentBody > .form-group > .col-1 {
    -webkit-box-flex: unset;
    -ms-flex: unset;
    flex: unset;
    max-width: unset;
    width: 40%;
    font-size: 0.7rem;
  }
  /* ESTIMATE DETAIL */
  #NewConfirmationBox > #NewConfirmationBox-Modal {
    left: 7%;
  }
  /* Camera */
  div#notification-box {
      top: 5vh;
      z-index: 99999;
  }
  /* Location in stack */
  #LocInfoInStack > table > tbody > tr > td {
    font-size: 0.7vw;
  }
}
/******Convert Text To Numbers*****/
#InlineContent {
  background-color: #dc3545;
  display: none;
  position: fixed;
  left: 0;
  z-index: 1000;
  top: 7vh;
  left: 1vw;
  width: 11vw;
  max-height: 90vh;
  overflow-y: auto;
  padding: 13px;
  padding-top: 0px;
  border: 2px solid lightgrey;
  border-radius: 10px;
}
#CTNHeader{
  position: sticky;
  top: 0;
  background-color: #dc3545;
  padding: 13px 0px;
}
.dragHandle {
  cursor: grab;
}
.CTNTitle {
  display: inline-block;
  color: white;
  width: 80%;
}
.CTNTitle i {
  padding-right: 5px;
}
#CTNClose {
  color: white;
  float: right;
  font-size: 17px;
  width: 20%;
}
#CTNClose button{
  background: inherit;
  color: white;
  float: right;
  padding: 0px 4px;
  border: 0px;
}
#CTNClose button:focus {
  outline: 0px;
}
#CTNClose button:hover {
  cursor: pointer;
}
#TextToConvertNumbers {
  width: 100%;
  height: 9vh;
  padding: 5px;
  border-radius: 5px;
  margin: 20px 0px;
}
#inputArea button {
  display: block;
  color: #fff;
  background-color: #dc3545;
  border-color: #dc3545;
  text-decoration: underline;
}
#ConvertResult button {
  margin-top: 10px;
  margin-left: 0;
}
/* Tutorials */
#TutorialTable > tbody > tr > td > a, #TutorialTable > tbody > tr > td > a:not([href]):not([tabindex]) {
  color: #007bff;
  text-decoration: none;
}
#TutorialTable > tbody > tr > td > a:hover, #TutorialTable > tbody > tr > td > a:not([href]):not([tabindex]):hover {
  text-decoration: underline;
  cursor: pointer;
}
/******Database changes inline*****/
#MonitorDBInlineContent {
  background-color: ghostwhite;
  display: none;
  position: fixed;
  left: 0;
  z-index: 1000;
  max-height:90vh;
  min-width: 11vw;
  top: 7vh;
  left: 1vw;
  overflow-y: auto;
  padding: 13px;
  border: 3px solid black;
  border-radius: 10px;
}
#MonitorDBInlineContentHeader{
  padding-bottom: 5px;
  cursor: grab;
}
.DBITitle {
  display: inline-block;
  color: #dc3545;
  width: 60%;
}
.DBITitle i {
  padding-right: 5px;
  font-size: 1.3rem;
}
#DBIClose {
  color: #dc3545;
  float: right;
  font-size: 1.3rem;
  width: 20%;
}
#DBIClose button {
  background: inherit;
  color: #dc3545;
  float: right;
  padding: 0px 4px;
  border: 0px;
}
#DBIClose button:hover {
  cursor: pointer;
}
#PicturesWithEstimate {
  padding: 10px;
}
/***** Breakpoints for mobile Estimate Detail  *******/
@media (orientation: portrait) and (max-width: 800px) {
  #EstimateDetail #modal-content-EstimateDetail {
    height: 95vh;
    max-height: 98vh;
  }
  #EstimateDetail > .modal-dialog {
    margin: 0 auto;
  }
  .slideToggler .modal-header2 {
    max-height: 12vw;
        margin: 0.4rem 0rem;
  }
  #EstimateDetailTitle {
    font-size: 1rem;
  }
  .EstimateFileBlocked {
    background-image: url(../Images/Lock.svg) !important;
    background-repeat: no-repeat;
    background-size: 100%;
    position: relative;
    top: 0px;
    left: 2px;
    display: block;
    width: 10px;
    height: 10px;
  }
  .slideToggler .EstimateDetail-modal-body {
    min-height: 0px;
  }
  #OriginalEstimate {
    height: 108vw;
  }
  #ContainerLocationCommentEdit {
    height: 20px;
    width: 20px;
    padding: 0;
  }
  #PostRepairPicturesBtn .fa-stack {
    width: 1em;
  }
  #PostRepairPicturesBtn .post-rep-cam {
    font-size: 1rem;
  }
  #PostRepairPicturesBtn .post-rep-wrench {
    font-size: 0.25rem;
    margin-top: -22.5px;
  }
  #ToggleLockBtn .EstimateFileNotBlocked,  #ToggleLockBtn .EstimateFileBlocked {
    left: 25%;
    top: 0;
    width: 50%;
    height: 50%;
    margin-left: 0.1em;
  }
  #PrintCorrectWorkOrder,.ContainerChatBtn,#ToggleLockBtn,.EstimateChatBtn {
    height: 15px;
    width: 15px;
    padding: 0;
    font-size: 1em;
  }
  #LockOrNot > button {
    margin: 0px 2px;
  }
  .EstimateChatBtn > .entryCount {
    top: -6px;
    right: -5px;
    padding: 2px 4px;
    font-size: 4px;
  }
  .OnlyAdmin #ShowWestimMessageBtn, .OnlyAdmin #CreateRevisedEstimateBtn, .OnlyAdmin #RemoveFromListNoUpload, .OnlyAdmin #CreateCWRevisedEstimateBtn {
    color: ghostwhite;
    display: block;
    font-size: 0.5rem;
  }
  .OnlyAdmin #CreateCWRevisedEstimateBtn {
    margin-bottom: 5px;
  }
  .modal-footer {
    padding: 2rem 0.5rem 0.5rem 0rem;
  }
  span.ClientsInStack {
    font-size: 3px;
  }
  .mw50P .modal-dialog {
    margin: 0;
    margin-top: 5vh;
    margin-left: 4px;
    padding: 0;
    max-width: 90% !important;
    margin-left: 15px;
  }
  .mw50P .modal-dialog {
    background-color: ghostwhite;
  }
  .mw50P.bbFitHeight >.modal-dialog {
    margin: 10px auto 0;
    padding: 0;
    margin: 0 auto;
  }
  .bbRegularMessage > .modal-dialog {
    max-width: 98vw;
  }
}
@media (orientation: landscape) and (max-width: 800px) {
  .mw50P .modal-dialog {
    margin: 0;
    margin-top: 5vh;
    margin-left: 4px;
    padding: 0;
    max-width: 90% !important;
    margin-left: 15px;
  }
  .mw50P .modal-dialog {
    background-color: ghostwhite;
  }
}
.h100aliceblue{
  height: 100%;
  background-color: aliceblue;
}
@media (orientation: portrait) and (max-width: 1200px) {
  div > span.ClientsInStack, .ClientsInStack {
    font-size: 8px;
    transform: scale(0.2);
    transform-origin: right top;
    min-width: 40px;
    max-width: unset;
    padding: 5px;
  }
  .specLocationBtnContent > p {
    font-size: 8px;
    transform: scale(0.9);
  }
  span.STORM_BREAKERS, span.STORM_BREAKERS_STRAP {
    width: 25px;
  }
}
/***** END Breakpoints for mobile Estimate Detail  *******/
@media (orientation: landscape) and (max-width: 1580px) {
  .BackBtn, .BackBtnSubPlanContent, .BackBtnSubPlanContentLittleMoreLeft, .BackBtnSubPlanContentBottom {
    width: 4vh;
    height: 6vh;
    font-size: 0.5rem;
    padding-top: 0px;
  }
  #EstimateDetail>div>.modal-content>.EstimateDetail-modal-body {
    min-height: unset;
    height: 80vh;
  }
  ul.list-group.LeftBottom {
    padding-bottom: 20vh;
  }
  #SpecialGradeTbl, .EdiMessageContent, .DepotSmartContent, #LocInfoInStack > table  {
    margin-bottom: 15vh;
  }
  #PicturesAWS > .FileManagerResult_AWS {
    margin-bottom: 15vw !important;
  }
  #ExtraEstimateInfo {
    padding-bottom: 10vh;
  }
}
label.PositionNumberWhenInStack {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25%;
  height: 25%;
  margin-bottom: 0;
  font-family: 'FontAwesome';
  color: #28282b;
  background-color: ghostwhite;
  border: 1px solid #28282b;
  border-radius: 0px 5px 0px 0px;
}
div#BufferTbl_wrapper {
  max-height: 80vh;
  overflow-x: scroll;
  overflow-y:scroll;
}
.bbFitHeight>.modal-dialog>.modal-content>.modal-body>.bootbox-body {
  max-height: 80vh;
  overflow-y: auto;
}
.OverWriteModal-modal-body {
  max-height: 85vh;
  overflow-y: auto;
}
#CloseBtnOverWriteModal, #CloseBtnDirectionsGateLb, #CloseBtnOverWrite_FS_Modal, .modal-footer > .bootbox-cancel, #CloseBtnReferences, .OverWriteInReferenceModal-modal-footer > .btn-secondary, #CloseBtnReferencesForm {
  margin: 10px;
  background-color: crimson;
  color: ghostwhite;
  border: 1px solid ghostwhite;
}
#GetTheHours {
  height: 80vh;
}
#PrintModal-modal-body {
  max-height: 85vh;
  overflow-y: auto;
}
.bootbox.modal.fade.mw50P.BackOfModalBlocked.show {
  background-color: aliceblue;
}
.ToLoadOptions {
  border: 1px solid black;
  padding: 5px;
  margin: 5px;
}
.SelectedItemsOptions {
  border: 3px solid red;
  padding: 5px;
  margin: 5px;
}
.flow-root {
  display: flow-root;
}
.bootbox-body {
  overflow: auto;
}
.bbRegularMessage {
  /* max-width: 50%; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #9ca8ba;
}
.bbRegularMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
.bbDangerMessage {
  z-index: 1060;
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #eb2f3b;
}
.bbDangerMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
.bbSuccessMessage {
  /* max-width: 50%; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #268d37;
}
.bbSuccessMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
/*PROGRES BAR FOR UPLOAD*/
.progress-bar__container {
  width: 80%;
  height: 2rem;
  border-radius: 2rem;
  position: relative;
  overflow: hidden;
  transition: all 0.5s;
  will-change: transform;
  box-shadow: 0 0 5px #ec1c24;
}
.progress-bar {
  position: absolute;
  height: 100%;
  width: 100%;
  content: "";
  background-color: #ec1c24;
  top:0;
  bottom: 0;
  left: -100%;
  border-radius: inherit;
  display: flex;
  justify-content: center;
  align-items:center;
  color: rgb(47, 46, 46);
  font-family: sans-serif;
}
.progress-bar__text {
  display: block;
  margin: 0 auto;
  color: rgb(61, 58, 58);
  z-index: 1000;
  position: absolute;
  text-align: center;
  width: 100%;
}
/*END PROGRES BAR FOR UPLOAD*/
/* Trucking CSS */
#References > .modal-dialog > .modal-content {
  padding: 10px;
}
.References-modal-body > h6 {
  padding: 10px 0px;
  color: crimson;
}
.References-modal-body > input {
  margin-bottom: 20px;
}
#warningmodal-popup > h5, #warningmodal-popup > p {
  margin-bottom: 0px;
  padding-bottom: 10px;
}
.refresulttbl > tbody > tr > td {
  padding: 10px !important;
}
.DirectionsGateRb-modal-body > h4 {
  padding: 1rem;
}
.get-eir-row {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 10px 25px;
}
.get-eir-row:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.05);
}
.get-eir-row > label {
  font-size: medium;
}
.get-eir-row > div > .active {
  background-color: #adff2f !important;
}
.AddLicensePlateBtn {
  width: 60px;
  height: 60px;
  vertical-align: top !important;
  background-color: #268d37;
  color: ghostwhite;
  border: 1px solid #268d37;
}
#MLP-body > h4 {
  font-size: 14px;
  padding-bottom: 10px;
}
.PreRegistrationTbl > thead > tr > th {
  font-size: 1rem;
}
.license-plate-content {
  width: 90%;
  margin: 0 auto;
}
.license-plate-content-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #28282b;
  padding: 10px 30px;
}
.license-plate-content-title:not(:first-child) {
  margin-top: 30px;
}
.license-plate-content-title:hover  {
  cursor: pointer;
}
.license-plate-content-title > h2 {
  font-size: 1.5rem;
  margin-bottom: 0;
}
.license-plate-content-body {
  padding: 25px;
  text-align: left;
  border: 1px solid #28282b;
  border-top: 0;
}
.license-plate-content-body > p {
  margin-bottom: 0;
}
/* End Trucking CSS */
.bootbox-body {
  max-height: 80vh;
}
.PossibleCombiHours{
  background-color: #9ea0be;
}
.f06rem{
  font-size: 0.6rem;
}
@media screen and (max-width: 770px){
  .VisibleTill-w770{
    display: none !important;
  }
}
@media (orientation: landscape) and (max-width: 900px) {
  #TitleHeaderEstimateForm {
    padding: 0.5rem;
  }
  #TitleHeaderEstimateForm > h5 {
    font-size: 1rem;
  }
  #ClientOfContainerLbl > button {
    position: relative;
    left: 15px;
    top: -10px;
    margin: 0;
  }
  #PostRepairPicturesBtn > .fa-stack {
    height: 1.5rem;
  }
  #PostRepairPicturesBtn .post-rep-cam {
    font-size: 1.5rem;
  }
  #PostRepairPicturesBtn .post-rep-wrench {
    font-size: 0.25rem;
    margin-top: -10.5px;
  }
  .parentTabs {
    font-size: 0.7rem;
  }
}
@media (orientation: landscape) and (max-height: 1100px) {
  .EstimateContentInQSE>.EstimateDetail-modal-body>.tabbable>.tab-content>.tab-pane>.tabbable>.tab-content>.tab-pane {
    height: 50vh;
  }
  span.STORM_BREAKERS, span.STORM_BREAKERS_STRAP {
    width: 25px;
  }
}
@media screen and (max-width: 1580px){
  .OnlyDeskTop{
    display: none !important;
  }
  #minimize{
    display: none;
  }
  .modal-dialog-small{
    max-width: 800px;
    width: 90vw !important;
    left: 5vw;
  }
  #CustomInPutModal-body > h1 {
    font-size: 1.5rem;
    padding-top: 25px;
    padding-bottom: 10px;
  }
}
.bootbox.mw80vw>.modal-dialog>.modal-content {
  min-width: 80vw;
}
#modal-body-ContainerCommentBox>pre>span {
  font-size: 1.5rem;
}
.AcceptedTasks-modal-body {
  max-height: 90vh;
}
.CNTA_BtnGroup{
  width: 100%;
}
.RequestPhysicalSurveyEditEstimateBtn{
  display: flex;
  align-items: center;
  position: sticky;
  top: 0;
  margin-right: 5px;
}
.Span_RequestPhysicalSurveyEditEstimate{
  flex: 1;
}
.Span_RequestPhysicalSurveyEditEstimate>img{
  max-height: 24px;
  width: auto;
  padding-left: 5px;
}
/* Stackbtns layout and scroll */
.specLocationBtnContent > p {
  margin-bottom: 0;
}
.ContainerRbSpecLocation > .repairOnBtn {
  position: relative;
  height: 50%;
  width: 100%;
  overflow: hidden;
  margin-top: 5px;
}
.scrollContainer {
  position: absolute;
  width: 80%;
  left: 10%;
  animation: scrollTextVert 10s linear infinite;
}
#StackLayoutRb > tbody >tr > td > button > span, #StackLayoutRb > tbody >tr > td > button > div > span {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.StackMenuRb > button {
  white-space: nowrap; /* Prevent text from wrapping */
  overflow: hidden; /* Hide overflow text */
}
.StackMenuRb > button.animate-text > span {
  display: inline-block; /* Ensure the span takes only the necessary width */
  animation: scrollText 6s linear infinite;
}
.rightmenu-extratext {
  padding-bottom: 10px;
}
.autoHoriScroll{
  animation: scrollText 6s linear infinite;
  max-width: 100%;
  display: block;
}
#StackLayoutRb > tbody > tr > td > button {
  line-height: 1.2;
  overflow: hidden; /* Hide overflow text */
}
#StackLayoutRb > tbody > tr > td > button.animate-textvert > span, #StackLayoutRb > tbody > tr > td > button.animate-textvert > div > span {
  display: inline-block; /* Ensure the span takes only the necessary width */
  animation: scrollTextVert 6s linear infinite;
}
@keyframes scrollTextVert {
  0% {
    transform: translateY(0); /* Start from original position */
  }
  50% {
    transform: translateY(-30%); /* Move text to the top */
  }
  100% {
    transform: translateY(0%); /* Move text to the original position */
  }
}
.getBargeInfoBtn:hover {
  background: #28282b !important;
  border: 1px solid ghostwhite;
}
.getBargeInfoBtn:hover > span > p {
  background: #28282b !important;
  color: ghostwhite;
}
.getBargeInfoBtnContent > p {
  width: fit-content;
  padding: 0px 10px;
  margin: 0 auto;
}
.getBargeInfoBtnContent > p:first-child {
  padding-top: 10px;
}
.getBargeInfoBtnContent > p:last-child {
  padding-bottom: 10px;
}
.PdfContentModal .modal-body{
	height: 80vh;
}
@property --angle {
  syntax: '<angle>';
  initial-value: 90deg;
  inherits: true;
}
@property --gradX {
  syntax: '<percentage>';
  initial-value: 50%;
  inherits: true;
}
@property --gradY {
  syntax: '<percentage>';
  initial-value: 0%;
  inherits: true;
}
:root {
	--d: 2500ms;
	--angle: 90deg;
	--gradX: 100%;
	--gradY: 50%;
	--c1: rgba(255, 255, 255,0.7);
	--c2: orangered;
}
.EstimatesResultList > button.active  {
  margin: 5px 0px;
  border-radius: 0 !important;
  border-color: white;
  border-width: 4px !important;
	border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 1;
  border-image-slice: 1;
  border-width: 2px;
  animation: borderRotate var(--d) linear infinite forwards;
}
.EstimatesResultList > .wtyResultBtn {
  background-color: #adff2f;
  color: #28282b !important;
}
.EstimatesResultList > .wtyResultBtn:hover {
  background-color: #f8f8ff;
  color: #28282b !important;
}
@keyframes borderRotate {
	100% {
		--angle: 420deg;
	}
}
.imageInMessaging{
  width: 100%;
}
.AddContainerToRefBtn.SELECTED{
  background-color: #0F0;
}

/* Navbar Breakpoints */
@media screen and (max-width: 600px) {
  .navbar {
    padding: 0.5rem 0.3rem;
  }
  #nav-icon1 {
    width: 20px;
    margin-right: 10px;
  }
  #nav-icon1.largernav {
    width: 40px;
    margin-right: 20px;
  }
  .navbar-gatebuttons {
    min-width: 107px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 33px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
    padding: 3px;
  }
  #WebPageMainNavbar > .nav-button, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button {
    margin: 0px 3px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
    width: 17px;
  }
  #navsearchbar {
    top: 35px;
    left: -50px;
  }
  .nav-button-btn > .nav-count {
    top: -7px;
    right: -7px;
    padding: 2px 5px;
    font-size: 0.4rem;
  }
  #WebPageMainNavbar > .navbar-nav > .dropdown {
    padding: 5px;
  }
  #WebPageMainNavbar > .navbar-nav > .dropdown.largerdropdown {
    padding: 5px 10px;
  }
  #navbarDropdownMenuLink {
    font-size: 7px;
  }
  .largerdropdown > #navbarDropdownMenuLink {
    font-size: 10px;
    padding: 0;
  }
  .nav-username {
    margin: 0;
    max-width: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .largerdropdown > #navbarDropdownMenuLink > .nav-username{
    max-width: unset;
    display: inline-block;
  }
  .NewNotificationCount, .NewMessages {
    font-size: 7px;
    font-weight: 400;
  }
  #WebPageMainNavbar > .nav-colorcodes {
    display: none;
  }
  #WebPageMainNavbar > .nav-colorcodes.colorCodesShow {
    display: inline-block;
  }
  span.STORM_BREAKERS, span.STORM_BREAKERS_STRAP {
    width: 10px;
  }
}
@media screen and (min-width: 601px) {
  .nav-username {
    display: inline-block;
    margin: 0;
  }
}
@media screen and (min-width: 601px) and (max-width: 700px) {
  #nav-icon1 {
    width: 40px;
    margin-right: 25px;
  }
  .navbar-gatebuttons {
    min-width: 158px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 50px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
    padding: 5px;
  }
  #WebPageMainNavbar > .nav-button, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button {
    margin: 0px 8px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
    width: 20px;
  }
  #navsearchbar {
    top: 35px;
    left: -50px;
  }
  .nav-button-btn > .nav-count {
    padding: 4px 7px;
    font-size: 0.5rem;
  }
  #navbarDropdownMenuLink {
    font-size: 10px;
  }
  #WebPageMainNavbar > .navbar-nav > .dropdown {
    padding: 5px 10px;
  }
  .NewNotificationCount, .NewMessages {
    font-size: 10px;
    font-weight: 400;
  }
  #WebPageMainNavbar > .nav-colorcodes {
    display: none;
  }
  #WebPageMainNavbar > .nav-colorcodes.colorCodesShow {
    display: inline-block;
  }
}
@media screen and (min-width: 701px) and (max-width: 799px) {
  #nav-icon1 {
    width: 40px;
    margin-right: 25px;
  }
  .navbar-gatebuttons {
    min-width: 185px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 59px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
    padding: 5px;
  }
  #WebPageMainNavbar > .nav-button, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button {
    margin: 0px 10px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
    width: 25px;
  }
  #navsearchbar {
    top: 38px;
    left: -75px;
  }
  .nav-button-btn > .nav-count {
    padding: 4px 7px;
    font-size: 0.5rem;
}
  #navbarDropdownMenuLink {
    font-size: 10px;
  }
  #WebPageMainNavbar > .navbar-nav > .dropdown {
    padding: 5px 10px;
  }
  .NewNotificationCount, .NewMessages {
    font-size: 10px;
    font-weight: 400;
  }
  #WebPageMainNavbar > .nav-colorcodes {
    display: none;
  }
  #WebPageMainNavbar > .nav-colorcodes.colorCodesShow {
    display: inline-block;
  }
}
@media screen and (min-width: 800px) and (max-width: 1023px) {
  #nav-icon1 {
    width: 40px;
    margin-right: 25px;
  }
  .navbar-gatebuttons {
    min-width: 185px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 59px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
    padding: 5px;
  }
  #WebPageMainNavbar > .nav-button, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button {
    margin: 0px 10px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
    width: 25px;
  }
  #navsearchbar {
    top: 40px;
  }
  #navbarDropdownMenuLink {
    font-size: 12px;
  }
}
@media screen and (min-width: 1024px) and (max-width: 1539px) {
  #nav-icon1 {
    width: 40px;
    margin-right: 25px;
  }
  .navbar-gatebuttons {
    min-width: 230px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 74px;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn {
    padding: 5px;
  }
}
@media screen and (max-width: 1539px) {
  .navbar-icon-explanation {
    display: none;
  }
}
@media screen and (min-width: 1540px) and (max-width: 1800px) {
  #nav-icon1 {
    width: 40px;
    margin-right: 25px;
  }
  .navbar-gatebuttons {
    min-width: 430px;
  }
  .navbar-gatebuttons.navbar-onegatebutton {
    min-width: 145px;
  }
  .navbar-icon-explanation {
    font-size: 0.7rem;
  }
  #WebPageMainNavbar > .nav-button > .nav-button-btn > img, #WebPageMainNavbar > .navbar-gatebuttons > .nav-button > .nav-button-btn > img {
    width: 25px;
  }
}
@media screen and (min-width: 1801px) {
  #nav-icon1 {
    min-width: 40px;
    margin-right: 25px;
  }
}
.RefDetailBargeRequestSingleContent{
  border: 1px solid #ffffff;
  padding: 0.5rem;
}
button#RemoveBargeRequestOfReferenceBtn {
  margin: 0.5rem;
}
.LicensePlateIcon {
  display: inline-block;
  width: 1.5em; /* Adjust size similar to Font Awesome */
  height: 1em;
  background-image: url('/Images/LicensePlate_Img.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.DisclaimerContent {
  font-size: 0.75rem;
  color: #666;
  background-color: #f1f1f1;
  border-left: 3px solid #bbb;
  margin-top: 10px;
  line-height: 1.3;
  font-style: italic;
}

.DisclaimerContent u {
  text-decoration: underline;
  font-weight: 600;
  font-style: normal;
}
.mw60vw{
  min-width: 60vw;
}
.mw70vw{
  min-width: 70vw;
}
.mw80vw{
  min-width: 80vw;
}
.mw90vw{
  min-width: 90vw;
}
/* BLOCKED */
.swal2-popup.swal2-modal.mw50P.swal2-show {
    width: 95%;
}
.swal-fullscreen {
  width: 95vw !important;
  max-width: none !important;
  height: 90vh !important;
  margin: 0 auto;
  padding: 0 !important;
  overflow: hidden;
}

.swal-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  background-color: #f7f7f7;
  border-bottom: 1px solid #dee2e6;
  font-size: 1.25rem;
  font-weight: 500;
  color: #212529;
}
.swal-close-btn {
  padding: 0.5rem 1rem;
  margin: -0.5rem -1rem -0.5rem auto;
  background: none;
  border: none;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  opacity: 0.5;
  cursor: pointer;
}
.swal-close-btn:hover {
  opacity: 0.75;
}


.swal-body-content {
  padding: 20px;
  max-height: calc(90vh - 60px);
  overflow: auto;
}
.autoFitSwal>.swal2-modal {
  width: auto !important;
  max-width: 90% !important;
  max-height: 90% !important;
  overflow-y: auto;
  overflow-x: hidden;
}