#nav-icon1 {
  width: 3vw;
  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;
  box-sizing: border-box;
}
#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;
}
.navbar-loading-button {
	margin: 0vw 1vw;
}
.navbar-loading-button, .navbar-discharge-button {
	border: 2px solid #dc3545;
	border-radius: 5px;
	background-color: ghostwhite;
}
.navbar-loading-button > a > img, .navbar-discharge-button > a > img {
	width: 35px;
	height: auto;
}
.form-group.theSaveBtns{
	text-align: right;
}
div#notification-box {
  position: fixed;
	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);
}
.dropdown-menu a {
  cursor: pointer;
}
div#PersonalMenuDropOptions {
  position: absolute;
  right: 0;
  min-width: 280px;
  left: auto;
}
div#InlineContent.Minified {
    height: 0;
}
#InlineContent>#inputArea>.container-fluid>.PageContent{
  width:600px;
}
#InlineContent>#inputArea>.container-fluid>.PageContent>#MonitorDataBaseChangesTbl{
  width:500px;
  font-size: 1em;
  height: auto;
  max-height: 50vh;
}
#InlineContent>#inputArea>.container-fluid>.PageContent>#MonitorDataBaseChangesTbl th{
  font-size: 0.75rem;
}
#nav-icon1 span:nth-child(1) {
  top: 10%
}
#nav-icon1 span:nth-child(2) {
  top: 40%
}
#nav-icon1 span:nth-child(3) {
  top: 70%
}
#nav-icon1.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
#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;
}
.PageContent{
	width: 100%;
	height: auto;
	float: left;
	top: 60px;
	text-align: center;
	background-color: #fff;
	position: relative;
}
.border-r-5{
  border-radius: 5px;
}
.c-red-fw600 {
  color: red;
  font-weight: 600;
}
nav.navbar.navbar-light.bg-light.border-bottom.fixed-top.navbar-expand-custom {
	max-height: 60px;
}
.w20{
  width:20px;
}
.w40{
  width:40px;
}
.min-w-160{
  min-width: 160px;
}
.min-w-180{
  min-width: 180px;
}
.max-w-400{
  max-width: 400px;
}
.max-w-150{
  max-width: 150px;
}
.DoubleLicensePlate{
  background-color: #adff2f !important;
  color: #000000;
}
.LineThrough{
  text-decoration: line-through;
}
.blurry-text-big {
   color: transparent !important;
   text-shadow: 0 0 5px rgba(0,0,0,0.1) !important;
}
@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;
  }
	.modal-FitWidth{
		max-width: 50vw;
    width: auto;
	}
	.OnlyPortrait{
		display: none;
	}
}
@media screen and (max-width: 1580px){
  .OnlyDeskTop{
    display: none;
  }
}
@media screen and (max-width: 1080px){
	/*HERE WE RIGHT CODE FOR BOTH LANDSCAPE AND PORTRAIT*/
	#ReferencesBtn{
		display: none;
	}
	#DirectionsGateRb{
		display: none;
	}
	#DirectionsGateLb{
		display: none;
	}
	#GetEIRBtn{
		display: none;
	}
	.MegaLb>div,.BackBtn,.Quay1207Overview>div,.Quay913Overview>div{
		font-size: 7px;
	}
	table#WaterWashTable,table#StockTable,table#ContainersWaitingRepairTable,table#StatusTable {
		overflow-x: auto;
		display: inline-block;
	}
  .modal-dialog-small{
  max-width: 95vw;
    width: auto;
    left: 0;
}
	@media screen and (orientation:landscape) {
		.LandscapeFalse{
			display: none;
		}
		.OnlyPortrait{
			display: none;
		}
	}
	@media screen and (orientation:portrait) {
		.PortraitFalse{
			display: none;
		}
	}
}
.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;
}
input#SearchContainerMainNavbarValue {
	max-width: 150px;
}
#PersonalMenuDropOptions{
	position: absolute;
}
a#navbarDropdownMenuLink {
    float: right;
}
body{
	background-color:white;
	height: max-content;
	min-height: 100vh;
	min-width: 100vw;
	width: max-content;
}
.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;
}
.noselect {
  -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-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%;
    max-height: 90vh;
    overflow-y: auto;
}
.Correct{
	background-color: #9cfca9 !important;
}
.NotCorrect{
	background-color: #ff8c63 !important;
}
.CompletedRepair{
	background-color: limegreen;
}
.dragIcon{
	position: fixed;
	display: block;
	width: 32px;
	height: 32px;
	float: left;
	background-image: url("../Images/DragIcon.png");
	background-size: cover;
	background-repeat: no-repeat;
	cursor: pointer;
}
#InlineContent{
	background-color: #FF3030;
	display: none;
	position:fixed;
  left:0;
  z-index: 1000;
  top: 7vh;
  left: 1vw;
  width:9vw;
  max-height: 80vh;
  overflow-y: scroll;
}
#inputArea{
	display: none;
}
#ConvertResult{
	display: block;
	float: right;
}
#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_AQC{
	background-color: #00ffff !important;
	color: #000000;
}
.Status_DAUL{
	background-color: #90ee90 !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;
}
.show-inlineblock{
	display: inline-block;
}
#OverViewReferencesModal{
		overflow-y: scroll;
	}
