@CHARSET "UTF-8";

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	outline: 1px solid blue;
	outline: none;
}

.modal-backdrop{
	position:fixed;
}

@media ( max-width :400px) {
	body {
		font-size:10pt;
	}
}

body {
	/*background: white url("/resources/images/bg.jpg") repeat-x left top	scroll;*/
	overflow-x: hidden;
	overflow-y: auto;
	padding-bottom: 1em;
}

legend {
	font-size:1.5em;
}


a, a:hover, a:active, a:focus, a:visited {
	outline: none;
	text-decoration: none;
}

.glyphicon-menu-hamburger{
	cursor:pointer;	
}

.form-control:focus {
	border-color: #829B8F;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active,
	.btn-primary.active, .open>.dropdown-toggle.btn-primary {
	color: #fff;
	background-color: #829B8F;
	border-color: #38855D;
}

.modal-backdrop.in {
	filter: alpha(opacity = 15);
	opacity: .15;
}

.modal-header button span {
	font-size: 2em;
	line-height: 0.5em;
}

.progress-bar {
	color: #333;
}

#DConnect-header-logo {
	position: absolute;
	top: 5px;
	left: 5px;
	height: 130px;
	width: 500px;
	max-width:90%;
}

.form-control {
	position: relative;
	font-size: 1em;
	height: auto;
	padding: 10px;
}

#signin-header {
	position: relative;
	top: 0;
	/*right: -225px;*/
	width: 100%;
}

#signin-logo {
/*	margin: auto;
	margin-top: -60px;*/
	margin:-30px auto -50px auto;
}

.login-form {
	margin: auto;
	width: 65%;
}

form[role=login] {
	color: #5d5d5d;
	margin: 15px 0 0 0;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #E6E6E6;
	padding: 1em 2em;
}

.modal-content {
	background-color: #E6E6E6;
}

form[role=login] img {
	display: block;
	margin: 0 auto;
	margin-bottom: 35px;
}

input, button, select {
	margin: 16px 0;
}

input, button, .btn {
	font-size: 1.2em;
}

.btn .glyphicon {
	font-size: 14px;
	line-height:2.2em;
}

input, .form-control, .form-control[disabled], .form-control[readonly],
	fieldset[disabled] .form-control, .intl-tel-input .country-list {
	background-color: #C4C4C4;
	border: 2px inset white;
}

