@charset "utf-8";
/* CSS Document */

html {
	margin: 0px;
	padding: 0px;
}

#mainDiv {
	width: 1400px;
	margin: 0 auto;
	padding: 0;
/*	background: #FFFFFF;	*/
}

#header {
	font-family: Franklin Gothic Book;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
	padding: 10px;
	width: 1400px;
	height: 130px;
}

#headerDataLeft {
	float: left;
}

#headerDataCenter{
	float:left;
	width:75%;
	font-size: 35px;
	font-weight:700;
	color:red;
}

#headerDataRight{
	float: right;
	text-align: right;
	font-size: 40px;
	font-weight: bold;
	padding: 0px;
}

#headerDataRight span{
	color:#E11B22;
	margin:0px;
}

#cisLogo {
	float: left;
	margin: 10px 35px 0 45px;
}

#mainBodyLogin {
	font-family: Franklin Gothic Book;
	font-weight: 300;
	font-size: 14px;
	color: #000000;	
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	width: 1400px;
	min-height: 650px;
	border: 1px solid #A7A9AC;
	border-radius: 15px;
}

#login {
	margin-top: 130px;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: auto;
	width: 380px;
	height: 420px;	
	border: 1px solid #A7A9AC;
	border-radius: 15px;
}

#loginInstruction {
	margin-top: 40px;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: auto;
	width: 300px;
	font-size: 20px;
}

#loginForm {
	margin-top: 50px;
	margin-bottom: auto;
	margin-left: 30px;
	margin-right: auto;
	width: 300px;
	height: 150px;
}

input[type=text],[type=number],[type=password],[type=date],[type=file],[type=datetime-local]{
	width:100%;
	height:30px;
	border-radius:5px;
	border-style:solid;
	padding-left:2px;
	border-color: black;
}

.dropDownListStyle{
	width:100%;
	height:35px;
	border-radius:5px;
	border: 2px solid #000000;
}

.dropDownListStyleList{
	width:100%;
	border-radius:5px;
	border: 2px solid #000000;
}

.textAreaStyle{
	width:100%;
	height:35px;
	border-radius:5px;
	border: 2px solid #000000;
}

.fileButtonStyleHidden{
	display: none;
}

.fileButtonStyleDisplay{
	width:  93px;
	height: 27px;
	border: 2px solid black;
}

.buttonStyle {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #FFFFFF), color-stop(1, #FFFFFF) );	/*used to be #E4E4E4*/
	background:-moz-linear-gradient( center top, #FFFFFF 5%,  #FFFFFF 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#FFFFFF');
	background-color: #FFFFFF;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topleft:0px;
	border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
	-moz-border-radius-topright:0px;
	border-top-right-radius:0px;
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-bottomright:0px;
	border-bottom-right-radius:0px;
	-webkit-border-bottom-left-radius:0px;
	-moz-border-radius-bottomleft:0px;
	border-bottom-left-radius:0px;
	text-indent: 0;	
	border: 1px solid #A7A9AC;
	border-bottom: 3px solid #A7A9AC;
	border-top: 3px solid #E11B22;
	border-radius: 5px;
	display: inline-block;
	color: #000000;
	font-family: Franklin Gothic Book;
	font-size: 14px;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	text-align: center;
}

.buttonStyle:hover {
	border-bottom: 3px solid #E11B22;
	border-top: 3px solid #A7A9AC;
	font-weight: 600;
	background: #000000;
	color: #FFFFFF;
	cursor:pointer;
}

button[disabled]:hover{
	cursor:not-allowed;
}

.btnStyle1{
	width:55px; 
	height:35px; 
	line-height:30px;
}

.btnStyle2{
	width:112px;
	height:35px; 
	line-height:30px;
}

.nonDecoratedLink{
	text-decoration: none;
	color: #000000;
}

#navigationLoggedIn{
	height: 70px;
	margin-top: 25px;
	margin-left: auto;
	margin-right: auto;
	border-top: 3px solid #E11B22;
	border-bottom: 3px solid #A7A9AC;
/*	border: 1px solid red;	*/
}

#top-menu-LoggedIn{
	position: relative;
/*	border: 1px solid green;	*/
}

.menuHoriz{
	float: left;
	width: 100%;
	height: 100%;
}

