@font-face {
	font-family: 'exlogfont';
	src: url('../Font/fontawesome-webfont.eot?v=4.4.0');
	src: url('../Font/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'),
		url('../Font/fontawesome-webfont.woff2?v=4.4.0') format('woff2'),
		url('../Font/fontawesome-webfont.woff?v=4.4.0') format('woff'),
		url('../Font/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
		url('../Font/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

selector:-webkit-full-screen {
	display: block;
	/* Affiche l'élément seulement en plein écran */
}

selector {
	display: none;
	/* Dans les autres cas, cache l'élément */
}

/* My CSS*/
body,
div,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
dl,
dt,
dd,
img,
form,
fieldset,
input,
textarea,
blockquote {
	border: 0 none;
	margin: 0;
	outline: medium none;
	padding: 0;
}

body {
	background: none repeat scroll 0 0 #FFFFFF;
	color: #666666;
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
	font-size: 14px;
}

html,
body {
	height: 100%;
	/*min-height: calc(100vh + 60px);*/
	width: 100%;
	margin: 0;
	padding: 0;
	/*overflow: hidden;*/
}

p {
	margin: 0 0 30px;
}

h2 {
	font-size: 26px;
	font-weight: normal;
	margin: 0 0 20px;
}

h2.header {
	background: none repeat scroll 0 0 #F6F7FA;
	margin: 0 0 50px;
	padding: 12px 9px 12px 0;
	position: relative;
}

h2.header:before {
	background: none repeat scroll 0 0 #F6F7FA;
	content: "";
	display: block;
	height: 53px;
	left: -300%;
	position: absolute;
	top: 0;
	width: 300%;
}

h3 {
	font-size: 22px;
	font-weight: normal;
	margin: 0 0 10px;
}

h3.header {
	background: none repeat scroll 0 0 #F6F7FA;
	margin: 0 0 20px;
	padding: 12px 9px 12px 0;
	position: relative;
}

h3.header:before {
	background: none repeat scroll 0 0 #F6F7FA;
	content: "";
	display: block;
	height: 54px;
	left: -300%;
	position: absolute;
	top: 0;
	width: 300%;
}

h4 {
	font-size: 20px;
	font-weight: normal;
	margin: 0 0 10px;
}

h5 {
	font-size: 12px;
	font-weight: normal;
	margin: 0 0 3px;
}

h6 {
	font-size: 13px;
	font-weight: normal;
	margin: 0 0 3px;
}

ul,
ol {
	list-style-position: inside;
	margin: 0 0 5px;
}

a {
	color: #7B8A9E;
	text-decoration: none;
}

a:hover {
	color: #3D526E;
}

select {
	padding: 3px 30px 3px 3px;
	margin: 0;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
	-moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
	box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
	background: #f8f8f8;
	font-weight: bold;
	color: #615f5f;
	border: none;
	outline: none;
	display: inline-block;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	cursor: pointer;
}



label.lblforcombo {
	position: relative
}

label.lblforcombo:after {
	content: '<>';
	font: 11px "Consolas", monospace;
	color: #aaa;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	right: 8px;
	top: 2px;
	padding: 0 0 2px;
	border-bottom: 1px solid #ddd;
	position: absolute;
	pointer-events: none;
}

label.lblforcombo:before {
	content: '';
	right: 6px;
	top: 0px;
	width: 20px;
	height: 20px;
	background: #f8f8f8;
	position: absolute;
	pointer-events: none;
	display: block;
}

[disabled] {
	/* Text and background colour, medium red on light yellow */
	color: #933 !important;
	background-color: #ffc !important;
}

[archived] {
	color: #933;
	background-color: #ffc;
}

[ghost] {
	color: #fb8205;
	background-color: #c5c5c5;
}

[logging] {
	color: #0518fb;
	font-weight: bold;
}

.hidden {
	display: none !important;
}

#header-wrapper {
	min-width: 620px;
	position: relative;
	height: 130px;
	width: 100%;
	z-index: 10;
	overflow: hidden;
}

#header-wrapper.expanded {
	top: 0;
}

#header-wrapper.collapsed {
	top: -93px;
}

@media screen and (max-width: 975px) {
	#header-wrapper {
		height: 170px;
	}

	#header-wrapper.collapsed {
		top: -128px;
	}
}


header {
	height: 130px;
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
}


header #WelcomeBanner h1 {
	position: absolute;
	line-height: 0.9;
	float: left;
	width: 300px;
	height: 150px;
	top: 30px;
	left: 20px;
	text-shadow: 2px 2px 6px black;
}

header #WelcomeBanner h1 a {
	font-size: 65px;
	font-style: normal;
	font-weight: normal;
	color: #FFF;
}

header #WelcomeBanner h1 span {
	display: block;
	font-size: 22px;
	color: #e94921;
	padding-left: 25px;
	text-shadow: 2px 2px 2px black;
}

header #WelcomeBanner h1 a:hover {
	color: #3D526E;
}

header #WelcomeBanner h2 {
	position: absolute;
	font-size: 20px;
	color: #FFF;
	margin-left: 0px;
	width: 380px;
	text-align: centre;
	top: 105px;
	right: 10px;
	text-shadow: 1px 1px 1px black;
}

header #iconHeader {
	width: 300px;
	display: block;
	position: absolute;
	right: 0;
	color: #c1c1c1;
}

header #iconHeader h1 a {
	background: url("../images/logo-EXLOG.png") no-repeat scroll center top transparent;
	display: block;
	float: left;
	height: 40px;
	position: relative;
	text-indent: -9999px;
	top: 5px;
	width: 140px;
	right: 80px;
}

header #copy {
	position: absolute;
	top: 0px;
	left: 60px;
}

header #copy ul {
	list-style: none outside none;
	overflow: hidden;
}

header #copy ul li {
	float: left;
	font-size: 11px;
}

header #copy a {
	color: #c1c1c1;
}

#authenticationDiv {
	position: absolute;
	top: 12px;
	right: 15px;
	padding: 5px;
	border: 1px solid #F0F2F8;
	color: #F0F2F8;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	height: 80px;
	font-size: 14px;
	z-index: 11;
	text-shadow: 1px 1px 1px black;
}

header #welllistDiv {
	float: right;
	position: relative;
	top: 97px;
	right: 15px;
}

header #unitSetBtn {
	position: absolute;
	top: 15px;
	right: 30px;
	padding: 0px;
	margin: 0 10px 0 0;
}

header #userInfo h3 {
	position: absolute;
	line-height: 0.9;
	width: 300px;
	text-align: right;
	top: 45px;
	right: 35px;
	float: left;
	height: 150px;
	text-shadow: 2px 2px 6px black;
}

header #userInfo h3 a {
	font-size: 32px;
	font-style: normal;
	color: #FFF;
}

header #userInfo h3 a:hover {
	color: #3D526E;
}

header #userInfo h3 span {
	display: block;
	font-size: 14px;
	color: #e94921;
	padding-left: 25px;
	text-shadow: 2px 2px 2px black;
}

@media screen and (max-width: 975px) {
	header #iconHeaderLogo {
		display: none;
	}

	#authenticationDiv {
		position: absolute;
		background-color: #404948;
		left: 50%;
		top: 220px;
		width: fit-content;
		transform: translate(-50%, -50%) scale(1.5);
	}
}

#loginWait {
	float: right;
	position: absolute;
	top: 50px;
	right: 15px;
	/*background-image: url("../images/loading.gif"); 
	background-repeat: no-repeat;
	background-color: rgba(255,255,255,1);
	background-position:center; 	
	*/
	height: 30px;
	width: 30px;
	cursor: pointer;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	transform-origin: 12px 11px;
}

#loginWait:after {
	content: '\F110';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #ffffff;
}

#loginBtn {
	float: right;
	position: absolute;
	top: 50px;
	right: 0;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

#loginBtn:after {
	content: '\F011   ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 40px;
	color: #f05530;
}

header #othersettingsBtn {
	position: absolute;
	top: 12px;
	right: 2px;
	height: 30px;
	width: 30px;
	cursor: pointer;
}

header #othersettingsBtn i {
	font-size: 30px;
	color: #ffffff;
}

header #logoutBtn {
	float: right;
	position: relative;
	top: 97px;
	width: 62px;
	right: 10px;
	text-align: right;
	cursor: pointer;
	text-shadow: 1px 1px 1px black;
}

header #logoutBtn:after {
	content: '\F011   ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 32px;
	color: #ff2323;
}

header #dataBtn {
	float: right;
	position: relative;
	top: 85px;
	right: 15px;
	background-image: url("../images/iViewer_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

header #viewBtn {
	float: right;
	position: relative;
	top: 85px;
	right: 15px;
	background-image: url("../images/cube_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

header #chatBtn {
	float: right;
	position: relative;
	top: 98px;
	width: 42px;
	cursor: pointer;
	text-shadow: 1px 1px 1px black;
}

header #chatBtn:after {
	content: '\F0C0   ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 27px;
	color: #868686;
}

header #xchangeBtn {
	float: right;
	position: relative;
	top: 99px;
	width: 42px;
	cursor: pointer;
	text-shadow: 2px 2px 1px black;
}

header #xchangeBtn:after {
	content: '\F0ED   ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 30px;
	color: #f05530;
}

header #mgtUserBtn {
	float: right;
	position: relative;
	top: 85px;
	right: 15px;
	background-image: url("../images/user_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

header #cxnUserBtn {
	float: right;
	position: relative;
	top: 85px;
	right: 15px;
	background-image: url("../images/cxn_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

header #confUserBtn {
	float: right;
	position: relative;
	top: 85px;
	right: 15px;
	background-image: url("../images/conf_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
}

header #welllistBtn {
	float: right;
	position: relative;
	top: 88px;
	right: 10px;
	background-image: url("../images/well_48.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
	z-index: 999 !important;
}

header #configToggleBtn {
	float: right;
	position: relative;
	top: 94px;
	right: 15px;
	height: 33px;
	width: 70px;
	cursor: pointer;
}

#loginBtn:hover,
#loginBtn:focus,
#logoutBtn:hover,
#logoutBtn:focus,
#chatBtn:hover,
#chatBtn:focus,
#xchangeBtn:hover,
#xchangeBtn:focus,
#mgtUserBtn:hover,
#mgtUserBtn:focus,
#cxnUserBtn:hover,
#cxnUserBtn:focus,
#confUserBtn:hover,
#confUserBtn:focus,
#welllistBtn:hover,
#welllistBtn:focus {
	transform: scale(1.2);
}


#authenticationDiv input[type=text],
#authenticationDiv input[type=password] {
	width: 140px;
}

#authenticationDiv input[type=checkbox] {
	position: absolute;
}


header .curUnitSetCbx {
	padding: 5px 8px;
	width: 120px;
	border: none;
	box-shadow: none;
	background: transparent;
	background-image: none;
	-webkit-appearance: none;
	border-style: solid;
	border-width: thin;
	background: #f8f8f8;
	font-size: 10px;
}

header .showdata {
	float: left;
	position: relative;
	top: 2px;
	display: block;
	height: 80px;
	width: 180px;
	padding: 0 5px 5px 5px;
	font-size: 15px;
	text-align: center;
	border: 1px solid #F0F2F8;
	color: #F0F2F8;
	margin-bottom: 10px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	text-shadow: 1px 1px 1px black;
}

header .showlogos {
	float: left;
	position: relative;
	top: 2px;
	display: block;
	height: 80px !important;
	/*max-width: 320px; !important;*/
	padding: 0px;
	border: 0px solid #F02238;
	margin-right: 10px;
	margin-bottom: 10px;
}

header .showlogo {
	float: left;
	margin-top: 0px;
	margin-left: 10px;
	height: 79px;
	max-width: 150px;
	overflow: hidden;
}

header .showactivities {
	float: left;
	position: relative;
	top: 2px;
	display: block;
	height: 80px;
	/*width: 120px;*/
	padding: 0 5px 5px 5px;
	font-size: 10px;
	font-weight: bold;
	text-align: center;
	border: 1px solid #F0F2F8;
	color: #F0F2F8;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	text-shadow: 1px 1px 1px black;
}

header .showactivities_sub {
	float: left;
	position: relative;
	display: block;
	height: 80px;
	width: 106px;
	padding: 5px 0 5px 0;
	font-size: 10px;
	font-weight: bold;
	text-align: left;
	border: 0px solid #F0F2F8;
}

header .showactivity-txt {
	margin-top: 0px;
	margin-left: 5px;
	height: 15px;
	font-variant: small-caps;
	font-size: 16px;
	color: #e84921;
}

header .showactivity-on {
	margin-left: 5px;
}

header .showactivity-off {
	margin-left: 5px;
}

header .showactivity-on:before {
	content: '\F111  ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 14px;
	-webkit-text-stroke: 1px black;
	color: #6ed638;
}

header .showactivity-off:before {
	content: '\F111   ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 14px;
	-webkit-text-stroke: 1px black;
	color: #888888;
}

header .showactivity-up {
	margin-top: 10px;
	margin-left: 5px;
	height: 16px;
}

header .showactivity-up:before {
	content: '\F062  ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	-webkit-text-stroke: 1px black;
	color: #6ed638;
}

header .showactivity-dw {
	margin-top: 10px;
	margin-left: 5px;
	height: 16px;
}

header .showactivity-dw:before {
	content: '\F063  ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	-webkit-text-stroke: 1px black;
	color: #6ed638;
}

header .showactivity-st {
	margin-top: 10px;
	margin-left: 5px;
	height: 16px;
}

header .showactivity-st:before {
	content: '\F068  ';
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	-webkit-text-stroke: 1px black;
	color: #6ed638;
}

#header-showdata-operator {
	font-size: 15px;
	font-weight: bold;
}

#header-showdata-wellname {
	font-size: 15px;
	font-weight: bold;
}

#header-showdata-permit {
	font-size: 10px;
}

#header-showdata-cabname {
	font-size: 12px;
}

#header-showdata-location {
	font-size: 12px;
}

#header-showdata-xviewversion {
	font-size: 8px;
	color: #807e7e;
	text-shadow: none;
}

@media screen and (max-width: 775px) {
	header .showdata {
		display: none
	}
}

@media screen and (max-width: 1080px) {
	#header-showlogos {
		display: none
	}
}


#templateTabs,
#elisTabs,
#overallTabs {
	position: absolute;
	top: 93px;
	left: 30px;
	overflow-x: auto;
	overflow-y: hidden;
	max-width: calc(100% - 280px);
	padding-top: 12px;
	height: 25px;
	white-space: nowrap;
	/*scrollbar-width: thin;*/
}

.templates,
.elistemplates {
	position: absolute;
	top: 103px;
	left: 30px;
}

.templates a,
.elistemplates a {
	color: #F0F2F8;
	background-color: rgb(0, 0, 0);
	font-size: 14px;
	padding: 5px 10px 7px 10px;
	letter-spacing: -1px;
	border: 1px solid #d0d0d0;
	border-style: outset;
}

.templates a:hover,
.elistemplates a:hover {
	/*background-color: rgba(0,0,0,0.2); */
	background-color: rgb(255 141 114);
}

.templates a.template-ActiveHeader,
.elistemplates a.template-ActiveHeader {
	font-weight: bold;
	font-size: 16px !important;
	background-color: rgb(240 85 48) !important;
	padding: 10px 12px 7px 12px;
	color: #F0F2F8 !important;
	letter-spacing: -1px;
	border-style: double;
}

@media screen and (max-width: 975px) {

	#templateTabs,
	#elisTabs,
	#overallTabs {
		top: 131px;
		max-width: calc(100% - 65px);
		padding-top: 8px;
		height: 37px;
		white-space: nowrap;
		background-color: #333;
	}

	.templates a,
	.elistemplates a {
		font-size: 18px;
		padding: 7px 12px 7px 12px;
	}

	.templates a.template-ActiveHeader,
	.elistemplates a.template-ActiveHeader {
		font-size: 18px !important;
		padding: 7px 12px 7px 12px;
	}
}

.othersettingsItem a {
	color: #909298;
	background-color: rgba(0, 0, 0, 0.6);
	font-size: 15px;
	cursor: pointer;
}

.othersettingsItem a:hover {
	color: gainsboro;
}

#HeaderECLeft {
	position: absolute;
	top: 110px;
	left: 2px;
	height: 20px;
	width: 30px;
	color: #F0F2F8;
	background-repeat: no-repeat;
	padding: 0 5px 0 5px;
	cursor: pointer;
}

#HeaderECRight {
	position: absolute;
	top: 110px;
	left: calc(100% - 245px);
	height: 20px;
	width: 30px;
	color: #F0F2F8;
	background-repeat: no-repeat;
	padding: 0 5px 0 5px;
	cursor: pointer;
}

#HeaderVertChartCollapse {
	position: absolute;
	top: 40px;
	left: 2px;
	height: 15px;
	background-size: 15px;
	width: 15px;
	color: #F0F2F8;
	background-repeat: no-repeat;
	padding: 0 5px 0 5px;
	cursor: pointer;
	z-index: 999;
}

#elistooltipdesc,
#geartooltipdesc {
	user-select: none;
	position: absolute;
	display: none;
	border-radius: 5px;
	width: 360px !important;
	background-color: #f0f0f0;
	border: 1px solid #ccc;
	padding: 10px;
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
	/* Adding a subtle shadow */
	z-index: 1000;
	transform: translate3d(0, 0, 0);
	/* For hardware acceleration */
	transition: transform 0.2s;
	cursor: grab;
}

#elistooltipdesc .close,
#geartooltipdesc .close {
	color: #e65c41;
	right: 8px;
	top: -5px;
}

#elistooltipdesc .close:hover,
#elistooltipdesc .close:focus,
#geartooltipdesc .close:hover,
#geartooltipdesc .close:focus {
	color: red;
	cursor: pointer;
}

#elistooltipdesc span.category-depth,
#geartooltipdesc span.category-depth {
	/* Depth */
	font-size: 16px;
	font-weight: bold;
}

#elistooltipdesc p,
#geartooltipdesc p {
	display: flex;
	font-size: 12px;
	margin-bottom: 1px;
	/* Adjust the margin to control the space between paragraphs */
	/*white-space: nowrap;*/
	/* Prevent paragraphs from wrapping to multiple lines */
	/*overflow: hidden;*/
	/* Hide any overflowing content */
	/*text-overflow: ellipsis;*/
	/* Display an ellipsis (...) for overflow */
	margin: 5px 0px;
	width: 100%;
	overflow-x: auto;
}

#elistooltipdesc p.category-title,
#geartooltipdesc p.category-title {
	/* Title */
	display: inherit;
	overflow: hidden;
	position: relative;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	color: #fff !important;
	background-color: #e65c41 !important;
	margin: 0;
}

#elistooltipdesc p.category-title-cuttings {
	background-color: darkblue !important;
}

#elistooltipdesc p span.property,
#geartooltipdesc p span.property {
	flex: 0 0 130px;
	/* Adjust the width as needed */
	font-weight: bold;
}

