@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'Roboto';

/*	src:url(../fonts/roboto-regular.woff);*/
	src:url(../fonts/lato-regular.woff);
}
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'Roboto-bold';

/*	src:url(../fonts/roboto-bold.woff);*/
	src:url(../fonts/lato-bold.woff);
}
@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'Fa-regular';

	src:url(../fonts/fa-regular.woff);
}

@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'Fa-solid';

	src:url(../fonts/fa-solid.woff);
}

@font-face {
	font-family: 'themify';
	src:url('../fonts/themify.woff?-fvbane') format('woff');
	font-weight: normal;
	font-style: normal;
}

* {
	font-size: 16px;
	box-sizing: border-box;
}
body {
	margin: 0;
}
.container.order {
	position: relative;
	padding-top: 25px;
}
.container h1 {
	font-size: 24px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 35px;
	font-weight: normal;
}
.container h1 span {
	margin-top: 5px;
	text-transform: none;
	display: block;
}
h2 {
	margin: 0 0 10px 0;
	font-size: 20px;
}
.disable-btn,
.button,
button {
	width: 100%;
	/*max-width: 150px;*/
	padding: 10px 0 10px 0;
	border-radius: 5px;
	border: 0;
	background: #57a11f;
	color: #fff;
	cursor: pointer;
	text-align: center;
}
.button {
	width: auto;
	padding: 10px 15px 10px 15px;
	display: inline-block;
	text-decoration: none;
	text-align: center;
}
.btn-red {
	background: red;
	color: #fff;
}
.disable-btn {
	text-align: center;
	background: grey;
	cursor: initial;
}
.small {
	padding: 5px 10px 5px 10px;
	width: auto;
}
.view,
select,
input {
	border-radius: 3px;
	width: 100%;
	border: 1px solid #666666;
	padding: 10px;
	outline: none;
}
.view {
	padding: 8px;
}
.view.disabled {
	position: relative;
}
.view .padding {
	padding-left: 26px;
}
label {
	display: inline-block;
	vertical-align: middle;
	border: 1px solid #666666;
	height: 27px;
	width: 27px;
	margin-right: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
	cursor: pointer;
}
input:checked ~ label {
	position: relative;
	font-family: 'Fa-solid';
	font-size: 18px;
	color: #57a11f;
}
input:checked ~ label:before {
	position: absolute;
	top: 3px;
	left: 4px;
	content: "\f00c";
}
.main-site {
	position: fixed;
	z-index: 1;
	top: 5px;
/*	left: 5px;*/
	margin-left: -35px;
	padding: 7px;
}
.main-site .fa-home {
	margin: 0;
}
.checkbox input {
	display: none;
}
.block span {
	display: inline-block;
/*	margin-bottom: 4px;*/
}
[class^="fa-"] {
	font-family: 'Fa-solid';
	margin-right: 10px;
}
[class^="fa-re-"] {
	font-family: 'Fa-regular';
	margin-right: 10px;
}
[class^="ti-"], [class*=" ti-"] {
	font-family: 'themify';
	font-size: 20px;
}
.fa-sign-out:before {
	content: "\f2f5";
}
.fa-bolt:before {
	content: "\f0e7";
}
.fa-re-trash:before {
	content: "\f2ed";
}
.fa-extend:before {
	content: "\f1da";
}
.fa-close:before {
	content: "\f00d";
}
.fa-on:before {
	content: "\f204";
}
.fa-off:before {
	content: "\f205";
}
.fa-power:before {
	content: "\f011";
}
.fa-close:before {
	content: "\f00d";
}
.fa-reload:before {
	content: "\f2f1";
}
.fa-urgent:before {
	content: "\f12a";
}
.fa-waiting:before {
	content: "\f251";
}
.fa-re-contact:before {
	content: "\f2c1";
}
.fa-pay:before {
	content: "\f788";
}
.fa-add:before {
	content: "\f067";
}
.fa-settings:before {
	content: "\f013";
}
.fa-re-notifi-on:before {
	content: "\f0f3";
}
.fa-re-notifi-off:before {
	content: "\f1f6";
}
.fa-down:before {
	content: "\f0d7";
}
.fa-up:before {
	content: "\f0d8";
}
.fa-home:before {
	content: "\f015";
}
.fa-people:before {
	content: "\f007";
}
.fa-re-calendar:before {
	content: "\f133";
}
.fa-power-add:before {
	content: "\f0e7";
}
._pay {
	color: #970000;
}
.fp {
	float: right;
	color: #57a11f;
	font-size: 12px;
}
.urgent {
	color: red;
	text-align: center;
	margin-top: 15px;
	background: #FFEEEE;
	padding: 5px 10px 5px 10px;
	border-radius: 4px;
}
.info-transaction {
	font-size: 20px;
}