.menuHoriz ul{
	display: block;
	list-style-type: none;
	width: 100%;
	margin-left: 32px;
	margin-top: 0;
	padding: 0;
}

.menuHoriz ul li{
	margin: 0;
	padding: 0;
}

.menuHoriz ul li a{
	display: block;
	float: left;
	max-height: 65px;
	width: 135px;
	height: 50px;
	margin: 0;
	padding: 10px 0;
	font-family: Franklin Gothic Book;	
	font-size: 18px;
	font-weight: 600;	
	text-align: center;
	text-decoration: none;
	color: #000000;
	text-align: center;
	border-left: 3px solid #FFFFFF;
	border-right: 3px solid #FFFFFF;
	vertical-align: middle;
/*	border: 1px solid green;	*/
}

.menuHoriz ul li a:hover{
	border-left: 3px solid #E11B22;
	border-right: 3px solid #E11B22;
	background: #000000;
	color: #FFFFFF;
	font-weight: 600;
}

.columnedTable { 
  border-collapse: collapse;
  width: 100%;
}

.columnedTable caption { 
  padding-bottom: 0.5em; 
}

.columnedTable th { 
  font-weight: 600; 
  border: solid thin lightgrey;
  border-top: solid 3px #E11B22;
  border-bottom: solid 3px #A7A9AC;  
  vertical-align: top; 
  text-align: center; 
  padding: 0.5rem 2rem;
}

.columnedTable td {
  white-space: wrap;
  vertical-align: top;
  padding: 5px;
}

.columnedTable tbody td:first-child::after { 
  content: leader(". ");
}

.layoutHolder {
	width:76.5%;
	margin-left:auto;
	margin-right:auto;
}

.subDiv {
	float:left;	
	width:49%;
	min-height:295px;
	margin-right:10px;
}

.subTable {
	/*border:1px solid red;*/
	float:left;
	width:50%;
	min-height:70px;
}

.subTable caption{
	float:left;	
	font-size:16px;
}

.subTable tr td{
	vertical-align:top;
	padding:5px;
	font-size:14px;
}

.subTableStyle1 tr td{
	vertical-align:top;
	padding:5px;
	font-size:20px;
}

.cargoOpsOptions{
	margin-left: 7px;	
}

#tblBoxLayout {
	width: 100%;
}

#tblBoxLayout td {
	width: 33%;
	height: 100%;
	padding: 5px;
}

#tblBoxLayout td a {
	display: block;
	width: 100%;
	height: 220px;
	border: 1px solid #A7A9AC;
	background-color: rgba(255, 255, 255, .7);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	color: #000000;
	text-align: center;
	/* vertical-align: middle;	*/
	/* line-height: 140px;		*/
}

#tblBoxLayout td .start-end-date {
    border: 1px solid #A7A9AC;
	height: 220px;
}

#tblBoxLayout td .start-end-date a {
    border: 1px solid transparent;
    height: 155px;
    box-sizing: border-box;
}
.start-end-date table {
    width: 100%;
}
#tblBoxLayout td .start-end-date td {
    width: 50%;
    padding: 5px 10px;
}
#tblBoxLayout td .start-end-date td input {
    margin-top: 5px;
    width: 100%;
    box-sizing: border-box;
}
#tblBoxLayout td a:hover{
	border: 1px solid #E11B22;
	background-color: rgba(0, 0, 0, .3);
	color: #FFFFFF;
}

.iFrameStyle{
	display: block;
	width: 97.7%;
	margin: 4px 4px 4px 4px;
	border: 2px solid #000000;
	overflow: auto;
	padding: 0 6pt;
	float: none;
}

.boxBorder{
	border: 1px solid #A7A9AC;
	padding: 5px;
	overflow: auto;
}
#divUsedClaims.boxBorder table tbody tr:last-child td {
    font-weight: 600;
	    padding-top:20px;
}
.Deduction-scrool .columnedTable tbody#tblDeduction tr td {
    border: 1px solid #A7A9AC;
}
div#divCalculationOfTheDemurrage.boxBorder .columnedTable tr:last-child td{   padding-top:60px;}
.Deduction-scrool {
	padding-bottom: 1px;
}
#ClaimReportedInQPR,#StatusOfClaim{
	width:101.7%;
}
#divPortNominations.boxBorder {
	float: left;
	margin-right: 7px;
	min-height: 331px;
	width: 15%;
}