#elistooltipdesc p span.value,
#geartooltipdesc p span.value {
	flex-grow: 1;
	word-wrap: break-word;
}

/* Alternating background colors for paragraphs */
#elistooltipdesc p:nth-child(odd),
#geartooltipdesc p:nth-child(odd) {
	background-color: #ffffff;
	/* Background color for odd paragraphs */
	color: #333;
	/* Text color for odd paragraphs */
}

#elistooltipdesc p:nth-child(even),
#geartooltipdesc p:nth-child(even) {
	background-color: #e0e0e0;
	/* Background color for even paragraphs */
	color: #555;
	/* Text color for even paragraphs */
}

.elistooltipdesc .elementCart .litho-symbol-Desc,
.geartooltipdesc .elementCart .litho-symbol-Desc {
	top: 1px;
	width: 20px;
	height: 16px;
	left: 1px;
}

/* === GEAR INFO SECTION === */
#gearinfocontainer {
	border: 1px solid #ccc;
	border-radius: 4px;
	overflow: hidden;
	margin-top: 6px;
}

/* Titre principal */
#gearinfocontainer p.category-title {
	background-color: #e65c41 !important;
	color: #fff !important;
	font-weight: bold;
	text-align: center;
	font-size: 16px;
	padding: 5px 0;
	margin: 0;
	position: relative;
	letter-spacing: 0.5px;
}

/* Flèche toggle */
#gearinfocontainer .toggle-arrow {
	position: absolute;
	right: 8px;
	top: 3px;
	font-size: 14px;
	color: #fff;
	cursor: pointer;
}

/* Sous-titre XRD/XRF */
#gearinfocontainer p.gear-subtitle {
	background-color: #666565 !important;
	display: inherit;
	color: #fff !important;
	display: inherit;
	text-align: center;
	font-weight: bold;
	font-size: 13px;
	margin: 6px 0 2px 0;
	padding: 2px 0;
	border-radius: 3px;
}

/* Ligne de donnée */
#gearinfocontainer p.gear-line {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 12px;
	margin: 1px 0;
	padding: 2px 4px;
}

/* Alternance de fond */
#gearinfocontainer p.gear-line:nth-child(odd) {
	background-color: #ffffff;
}

#gearinfocontainer p.gear-line:nth-child(even) {
	background-color: #f3f3f3;
}

/* Nom */
#gearinfocontainer span.property {
	flex: 1;
	font-weight: 600;
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Couleur */
#gearinfocontainer .color-preview {
	width: 18px;
	height: 14px;
	border: 1px solid #000;
	margin: 0 8px;
	flex-shrink: 0;
}

/* Valeur (%) */
#gearinfocontainer span.value {
	flex: 0 0 45px;
	text-align: right;
	color: #222;
	font-weight: bold;
}

#ElisAlertTooltip {
	position: absolute;
	display: none;
	border-radius: 5px;
	min-width: 350px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	max-width: 300px;
	background-color: #f0f0f0;
	border: 1px solid #ccc;
	/* padding: 10px; */
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	transform: translate3d(0, 0, 0);
	transition: transform 0.2s;
	cursor: grab;
}

#ElisAlertTooltip .close {
	color: #ffffff;
	right: 8px;
	top: 0px;
	font-size: 20px;
	z-index: 999;
}

#ElisAlertTooltip .close:hover,
#ElisAlertTooltip .close:focus {
	color: red;
	cursor: pointer;
}

#ElisAlertTooltip span.category-depth {
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	text-indent: 0px;
}

#ElisAlertTooltip p {
	line-height: 15px;
	text-indent: 5px;
	font-size: 12px;
	margin-bottom: 1px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	background-color: inherit !important;
}

#ElisAlertTooltip p.category-title {
	font-weight: 700;
	line-height: 30px;
	font-size: 14px;
}

#ElisAlertTooltip .elementContentTooltip {
	padding: 10px 10px;
	border-bottom: 2px solid #dfdfdf;
}

#ElisAlertTooltip .elementContentDepth {
	border-bottom: none;
	font-size: 20px;
	font-weight: 700;
	padding: 5px 15px;
}

#ElisAlertTooltip .elementContentTooltip:last-child {
	border-bottom: none;
	/* Remove border-bottom for last element */
}

#ElisAlertTooltip .badgeCategory {
	background: #E74A20CC;
	color: white;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 11px;
	margin: 5px;
}

#ElisAlertTooltip div.notification-title {
	display: inherit;
	position: relative;
	font-size: 12px;
	font-weight: 700;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	text-align: left;
	color: #fff !important;
	background-color: #e65c41 !important;
	cursor: pointer;
	margin: 0;
	padding: 5px 10px;
}

#ElisAlertTooltip p:nth-child(odd) {
	background-color: #ffffff;
	color: #333;
}

#ElisAlertTooltip p:nth-child(even) {
	background-color: #e0e0e0;
	color: #555;
}

#ElisAlertTooltip .ElisDismissButton,
#ElisAlert_content .table-save-button a.button,
#surveyDialog .table-save-button a.button {
	/* display: inline-block; */
	padding: 14px 32px;
	border-radius: 8px;
	border: 2px solid #e76851;
	color: #e76851;
	line-height: 14px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	transition: background-color 0.3s ease;
	text-decoration: none;
	float: right;
	width: inherit;
	margin: 8px;
	font-family: inherit;
}

#ElisAlertTooltip .ElisDismissButton:hover {
	background-color: #e76851;
	color: #FFFFFC;
}


.upplus::after {
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	color: rgb(40 154 11);
	cursor: pointer;
	content: '\f0fe';
}

.downminus::after {
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	color: rgb(40 154 11);
	cursor: pointer;
	content: '\f146';
}

.up {
	background-image: url("../images/Go-Up_26x15.png");
}

.down {
	background-image: url("../images/Go-Dw_26x15.png");
}

@media screen and (max-width: 975px) {

	#HeaderECLeft,
	#HeaderECRight {
		top: 140px;
	}

	#HeaderECRight {
		left: calc(100% - 30px);
	}
}

#HeaderCollapseHint {
	margin-top: 105px;
	background-image: url("../images/GoUp-13x6.png");
	background-repeat: no-repeat;
}


#content-wrapper {
	background-image: -webkit-linear-gradient(top, #ffdeaa 0%, #ffede8 50%, #ffdeaa 100%);
	background-image: linear-gradient(#ffdeaa, #ffede8, #ffdeaa);
	position: relative;
	top: 0;
	z-index: 10;
	overflow: hidden;
	min-width: 590px;
	min-height: 200px;
	margin-left: 30px;
}

#content-wrapper.expanded {
	top: 0;
}

#content-wrapper.collapsed {
	top: -93px;
}

@media screen and (max-width: 975px) {
	#content-wrapper.collapsed {
		top: -128px;
	}
}

#contentChartCanvas {
	height: 100%;
}

#contentChartCanvasScroll {
	height: calc(100% - 33px);
	width: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
}

#contentChartGrid {}

#contentChartSvg {
	border-style: solid;
	border-top: 2px solid black;
}

#scrollSVGEdt {
	position: absolute;
	top: 4px;
	left: 675px;
	height: 25px;
	width: 50px;
}

#fullscaleSVGBtn {
	background: url(../images/unzoom_50-23-h.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 25px;
	text-indent: -9999px;
	width: 50px;
	float: left;
	cursor: pointer;
}

#scrollLeftSVGBtn {
	background: url(../images/scrollleft_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	margin: 2px 6px 0;
	width: 20px;
	/* float: left; */
	cursor: pointer;
	position: absolute;
	left: 60px;
}

#scrollRightSVGBtn {
	background: url(../images/scrollright_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	width: 20px;
	/* float: left; */
	cursor: pointer;
	position: absolute;
	margin: 2px 6px 0;
	left: 100px;
}

.ui-widget.ui-widget-content {
	border: 2px solid #f5912f !important;
}

/*Survey*/
#loadingSurveyBtn,
#loadingOveralBtn,
#loadingElisBtn,
#loadingElisBtnLTSDesc,
#loadingStreamBtn {
	position: absolute;
	padding: 0px 5px;
	left: 13px;
	top: 5px;
}

#contentTabSettings {
	/*padding: 0px;
	overflow-x: hidden;
	overflow-y: scroll;*/
	padding: 0;
	position: absolute;
	overflow-x: hidden;
	top: 50%;
	left: 50%;
	/*transform: translate(-50%, -50%);*/
	background: #f1f1f1;
	z-index: 9999;
	overflow-y: auto;
	width: 70%;
	min-width: 400px;
	height: 70% !important;
	border: 1px solid;
	border-radius: 10px;
}

#contentTabSettings #settings-footer {
	cursor: move;
}

#contentSettings {
	font-family: Monospace;
	background-color: #f0f0f0;
	margin: 0px;
	overflow: hidden;
}

#chartCanvas-header,
#chartGrid-header,
#contentSettingsChart-header,
#contentSettingsGrid-header {
	display: block;
}

#chart-grid-table-header {
	overflow: hidden;
	clear: both;
	/*height: 57px;*/
	margin-right: 20px;
}

#chart-grid,
#contentSettings-grid {
	overflow-x: hidden;
	overflow-y: hidden;
	clear: both;
}

#chart-gridTblH {
	position: absolute;
	/*width: 100%;*/
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	overflow: scroll;
}

#chart-gridTbl {
	width: 100%;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	border-collapse: collapse;
	overflow: scroll;
}

#chart-gridTblH td,
#chart-gridTblH th,
#chart-gridTbl td,
#chart-gridTbl th {
	text-align: center;
	font-size: 1em;
	border: 1px solid #98bf21;
	padding: 3px 7px 2px 7px;
}

#chart-gridTblH th,
#chart-gridTbl th {
	font-size: 1.1em;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 4px;
	background-color: #A7C942;
	color: #ffffff;
}

#chart-gridTbl tr.alt td {
	color: #000000;
	background-color: #EAF2D3;
}

#chart-gridTbl tbody {
	overflow: scroll;
}

#chartCanvas-header select {
	padding: 5px 5px;
	margin: 2px 0 0 5px;
	width: 150px;
	border: none;
	box-shadow: none;
	background-image: none;
	-webkit-appearance: none;
	border-style: solid;
	border-width: thin;
}

#chartCanvas-header select:focus {
	outline: none;
}

#chartCanvas-header #resolutionTimeCanvas,
#chartCanvas-header #resolutionDepthCanvas {
	width: 85px;
}

#chartCanvas-header #rangeTimeCanvas {
	width: 65px;
}

#chartCanvas-header #rangeDepthCanvas {
	width: 85px;
}

#chartCanvas-header #pagerDepthCanvas {
	width: 25px;
}

#livetimeCanvasEdt,
#livetimeGridEdt {
	display: block;
	float: left;
	height: 30px;
	width: 78px;
	padding: 0 2px;
	font-size: 14px;
	/*font-weight: bold;*/
	text-align: center;
	border: 1px solid #F0F2F8;
}

#replayRangeCanvasEdt,
#replayRangeGridEdt {
	display: block;
	float: left;
	height: 18px;
	padding: 5px;
	font-size: 15px;
	text-align: center;
	border: 1px solid #F0F2F8;
}

#refreshCanvasBtn,
#refreshGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 3px;
	text-align: center;
	text-shadow: 1px 1px 1px black
}

#refreshCanvasBtn:after,
#refreshGridBtn:after {
	content: '\F021';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #6496ec;
}

#switchToChartBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 5px;
	text-align: center;
}

#switchToChartBtn:after {
	content: '\F201';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #2c6ad6;
}

#switchToGridBtn {
	display: block;
	float: left;
	width: 30px;
	cursor: pointer;
	margin-top: 7px;
	text-align: center;
}

#switchToGridBtn:after {
	content: '\F0CE';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #2c6ad6;
}

#settingsCanvasBtn,
#settingsGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 3px;
	text-align: center;
	text-shadow: 1px 1px 1px black;
}

#settingsCanvasBtn:after,
#settingsGridBtn:after {
	content: '\F013';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #4d4e4e;
}

#templateformBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 4px;
	text-align: center;
}

#templateformBtn:after {
	content: '\F005';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #ece62f;
	text-shadow: 1px 1px 3px black;
}

#exportAsciiGridBtn,
#exportAsciiCanvasBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 5px;
	text-align: center;
}

#exportAsciiGridBtn:after,
#exportAsciiCanvasBtn:after {
	content: '\F15C';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #289a0b;
	text-shadow: 1px 1px 2px black;
}

#exportPdfCanvasBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 4px;
	text-align: center;
}

#exportPdfCanvasBtn:after {
	content: '\F1C1';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #f05530;
}

#realtimeCanvasBtn,
#realtimeGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 4px;
	margin-right: 5px;
	text-align: center;
	text-shadow: 1px 1px 1px black;
}

#realtimeCanvasBtn:after,
#realtimeGridBtn:after {
	content: '\F017';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	letter-spacing: -2px;
	color: #f05530;
}

#replayCanvasBtn,
#replayGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 3px;
	margin-right: 5px;
	text-align: center;
	text-shadow: 1px 1px 1px black;
}

#replayCanvasBtn:after,
#replayGridBtn:after {
	content: '\F1DA';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #f05530;
}

#loadReplayCanvasBtn,
#loadReplayGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-left: 5px;
	margin-top: -2px;
	text-align: center;
}

#loadReplayCanvasBtn:after,
#loadReplayGridBtn:after {
	content: '\F152';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #289a0b;
}
#multiWellSyncmode {
    display: inline-block;   /* 🔥 au lieu de block + float */
    height: 30px;
    width: 30px;
    cursor: pointer;
    margin-top: 3px;
    margin-right: 5px;
    text-align: center;
    text-shadow: 1px 1px 1px black;
    vertical-align: middle;
}

#multiWellSyncmode:hover {
    opacity: 1;
}

/* ICON */
#multiWellSyncmode:after {
    content: '\F0C1'; /* link icon (sync feeling) */
    font-style: normal;
    font-family: exlogfont;
    font-size: 22px;
}

/* ===== SYNC ON ===== */
#multiWellSyncmode.sync-on:after {
    color: #00d26a; /* vert */
}

/* ===== SYNC OFF ===== */
#multiWellSyncmode.sync-off:after {
    color: #888; /* gris */
    opacity: 0.6;
}
#replayRangepicker {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-left: 11px;
	margin-top: 0px;
	text-align: center;
}

#daterangepicker {
	min-width: 100px;
	max-width: 210px;
}

#mdrangepicker {
	min-width: 100px;
	max-width: 120px;
}

#replayRangepicker:after {
	content: '\F1FE';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #f05530;
}

#loadingCanvasBtn,
#loadingGridBtn {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-top: 5px;
	text-align: center;
}

#loadingCanvasBtn:after,
#loadingGridBtn:after,
#loadingSurveyBtn:after,
#loadingOveralBtn:after,
#loadingElisBtn:after,
#loadingElisBtnLTSDesc:after,
#loadingStreamBtn:after {
	content: '\F110';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #e65c41;
}

/* OVERALL COMMENT */
.comment_input {
	height: 27px;
	border-radius: 5px;
	min-width: 60px;
	max-width: 170px;
	text-align: center;
	cursor: pointer;
}
.comment_arrow{
	cursor: pointer;
}
#comment_form {
	min-width: 500px;
}

.comment_transparent_checkbox {
	margin: 0 !important;
	position: absolute;
	top: 30%;
	cursor: pointer;
}

.comment_transparent_label {
	margin: 0;
	position: absolute;
	top: 25%;
	left: 50%;
}

.add_linebreak_comment {
	position: absolute;
	left: 0px;
}

.add_linebreak_comment:after {
	margin: 5px;
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5d5d5d;
	cursor: pointer;
	content: '\2936';
}

.comment_line_break_span {
	position: absolute;
	top: 0%;
	left: 10%;
	width: 50px;
	font-size: 9px;
	font-weight: bold;
	padding: 5px;
}

/*OVERALL TOOLTIP*/
#depthprogress-tooltip-alert,
#depthprogress-picker-tooltip-alert,
#elis-Preview-tooltip {
	display: none;
	position: absolute;
	padding: 5px;
	font-weight: bold;
	border: 1px solid #5d5d5d;
	border-radius: 5px;
	z-index: 99999;
	color: #f20d0d;
	background-color: #FFFFFF;
}

.depthprogress-tooltip_date {
	margin: 0 0 5px;
	text-decoration: underline;
	text-align: center;
	font-size: 10px;
}

.depthprogress-tooltip_text,
#elis-Preview-tooltip p {
	margin: inherit;
}

.depthprogress-tooltip_text {
	max-width: 150px;
}

@-webkit-keyframes rotating

/* Safari and Chrome */
	{
	from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes rotating {
	from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	to {
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		-o-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

.rotating {
	transform-origin: 15px 12px;
	-webkit-animation: rotating 1s ease-in-out infinite;
	-moz-animation: rotating 1s ease-in-out infinite;
	-ms-animation: rotating 1s ease-in-out infinite;
	-o-animation: rotating 1s ease-in-out infinite;
	animation: rotating 1s rotating 1s ease-in-out infinite;
}


#cancelReplayCanvas,
#cancelReplayGrid {
	display: block;
	float: left;
	height: 30px;
	width: 30px;
	cursor: pointer;
	margin-left: 5px;
	text-align: center;
}

#cancelReplayCanvas:after,
#cancelReplayGrid:after {
	content: '\F05C';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #f30b00;
	margin-left: 5px;
	text-align: center;
}

#replayRangeUpCanvasBtn {
	display: block;
	float: left;
	height: 12px;
	width: 14px;
	cursor: pointer;
	margin-left: 5px;
	margin-top: -5px;
	text-align: center;
}

#replayRangeUpCanvasBtn:after {
	content: '\F077';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #3378cb;
	text-align: center;
	font-weight: bold;
}

#replayRangeDwCanvasBtn {
	display: block;
	float: left;
	height: 12px;
	width: 14px;
	cursor: pointer;
	margin-left: -14px;
	margin-top: 6px;
	text-align: center;
}

#replayRangeDwCanvasBtn:after {
	content: '\F078';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #3378cb;
	text-align: center;
	font-weight: bold;
}

#scrollCanvasEdt {
	position: absolute;
	top: 35px;
	left: 5px;
	/*height: 50px;*/
	width: 25px;
}

#fullscaleCanvasBtn {
	background: url("../images/unzoom_50-23.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 50px;
	text-indent: -9999px;
	width: 22px;
	float: left;
	cursor: pointer;
	margin-top: 5px;
}

#scrollUpCanvasBtn {
	background: url("../images/scrollup_22-20.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	margin: 0 2px 6px 0;
	width: 20px;
	float: left;
	cursor: pointer;
	margin-top: 5px;
}

#scrollDwCanvasBtn {
	background: url("../images/scrolldw_22-20.png") no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	width: 20px;
	float: left;
	cursor: pointer;
}
#scrollCanvasMultiWrap {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.scrollCanvasEdtOne {
	position: absolute;
	width: 25px;
	pointer-events: auto;
	z-index: 20;
}