/*   maintenance   */

.maintenance {
        margin-top: 50px;
        text-align: center;
        font-family: Roboto;
}
.maintenance img {
        max-width: 250px;
        margin-bottom: 50px;
}
.maintenance .title h1 {
        font-family: 'Roboto-Bold';
}
.maintenance span {
        display: inline-block;
        margin-top: 50px;
        font-size: 12px;
}
.msg-maintenance {
        font-size: 13px;
        border-bottom: 1px solid #E2E2E2;
        padding-top: 10px;
        padding-bottom: 17px;

}
.msg-maintenance span {
        color: red;
}
/* *************** */

.langs {
	position: absolute;
	right:  30px;
	display: inline-block;
	float: right;
	/*text-align: right;*/
	z-index: 100;
	text-align: center;
	background: transparent;
}
/*.langs .body {
	position: absolute;
}*/
.langs img {
	/*padding: 2px;*/
	border: 1px solid grey;
	/*margin-right: 2px;*/
	width: 22px;
	
}
.langs .no_active img {
	/*padding: 2px;*/
	border: 1px solid #fff;
	/*margin-right: 2px;*/
}
.langs .active {
	padding: 9px 7px 5px 7px;
	border: 1px solid grey;
	border-radius: 3px;
	margin-bottom: 4px;
	cursor: pointer;
/*	background: transparent;*/
	box-shadow: 0 0 6px #949494;
	background: #fff;
}
.langs .no_active {
	border-radius: 3px;
	padding: 9px 7px 5px 7px;
	background-color: rgba(0, 0, 0, .4);
	margin-bottom: 4px;
	cursor: pointer;
	background-color: #696969;
	border: 1px solid #fff;
}
.langs .no_active {
	display: none;
}
.langs:hover .no_active {
	display: block;
}
.only-loading {
	text-align: center;
}
.only-loading img {
	width: 40px;
}
.popup {
	position: fixed;
	overflow: auto;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 2000;
	background: rgb(0,0,0,0.45);
	text-align: center;
}
.popup:before {
	content: "";
	width: 1%;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}
.popup .body {
	width: 96%;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}
.error {
	border: 1px solid red;
	color: red;
	background: #FCCACA;
}
.success {
	border: 1px solid green;
	color: green;
	background: #C9FFC9;
}
.err {
	border: 1px solid red;
}
.close {
	top: 36px;
	right: 16px;
}
.close span {
	font-weight: bold;
	font-size: 22px;
}
.overflow-hide {
	overflow: hidden;
}
.required:before {
	content: "*";
	color: red;
	margin-right: 5px; 
}
.require-fields:before {
	content: attr(required_fields);
	color: red;
	font-size: 12px;
	float: right;
	margin-top: 10px;
}
.fly-energy-register-form .require-fields:before {
	margin-right: 45px;
}
.info {
	padding: 10px;
	border-radius: 3px;
	border: 1px solid #666666;
	margin-bottom: 15px;
}
.info div span:first-child {
	display: inline-block;
	width: 105px;
	text-align: right;
}
.info div span:last-child {
	font-family: Roboto-bold;
	margin-left: 15px;
}
.block {
	margin-bottom: 10px;
}
.red {
	color: red;
}
.bkg-red {
	background: red;
}
.bkg-grey {
	background: grey;
}
.summary .body,
.legend {
	position: absolute;
	display: inline-block;
	margin-top: 15px;
	padding: 20px;
	border: 1px solid #666;
	text-align: left;
	border-radius: 3px;
	margin-bottom: 30px;
	z-index: 100;
	background: #fff;
	top: 35px;
	left: 0;
	box-shadow: 0 0 15px rgb(0 0 0 / 20%);
}
.legend {
	margin-top: 0;
	display: block;
	top: initial;
}
.summary{
	display: block;
	text-align: left;
}
.summary .body {
	position: relative;
	margin-top: 0;
	margin-bottom: 50px;

}
.summary li {
	list-style: none;
}
.summary li div {
	display: inline-block;
	/*width: 50%;*/
}
.summary li div:first-child {
	min-width: 170px;
}
.summary li div:last-child {
	font-weight: bold;
}
.legend .close {
	top: 10px;
	right: 0;
}
.legend .close span {
	border: 0;
	width: auto;
}
.legend div {
	font-size: 14px;
}
.legend span {
	display: inline-block;
	font-size: 17px;
	border: 1px solid #E2E2E2;
	background: #F6F6F6;
	padding: 5px;
	border-radius: 3px;
	margin-bottom: 8px;
	text-align: center;
	width: 45px;
}
.legend h3,
.summary h3 {
	font-size: 16px;
	margin-top: 0;
}
.legend-info {
	margin-top: 10px;
}
.btn-legend {
	border: 1px solid #57a11f;
	padding: 8px 15px 8px 15px;
	border-radius: 3px;
	cursor: pointer;
	color: #57a11f;
	text-align: center;
}
.pagination div:first-child {
	height: 40px;
}
.btns {
	position: relative;
	text-align: left;
	margin-bottom: 15px;
}
.btns button {
	width: auto;
	padding-left: 15px;
	padding-right: 15px;
	margin-right: 10px;
	position: relative;
}
.dn {
	display: none;
}
.vb {
 	visibility: hidden;
}
.body-disabled {
	position: relative;
}
.disabled {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	background: #d8d8d84d;
	user-select: none;
} 
.notifi {
	display: inline-block;
	margin-top: 5px;
	position: absolute;
	right: 80px;
	cursor: pointer;
	z-index: 100;
}
.notifi span {
	margin: 0;
}
.notifi span::before {
	font-size: 20px;
}
.fa-re-notifi-on {
	color: #57a11f;
}
.fa-re-notifi-off {
	color: red;
}