input, .intl-tel-input .country-list {
	color: black;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control
	{
	color: #666;
}

form[role=login]>div {
	text-align: center;
}

.intl-tel-input .country-list {
	border-radius: 3px;
}

.form-links {
	text-align: center;
	margin-top: 1em;
	margin-bottom: 50px;
}

.form-links a {
	color: #fff;
}

div.content-panel {
	margin: 0;
}

@media ( min-width :600px) {
	div.content-panel {
		margin: 0 3em;
	}
}

.top-bar {
	height: 150px;
	background: none;
	border-bottom: 10px solid #00341C;
}

@media ( min-width :1300px) {	
	div.content-panel, .header-bar-menu-container, .top-bar-container {
		max-width:1280px;
		position:relative;
		margin:0 auto !important;
    }
	legend.alpaca-container-label{
		top:-45px !important;
	}
    
	legend.alpaca-container-label.installation-box-header{
        top:-60px !important;
    }

	.header-bar{
		top:30px !important;
		right: 0 !important;
	}
}

.header-bar-container {
	border-top: 4px solid #808080;
	background-color: #D7D7D4;
	height: 40px;
	text-align: right;
	padding: 3px 3% 0 0;
}

.header-bar a {
	margin-left: 0.5em;
}

.header-bar * {
	vertical-align: middle;
	font-weight: bold;
}

.header-bar-collapser {
	display: block;
	font-size: 1.5em;
	line-height: 1.5em;
}
.header-bar-collapser span {
	padding: 0.1em;
	border: 1px solid #B5B5B5;
}
.header-bar {
	background-color: #D7D7D4;
	padding: 0.5em;
	padding-top: 0.25em;
	border-radius: 3px;
	position:absolute;
	top:190px;
	right:3%;
	z-index:1000;
	display:none;
}
.header-bar a {
	display: list-item;
	text-align: left;
	list-style: none;
	padding-left: 0;
	margin-left: 0 !important;
	margin-bottom: 5px;
}

@media ( max-width :400px) {
	.header-bar-collapser {
		font-size: 2em;
		line-height: 2em;
	}
	.header-bar a {
		font-size: 1.25em;
	}
	.header-bar * {
		vertical-align: bottom;
	}
}

.installation-list {
	text-align: center;
}

.installation-element {
	display: inline-block;
	width: 20em;
	height: 12em;
	margin: 20px 30px;
	padding: 1.5em 1em 1em 1em;
	background-color: #00341C;
	color: white;
	border-radius: 20px;
	text-align: center;
	cursor: pointer;
	border: 1px solid #777;
}

.installation-element .installation-name {
	height: 7em;
	display: block;
	line-height: 1.1em;
	width: 100%;
	float: right;
}

.bootstrap-table {
	margin: 0 3%;
}

.bootstrap-table .pull-left.pagination-detail {
	visibility: hidden;
}

.table-btn {
	display: inline-block;
	width: 100%;
	border: 1px solid #aaa;
	border-radius: 5px;
	text-align: center;
	padding: 0 3px;
}

.dabcs-widget {
	font-size:1.0em;
	height: 8em;
	border: 1px solid #ccc;
	border-radius: 10px;
	text-align: center;
	margin: 5px 0;
	position: relative;
	padding: 2px 3px 0 3px;
}

.dabcs-widget label{
	font-variant: small-caps;
}

div[editable=true] *{
	cursor:pointer;
}

.panel-title {
	font-size:1.25em
}

@media ( max-width :400px) {
	.dabcs-widget label{
		font-size: 1.25em;
	}
}


.widget-img svg {
	height: 3em;
}

.widget-val {
	position: absolute;
	width: 100%;
	bottom: 0;
	padding-bottom: 2px;
	background-color: rgba(222, 222, 222, 0.75);
	border-radius: 0 0 5px 5px;
	font-size: 1.1em;
	color:#00331A;
	white-space:nowrap;
	overflow:auto;
}

.dabcs-widget[widget-modifier=disabled]>div {
	background-color: #bbb;
	opacity: 0.4;
}

.dabcs-widget[widget-modifier=hidden] {
	display: none !important;
}


.dabcs-widget[dum-enum-widget=info]>div {
	background-color: hsla(207, 90%, 70%, 1);
}

.dabcs-widget[dum-enum-widget=info] * {
	color: #000000;
	fill:#000000;
}

.dabcs-widget[dum-enum-widget=error]>div {
	background-color: darkred;
}

.dabcs-widget[dum-enum-widget=alert]>div {
	background-color: #8BC63F;
}

.dabcs-widget[dum-enum-widget=warning]>div {
	background-color: gold;
}

.dabcs-widget[dum-enum-widget=disabled]>div {
	background-color: #BBB;
}

.dabcs-widget[dum-enum-widget=error] * {
	color: yellow;
	fill:yellow;
}

.dabcs-widget[dum-enum-widget=alert] * {
	color: #00331A;
	fill:#00331A;
}

.dabcs-widget[dum-enum-widget=warning] * {
	color: #900000;
	fill: #900000;
}

.dabcs-widget[dum-enum-widget=disabled] * {
	color: #999;
	fill:#999;
}

.dabcs-widget.not-valid-status {
	opacity: 0.3;
}

.dabcs-widget.not-valid-status>div {
	background-color: #bbb;
}

.enum-widget-canvas {
	font-size: 2em;
	font-weight: bold;
	font-family: monospace;
	margin-top: 0.7em;
	color: green;
}

.measure-widget-canvas {
	font-size: 2.5em;
	font-weight: bold;
	font-family: monospace;
	margin-top: 0.5em;
	color: rgb(0, 150, 36);
}

.measure-widget-canvas-warn_hi {
	text-decoration: overline;
	color: red;
}

.measure-widget-canvas-warn_lo {
	text-decoration: underline;
	color: darkred;
}

#show_panel_graph, #show_panel_dum_list {
	margin-left: 5px;
}

.row {
	margin: 0;
}

