body,div,td {
	font-family: Roboto, sans-serif;
	font-size: 12px;
	white-space: normal !important;
	word-wrap: break-word;
}

body {
	background-color: var(--background-color-white);
	text-align: left;
	margin: 0 !important;
}

form {
	width: 100%;
}

a img {
	border: 0 none;
	vertical-align: middle;
}

a {
	text-decoration: auto !important;
}

a:hover {
	color: #000;
}

a:active {
	color: #000;
}

a:visited {
	color: #000;
}

.top-bar-height {
	height: 80px;
}

.bottom-bar-height {
	height: 40px;
}

.right {
	text-align: right;
}

.left {
	text-align: left;
}

.margin-right-side {
	margin-right: 10px !important;
}

.footer {
    overflow: hidden;
    bottom: 0;
    padding: 0px 0px 0px 0px !important;
}	

.stretch {
	min-height: 96vh !important;
}

.ui-panelmenu {
    width:100% !important;
}

.adjust-position-menu {
	padding-bottom: 50px !important;	
}

@media screen and (max-width: 991px) {
	.adjust-position-menu {
		padding-bottom: 0px !important;	
	}	
}

.shadow-top  {
	-webkit-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
	box-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
}

.vertical-container {
	height: 100%;
}

.p-justify-center {
	text-align: center;	
}

.menu-link {
	 font-size: 30px;
	 color: darkgray;
}

.not-collapsed {
	display: none !important;
}

.collapsed {
	display: initial !important;
}


.display-none {
	display: none !important;
}

.mainPanel {
	width: 100%;
}

.form-content {
	padding-top:10px !important;
}

.detailBandTitle {
	font-weight: bold;
}

.tabStyle {
	background: #aabbd5 !important;
}

.ui-dashboard-column {
	width: 48.4%;
	padding: 10px !important;
}

.detailPanelGroup {
	padding-bottom: 20px !important;
}

.detailPanelGroupField {
	padding-top: 10px !important;
}

.viewOnlyInput input {
	opacity: 0.9 !important;
}

.viewOnlyInput {
	opacity: 0.9 !important;
}

.loginPanel {
	background: rgba(255, 255, 255, 0.16);
	border: none;
	color: white !important;
}

.g-recaptcha {
	width: 100%;
}

.datatable-actions-3 {
	width: 150px;
	text-align: center;
}

.treePermissions ul {
	height: 190px !important;
	width: 100% !important;
	overflow-x: hidden !important;
}
  
.header-filter-bt {
	margin-top:0%;
}

.long-datatable-text {
	width: 210px;
}


.panelwidth400px {
	width: 400px;	
}

.datatable-id {
	width: 70px;
	text-align: center;
}

.datatable-center {
	text-align: center;
}

.datatable-small-center {
	text-align: center;
	width: 40px;
}			

.datatable-small-60-center {
	text-align: center;
	width: 70px;
}

.datatable-small-80-center {
	text-align: center;
	width: 120px;
}

.datatable-long-200 {
	width: 200px;
}

.imagePanelGroupField {
	text-align: center;
	padding-bottom: 10px;
}

.datatable-version {
	text-align: center;
	width: 75px;
}

.datatable-big-field {
	width: 195px;
}

.datatable-medium-field {
	width:120px;
}

.datatable-text-100-center {
	width: 100px;
	text-align: center;
}
.datatable-text-169-left {
	width: 169px;
	text-align: left;
}

.coordinate-block-form {
	padding-bottom: 120px !important;
}

.column-number-bucket {
	width: 185px;
}

.filterWidth100px {
	width: 100px !important;;
}

.filterWidth120px {
	width: 120px !important;;
}

.filterWidth140px {
	width: 130px !important;;
}

.filterWidth150px {
	width: 150px !important;
}

.filterWidth160px {
	width: 160px !important;;
}

.filterWidth180px {
	width: 180px !important;;
}

.filterWidth200px {
	width: 200px !important;;
}

.filterWidth550px {
	width: 550px;
}

.filterWidth650px {
	width: 650px;
}

.fieldSetWidth {
	width: 41%;
}

.panelBorder {
	border: 1px solid #748ca5 !important;
	background-color: transparent !important;
	text-align:center;
}

.panelBorderWaterTruck {
	border: 1px solid #748ca5 !important;
	background-color: transparent !important;
	text-align:center;
}

.panelInfoBorder {
	border-style: hidden !important;
	background-color: transparent !important;
}

.outputPanel {
	text-align:left;
}

.noBorder {
	border: none !important;
}height:100vh;

thead .tableWithoutHead {
	display: none !important;
}

.tableWithoutBorder tr {
     border-style: hidden !important;
}

.referenceMonthFilter {
	text-align: center;
}

.backgroundPanel1 .ui-panel-titlebar {
	background: #aad5ce;
}

.backgroundPanel2 .ui-panel-titlebar {
	background: #aabbd5
}

.backgroundPanel3 .ui-panel-titlebar {
   background: #85b2cb;
}

.backgroundPanel4 .ui-panel-titlebar {
   background: #748ca5;
}

.backgroundPanel5 .ui-panel-titlebar {
	background: #24738245;
}

.selectOneOptionWidth {
	width: 86% !important;
}

.InputWidth {
	width: 90% !important;
}

.autoCompleteWidth {
	width: 74% !important;
}

.adjustFileUpload {
	opacity:1 !important;
	width: 95.4% !important;
}

.adjustPdfImageLoad {
	padding: .2em .4em;
	padding-top: 11px;
	border-left: 0.5px solid #a8a8a8;
	border-right:0.5px solid #a8a8a8;
	text-align: center;
}

.expandPdfImageBar {
	padding: .2em .4em;
	background: #aabbd5;
	color: #333;
	font-weigth: bold;
}

.expandPdfImageButton {
	font-family: Roboto, sans-serif !important
}

@media screen and ( min-width: 641px) {
	.pdfDialog {
		width: 800px;
		height: 500px;
	}
}

@media ( max-width : 640px) {
	.pdfDialog {
		width: 280px;
		height: 500px;
	}
	
	.panelInfoBorder {
		border: 1px solid #748ca5 !important;
		background-color: transparent !important;
	}
}

.homologateBorderTopImage {
	border-top: 0.5px solid #a8a8a8;
}

.adjustImageLightBox {
	border-radius: 2px !important; 
	min-width: 45% !important;
}

.adjustTextCheckbox, .ui-chkbox-label {
	vertical-align: super !important;
}

@media ( max-width : 640px) {
	.ui-column-title {
		min-width: 35% !important;
	}
}

@media screen and (min-width: 641px) {
	.alignTextPColumnCenter {
		vertical-align: middle !important;
		text-align:center !important;
	}
}

@media screen and (max-width: 740px) {
	.alignTextCenter {
		display: inline-block !important;
		vertical-align: middle !important;
		text-align: center !important;
		width: 100% !important;
	}
}

.resizeTextAreaRegisterForms {
	display: inline-block !important;
	vertical-align: middle !important;
	text-align:left !important;
	width: 96% !important;
}

.resizeInputsRegisterForms {
	display: inline-block !important;
	vertical-align: middle !important;
	text-align:left !important;
	width: 92% !important;
}

.resizeSelectRegisterForms {
	display: inline-block !important;
	vertical-align: middle !important;
	text-align:left !important;
	width: 87% !important;
}	

.inputNumber input{
	display: inline-block !important;
    vertical-align: middle !important;
    text-align: left !important;
    width: 92% !important;
}

.resizeUploadFileRegisterForm {
	border: 1px solid #a8a8a8 !important;
	width: 97.11%;
	background-color: #f0f1f7 !important;
}

.resizeMultiSelectForm {	
    width: 94.8% !important;
    height: 60% !important;
    vertical-align: middle !important;
   }	

.adjustSelectCheckboxMenu {
	width: 96.5% !important; 
	margin: 0.16% 0% 0% 3% !important; 
	height: 22.22px !important;
}

.adjustLabelOfSelectCheckboxMenu {
	width: 99.4% !important; 
	margin-left: 3% !important;
}

.adjustSelectOneMenu {
	width: 96.5% !important; 
	margin: 0% 0% 3% 0% !important; 
	height: 23.22px !important;
}

@keyframes ocpacityColors {
	0% {opacity: 0.5;);}
	100% {opacity: 1;);}
}

.adjustFooterText {
	font-size: 0.9em !important;
	vertical-align: text-top !important;
	position: absolute !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    padding-top: 35px;
}

.adjustFooterTextAdm {
	font-size: 0.9em !important;
	vertical-align: text-top !important;
    transform: translate(-1%, -50%) !important;
}