#divDates.boxBorder {
	float: left;
	margin-right: 7px;
	min-height: 310px;
	width: 26%;
}

#divEDQs.boxBorder {
	float: left;
	margin-right: 7px;
	min-height: 331px;
	width: 26%;
}

#divCargoDetails.boxBorder {
	float: left;
	min-height: 331px;
	width: 28%;
}

#divCTOverviewRow.Row{
    display: table;
    width: 100%;
    table-layout: fixed;
}

#divExecution.boxBorder, #divLoading.boxBorder, #divCompletionOfDischargePerformance.boxBorder {
    display: table-cell;
	min-height: 310px;
}

#divLoading.boxBorder, #divCompletionOfDischargePerformance.boxBorder{
	border: 0px;
	padding: 0px;
}

#divPriorLoading.boxBorder, divUponLoading.boxBorder, divNotes.boxBorder, #divCompletionOfDischarge.boxBorder, #divPerformance.boxBorder, #divCoRecordsComplete.boxBorder, #divSubmitValidation.boxBorder{
	border: 1px solid #A7A9AC;
}

#divManagementAndDocuments.boxBorder{
	border: 0px;	
}

#divManagementDocumentsHolder.Row{
    display: table;
    width: 100%;
    table-layout: fixed;
}

#divManagement.boxBorder, #divDocuments.boxBorder {
    display: table-cell;
	min-height: 310px;
}

#divManagement.boxBorder{
	width: 78%;	
}

#divDocuments.boxBorder{
	width: 20%;
}


#tblInvoicingMainInvoice.subTable, #tblInvoicingMainPayments.subTable, #tblInvoicingMainPaymentsBreakdown.subTable{
	border: 1px solid #A7A9AC;
}


.claims-scrool {
	border: 1px solid #A7A9AC;
    overflow-y: auto;
    height: 280px;
	padding-bottom: 1px;
	width: 49%;
}
#tblInvoicingMainClaims.subTable{
	width:100%;
}
/* Table styling for section within Invoices Details */
#tblInvoicingMainInvoice.subTable{
	float:left;
	width:49%;
}

#tblInvoicingMainPayments.subTable, #tblInvoicingMainPaymentsBreakdown.subTable{
	float:right;
	width:49%;
}

#tblInvoicingMainPaymentsBreakdown.subTable, #tblInvoicingMainClaims.subTable{
	margin-top:7px;
}

.coctManagementTableUpdate{
	border:	1px solid #A7A9AC;
	height:	350px;
	overflow: auto;	
}

.coctManagementTableAdd{
	height:50px;
	border:2px solid #FFFFFF;
}

.pErrorNotifications{
	color: red;
	font-weight: 600;
	margin-left: 20px;
	min-height: 110px;
}

.LiquidsdashboardOuter{
	width: 98%;
	height: auto;
	padding: 10px;
	border: 1px solid #A7A9AC;
}

.LiquidsDashboardInnerTable{
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid #A7A9AC;
}

.klredbox{
		background-color:red;
}

	
table.LiquidsDashboardInnerTable th{
	padding: 10px;
	border: 1px solid #A7A9AC;
	height: 65px;
	vertical-align: top;
}
 
table.LiquidsDashboardInnerTable td{
	border: 1px solid #A7A9AC;
	height: 34px;
	text-align: center;
}


.dashboardOuter{
	width: 98%;
	height: 1150px;
	padding: 10px;
	background-color: #E8E8E8;
	border: 1px solid #A7A9AC;
}

.dashboardInnerHolderTop{
	width: 100%;
	float: left;
	height: 570px;
}


.LiquidsdashboardInnerHolder{
	width: 100%;
	float: left;
	height: 445px;
}


.dashboardInnerHolderBottom{
	width: 47%;
	float: left;
	height: 445px;
}

.dashboardInnerLeftHeader{
	border: 1px solid #E8E8E8;
	max-height: 430px;
}

.dashboardInnerLeftData{
	border: 1px solid #E8E8E8;
	max-height: 430px;
	overflow: auto;
}

.dashboardInnerSpacer{
	width: 5%;
	float: left;
	border: 1px solid #E8E8E8;
}