legend.alpaca-container-label {
	text-align: left;
	line-height: 2em;
	background: none;
	color: #00341C;
	position: absolute;
	top: 150px;
	left: 1em;
	border: none;
	width: auto;
}

@media ( max-width :400px) {
	legend.alpaca-container-label {
		top: 157px;
	}
}

.alpaca-form-button-container {
	padding-right: 2em;
}

form.alpaca-form>.alpaca-field {
	padding: 0;
}

form.alpaca-form>.alpaca-field>div {
	margin: 0 2em;
}

.alpaca-control {
	min-height: 1.5em;
}

.fixed-table-container {
	margin: 0 1em;
}

.list-data-table {
	min-width:100%;
}

#user-list-data-table tr th,.list-data-table tr th {
	background-color: #00341C;
	border: 1px solid #7F7F7F;
	color: white;
	text-align:center;
}

#user-list-data-table tr td,.list-data-table tr td {
	background-color: #D7D7D4;
	border: 1px solid #7F7F7F;
	color: #000000;
	cursor:pointer;
}

#user-list-data-table tr td:first-child, #user-list-data-table tr th:first-child,.list-data-table tr td:first-child, .list-data-table tr th:first-child {
	max-width: 40px;
	width:5%;
}

.fixed-table-container, #user-list-data-table, #user-list-data-table tr td:first-child,
	#user-list-data-table tr th:first-child {
	background-color: transparent;
	border-width: 0;
}

form.alpaca-form>.alpaca-field>div {
	margin: 0 2em;
}

div.bootstrap-table div.fixed-table-toolbar input {
	background-color: white;
	border-radius: 30px;
	border: 1px solid #c1c1c1;
}

legend.alpaca-container-label .glyphicon-edit {
	color: rgb(141, 198, 65);
	cursor: pointer;
	margin-left:5px;
}

#filter-header * {
	margin: 0;
	text-align: center;
}

#filter-header input,#filter-header select {
	background-color:#D7D7D4;
}

#filter {
	text-align:center;
	margin:10px auto;
}

#datetimepicker {
	display: none;
	width: 10em;
	display: inline-block;
	text-align: center;
}

#zoom-factor {
	width: auto;
	display: inline-block;
	text-align: center;
}

#param_panel_graph {
	display: none;
	padding: 0 2em;
}

#param-panel-graph-canvas {
	height: 40em;
	padding: 5px;
	margin: 0.5em 0;
	text-align: center;
	vertical-align: top;
}

#param-panel-graph-canvas canvas {
	width: 105% !important;
	margin-left: -5% !important;
}

#filter-live, #filter {
	padding:0;
}

#filter-live .btn {
	margin : 5px;
}

.modaldumlist {
	display: inline-block;
	width: 100%;
	border: none;
	background-color: #00341C;
	color: white;
	margin-bottom: 1em;
	padding: 1em 0;
	text-align: center;
	border-radius: 10px;
	cursor: pointer;
}

.modalparamlist {
	display: inline-block;
	width: 45%;
	border: none;
	background-color: #00341C;
	color: white;
	margin-left: 2.5%;
	margin-bottom: 0.7em;
	line-height: 2em;
	text-align: center;
	border-radius: 7px;
	cursor: pointer;
}

.dumbox-description {
	display: inline-block;
	padding-left:5px;
}

.dumbox-description label {
	text-transform: uppercase;
	font-size: 1em;
}

.dumbox .dumserial label {
	font-size: 1em;
}

.dumbox-image {
	max-width: 200px;
}

@media ( min-width :481px) {
	.dumbox-image {
		width: 30%;
		display: inline-block;
		margin: 0;
		margin-top: 10px;
		vertical-align: top;
	}
	.dumbox-description {
		width: 69%;
		margin-top: 2em;
	}
}

@media ( max-width :480px) {
	.dumbox-image {
		width: 50%;
		display: block;
		margin: 0 auto;
	}
	.dumbox .dumserial label {
		font-size: 1em;
	}
}

@media ( max-width :320px) {
	.dumbox .dumserial label {
		font-size: 0.85em;
	}
}

.dumbox #status-delta {
	color: #003319;
}