#ReferenceTable{
	width: 100%;
}
#ReferenceTable input,#MovesTable input, #HandlingsTable input{
	width: 3vw;
}
#SearchReferenceBtn{
	display: none;
}
#SearchReferenceCaptcha{
	display: none;
}
.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;
}
#PowerBiStats{
	top: 3vh;
	width: 100%;
	height: 95vh;
}
#MonitorDataBaseChangesTbl{
	width: 100%;
	height: 95vh;
	font-size: 2em;
}
.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;
}
#SearchBtnCustom{
	display: inline;
}
.MovesStatsForm-modal-body, .MovesContent{
	width: 90vw;
}
.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;
  }
/* 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;
  }

.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: #495057;
  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: #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-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; }
}
.bordered-greenSolid{
	background-color:#28a745;
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 0 5vw #28a745;
}
.bordered-green{
	background-color:#d8e4db;
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 0 5vw #28a745;
}
.bordered-orange{
	background-color:#ffa51e;
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 0 5vw #ffa51e;
}
.bordered-orange-small{
	background-color:#ffa51e;
	-webkit-border-radius: 0.01vw;
	-webkit-box-shadow: 0 0 0.5vw #ffa51e;
}
.bordered-green-small{
	background-color:#28a745;
	-webkit-border-radius: 0.01vw;
	-webkit-box-shadow: 0 0 0.5vw #28a745;
}
.bordered-red-small{
	background-color: #f48341 !important;
}
.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;
}
.ice{
	background-color: #cce6ff;
}
.hot{
	background-color: #ffb399;
}
.FOOD{
		position: relative;
		background-image: url("../Images/ContainerGrades/food.svg");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
		display: block;
}
.btn-block.FOOD{
		position: relative;
		background-image: url("../Images/ContainerGrades/food.svg");
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.MALT{
		position: relative;
		background-image: url("../Images/ContainerGrades/malt.svg");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
}
.btn-block.MALT{
		position: relative;
		background-image: url("../Images/ContainerGrades/malt.svg");
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.FLEXITANK{
	vertical-align: text-top;
		position: relative;
		background-image: url("../Images/ContainerGrades/FLEXITANK.png");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
		display: block;
}
.btn-block.FLEXITANK{
		position: relative;
		background-image: url("../Images/ContainerGrades/FLEXITANK.png");
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.DUITS{
	vertical-align: text-top;
		position: relative;
		background-image: url("../Images/DUITS.png");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
		display: block;
}
.btn-block.DUITS{
		position: relative;
		background-image: url("../Images/DUITS.png") !important;
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.METALSCRAP{
	vertical-align: text-top;
		position: relative;
		background-image: url("../Images/SCRAP.png");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
		display: block;
}
.btn-block.METALSCRAP{
		position: relative;
		background-image: url("../Images/SCRAP.png") !important;
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.BOOKED{
	vertical-align: text-top;
		position: relative;
		background-image: url("../Images/Booked_New.svg");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: left bottom;
		display: block;
}
.btn-block.BOOKED{
		position: relative;
		background-image: url("../Images/Booked.svg") !important;
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: left;
		display: block;
}
.BLOCKED{
		background-image: url("../Images/Lock.svg");
		background-repeat: no-repeat;
		background-size: 30%;
		background-position: right bottom;
}
.btn-block.BLOCKED{
		position: relative;
		background-image: url("../Images/Lock.svg") !important;
		background-repeat: no-repeat;
		background-size: 20%;
		background-position: right;
		display: block;
}
.BOOKEDBLOCKED{
		background-image: url("../Images/Lock.svg"),url("../Images/Booked.svg");
		background-size: 30%;
		background-position: right bottom,left bottom;
		background-repeat: no-repeat;
}
.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;
}
#PlusOrMin, #TemperatureValue, #VentValue, #VentSign, #HumidityValue, #DrainsValue {
	margin-bottom: 0.5rem;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
	font-size: 2.5rem;
	width: 10vw;
	height: 5vh;
}
#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: inherit;
	font-size: 1.5rem;
}
#ReferenceDetail{
	overflow-x: scroll;
}
.RefBtn{
	width: 5vw;
  height: 5vh;
}
.AcceptThisTask, .PreBarrierCheckThisContainer{
	width: 10vw;
	height: 5vh;
	margin-bottom: 0.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
	font-size: 1.5rem;
}
.TaskAcceptedBtn, .RefDetailSelectContainerForTask{
	width: 10vw;
	height: 5vh;
	margin-bottom: 0.5rem;
	font-size: 1.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
}
.UnAcceptThisTask{
	width: 6vw;
	height: 6vh;
	margin-bottom: 0.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
	font-size: 0.9vw;
	background-color: #f4b342;
}
.CloseTaskBtn{
	width: 6vw;
	height: 6vh;
	margin-bottom: 0.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
	font-size: 0.9vw;
	background-color: #aaab9f;
}
.SelectContainerForTask{
	width: 12vw;
	height: 6vh;
	margin-bottom: 0.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
	font-size: 0.9vw;
	background-color: #f4b342;
}
.RefDetailSelectContainerForTask{
	background-color: #D0CACA;
}
.FinsihTask{
	width: 6vw;
	height: 6vh;
	margin-bottom: 0.5rem;
	font-family: inherit;
	line-height: 1.2;
	color: inherit;
	font-size: 0.9vw;
	background-color: #a3f441;
}
#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%;
}
@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: 100%;
		height: auto;
		float: left;
		text-align: center;
		background-color: #fff;
		position: relative;
	}
	.PageContent-marginTop{
		width: 100%;
		height: auto;
		float: left;
		top: 4vh;
		text-align: center;
		background-color: #fff;
		position: relative;
	}
	.MegaLb{
		height: 99vh;
		width: 99vw;
		position: relative;
	}
	.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;
		border: none;
		cursor: pointer;
	}
	.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;
	}
	.BackBtnSubPlanContentBottom{
		position: absolute;
		bottom: 1vh;
		right: 1vw;
		background-image: url("../Images/MakeEstimate/Resources/Button-Back-1-512.png");
		background-repeat: no-repeat;
		background-size:cover;
		background-position: center;
		display: block;
		width: 10vh;
		height: 10vh;
		-moz-border-radius:5px;
		-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;
	}
	.BackBtnSubPlanContent{
		position: absolute;
		top: 1vh;
		right: 1vw;
		background-image: url("../Images/MakeEstimate/Resources/Button-Back-1-512.png");
		background-repeat: no-repeat;
		background-size:cover;
		background-position: center;
		display: block;
		width: 10vh;
		height: 10vh;
		-moz-border-radius:5px;
		-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;
	}
	.BackBtnSubPlanContentLittleMoreLeft{
		position: absolute;
		top: 1vh;
		right: 10vw;
		background-image: url("../Images/MakeEstimate/Resources/Button-Back-1-512.png");
		background-repeat: no-repeat;
		background-size:cover;
		background-position: center;
		display: block;
		width: 10vh;
		height: 10vh;
		-moz-border-radius:5px;
		-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;
	}
	.BackBtn{
		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 / 12);
		height: calc(100vh / 8);
		-moz-border-radius:5px;
		-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;
	}
	.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);
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-moz-box-shadow:0 0 50px #688099;
		-webkit-border-radius: 5px;
		-webkit-box-shadow: 0 0 50px #688099;
	}
	#Layout1207Table{
		margin-left: 25vw;
		display: flex;
		height: 100vh;
	}
	#Layout1207Table button{
		width:6vw;
		height: 10vh;
		margin: 0.5vw;
		display: hidden;
		background-color: #f9f9f9;
		height:80px;
	}
	.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;
		-moz-border-radius:5px;
		-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: top;
		text-align: center;
		font-size: 1vw;
		width: 100%;
	}
	.ContainerMonitoringEFPSpecLocation p{
		text-align: top;
		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;
	}
}
@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: 100%;
		height: auto;
		float: left;
		top: 7.5vh;
		text-align: center;
		background-color: #fff;
		position: relative;
	}
	.MegaLb{
		height: 30vh;
		width: 99vw;
		border: 0.01vw solid black;
		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{
		text-align: top;
		font-size: 0.9vw;
		margin: 0.2vw;
		width:calc(100vw / 14);
		height: calc(45vh / 8);
		background-color: transparent;
		border:none;
	}
  .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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-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;
		-moz-border-radius:5px;
		-moz-box-shadow:0 0 50px #688099;
		-webkit-border-radius: 5px;
		-webkit-box-shadow: 0 0 50px #688099;
	}
	#Layout1207Table{
		margin-top: 10vh;
		margin-left: 25vw;
		height: 100vh;
	}
	#Layout1207Table button{
		width:6vw;
		height: 10vh;
		margin: 0.5vw;
		display: hidden;
		background-color: #f9f9f9;
		height:80px;
	}
	.BackBtn{
		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: block;
		width: 10vw;
		height: 10vw;
		-moz-border-radius:5px;
		-moz-box-shadow:0 0 50px #688099;
		-webkit-border-radius: 5px;
		-webkit-box-shadow: 0 0 50px #688099;
		cursor: pointer;
	}
	.BackBtnSubPlanContent{
		position: absolute;
		top: -10vh;
		right: 1vw;
		background-image: url("../Images/MakeEstimate/Resources/Button-Back-1-512.png");
		background-repeat: no-repeat;
		background-size:cover;
		background-position: center;
		display: block;
		width: 10vw;
		height: 10vw;
		-moz-border-radius:5px;
		-moz-box-shadow:0 0 50px #688099;
		-webkit-border-radius: 5px;
		-webkit-box-shadow: 0 0 50px #688099;
		cursor: pointer;
	}
	#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;
		-moz-border-radius:5px;
		-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;
	}
}
.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;
	-moz-border-radius:10px;
	-moz-box-shadow:0 0 2% #3399FF;
	-webkit-border-radius: 2%;
	-webkit-box-shadow: 0 0 2% #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%;
	-moz-border-radius:1%;
	-moz-box-shadow:0 0 1% #3399FF;
	-webkit-border-radius: 1%;
	-webkit-box-shadow: 0 0 1% #3399FF;
}
.InputTypeText:active{
	-moz-box-shadow:0 0 1% #E30613;
	-webkit-box-shadow: 0 0 1% #E30613;
}
.SubmitBtn{
	width:90vw;
	text-decoration: none;
	color:#000;
	background-color: #FFFFFF;
	padding: 1%;
	-moz-border-radius:1%;
	-moz-box-shadow:0 0 1% #3399FF;
	-webkit-border-radius: 1%;
	-webkit-box-shadow: 0 0 1% #3399FF;
}
.SubmitBtn:hover{
	background-color: #E30613;
	-moz-box-shadow:0 0 1% #E30613;
	-webkit-box-shadow: 0 0 1% #E30613;
}
.SubmitBtn:active{
	background-color: #E30613;
	-moz-box-shadow:0 0 1% #E30613;
	-webkit-box-shadow: 0 0 1% #E30613;
}
#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;
	text-align: top;
}
#StackLayoutDepot button{
	text-align: top;
	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;
	float:bottom;
}
.ContainerInBtn{
	text-align: top;
	font-size: 0.9vw;
	margin: 0.2vw;
	width:calc(100vw / 14);
	height: calc(100vh / 7);
	background-color: transparent;
	float:left;
}
.ContainerOutBtn{
	text-align: top;
	font-size: 0.9vw;
	margin: 0.2vw;
	width:calc(100vw / 14);
	height: calc(100vh / 7);
	background-color: transparent;
	float:left;
}
.Borderd{
	background-color: transparent;
	border: 0.01vw solid black;
}
.RbLocationActive{
	color:#ffffff;
	-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; }
}
#ChangeLocMenu{
	position: relative;
}
.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: 60vw;
}
.RefFinished{
	background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #eee,
    #999
  );
}
.NotValidForGateOut{
	background: repeating-linear-gradient(
	  -55deg,
	  #222,
	  #222 10px,
	  #333 10px,
	  #333 20px
	);
}
.QEE_PENDINGADDING{
  background-color: #adff2f !important;
}
.QEE_PENDINGDELETION{
	background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #f28787,
    #999
  );
}
.DiffertentIsoThenRefOut{
	background:
  /* On "top" */
  repeating-linear-gradient(
    45deg,
    transparent,
    transparent 10px,
    #ccc 10px,
    #ccc 20px
  ),
  /* on "bottom" */
  linear-gradient(
    to bottom,
    #f28787,
    #999
  );
}
.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
  );
}
.AlreadyReportedDamage{
  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
  );
}
.SEACO_SALE_GRADE_1_IICL{
	background:
    repeating-radial-gradient(
      circle at 0 0,
      #eee,
      #adff2f 1vw
    );
   color:black !important;
 }
 .SEACO_SALE_GRADE_2_CW{
	background:
    repeating-radial-gradient(
      circle at 0 0,
      #eee,
      #42f5c5 1vw
    );
   color:black !important;
 }
 .SEACO_SALE_GRADE_3_CW_REP{
	background:
    repeating-radial-gradient(
      circle at 0 0,
      #eee,
      #90ee90 1vw
    );
   color:black !important;
 }
 .SEACO_SALE_GRADE_4_NOT_CW_REP{
	background:
    repeating-radial-gradient(
      circle at 0 0,
      #eee,
      #e9967a 1vw
    );
   color:black !important;
 }
 .SEACO_SALE_GRADE_5_SCRAP{
	background:
    repeating-radial-gradient(
      circle at 0 0,
      #eee,
      #8b0000 1vw
    );
   color:black !important;
 }