.adjustLoginCopyRigthText {
	width: 70px !important;
	align-items: center !important;
	text-align: center !important;
	
}

.adjustBestViewedSite {
	margin-top: -25px;
    background-color: #1F2A30;
   	width: 100%;
}

.container-browser-message {
	  width: 100%;  
	  display: flex;
	  justify-content: center;
	  padding-top: 15px;
	  margin-bottom: 0px;
	  height: 10%;
}

.container-twoFactor-message {
	  width: 100%;  
	  display: flex;
	  justify-content: center;
	  padding-top: 0px;
	  margin-bottom: 0px;
	  height: 10%;
}
	
@media screen and (max-width: 640px) {
.ui-datatable-reflow .ui-reflow-dropdown {
	width: 98%;
	margin: -9px 0px 9px 0px;
	display: flex;
	padding: 4px;
	}
}

@media screen and (max-width: 740px) {
	.adjustBestViewedSite {
		margin-top: -38px;
	    background-color: #1F2A30;
    	width: 100%;
	}
	
	.resizeInputsRegisterForms {
		display: inline-block !important;
		vertical-align: middle !important;
		text-align:left !important;
		width: 87.8% !important;
	} 

	.inputNumber input{
		display: inline-block !important;
		vertical-align: middle !important;
		text-align:left !important;
		width: 98% !important;
	}

	.resizeTextAreaRegisterForms {
		display: inline-block !important;
		vertical-align: middle !important;
		text-align:left !important;
		width: 98% !important;
	}

	.resizeSelectRegisterForms {
		display: inline-block !important;
		vertical-align: middle !important;
		text-align:left !important;
		width: 93.5% !important;
	}	

	.resizeUploadFileRegisterForm {
		border: 1px solid #a8a8a8 !important;
		padding: 15px !important;
		width: 91% !important;
		background-color: #f0f1f7 !important;
	}

	.resizeMultiSelectForm {	
	    width: 100.3% !important;
	    height: 62% !important;
	    vertical-align: middle !important;
    }
    
	.showMapImage {	
		display: block !important;
		width: 82.5% !important; 
		border: 1px solid #a8a8a8 !important;
		background-size: cover !important; 
		background-repeat: no-repeat !important;
		margin-top: 10px !important; 
		padding-left: 55px !important;
		padding-top: 10px !important; 
		padding-bottom: 8px !important;	
	}
	
	.adjustSelectCheckboxMenu {
		width: 99.4% !important; 
		margin: 0% 0% 2% 0% !important; 
		height: 22.22px !important;
	}
	
	.adjustLabelOfSelectCheckboxMenu {
		width: 99.4% !important; 
		margin-left: 0% !important;
	}	
	
	.adjustSelectOneMenu {
		width: 91% !important; 
		margin: 0% 0% 3% 0% !important; 
		height: 22.22px !important;
	}
	
	.adjustFooterText {
	   	font-size: 0.9em !important;
	   	margin-top: 14px !important;
		position: absolute !important;
	   	left: 30% !important;
	   	transform: translate(-30%, -50%) !important;
	   	padding-top: 35px;
	}
	
	.adjustLoginCopyRigthText {
		width: 70px !important;
	    align-items: center !important;
	    text-align: center !important;
	    
	}
}

@media screen and (max-width: 740px) {
	.adjustmentCheckbox {
	    word-break: break-word !important;
	    margin: 0% -15% 0% 0% !important;
	    padding: 0% 0% 0% 3% !important;
	}
}

	.adjustmentRadioButton {
		margin: 0px -10% 0px 0% !important;
	    word-break: break-all !important;
	    word-spacing: normal !important;
	    white-space: nowrap !important;
	}

@media screen and (max-width: 450px) {
	.inputTextareaRegisterForm {
		border: 1px solid #a8a8a8 !important;
    	width: 31.85%;
	}
}

@media screen and (min-width: 740px) {
	.inputTextareaRegisterForm {
		display: block !important;
	    width: 95.7% !important;
	    margin-right: 10% !important;
	    border: 1px solid #a8a8a8 !important;
	}
	
}

@media screen and (max-width: 739px) {
	.inputTextareaRegisterForm {
		border: 1px solid #a8a8a8 !important;
    	width: 95.8% !important;
	}
}

.ui-lightbox {
	left: 20% !important;
	top: 11% !important;
	width: 60%;
	height: 80%;
}

.ui-state-disabled {
    cursor: default!important;
    pointer-events: none;
}

.ui-state-disabled.showTooltip{
    pointer-events: all;
}

.ui-lightbox-nav-right, .ui-lightbox-nav-left{
	display: none !important;
}

.ui-fileupload-row div {
	word-break: break-all !important;
}

.hideMapImage {
	display: none !important;
}

.showMapImage {	
	display: block !important;
	width: 80.7%; 
	border: 1px solid #a8a8a8;
	background-size: cover; 
	background-repeat: no-repeat;
    margin-top: 1%;
    padding-left: 16.4%;
	padding-top: 10px; 
	padding-bottom: 8px;	
}

.panelBorder .ui-panel-titlebar span {
	word-wrap: initial !important;
}

.adjustPaddingActionButtons { 
   	margin: 2.5% 0% 2.5% 0% !important;
}
	
.adjustActionsButtonsMargin {
	margin:2% !important;
}

.adjustWidthInputDate {
	width:90% !important;
}
	
	.show {
		display: block !important;
	}
	
	.hide {
		display: none !important;
	}
	
@media screen and (max-width: 740px) {
	.adjustPaddingActionButtons { 
		right: 1.5% !important;
    	margin: 0% 0.39% 0% 0% !important;
	}
	.adjustActionsButtonsMargin {
		margin:-1.19% !important;
	}
	.adjustWidthInputDate {
		width:99% !important;
	}
	.adjustFilterDate {
		width:97.8% !important;
	}
}

@media screen and (min-width: 640px) {
	.adjustColumnWidthActions {
		width: 12% !important;
		text-align:center !important;
	}
}

@media screen and (min-width: 980px){
	.adjustColumnWidthActions {
		width: 10% !important;
		text-align:center !important;
	}	
}

@media screen and (min-width: 992px) {
  .plazaCharts {
    flex: 0 0 auto !important;
    padding: 0.5rem !important;
    width: 49% !important;
  }
}

@media screen and (min-width: 1400px) {
	.adjustColumnWidthActions {
		width: 7% !important;
		text-align:center !important;
	}	
}

@media screen and (min-width: 1800px) {
	.adjustColumnWidthActions {
		width: 6% !important;
		text-align:center !important;
	}	
}

@media screen and (min-width: 2300px) {
	.adjustColumnWidthActions {
		width: 3% !important;
		text-align:center !important;
	}	
}

@media screen and (max-width: 740px) {
	.adjustColumnWidthGeneralInformation {
		min-width: 100% !important;
		max-width: 100% !important;
	}
	.adjustColumnWidthWaterTruckData {
		min-width: 100% !important;
		max-width: 100% !important;	
	}
	
	.adjustColumnWidthActions {
		min-width: 100% !important;
		max-width: 100% !important;
		text-align:center !important;	
	}	
	
	.ui-widget-header {
		border-color: #a8a8a8 !important;
	}
}

@media screen and (max-width: 740px) {
	.adjustColumnWidthFilling {
		min-width: 100% !important;
		max-width: 100% !important;
	}
		.adjustPaddingActionButtons {
			padding: 0% 2% 0% -3% !important;
	}
}

@media screen and (max-width: 740px) {
	.adjustColumnWidthGeneralInformationMaintenance {
		min-width: 100% !important;
		max-width: 100% !important;
	}
	.ui-widget-header {
		border-color: #a8a8a8 !important;
	}
}

.selectOneOptionFilter {
	width: 22% !important;
	padding-bottom: 1% !important;
}

.selectOneRadioToFilter {
	padding-top: 1% !important;
	padding-left: 2% !important;
}

.dataTableBackGroundNone tbody, .dataTableBackGroundNone tr{
	background-color: transparent !important;
}

.fontBold {
	font-weight:bold !important;
}

/* CSS Primefaces */
.ui-autocomplete {
	width:100% !important;
}