.push {
	margin-top: 20px;
	padding: 20px;
	border-radius: 25px;
	background-color: rgba(255, 255, 255, .5);
	box-shadow: 0 0 15px rgba(0,0,0, .4);
}
.push h2 {
	color: green;
}
.body-push {
/*		margin-bottom: 15px;*/
	text-align: justify;
}

.push button {
	margin-top: 15px;
	font-family: Roboto-bold;
}

.push .white {
	font-family: Roboto;
	background: rgba(255, 255, 255, .5);
	border: 1px solid #fff;
	color: grey;
/*		margin-left: 25px;*/
/*		width: 50%;*/
}

.btns-push {
	display: flex;
	flex-wrap: wrap;
}

.notifi-blocked {
	font-family: Roboto-bold;
}
.notifi-blocked h2 {
	color: green;
}
.notifi-blocked .body-push {
	margin-bottom: 20px;
	text-align: center;
}
.notifi-blocked .container {
	max-width: 460px;
	padding: 20px;
	border-radius: 25px;
	background: #ABD08F;
}

/* SELECT */
.select {
	position: relative;
}
.select-down {
	position: absolute;
	overflow-x: hidden;
	height: 165px;
	border: 1px solid #666666;
	z-index: 100;
	background: #fff;
	width: 100%;
}
.select-down li {
	padding: 4px;
	list-style: none;
}
.select-down li:hover {
	background-color: #57a11f;
    color: #fff;
    cursor: pointer;
}
.select-down .set {
	background-color: #4a8919;
    color: #fff;
}
.select span {
	font-size: 25px;
	color: #666666;
	padding: 2px;
	cursor: pointer;
	position: absolute;
	top: 45%;
	right: 0;
	line-height: 0;
}
/*.left[tooltip]:hover::before,*/
[tooltip]:hover::before {
	content: attr(tooltip);
	position: absolute;
	top: -25px;
	left: 0;
	color: #000;
	color: #57a11f;
	background-color: #e2ffcd;
	border: 1px solid #57a11f;
	width: max-content;
	padding: 3px;
	z-index: 10000;
	border-radius: 3px;
	padding-left: 7px;
	padding-right: 7px;
	display: inline-block;
	font-size: 13px;
	font-weight: normal;
}
/*.left[tooltip]:hover::before {
	top: 0;
	right: 43px;
	white-space: pre;
}*/
.down[tooltip]:hover::before {
	top: 43px;
/*	white-space: pre;*/
}
.left[tooltip]::before {
	top: 5px;
	right: 30px;
	left: initial;
}
.note-body {
	margin-top: 5px;
	display: block!important;
	width: 100%!important;
}
.note-body span {
	margin: 0!important;
	display: inline-block;
}
.note-body .note-info {
	font-size: 12px;
}
.note-body .note-ico {
	color: red;
	font-size: 12px;
	margin-right: 5px!important;
}
.group {
	position: relative;
}
.group div {
	width: 100%;
	display: inline-block;
}
.group > div:first-child {
	margin-bottom: 10px;
}
table {
	width: 100%;
	border-collapse: collapse;
}
table th {
	text-align: left;
	border: 1px solid #F0F0F0;
	padding: 7px 10px 7px 10px;
	white-space: nowrap;
	border-radius: 3px;
}
table th div {
	display: inline-block;
	vertical-align: middle;
}
table th div:first-child {
	width: calc(100% - 18px);
}
table th div:last-child {
	width: 18px;
	margin-left: 5px;
}
table th div:last-child span{
	display: block;
	color: #E5E5E5;
}
table th div:last-child span:hover {
	cursor: pointer;
	color: #57a11f;
}
table td {
	padding: 7px;
	text-align: left;
	white-space: wrap;
}
table td button {
	display: inline-block;
}
table tbody tr:nth-child(2n) td {
	background: #F0F0F0;
}
table thead {
/*		position: absolute;*/
	float: left;
	background: #fff;
	z-index: 100;
}
table thead th {
	height: 55px;
}
table thead tr {
	display: flex;
	flex-direction: column;
/*		height: 605px;*/
}
table tbody tr {
	display: flex;
	flex-direction: column;
/*		width: calc(100% - 136px);*/
/*		margin-left: 136px;*/
/*		float: right;*/
}
table tbody tr td {
	display: flex;
	align-items: center;
}
table tbody tr td {
	height: 55px;
}
table tbody {
	overflow: hidden;
/*		height: 605px;*/
	display: block;
/*		pointer-events: none;*/
}
table tbody .btns {
	margin-top: 0!important;
}
table tbody .btns span {
	margin-bottom: 0!important;
}
table th div span.sort {
	color: #57a11f;
}
table tbody tr td.error {
	color: red;
	background: #fff;
	border: none;
}	
td .btns {
	margin: 0;
	text-align: center;
}
td .btns div {
	display: inline-block;
}
td .btns span {
	display: inline-block;
	border-radius: 5px;
	padding: 10px;
	text-align: center;
	/*height: 38px;*/
	background: #fff;
	cursor: pointer;
	margin-right: 5px;
	border: 1px solid #E2E2E2;
}
td .btns .no-action-blk,
td .btns .no-action {
	cursor: initial;
	color: red;
	cursor: help;
}
td .btns .no-action-blk {
	color: black;
}
td .btns .no-action span {
	font-family: Roboto;
	cursor: initial;
	margin: 0;
	padding: 0;
	padding-left: 5px;
	border: none;
	cursor: help;
}
td .btns .no-action:hover,
td .btns .no-action span:hover {
	color: red;
}
td .btns .no-action-blk:hover {
	color: black;
}
td .btns span:hover {
	color: #57a11f;
}
td .btns .fa-close {
	font-size: 18px;
	padding: 8px 10px 10px 10px;
}
/* ****** */