.dumbox #status-delta label {
	text-transform: initial;
	font-size: 1.5em;
	font-weight:normal;
}

.dumbox #status-delta.not-valid-status {
	font-weight: bold;
}

#status-delta-time {
	display: inline-block;
	font-size: 1.5em;
	font-weight: bold;
}

#dumbox-params .panel-group {
	margin-bottom: 5px;
}

#dumbox-params .panel {
	/* border: 1px solid #00331A; */
}

#dumbox-params .panel-heading {
	background-color: #00331A;
	color: white;
	border-radius:5px;
}

a.accordion-toggle {
	width: 100%;
	display: inline-block;
}

input#modal-param-set-value-input{
	text-align:center;
}

select#modal-param-set-value-input option{
	text-align:center;
}

#dum_list legend{
	font-size:1.2em;
	border-bottom: 3px solid #003319;
	text-transform: uppercase;
}

table.dumlist {
	width: 100%;
}

table.dumlist th {
	border-collapse: collapse;
	border: 0px solid #003319;
	border-bottom-width:1px;
	background-color:#003319;
	color: white;
	padding: 5px;
	
}

table.dumlist td {
	border-collapse: collapse;
	border: 0px solid #003319;
	border-bottom-width:1px;
	background-color:white;
	color: #003319;
	padding: 5px;
}

#dum_list_form .alpaca-control {
	background-color: #E2E2E2;
	padding:5px 3px;
	border-radius:3px;
	min-height: 2.3em;
}

#dum_list_form .alpaca-form-buttons-container {
	margin-top: 28px;
	margin-right: 28px;
	margin-bottom: 20px;
	margin-left: 28px;
}

.graphdumlist,.toggler-header {
	display: inline-block;
	width: 100%;
	border: none;
	background-color: #00341C;
	color: white;
	margin-bottom: 1em;
	padding: 1em 0;
	text-align: center;
	border-radius: 5px;
	cursor: pointer;
	-moz-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
}

.graphparamlist_container,.toggler-container{
	display:none;
/*	height:11em;
	overflow:auto;*/
}

.graphparamlist {
	display: inline-block;
	width: 47%;
	margin-left: 2%;
	padding-left:1em;
	margin-bottom: 0.7em;
	line-height: 2em;
	cursor: pointer;
	-moz-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	border: 1px solid #00341C;
	background-color: #00341C;
	color: white;
	text-align: center;
	border-radius: 7px;
}

.graphparamlist .selection-status svg{
	float:right;
	margin:0.2em 0.5em 0 0;
	height:1.5em;
}

.graphparamlist {
	border: none;
	background-color: rgba(0, 52, 28, 0.15);
	color: #00341C;
	text-align: left;
	border-radius: 0;
	box-shadow: none;
}

@media ( max-width :600px) {
	
	.graphparamlist {
		width: 95%;
		margin-left: 2.5%;
	}
}

@media ( min-width :1200px) {
	
	.graphparamlist {
		width: 23.5%;
		margin-left: 1%;
	}
}

.graphparamlist.selected{
	background-color: #c1e099;
	color:white;
}

.graphparamlist .selection-status svg path#check{
	fill:#cccccc;
}

.graphparamlist.selected .selection-status svg path#check{
	fill:red;
}

#param-panel-graph-canvas{
	display:none;
}

ul.trigger-cond{
	list-style-type:none;
	padding:0;
}

ul.trigger-cond>li{
	padding:0.5em;
	margin:0 0.5em 0.5em 0.5em;
	border-radius:3px;
	border:1px solid #aaa;
}

.trigger-cond *{
	cursor:pointer;
}

.trigger-cond span{
	margin-right:0.5em;
}

.trigger-cond b{
	margin-right:0.5em;
}

#triggerEditForm {
	text-align:left;
	padding:0 1em;
}

.triggerFormRow,.triggerFormActionRow {
	margin:0;
	margin-bottom:1em;
}


#triggerEditForm .form-control {
	display:inline-block;
	width:auto;
	margin:0;
}

#triggerDeltaTime .form-control {
	width:3em;
}

.triggerFormActionRow span{
	display:inline-block;
	width:6em;
	text-align:center;
}

.triggerFormActionRow input{
	min-width:70%
}