@media screen and (max-width: 576px) {
	.g-recaptcha {
		transform: scale(0.77) !important;
		-webkit-transform: scale(0.77) !important;
		transform-origin: 0 0 !important;
		-webkit-transform-origin: 0 0 !important;
		margin-left: 12% !important;
	}
	
	.long-datatable-text {
		width: inherit;
	}
	
	.datatable-id {
		width: inherit;
	}
	
	.datatable-center {
	text-align: inherit;
	}
	
	.datatable-actions-3 {
		width: inherit;
		text-align: inherit;
	}
	
	.datatable-small-center {
		text-align: inherit;
		width: inherit;
	}
	
	.datatable-version {
		text-align: inherit;
		width: inherit;
	}
	
	.datatable-big-field {
	width: inherit
	}
	
	.datatable-medium-field {
	width: inherit
	}
	
	.column-number-bucket {
	width: inherit;
	}
	
	.filterWidth180px {
	width: inherit !important;;
	}
	
	.filterWidth200px {
	width: inherit !important;
	}
	
	.panelwidth400px {
	width: inherit !important;
	}
	
	.filterWidth650px {
	width: inherit !important;
	}
	
	.filterWidth100px {
	width: inherit !important;
	}
	
	.filterWidth150px {
	width: inherit !important;
	}
	
	.ui-dashboard-column {
	width: 100%;
	padding: 10px !important;
	}
	
	.fieldSetCalendarPadding {
	padding-left: inherit !important;
	}
	
	.filterWidth550px {
		width: inherit !important;
	}
	.overlayPanelRecursive {
		text-align: center;
	}
}

@media screen and (max-width: 768px) {
	.coordinate-block-form {
		padding-bottom: inherit !important;
	}
	
	.center-button {
	text-align: center;
	}
	
	.fieldSetCalendarPadding {
	padding-left: inherit !important;
	}
	
	.calendarFieldSetInput {
	width: 90% !important;
	}
	
	.overlayPanelRecursive {
	text-align: center;
	}
	
	.p-offset-3 {
	margin: inherit !important;
	}
	
	.referenceMonthFilter {
		text-align: left !important;
		padding-top: 2% !important;
	}
	
	.centralizeImage {
		float: left !important;
	}
	
	.selectOneOptionFilter {
		width: 100% !important;
		text-align: center !important;
		padding-bottom: 2% !important;
	}
}

@media screen and (min-width: 576px) {
	.not-collapsed {
		display: none !important;
	}

	.collapsed {
		display: initial !important;
	}

}

@media screen and (min-width: 768px) {
	.not-collapsed {
		display: none !important;
	}
	
	.collapsed {
		display: initial !important;
	}
	
	.header-filter-bt {
		margin-top:25%;
	}
	
	.fieldSetWidth {
	width: 41% !important;
	}

	.panelFileUploadLeft {
		width: 32.599% !important;
    	margin-left: 0% !important;
	}
	
	.panelFileUploadCenter {
		width: 32.599% !important;
	    margin-left: 1% !important;
	}
	
	.panelFileUploadRight {
		width: 32.599% !important;
	    margin-left: 1% !important;
	}
}

@media screen and (min-width: 954px) {
	.not-collapsed {
		display: initial !important;
	}
	
	.collapsed {
		display: none !important;
	}
}

@media screen and (min-width: 992px) {
	.fieldSetWidth {
	width: 39% !important;
	}
}


@media screen and (min-width: 1200px) {
	.not-collapsed {
		display: initial !important;
	}
	
	.collapsed {
		display: none !important;
	}
	
	.fieldSetWidth {
	width: 32% !important;
	}
	
}

.ui-messages-error-detail {
	display: none;
}

/* PRIMEFLEX ENHANCE */


.p-right-offset-12 {
  margin-right: 100%; }

.p-right-offset-11 {
  margin-right: 91.66666667%; }

.p-right-offset-10 {
  margin-right: 83.33333333%; }

.p-right-offset-9 {
  margin-right: 75%; }

.p-right-offset-8 {
  margin-right: 66.66666667%; }

.p-right-offset-7 {
  margin-right: 58.33333333%; }

.p-right-offset-6 {
  margin-right: 50%; }

.p-right-offset-5 {
  margin-right: 41.66666667%; }

.p-right-offset-4 {
  margin-right: 33.33333333%; }

.p-right-offset-3 {
  margin-right: 25%; }

.p-right-offset-2 {
  margin-right: 16.66666667%; }

.p-right-offset-1 {
  margin-right: 8.33333333%; }

.p-right-offset-0 {
  margin-right: 0%; }
  
  
.p-xxl-1,
.p-xxl-2,
.p-xxl-3,
.p-xxl-4,
.p-xxl-5,
.p-xxl-6,
.p-xxl-7,
.p-xxl-8,
.p-xxl-9,
.p-xxl-10,
.p-xxl-11,
.p-xxl-12 {
  padding: 0.5em; !important;}
  
@media screen and (min-width: 2500px) {
  .p-xxl-1,
  .p-xxl-2,
  .p-xxl-3,
  .p-xxl-4,
  .p-xxl-5,
  .p-xxl-6,
  .p-xxl-7,
  .p-xxl-8,
  .p-xxl-9,
  .p-xxl-10,
  .p-xxl-11,
  .p-xxl-12 {
    -webkit-box-flex: 0 !important;
    -ms-flex: 0 0 auto !important;
    flex: 0 0 auto !important;}

  .p-xxl-1 {
    width: 8.3333% !important;}

  .p-xxl-2 {
    width: 16.6667% !important;}

  .p-xxl-3 {
    width: 25% !important;}

  .p-xxl-4 {
    width: 33.3333% !important;}

  .p-xxl-5 {
    width: 41.6667% !important;}

  .p-xxl-6 {
    width: 50% !important;}

  .p-xxl-7 {
    width: 58.3333% !important;}

  .p-xxl-8 {
    width: 66.6667% !important;}

  .p-xxl-9 {
    width: 75% !important;}

  .p-xxl-10 {
    width: 83.3333% !important;}

  .p-xxl-11 {
    width: 91.6667% !important;}

  .p-xxl-12 {
    width: 100% !important;}

  .p-xxl-offset-12 {
    margin-left: 100% !important;}

  .p-xxl-offset-11 {
    margin-left: 91.66666667% !important;}

  .p-xxl-offset-10 {
    margin-left: 83.33333333% !important;}

  .p-xxl-offset-9 {
    margin-left: 75% !important;}

  .p-xxl-offset-8 {
    margin-left: 66.66666667% !important;}

  .p-xxl-offset-7 {
    margin-left: 58.33333333% !important;}

  .p-xxl-offset-6 {
    margin-left: 50% !important;}

  .p-xxl-offset-5 {
    margin-left: 41.66666667% !important;}

  .p-xxl-offset-4 {
    margin-left: 33.33333333% !important;}

  .p-xxl-offset-3 {
    margin-left: 25% !important;}

  .p-xxl-offset-2 {
    margin-left: 16.66666667% !important;}

  .p-xxl-offset-1 {
    margin-left: 8.33333333% !important;}

  .p-xxl-offset-0 {
    margin-left: 0% !important;} }
    

.dashboard-chart-header {
	margin: -.5em -1em;
	padding: .5em 1em .3em;
}

.dashboard-alarms-header {
	margin: -.5em -1em .5em;
	padding: .5em 1em .3em;
}

.login-icons {
	display: flex;
    flex-direction: row;
    text-align: center;
    place-content: space-around;
}



.noborder1 {
	vertical-align: top;
	border: none !important;
	width: 50% !important;
}

.noborder2 {
	vertical-align: top;
	border: none !important;
	width: 50% !important;
}

.wrapper {
	width: 1124px;
	min-width: 1124px;
	max-width: 1124px;
	margin-right: auto;
	margin-left: auto; /* fix max-width incompatibility in IE6 */
	width: expression(document.body.clientWidth >    1124 ?    "1124px" :    
		"auto");
	overflow: hidden;
	display: block;
}

.wrapper_index {
	width: 870px;
	min-width: 870px;
	max-width: 870px;
	margin-right: auto;
	margin-left: auto; /* fix max-width incompatibility in IE6 */
	width: expression(document.body.clientWidth >    870 ?    "870px" :    "auto");
	overflow: hidden;
	display: block;
}

.menu {
	width: 1114px;
	vertical-align: top;
	text-align: left;
	word-wrap: break-word;
}

.content {
	width: 1121px;
	height: auto;
	vertical-align: top;
	text-align: left;
}

.img {
	position: absolute;
	right: 220px;
	top: 0px;
}

.content_index {
	width: 870px;
	height: auto;
	vertical-align: top;
	text-align: left;
}

.content_index_banner {
	width: 870px;
	height: 150px;
	background-color: rgb(205, 205, 205);
	border: none;
}

.mainPanel {
	min-height: 550px;
}