.dashboardInnerRight{
	border: 1px solid #A7A9AC;
	padding: 3px;
	height: 450px;
	overflow: auto;
}

.dashboardInnerTable{
	border-collapse: collapse;
	border-spacing: 0;
	border: 1px solid #A7A9AC;
}

table.dashboardInnerTable th{
	border: 1px solid #A7A9AC;
	height: 130px;
}
 
table.dashboardInnerTable td{
	border: 1px solid #A7A9AC;
}

.tdColoured_NoBG{
	border: 0px;
}

.tdColoured_WithBG{
	background-color: #CBEAC8;
}

div.vertical{
 transform: rotate(-45deg);
 -webkit-transform: rotate(-45deg); /* Safari/Chrome */
 -moz-transform: rotate(-45deg); 	/* Firefox */
 -o-transform: rotate(-45deg); 		/* Opera */
 -ms-transform: rotate(-45deg); 	/* IE 9 */
}

#colSelectionDiv{
	height: 225px;
	border: 1px solid #A7A9AC;
}

.colSelectionDivLiquids{
	height: auto !important;

}

#colSelectionDiv h4{
	margin-left: 10px;
}

#colSelectionDiv .displayColSelections{
	float: left;
	width: 12.5%;
}

.displayColSelectionsLiquids{
	width: 9.5% !important; 
	font-size:10px !important;
}

#colSelectionDiv .displayColSelectionsSubmit{
	width: 100%;
	margin-top: 15px;
}

#colSelectionDiv .displayColSelectionsSubmit td{
	float: right;
	margin-right: 7px;
}

#colSelectionDiv .displayColSelectionsVR{
	float: left;
	width: 12.5%;
	width: 20%;
}

#colSelectionDiv .displayColSelectionsVR caption{
	text-align: left;
	padding-left: 7px;
	font-weight: bold;
}

.unvalidatedFieldsTitle{
	color: black;
	text-decoration: none; /* Remove the underline */
}

.unvalidatedField{
	border: 1px solid #A7A9AC;
	width: 15%;
	height: 40px;
	float: left;
	text-align: center;
	padding: 2px;
	margin: 4px;
}

#errorDiv{
	color: red;
	font-weight: 600;	
}

#searchReportTable th{
	cursor:pointer;
}

.col_1, .col_2, .col_4, .col_5, .col_6,
.col_9, .col_10, .col_11, .col_17, .col_20{
	display:table-cell;
}

.col_3, .col_7, .col_8, .col_12, .col_13, 
.col_14, .col_15, .col_16, .col_18, .col_19, 
.col_21, .col_22, .col_23, .col_24, .col_25, 
.col_26, .col_27, .col_28, .col_29, .col_30, 
.col_31, .col_32, .col_33, .col_34, .col_35, 
.col_36, .col_37, .col_Hidden{
	display:none;
}

.col_101, .col_102, .col_103, .col_104, 
.col_105, .col_106, .col_107, .col_108, 
.col_109, .col_110{
	display:table-cell;	
}

.col_111, .col_112, .col_113, .col_114, 
.col_115, .col_116, .col_117, .col_118, 
.col_119, .col_120{
	display:none;
}


.klcol_1,.klcol_3, .klcol_6,.klcol_9,.klcol_18,.klcol_19,.klcol_21,.klcol_22,.klcol_24,.klcol_45
{
	display:table-cell;	
}

 .klcol_2, .klcol_4, .klcol_5, .klcol_7, .klcol_8,  .klcol_10,.klcol_11,.klcol_12,.klcol_15,.klcol_13,.klcol_14,.klcol_16,.klcol_17,.klcol_20,.klcol_23,.klcol_25,.klcol_26,.klcol_27,.klcol_28,.klcol_29,.klcol_30,.klcol_31,.klcol_32,.klcol_33,.klcol_34,.klcol_35,.klcol_36,.klcol_37,.klcol_38,.klcol_39,.klcol_40,.klcol_41,.klcol_42,.klcol_43,.klcol_44,.klcol_46,.klcol_47,.klcol_48
{
	display:none;
}


/* This section contains styling for Management and Reports */
#managementView .div0{
	height:200px;
	width:99.8%;
	border:1px solid #A7A9AC;
	margin-top:5px;
	margin-bottom:5px;
}