.scrollUpCanvasBtnOne {
	background: url(../images/scrollup_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	margin: 5px 2px 6px 0;
	width: 20px;
	cursor: pointer;
}

.scrollDwCanvasBtnOne {
	background: url(../images/scrolldw_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	width: 20px;
	cursor: pointer;
}

.fullscaleCanvasBtnOne {
	background: url(../images/unzoom_50-23.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 50px;
	text-indent: -9999px;
	width: 22px;
	cursor: pointer;
	margin-top: 5px;
}

#chartCanvas-info,
#chartCanvas-info1 {
	position: absolute;
	right: 5px;
	top: 1px;
}

#chartCanvasWellName,
.chartCanvasWellName {
	display: block;
	float: left;
	height: 18px;
	padding: 2px;
	margin: 4px 15px 0 5px;
	text-align: left;
	font-variant: small-caps;
	font-size: 18px;
	font-weight: bolder;
	text-shadow: 1px 1px 2px black;
	color: #e84921;
}

#chartCanvasMultiTitles {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 28px;
	pointer-events: none;
	z-index: 15;
}

#chartCanvasMultiTitles .chartCanvasWellName {
	position: absolute;
	float: none;
	margin: 0;
	pointer-events: none;
	white-space: nowrap;
}

#canvas-showlogo-cltlogo {
	display: block;
	float: left;
	height: 18px;
	margin: 0 0 0 5px;
	padding: 2px;
	text-align: left;
	font-variant: small-caps;
	font-size: 18px;
	font-weight: bolder;
	color: #e84921;
}

#canvas-showlogo-cltlogo img {
	border: 1px solid #e84921;
	border-radius: 4px;
	padding: 1px;
}

#chartCanvasHint {
	display: block;
	float: left;
	height: 18px;
	padding: 2px;
	font-size: 11px;
	font-style: italic;
	text-align: left;
	border: 0px solid #F0F2F8;
}

/*
#chartCanvas-header input[type="datetime-local"]{
    margin: 0;
    border: none;
	width: 170px;
    box-shadow: none;
    background-image: none;
    -webkit-appearance: none;
	border-style: solid;
    border-width: thin;
}*/
#chartCanvas-header input[type="datetime-local"]::-webkit-inner-spin-button,
#chartCanvas-header input[type="datetime-local"]::-webkit-clear-button {
	display: none;
	-webkit-appearance: none;
}


#usermgt {
	overflow: auto;
}

#usercxn {
	overflow: auto;
}

#xchange {
	overflow: auto;
}

#contentError {
	overflow: auto;
	font-size: 32px;
	font-style: normal;
	color: #962E46;
	text-align: center;
	text-shadow: 10px 0px 12px #a94;
}



@media screen and (max-width: 975px) {

	#replayRangeCanvasEdt,
	#replayRangeGridEdt {
		/*width: 100%;*/
		border: 0;
	}

	#switchToChartBtn,
	#switchToGridBtn,
	#exportAsciiGridBtn,
	#exportAsciiCanvasBtn,
	#exportPdfCanvasBtn {
		width: 0;
		visibility: hidden;
	}

	#chartCanvas-info {
		width: 0;
	}
}

.ArrowUp {
	background-image: url("../images/up_16.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
	text-indent: -9999px;
}

.ArrowDown {
	background-image: url("../images/down_16.png");
	background-repeat: no-repeat;
	height: 48px;
	width: 48px;
	cursor: pointer;
	text-indent: -9999px;
}



#footer-wrapper {
	background-image: -webkit-linear-gradient(top, #909090 0%, #bfbfbf 50%, #909090 100%);
	background-image: linear-gradient(#909090, #bfbfbf, #909090);
	background-repeat: repeat;
	position: relative;
	top: 0;
	height: 100%;
	width: calc(100% - 30px);
	min-width: 590px;
	overflow: auto;
	margin-left: 30px;
}

#footer-wrapper.expanded {
	top: 0;
}

#footer-wrapper.collapsed {
	top: -93px;
}

@media screen and (max-width: 975px) {
	#footer-wrapper.collapsed {
		top: -128px;
	}
}

footer {
	margin: 0 auto;
	overflow: hidden;
	width: 100%;
}

footer .showdata_container {
	position: relative;
	top: 0px;
	display: block;
	height: 100%;
	width: 100%;
	padding: 0px;
	text-align: left;
	border: 0px solid #353E3D;
	margin-bottom: 5px;
}

footer .showdata-display-1,
footer .showdata-display-2,
footer .showdata-display-3 {
	position: relative;
	float: left;
	border: 2px solid #FFFFFF;
	border-style: outset;
	margin-left: 1px;
	margin-top: 1px;
	text-align: center;
}

footer .showdata-display-1 {
	height: 48px;
	width: 140px;
}

footer .showdata-display-2 {
	height: 96px;
	width: 280px;
}

footer .showdata-display-3 {
	height: 144px;
	width: 420px;
}

footer .showdata-display-1 h1,
footer .showdata-display-2 h1,
footer .showdata-display-3 h1 {
	font-weight: bold;
	overflow: hidden;
}

footer .showdata-display-1 h1 {
	font-size: 14px;
	height: 18px;
}

footer .showdata-display-2 h1 {
	font-size: 25px;
	height: 36px;
}

footer .showdata-display-3 h1 {
	font-size: 40px;
	height: 54px;
}

footer .showdata-display-1 h1 span,
footer .showdata-display-3 h1 span,
footer .showdata-display-3 h1 span {
	margin-left: 5px;
}

footer .showdata-display-1 h1 span {
	font-size: 13px;
}

footer .showdata-display-3 h1 span {
	font-size: 26px;
}

footer .showdata-display-3 h1 span {
	font-size: 39px;
}

footer .showdata-display.led h1 {
	margin-left: 13px;
}

footer .showdata-display-1_val,
footer .showdata-display-2_val,
footer .showdata-display-3_val {
	font-weight: bold;
	white-space: nowrap;
	overflow: hidden;
}

footer .showdata-display-1_val {
	font-size: 25px;
}

footer .showdata-display-2_val {
	font-size: 50px;
}

footer .showdata-display-3_val {
	font-size: 70px;
}

footer .showdata-display-1_led,
footer .showdata-display-2_led,
footer .showdata-display-3_led {
	position: absolute;
	float: left;
	left: 0px;
	top: 0px;
}

footer .showdata-display-1_led {
	width: 13px;
	height: 18px;
}

footer .showdata-display-2_led {
	width: 26px;
	height: 36px;
}

footer .showdata-display-3_led {
	width: 39px;
	height: 54px;
}

footer .showdata-display-1_led.min,
footer .showdata-display-2_led.min,
footer .showdata-display-3_led.min {
	background-color: yellow
}

footer .showdata-display-1_led.max,
footer .showdata-display-2_led.max,
footer .showdata-display-3_led.max {
	background-color: red
}

footer .showdata-display-1_led.ok,
footer .showdata-display-2_led.ok,
footer .showdata-display-3_led.ok {
	background-color: green
}

footer .showdata-display-1_led.ackn,
footer .showdata-display-2_led.ackn,
footer .showdata-display-3_led.ackn {
	border: 2px dashed black;
}

footer .showdata-display-1_led.ackn {
	width: 9px;
	height: 14px;
}

footer .showdata-display-2_led.ackn {
	width: 18px;
	height: 32px;
}

footer .showdata-display-3_led.ackn {
	width: 27px;
	height: 50px;
}

footer .showdata-display-1_led.ok.acknmin,
footer .showdata-display-2_led.ok.acknmin,
footer .showdata-display-3_led.ok.acknmin {
	border: 2px dashed yellow
}

footer .showdata-display-1_led.ok.acknmax,
footer .showdata-display-2_led.ok.acknmax,
footer .showdata-display-3_led.ok.acknmax {
	border: 2px dashed red
}

footer .showdata-display-1_sound,
footer .showdata-display-2_sound,
footer .showdata-display-3_sound {
	position: absolute;
	float: left;
	left: 1px;
	top: 0px;
}

footer .showdata-display-1_sound {
	width: 10px;
	height: 18px;
}

footer .showdata-display-2_sound {
	width: 20px;
	height: 36px;
}

footer .showdata-display-3_sound {
	width: 30px;
	height: 54px;
}

footer .showdata-display-1_sound.sound:after,
footer .showdata-display-2_sound.sound:after,
footer .showdata-display-3_sound.sound:after {
	font-style: normal;
	font-family: exlogfont;
	content: '\F026';
	color: black;
}

footer .showdata-display-1_sound.sound:after {
	font-size: 16px;
}

footer .showdata-display-2_sound.sound:after {
	font-size: 30px;
}

footer .showdata-display-3_sound.sound:after {
	font-size: 50px;
}




/* Settings windows*/
#settings-footer {
	height: 40px;
	min-width: 200px;
	position: sticky;
	top: 0;
	background: #f1f1f1;
	z-index: 10000;
}

#settings-footer #toolbar-button {
	cursor: pointer;
	font-weight: bold;
	text-shadow: 1px 1px 2px #000;
}

#toolbar-button-ok {
	float: left;
	width: 34px;
	margin: 0 5px 0 5px;
	font-size: 36px;
	color: #13c313;
}

#toolbar-button-cancel {
	float: left;
	width: 34px;
	margin: 0px;
	font-size: 36px;
	color: #e00000;
	margin-left: 5px;
}

#toolbar-button-ok:hover,
#toolbar-button-ok:focus,
#toolbar-button-cancel:hover,
#toolbar-button-cancel:focus {
	transform: scale(1.2);
}

.tab-settings-group {
	margin: 1px;
	border: 1px solid #ddd;
	background-color: #ccc;
	/*background-image: url("../images/back_header.jpg"); */
	background-repeat: repeat;
	-webkit-border-radius: 10px;
	-ms-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 3px #000;
	-ms-box-shadow: inset 0 0 3px #000;
	box-shadow: inset 0 0 3px #000;
}