.loginPanel {
	min-height: 450px;
	max-height: 450px;
}

.contentPanel {
	max-height: auto;
	min-height: auto;
}

.contentPanel2 {
	background-color: rgb(0, 245, 255);
	min-height: auto;
	min-width: auto;
}

.banner {
    width: 150px;
	height: 40px;
}

.action-column {
	text-align: center;
	width: 120px !important;
}

.action-column-crud {
	width: 10% !important;
	text-align: center;
}

.action-column-crud2 {
	width: 13%;
	text-align: center;
}

.action-column-crud3 {
	width: 21%;
	text-align: center;
}

.action-column-crud4 {
	width: 15%;
	text-align: center;
}

.action-column-crud5 {
	width: 22% !important;
	text-align: center;
}

.ui-selectmanymenu {
	width: 155px !important;
	height: 100px !important;
}

.dialog {
	width: auto;
}

.col1 {
	vertical-align: top;
	font-weight: bold;
}

.col2 {
	vertical-align: top;
}

.col3 {
	vertical-align: top;
}

.detailDialog {
	width: 870px !important;
	max-height: 520px !important;
	overflow: auto !important;
}

.detailDialog2 {
	width: 930px !important;
	max-height: 600px !important;
	overflow: auto !important;
}

.detailDialog3 {
	width: 1050px !important;
	max-height: 600px !important;
	overflow: auto !important;
}

.detailDialog4 {
	width: 930px !important;
	max-height: 520px !important;
	overflow: auto !important;
	top: 90px!important;
}

.detailDialog5 {
	width: 960px !important;
	max-height: 600px !important;
	overflow: auto !important;
}


.detailDialogChart {
	width: 1151px !important;
	max-height: 520px !important;
	min-height: 420px !important;
}



.filterWidth150px {
	width: 150px !important;
}

.forgotPassDialog {
	width: 330px !important;
}

.firmwareDialog {
	width: 650px !important;
	height: 380px !important;
}

.detailBandTitle {
	padding: 5px;
	font-weight: bold;
}

.detailPanelGroupField {
	float: left;
	padding-right: 10px;
	padding-top: 10px;
}

.detailPanelGroup {
	padding-bottom: 20px;
	display: inline-block;
}

.pageLocation {
	display: block;
	padding-top: 10px;
}

.noBorders tr,.noBorders td {
	background: none !important;
	border: none !important;
}

.treePermissions ul {
	height: 200px !important;
	max-height: 240px;
	width: 300px !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
}

.treeAllowed ul {
	height: 100px !important;
	width: 235px !important;
	overflow-x: hidden !important;
}

.headerTableData1 {
	width: 5%; 
	padding-right: 0% !important; 
	padding-left: 0% !important;
}

.headerTableData2 {
	width: 25%; 
	padding-right: 0% !important;
	padding-left: 0% !important;
}

.headerTableData3 {
	width: 8%; 
	padding-right: 25% !important; 
	padding-left: 0% !important;
}

.headerTable1 {
	width: 6%;
	text-align: center;
}

.headerTable2 {
	width: 94%;
	padding-right: 10% !important;
}

.headerTable1_terminal {
	width: 30%;
	text-align: center;
}

.headerTable1_ptt {
	width: 6%;
	text-align: center;
}

.headerTable2_terminal {
	width: 70%;
	padding-right: 20% !important;
}

.headerTable1_QC {
	width: 17px !important;
	text-align: left;
	padding-top: 2px !important;
}

.headerTable2_QC {
	width: 120px !important;
	text-align: left;
	padding-top: 2px !important;
}

.headerTable1_log {
	width: 40%;
	text-align: center;
}

.headerTable2_log {
	width: 60%;
	padding-right: 20% !important;
}

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

.buttonAlign {
	text-align: center;
}