#triggerEmailBody.form-control{
	width:95%;
	margin:auto;
	height:10em;
}

.graph-div{
	margin-top:1em;
}

svg.xchart{
	overflow:hidden;
}

div[type='enum'] svg.xchart .axisY .tick text{
	text-anchor:start !important;
	font-weight:bold;
	font-size:1em;
}

div[measure-widget-canvas='warn_hi'] svg path, div[measure-widget-canvas='warn_hi'] svg polygon, div[measure-widget-canvas='warn_hi'] svg rect{
	fill:red !important;
}
div[measure-widget-canvas='warn_hi'] .widget-val{
	text-decoration:overline;
}

div[measure-widget-canvas='warn_lo'] svg path, div[measure-widget-canvas='warn_lo'] svg polygon, div[measure-widget-canvas='warn_lo'] svg rect{
    fill:gold !important;
}
div[measure-widget-canvas='warn_lo'] .widget-val{
    text-decoration:underline;
}

.ex-tooltip{
	position:absolute;
	border:1px solid #AAA;
	padding:0.5em 1em;
	color:#333;
	background-color:#DDD;
	display:none;
	margin:10px;
	border-radius:5px;
	text-align:center;
}

.accordion-toggle .glyphicon-triangle-bottom{
	display:none;
}
.accordion-toggle .glyphicon-triangle-top{
	display:initial;
}
.accordion-toggle.collapsed .glyphicon-triangle-bottom{
	display:initial;
}	
.accordion-toggle.collapsed .glyphicon-triangle-top{
	display:none;
}

#render-graph-button{
	padding: 10px;
	position: fixed;
	top: 200px;
	border: 1px solid #00341C;
	border-radius: 5px;
	background-color: white;
}

#render-graph-button:disabled{
	cursor: not-allowed;
}

#filter-live{
	text-align:center;
	margin:10px auto;
}

#filter-live .btn{
	border: 1px solid #00341C;
	border-radius: 5px;
	background-color: white;
	display:inline-block;
}

.xchart .color0 .fill {
    fill: hsla(152,100%,10%,0.2);
}

.xchart .color0 circle {
    fill: rgba(0, 52, 28, 0);
    stroke-width: 1px;
    r:5px;
}

.xchart .color0 .line {
	stroke: #00341C;   
	
}

.xchart .color0.comp .fill {
    fill: rgba(255,128,0,0.2);
    display: initial;
}

.xchart .color0.comp .line {
	display:none;
}

#param-panel-graph-canvas-container {
	position:relative;
}

#graph-right-arrow{
	font-size:5em;
	color:rgba(0, 52, 28, 0.12);
	cursor:pointer;
}
#graph-left-arrow {
	font-size:5em;
	color:rgba(0, 52, 28, 0.12);
	cursor:pointer;
}

@media (max-width : 581px) {
	#add-graph,
	#live-graph,
	#csv-graph,
	#zoom-factor,
	#datetimepicker {
		width: 100%;
		margin: 5px;
	}

	#param-panel-graph-canvas-container {
		margin-top: 10px;
	}

	#filter-live, #filter {
		margin: 0;
	}
}

.dumbox-header .dumserial .glyphicon-pencil{
	cursor:pointer;
}

input[type="radio"], input[type="checkbox"] {
    width: 1em;
    display: inline-block;
}

.login-form .btn{
	margin:10px 0;
}

.dumbox-description label{
	font-weight:normal;
}

.configuration-modal{
	width:80%;
}

.configuration-modal div[data-schemapath='root.metadata'] .json-editor-btn-edit[title='Edit JSON'] {
    display: none !important;
}

#configuration-list-data-table td{
	cursor:pointer;
}


#configuration-modal .btn{
	font-size:10pt;
	line-height: 1em;
}

#configuration-modal button,#configuration-modal input,#configuration-modal select{
	margin:2px;
}

#configuration-modal button{
	padding: 0 1em;
}

#configuration-modal .btn-group .form-control{
	font-size:0.5em;
}

#configuration-modal .btn-group, #configuration-modal .btn-group .btn{
	float:right;
}

#param-panel-graph-canvas-container hr{
	border-top: 1px dashed #ccc;
    margin: 1em;
}