#managementView .div1{
	height:507px;
	width:24%;
	border:1px solid #A7A9AC;
	float:left;	
}

#managementView .div2, .div3{
	height:250px;
	width:74%;
	border:1px solid #A7A9AC;
	float:right;
}

#managementView .div3{
	margin-top:5px;
}

#managementView .div4{
	height:250px;
	width:99.8%;
	border:1px solid #A7A9AC;
	float:right;
	margin-top:5px;
}


/* css for styling the tables on Monthly Report Data */
.noBorders{
	border: 0px;	
}

.allBorders{
	border: 1px solid black;	
}

.leftBorder{
	border-left: 1px solid black;
}

.rightBorder{
	border-right: 1px solid black;
}

.bottomBorder{
	border-bottom: 1px solid black;
}

/* css for styling the Finance Dashboard */
.invScorecards{
	float: left;
	margin-left: 32px;
	margin-bottom: 10px;
	/*width: 30%;*/			/* The width will be styled inline */
	height: 200px;
	border: 1px solid black;
	overflow: auto;
	overflow-x: hidden;		/* Hide horizontal scrollbar - remove if necessary */
}

.invScorecards table{
	text-align: center;
	width: 100%;
}


.invScorecards .bgInvoiceRequestsCaption{
	color: white;
	background-color: #00A4E4;
}

.invScorecards .bgInvoicesExpectedCaption{
	color: white;
	background-color: #B4975A;
}

.invScorecards .bgProvisionalAwaitingFinalCaption{
	color: white;
	background-color: #B4975A;
}

.invScorecards .bgPaymentsDueCaption{
	color: white;
	background-color: #E11B22;
}

.invScorecards .bgPaymentsOverdueCaption{
	color: white;
	background-color: #E11B22;
}

.invScorecards .bgLatePaymentsToRaiseCaption{
	color: white;
	background-color: #56386C;
}



.invScorecards .bgInvoiceRequestsTitles{
	background-color: #d5f3ff;
}

.invScorecards .bgInvoicesExpectedTitles{
	background-color: #efe7d9;
}

.invScorecards .bgProvisionalAwaitingFinalTitles{
	background-color: #efe7d9;
}

.invScorecards .bgPaymentsDueTitles{
	background-color: #fadadb;
}

.invScorecards .bgPaymentsOverdueTitles{
	background-color: #fadadb;
}

.invScorecards .bgLatePaymentsToRaiseTitles{
	background-color: #E0D3E9;
}



.mqaScorecards{
	float: left;
	margin-left: 32px;
	width: 30%;
	height: 225px;
	border: 1px solid black;
}

.mqaScorecards table{
	width: 100%;
}

.mqaScorecards table h2{
	text-align: center;
}

.mqaScorecards .bgDark{
	color: white;
	background-color: #666666;
}

.mqaScorecards .bgLight{
	background-color: #CCCCCC;
}

/* 
NOTE:
.mqaScorecards class are used to style the divs on the Invoicing menu. Similar reports will be required for reporting purposes on the Reporting section.
If the .mqaScorecards class does not cater for styling on the reporting section, create another class with a similar name and allot the same type of 
styling for that class as well, i.e. .newClassName table{}, .newClassName table h2{} etc
*/


/* css for styling the divs on the LNG Finance Workflows */
.financeDivsTables{
	height:450px;
	border:1px solid #A7A9AC;
	margin-bottom: 15px;
	overflow-x: hidden;
	overflow-y: auto;
	float:left;
	width:100%
}

.financeDivsTables .enColourTitle1{
	color: white;	
	background-color: #002060;
}

.financeDivsTables .enColourTitle2{
	color: white;
	background-color: #375623;
}

.financeDivsTables .enColourTitle3{
	color: white;
	background-color: #833C0C;
}

.financeDivsTables .enColourTitle4{
	color: white;
	background-color: #BF8F00;
}

.financeDivsTables .enColourTitle5{
	color: white;
	background-color: #56386C;
}

.financeDivsTables .enColourTitle6{
	color: white;
	background-color: #AC6F00;
}



.financeDivsTables .enColourRow1{
	color: #002060;
	background-color: #BDD7EE;
}

.financeDivsTables .enColourRow2{
	color: #375623;
	background-color: #C6E0B4;
}