.tab-settings-group summary {
	color: #fff;
	text-shadow: #000 0 1px;
	box-shadow: 5px;
	padding: 5px;
	margin: 0 -5px 0 -5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	cursor: pointer;
	background-image: linear-gradient(#3c3c3c, #737373);
	background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #737373 100%);
}

.tab-settings-group details {
	margin: 0 5px 0 5px;
}

.tab-settings-group p {
	margin: 0;
	clear: both;
}

.general-settings-group {
	margin: 5px;
	padding: 5px;
	float: left;
	text-align: left;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	background-image: linear-gradient(#ffdeaa, #ffede8);
	background-image: -webkit-linear-gradient(top, #ffdeaa 0%, #ffede8 100%);
}

.general-settings {
	width: 280px;
	float: left;
	text-align: left;
	background-color: #ccc;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-box-shadow: inset 0 0 3px #000;
	-ms-box-shadow: inset 0 0 3px #000;
	box-shadow: inset 0 0 3px #000;
}

.general-settings summary {
	color: #fff;
	text-shadow: #000 0 1px;
	box-shadow: 5px;
	padding: 5px;
	margin: 0 -5px 0 -5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	cursor: pointer;
	background-image: linear-gradient(#3c3c3c, #737373);
	background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #737373 100%);
}

.general-settings details {
	margin: 0 5px 0 5px;
}

.serie-settings-track {
	margin: 5px;
	padding: 5px;
	float: left;
	text-align: left;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	background-image: linear-gradient(#ffdeaa, #ffede8);
	background-image: -webkit-linear-gradient(top, #ffdeaa 0%, #ffede8 100%);
}

.serie-settings-track-comm {
	width: 280px;
	margin-top: 30px;
}

.serie-settings-track-comm table {
	width: 95%;
	margin: 0 5px 5px 5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomleft: 10px;
	-ms-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-ms-border-bottom-right-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	border-bottom-right-radius: 10px;
	background-image: linear-gradient(#ffc87f, #f5ad7a);
	background-image: -webkit-linear-gradient(top, #ffc87f 0%, #f5ad7a 100%);
}

.serie-settings {
	width: 280px;
	text-align: left;
	background-color: #ccc;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-box-shadow: inset 0 0 3px #000;
	-ms-box-shadow: inset 0 0 3px #000;
	box-shadow: inset 0 0 3px #000;
	background-image: linear-gradient(#cccbca, #bbb1ab, #989898);
	background-image: -webkit-linear-gradient(top, #cccbca 0%, #bbb1ab 50%, #989898 100%);
}

.serie-settings summary {
	color: #fff;
	text-shadow: #000 0 1px;
	box-shadow: 5px;
	font-size: 11px;
	padding: 5px;
	margin: 0 -5px 0 -5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	cursor: pointer;
	background-image: linear-gradient(#3c3c3c, #737373);
	background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #737373 100%);
}

.serie-settings details {
	margin: 0 5px 0 5px;
}

.display-settings-group {
	margin: 5px;
	padding: 5px;
	float: left;
	text-align: left;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	background-image: linear-gradient(#ffdeaa, #ffede8);
	background-image: -webkit-linear-gradient(top, #ffdeaa 0%, #ffede8 100%);
}

.display-settings {
	width: 280px;
	float: left;
	text-align: left;
	background-color: #ccc;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-box-shadow: inset 0 0 3px #000;
	-ms-box-shadow: inset 0 0 3px #000;
	box-shadow: inset 0 0 3px #000;
	background-image: linear-gradient(#cccbca, #bbb1ab, #989898);
	background-image: -webkit-linear-gradient(top, #cccbca 0%, #bbb1ab 50%, #989898 100%);
}

.display-settings summary {
	color: #fff;
	text-shadow: #000 0 1px;
	box-shadow: 5px;
	padding: 5px;
	margin: 0 -5px 0 -5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	cursor: pointer;
	background-image: linear-gradient(#3c3c3c, #737373);
	background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #737373 100%);
}

.display-settings details {
	margin: 0 5px 0 5px;
}

.display-panel-settings {
	width: 280px;
}

.display-panel-settings table {
	width: 95%;
	margin: 0 5px 5px 5px;
	border-bottom: 1px solid #ddd;
	-webkit-border-top-left-radius: 10px;
	-moz-border-radius-topleft: 10px;
	-ms-border-radius-topleft: 10px;
	border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-ms-border-top-right-radius: 10px;
	-moz-border-radius-topright: 10px;
	border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomleft: 10px;
	-ms-border-radius-bottomleft: 10px;
	border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-ms-border-bottom-right-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	border-bottom-right-radius: 10px;
	background-image: linear-gradient(#ffc87f, #f5ad7a);
	background-image: -webkit-linear-gradient(top, #ffc87f 0%, #f5ad7a 100%);
}


.blink {
	animation: blink-animation 1s steps(5, start) infinite;
	-webkit-animation: blink-animation 0.5s steps(5, start) infinite;
}

@keyframes blink-animation {
	to {
		transform: scale(2.5);
	}
}

@-webkit-keyframes blink-animation {
	to {
		transform: scale(2.0);
	}
}

.strike {
	text-decoration: line-through
}

.center {
	text-align: center
}

/* Tables */
.datagrid {
	font-size: 10px;
	width: 100%;
	border-collapse: collapse;
}

.datagrid td,
th {
	border: 1px solid #e8816761;
	padding: 2px;
}

.datagrid tr:nth-child(even) {
	background-color: #dddddd;
}

/* The Modal (background) */
.modal {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 9999;
	/* Sit on top */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: hidden auto;
	background-color: rgba(0, 0, 0, 0.4);
	/* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
	background-color: #fefefe;
	margin: 5% auto 5% auto;
	/* 5% from the top, 15% from the bottom and centered */
	/*position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);*/
	border: 1px solid #888;
	width: 80%;
	/* Could be more or less, depending on screen size */
	position: relative;
	/*max-height: 80%;*/
	overflow: hidden;
}

.modal-content-body {
	padding: 5px;
	background-color: #585858;
	position: relative;
	overflow: hidden;
}

.modal-content-center {
	background-color: #fefefe;
	margin: 0;
	/* 5% from the top, 15% from the bottom and centered */
	position: absolute;
	left: 50%;
	top: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	border: 1px solid #888;
	width: 80%;
	/* Could be more or less, depending on screen size */
	position: relative;
	overflow: hidden;
	text-align: center;
}


/* Section */
.container-section {
	padding: 0.01em 5px;
	color: #ffffff !important;
	background-image: linear-gradient(#e84921, #e88268);
	background-image: -webkit-linear-gradient(top, #e84921 0%, #e88268 100%);
}

.container-section:after,
.container-section:before {
	float: left;
	width: 100%;
}

.container-section p {
	display: block;
	font-variant: small-caps;
	font-weight: bold;
	font-size: 14pt;
	-webkit-margin-before: 10px;
	-webkit-margin-after: 10px;
	-webkit-margin-start: 0px;
	-webkit-margin-end: 0px;
	text-shadow: 1px 2px 2px black;
}

/* The Close Button (x) */
.close {
	position: absolute;
	right: 15px;
	top: 0;
	color: white;
	font-size: 35px;
	font-weight: bold;
}

.close:hover,
.close:focus {
	color: red;
	cursor: pointer;
}


/* Add Zoom Animation */
.animate {
	-webkit-animation: animatezoom 0.6s;
	animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
	from {
		-webkit-transform: scale(0)
	}

	to {
		-webkit-transform: scale(1)
	}
}

@keyframes animatezoom {
	from {
		transform: scale(0)
	}

	to {
		transform: scale(1)
	}
}


/* Center the image and position the close button */
.headcontainer {
	text-align: center;
	color: #ffffff !important;
	margin: 0;
	position: relative;
	height: 0px;
	background-color: #5a6363 !important;
}

.headfiltercontainer {
	position: absolute;
	right: 40px;
}

.container {
	padding: 10px;
}

.container label {
	content: "";
	display: table;
	clear: both
}

/* Set a style for all buttons */
button {
	background-color: #1d2222;
	color: white;
	padding: 6px 20px;
	margin: 0px 0;
	border: none;
	cursor: pointer;
	width: 70px;
}

.modal-content select {
	padding: 5px 8px;
	margin: 8px 0 0 0;
	width: 300px;
	border: none;
	box-shadow: none;
	/*background: transparent;*/
	background-image: none;
	-webkit-appearance: none;
	border-style: solid;
	border-width: thin;
}

.modal-content select:focus {
	outline: none;
}

.modal-content input[type=text],
.modal-content input[type=password],
.modal-content input[type=search] {
	width: 300px;
	padding: 5px 8px;
	margin: 8px 0;
	display: inline-block;
	border: 1px solid #ccc;
	box-sizing: border-box;
}

.modal-content input[type=radio],
.modal-content input[type=checkbox] {
	width: 30px;
	padding: 5px 8px;
	margin: 5px 0;
	display: inline-block;
	border: 1px solid #ccc;
	box-sizing: border-box;
	cursor: pointer;
}

.modal-content .combo-style1 {
	padding: 4px 8px;
	margin: 0 0 0 10px;
}


.table_body_scrollable tbody {
	display: block;
	overflow: auto;
}

.table_body_scrollable thead tr,
.table_body_scrollable tbody tr {
	display: table;
	width: 100%;
	table-layout: fixed;
	/* even columns width , fix width of table too*/
	border-bottom: 1px solid white;
}

.table-checkuserlist3 td:nth-child(1) {
	width: 70px;
}

.table-userlistsettings thead td:nth-child(1) {
	width: auto;
}

.table-userlistsettings thead td:nth-child(2) {
	width: 160px;
}

.table-userlistsettings thead td:nth-child(3) {
	width: 154px;
}

.table-userlistsettings thead td:nth-child(4) {
	width: 95px;
}

.table-userlistsettings tbody td:nth-child(1) {
	width: auto;
}

.table-userlistsettings tbody td:nth-child(2) {
	width: 160px;
}

.table-userlistsettings tbody td:nth-child(3) {
	width: 130px;
}

.table-userlistsettings tbody td:nth-child(4) {
	width: 24px;
}

.table-userlistsettings tbody td:nth-child(5) {
	width: 25px;
}

.table-userlistsettings tbody td:nth-child(6) {
	width: 35px;
}

.table-userlistsettings tbody td:nth-child(7) {
	width: 25px;
}


@media screen and (max-width: 975px) {
	.table-userlistsettings thead td:nth-child(3) {
		width: 138px;
	}

	.table-userlistsettings tbody td:nth-child(3) {
		width: 114px;
		font-size: 12px;
	}
}

@media screen and (max-width: 850px) {
	.table-userlistsettings thead td:nth-child(2) {
		width: 160px;
	}

	.table-userlistsettings tbody td:nth-child(2) {
		width: 160px;
		font-size: 11px;
	}

	#users_mgt_legend_table {
		float: none;
	}
}

.toolbarbutton-settings-up,
.toolbarbutton-settings-down,
.toolbarbutton-settings-left,
.toolbarbutton-settings-right,
.toolbarbutton-settings-remove,
.toolbarbutton-settings-add,
.toolbarbutton-settings-add-big,
.toolbarbutton-settings-duplicate,
.toolbarbutton-settings-expandall,
.toolbarbutton-settings-collapseall {
	border-spacing: 0;
	margin: 0;
	overflow: hidden;
	cursor: pointer;
	font-weight: bold;
	text-shadow: 2px 1px 1px #000;
}

.toolbarbutton-settings-up:hover,
.toolbarbutton-settings-down:hover,
.toolbarbutton-settings-left:hover,
.toolbarbutton-settings-right:hover,
.toolbarbutton-settings-remove:hover,
.toolbarbutton-settings-add:hover,
.toolbarbutton-settings-add-big:hover,
.toolbarbutton-settings-duplicate:hover,
.toolbarbutton-settings-expandall:hover,
.toolbarbutton-settings-collapseall:hover {
	transform: scale(1.2);
}

.toolbarbutton-settings-up {
	font-size: 16px;
	color: #0065cb;
}

.toolbarbutton-settings-down {
	font-size: 16px;
	color: #0065cb;
}

.toolbarbutton-settings-left {
	font-size: 16px;
	color: #0065cb;
}

.toolbarbutton-settings-right {
	font-size: 16px;
	color: #0065cb;
}

.toolbarbutton-settings-remove {
	font-size: 18px;
	color: #de3636;
}

.toolbarbutton-settings-add {
	font-size: 18px;
	color: #25da25;
}

.toolbarbutton-settings-add-big {
	font-size: 36px;
	color: #25da25;
}

.toolbarbutton-settings-duplicate {
	font-size: 16px;
	color: #c38700;
}

.toolbarbutton-settings-expandall {
	font-size: 20px;
	color: #ffffff;
}

.toolbarbutton-settings-collapseall {
	font-size: 20px;
	color: #ffffff;
}

/* Splitbar styles; these are the default class names and required styles */
#splitterContainer {
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
	overflow-x: auto;
	overflow-y: hidden;
	/*
	background-image: url("../images/back_welcome.jpg"); 
	background-repeat: repeat;*/
	background: #3e4746;
}


.splitbarV {
	float: left;
	width: 6px;
	height: 100%;
	line-height: 0px;
	font-size: 0px;
	border-left: solid 1px #9cbdff;
	border-right: solid 1px #9cbdff;
	background: #cbe1fb url(../images/splitter/panev.gif) 0% 50%;
}

.splitbarH {
	height: 6px;
	text-align: left;
	line-height: 0px;
	font-size: 0px;
	border-top: solid 1px #889996;
	border-bottom: solid 1px #889996;
	background: #cbe1fb url(../images/splitter/paneh.gif) 50% 0%;
}

.splitbuttonV {
	margin-top: -41px;
	margin-left: -4px;
	top: 50%;
	position: relative;
	height: 83px;
	width: 10px;
	background: transparent url(../images/splitter/panevc.gif) 10px 50%;
}

.splitbuttonV.invert {
	margin-left: 0px;
	background: transparent url(../images/splitter/panevc.gif) 0px 50%;
}

.splitbuttonH {
	margin-left: -41px;
	left: 50%;
	position: relative;
	height: 10px !important;
	width: 83px;
	background: transparent url(../images/splitter/panehc.gif) 50% 0px;
}

.splitbuttonH.invert {
	margin-top: -4px;
	background: transparent url(../images/splitter/panehc.gif) 50% -10px;
}

.splitbarV.working,
.splitbarH.working,
.splitbuttonV.working,
.splitbuttonH.working {
	-moz-opacity: .50;
	filter: alpha(opacity=50);
	opacity: .50;
}


/* Welcome */
#welcome {
	/*background-color: #ccc;
  background-image: url("../images/back_welcome.jpg"); 
  background-repeat: repeat; */
	background: #3e4746;
	float: left;
	width: 100%;
	/*710px;*/
	height: 100%;
	/*340px;*/
}

.jvectormap-label {
	position: absolute;
	display: none;
	border: solid 1px #CDCDCD;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: #292929;
	color: white;
	font-family: sans-serif, Verdana;
	font-size: smaller;
	padding: 3px;
}

.jvectormap-zoomin,
.jvectormap-zoomout {
	position: absolute;
	left: 10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: #292929;
	padding: 3px;
	color: white;
	width: 10px;
	height: 10px;
	cursor: pointer;
	line-height: 10px;
	text-align: center;
}

.jvectormap-zoomin {
	top: 10px;
}

.jvectormap-zoomout {
	top: 30px;
}


/* Icon bar */
/* (https://astronautweb.co/snippet/font-awesome/)*/
.fa {
	font-style: normal;
	font-family: exlogfont;
	position: absolute;
	right: 5px;
}

.far {
	font-style: normal;
	font-family: exlogfont;
}

.fa-list:after {
	content: '\F00B';
}

.fa-view:after {
	content: '\F10A';
}

.fa-earth:after {
	content: '\F0AC';
}
.fa-archive:after { 
	content: '\f187';
}

.fa-lock:after {
	content: '\F023';
}

.fa-unlock:after {
	content: '\F13E';
}

.fa-print:after {
	content: '\F02F';
}

.fa-bar-chart:after {
	content: '\F080';
}

.fa-area-chart:after {
	content: '\F1FE';
}

.fa-camera:after {
	content: '\F030';
}

.fa-video-camera:after {
	content: '\F03d';
}

.fa-sitemap:after {
	content: '\F0e8';
}

.fa-pie-chart:after {
	content: '\F200';
}

.fa-line-chart:after {
	content: '\F201';
}

.fa-arrow-down:after {
	content: '\F063';
}

.fa-calendar:after {
	content: '\F073';
}

.fa-globe:after {
	content: '\F0AC';
}

.fa-th-list:after {
	content: '\F00B';
}

.fa-comments:after {
	content: '\F086';
}

.fa-commenting:after {
	content: '\F27A';
}

.fa-users:after {
	content: '\F007';
}

.fa-folder-open:after {
	content: '\F07C';
}

.fa-bars:after {
	content: '\F0C9';
}

.fa-book:after {
	content: '\F02D';
}

.fa-plus-circle:after {
	content: '\F055';
}

.fa-database:after {
	content: '\F1C0';
}

.fa-check:after {
	content: '\F00C';
}

.fa-check-circle:after {
	content: '\F058';
}

.fa-times:after {
	content: '\F00D';
}

.fa-times-circle:after {
	content: '\F057';
}

.fa-codepen:after {
	content: '\F1CB';
}

.fa-level-down:after {
	content: '\F149';
}

.fa-arrows:after {
	content: '\F047';
}

.fa-plus:after {
	content: '\F067';
}

.fa-chevron-left:after {
	content: '\F053';
}

.fa-chevron-right:after {
	content: '\F054';
}

.fa-chevron-up:after {
	content: '\F077';
}

.fa-chevron-down:after {
	content: '\F078';
}

.fa-files-o:after {
	content: '\F0C5';
}

.fa-angle-double-left:after {
	content: '\F100';
}

.fa-angle-double-right:after {
	content: '\F101';
}

.fa-angle-double-up:after {
	content: '\F102';
}

.fa-angle-double-down:after {
	content: '\F103';
}

.fa-circle:after {
	content: '\F111';
}

.fa-map-marker:after {
	content: '\F041';
}

.fa-exclamation-triangle:after {
	content: '\F071';
}

.icon-bar {
	position: fixed;
	left: 0;
	top: 130px;
	width: 30px;
	height: 100%;
	text-align: left;
	background-color: #3e4746;
	z-index: 15;
	/*
	background-image: url("../images/back_header.jpg"); 
	background-repeat: repeat; */
}

.icon-bar.bigsize a {
	background-color: #555;
	color: white;
	left: 0;
	padding: 15px 5px;
	width: 200px;
	font-size: 26px;
}

.icon-bar a {
	padding: 5px 5px;
	display: block;
	text-decoration: none;
	color: white;
	font-size: 16px;
	position: relative;
	width: 130px;
	left: -110px;
	transition: 0.3s;
}

.icon-bar a.disabled {
	pointer-events: auto;
	/* Autorise le survol pour afficher le title */
	cursor: not-allowed;
	/* Curseur interdit */
	color: #ccc !important;
	/* Texte grisé */
	background-color: #999 !important;
	/* Fond grisé */
	opacity: 0.6;
	text-decoration: none;
}

/* Désactive le clic en JS via un événement */
.icon-bar a.disabled:active,
.icon-bar a.disabled:focus {
	pointer-events: none;
	/* Empêche les clics */
}


.icon-bar a:hover {
	background-color: #000;
}

.icon-bar [admin],
.icon-bar.bigsize [admin] {
	color: #dcd50b;
	/*ada814*/
}

.iconactive {
	background-color: #f05530 !important;
}

#toolbar-exlog-logo {
	background: url("../images/logo-EXLOG.png") no-repeat scroll center top transparent;
	display: block;
	height: 33px;
	text-indent: -9999px;
	width: 100px;

	position: relative;
	left: 8px;
	top: 60px;
	transform-origin: bottom left;
	transform: rotate(-90deg) translate(0, 20px) scale(0.75);
}

#toolbar-well-info {
	display: none;
}

@media screen and (max-width: 975px) {
	#toolbar-well-info {
		display: block;
	}
}

#toolbar-wrapper.expanded {
	top: 130px;
}

#toolbar-wrapper.collapsed {
	top: 37px;
}

#toolbar-wrapper a.xcheck-option i {
	color: #1ecad3 !important;
	text-shadow: 0 0 8px rgba(30, 202, 211, 0.8);
}

@media screen and (max-width: 975px) {
	#toolbar-wrapper.expanded {
		top: 170px;
	}
}

/* ScrollBar */
::-webkit-scrollbar {
	width: 8px;
	height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
	background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #555;
}



/* Toggle Buttons*/
.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(232, 73, 33);
	-webkit-transition: .4s;
	transition: .4s;
	font-size: 18px;
	text-align: center;
	line-height: 26px;
}

.slider:before {
	position: absolute;
	content: "G";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
}

input:checked+.slider {
	background-color: #2196F3;
}

input:focus+.slider {
	box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
	content: "W";
	font-size: 18px;
	color: #2196F3;
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}




/* Callout message form */

.callout {
	position: fixed;
	bottom: 25px;
	right: 25px;
	margin-left: 20px;
	max-width: 300px;
	z-index: 9999;
}

.callout-header {
	padding: 10px 15px;
	background: #868686;
	font-size: 24px;
	color: white;
	text-shadow: 1px 2px 2px black;
}

.callout-container {
	padding: 15px;
	background-color: #f05530;
	color: black
}


/* Waiting animated icon */
@keyframes icon_wait_layer1 {

	0%,
	25% {
		fill: #6F6F6E;
	}

	25%,
	50% {
		fill: #E84921;
		transform: translateY(-10px);
	}

	50%,
	100% {
		fill: #6F6F6E;
	}
}

@keyframes icon_wait_layer2 {

	0%,
	50% {
		fill: #6F6F6E;
	}

	50%,
	75% {
		fill: #E84921;
		transform: translateY(-10px);
	}

	75%,
	100% {
		fill: #6F6F6E;
	}
}

@keyframes icon_wait_layer3 {

	0%,
	75% {
		fill: #6F6F6E;
	}

	75%,
	82% {
		fill: #E84921;
		transform: translateY(-10px);
	}

	92%,
	100% {
		fill: #6F6F6E;
	}
}

/* menu context */
/* The whole thing */
.custom-menu {
	display: none;
	z-index: 1000;
	position: absolute;
	overflow: hidden;
	border: 1px solid #CCC;
	white-space: nowrap;
	font-family: sans-serif;
	background: #FFF;
	color: #333;
	border-radius: 5px;
	padding: 0;
}

/* Each of the items in the list */
.custom-menu li {
	padding: 8px 12px;
	cursor: pointer;
	list-style-type: none;
	transition: all .3s ease;
	user-select: none;
}

.custom-menu li:hover {
	background-color: #DEF;
}

.label_button_li {
	cursor: default !important;
	text-align: center;
}

.label_button_li:hover {
	background-color: inherit !important;
}

.comment_label {
	padding: 5px;
	cursor: pointer;
	background-color: #87ca75;
	border: 1px solid #CCC;
	border-radius: 20px;
}

.comment_label:hover {
	background-color: #9ec095;
}

#comment_input {
	padding: 5px;
}

/* svg slider btn*/
#svgsliderbtn {
	height: 25px;
	width: 25px;
	cursor: pointer;
	display: inline;
}

#svgsliderbtn:after {
	content: '\F152';
	font-style: normal;
	font-family: exlogfont;
	font-size: 30px;
	color: #289a0b;
}

.sliderpicker {
	margin-left: 53px;
	margin-right: 30px;
	margin-top: -53px;
}

.sliderpicker p {
	margin: 0px;
	text-align: center;
}

.sliderpickerV {
	position: absolute;
	width: 20px;
	margin-left: 15px;
	margin-top: 103px;
}

/* svg dropdown*/
.svgdropbtn {
	border: none;
	cursor: pointer;
	width: fit-content;
}

#svgdropbtn:after,
#chartDropBtn:after {
	content: '\F013';
	font-style: normal;
	font-family: exlogfont;
	font-size: 24px;
	color: #4d4e4e;
}

#svgdropbtnlts:after {
	content: '\F013';
	font-style: normal;
	font-family: exlogfont;
	font-size: 23px;
	color: #5d5d5d;
}

#svgmyDropdownlts {
	min-width: 400px;
}

.svgdropbtn:hover,
.svgdropbtn:focus {
	background-color: #2980B9;
}

.svgdropdown {
	position: absolute;
	left: 80px;
	display: inline-block;
	margin-top: 2px;
}

#dropdownMenuKpi {
	left: 50px;
}

#dropdownMenuKpi .crewSettings {
	border: none;
	/*display: inline-flex;
  	width: 100%;
  	justify-content: space-around;*/
}
.crewColor{
	position: absolute;
    top: 21px;
    right: 13px;
}
#dropdownMenuKpi .crewSettings {
	/* display: flex;
	flex-direction: column;
	gap: 3px;
	position: relative;
	font-size: 11px;
	width: 350px; */
}

#dropdownMenuKpi .crew-line {
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    justify-content: space-between;
}
#dropdownMenuKpi .crew-name-td{
	align-items: center;
    text-align: center !important;
}
#dropdownMenuKpi .crew-line label {
	display: flex;
	align-items: center;
	gap: 4px;
	white-space: nowrap;
}

#dropdownMenuKpi .crew-line input[type="date"] {
	font-size: 11px;
	padding: 2px;
	height: 20px;
}

/* -----------------------------------------------------------
   PHASE BLOCK
----------------------------------------------------------- */
#dropdownMenuKpi .phaseBlock,
#dropdownMenuOverall .phaseBlock {
	border: 1px solid #888;
	border-radius: 6px;
	padding: 6px;
	margin: 4px 0;
	background: #f7f7f7;
}

#dropdownMenuKpi .phase-line,
#dropdownMenuOverall .phase-line {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 4px;
}

#dropdownMenuKpi .phase-header input[type="text"],
#dropdownMenuOverall .phase-header input[type="text"] {
	width: 60%;
}

#dropdownMenuKpi .removePhaseBtn,
#dropdownMenuOverall .removePhaseBtn {
	background-color: #c0392b;
	color: white;
	border-radius: 4px;
}

#dropdownMenuKpi .removeCrewBtn,
#dropdownMenuOverall .removeCrewBtn {
	padding: 2px 5px;
	font-size: 11px;
	position: absolute;
	width: 20px;
}

/* -----------------------------------------------------------
   NEW PHASES + ACCORDION
----------------------------------------------------------- */

#dropdownMenuKpi .phaseCard,
#dropdownMenuOverall .phaseCard {
	border: 1px solid #cfcfcf;
	border-radius: 8px;
	background: #fafafa;
	overflow: hidden;
	transition: box-shadow 0.15s ease-in-out;
}

#dropdownMenuKpi .phaseCard:hover,
#dropdownMenuOverall .phaseCard:hover {
	box-shadow: 0 1px 8px rgba(0, 0, 0, 0.08);
}

#dropdownMenuKpi .phaseHeader,
#dropdownMenuOverall .phaseHeader {
	position: relative;
}

#dropdownMenuKpi .phaseHeader, #dropdownMenuOverall .phaseHeader {
    display: grid;
    grid-template-columns: 29px 63px 0fr 84px 7px 26px;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    background: #f1f1f1;
    border-bottom: 1px solid #e5e5e5;
    cursor: pointer;
    user-select: none;
}

#dropdownMenuKpi .phaseChevron,
#dropdownMenuOverall .phaseChevron {
	font-size: 11px;
	width: 14px;
	height: 14px;
	display: inline-block;
	transform: rotate(0deg);
	transition: transform 0.2s;
	opacity: 0.7;
}

#dropdownMenuKpi .phaseChevron::before,
#dropdownMenuOverall .phaseChevron::before {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-right: 2px solid #444;
	border-bottom: 2px solid #444;
	transform: rotate(45deg);
	margin-left: 2px;
}