#term-list-data-table thead tr th:first-child{
	width:30% !important;
}

#search-input:disabled {
	cursor: not-allowed;
}

/* Documents */
#installation-documents , #installation-contract, #scheduled-report{
	margin-left: 2em;
	margin-right: 2em;
	margin-bottom: 20px;
	margin-top: 40px;
}

#installation-documents > h1 , #installation-contract > h1, #scheduled-report > h1{
	font-size: 1.2em;
	border-bottom: 3px solid #003319;
	text-transform: uppercase;
	margin-bottom: 20px;
}
/* 
#scheduled-report{
	display:none;
} */

.property-selector {
    max-height: 20em !important;
}

/* Style the tab */
.tab {
	overflow: hidden;
	border-bottom: 1px solid #ccc;
  }
  
  /* Style the buttons that are used to open the tab content */
  .tab button {
	background-color: inherit;
	float: left;
	border: 1px solid #ccc;
	border-bottom-width: 0px;
	outline: none;
	cursor: pointer;
	padding: 14px 16px;
	transition: 0.3s;
	margin:0 2px;
	border-radius:10px 10px 0 0;
  }
  
  /* Change background color of buttons on hover */
  .tab button:hover {
	background-color: #ddd;
  }
  
  /* Create an active/current tablink class */
  .tab button.active {
	/*background-color: #ccc;*/
	color:white;
	background-color:#003319;
	font-weight: bold;
  }

.accordionlink{
	display:none;
	width:100%;
	background-color:white;
	color:#003319;
	margin:0;
	border-collapse: collapse;
	border: 1px solid #ccc;
	text-align:left;
	padding-left:1em;
}

@media ( max-width :900px) {
	.accordionlink{
		display:block;
	}
	.accordionlink.active {
		/*background-color: #ccc;*/
		color:white;
		background-color:#003319;
		font-weight: bold;
	}
	#tabbar{
		display:none;
	}
}

.scheduled-report-container-recipient{
	cursor:pointer;
	display:inline-block;
	width:30%
}

@media ( max-width :1200px) {
	.scheduled-report-container-recipient{
		width:50%
	}
}

@media ( max-width :640px) {
	.scheduled-report-container-recipient{
		width:100%
	}
}

#installation_header b{
	height:2em;
	display:inline-block;
}

#installation_header img.installation-svg{
	height:2em;
	display:inline-block;
}

@media ( max-width :900px) {
	#installation_header img.installation-svg{
		display:none;
	}
}

/* Util */

.clickable {
	cursor: pointer;
}

.has-error {
	border-color: red;
}

/* Boostrap 4 */

.d-flex {
	display: flex;
}

.justify-content-between {
	justify-content: space-between;
}

.justify-content-end {
	justify-content: flex-end;
}

.align-items-center {
	align-items: center;
}

.m-0 {
	margin: 0px !important;
}

.ml-1 {
	margin-left: 0.5rem !important;
}

.ml-2 {
	margin-left: 1rem !important;
}

.ml-3 {
	margin-left: 1.5rem !important;
}

.ml-4 {
	margin-left: 2rem !important;
}

.mr-1 {
	margin-right: 0.5rem !important;
}

.mr-2 {
	margin-right: 1rem !important;
}

.mr-3 {
	margin-right: 1.5rem !important;
}

.mr-4 {
	margin-right: 2rem !important;
}

.mt-1 {
	margin-top: 0.5rem !important;
}

.mt-2 {
	margin-top: 1rem !important;
}

.mt-3 {
	margin-top: 1.5rem !important;
}

.mt-4 {
	margin-top: 2rem !important;
}

.mb-1 {
	margin-bottom: 0.5rem !important;
}

.mb-2 {
	margin-bottom: 1rem !important;
}

.mb-3 {
	margin-bottom: 1.5rem !important;
}

.mb-4 {
	margin-bottom: 2rem !important;
}

.p-0 {
	padding: 0px;
}

.p-1 {
	padding: 0.5rem;;
}

.p-2 {
	padding: 1rem;;
}

.p-3 {
	padding: 1.5rem;;
}

.p-4 {
	padding: 2rem;;
}