﻿input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	/*border: 1px solid green;*/
	-webkit-box-shadow: 0 0 0px 1000px transparent inset;
	transition: background-color 5000s ease-in-out 0s;
}

/* width */
::-webkit-scrollbar {
	width: 15px;
}

/* Track */
::-webkit-scrollbar-track {
	background-color: transparent;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: var(--color-bg-b-3);
	border-radius: 10px;
}

	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
		background: var(--color-bg-b-1);
	}

@media only screen and (max-width: 767px) {
	#bs-example-navbar-collapse-1 {
		background: linear-gradient(to bottom, var(--color-bg-b-2) 0%, var(--color-bg-b-1) 100%);
		border-color: var(--color-bg-b-2) !important;
	}
}

body {
    font-family: 'Oxygen', 'Open Sans', sans-serif;
}

.newAccountButton {
	border: 2px solid white;
	padding: 9px 30px 0 30px;
	border-radius: 50px;
	color: white;
}

	.newAccountButton p {
		font-weight: bold;
		letter-spacing: 3px;
	}

.margin_top {
	margin-top: 5em;
	margin-left: auto;
	margin-right: auto;
}

.custom-titolo {
	margin: 40px;
	text-align: center;
	color: rgb(0,118,130);
}

:root {
    --base-color: #15616b;
    --color-bg-b-1: #15616b;
    --color-bg-b-2: #1a8b97;
    --color-bg-b-3: #6ca9b3;
    --color-bg-b-4: #a0c0c6;
    --small-tile-text: #297d88;
    --color-tile-shock: var(--color-bg-b-1); /*var(--color-bg-b-2);*/
    --color-tile-alarm: var(--color-bg-b-2); /*#3ab5b0;*/
    --color-tile-inactive: var(--color-bg-b-3); /*#a8dad8;*/
    --color-glyph-help: var(--color-bg-b-3);
    --color-h2: var(--color-bg-b-2);
    --color-loader: var(--color-bg-b-2);
    --color-form-title: #297d88;
    --color-button: var(--color-bg-b-2);
    --color-text-button: #FFFFFF;
    --color-selected-row: #009688;
    --color-label: #297d88;
    --color-mybtn-hover: var(--color-bg-b-2);
    --color-mybtn: #3ab5b0;
    --gradient-primary-dark: #1c7871;
    --gradient-primary: #198176;
    --gradient-primary-light: #249f92;
    --gradient-light: #ffffff;
    --color-critical-warning: #cc0404 !important;
    --color-dark-grey: #b7b6b6;
    --color-light-grey: #f3e7e7;
}


.center-this {
	margin: 0 auto;
}


/*GESTIONE FONT*/
li {
	list-style-type: none;
	font-size: 12px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
}

h1 {
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 600;
	/*line-height: 24px;*/
}

h2 {
	/*width: 175px;
    height: 41px;*/
	font-size: 30px;
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: left;
	color: var(--color-h2) !important;
	width: auto;
	margin-top: 1vh;
}

h3 {
	font-size: 18px;
	font-style: normal;
	font-variant: normal;
	font-weight: 600;
	color: var(--color-h2) !important;
	/*line-height: 18px;*/
}

h4 {
	font-size: 18px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	/*line-height: 16px;*/
}

h5 {
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	/*line-height: 8px;*/
}

h6 {
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	/*line-height: 8px;*/
}

a:hover {
	text-decoration: none !important;
}

a div {
	text-decoration: none !important;
}


label.btn.btn-primary.toggle-on {
	background-color: var(--color-button);
	border-color: transparent;
}


label, legend {
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	color: var(--color-label) !important;
}