.financeDivsTables .enColourRow3{
	color: #833C0C;
	background-color: #F8CBAD;
}

.financeDivsTables .enColourRow4{
	color: #BF8F00;
	background-color: #FFE699;
}

.financeDivsTables .enColourRow5{
	color: #56386C;
	background-color: #E0D3E9;
}

.financeDivsTables .enColourRow6{
	color: #AC6F00;
	background-color: #FFD385;
}

/* Styling for the GST Table */
#tblGSTCalculations tr{
	vertical-align: top;
}


/* NOTE: The styles here are used for the collapsibles on the Admin Settings->Data Entry & Source */

/* Style the button that is used to open and close the collapsible content */
.collapsible {
	background-color: #A7A9AC;
	color: #444;
	cursor: pointer;
	padding: 18px;
	width: 100%;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
  }
  
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
background-color: #ccc;
}
  
/* Style the collapsible content. Note: hidden by default */
.content {
padding: 0 18px;
background-color: #F1F1F1;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}

.collapsible:after {
	content: '\02795'; /* Unicode character for "plus" sign (+) */
	font-size: 13px;
	color: white;
	float: right;
	margin-left: 5px;
  }
  
.active:after {
	content: "\2796"; /* Unicode character for "minus" sign (-) */
  }

.userManual{
	width:100%;
	border:1px solid black;
}

.thStyle{
	border:1px solid black;
	height: 40px;
}

.tdStyle{
	padding-left:20px;
	vertical-align:top;
	text-align:left;
}

/* End of styling for collapsible */

/* commence styling for modal backdrops and modal pop-up forms  */

/* The Modal (background) */
.modal{
	display: none;							/* Hidden by default */
	position: fixed;						/* Stay in place */
	z-index: 1;								/* Sit on top */
	padding-top: 100px;						/* Location of the box */
	left: 0;
	top: 0;
	width: 100%;							/* Full width */
	height: 100%;							/* Full height */
	overflow: auto;							/* Enable scroll if needed */
	background-color: rgb(0,0,0);		   /* Fallback color */
	background-color: rgba(0,0,0,0.4);	   /* Black w/ opacity */
}
  
/* Modal Content */
.modalContent {
	background-color: #fefefe;
	margin: auto;
	padding: 20px;
	border: 1px solid #FF0000;
	width: 40%;
	height: 65%;
}

.modalContent table {
	width: 100%;
}
  
/* The Close Button */
.close {
	color: #aaaaaa;
	float: right;
	font-size: 28px;
	font-weight: bold;
}
  
.close:hover,
.close:focus {
	color: #FF0000;
	text-decoration: none;
	cursor: pointer;
}

/* End of styling for styling for modal backdrops and modal pop-up forms  */


.clear{
	margin: 0;
	padding: 0;
	clear: both;
}

.clearfix::after {
  clear: both;
  display: block;
}

tr.top_row h2 {
    margin-bottom: 5px;
}

tr.top_row span {
display: inline-block;
    margin-bottom: 5px;
    font-size: 15px;
    font-weight: bold;
	}

/* New layout of Invoicing */

.threeTables {
	border:1px solid #E11B22;
	width:33.3%;
	float:left;
	min-height:70px;
}
.cargo-table .three-payment-table table.threeTables {
    border: 0;
	padding: 0;
    /*min-height: auto;*/
	    margin: 0;
		 width: 100%;
}
.cargo-table .three-payment-table {
    border: 0;
    min-height: inherit;
	border: 1px solid #A7A9AC;
    min-height: 520px;
	padding: 0 10px;
	 width: calc(33.33% - 10px);
	 float:left;
	   margin: 0 5px;
	       box-sizing: border-box;
}
.cargo-table table.threeTables {
    width: calc(33.33% - 10px);
    margin: 0 5px;
    border: 1px solid #A7A9AC;
    min-height: 520px;
    padding: 0 10px;
}
.boxBorder.cargo-table {
    padding: 0;
    border: 0;
    margin-left: -5px;
    margin-right: -5px;
}
.cargo-table table.threeTables td a {
   /* margin-left: 15px;*/ margin-left: 5px;
}
.cargo-table table.threeTables input[type=text], 
.cargo-table table.threeTables [type=number], 
.cargo-table table.threeTables [type=password], 
.cargo-table table.threeTables [type=date], 
.cargo-table table.threeTables [type=file], 
.cargo-table table.threeTables [type=datetime-local] {
    box-sizing: border-box;
	height: 35px;
}
.cargo-table table.threeTables label {
    margin-bottom: 5px;
    display: block;
	text-align: center;
}

.Claims-Table, .Comments-Table {
    width: 50%;
    border: 0;
    float: left;
    box-sizing: border-box;
	padding:0 10px;
}
.boxBorder.claims-comments .Claims-Table, .ClaimsReceived-Table {
    height: 282px;
    overflow-y: auto;
}
.ClaimsReceived-Table {
    float: left;
    width: 50%;
    padding-left: 5px;
    box-sizing: border-box;
}
.ClaimsReceived-Table.pd-rht {
    padding: 0;
    overflow-x: hidden;
    border-right: 1px solid #A7A9AC;
    height: 272px;
    margin: 0 5px;
    margin-top: 7px;
}
.ClaimsReceived-Table.pd-rht #tblInvoicingMainClaims.subTable {
    box-sizing: border-box;
    margin-left: 5px;
    margin: 0;
    padding: 0;
    min-height: 272px;
    border-right: 0;
}
.ClaimsReceived-Table #tblInvoicingMainClaims.subTable {
     border: 1px solid #A7A9AC;
    width: 100%;
    padding: 0 5px;
    min-height: 265px;
}
/* 
.Comments-Table {
    width: 60%;
} */
.boxBorder.claims-comments table.subTable,
.boxBorder.claims-comments #tblInvoicingMainClaims.subTable {
    border: 1px solid #A7A9AC;
    width: 100%;
	padding: 0 5px;
	min-height: 265px;
	margin-top: 16px;
}