/* DatePicker */
.dp__calendar_header_separator {
	margin-bottom: 2px;
}
.dp__calendar_row {
	margin: 2px!important;
}
.dp__selection_preview,
.dp__button {
	display: none!important;
}
.dp__action_row {
	justify-content: flex-end;
	padding-top: 0!important;
}
/* ********** */

@media (min-width: 560px) {
	.btns-push {
		flex-wrap: nowrap;
	}
	.push .white {
		margin-left: 25px;
		width: 50%;
	}
	.main-site {
		margin-left: -55px;
	}
	.group > div {
		width: 49%;
	}
	.group > div:first-child {
		margin-bottom: 0;
	}
	.group {
		display: flex;
		justify-content: space-between;
	}

}

@media print, (min-width: 780px) {
	table thead {
		float: none;
	}
	table thead tr {
		display: table-row;
		height: auto;
	}
	table tbody {
		overflow: auto;
		height: auto;
		display: table-row-group;
	}
	table tbody tr {
		display: table-row;
	}
	table tbody tr td {
		display: table-cell;
	}
}

@media print {
	.fly-energy-orders-table .sign-out,
	.fly-energy-orders-table .settings,
	.fly-energy-orders-table .btns.main,
	.fly-energy-orders-table .mini-filters {
		display: none;
	}
}