.ContainerPossibleToGiveToTruck{
	background-color:#e8fc03;
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 0 5vw #28a745;
}
#ConfirmGateOutBtn{
	width: 50vw;
}
.LargerBtnActivatedSelected{
	-webkit-animation: glowingSelected 1500ms infinite;
	-moz-animation: glowingSelected 1500ms infinite;
	-o-animation: glowingSelected 1500ms infinite;
	animation: glowingSelected 1500ms infinite;
}
@-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; }
}
.HighlightContainer{
	-webkit-animation: HighlightContainerglowing 1500ms infinite;
	-moz-animation: HighlightContainerglowing 1500ms infinite;
	-o-animation: HighlightContainerglowing 1500ms infinite;
	animation: HighlightContainerglowing 1500ms infinite;
	color: #ffffff !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;
}
div#RefenceInfoDetail {
	position: fixed;
	min-height: 90vh;
	overflow-y: auto;
	overflow-x: auto;
}
.ReeferContainer{
	border: 0.2vw solid #99ccff;
}
.HighLightSelectedContainer {
	border: 0.3vw solid #ff4419;
}
.NOP{
  background-color:  #808080;
  color: #ffffff;
}
.WPTI{
  background-color:  #7c8ba3;
  color: #ffffff;
}
.AES{
  background-color:  "#87cefa";
}
.ASU1{
  background-color:  #ffa500;
}
.ASU2{
  background-color:  #edcd4c;
}
.ASU3{
  background-color:  #f58442;
}
.CLM{
  background-color:  #000000;
  color: #f8f8ff;
}
.DAE{
  background-color:  #808080;
  color: #000000;
}
.DAL{
  background-color:  #e9967a;
}
.DAA{
  background-color:  #ab807d;
}
.ALE{
  background-color:  #e9967a;
}
.DAU{
  background-color:  #90ee90;
}
.DAUS{
  background-color:  #90ee90;
}
.DAUL{
  background-color:  #90ee90;
}
.DAUB{
  background-color:  #90ee90;
}
.CWAU{
  background-color:  #90ee90;
}
.CWAUL{
  background-color:  #90ee90;
}
.CWAUS{
  background-color:  #90ee90;
}
.DIM{
  background-color:  #f8f8ff;
}
.DIW{
  background-color: #20b2aa;
}
.SCR{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.SEL{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.OFH{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.SND{
  background-color: #adff2f;
}
 .CWSD{
  background-color: #42f5c5;
 }
.AES1S{
  background-color:  #87cefa;
}
.AES1F{
  background-color:  #87cefa;
}
.AES2S{
  background-color:  #87cefa;
}
.AES2F{
  background-color:  #87cefa;
}
.ASCLM{
  background-color:  #000000;
  color: #f8f8ff;
}
.ASSCR{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.ASSEL{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.ASOFH{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.ASTLS{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.DOUT{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.TLS{
  background-color:  #8b0000;
  color: #f8f8ff;
}
.HLD{
  background-color:  #e9967a;
}
.ASDAU{
  background-color:  #90ee90;
}
.ASDAL{
  background-color:  #e9967a;
}
.DIWBS{
  background-color:  #20b2aa;
}
.DIWBF{
  background-color:  #ff69b4;
}
.DIF{
  background-color:  #ff69b4;
}
.DIFS{
  background-color:  #ff69b4;
}
.DIFF{
  background-color:  #f8f8ff;
}
.DIMS{
  background-color:  #f8f8ff;
}

.DIMF{
  background-color:  #00ffff;
}
.AQB{
  background-color:  #e0ffff;
}
.AQBS{
  background-color:  #e0ffff;
}
.AQBF{
  background-color:  #03fcd3;
}
.AQC{
  background-color:  #00ffff;
}
.AQCS{
  background-color:  #00ffff;
}
.AQCF{
  background-color:  #03fcd3;
}
#EstimateDetail.modal-open .modal{
	overflow: hidden;
}
div#modal-content-EstimateDetail {
    max-height: 95vh;
    overflow: hidden;
}
.EstimateDetail-modal-body {
    overflow-y: auto;
    min-height: 70vh;
}
.EstimateContent{
	position: absolute;
	top: 1vh;
	width: 81vw;
	height: 90vh;
	left: 17vw;
	overflow-y:hidden;
	overflow-x:auto;
}
table#ContainerLocationHistoryTable {
	position: relative;
}
div#EstimateDetail {
    overflow: hidden;
}
.CancelBufferSelectionBtn {
    position: relative;
    margin-top: 50;
}
@media screen and (max-width: 600px){
  .EstimateDetail-modal-body {
      font-size: 0.6rem;
  }
  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 {
    font-size: 0.5rem;
  }
  .table.table-striped th, .table.table-striped td {
    padding: 0.3rem;
  }
  button.btn.btn-danger.btn-margin-left.float-right.AddABoxEstimateItemBtn,button.btn.btn-danger.btn-margin-left.float-right.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#ShowBoxInfoModal,button#ShowUnitInfoModal,button.btn.btn-light.btn-margin-left,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{
    font-size: 0.5rem;
    margin: 5px;
    width: auto;
  }
  .EstimateFileNotBlocked{
    left: 0;
    top: 0;
    width:15px;
    height: 15px;
  }
  button#ToggleLockBtn {
    position: relative;
    width:30px;
    height: 30px;
  }
  .EstimateDetail-modal-body .parentTabs .nav-tabs .nav-item .nav-link{
    padding: 0.4rem;
  }
}
.bordered-gray {
  -webkit-box-shadow: 0 0 2vw #727873;
}
.bordered-gray-small {
  -webkit-box-shadow: 0 0 1vw #727873;
}
.bordered-gray-curved{
	-webkit-border-radius: 5px;
	-webkit-box-shadow: 0 0 10px #727873;
}
.bbErrorMessage {
  /* max-width: 50%; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: aliceblue;
}
.bbErrorMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
.bbRegularMessage {
  /* max-width: 50%; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #9ca8ba;
}
.bbRegularMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
label#takePictureLabel {
  right: 0;
  position: absolute;
  margin: 5;
}
.bbDangerMessage {
  /* max-width: 50%; */
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #eb2f3b;
}
.bbDangerMessage>.modal-dialog>.modal-content {
  min-width: 50vw;
}
.PdfContentModal .modal-body{
	height: 80vh;
}

/** SPECIFIC EIR STYLES **/
/* GLOBAL */
.navbar.navbar-light {
	box-sizing: border-box;
}
.ActiveTitleNavBar {
	margin: 0 auto;
}
.ActiveTitleNavBar > .active-title {
	font-size: 1.4rem;
    padding: 8px 20px;
    font-weight: 600;
	text-transform: uppercase;
	background: linear-gradient(45deg, rgba(220, 20, 60, 1), #28282b);
	background-size: 200% 200%;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: gradientMove 8s ease-in-out infinite;
	user-select: none;
}
@keyframes gradientMove {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
.navbar  > .ml-auto, .navbar > .mx-auto {
    margin-left: unset !important;
}
.navbar-nav {
	width: 14vw;
}
main > .ListContent {
	padding-top: unset !important;
	margin-top: 40px;
}
main > .ListContent::-webkit-scrollbar {
    width: 4px;
    height: 10px;
}
main > .ListContent::-webkit-scrollbar-track {
    background: lightgrey;
    border-radius: 10px;
}
main > .ListContent::-webkit-scrollbar-thumb {
    background: crimson;
    border-radius: 10px;
}
main > .ListContent::-webkit-scrollbar-thumb:hover {
    background: #b22222;
}
main > .ListContent > .search-add-containerList {
	position: sticky;
    top: 0;
    left: 0;
	background-color: white;
}
main > .ListContent > .search-add-containerList > .AddContainerNumberBtn {
	width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
}
.ListContent>button {
    display: block;
    width: 90%;
    border: 1px solid black;
    margin: 10px auto;
}
.TakeAPicture {
	margin-bottom: 25px;
}
.TakeAPicture.TakeAPictureInTbl {
	margin-bottom: 0px;
	margin-right: 15px;
}
.TakeAPicture.InNavbar {
	margin-bottom: 0px;
	margin-right: 0px;
}
.TakeAPicture > img {
	width: 30px;
	height: auto;
}
.TakeAPicture.InNavbar > img {
	width: 15px;
	height: auto;
}
.CA-col {
	min-width: 110px;
}
.loc-col {
	min-width: 200px;
}
#PreviousDamagesTable > thead > tr > th:first-child {
	border-left: 1px solid lightgrey;
}
#PreviousDamagesTable > thead > tr > th {
	font-size: 15px;
	border-right: 1px solid lightgrey;
	border-bottom: 1px solid black;
}
#PreviousDamagesTable > tbody > tr > td:first-child {
	border-left: 1px solid lightgrey;
}
#PreviousDamagesTable > tbody > tr > td {
	font-size: 14px;
	border-right: 1px solid lightgrey;
}
#PreviousDamagesTable > tbody > tr > td > .btn {
	border: 1px solid black;
}
/* HOME */
.home-menu-buttons {
    position: absolute;
    width: 90vw;
    margin: 0 auto;
    text-align: center;
    left: 5vw;
    top: 30vh;
}
.home-menu-buttons > div {
    display: inline-block;
}
.home-menu-buttons > div > button {
    margin: 0px 50px;
    padding: 0;
    border-radius: 50px;
    border: 3px solid #dc3545;
    font-size: 3rem;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    background-color: ghostwhite;
}
.home-menu-buttons > div > button > i:first-child {
    color: ghostwhite;
    background-color: #dc3545;
    padding: 20px 17px;
    border-radius: 50px;
}
.home-menu-buttons > div > button > span {
    padding: 0px 8vw;
    color: #dc3545;
}
.home-menu-buttons > div > button > .fa-chevron-down {
    color: #dc3545;
    padding-right: 1vw;
}
.dropdown-content-HomeMenu {
    display:block;
    visibility: hidden;
    width: auto;
    position: absolute;
    margin-left: 7vw;
    max-height: 0;
}
.dropdown-content-HomeMenu > a {
    display: block;
    width: 450px;
    margin-top: 0px;
    text-align: left;
    font-size: 1.5rem;
    text-decoration: none;
    color: ghostwhite;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    border: none;
    border-radius: 50px;
    -moz-transition: margin-top 1.5s ease-in-out;
    -o-transition: margin-top 1.5s ease-in-out;
    -webkit-transition: margin-top 1.5s ease-in-out;
    transition: margin-top 1.5s ease-in-out;
    overflow: hidden;
}
.dropdown-content-HomeMenu > a {
    cursor: pointer;
}
.martrans {
    margin-top: 40px !important;
}
.vessel-loading {
    background-color: #007bff;
}
.vessel-discharge {
    background-color: #17a2b8;
}
.upload-list {
    background-color: #343a40;
}
#myDropdown > a {
    color: #343a40;
}
.load-lists {
    background-color: #ffc107;
}
.discharge-list {
    background-color: #28a745;
}
.search-container {
    background-color: #dc3545;
}
.dropdown-content-HomeMenu > a > i {
    border: 3px solid ghostwhite;
    border-radius: 50px;
    width: 25px;
    height: 25px;
    padding: 15px;
    text-align: center;
    vertical-align: middle;
}
.load-vessel-svg {
    background: url(/Images/white-ship-loading.svg);
}
.discharge-vessel-svg {
    background: url(/Images/white-ship-discharge.svg);
}
.load-vessel-svg, .discharge-vessel-svg {
    display: inline-block;
    background-size: 75%;
    background-repeat: no-repeat;
    background-position: 45%;
}
.dropdown-content-HomeMenu > a > span {
    width: 70%;
    text-align: center;
    display: inline-block;
    padding: 0px 20px;
}
/* VESSEL LOADING & DISCHARGE*/
.LoadListFilter {
	display: flex;
	flex-direction: column;
    align-items: center;
    justify-content: center;
}
.LoadListFilter > div > label {
	padding-top: 25px;
    font-size: 1.4rem;
    text-align: center;
}
.LoadListFilter > div > select {
	flex: unset;
	max-width: 100%;
	border-color: #268d37;
}
.LoadListFilter > div > button {
	flex: unset;
	max-width: 100%;
}
/* UPDATE LIST */
.PreviewListBeingChanged {
	width: 96vw;
    margin: 0px auto;
}
/* CONSULT LISTS */
#TableDetailed_wrapper {
	overflow-y: scroll;
}
#RegularConsultList > #TableRegular_wrapper div > div > #TableRegular {
	width: 98% !important;
	max-width: 90vw;
}
#RegularConsultList > #TableRegular_wrapper div > div > #TableRegular > thead, #TableDetailed > thead {
	font-weight: bold;
}
.consult-pic-btns > a {
	display: inline-block;
	margin: 2px;
    text-align: center;
}
.consult-damnoted-btns > .btn-info {
	padding: 0;
	background-color: unset;
	vertical-align: baseline;
    line-height: normal;
    font-size: inherit;
	text-decoration: underline;
	border: none;
	color: #dc3545;
}
.ResultListContent  {
	margin: 0 auto;
}
/* SEARCH CONTAINER */
#tableVesselListHistory > thead > tr:nth-child(2) > th {
    font-size: 16px;
}
#tableVesselListHistory > tbody > tr > td {
    font-size: 14px;
}
/* PENDING & SENT CLAIMS */
#SaveToClipBoardPeriodResultBtn {
	border: 1px solid #28282b;
    margin-right: 10px;
}
#ClaimsResultTbl_filter > label, #ClaimsResultTbl_length > label {
	display: flex;
    align-items: center;
    gap: 10px;
}
#ClaimsResultTbl_filter > label > input[type="search"], #ClaimsResultTbl_length > label > select {
    flex: 0 1 auto;
    width: 200px;
}
#ClaimsResultTbl > thead > tr > th {
	font-size: 16px;
}
#ClaimsResultTbl > tbody > tr > td {
    font-size: 14px;
}
.damagesclaim {
    max-width: 400px;
}
#ClaimsResultTbl > tbody > tr > td > .btn-info {
	padding: 0;
	background-color: unset;
	vertical-align: baseline;
    line-height: normal;
    font-size: inherit;
	text-decoration: underline;
	border: none;
	color: #dc3545;
}
#theClaimStatus > button {
	margin-right: 5px;
}
/* BREAKPOINTS */
@media screen and (orientation: portrait) {
	#nav-icon1 {
		width: 5vw;
	}
	.navbar-loading-button {
		margin: 0vw 2vw;
	}
	.navbar-loading-button > a > img, .navbar-discharge-button > a > img {
		width: 30px;
	}
	.navbar-nav {
		width: 20vw;
	}
	.home-menu-buttons {
		position: unset;
		display: flex;
		flex-direction: column;
		margin-top: 15vh;
	}
	.consultwrap {
		margin-top: 50px;
	}
	.dropdown-content-HomeMenu {
		display: block;
		visibility: hidden;
		height: 0;
		width: auto;
		margin-left: 16vw;
		max-height: unset;
	}
	.dropdown-content-HomeMenu.show {
		height: auto;
	}
	.tab-content > .ExtraComment > .form-group.row {
		margin-bottom: 25px;
		padding-left: 1vw;
	}
	.ExtraComment > .ClaimableGroup > div > .ClaimableBtn {
		margin-right: 20px;
		border-radius: 5px !important;
		border: 1px solid black;
	}
	.tab-pane > .tab-content > .ExtraComment > .SaveTheDamage {
		width: 300px;
		margin: 0 auto;
		padding-bottom: 25px;
	}
	.tab-pane > .tab-content > .ExtraComment > .SaveTheDamage > .SaveBtn {
		width: 100%;
	}
	.prev-damages-list {
		max-width: 95%;
	}
}
@media screen and (orientation: landscape) {
	.tab-content > .ExtraComment > .form-group.row {
		margin-bottom: 25px;
		padding-left: 1vw;
	}
	.ExtraComment > .ClaimableGroup > div > .ClaimableBtn {
		margin-right: 20px;
		border-radius: 5px !important;
		border: 1px solid black;
	}
	.tab-pane > .tab-content > .ExtraComment > .SaveTheDamage {
		width: 300px;
		margin: 0 auto;
		padding-bottom: 25px;
	}
	.tab-pane > .tab-content > .ExtraComment > .SaveTheDamage > .SaveBtn {
		width: 100%;
	}
}
@media screen and (min-width: 2200px) {
	.dropdown-content-HomeMenu {
		margin-left: 5vw;
	}
	.dropdown-content-HomeMenu > a {
		width: 600px;
		font-size: 2rem;
	}
	.dropdown-content-HomeMenu > a > i {
		width: 35px;
		height: 35px;
	}
}
@media screen and (min-width: 1150px) and (max-width: 1450px) {
	.home-menu-buttons > div > button {
		font-size: 2rem;
	}
	.dropdown-content-HomeMenu > a {
		width: 350px;
		font-size: 1rem;
	}
	.dropdown-content-HomeMenu > a > i {
		width: 20px;
		height: 20px;
	}
	.dropdown-content-HomeMenu > a > span {
		padding: 0px 15px;
	}
}
@media screen and (min-width: 1000px) and (max-width: 1149px) {
	.home-menu-buttons > div > button {
		font-size: 1.5rem;
	}
	.dropdown-content-HomeMenu {
		width: auto;
		position: absolute;
		margin-left: 8vw;
	}
	.dropdown-content-HomeMenu > a {
		width: 275px;
		font-size: 0.8rem;
	}
	.dropdown-content-HomeMenu > a > i {
		width: 15px;
		height: 15px;
	}
	.dropdown-content-HomeMenu > a > span {
		padding: 0px 10px;
	}
}
@media screen and (min-width: 800px) and (max-width: 999px) {
	.home-menu-buttons > div > button {
		font-size: 0.9rem;
	}
	.home-menu-buttons > div > button > i:first-child {
		padding: 18px 17px;
	}
	.dropdown-content-HomeMenu {
		width: auto;
		position: absolute;
		margin-left: 6vw;
	}
	.dropdown-content-HomeMenu > a {
		width: 275px;
		font-size: 0.8rem;
	}
	.dropdown-content-HomeMenu > a > i {
		width: 15px;
		height: 15px;
	}
	.dropdown-content-HomeMenu > a > span {
		padding: 0px 10px;
	}
}
@media screen and (max-width: 799px) {
	.home-menu-buttons > div > button {
		font-size: 2rem;
	}
	.home-menu-buttons > div > button > span {
		padding: 0px 13vw;
	}
	.dropdown-content-HomeMenu {
		position: relative;
	}
}
@media screen and (orientation:portrait) and (max-width: 799px) {
	.home-menu-buttons > div > button {
		margin: 0px;
		font-size: 1.4rem;
	}
	.home-menu-buttons > div > button > span {
		padding: 0px 10vw;
	}
}
@media screen and (max-width: 1400px) {
	.ListContent > .btn-light {
		font-size: 0.8rem;
	}
	#SearchContainerNumberInList {
		font-size: 0.7rem;
	}
}
@media screen and (max-width: 1024px) {
	.ActiveTitleNavBar > .active-title.longerTitle {
		font-size: 0.8rem;
	}
}
@media screen and (orientation:portrait) and (max-width: 500px) {
	.navbar-loading-button, .navbar-discharge-button {
		padding: 3px
	}
	.navbar-loading-button > a > img, .navbar-discharge-button > a > img {
        width: 20px;
    }
	.ActiveTitleNavBar > .active-title {
		padding: 8px 10px;
		font-size: 0.6rem;
	}
	.ActiveTitleNavBar > .active-title.longerTitle {
		font-size: 0.5rem;
	}
	#navbarDropdownMenuLink {
		padding: 0;
		margin-right: 0.5rem !important;
		font-size: 0.7rem;
	}
	main.col-lg-12.pt-3.px-4.fullW {
		min-width: unset !important;
	}
	ul.navbar-nav.ml-auto {
		position: absolute;
		right: 1vw;
		top: 30px;
	}
	.dropdown-content-HomeMenu > a {
		width: auto;
	}
	.dropdown-content-HomeMenu > a > span {
		width: 60%;
		font-size: 0.8rem;
	}
	button#QuickPicture {
        right: -35px !important;
        top: -130px !important;
		padding: 5px !important;
    }
	button#QuickPicture > img {
        width: 25px !important;
    }
}