#dropdownMenuKpi .phaseEnabled,
#dropdownMenuOverall .phaseEnabled {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	font-size: 11px;
}

#dropdownMenuKpi .phaseNameInput,
#dropdownMenuOverall .phaseNameInput {
	width: 162px !important; 
	font-size: 12px;
	padding: 3px 6px;
	border: 1px solid #d0d0d0;
	border-radius: 4px;
	background: white;
	cursor: text;
}

#dropdownMenuKpi .phaseBitDiamInput,
#dropdownMenuOverall .phaseBitDiamInput {
	width: 70px !important;
	font-size: 11px;
	padding: 2px 4px;
	border: 1px solid #cfcfcf;
	border-radius: 4px;
	text-align: center;
	background: #fff;
}

#dropdownMenuKpi .targletLinestd {
	display: inline-flex;
	border: none;
}
#dropdownMenuKpi .targletLinesTitle{
	width: 115px !important;
	font-size: 12px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
   opacity: 1;
}

#dropdownMenuKpi .phaseRemove,
#dropdownMenuOverall .phaseRemove {
	background-color: #c0392b;
	color: #fff;
	border-radius: 4px;
	padding: 2px 8px;
	font-size: 11px;
	width: 30px;
}

#dropdownMenuKpi .phaseBody,
#dropdownMenuOverall .phaseBody {
	display: none;
	padding: 8px;
	background: #f2f2f2;
}

#dropdownMenuKpi .phaseCard.expanded .phaseChevron,
#dropdownMenuOverall .phaseCard.expanded .phaseChevron {
	transform: rotate(-90deg);
}

#dropdownMenuKpi .phaseCard.expanded .phaseBody,
#dropdownMenuOverall .phaseCard.expanded .phaseBody {
	display: block;
}

#dropdownMenuKpi .phaseRow,
#dropdownMenuOverall .phaseRow {
	display: flex;
	gap: 12px;
	align-items: center;
	margin: 4px 0;
	flex-wrap: wrap;
}

#dropdownMenuKpi .phaseRow label,
#dropdownMenuOverall .phaseRow label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	font-size: 11px;
}

#dropdownMenuKpi .phaseRow input[type="datetime-local"],
#dropdownMenuOverall .phaseRow input[type="datetime-local"],
#dropdownMenuKpi .phaseRow input[type="number"],
#dropdownMenuOverall .phaseRow input[type="number"],
#dropdownMenuKpi .phaseRow input[type="text"],
#dropdownMenuOverall .phaseRow input[type="text"] {
	font-size: 11px;
	padding: 2px 4px;
	height: 22px;
}

#dropdownMenuKpi .targetsRow span,
#dropdownMenuOverall .targetsRow span {
	opacity: 0.8;
}

#dropdownMenuKpi .bitDiamUnit,
#dropdownMenuOverall .bitDiamUnit {
	font-size: 11px;
	opacity: 0.7;
	margin-left: -6px;
}
/* HEADER COLLAPSABLE */
#chartDropdownContent {
	min-width: 463px;
}
#chartDropdownContent .section-title {
    cursor: pointer;
    background: #f05530;
    color: #fff;
}

/* Effet visuel quand fermé */
#chartDropdownContent .section-title.collapsed td {
    opacity: 0.8;
}

/* Chevron — version CSS (pas utf8) */
#chartDropdownContent .section-title td::after {
    content: "";
    float: right;
    width: 0;
    height: 0;
    margin-right: 6px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 7px solid #fff; /* ▼ */
}
/* Chevron fermé */
#chartDropdownContent .section-title:not(.collapsed) td::after {
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 0;
    border-right: 7px solid #fff; /* ◄ */
}

/* pour permettre sticky Apply */
#chartDropdownContent {
    position: relative;
}
#dropdownMenuKpi .activitiesGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;  /* 2 colonnes */
    gap: 4px 12px;
}

#dropdownMenuKpi .activityItem {
    font-size: 11px;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}


/* Wrapper pour le bouton */
#applyChartConfigRow {
    position: sticky;
    bottom: 0;
    background: #f1f1f1;
    z-index: 20;
    padding-top: 6px;
    padding-bottom: 6px;
    border-top: 1px solid #ccc;
}


#svgdropdownlts {
	left: 49px;
	top: 1px;
}

.svgdropdown input {
	cursor: pointer;
	text-align: center;
}

.svgdropdown-content {
	display: none;
	position: absolute;
	background-color: #f1f1f1;
	min-width: 400px;
	overflow: auto;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 14;
	max-height: 800px;
}

.svgdisabled {
	color: #cdcdcd;
}

.svgdropdown-content li {
	color: black;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
}

.svgdropdown li:hover {
	background-color: #ddd;
}

.svgdropdown table {
	width: 100%;
	border-collapse: collapse;
}

.svgdropdown tr {
	border: 1px solid #ddd;
}

.svgdropdown td,
.svgdropdown th {
	border: 1px solid #ddd;
	padding: 4px;
}

.svgdropdown .tdlabel {
	border-right: 1px solid #ddd;
	min-width: 102px;
}
.svgdropdown .overallmenusettings{
	margin-left: 80px;
}

.svgdropdown tr:nth-child(even) {
	background-color: #f2f2f2;
}

.svgdropdown tr:hover {
	background-color: #ddd;
}

.depthprogresstoggle {
	position: absolute;
}

.show {
	display: block;
}

.icon_wait .icon_wait_layer {
	animation: 0.8s linear infinite;
}

.icon_wait .icon_wait_layer1 {
	animation-name: layer1;
}

.icon_wait .icon_wait_layer2 {
	animation-name: layer2;
}

.icon_wait .icon_wait_layer3 {
	animation-name: layer3;
}

/*Sliders handle*/

#slider-range span:nth-of-type(1) {
	margin-top: 10px;
	border-left: 0.6em solid transparent !important;
	border-right: 0.6em solid transparent !important;
	border-bottom: 1.2em solid #f05530 !important;
}

#slider-range span:nth-of-type(1):active,
#slider-range span:nth-of-type(1):hover {
	border-bottom: 1.2em solid #327bcb !important;
}

#slider-range span:nth-of-type(2):active,
#slider-range span:nth-of-type(2):hover {
	border-top: 1.2em solid #327bcb !important;
}

#slider-range span:nth-of-type(2) {
	margin-top: -10px;
	border-left: 0.6em solid transparent !important;
	border-right: 0.6em solid transparent !important;
	border-top: 1.2em solid #f05530 !important;
}

#slider-range .ui-state-default,
#slider-range .ui-widget-content .ui-state-default,
#slider-range .ui-widget-header .ui-state-default,
#slider-range .ui-button,
html #slider-range .ui-button.ui-state-disabled:hover {
	border: 0 !important;
	background: transparent !important;
	width: 0 !important;
	height: 0 !important;


}

#slider-rangeV .ui-state-default,
#slider-rangeV .ui-widget-content .ui-state-default,
#slider-rangeV .ui-widget-header .ui-state-default,
#slider-rangeV .ui-button,
html .slider-rangeV .ui-button.ui-state-disabled:hover {
	border: 0 !important;
	background: transparent !important;
	width: 0 !important;
	height: 0 !important;
	border-left: 1.2em solid #f05530 !important;
	border-top: 0.6em solid transparent !important;
	border-bottom: 0.6em solid transparent !important;
}

.ui-state-default:hover,
.ui-state-default:active .ui-widget-content .ui-state-default:hover,
.ui-widget-content .ui-state-default:active,
.ui-widget-header .ui-state-default:hover,
.ui-widget-header .ui-state-default:active,
.ui-button:active,
html .ui-button.ui-state:active {
	border-bottom: 1.2em solid #327bcb !important;
}

.ui-slider-vertical .ui-slider-handle {
	left: -0.1em !important;
	margin-left: 0;
	margin-bottom: -0.6em;
}

/*Two factor auth*/
#tfaactivatesubmitbtn,
#tfacodesubmitbtn,
#tfadesactivatesubmitbtn {
	width: 100px;
	margin-top: 10px;
	margin-bottom: 10px;
}

#sendtfamailbutton {
	display: block;
	float: right;
	height: 40px;
	width: 40px;
	cursor: pointer;
	margin-top: 3px;
	margin-right: 5px;
	text-align: center;
	text-shadow: 1px 1px 1px black;
}

#sendtfamailbutton::after {
	content: '\f0e0';
	font-style: normal;
	font-family: exlogfont;
	font-size: 36px;
	color: #f05530;
}

#tfasubmitmsgemail {
	text-shadow: 1px 1px 1px black;
	cursor: pointer;
}

#tfamaildiv {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
}

.rotatingtfa {
	transform-origin: px px;
	-webkit-animation: rotating 1s ease-in-out infinite;
	-moz-animation: rotating 1s ease-in-out infinite;
	-ms-animation: rotating 1s ease-in-out infinite;
	-o-animation: rotating 1s ease-in-out infinite;
	animation: rotating 1s rotating 1s ease-in-out infinite;
}

/* ELIS */
#Elisimagesrc,
#Elisimagesrc_zoom {
	border: 1px solid;
}

#Elisimagesrc_zoom_global {
	display: inline-flex;
	flex-direction: column;
}

#Elisimagesrc_zoom .loading-progress {
	position: absolute;
	display: none;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: rgba(255, 255, 255, 0.8);
	padding: 10px;
	border-radius: 5px;
	font-size: 16px;
	font-weight: bold;
	color: #333;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	z-index: 999;
	/* Ensure the progress element is above other content */
}

.ElisButton {
	position: absolute;
	color: #13c313;
	display: block;
	padding: 6px;
	display: none;
	z-index: 999;
}

#elis-chart-switch-light,
#elis-chart-switch-toggle {
	position: absolute;
	z-index: 999;
}

#elis-chart-switch-light label,
#elis-chart-switch-toggle label {
	font-size: 9px !important;
	padding: 4px 7px !important;
}

#ElisToggleQuality {
	box-shadow: inset 0px 39px 0px -24px #e67a73;
	background: linear-gradient(to bottom, #e85e3b 5%, #e85e3b 100%);
	background-color: #e85e3b;
	border-radius: 4px;
	border: 1px solid #ffffff;
	display: inline-block;
	cursor: pointer;
	color: #ffffff;
	padding: 4px 8px;
	text-decoration: none;
	text-shadow: 0px 1px 0px #b23e35;
}

#Elisinfo-container,
#Elisselection-container {
	border-radius: 4px;
	border: 1px solid;
}

#Elisinfo-container {
	min-width: 125px;
	overflow-y: auto;
	border: 0;
	padding: 2px;
}

#Elisinfo-container #Elisinfo-container-Header {
	display: flex;
	justify-content: space-between;
	line-height: 8px;
	position: relative;
	padding: 0px;
	/* max-height: 30px; */
	min-height: 30px;
	flex-direction: column;
}

#Elisinfo-container #Elisinfo-container-Header-Desc-Top,
#Elisinfo-container #Elisinfo-container-Header-Desc-Bottom {
	display: flex;
	justify-content: space-between;
}

#Elisinfo-container-Header-Desc-Bottom {
	margin-top: 4px;
}

#Elisinfo-container #Elisinfo-container-Header-Desc-Left {
	display: inline-flex;
	min-width: 190px;
}

#Elisinfo-container #Elisinfo-container-Header-Desc-Right {
	display: inline-flex;
	justify-content: flex-end;
}

#Elisinfo-container #notification-number-Desc {
	background-color: rgb(102 102 102);
	top: -3px;
}

#Elisinfo-container-Header #spanTitleDesc,
#spanSampleDepthDesc {
	font-size: 16px;
	font-weight: 700;
	line-height: 15px;
	padding: 7px 5px 6px 0px;
}

#spanSampleDepthDesc {
	color: #e8532e;
	/*margin-right: 5px;*/
	padding-right: 0px;
}

#Elisinfo-container-Header #spanTitleLcm {
	font-size: 12px;
	font-weight: 400;
	line-height: 15px;
	cursor: pointer;
	text-decoration: underline;
}

#Elisinfo-container p {
	display: flex;
	font-size: 12px;
	margin-bottom: 1px;
	margin: 5px 0px;
	width: 100%;
	overflow-x: auto;
}

#Elisinfo-container p.category-title {
	/* Title */
	display: inherit;
	position: relative;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	color: #fff !important;
	background-color: #e65c41 !important;
	cursor: pointer;
	margin: 0;
	padding: 8px 0px;
}

#Elisinfo-container p.category-title-cuttings {
	background-color: darkblue !important;
}

#Elisinfo-container p.category-title-gear {
	background-color: #666565 !important;
}

/* Alternating background colors for paragraphs */
#Elisinfo-container p:nth-child(odd) {
	background-color: #ffffff;
	/* Background color for odd paragraphs */
	color: #333;
	/* Text color for odd paragraphs */
}

#Elisinfo-container p:nth-child(even) {
	background-color: #e0e0e0;
	/* Background color for even paragraphs */
	color: #555;
	/* Text color for even paragraphs */
}

#Elisinfo-container p span.property {
	flex: 0 0 122px;
	/* Adjust the width as needed */
	font-weight: bold;
	line-height: 20px;
}

#Elisinfo-container p span.value {
	flex-grow: 1;
	word-wrap: break-word;
	line-height: 20px;
}

#Elisinfo-container p .color-item,
#geartooltipdesc p .color-item {
	white-space: nowrap;
	/* Prevents line break inside color items */
}

#Elisinfo-container .color-preview,
#geartooltipdesc .color-preview {
	display: inline-block;
	width: 15px;
	height: 15px;
	border: 1px solid #000;
	vertical-align: middle;
	margin-right: 5px;
	position: relative;
	/* Set position to relative for pseudo-elements */
}

#geartooltipdesc .color-preview {
	float: right;
}

#Elisinfo-container .color-preview.other {
	background-color: transparent;
	/* Make background transparent for dot effect */
	background-image: radial-gradient(circle, #000 1px, transparent 1px);
	/* Dots pattern */
	background-size: 3px 3px;
	/* Size of the dots */
}

#Elisinfo-container .color-preview.other::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

#Elisinfo-container .miniature-container {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
}

#Elisinfo-container .miniature-container .image-container {
	text-align: center;
	/* Center the content within each image container */
	cursor: pointer;
	width: 100px;
	padding: 3px;
}

#Elisinfo-container .miniature-container img {
	max-width: 100px;
	/*margin: 0 5px;*/
}

#Elisinfo-container .miniature-container .miniature-title {
	display: block;
	/* Ensure the title appears on a new line */
	font-size: 11px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#Elisinfo-container p.nobg {
	display: flex;
	flex-direction: column;
	position: relative;
}

#Elisinfo-container span.innerSpan {
	display: flex;
	margin: 5px 0px;
}

#Elisinfo-container .toggle-arrow {
	cursor: pointer;
	transition: transform 0.3s ease;
	position: absolute;
	right: 7px;
}

#Elisinfo-container .elementCart {
	margin: 10px 0px 10px 0px;
	border: 1px solid #5d5d5d;
	overflow: hidden;
	border-radius: 3px
}

#Elisinfo-container .elementCart .white-circle {
	/*display: inline-block;*/
	position: absolute;
	top: 35%;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: white;
	margin: 0px 5px;
	animation: blinker 1s infinite;
}

.elementCart .litho-symbol-Desc {
	position: absolute;
	left: 6px;
	width: 26px;
	top: 6px;
	height: 22px;
}

#ElisAlert_content,
#ElisAlert_content table,
#ElisAlert_content td {
	background-color: #FFFFFF !important;
}

#Elisinfo-container .toggle-arrow {
	transform: rotate(90deg);
}

.Elisinfo-content-wrapper {
	/*width: 100%;*/
}

#Elisinfo-container .Elisinfo-content-wrapper {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
	/* Adjust timing and easing as needed */
	padding: 0px 10px;
}


#Elisimg-container,
#Elisselection-container {
	padding: 0;
}

#Elisselection-container {
	overflow: hidden auto;
	scrollbar-width: thin;
	border: 0;
	margin-top: -6px;
}

/* Chrome Safari*/
#Elisselection-container::-webkit-scrollbar {
	width: 10px;
	/* Adjust the width as needed */
}

.Elis_div_list_element {
	margin: 10px 5px;
	width: 175px;
	/* min-height: 70px; */
	/* padding-bottom: 5px; */
	cursor: pointer;
	border: 1px solid #616163;
	border-radius: 10px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 3px;
	line-height: 16px;
}

.Elis_div_list_element:hover {
	background-color: #616163;
	color: #ffffff;
}

.Elis_div_list_element_selected {
	background-color: #e85e3b;
	color: #ffffff;
}

.Elis_div_list_element h4 {
	margin: 0px;
}

.Elis_div_list_element_img {
	position: relative;
	display: inline-block;
}

.Elis_div_list_element_details {
	margin-left: 2%;
	margin-top: 5px;
	float: left;
	height: auto;
	width: 65px;
}

.Elis-notification-icon {
	/*position: absolute;
	top: 5px;
	right: -5px;*/
	margin-top: 3px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: none;
	animation: blinker 1s infinite;
	/* Blinking animation */
}

.Elis-notification-icon:after {
	content: '\f0f3';
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	color: rgb(255, 89, 0);
}

.Elis_div_list_element_img .Elis-notification-icon {
	position: absolute;
	top: 3px;
	left: 1px;
}

#notificationIconDesc {
	display: none;
	cursor: pointer;
	position: relative;
	animation: inherit;
}

#notificationIconDesc:after {
	content: '\f0f3';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	/*color: rgb(255, 89, 0);*/
	color: rgb(102 102 102);
}

.elis_alert_select,
.elis_alert_percent {
	width: 65px !important;
}

.elis_alert_percent {
	padding: 5px 1px;
	box-shadow: none;
	/* background: transparent; */
	background-image: none;
	-webkit-appearance: none;
	border-style: solid;
	border-width: thin;
	text-align: center;
	border: 1px solid #ccc;
	border-radius: 8px;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
	transition: border-color 0.2s ease-in-out;
}

input.elis_alert_percent[type="number"]:focus {
	outline: none;
	border-color: #66afe9;
	/* Change border color on focus */
	box-shadow: 0 0 5px rgba(102, 175, 233, 0.6);
	/* Add a subtle box shadow on focus */
}

#FilterDepthRangeMin,
#FilterDepthRangeMax {
	width: 75px !important;
}

/* Style for the summary element inside the ElisAlert_content div */
#ElisAlert_content summary {
	font-weight: bold;
	color: #333;
	cursor: pointer;
	padding: 10px;
	/* Add padding to create space around the content */
}

/* Style for the details content inside the ElisAlert_content div */
#ElisAlert_content details {
	/*border: 1px solid #ddd;
	border-radius: 8px;*/
	margin: 10px 10px;
}

/* Style for the details content when open inside the ElisAlert_content div */
#ElisAlert_content details[open] {
	/*background-color: #f9f9f9;
	border: 1px solid #aaa;*/
}