.text_center {
	/*vertical-align: middle;
    text-align: center;*/
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

p {
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}

blockquote {
	font-size: 17px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}

pre {
	font-size: 11px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}

/* GESTIONE COLORI*/
.font_white {
	color: white !important;
}

.font_red {
	color: red !important;
}

.font_black {
	color: black;
}

.font_grey {
	color: #757575;
}

.font_grey_light {
	color: #9e9e9e
}

.font_b1 {
	color: #15616B;
}

.font_b2 {
	color: #1A8B97;
}

.font_b3 {
	color: #6CA9B3;
}

.font_b4 {
	color: #A0C0C6;
}

.font_r1 {
	color: #A03B3C;
}

.font_r2 {
	color: #D2473C;
}

.bg_b1 {
    /*background-color: var(--color-bg-b-1);*/
    background: linear-gradient(to bottom, var(--color-bg-b-2), var(--color-bg-b-1));
}

.bg_b2 {
    background-color: var(--color-bg-b-2);
}

.bg_b3 {
    /*background-color: var(--color-bg-b-3);*/
    background: linear-gradient(to top, var(--color-bg-b-2), var(--color-bg-b-1));
}

.bg_b4 {
	background-color: var(--color-bg-4);
}

.bg_r1 {
	background-color: #a03b3c;
}

.bg_r2 {
	background-color: #d2473c;
}

.myBtn {
	display: inline-block;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	cursor: pointer;
	padding: 9px 80px;
	border: none;
	-webkit-border-radius: 37px / 32px;
	border-radius: 37px / 32px;
	color: rgba(255,255,255,0.9);
	-o-text-overflow: clip;
	text-overflow: clip;
	background: var(--color-mybtn);
	-webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
	box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2);
	text-shadow: -1px -1px 0 rgba(15,73,168,0.66);
	-webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
	-moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
	-o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
	transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
	margin: 3px;
}

	.myBtn:hover {
		background: var(--color-mybtn-hover);
		text-decoration: none;
	}

.btn-ubi {
	font: 14px 'Roboto Medium', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
	color: white;
	text-transform: uppercase;
	border-style: unset;
	padding: 8px 25px 8px 25px;
	border-radius: 2px;
	background-color: var(--color-button) !important;
	-moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
	-webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
	box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
}

	.btn-ubi:hover {
		color: white;
	}

	.btn-ubi:focus {
		color: white;
		outline: none!important;
	}

:not(div.toggle-group) .btn {
	background-color: var(--color-mybtn) !important;
	border: none !important;
	transition: color .30s ease-in-out,background-color .30s ease-in-out,border-color .30s ease-in-out,box-shadow .30s ease-in-out
}

:not(div.toggle-group) .btn:hover {
	background-color: var(--gradient-primary) !important;
	border: none !important;
}

label.toggle-on {
	color: white !important;
}

label.toggle-off {
	color: black !important;
}
/*OMBREGGIATURA*/
.shadow_box {
	box-shadow: 5px 5px 5px #cccccc;
}
.shadow_box_footer {
    box-shadow: 5px -5px 5px #cccccc;
}
.dxbButton_Material, .dxbButtonSys, .dxbTSys, .dxb {
	background-color: var(--color-button) !important;
}

a.dxbButton_Material, a.dxbButtonSys, a.dxbTSys, a.dxb {
	background-color: transparent !important;
	color: var(--color-button) !important;
}

dxeListBoxItem_Material dxeListBoxItemSelected_Material {
	background-color: var(--color-button) !important;
}
/*FOOTER*/
#footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 50px;
	display: flex;
	align-items: center;
}

#footer_text {
	width: 30em;
	height: 7px;
	font-size: 13px;
	font-weight: 500;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	color: white !important;
}

#wrap {
	position: absolute;
	left: 0px;
	width: 100%;
	bottom: 54px;
	top: 78px;
	overflow-y: auto;
}

.Profile-name {
	font-size: small;
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: 0.6px;
	text-align: left;
	color: white;
	/*color: #ffffff;*/
}

.job-role {
	font-size: small;
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: 0.5px;
	text-align: left;
	color: white;
	/*color: #ffffff;*/
}

/*ELEMENTI HOMEPAGE*/
.tile_text {
	width: 100%;
	height: 112px;
	/*font-size: 82px;*/
	font-size: 4vw;
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: center;
	vertical-align: middle;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
}

.tile_type {
	width: 189px;
	height: 22px;
	font-size: 16px;
	font-weight: 500;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: center;
	vertical-align: middle;
	color: #ffffff;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1.5em;
}