.boxBorder.claims-comments {
    border: 0;
    padding: 0;
	margin-left: -10px;
    margin-right: -10px;
}
.cargo-table.lpg-InvoicingMain, .mrgin-fivemin {
    margin-left: -5px;
    margin-right: -5px;
}
.cargo-table.lpg-InvoicingMain .boxBorder.claims-comments {
    margin-left: -5px;
    margin-right: -5px;
}
.Comments-table {
	border: 1px solid #A7A9AC;
    padding: 0 5px;
    float: left;
    margin-top: 10px;
    width: 50%;
    box-sizing: border-box;
    margin-left: 5px;
}

.Comments-table .subTable {
    width: 100%;
}
.cargo-table .three-payment-table table.threeTables label {
    margin-top: 5px;
}
.cargo-table .three-payment-table table.threeTables td {
    vertical-align: top;
}
.cargo-table .three-payment-table table.threeTables td input[type="checkbox"] {
    margin: 0;
}


.cargo-table .three-payment-table table tr {
    height: 60px;
}

.blueHeaderLiquidsDashboard{
	background-color:#CCF0FE;
	color:#007EB0;
}



.klorangebox{
	background-color:#FFE9C1;
	color:#8A5900;
}


.klredbox{
	background-color:#F9CBCC;
	color:#E11B22;
}


.klgreenbox{
	background-color:#D3F3C5;
	color:#3F9D79;
}


#drop-zone {
	border: 2px dashed #007BFF;
	padding: 20px;
	text-align: center;
	color: #007BFF;
	cursor: pointer;
}
#drop-zone.dragover {
	border-color: #0056b3;
	background-color: #f1f1f1;
}
.file-list {
	margin-top: 10px;
}
.file-item {
	margin-bottom: 5px;
}

.buttonStyle[disabled] {
    cursor: not-allowed;
}

/* send invoice email page layout */
.trumbowyg-box{width: 1008px !important;}

#drop-zone {
	border: 2px dashed #007BFF;
	padding: 20px;
	text-align: center;
	color: #007BFF;
	margin-top: 10px;
	cursor: pointer;
}

#drop-zone.dragover {
	border-color: #0056b3;
	background-color: #f1f1f1;
}

.file-list {
	margin-top: 10px;width:100%;
}

.file-item {
	margin-bottom: 5px;
}

.file-list .file-item {
	display: flex;
	justify-content: space-between;
}

/* //send invoice email page layout */
.align-right {
	text-align: right;
}