/* Style for the Save button */
#ElisAlert_content .table-save-button,
#surveyDialog .table-save-button {
	text-align: right;
	/* Align the button to the right within the cell */
}

#ElisAlert_content .table-save-button a.button {
	background-color: #FFFFFF;
}

#ElisAlert_content .table-save-button a.button:hover,
#surveyDialog .table-save-button a.button {
	background-color: #e76851;
	color: #FFFFFC;
}

#ElisAlert_content .toggle-container {
	position: relative;
	margin-top: -6px;
	margin-left: 2px;
}

#ElisAlert_content .toggle-checkbox {
	display: none;
}

#ElisAlert_content .toggle-label {
	display: block;
	width: 30px;
	height: 15px;
	background-color: #ccc;
	border-radius: 15px;
	position: absolute;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

#ElisAlert_content .toggle-label::before {
	content: '';
	width: 13px;
	top: 1px;
	height: 13px;
	background-color: #fff;
	border-radius: 40%;
	position: absolute;
	left: 2px;
	transition: left 0.3s ease;
}

#ElisAlert_content .toggle-checkbox:checked+.toggle-label {
	background-color: #e55036;
}

#ElisAlert_content .toggle-checkbox:checked+.toggle-label::before {
	left: 14px;
}

#ElisAlert_content .theader {
	color: #e66850;
}

.ltsrocksoptions {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
}

.ltsnumberActive {
	margin: 21px 5px;
	padding: 4px 6px 4px 6px;
	color: #FFFFFF;
	background: #D6430A;
	border-radius: 4px;
	font-size: 9px;
}

details.elis_alert_details {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}

details.elis_alert_details table {
	border-collapse: collapse;
	width: 80%;
	/* Adjust the width as needed */
	margin: 0 auto;
	/* Adjust the margin as needed */
}

details.elis_alert_details th,
details.elis_alert_details td {
	/*border: 1px solid #ddd; */
	padding: 2px;
	/* text-align: center; */
	min-width: 10px;
}

details.elis_alert_details td.title {
	width: 200px;
}

details.elis_alert_details td.toggle-td {
	width: 40px;
}

.elis_zoom_button {
	position: absolute;
	color: #c3138e;
	display: block;
	padding: 6px;
	display: none;
}

.elis_palette_table {
	font-size: 0.5em;
	/*table-layout: fixed ;*/
	width: 114px;
	display: flex;
	flex-direction: column;
	text-align: center;
}

.elis_palette_table th {
	border: inherit;
	padding: 2px;
	width: 12px;
}

.elis_palette_table th:first-child {
	width: 25px;
}

.elis_palette_table td {
	width: 25px;
	font-size: 1.4em;
}

.elis_palette_table td:not(:first-child) {
	border: 0px solid #e8816761;
	width: 12px;
}

.elis_palette_table td.file_exist_L_DL {
	/*background: linear-gradient(to bottom, white 0% 60%, #25da25 60% 100%);*/
	color: #25da25;
}

.elis_palette_table td.file_exist_M_DL {
	/*background: linear-gradient(to bottom, white 0% 30%, #25da25 30% 100%);*/
	color: #25da25;
}

.elis_palette_table td.file_exist_H_DL {
	/*background: linear-gradient(to bottom, white 0% 0%, #25da25 0% 100%);*/
	color: #25da25;
}

.elis_palette_table td.file_exist_H_DL::before,
.elis_palette_table td.file_exist_M_DL::before,
.elis_palette_table td.file_exist_L_DL::before {
	content: '\f05d';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #25da25;
}

.elis_palette_table td.file_exist_L {
	/*background: linear-gradient(to bottom, white 0% 60%, #0b5cd4 60% 100%);*/
	color: #0b5cd4;
}

.elis_palette_table td.file_exist_M {
	/*background: linear-gradient(to bottom, white 0% 30%, #0b5cd4 30% 100%);*/
	color: #0b5cd4;
}

.elis_palette_table td.file_exist_H {
	/*background: linear-gradient(to bottom, white 0% 0%, #0b5cd4 0% 100%);*/
	color: #0b5cd4;
}

.elis_palette_table td.file_exist_H::before,
.elis_palette_table td.file_exist_M::before,
.elis_palette_table td.file_exist_L::before {
	content: '\f1ce';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #0b5cd4;
}

.elis_palette_table td.file_notexist_L {
	/*background: linear-gradient(to bottom, white 0% 60%, #da4625 60% 100%);*/
	color: #da4625;
}

.elis_palette_table td.file_notexist_M {
	/*background: linear-gradient(to bottom, white 0% 30%, #da4625 30% 100%);*/
	color: #da4625;
}

.elis_palette_table td.file_notexist_H {
	/*background: linear-gradient(to bottom, white 0% 0%, #da4625 0% 100%);*/
	color: #da4625;
}

.elis_palette_table td.file_notexist_L::before,
.elis_palette_table td.file_notexist_M::before,
.elis_palette_table td.file_notexist_H::before {
	content: '\f05c';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #da4625;
}

.elis_palette_table td.file_pending_L {
	/*background: linear-gradient(to bottom, white 0% 60%, #da4625 60% 100%);*/
	background: #e0e0e0;
}

.elis_palette_table td.file_pending_M {
	/*background: linear-gradient(to bottom, white 0% 30%, #da4625 30% 100%);*/
	background: #e0e0e0;
}

.elis_palette_table td.file_pending_H {
	/*background: linear-gradient(to bottom, white 0% 0%, #da4625 0% 100%);*/
	background: #e0e0e0;
}

#Elisimgdisplay-container {
	min-width: 125px;
}

#Elisimgcontrol-container {
	position: relative;
	min-width: 400px;
	/* minimal to avoid collapse buttons */
	height: 37px;
	justify-content: space-between;
	background-color: rgba(255, 255, 255, 0);
	/* Initially transparent */
	transition: background-color 0.3s ease;
}

#Elisselectioncontrol-container {
	height: 30px;
}

#Elisimgcontrol-container,
#Elisselectioncontrol-container {
	padding: 0px 0px 5px;
	display: inline-flex;
	flex-direction: row;
}

#Elisimgcontrol-container #exposureslider {
	width: 50px;
	min-width: 50px !important;
	cursor: pointer;
}

#ElisExposureSliderDiv {
	background-size: calc(100%/((var(--max) - var(--min)) / var(--step)) - 2%) var(--ticksHeight);
}

#ElisExposureSliderDiv {
	margin-top: 13px;
	margin-left: 0px;
}

#exposure-tick-markers {
	bottom: -9px;
}

#exposure-tick-markers span:nth-child(2) {
	margin-left: 30px;
}

#exposureSpanTitle {
	position: absolute;
	top: -12px;
	font-size: 9px;
	left: 20.5px;
}

#exposureSpanTitle:after {
	content: '\f0eb';
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
	color: rgb(223 92 54);
}

#Elisselectioncontrol-container {
	justify-content: space-between;
}

#ElisselectioncontrolSwitch-container {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	min-width: 60px;
	min-height: 46px;
	height: 58px;
}

#ElisselectioncontrolSwitch-container label {
	padding: 3px;
}

#divelismemoryusage {
	position: absolute;
	padding: 5px 5px;
	left: 100px;
}

#divdownloadallbutton {
	/*position: absolute;
    top: 55px;
    left: 3px;*/
	cursor: pointer;
	font-size: 11px;
	margin-top: 5px;
}

#divfilterbutton {
	/*position: absolute;
    top: 5px;
    left: 3px;*/
	cursor: pointer;
	font-size: 11px;
	border: 1px solid #6C6C6C;
	padding: 3px;
	border-radius: 8px;
	width: fit-content;
	min-width: 15px;
	height: fit-content;
}

#filterValidatedStatus {
	width: 100px;
	margin-left: 10px;
}

#divfilterbutton:before {
	content: '\f0b0';
	font-style: normal;
	font-family: exlogfont;
	font-size: 18px;
	color: #5d5d5d;
}

#divfilterbutton:hover:before {
	color: #e8532e !important;
}

#divfilterbutton .spanfilterNumber {
	padding: 2px 4px 2px 4px;
	color: #FFFFFF;
	background: #D6430A;
	border-radius: 4px;
	font-size: 9px;
}

.spanmemoryusage {
	padding: 0px 5px;
}

.elis-switch-container {
	display: inline-flex;
}

@media only screen and (max-width: 1100px) {
	.elis-switch-container {
		display: inline-flex;
		align-content: space-between;
		flex-wrap: nowrap;
		/*flex-direction: column;*/
		justify-content: space-around;
	}
}

.elis-switch {
	display: flex;
	margin-left: 5px;
	flex-wrap: wrap;
	flex-direction: row;
	align-content: space-around;
}

.elis-switch input {
	position: absolute !important;
	clip: rect(0, 0, 0, 0);
	height: 1px;
	width: 1px;
	border: 0;
	overflow: hidden;
}

.elis-switch label {
	background-color: #e4e4e4;
	color: rgba(0, 0, 0, 0.6);
	font-size: 10px;
	line-height: 14px;
	text-align: center;
	padding: 5px 8px;
	/* margin-right: -1px; */
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
	transition: all 0.1s ease-in-out;
}

@media screen and (max-width: 750px) {
	.elis-switch label {
		font-size: 7px;
		padding: 3px;

	}
}

.elis-switch label:hover {
	cursor: pointer;
}

.elis-switch input:checked+label {
	background-color: #e8532e;
	box-shadow: none;
	font-weight: bold;
	color: #FFFFFF;
}

.elis-switch label:first-of-type {
	border-radius: 4px 0 0 4px;
}

.elis-switch label:last-of-type {
	border-radius: 0 4px 4px 0;
}

/* Range Zoom Elis*/
.ElisZoomSliderDiv {
	margin-left: 10px;
	--ticksThickness: 2px;
	--ticksHeight: 20%;
	--ticksColor: #3e4746;
	display: inline-block;
	background: silver;
	background: linear-gradient(to right, var(--ticksColor) var(--ticksThickness), transparent 1px) repeat-x;
	background-size: calc(100%/((var(--max) - var(--min)) / var(--step)) - 0.3%) var(--ticksHeight);
	background-position: 0 17px;
	position: relative;
}

#ElisOverlayOpacityDiv {
	width: 60px;
	margin-left: 0px;
	--ticksThickness: 0px;
	background: none !important;
}

#overlayOpacitySlider {
	min-width: 52px !important;
}

.tick-markers {
	display: flex;
	justify-content: space-between;
	position: absolute;
	width: 100%;
	bottom: -2px;
	font-size: 9px;
}

.tick-markers span {
	text-align: center;
	display: inline-block;
}

.tick-markers span:nth-child(1) {
	margin-left: -5px;
	/* Adjust the left and right margin for the first tick */
}

.tick-markers span:nth-child(2) {
	/* Adjust the left and right margin for the second tick */
}

.tick-markers span:nth-child(3) {
	/* Adjust the left and right margin for the third tick */
}

.tick-markers span:nth-child(4) {
	margin-right: -5px;
	/* Adjust the left and right margin for the fourth tick */
}

/* min / max labels at the edges */
.ElisZoomSliderDiv::before,
.ElisZoomSliderDiv::after {
	/*font: 10px monospace;
    position: absolute;
    bottom: -1ch;*/
}

.ElisZoomSliderDiv::before {
	/*content: 'X'counter(x);*/
}

.ElisZoomSliderDiv::after {
	/*content: 'X'counter(x);*/
	/*content: 'X10';*/
}


.ElisZoomSliderDiv::before {
	counter-reset: x var(--min);
	transform: translateX(-50%);
}

.ElisZoomSliderDiv::after {
	counter-reset: x var(--max);
	right: 0;
	transform: translateX(50%);
}

/*Chrome*/

.ElisZoomSliderDiv input[type='range'] {
	/*overflow: hidden;*/
	/*width: 80px;*/
	min-width: 130px !important;
	-webkit-appearance: none;
	background-color: #e4e4e4;
	height: 7px;
	cursor: pointer;
}

.ElisZoomSliderDiv input[type='range']::-webkit-slider-runnable-track {
	height: 7px;
	/*-webkit-appearance: none;*/
	color: #e65c41;
	/*margin-top: -1px;*/
}

.ElisZoomSliderDiv input[type='range']::-webkit-slider-thumb {
	width: 7px;
	-webkit-appearance: none;
	height: 13px;
	margin-top: -3px;
	cursor: pointer;
	background: #e45a46;
	/*box-shadow: -10px 0 0 10px #e65c41;*/
}

/** FF*/
.ElisZoomSliderDiv input[type="range"]::-moz-range-thumb {
	width: 7px;
	-moz-appearance: none;
	height: 13px;
	cursor: pointer;
	background: #e45a46;
	/*box-shadow: -80px 0 0 80px #e65c41;*/
}

.ElisZoomSliderDiv input[type="range"]::-moz-range-progress {
	height: 7px;
	-moz-appearance: none;
	color: #e65c41;
	margin-top: -1px;
}

.ElisZoomSliderDiv input[type="range"]::-moz-range-track {
	overflow: hidden;
	height: 7px;
	/*width: 80px;*/
	-moz-appearance: none;
	background-color: #e4e4e4;
}

/* IE*/
.ElisZoomSliderDiv input[type="range"]::-ms-fill-lower {
	background-color: #e65c41;
}

.ElisZoomSliderDiv input[type="range"]::-ms-fill-upper {
	background-color: #e4e4e4;
}

.ElisZoomSliderDiv>input {
	/*width: 300px;
	margin: 0 -6px;
	 Critical adjustment */
}

.ElisZoomSliderSpan {
	padding: 1px;
	font-weight: bold;
	position: absolute;
	top: 26px;
	left: 50%;
	transform: translate(-50%, 0%);
	font-size: 10px;
	background-color: #e85c39;
	border: 1px solid #e85c39;
	border-radius: 5px;
	color: #5c2015;
}

/*END RANGE SLIDER ZOOM*/

/* Knob slider exposure */
/* conteneur du knob */
#ElisExposureKnobDiv {
	width: 60px;
	margin-top: 8px;
}

.knob-container {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	width: 62px;
	position: relative;
}

/* demi-cercle supérieur */
.knob {
	position: relative;
	width: 43px;
	height: 25px;
	/* moitié hauteur */
	border-top-left-radius: 50px;
	border-top-right-radius: 50px;
	background: radial-gradient(circle at 50% 100%, #f5f5f5, #ccc);
	border: 2px solid #333;
	border-bottom: none;
	/* cacher la partie basse */
	overflow: hidden;
}

/* pointeur */
.knob-pointer {
	position: absolute;
	bottom: 0;
	left: 48%;
	/* toujours 50% */
	width: 4px;
	height: 30px;
	background: red;
	border-radius: 2px;
	transform-origin: bottom center;
	transform: translateX(-50%) rotate(0deg);
	/* centré */
}




/* input range invisible qui capte les interactions */
#exposureKnob {
	-webkit-appearance: none;
	appearance: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	opacity: 0;
	cursor: pointer;
	z-index: 2;
}

/* ticks */
.knob-ticks {
	position: absolute;
	top: 126%;
	left: 49%;
	width: 99px;
	height: 70px;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.knob-ticks span {
	position: absolute;
	width: 3px;
	height: 7px;
	background: gray;
	top: 0;
	left: 50%;
	/* toujours 50% */
	transform-origin: bottom center;
	transform: translateX(-50%) rotate(0deg);
	/* centré */
	border-radius: 2px;
}

.knob-ticks span.red {
	background: red;
	/* ticks actifs */
}

/* labels Low/High */
.knob-labels {
	display: flex;
	justify-content: space-between;
	width: 70px;
	font-size: 10px;
	margin-top: 2px;
	color: #444;
}


/* END Knob slider exposure */
.dragme {
	position: absolute;
	width: 270px;
	height: 203px;
	cursor: move;
	display: none;
	background-color: transparent;
	border: 4px solid #d21178;
}

.downloadElis {
	position: absolute;
	/* right: 50px; */
	top: 5px;
	cursor: pointer;
	left: 141px;
}

.downloadElis:after {
	content: '\f019';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #5d5d5d;
}

.img-zoom-lens {
	position: absolute;
	border: 1px solid #d4d4d4;
	/*set the size of the lens:*/
	width: 100px;
	/* Default lens size */
	height: 100px;
}

.img-zoom-lens:before {
	border: 1px solid #e85e3b;
	background: none;
	content: "";
	display: block;
	position: absolute;
	top: 0.3px;
	left: 0.3px;
	right: 0px;
	bottom: 0px;
	pointer-events: none;
}

.img-zoom-lens-span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #d4d4d4;
	text-shadow: 1px 0 #e85e3b, -1px 0 #e85e3b, 0 1px #e85e3b, 0 -1px #e85e3b,
		1px 1px #e85e3b, -1px -1px #e85e3b, 1px -1px #e85e3b, -1px 1px #e85e3b;
}

.img-zoom-result {
	/*border: 1px solid #d4d4d4;*/
	/*set the size of the result div:*/
	margin-left: 5px;
	/*background-repeat: no-repeat;*/
	position: relative;
	overflow: hidden;
}

.img-zoom-result-img {
	position: absolute;
	max-width: none;
	max-height: none;
	top: 0;
	left: 0;
	image-rendering: auto;
	/* Ensures the image is displayed with browser's default rendering */
	print-color-adjust: exact;
}

#Elisimagesrc_zoom_img_overlay {
	opacity: 0;
	transition: opacity 0.2s ease;
}

#Elisimagesrc_zoom_img_outliers {
	background: transparent;
	mix-blend-mode: screen;
	/* rend le noir transparent, garde les couleurs claires (rouge/vert) */
}

#Elisimagesrc_zoom_img_contours {
	background: transparent;
	mix-blend-mode: lighten;
	/* ou 'screen' aussi pour garder vert visible */
}

/* Conteneur pour mettre bouton + checkbox inline */
#ElisSmartDetectionDiv {
	gap: 6px;
	display: inline-flex;
	margin-left: 0px;
	--ticksThickness: 0px;
	background: none !important;
}

/* Bouton Smart Detection */
#smartDetectionBtn {
	text-transform: uppercase;
    margin-top: 6px;
    width: 76px;
    padding: 0px !important;
    height: 37px;
    background-color: #e4e4e4;
    color: rgba(0, 0, 0, 0.6);
    font-size: 11px;
    font-weight: bold;
    line-height: 14px;
    padding: 5px 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    cursor: pointer;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    transition: all 0.1s ease-in-out;
}

#smartDetectionBtn.active {
	background-color: #e8532e;
	color: #fff;
	font-weight: bold;
	box-shadow: none;
}

#outliersLabel {
	font-size: 13px;
	margin-top: 12px;
	text-transform: capitalize;
}

/* Checkbox + label */
#outliersLabel {
	/*display: inline-flex;
    align-items: center;
    font-size: 10px;
    line-height: 14px;
    background-color: #e4e4e4;
    color: rgba(0, 0, 0, 0.6);
    padding: 5px 8px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    cursor: pointer;
    user-select: none;
    transition: all 0.1s ease-in-out;*/
}