.small_tile_text {
	width: 80%;
	height: 55px;
	/*font-size: 40px;*/
	font-size: 5vw;
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: center;
	color: var(--small-tile-text);
	display: inline-block;
	margin-left: auto;
	margin-right: auto;
}

.small_tile_tot {
	width: 23.8px;
	height: 19px;
	font-size: 14px;
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: 0.6px;
	text-align: left;
	color: #9e9e9e;
	display: inline-block;
}

.small_tile_type {
	width: 189px;
	height: 22px;
	font-size: 16px;
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: center;
	color: #9e9e9e;
	/*width:20em;*/
	margin-left: auto;
	margin-right: auto;
}

.line {
	width: 0px;
	height: 68px;
	border: solid 1px #9e9e9e;
}

.tile {
	width: 234.2px;
	height: 234.4px;
	background-color: #1a8b97;
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12);
}

.tile-shock {
	width: 234.2px;
	height: 234.4px;
	background-color: var(--color-tile-shock);
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12);
}

.tile-alarm {
	width: 234.2px;
	height: 234.4px;
	background-color: var(--color-tile-alarm);
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12);
}

.tile-inactive {
	width: 234.2px;
	height: 234.4px;
	background-color: var(--color-tile-inactive);
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.12);
}

.Line {
	width: 0px;
	height: 68px;
	border: solid 1px #9e9e9e;
}

input[type=checkbox] {
	-webkit-appearance: checkbox;
}


input:focus, .dxh0, .dx-state-focused {
	border-color: var(--color-selected-row) !important;
}

.dx-state-hover {
	border-color: var(--color-bg-b-4) !important;
}

.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date, .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date {
	box-shadow: inset 0px 0px 0px 1px var(--color-selected-row), inset 0px 0px 0px 1000px var(--color-selected-row) !important;
}

.dx-icon-chevronright, .dx-icon-chevronleft {
	color: var(--base-color) !important;
}

.loader {
	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid var(--color-bg-b-2);
	width: 120px;
	height: 120px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
	margin: 0 auto;
}

@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/*tabelle*/
.dx-datagrid {
	font-size: 14px !important;
	width: 100% !important;
}

.dx-datagrid-headers .dx-row:first-child {
	color: black !important;
	height: 53px !important;
}

.dx-datagrid .dx-data-row {
	height: 53px !important;
	vertical-align: middle !important;
}

.dx-datagrid .dx-row-alt {
	background-color: #F5F5F5 /*!important*/;
}

div .dx-datagrid-pager .dx-pages {
	float: left !important;
}

.dx-datagrid-filter-row,
.dx-datagrid-filter-row .dx-editor-cell {
	background-color: #F5F5F5;
}

.dx-datagrid-rowsview .dx-selection.dx-row > td, .dx-datagrid-rowsview .dx-selection.dx-row:hover > td {
	background-color: var(--color-selected-row) !important;
	color: white !important;
	font-weight: 500 !important;
}

.dxpLite_Material .dxp-current {
	background-color: var(--color-selected-row) !important;
}
/*class="dxWeb_edtCheckBoxChecked_Material dxICheckBox_Material dxichSys dx-not-acc"*/
.dxICheckBox_Material .dxichSys .dx-not-acc .dxWeb_edtCheckBoxChecked_Material {
	background-color: var(--color-selected-row) !important;
}
/*listviews*/
.dxeListBoxItemSelected_Material, .dxeListBoxItemHover_Material.dxeListBoxItemSelected_Material {
	background-color: var(--color-selected-row);
}

.dxeButtonEditButtonHover_Material, .dxeSpinIncButtonHover_Material, .dxeSpinDecButtonHover_Material, .dxeSpinLargeIncButtonHover_Material, .dxeSpinLargeDecButtonHover_Material {
	background-color: var(--color-selected-row);
}
/*datetime pickers*/
.dxeCalendarHeader_Material, .dxeCalendarHeader_Material dxeDETSH {
	background-color: var(--color-selected-row);
}

.dxeCalendarButtonHover_Material {
	background-color: var(--color-selected-row);
	color: white !important;
}

.dx-checkbox-checked .dx-checkbox-icon {
	color: var(--color-bg-b-1) !important;
}