.tabViewDialog {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

.detailPanelGroupBooleanContent {
	margin-top: 20px;
}

.alerttypefilter {
	width: 400px !important;
}

.img-button-location {
	background-image: url('../resources/images/location.png') !important;
}

.img-button-energy {
	background-image: url('../resources/images/energy.png') !important;
}


.img-button-xls {
	background-image: url('../resources/images/xls_file.png') !important;
} 

.img-button-chart-curve {
	background-image: url('../resources/images/chart-curve-icon.png') !important;
}

.img-button-route {
	background-image: url('../resources/images/route.png') !important;
}

.img-button-project {
	background-image: url('../resources/images/project-ico.png') !important;
}

.img-button-sms {
	background-image: url('../resources/images/sms.png') !important;
}

.img-button-assoc {
	background-image: url('../resources/images/assoc.png') !important;
}

.img-question {
	background-image: url('../resources/images/duvida.gif') !important;
}

.img-variable {
	background-image: url('../resources/images/variable.png') !important;
}

.img-pump {
	background-image: url('../resources/images/water-pumps.jpg') !important;
}

.img-text {
	background-image: url('../resources/images/text.png') !important;
}

.img-alarm {
	background-image: url('../resources/images/alarm.png') !important;
}

.img-rtc {
	background-image: url('../resources/images/rtc.png') !important;
}

.img-modbus {
	background-image: url('../resources/images/modbus.png') !important;
}

.img-fault {
	background-image: url('../resources/images/fault.png') !important;
}

.img-cancel {
	background-image: url('../resources/images/cancel.png') !important;
}

.img-updatevars {
	background-image: url('../resources/images/updatevars.png') !important;
}

.img-schedule {
	background-image: url('../resources/images/calendar.png') !important;
}

.img-restrict {
	background-image: url('../resources/images/restrict.png') !important;
}

.img-remote {
	background-image: url('../resources/images/remote.png') !important;
}

.img-tags {
	background-image: url('../resources/images/tags.png') !important;
}

.img-balls {
	background-image: url('../resources/images/balls.png') !important;
}

.img-chart {
	background-image: url('../resources/images/chart.png') !important;
}

.img-static-alert {
	background-image: url('../resources/images/static_alert.png') !important;
}

.img-dynamic-alert {
	background-image: url('../resources/images/dynamic_alert.png') !important;
}

.img-legend {
	background-image: url('../resources/images/legend.png') !important;
}

.img-remote-icon {
	background-image: url('../resources/images/remote-icon.png') !important;
}

.img-device {
	background-image: url('../resources/images/device.png') !important;
}

.img-sensor {
	background-image: url('../resources/images/sensor.png') !important;
}

.img-history {
	background-image: url('../resources/images/history.png') !important;
}

.img-update {
	background-image: url('../resources/images/update.png') !important;
}

.img-hidrometer {
	background-image: url('../resources/images/hidrometer.png') !important;
}

.img-adjustment {
	background-image: url('../resources/images/adjustment.png') !important;
}

.img-info {
	width:45px !important;
	height:64px !important;
	background-image: url('../resources/images/info.png') !important;
}

.img-bell {
	background-image: url('../resources/images/bell.png') !important;
}

.img-monitor {
	background-image: url('../resources/images/monitor.png') !important;
}

.img-valve {
	background-image: url('../resources/images/valve_icon.png') !important;
}

.img-well {
	background-image: url('../resources/images/poco.png') !important;
}

.img-line {
	background-image: url('../resources/images/line_icon.png') !important;
}

.img-map {
	background-image: url('../resources/images/map.png') !important;
}

.img-button-sms {
	background-image: url('../resources/images/sms.png') !important;
}

.blackFont {
	font-weight: bold;
}

.pumpEletricDataPanel {
	width: 220px;
	height: 310px !important;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpTlmPanel {
	width: 220px;
	height: 90px !important;
	margin-left: 0px;
	margin-top: 320px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpCMBPanel {
	width: 220px;
	height: 170px;
	margin-left: 865px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpWellPanel {
	width: 220px;
	height: 95px;
	margin-left: 865px;
	margin-top: 185px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpAlertsPanel {
	width: 560px;
	height: 140px;
	margin-left: 260px;
	margin-top: 320px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpCMBPanel2 {
	width: 220px;
	height: 170px;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpWellPanel2 {
	width: 220px;
	height: 95px;
	margin-left: 0px;
	margin-top: 185px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpTlmPanel2 {
	width: 220px;
	height: 95px !important;
	margin-left: 865px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.valveVar1Panel {
	width: 120px;
	height: 100px;
	margin-left: 220px;
	margin-top: 20px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.valveVar2Panel {
	width: 120px;
	height: 100px;
	margin-left: 685px;
	margin-top: 20px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.valveVar3Panel {
	width: 120px;
	height: 100px;
	margin-left: 220px;
	margin-top: 260px;
	position: absolute;
	speak-header: once;
	background-color: transparent;
	text-align: center;
}

.valveVar4Panel {
	width: 120px;
	height: 100px;
	margin-left: 375px;
	margin-top: 260px;
	position: absolute;
	background-color: transparent;
	text-align: center;
}

.valveVar5Panel {
	width: 120px;
	height: 100px;
	margin-left: 530px;
	margin-top: 260px;
	position: absolute;
	background-color: transparent;
	text-align: center;
}

.valveVar6Panel {
	width: 120px;
	height: 100px;
	margin-left: 685px;
	margin-top: 260px;
	position: absolute;
	background-color: transparent;
	text-align: center;
}

.valvePanel {
	width: 100%;
	height: 100%;
	min-height: 380px;
	min-width: 600px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/valve.png') !important;
	background-color: transparent;
}

.pumpOnPanel {
	max-height: auto;
	min-height: auto;
	min-height: 470px;
	min-width: 600px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/pump_on.jpg') !important;
	background-color: transparent;
}

.pumpOffPanel {
	max-height: auto;
	min-height: auto;
	min-height: 470px;
	min-width: 600px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/pump_off.jpg') !important;
	background-color: transparent;
}

.pumpErroPanel {
	max-height: auto;
	min-height: auto;
	min-height: 470px;
	min-width: 600px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/pump_erro.jpg') !important;
	background-color: transparent;
}

.pumpTripPanel {
	max-height: auto;
	min-height: auto;
	min-height: 470px;
	min-width: 600px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/pump_trip.gif') !important;
	background-color: transparent;
}

#valvecontentwrapper {
	width: 100%;
	height: 100%;
	min-height: 400px;
	min-width: 600px;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url('../resources/images/valve.png') !important;
	background-color: transparent;
}

.bombPanel {
	max-height: auto;
	min-height: auto;
	min-height: 470px;
	min-width: 600px;
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	background-repeat: no-repeat;
	background-position: center;
	background-color: transparent;
}

.pumpCMB1Panel {
	width: 270px;
	height: 200px !important;
	margin-left: 0px;
	margin-top: 110px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpCMB2Panel {
	width: 270px;
	height: 200px !important;
	margin-left: 815px;
	margin-top: 110px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpAlertsPanel1 {
	width: 480px;
	height: 140px;
	margin-left: 0px;
	margin-top: 320px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.pumpAlertsPanel2 {
	width: 480px;
	height: 140px;
	margin-left: 605px;
	margin-top: 320px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.levelPanel {
	width: 480px;
	height: 95px;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.CCMPanel {
	width: 170px;
	height: 95px;
	margin-left: 505px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.highLevelPanel {
	width: 115px;
	height: 25px;
	margin-left: 290px;
	margin-top: 120px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.lowLevelPanel {
	width: 115px;
	height: 25px;
	margin-left: 290px;
	margin-top: 270px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.wellLevelPanel {
	width: 205px;
	height: 25px;
	margin-left: 420px;
	margin-top: 270px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

.QCPanel {
	width: 170px;
	height: 95px;
	margin-left: 685px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
}

/*

.ui-column-filter2{
    width : 35% !important;
}

*/
.ui-column-filter {
	max-width: 100% !important;
}

.infoWindowText {
	text-align: left;
	display: block;
	margin: auto;
	font-size: 13px;
}

.map {
	width: 900px;;
	height: 400px;
}

html.progress,html.progress * {
	cursor: progress !important;
}

.configurePttWizardPanel {
	height: 450px;
	border: none;
}

.configurePttPanelGroup {
	margin-top: 15px;
}

.configurePttInput {
	min-width: 175px !important;
}

.pickListInlineOutput {
	display: inline-block;
	width: 237px;
	padding-left: 5px;
	font-weight: bold;
}

.wizardSaveButton {
    float: right;
    margin-top: inherit;
    margin-right: 0px !important;
	min-width: 86px;
	margin-right: 7px !important;
}

.acceptanceTermText {
	margin-top: 10px;
	background-color: #F3F3F3;
	padding: 1px 12px;
	border: 1px solid #8C8C8B;
}

.justifyText {
	text-align: justify;
}

.acceptanceTermButtons {
	margin-top: 20px;
	display: flex;
	justify-content: flex-end;
}

.buttonAcceptAcceptanceTerm {
	min-width: 90px;
}

.buttonDeclineAcceptanceTerm {
	margin-left: 2px;
	min-width: 90px;
}


.displayAlertInput input {
	opacity: 1 !important;
	color: white;
	font-size: 9pt;
	text-align: center;
	background-color: tomato;
}

.displayAlertInput {
	opacity: 1 !important;
	color: white;
	font-size: 9pt;
	text-align: center;
	background-color: tomato;
}

.displayInput input {
	opacity: 1 !important;
	color: white;
	font-size: 9pt;
	text-align: center;
	background-color: black;
}

.displayInput {
	opacity: 1 !important;
	font-size: 9pt;
	text-align: center;
	background-color: black;
	color: white;
}

.displayOutput {
	font-size: 9pt;
}

.ui-inputfield,.ui-widget-content .ui-inputfield,.ui-widget-header .ui-inputfield {
	background: #ffffff !important;
	border: none;
}

.ui-dashboard-column {
	padding: 10px !important;
}

@media screen and (max-width: 1260px) {
	.ui-dashboard-column {
		padding: 10px !important;
		width: 99%;
	}
}

#ui-clock-header .ui-clock {
	font-size: 11px !important;
	float: right;
	border: 0;
	background-color: white;
	padding: 0px;
}

.ui-clock {
	font-size: 30px !important;
}

div[id="form:datatableAlerts"] table thead tr {
	display: none;
}

div[id="form:datatableAlerts2"] table thead tr {
	display: none;
}

div[id="form:datatableLegends"] table thead tr {
	display: none;
}

div[id="form:datatableStatus"] table thead tr {
	display: none;
}

.noHeader table thead tr {
	display: none;
}

.hide-column-names table thead tr {
	width: 100%;
}

.highlight {
	background: white !important;
}

.highlight2 {
	color: white;
	background: tomato !important;
}

.ui-datatable thead th,.ui-datatable tbody td,.ui-datatable tfoot td {
	white-space: normal !important;
	background-size: contain !important;
	padding-right: 5px !important;
	padding-left: 5px !important;
}

.map_normal_screen {
	width: 1112px;
	height: 400px
}

.map_normal_screen_basin {
	min-height: 74vh;
}

.map_full_screen {
	height: 100% !important;
	width: 100% !important;
	left: 0px !important;
	top: 0px !important;
	border: none !important;
	position: fixed !important;
}

.legend_normal_screen {
	left: 10px !important;
	top: -5px !important;
	z-index: 10000 !important;
}

.legend_full_screen {
   
    display: nome;
}

.status_normal_screen {
	left: 1020px !important;
	top: -83px !important;
	z-index: 10000 !important;
	position: relative !important;
}

.status_full_screen {
	left: 1020px !important;
	top: 315px !important;
	position: relative !important;
}


.alert_normal_screen {
	left: 990px !important;
	top: -115px !important;
	z-index: 10000 !important;
	position: relative !important;
}

.alert_full_screen {
	top: 0px !important;
	z-index: -10000 !important;
}

.chart_normal_screen {
	left: 1080px !important;
	top: -148px !important;
	z-index: 10000 !important;
	position: relative !important;
}

.chart_normal_screen_admin {
	left: 0px !important;
	top: -5px !important;
	z-index: 10000 !important;
	position: relative !important;
}

.chart_full_screen {
	left: 1110px !important;
	top: 215px !important;
	position: relative !important;
}


.priority_1 {
	background-color: rgb(255, 0, 0) !important;
	color: white !important;
}

.priority_2 {
	background-color: rgb(255, 125, 0) !important;
	color: white !important;
}

.priority_3 {
	background-color: rgb(255, 215, 0) !important;
}

.priority_4 {
	background-color: rgb(173, 255, 47) !important;
}

.priority_5 {
	background-color: rgb(0, 255, 0) !important;
}

.priority_6 {
	background-color: rgb(154, 205, 50) !important;
}

.priority_7 {
	background-color: rgb(0, 255, 127) !important;
}

.priority_8 {
	background-color: rgb(147, 112, 219) !important;
	color: white !important;
}

.priority_9 {
	background-color: rgb(0, 245, 255) !important;
}

.priority_10 {
	background-color: rgb(72, 118, 255) !important;
	color: white !important; 
}

.priority_unknown {
	background-color: white;
}

/*---------Common styles between the monitoring screens-----*/
.erro_msg {
	font-weight: bold !important;
	font-size: 12pt !important;
	text-align: center !important;
	color: red !important;
	padding-bottom: 5px !important;
}

@-webkit-keyframes bombMainScreen {
0% { opacity: 0; }
100% { opacity: 1; } 
}
@-moz-keyframes bombMainScreen {
0% { opacity: 0;}
100% { opacity: 1; }
}
@-o-keyframes bombMainScreen {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes bombMainScreen {
0% { opacity: 0; }
100% { opacity: 1; }
}

.bombMainScreen {
	-webkit-animation: bombMainScreen 0.5s ease-in-out;
	-moz-animation: bombMainScreen 0.5s ease-in-out;
	-o-animation: bombMainScreen 0.5s ease-in-out;
	animation: bombMainScreen 0.5s ease-in-out;
	width: 100%;
	height: 93%;
	float: left;
	position: inherit;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	left: 0px;
	top: 0px;
}

.imgBomb1 {
    position: absolute;
    z-index: 1;
}
.imgBomb2 {
    position: relative;
    z-index: 0;
}

.bombSouthAlertPanel {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100%;
	border:none;
	height: 100%;
	text-align: center;
	background-color: transparent;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.panelTelecomandDialog {
	background-color: white;
	height: 250px;
	top:294px !important;
	padding-right: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
	width: 350px !important;
}

.title {
	font-weight: bold !important;
	font-size: 10pt !important;
	text-align: center !important;
	padding-bottom: 5px !important;
}

.displayOutput2 {
	font-size: 8pt;
}

.displaydate {
	font-size: 7pt;
}

.displayInput2 {
	background-color: black !important;
	opacity: 1 !important;
	color: white !important;
	font-size: 9pt !important;
	text-align: center !important;
	width: 100px !important;
	border-radius: 6px;
}

.displayAlertInput2 {
	background-color: tomato !important;
	opacity: 1 !important;
	color: white !important;
	font-size: 10pt !important;
	text-align: center !important;
	width: 100px !important;
	border-radius: 6px;
}

.displayInputBombOn {
	background-color: green !important;
	opacity: 1 !important;
	color: white !important;
	font-size: 11pt !important;
	text-align: center !important;
}

.displayInputBombOff {
	background-color: tomato !important;
	opacity: 1 !important;
	color: white !important;
	font-size: 10pt !important;
	text-align: center !important;
	width: 100px !important;
}

.telecmd {
	font-size: 8pt !important;
	text-align: center !important;
	width: 120px !important;
}

.telecmdDisable {
	font-size: 8pt !important;
	text-align: center !important;
	width: 120px !important;
	opacity: 1 !important;
}

.mainImage {
	display: flex !important;
	height: 100% !important;
	width: 100% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	margin: 0% !important;
	margin-bottom: 0px !important;
	margin-left: 0px !important;
	margin-right: 0px !important;
	margin-top: 0px !important;
	top: 50% !important;
	left: 50% !important;
	border-radius: var(--radius);
}

.mainImageLane {
	display: flex !important;
	height:100% !important;
	width: 100% !important;
	position: relative;
	left: 0%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	border-radius: var(--radius);
}


.mainInfoLane {
	height: 100% !important;
	width: 100% !important;
	position: relative;
	left: 0%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.graphic {
	text-align: left !important;
}

.headerTable1_QC2 {
	/* 	padding-top: 1% !important; */
	text-align: left !important;
}

.headerTable2_QC2 {
	text-align: left !important;
	/* 	padding-top: 1% !important; */
	/* 	margin-left: 5% !important; */
	/* 	width: 60%; */
}

.headerTable1_Monitor2 {
	text-align: left;
}

.headerTable2_Monitor2 {
	text-align: center;
}

.date {
	font-weight: bold;
}

.ui-layout-unit {
	border: none;
	vertical-align: middle;
}

.ui-layout-unit-content {
	overflow: visible !important;
	background-color: transparent;
}

/*---------Style to monitoring screen with 2 bombs----------*/
.bomb2PanelNorth1 {
	width: 51%;
	height: 95%;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	/*     background-color: red; */
}

.bomb2PanelNorth2 {
	width: 14%;
	height: 95%;
	margin-left: 52%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb2PanelNorth3 {
	width: 14%;
	height: 95%;
	margin-left: 67%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb2PanelNorth4 {
	width: 17.5%;
	height: 95%;
	margin-left: 82%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb2PanelWest {
	width: 100%;
	height: 93%;
	text-align: center;
	background-color: transparent;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb2PanelEast {
	width: 100%;
	height: 93%;
	text-align: center;
	background-color: transparent;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb2PanelSouthWest {
	background-color: transparent;
	height: 95%;
	width: 49%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb2PanelSouthEast {
	background-color: transparent;
	height: 95%;
	width: 49%;
	position: relative;
	top: -96%;
	left: 51%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}


.panelGridTelemetry {
	margin-top: 0% !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.panelGridAlerts {
	margin-top: 0% !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.panelGrid1 {
	margin-top: 1% !important;
	width: 100% !important;
	margin-left: 5px;
}

.panelGrid2 {
	margin-top: 5% !important;
	width: 100% !important;
	margin-left: 3%;
}

.panelGrid3 {
	margin-top: 5% !important;
	width: 100% !important;
	margin-left: 0%;
}

.panelGrid4 {
	margin-top: 1% !important;
	width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.panelGrid5 {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
}

.panelGrid6 {
	margin-left: 5% !important;
	margin-top: 5% !important;
	width: 100% !important;
}

.panelGrid7 {
	margin-top: 1% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

.panelGrid8 {
	margin-top: 1% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/*----------------------------------------------------------*/
/*---------Style to monitoring screen with 3 bombs----------*/
.bomb3PanelNorth1 {
	height: 95%;
	width: 33%;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelNorth2 {
	width: 33%;
	height: 95%;
	margin-left: 34%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelNorth3 {
	width: 32%;
	height: 95%;
	margin-left: 68%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelWest {
	width: 100%;
	height: 93%;
	text-align: center;
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: transparent;
	margin-top: 0% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelEast1 {
	width: 100% !important;
	height: 29% !important;
	text-align: center;
	background-color: transparent;
	margin-bottom: 1% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelEast2 {
	width: 100%;
	height: 31% !important;
	text-align: center;
	background-color: transparent;
	margin-bottom: 1% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelEast3 {
	width: 100% !important;
	height: 29% !important;
	text-align: center;
	background-color: transparent;
	margin-bottom: 0% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb3PanelSouth1 {
	background-color: transparent;
	height: 95%;
	width: 33%;
	position: relative;
	top: 0%;
	left: 0%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb3PanelSouth2 {
	background-color: transparent;
	height: 95%;
	width: 33%;
	position: relative;
	top: -96%;
	left: 34%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb3PanelSouth3 {
	background-color: transparent;
	height: 95%;
	width: 32%;
	position: relative;
	top: -192%;
	left: 68%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.panelGrid1to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
}

.panelGrid2to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
}

.panelGrid3to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
}

.panelGrid4to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
	margin-left: 2%;
}

.panelGrid5to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
	margin-left: 5% !important;
}

.panelGrid6to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	margin-top: 1% !important;
}

.panelGrid7to3Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	margin-top: 1% !important;
}

/*----------------------------------------------------------*/
/*---------Style to monitoring screen with 4 bombs----------*/
.bomb4PanelNorth1 {
	width: 51%;
	height: 95%;
	margin-left: 0px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	/*     background-color: red; */
}

.bomb4PanelNorth2 {
	width: 14%;
	height: 95%;
	margin-left: 52%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb4PanelNorth3 {
	width: 14%;
	height: 95%;
	margin-left: 67%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bomb4PanelNorth4 {
	width: 17.5%;
	height: 95%;
	margin-left: 82%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

.bombWestPanel {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100%;
	border:none;
	height: auto !important;
	text-align: center;
	background-color: transparent;
	margin-top: 0% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
	margin-bottom: 6px;
}

.bombEastPanel {
	width: 100%;
	border:none;
	height: auto !important;
	margin-left: auto !important;
	margin-right: auto !important;
	text-align: center;
	background-color: transparent;
	margin-top: 0% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
	margin-bottom: 6px;
}

.bomb4PanelSouth1 {
/* 	margin-left: auto !important; */
/* 	margin-right: auto !important; */
	background-color: transparent;
	height: 95%;
	width: 25%;
	position: relative;
	top: 0%;
	left: 0%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb4PanelSouth2 {
/* 	margin-left: auto !important; */
/* 	margin-right: auto !important; */
	background-color: transparent;
	height: 95%;
	width: 25%;
	position: relative;
	top: -96%;
	left: 26%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb4PanelSouth3 {
/* 	margin-left: auto !important; */
/* 	margin-right: auto !important; */
	background-color: transparent;
	height: 95%;
	width: 25%;
	position: relative;
	top: -192%;
	left: 52%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.bomb4PanelSouth4 {
/* 	margin-left: auto !important; */
/* 	margin-right: auto !important; */
	background-color: transparent;
	height: 95%;
	width: 25%;
	position: relative;
	top: -289%;
	left: 78%;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	text-align: center !important;
}

.panelGrid1to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 1% !important;
	width: 100% !important;
	margin-left: 5px;
}

.panelGrid2to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
	margin-left: 3%;
}

.panelGrid3to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
	margin-left: 0%;
}

.panelGrid4to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100% !important;
	margin-top: 1% !important;
}

.panelGrid5to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
}

.panelGrid6to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
	background-color: transparent;
}

.panelGrid7to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
}

.panelGrid8to4Bomb {
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 5% !important;
	width: 100% !important;
}

/*---------Style to monitoring screen SMSUB----------*/
.inputMeasurementPanel {
	width: 50.4%;
	height: 100%;
	margin-left: 0.3px;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
}

.instrumentationPanel {
	width: 14%;
	height: 100%;
	margin-left: 50.85%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
}

.engineControlCenterPanel {
	width: 19%;
	height: 100%;
	margin-left: 65.3%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
}

.remoteControlPanel {
	width: 15%;
	height: 100%;
	margin-left: 84.7%;
	margin-top: 0px;
	position: absolute;
	background-color: transparent;
	text-align: center;
	display: block;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
	background-color: var(--background-color-white);
}


/*---------Style to monitoring screen with 5 bombs----------*/
.inputMeasurementPanel5 {
	width: 100%;
	height: 27%;
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: transparent;
	text-align: center;
	display: block;
	margin-top: 0% !important;
	margin-bottom: 5% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
} 

.remoteControlPanel5 {
	width: 98%;
	height: 27%;
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: transparent;
	text-align: center;
	display: block;
	margin-top: 0% !important;
	margin-bottom: 5% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}

/*---------Style to monitoring screen with 6 bombs----------*/
.inputMeasurementPanel6 {
	width: 100%;
	height: 27%;
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: transparent;
	text-align: center;
	display: block;
	margin-top: 0% !important;
	margin-bottom: 5% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
} 

.remoteControlPanel6 {
	width: 98%;
	height: 27%;
	margin-left: auto !important;
	margin-right: auto !important;
	background-color: transparent;
	text-align: center;
	display: block;
	margin-top: 0% !important;
	margin-bottom: 5% !important;
	padding-top: 0% !important;
	padding-right: 0% !important;
	padding-bottom: 0% !important;
	padding-left: 0% !important;
}


/*----------------------------------------------------------*/
.ui-datatable .ui-expanded-row-content {
	border-top: 0px none;
	height: auto !important;
	background-color: #d6d6d6;
	min-height: 100px !important;
	max-height: 200px !important;
}


.gc-bubbleDefault {
	transform: scale(0.82);
	transform-origin: 0;
	-webkit-transform: scale(0.82);
	transform: scale(0.82);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;	
}

.ui-panelgrid-cell {
	 border-width: 0px !important;
}

.button1_img_screen {
	opacity: 1 !important;
	z-index: 10000 !important;
}

.button2_img_screen {
	opacity: 1 !important;
	text-align:center;
	left: -30px !important;
	top: 30px !important;
	z-index: 10000 !important;
	padding-left:10px;
/* 	position: relative !important; */
}

.button3_img_screen {
	opacity: 1 !important;
	text-align:center;
	left: -60px !important;
	top: 60px !important;
	z-index: 10000 !important;
	padding-left:10px;
/* 	position: relative !important; */
}

.wizard-bottom-right{
	position:relative; 
	margin-top: 177px;
}

.wizard-bottom-right-button {
	margin-top: 3px;
}

.ui-menu .ui-menu-list .ui-menuitem {
        font-size: 13px !important;
}

.manual-20{
	vertical-align:top !important;
	width: 20% !important;
	height: 100% !important;
}
.manual-80{
	vertical-align:top !important;
	width: 80% !important;
	height: 100% !important;
}

.resizeDowloadAppMobile {
    margin-left: 2% !important;
}

.variableOutputLabel {
	position: absolute !important;
    right: 32px !important;
    top: 125px !important;
    font-size: 11px !important;
    text-transform: inherit !important;
    font-weight: 600 !important;
    word-break: break-all !important;
    white-space: break-spaces !important;
    color: #4f76b5  !important;
}

.templateVariableOutputLabel {
	position: absolute !important;
    right: 32px !important;
    top: 196px !important;
    font-size: 11px !important;
    text-transform: inherit !important;
    font-weight: 600 !important;
    word-break: break-all !important;
    white-space: break-spaces !important;
    color: #4f76b5  !important;
}

.adjustPttsOfScreen {
    position: fixed !important;
    overflow-x: hidden !important;
    width: 100% !important;
    height: 100% !important;
}

.adjustPttsFrames {
    text-align: center;
    min-width: 99% !important;
    min-height: 100% !important;
    max-width: 99% !important;
    max-height: 100% !important;
    padding: 0px 0px 0px 0px !important;
    display: grid;
    position: relative;
}

 .adjustInternalPttsFrames {
	display: table-column;
}

.weather-right--type1:first-of-type {
	width: 100% !important;
}	

.widget-right {
	box-shadow: none !important
}

.weatherPanelGrid {
	display: contents;
	align-items: center;
}

.weatherImageList {
	margin-bottom: -10px;
    margin-top: -18px;
    margin-left: -2px;
}
.weatherImage {
	margin-top: -10px;
}

.pttWeatherDataGrid .ui-datagrid-column {
	padding: 0px !important;
}

.pttWeatherDataGrid .ui-g {
	width: -webkit-fill-available !important;
    place-content: space-between !important;
    align-self: flex-start;
    display: flex;
	flex-flow: row nowrap;
	align-items: center;
}

.detailAreaPanelGroup {
	padding-bottom: 20px;
	display: -webkit-inline-box;
}

.fileUpload .ui-fileupload-buttonbar{
	padding-left: 2px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}


.deleteAreaBtn {
    margin-right: 5px;
    margin-top: 4px;
    width: 97%;
}

.labels {
    font-family:"Roboto";
    font-size:12px !important;
    color:black;
    font-weight:bolder;
    background-color: #FFFFFF;
    border-radius: 392px 90px 392px 378px / 140px 140px 140px 90px;
    margin-top: 45px;
}

.detailDialogBasinChart {
	width: 90% !important;
	height: 95vh !important;
}

.scrollDialogBasinChart {
	padding : 15px;
	margin-bottom: 50px;
	width: 100% !important;
	height: 80vh !important; 
}

.chartsDialogBasinChart{
	width:90%; 
	margin-left: 1.5%;
	margin-right: 1.5%;
}

.painelsGroupDialogBasinChart{
	display: flex;
	flex-direction: row;
    justify-content: center;
	margin-top: 15px;
	margin-bottom: 50px;
}

.detailTitleDialogBasinChart {
	font-weight: bold;
	font-size: 20px;
}

.reportDialogContent {
	display: flex;
    flex-direction: row;
    place-content: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

.reportDialogButton {
    display: flex;
    flex-direction: row;
    place-content: flex-end;
}


.align_items_center  {
    display: flex;
    flex-direction: row;
    place-items: center;
}

.align_content_center {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.align_content_items_center {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.align_items_space_between {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

.standardized-bar-style .ui-progressbar-value {
	background: #008000;
}

.observation-bar-style .ui-progressbar-value {
	background: #808080;
}

.attention-bar-style .ui-progressbar-value {
	background: #ffff00;
}

.alert-bar-style .ui-progressbar-value {
	background: #ffa500;
}

.maximum-alert-bar-style .ui-progressbar-value {
	background: #ff0000;
}

.status-level-standardized {
	width: 50px;
	height: 20px;
	background-color: #008000;
	border: 1px solid #a8a8a8;
}
.status-level-observation {
	width: 50px;
	height: 20px;
	background-color: #808080;
	border: 1px solid #a8a8a8;
}
.status-level-attention {
	width: 50px;
	height: 20px;
	background-color: #FFFF00;
	border: 1px solid #a8a8a8;
}
.status-level-alert {
	width: 50px;
	height: 20px;
	background-color: #FFA500;
	border: 1px solid #a8a8a8;
}
.status-level-maximum-alert {
	width: 50px;
	height: 20px;
	background-color: #FF0000;
	border: 1px solid #a8a8a8;
}

.status-level-failure {
	width: 50px;
	height: 20px;
	background-color: #A349A4;
	border: 1px solid #a8a8a8;
}

.status-bomb-image {
	width: 23px;
	height: 23px;
}
	
.status-table {
    display: flex;
    flex-direction: inherit;
}

.status-table-box {
	display: block;
    padding: 2px 6px;
    width: 10em;
    font-weight: bold;
    background-color: white;
    border: 1px solid #a8a8a8;
}

.status-table-font {
	font-weight: bold;
}

.basin-table-column {
	display: flex;
    flex-direction: row;
    align-items: center;
    text-align: center
}

.pumping-led-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 10px;
    margin-bottom: 10px;
}

.pumping-led-title {
	color:#666;
	font-size: 1.2em !important;
	font-family: Arial, Helvetica, sans-serif !important;
	width: 250px; 
	text-align: center; 
	margin-bottom: 5px;
}

.pumping-led-panel {
	width: 250px;
	background: none repeat scroll 0 0 #f2f5f9;
	text-align: center;
}

.img-tunnel {
	background-image: url('../resources/images/tunnel.png') !important;
}

.status-measurement-normal {
	width: 50px;
	height: 20px;
	background-color: #008000;
	border: 1px solid #a8a8a8;
}

.status-measurement-attention {
	width: 50px;
	height: 20px;
	background-color: #FFFF00;
	border: 1px solid #a8a8a8;
}

.status-measurement-alert {
	width: 50px;
	height: 20px;
	background-color: #FFA500;
	border: 1px solid #a8a8a8;
}

.status-engine {
	width: 100px;
	height: 20px;
	background-image: linear-gradient( to right, #008000 50%, #FF0000 50% );
	border: 1px solid #a8a8a8;
}

.no-padding {
	padding: 0px !important;
}

.tunnel-table .ui-datatable-tablewrapper {
	overflow: hidden;
}

.status-operational-capacity-standardized .ui-progressbar-value {
	background: #008000;
}

.status-operational-capacity-alert .ui-progressbar-value {
	background: #FFA500;
}

.status-operational-capacity-maximum-alert {
	background-color: #FF0000;
}

.menu-bar {
	border: none;
    background: none;
}

.header-panel {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center; 
  max-height: 44px;
 }
 
 .ui-menu .ui-menuitem-text {
    float: left;
    color: #333;
    text-shadow: none;
}

.menu-position {
	position: fixed;
	z-index: 1000;
	box-shadow: 0 4px 6px -6px #a8a8a8;
}

.padding-top-56 {
	padding-top: 56px;
}

:root {
   --radius: 10px;
   --background-color-gray: #F2F4F6;
   --background-color-white: #fff;
}

.body-background {
	background-color: var(--background-color-gray) !important;
}

.widget-border {
	border-radius: var(--radius) !important;
	border: none;
}

.widget-border-left {
	border-top-left-radius: var(--radius);
	border-bottom-left-radius: var(--radius);
	border: none;
}

.widget-border-right {
	border-top-right-radius: var(--radius);
	border-bottom-right-radius: var(--radius);
	border: none;
}

div[id="form:mainPanel_header"]  {
	background-color: var(--background-color-gray);
}

.card-margin-top {
	margin-top: 16px;
	margin-bottom:20px;
}

.right-panel-equipament {
	padding-left: 34px !important;
}

.form-datatable {
	margin: 4px;
    background-color: var(--background-color-white);
    padding: 0.5em;
}

.button-new {
	border-color: #d7d7d8 !important;
	left: -5px !important;
}

.panelGroup {
	width: 100% !important;
}

.padding-right-none {
    padding-right: 0px !important;
}

.padding-bottom-4px {
	padding-bottom: 4px !important;
}

.monitoring-field {
	width: 86.7%;
}

.tableView table,
.tableView a.ui-datepicker-prev,
.tableView a.ui-datepicker-next {
    display: none;
}

.header-date-filter {
	width: 10%;
}

.header-filter {
	width: 25%;
}

.margin-top-none {
	margin-top: 0rem !important;
}

div[id="userDetailForm:userDetailDialog_modal"]  {
	z-index: 999 !important;
}

.spinner-load {
    font-size: 20px;
    color: black;
}

.overflow-scroll {
	overflow: scroll !important; 
}

.last-update-date-time {
    font-weight: bold;
}

.link_monitor_outputLabel{
	cursor: pointer;
}

.recaptchaAssociationPtts{
	width:100%;
	justify-content: center;
}

.toolbarGroupAssociationPtts{
	margin-bottom: 8px;
}

.dashboardSessionTitle {
	font-size: xx-large;
    font-weight: bold;
}

.nextUpdatePanel {
	position: absolute;
    right: 0;
    font-weight: bold;
}

.nextUpdateTimer {
	background-color: inherit !important;
}

.info-alert-title {
	color: rgba(0, 0, 0, 0.75);
}

.info-alert-subtitle {
	font-size: 12px;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.6);
}

.info-alert-text {
	font-size: 18px;
	font-weight: bold;
	color: rgba(0, 0, 0, 0.75);
}

.footer-info-alert-title {
	font-size: 14px;
	font-weight: bold;
	color: rgba(0, 0, 0, 0.75);
}
.footer-info-alert-text {
	font-size: 14px;
	font-weight: bold;
	color: rgba(0, 0, 0, 0.6);
}

.footer-info-alert {
	display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.chart-content-panel-group {
	height: 50vh;
}

.chart-element-panel-group {
	width: 100%;
	height: 100%;
}

.plaza-title-margin {
	display: block;
	margin-bottom: 6px;
}

.meteorology-table-image {
	width: 24px;
	height: 24px;
}

.center-and-wrap-mobile {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center; 
	gap: 2px;
}
@media (max-width: 576px) {
  .center-and-wrap-mobile {
    justify-content: flex-start;
  }

}

.legends-flex{
	display: flex;
	justify-content: center; 
	align-items: center; 
	gap: 20px;
	padding: 10px;
}

.center-and-wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center; 
	gap: 2px;
}

@media ( max-width : 768px) {
	.floodingListPanel {
		max-height: 50vh;
		margin-bottom: 20px;
	}
	.floodingsListBox {
		width: 100% !important;
		margin-top: 20px !important;
	}
}

@media ( min-width : 768px) {
	.floodingListPanel {
		min-height: 74vh;
	}
	.floodingsListBox {
		width: 97% !important;
		float: right;
	}
	.floodingsListBox>.ui-selectlistbox-listcontainer {
		height: 600px !important;
	}
}

.floodingsListBox {
	height: 100%;
	padding: 0px !important;
	overflow: auto;
	border: 0px !important;
}

.floodingsListBox>.ui-selectlistbox-filter-container {
	padding: 5px;
}

.floodingsListBox>.ui-selectlistbox-filter-container>.ui-icon {
	top: 9px;
	right: 10px;
}

.floodingListBoxImg {
	padding: 5px;
	margin: auto;
	display: block;
}

.floodingListBoxInfo {
	padding: 5px;
}

.floodingListBoxItem {
	padding: 1px 0px;
}

.variableChartFiltersGroup {
	display: flex;
	justify-content: flex-start;
    align-items: flex-end;
    flex-wrap: wrap;
}

.variableChartFiltersGroup:nth-child(2) {
	margin-bottom: 10px;
}

.alignBottom {
	float: left;
}

.redirect-link a:hover {
	text-decoration: underline !important;
}

.forwardingObjectField {
	width: 100%;
	box-sizing: border-box;
	padding: .5em;
}

@media (min-width: 720px) {
 	.forwardingObjectField {
		width: 50%;
		box-sizing: border-box;
		padding: .5em;
	}
}

.forwardingGridPanel {
	display: grid;
	grid-template-columns: repeat(auto-fit,minmax(160px, 1fr));
	width: 100%;
	gap: 8px;
	padding: .5em;
	box-sizing: border-box;
}

.forwardingGridChildren {
	width: 100%;
	box-sizing: border-box;
	height: auto;
}

.isForwardingFilter {
	width: 90% !important;
	text-align: center;
}

svg.ui-icon {
	background-image: none !important;
}

.firmwareUploadPanel {
	width: 447px;
	margin-top: 10px;
}

.firmwareUploadPanel .ui-panel-title {
	font-size: 13px !important;
}