/* Effet quand cochée */
#outliersCheckbox:checked {
	background-color: #e8532e;
	color: #fff;
	font-weight: bold;
	box-shadow: none;
}


#loadingElisImage,
#progressElisDiv {
	position: absolute;
	margin-top: 3px;
	padding: 0px 5px;
	left: 102%;
	top: 2px;
}

#loadingElisImage:after {
	content: '\F110';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #e8532e;
}

#ElisCalibrate_grey {
	position: absolute;
	left: 200px;
	top: 10px;
	width: 80px;
	cursor: pointer;
	padding: 3px;
	border: 1px solid;
}

#ElisCalibrate_invert {
	position: absolute;
	left: 300px;
	top: 10px;
	width: 80px;
	cursor: pointer;
	padding: 3px;
	border: 1px solid;
}

#ElisCalibrate_custom {
	position: absolute;
	left: 400px;
	top: 10px;
	width: 80px;
	cursor: pointer;
	padding: 3px;
	border: 1px solid;
}

/*ELIS SCROLL BUTTON PREVIEW*/
#scrollCanvasElis {
	position: absolute;
	height: 50px;
	width: 50px;
}

#scrollUpCanvasElisBtn {
	background: url(../images/scrollup_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	margin: 0 2px 6px 0;
	width: 20px;
	float: left;
	cursor: pointer;
}

#scrollDwCanvasElisBtn {
	background: url(../images/scrolldw_22-20.png) no-repeat scroll 0 0 transparent;
	display: block;
	height: 22px;
	text-indent: -9999px;
	width: 20px;
	float: left;
	cursor: pointer;
}

.filter_radio_opt {
	width: inherit !important;
	display: block !important;
	position: absolute;
	width: 10px !important;
	left: 510px;
}

#filter_radio_opt1 {
	top: 0px;
}

#filter_radio_opt2 {
	top: 10px;
}

#filter_radio_opt3 {
	top: 20px;
}

.elis_filter_active {
	background-color: #FFFFFF;
	color: #e8532e;
	border: 1px solid #e8532e;
}

#activefilters {
	position: absolute;
	left: 160px;
	display: flex;
}

#activefilters .filter-label {
	display: block;
	background: #e8532e;
	color: #FFFFFF;
	padding: 5px;
	font-weight: 700;
	border: 1px solid #ededed;
	border-radius: 10px;
	margin: 0px 5px;
}

#activefilters .close-button {
	margin-left: 5px;
	cursor: pointer;
}

#activefilters .close-button:hover {
	color: red;
}

.resetRangeFilter {
	margin-top: 3px;
	padding: 0px 5px;
	left: 5px;
	top: 5px;
	cursor: pointer;
}

.resetRangeFilter:before {
	content: '\f0e2';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #e8532e;
}

.ElisDpi {
	position: absolute;
}

#ElisDpi {
	height: 40px;
	background-color: rgba(0, 0, 0, 0.5);
	box-sizing: border-box;
	border-radius: 5px;
}

#ElisDpiZ {
	height: 40px;
	cursor: -webkit-grab;
	/* Chrome 1-21, Safari 4+ */
	cursor: -moz-grab;
	/* Firefox 1.5-26 */
	cursor: grab;
	/* W3C standards syntax, should come least */
	background-color: rgba(0, 0, 0, 0.5);
	box-sizing: border-box;
	border-radius: 5px;
}

.ElisDpiRuler {
	width: 200px;
}

.ElisDpiRuler:after {
	content: ' ';
	width: calc(100% - 4px);
	display: block;
	border: 1px solid #ff3d00;
	position: absolute;
	top: 20px;
	left: 1px;
	/*outline: 1px solid #e85e3b;*/
}

@media screen and (max-width: 1000px) {

	.Rulertick {
		font-size: 7px !important;
	}

	.Rulertick:nth-child(2),
	.Rulertick:nth-child(5) {
		top: 14.5px !important;
		height: 12px !important;
	}

}

.Rulertick,
.SmallRulertick {
	border-left: 2px solid #ff3d00;
	height: 18px;
	top: 12px;
	position: absolute;
}

.SmallRulertick {
	height: 5px;
	top: 15px;
	z-index: 999;
	/*outline: 1px solid #e85e3b;*/
}

.Rulertick:nth-child(1) {
	top: -7px;
	width: 75px;
}

.Rulertick:nth-child(1),
.Rulertick:nth-child(4) {
	left: 30px;
	border: inherit;
	text-anchor: center;
	color: #ff3d00;
	font-size: 12px;
	text-align: center;
	font-weight: bold;
	/*text-shadow: 1px 0 #e85e3b, -1px 0 #e85e3b, 0 1px #e85e3b, 0 -1px #e85e3b, 1px 1px #e85e3b, -1px -1px #e85e3b, 1px -1px #e85e3b, -1px 1px #e85e3b;*/
}

.Rulertick:nth-child(2) {
	top: 12px;
	height: 18px;
	z-index: 999;
	left: 1px;
	/*outline: 1px solid #e85e3b;*/
}

.Rulertick:nth-child(3) {
	top: 9px;
	height: 10px;
	left: 1px;
	/*outline: 1px solid #e85e3b;*/
}

.Rulertick:nth-child(4) {
	top: 25px;
	width: 70px;
}

.Rulertick:nth-child(5) {
	left: calc(100% - 3px);
	z-index: 999 !important;
	/*outline: 1px solid #e85e3b;*/
	margin-left: 1px;
}

.ElisContainerMenu,
.StreamContainerMenu {
	height: 28px;
	border-bottom: 2px solid;
}

.ElisContainerMenu .btnRefresh,
.StreamContainerMenu .btnRefresh {
	position: absolute;
	padding: 0px 5px;
	left: 40px;
	top: 3px;
	cursor: pointer;
}

#ForceloadingElisBtnLTSDesc {
	top: 0px;
}

#bigLithocontainer {
	position: relative;
	display: inline-flex;
	padding: 0;
	user-select: none;
	width: 100%;
	justify-content: space-between;
}

#bigStreamContainer {
	position: relative;
	padding: 0;
	user-select: none;
}

#divselectionAndPreview {
	position: relative;
	padding: 0;
	display: flex;
	justify-content: space-between;
}

#AlertElisBtn {
	/*position: absolute;*/
	background-color: transparent;
	cursor: pointer;
	padding: 0px 5px;
	left: 45px;
	top: 5px;
}

#AlertElisBtn:after {
	content: '\F017';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5d5d5d;
}

#LogElisBtn,
#FileTransferLogBtn,
#LTSDescriptionBtn {
	position: absolute;
	cursor: pointer;
	padding: 0px 5px;
	left: 75px;
	top: 5px;
}

#FileTransferLogBtn {
	left: 105px;
}

#LTSDescriptionBtn {
	left: 140px;
}

#LogElisBtn:after {
	content: '\f0f3';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5d5d5d;
}

#FileTransferLogBtn:after {
	content: '\f0c5';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5d5d5d;
}

#LTSDescriptionBtn:after {
	content: '\f0f0';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5d5d5d;
}

#LogElisBtn.active:after,
#FileTransferLogBtn.active:after {
	color: #e65c41;
	/* Color when active */
}

.notification-number {
	position: absolute;
	top: 0;
	right: 0;
	background-color: #e65c41;
	color: #fff;
	font-size: 10px;
	padding: 1px 5px;
	border-radius: 50%;
}

.ElisContainerMenu .fa,
.StreamContainerMenu .fa {
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #5b5d5c;
	padding: 4px 8px;
}

.ElisContainerMenu .fa-refresh:after,
.StreamContainerMenu .fa-refresh:after {
	content: '\f021';
}

.ElisContainerMenu .divelissampletype {
	position: absolute;
	padding: 4px 5px;
	left: 60px;
	top: 1px;
	border: gray;
	border-style: solid;
	border-width: thin;
}

.Elis_well-info,
.Stream_info {
	position: absolute;
	right: 5px;
	top: 1px;
}

.elis-item-table {
	position: relative;
	width: 110px;
	margin-right: 6px;
}

.elis-item-caption {
	font-size: 9px !important;
	/*text-align: left !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;*/
}

.elis-item-depth {
	/*position: absolute;*/
	font-size: 11px;
	font-weight: bold;
	/*margin-right: 2px;
	right: 1px;*/
	text-align: center;
	margin-left: 7px;
}

.Elis_div_list_element_img span.statusList {
	position: absolute;
	top: 51px;
	left: 0px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #26A0BE;
	margin: 0px 2px;
}

.Elis_div_list_element_img span.validated {
	background-color: #3FAA19;
}

.Elis_div_list_element_img span.approved {
	background-color: #00FF00;
}

.Elis_div_list_element_img span.nosample {
	background-color: #c0c0c0;
}

.elis-item-status {
	font-size: 13px;
	/* position: absolute; */
	font-weight: 700;
	/* line-height: 1px; */
	top: 22px;
	bottom: 18px;
	left: 4px;
	/* text-align: center; */
	color: #26A0BE;
	padding: 7px 8px 8px 8px;
	border-radius: 4px;
	box-shadow: inset -1px -2px 2px 1px #00000040;
	background: #FFFFFC;
	margin: 4px 5px;
	height: auto;
}

.elis-item-status.validated {
	color: #3FAA19;
	height: 10px;
	background: #FFFFFC;
}

.elis-item-status.approved {
	color: #FFFFFC;
	height: 10px;
	background: #3FAA19;
}

.elis-item-status.nosample {
	color: #e8532e;
	height: 10px;
}

.elis-item-download {
	position: absolute;
	font-size: 14px;
	font-weight: bold;
	display: none;
	right: 1px;
	top: 8px;
	cursor: pointer;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	/* Add a subtle box-shadow */
}

.elis-item-download-all {
	/*position: absolute;
    padding: 0px 5px;*/
	float: left;
	font-size: 14px;
	font-weight: bold;
	margin-right: 2px;
}

.elis-item-download:after,
.elis-item-download-all:before {
	content: '\f019';
	font-style: normal;
	font-family: exlogfont;
	font-size: 16px;
	color: #5d5d5d;
}

.elis-list-number {
	font-weight: bold;
	color: #e8532e;
	/*margin-top: 33px;
    margin-left: 9px;*/
	margin-left: 5px;
	font-size: 11px;
	line-height: 25px;
}

.elis-list-number span {
	text-decoration: underline;
}

#elis-list-depth-range-min,
#elis-list-depth-range-max {
	cursor: pointer;
	text-decoration: underline;
}

#divleftcontrollselection,
#divrightcontrollselection {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	padding: 2px;
}

#divrightcontrollselection {
	width: 70px;
}

#divleftcontrollselection {
	width: 140px;
}

#divlefttopcontrollselection {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}

/* Scroll button */
#divrightcontrollselection .scroll-button {
	width: 24px;
	height: 40px;
	background-color: white;
	border-radius: 25px;
	border: 2px solid #ccc;
	position: relative;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	margin-left: 31px;
	margin-top: 3px;
}

#divrightcontrollselection .top-area,
#divrightcontrollselection .bottom-area {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	cursor: pointer;
}

#divrightcontrollselection .top-area::before,
#divrightcontrollselection .bottom-area::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
}

#divrightcontrollselection .top-area::before {
	border-bottom: 12px solid #e8532e;
}

#divrightcontrollselection .bottom-area::after {
	border-top: 12px solid #e8532e;
}

/* Hover effects */
#divrightcontrollselection .top-area:hover {
	background-color: #e0e0e0;
	border-top-left-radius: 25px;
	border-top-right-radius: 25px;
}

#divrightcontrollselection .bottom-area:hover {
	background-color: #e0e0e0;
	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
}

#divrightcontrollselection .divider {
	width: 100%;
	height: 2px;
	background-color: #ccc;
}

/* end scroll button */

.Elis_div_list_element_img:hover .elis-item-download {
	display: block;
	background-color: rgb(0, 0, 0, 0.5);
	/* Add a semi-transparent black overlay */
}

.Elis_div_list_element_img:hover .elis-item-download:after {
	color: #ffffff;
}

.elis-item-download:hover:after,
.elis-item-download-all:hover:before {
	color: #e8532e !important;
}

.elis-download-blink {
	animation: blinker 1s linear infinite;
}

@keyframes blinker {
	50% {
		opacity: 0;
	}
}

/* File trasnfer*/
.fileTransferPopup {
	display: none;
	/* Hide popup by default */
	/*position: fixed;*/
	top: 50%;
	/* Center vertically */
	left: 50%;
	/* Center horizontally */
	transform: translate(-50%, -50%);
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-radius: 5px;
	z-index: 1000;
	/* Ensure it's above other elements */
	width: 275px;
	/* Adjusted width to 600px */
	max-width: 90%;
	/* Limit width to 90% of the viewport */
	font-family: Arial, sans-serif;
	font-size: 13px;
	position: absolute;
	transform: translate3d(0, 0, 0);
	transition: transform 0.2s;
	cursor: grab;
}

.fileTransferPopup-content {
	max-height: 80vh;
	/* Limit height to 80% of viewport height */
	overflow-y: auto;
	/* Enable vertical scrolling if content exceeds max-height */
	padding: 10px;
}

.fileTransferPopup-body {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.fileTransferPopup-row {
	width: 100%;
	margin-bottom: 15px;
}

.fileTransferPopup-footer {
	margin: 0;
}

.fileTransferPopup-stats {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.fileTransferPopup-stats-footer {
	position: absolute;
	top: -10px;
	right: 0;
}

.fileTransferPopup-stats p {
	margin: 5px 10px 5px 0;
	font-size: 0.9em;
}

.fileTransferPopup-stats .ftTitle {
	width: 50px;
	display: inline-block;
}

.fileTransferPopup-stats p.header {
	font-size: 14px;
}

.fileTransferPopup-stats p.header2 {
	font-size: 13px;
}

.fileTransferPopup-stats p.header3 {
	margin-top: 15px;
	font-size: 0.8em;
}

.fileTransferPopup-stats p.footer {
	font-size: 0.8em;
	color: #cbcbcb;
	font-style: italic;
	margin: 1px;
}

#fileTransferProgressSize {
	font-weight: bold;
}

#fileTransferDSpeed,
#fileTransferUSpeed {
	margin: 5px;
}

#fileTransferDSpeedIcon:before,
#fileTransferUSpeedIcon:before {
	font-style: normal;
	font-family: exlogfont;
	font-size: 15px;
}

#fileTransferDSpeedIcon:before {
	content: '\f01a';
	color: #6afff3;
}

#fileTransferUSpeedIcon:before {
	content: '\f01b';
	color: #bf71ff;
}

.fileTransferPopup-stats strong {
	font-weight: bold;
	margin-right: 5px;
}

.fileTransferPopup-stats.column {
	flex-direction: column;
}

.fileTransferPopup-details {
	width: 100%;
	margin-top: 15px;
}

.fileTransferPopup-details h4 {
	font-size: 1.2em;
	margin-bottom: 10px;
}

.fileTransferPopup-details ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.fileTransferPopup-details li {
	margin-bottom: 5px;
	font-size: 0.9em;
}

.fileTransferPopup-close-btn {
	font-size: 29px;
	right: 7px;
	top: 3px;
}

.fileTransferPopup-status-indicator {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	margin-right: 5px;
	vertical-align: middle;
}

/* Green status indicator */
.fileTransferPopup-status-indicator.status-green {
	background-color: #4CAF50;
}

/* Blue status indicator */
.fileTransferPopup-status-indicator.status-blue {
	background-color: #0000FF;
}

/* Greuy status indicator */
.fileTransferPopup-status-indicator.status-grey {
	background-color: #a0a0a0;
}

/* Red status indicator */
.fileTransferPopup-status-indicator.status-red {
	background-color: #F44336;
}

/* Title style */
.fileTransferPopup-title {
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	color: #fff !important;
	background-color: #e65c41 !important;
	cursor: grab;
	margin: 0;
	padding: 10px 0;
}

/* Log button style */
.fileTransferPopup-log-button,
#ltstooltip .closeButton {
	padding: 14px 32px;
	border-radius: 8px;
	border: 2px solid #e76851;
	color: #e76851;
	line-height: 14px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	transition: background-color 0.3s ease;
	text-decoration: none;
	float: right;
	width: auto;
	/* Set to auto to adjust button width based on content */
	margin: 8px;
	font-family: inherit;
}

#ltstooltip .closeButton {
	background-color: #FFFFFF;
	width: 110px;
	margin: 0 auto;
}

.fileTransferPopup-log-button:hover,
#ltstooltip .closeButton:hover {
	background-color: #e76851;
	color: #FFFFFC;
}

#ltsmodal,
#ltstooltip {
	display: none;
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	overflow: auto;
}

#ltsmodal-content,
#ltstooltip-content {
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: #fff;
	border-radius: 5px;
	width: 800px;
	max-width: 100%;
	max-height: 100%;
}

#ltsmodal-img {
	max-width: 800px;
	height: auto;
	display: block;
	margin: 0 auto;
	cursor: pointer;
}

#ltsmodal-link {
	position: relative;
	min-width: 800px;
	min-height: 533px;
	background-color: transparent;
}

#collapse-content {
	display: none;
	height: 0;
	overflow: hidden;
	transition: height 1s ease;
	padding: 20px;
}

#collapse-content.open {
	display: block;
	height: auto;
}

#collapse-content h4 {
	margin: 10px 0;
}

#collapse-content p {
	margin: 10px 0;
}

#collapse-content img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 10px 0;
}

.collapse-toggle {
	color: #c85d33;
	cursor: pointer;
	font-weight: bold;
	margin: 20px;
}

.collapse-arrow {
	display: inline-block;
	transition: transform 0.3s ease;
}

.Elisinfo-content-wrapper .rockImage {
	cursor: pointer;
	width: 30px;
	position: absolute;
	right: calc(100% - 265px);
	top: 10px;
}

.Elisinfo-content-wrapper .rockImageSort {
	width: 50%;
	height: 75px;
	cursor: pointer;
}

#ltsmodal #divDepthText {
	position: absolute;
	border: inherit;
	color: #c85d33;
	font-size: 14px;
	text-align: center;
	font-weight: bold;
	top: 4px;
	left: 10px;
}

#highlightRock {
	position: absolute;
	width: 134px;
	height: 135px;
	background-color: rgba(255, 0, 0, 0.2);
}

.modal-content {
	transition: all 0.5s ease;
	/* Smooth transition for resizing and repositioning */
}

#ltstooltip-content {
	overflow: hidden auto;
}

#ltstooltipTitle {
	color: #D6430A;
	font-weight: 700;
	font-size: 24px;
}

.ltstooltipContent {
	display: flex;
	padding: 20px;
	flex-direction: column;
}

.ltstooltipTextContent {
	padding-bottom: 30px;
}

#ltstooltipDesc {
	text-align: center;
	display: inline-flex;
}

#ltsimgDesc {
	width: 600px;
	height: auto;
	margin: 0 auto;
}