.dx-checkbox.dx-state-readonly .dx-checkbox-icon {
	border-color: transparent !important;
	background-color: transparent !important;
}

a.dx-link {
	color: var(--color-label) !important;
	text-decoration: none !important;
	font-family: Roboto Regular, Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif;
	font-style: normal;
	font-weight: 600;
}


.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

	.inputfile + label {
		color: white !important;
		background-color: var(--color-button) !important;
		display: inline-block;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		letter-spacing: 0.1em;
		font: 14px Roboto Medium, Helvetica, "Droid Sans", Tahoma, Geneva, sans-serif;
		padding: 6px 13px 4px;
		border: 1px dotted transparent;
		border-radius: 3%;
	}

.modal {
	z-index: 3000 !important;
}

.modal-title {
	font-size: 14px;
	text-align: center
}

td[role=gridcell] > div > img {
	object-fit: scale-down;
}

#helpModal li {
	list-style-type: disc;
	font-size: inherit;
}




#bs-example-navbar-collapse-1 a,
.navbar-brand > a {
    transition: all .2s ease-in-out;
    animation-duration: 2s;
    margin-right: 1em;
	cursor: pointer;
}

/*#bs-example-navbar-collapse-1 > ul > li > a:hover,
    .navbar-brand > a:hover {
        transform: scale(1.05);
    }*/

/*#bs-example-navbar-collapse-1 li:first-child > a:focus,
    .navbar-brand > a:focus {
        -webkit-animation: pressNav 0.5s linear;
        animation: pressNav 0.3s linear;
    }*/

@-webkit-keyframes pressNav {
    0% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    50% {
        -webkit-transform: scale(1.00);
        transform: scale(1.00);
    }

    100% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
}

@keyframes pressNav {
    0% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    50% {
        -webkit-transform: scale(1.00);
        transform: scale(1.00);
    }

    100% {
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
}

#logout,
#guide,
#register_new_account {
    background: transparent;
}

    #logout span,
    #guide span,
    #register_new_account span {
        /*width: fit-content;*/
        display: inline-block;
    }

        #logout span:after,
        #guide span:after,
        #register_new_account span:after {
            content: '';
            width: 0px;
            height: 2px !important;
            display: block;
            background: black;
            transition: 500ms;
        }

    #logout:hover span:after,
    #guide:hover span:after,
    #register_new_account:hover span:after {
        width: 100%;
        height: 2px !important;
    }

li.dropdown a[aria-expanded="false"] ~ .dropdown-menu {
    width: 0;
    min-width: 0;
    display: block !important;
    transition: 0.3s;
}

li.dropdown a[aria-expanded="true"] ~ .dropdown-menu {
    transition: 0.3s;
    width: 100%;
    min-width: 100%;
}
/*li.dropdown a ~ .dropdown-menu {
    display: block;
    box-shadow: none;
    -webkit-box-shadow: none;
    padding: 0;
}

    li.dropdown a ~ .dropdown-menu li:first-child{
        padding-top: 5px;
    }
    li.dropdown a ~ .dropdown-menu li:last-child {
        padding-bottom: 5px;
    }

li.dropdown a[aria-expanded="false"] ~ .dropdown-menu {
    border: 0;
    max-height: 0;
    overflow: hidden;
    transition: max-height 1s;
}

li.dropdown a[aria-expanded="true"] ~ .dropdown-menu {
    border: solid 1px #cccccc;
    transition: border-width 2s ease-out;
    max-height: 60px;
    overflow: hidden;
    transition: max-height 0.6s;
}*/

.shadow_box_nav {
    /*box-shadow: 5px 0 5px #cccccc;*/
    box-shadow: 10px 0 8px -5px #cccccc;
}


    .shadow_box_nav > nav {
        border-top: 1px solid #ccc !important;
        border-bottom: 1px solid #ccc !important;
    }

.sidebar-nav li a:hover {
    background-color: var(--color-bg-b-2);
}

a.dx-link{
	cursor: pointer!important;
}
	a.dx-link:hover, a:hover, span.glyphicon:hover {
		cursor: pointer !important;
		color: var(--color-bg-b-3) !important;
	}