#ltstooltipTitle2 {
	text-align: left;
	color: #D6430A;
	font-weight: 700;
	font-size: 18px;
}

#ltsimgDesc2 {
	width: 100px;
}

#ltstextDesc,
#ltstextDesc2 {
	text-align: left;
}

/* Survey */
#surveyDialog {
	display: block;
	z-index: 99999;
	width: auto;
	position: absolute;
	top: 4%;
	left: 50%;
	transform: translateX(-50%);
	cursor: default;
	width: 410px;
	border-radius: 10px;
}

#surveyDialog img {
	width: fit-content;
	margin: 0 auto;
}

#surveyDialog #firstP {
	font-size: 15px;
	font-weight: bold;
	margin-left: 15px;
	margin-bottom: 15px;
}

#surveyDialog #secondP {
	font-size: 15px;
	margin-left: 15px;
}

#surveyDialog .fileTransferPopup-row {
	margin-bottom: 0px;
}

#surveyDialog .fileTransferPopup-title {
	text-align: left;
	border-top-right-radius: 9px;
	border-top-left-radius: 9px;
}

#surveyDialog .fileTransferPopup-title span {
	margin-left: 10px;
}

/*Stream*/
.stream-control-btn {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	border: none;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 20;
	transition: background 0.2s ease-in-out;
}

.stream-control-btn:hover {
	background: rgba(255, 255, 255, 0.2);
}

.stream-control-btn i {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 16px;
	color: #fff;
}

/* état par défaut (agrandir) */
.stream-control-btn .fa-expand:after {
	content: '\f065';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #ffffff;
}

/* état réduit (compress) */
.stream-control-btn .fa-compress:after {
	content: '\f066';
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #ffffff;
}

/*KPI */
/* === CONTAINER PRINCIPAL === */
#overaldepthprogress {
	width: 100%;
}
#overaldepthprogress tr.kpiTRmenu{
	/* border: none; */
}
#chartSwitcher,#phaseSwitcher{
	margin-top: 3.4px;
    box-shadow: inherit;
}
#shiftStartSelector,#chartSwitcher,#phaseSwitcher{
	background: #f8f8f8 url("data:image/svg+xml;utf8,<svg fill='%23615f5f' height='18' width='14' xmlns='http://www.w3.org/2000/svg'><path d='M4 7l3 3 3-3z'/></svg>") no-repeat right 6px center;
	background-color: #ececec;
	box-shadow: inherit;
}
#chartSwitcherLabel,
#phaseSwitcherLabel {
	font-weight: bold;
	margin-right: 5px;
	margin-left: 5px;
	color: #000000;
}
#phaseSwitcherLabel{
	margin-left: 25px;
}
#overaldepthprogress #overaldepthprogressMain,
#overaldepthprogress #overaldepthprogressKPI {
	width: 100%;
}

#overaldepthprogressMain,
#overaldepthprogressKPI {
	/*transition: height 0.3s ease;*/
}


/* === KPI WRAPPER (visibilité + animation) === */
#overaldepthprogressKPI {
	gap: 10px;
	/*padding: 10px;*/
	box-sizing: border-box;

	opacity: 0;
	/*  transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease; */
}

#overaldepthprogressKPI.visible {
	opacity: 1;
	/* transform: translateY(0); */
}

#overaldepthprogressKPI.hidden {
	display: none;
}


/* === GROUPE DE CHARTS (layout interne) === */
#overaldepthprogressKPI .kpi-group {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 100%;
	overflow: hidden;
}


/* === KPI LAYOUT: LEFT & RIGHT === */
#overaldepthprogress .kpi-left,
#overaldepthprogress .kpi-right {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

#overaldepthprogress .kpi-right {
	gap: 0px;
}

/* === CHART TOP (histogram) === */
#overaldepthprogress .kpi-left>div:first-child {
	/*flex: 3;  */
	/* partie haute */
	min-height: 0;
	/* évite débordements */
}


/* === PIE + TABLE (bas gauche) === */
#overaldepthprogress .kpi-left .pie-table-container {
	/*  flex: 2;   */
	/* partie basse */
	min-height: 0;
	display: flex;
	flex-direction: row;
	/*gap: 10px;*/
}


/* === PIE ET TABLE: style flex centré === */
#overaldepthprogress .pie-container,
#overaldepthprogress .table-container {
	flex: 1;
	/*display: flex;*/
	justify-content: center;
	align-items: center;
}

#overaldepthprogress .pie-container {
	overflow-y: hidden;
}

#overaldepthprogress .table-container {
	overflow-y: hidden;
}

/* === TABLEAU KPI === */
#overaldepthprogress .table-container table {
	width: 100%;
	border-collapse: collapse;
	font-size: 11px;
}

#overaldepthprogress table td.title {
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	background: #f05530;
	text-transform: uppercase;
}

#overaldepthprogress .table-container th,
#overaldepthprogress .table-container td {
	border: 1px solid #aaa;
	padding: 1px 6px;
	/* réduit les marges internes */
	line-height: 1.2;
	/* hauteur réduite */
	height: 15px;
}

#overaldepthprogress .table-container th {
	background-color: #e0e0e0;
}

#overaldepthprogress .canvas-container {
	position: relative;
	width: 100%;
	height: 100%;
}

/* Bouton principal (icône de download) */
#overaldepthprogress .downloadKPI {
	position: absolute;
	right: 5px;
	top: 51px;
	cursor: pointer;
	z-index: 1001;
	/* au-dessus du dropdown */
	display: none;
	/* caché par défaut */
}

#overaldepthprogress .downloadKPI:after {
	content: '\f019';
	/* Icône fontawesome ou exlogfont */
	font-style: normal;
	font-family: exlogfont;
	font-size: 22px;
	color: #999a9a;
}

/* Hover autorisé seulement si la classe allow-download est présente */
#overaldepthprogress.allow-download .canvas-container:hover .downloadKPI {
	display: block;
}

/* Par défaut caché */
#overaldepthprogress .downloadKPI {
	display: none;
}

/* Dropdown caché par défaut */
#overaldepthprogress .export-dropdown {
	position: absolute;
	top: 50px;
	/* sous le bouton */
	right: 27px;
	display: none;
	background: white;
	border: 1px solid #ccc;
	z-index: 1000;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

#overaldepthprogress .export-dropdown button {
	display: block;
	width: 100%;
	color: #666666;
	padding: 6px 12px;
	background: none;
	border: none;
	text-align: left;
	cursor: pointer;
}

#overaldepthprogress .export-dropdown button:hover {
	background-color: #f0f0f0;
}


#overaldepthprogress .custom-legend {
	display: inline-flex;
	position: absolute;
	top: 3px;
	left: 50px;
	/* background: rgba(255, 255, 255, 0.85); */
	padding: 6px 5px 6px 0px;
	border-radius: 6px;
	font-size: 13px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
	z-index: 10;
	flex-direction: row;
}

#overaldepthprogress .custom-legend-item {
	display: flex;
	align-items: center;
	margin-left: 6px;
}

#overaldepthprogress .custom-legend-color {
	width: 14px;
	height: 14px;
	margin-right: 6px;
	border-radius: 3px;
}

#overaldepthprogress .custom-legend-right {
	display: inline-flex;
	position: absolute;
	top: 4px;
	left: inherit;
	right: 12px;
	padding: 6px 5px 6px 10px;
	border-radius: 6px;
	font-size: 13px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
	z-index: 10;
	flex-direction: row;
}

#overaldepthprogress .custom-legend-item span {
	font-size: 12px;
	white-space: nowrap;
}

#overaldepthprogress .custom-legend-vertical {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 10px;
	border-radius: 6px;
	font-size: 13px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
	max-width: 220px;
	left: 50px;
}

.custom-legend-vertical .legend-row {
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 6px;
	font-family: sans-serif;
}

.custom-legend-vertical .legend-color {
	width: 14px;
	height: 14px;
	margin-right: 6px;
	border-radius: 3px;
	flex-shrink: 0;
}

.custom-legend-vertical .legend-label {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.custom-legend-vertical .legend-value,
.custom-legend-vertical .legend-percent {
	width: 50px;
	text-align: right;
	font-weight: bold;
	flex-shrink: 0;
}

.custom-legend-vertical .legend-total {
	border-top: 1px solid #ccc;
	margin-top: 8px;
	padding-top: 4px;
	width: 100%;
	font-weight: bold;
	display: flex;
	justify-content: space-between;
}


#overaldepthprogress .custom-chart-title {
	position: absolute;
	top: 4px;
	left: 50%;
	transform: translateX(-50%);
	font-weight: bold;
	font-size: 15px;
	color: #333;
	z-index: 11;
	padding: 4px 8px;
	border-radius: 5px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
	pointer-events: none;
	/* évite que ça bloque les clics */
}
#overaldepthprogress .custom-chart-title-pie{
	left: inherit;
    transform: inherit;
    right: 20px;
}
#overaldepthprogress #pieKpiRange{
	position: absolute;
    right: 50px;
    top: 37px;
    font-weight: bold;
}
#overaldepthprogress .chart-overlay {
    position: absolute;
    top: 7px;
    left: 100px;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
    font-size: 16px;
    /* color: #444; */
    pointer-events: none;
}

#overaldepthprogress .spinner {
	border: 4px solid #f3f3f3;
	border-top: 4px solid #3498db;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	animation: spin 1s linear infinite;
	margin-bottom: 10px;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

#dropdownMenuKpi .svgdropdown-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
}

#dropdownMenuKpi .svgdropdown-content td {
	padding: 4px 6px;
	vertical-align: middle;
	min-width: 118px;
	position: relative;
}

#dropdownMenuKpi .tdlabel {
	font-weight: bold;
	text-align: left;
	width: 144px;
	white-space: nowrap;
}

#dropdownMenuKpi input[type="number"],
#dropdownMenuKpi input[type="text"] {
	width: 96px;
	padding: 2px;
	font-size: 11px;
	border: 1px solid #d0d0d0;
    border-radius: 4px;
    cursor: text;
}
#dropdownMenuKpi .targetLineValue{
	width: 50px !important;
}
#dropdownMenuKpi  .buttonsettarget{
	width: 113px;
    margin-left: 20px;
}
#dropdownMenuKpi input[type="color"] {
	width: 22px;
	height: 22px;
	padding: 0;
	border: none;
}

#dropdownMenuKpi span {
	font-size: 11px;
	margin-left: 4px;
	white-space: nowrap;
}

#dropdownMenuKpi .crewSettings {
	/* display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: flex-start;
	position: relative; */
}

#dropdownMenuKpi .button {
	padding: 2px 6px;
	font-size: 11px;
}

#dropdownMenuKpi #addCrewRow .button,
#dropdownMenuOverall #addPhaseRowOverall .button,
#dropdownMenuKpi #addPhaseRow.button,
#dropdownMenuOverall #addPhaseRowOverall.button {
	width: 90px;
	margin-top: 4px;
}

#dropdownMenuKpi tr.title td {
	background-color: #f2f2f2;
	font-weight: bold;
	text-align: center;
	padding: 4px;
	font-size: 12px;
}

/* Checkbox styling */
#dropdownMenuKpi label {
	font-size: 11px;
	display: flex;
	align-items: center;
	gap: 6px;
}
/*KPI RESIZE DIFFERENT WIDTH*/
@media (max-width: 1600px) {
    #overaldepthprogress .custom-chart-title{
		font-size: 12px;
	}
	#overaldepthprogress .custom-chart-title-pie {
		left: inherit;
		transform: inherit;
		right: 7px;
		top: 0px;
	}
	#overaldepthprogress #pieKpiRange {
		right: 16px;
		top: 22px;
		font-size: 10px;
	}
	#overaldepthprogress #pieLegendContainer {
		left: 2px;
		font-size: 10px;
	}
	#kpiPieContainer .downloadKPI {
		right: 15px !important;
        top: 36px !important;
	}
}

@media (max-width: 1450px) {
	#overaldepthprogressKPI .kpi-group {
		flex-direction: column;
		overflow-y: scroll;
	}

	#overaldepthprogress .kpi-left,
	#overaldepthprogress .kpi-right {
		width: 100%;
	}
	#overaldepthprogress .kpi-right {
		border-top: 5px solid #f5f5f5;
	}
	#overaldepthprogress .kpi-left .pie-table-container {
		flex-direction: column;
	}

	#overaldepthprogress .pie-container,
	#overaldepthprogress .table-container {
		width: 100%;
	}
	#overaldepthprogress .custom-chart-title{
		font-size: 12px;
	}
	#overaldepthprogress .custom-chart-title-pie {
		left: inherit;
		transform: inherit;
		right: 7px;
		top: 0px;
	}
	#overaldepthprogress #pieKpiRange {
		right: 16px;
		top: 22px;
		font-size: 10px;
	}
	#overaldepthprogress .custom-legend-item span {
		font-size: 10px;
		white-space: nowrap;
	}
	#overaldepthprogress .downloadKPI {
		right: 15px;
	}
	#kpiPieContainer .downloadKPI {
		right: 15px !important;
        top: 36px !important;
	}
	.kpi-right .downloadKPI {
		right: 3px !important;
	}
}

/* ===== KPI Comment Edit Panel ===== */
#kpiCommentPanel {
	position: absolute;
	display: none;
	background: #fff;
	border: 1px solid #ccc;
	padding: 14px;
	z-index: 9999;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	width: 375px;
	font-family: "Segoe UI", Arial, sans-serif;
	font-size: 14px;
	box-sizing: border-box;
}

#kpiCommentPanel .kpiCommentPanel__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 10px;
}

#kpiCommentPanel h3 {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
}

#kpiCommentPanel .kpiCommentPanel__hint {
	font-size: 12px;
	opacity: 0.7;
}

#kpiCommentPanel .kpiCommentPanel__group {
	margin-bottom: 10px;
}

#kpiCommentPanel .kpiCommentPanel__label {
	display: block;
	font-size: 12px;
	margin-bottom: 4px;
	color: #555;
}

#kpiCommentPanel .kpiCommentPanel__input,
#kpiCommentPanel .kpiCommentPanel__textarea,
#kpiCommentPanel .kpiCommentPanel__select {
	width: 100%;
	border: 1px solid #ddd;
	border-radius: 6px;
	padding: 6px 8px;
	font: inherit;
	box-sizing: border-box;
	box-shadow: inherit;
}

#kpiCommentPanel .kpiCommentPanel__input[readonly] {
	background: #f3f3f3;
	color: #444;
	width: 146px;
}

#kpiCommentPanel .kpiCommentPanel__textarea {
	resize: vertical;
	min-height: 80px;
}

#kpiCommentPanel .kpiCommentPanel__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
}

#kpiCommentPanel .kpiCommentPanel__inline {
	display: flex;
	align-items: center;
	gap: 6px;
	justify-content: space-between;
}

#kpiCommentPanel .kpiCommentPanel__color {
	width: 36px;
	height: 28px;
	border: none;
	padding: 0;
	cursor: pointer;
	border-radius: 6px;
}

#kpiCommentPanel .kpiCommentPanel__actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
}

/* === Buttons === */
#kpiCommentPanel .kpiCommentPanel__btn {
	border: 1px solid #ccc;
	background: #f6f6f6;
	padding: 6px 12px;
	border-radius: 6px;
	cursor: pointer;
	font: inherit;
	transition: all 0.15s ease;
}

#kpiCommentPanel .kpiCommentPanel__btn:hover {
	background: #eee;
}

/* cancel button */
#kpiCommentPanel .kpiCommentPanel__btn--cancel {
	color: #f05530;
}

/* Save button: orange */
#kpiCommentPanel .kpiCommentPanel__btn--primary {
	background: #f05530;
	border-color: #f05530;
	color: #fff;
}

#kpiCommentPanel .kpiCommentPanel__btn--primary:hover {
	background: #d94b2b;
}

/* Delete button: red */
#kpiCommentPanel .kpiCommentPanel__btn--danger {
	background: #d23232;
	border-color: #d23232;
	color: #fff;
}

#kpiCommentPanel .kpiCommentPanel__btn--danger:hover {
	background: #b52a2a;
}

/* Cancel button: text orange */
#kpiCommentPanel .kpiCommentPanel__btn--cancel {
	color: #f05530;
	font-weight: 500;
	background: #f6f6f6;
	border-color: #ccc;
}

#kpiCommentPanel .kpiCommentPanel__btn--cancel:hover {
	background: #eee;
}

/* ===== KPI Comment Hover Display Panel ===== */
#kpiCommentDisplayPanel {
	position: absolute;
	display: none;
	background: #fff;
	border: 1px solid #ccc;
	padding: 12px;
	z-index: 9998;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	width: 340px;
	font-family: "Segoe UI", Arial, sans-serif;
	font-size: 13px;
	box-sizing: border-box;
	pointer-events: none;
}

#kpiCommentDisplayPanel .kpiCommentItem {
	border-left: 4px solid #f05530;
	/* couleur du commentaire */
	padding-left: 8px;
	margin-bottom: 10px;
}

#kpiCommentDisplayPanel .kpiCommentItem__meta {
	font-size: 11px;
	color: #777;
	margin-bottom: 2px;
}

#kpiCommentDisplayPanel .kpiCommentItem__text {
	background: #f9f9f9;
	padding: 6px 8px;
	border-radius: 4px;
	white-space: pre-wrap;
	word-break: break-word;
}

#kpiCommentDisplayPanel .kpiCommentItem--private .kpiCommentItem__text {
	background: #fff4f4;
	font-style: italic;
}

/* Filter archived wells */
/* Hide native checkbox but keep it functional */
#usermgtfilter_archivedWell {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* Archive icon appearance */
#archivedWellContainer label[for='usermgtfilter_archivedWell'] {
	display: inline-block;
	position: relative;
	width: 18px;
	height: 18px;
	cursor: pointer;
	vertical-align: middle;
	margin-left: 4px;
}

/* Icon */
#archivedWellContainer label[for='usermgtfilter_archivedWell']:after {
	content: '\f187';
	font-family: exlogfont;
	font-style: normal;
	font-size: 16px;
	color: #999;
	position: absolute;
	left: 0;
	top: 0;
	transition: color 0.15s ease, transform 0.15s ease;
}

/* Hover */
#archivedWellContainer label[for='usermgtfilter_archivedWell']:hover:after {
	transform: scale(1.08);
}

/* Checked = green */
#usermgtfilter_archivedWell:checked + label[for='usermgtfilter_archivedWell']:after {
	color: #2ecc71;
}
/*MWC*/
#buttonControlMwcProjectAdd:after {
	content: '\f055';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #ffffff;
}

#buttonControlMwcProjectRemove:after {
	content: '\f057';
	font-style: normal;
	font-family: exlogfont;
	font-size: 20px;
	color: #ffffff;
}
/* Remove only the grey box (before) */
label.lblforcombo_mwc:before {
	display: none;
	content: none;
}

/* Keep arrow but adjust position */
label.lblforcombo_mwc:after {
	top: 4px;
}