html { height: 100%; overflow:auto; }

body {
    min-height: 100vh;
	margin: 0;
	padding: 0;
    display: flex;
    flex-direction: column;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}
#pictTop img {
	width: 100%;
	padding-top: 0px;
	opacity: 0.85;
	height: 200px;
}
#pictTopMb img {
	width: 20%;
	padding-top: 0px;
	margin: 10px 0 20px 20px;
}

footer {
    margin-top: auto;
	width: 100%;
	bottom: 0;
	background-color: rgba(34, 64, 131, 0.85);
	text-align: center;
	color: white;
	overflow: hidden;
}
footer p {
	margin: 0px;
}
#email {
	font-weight: bolder;
}
#email:hover {
	color: #a7ad50;
	text-decoration: none;
}
#logout {
	position: absolute;
	top: 0;
	right: 0;
	background-color: rgb(228, 36, 36);
	padding: 5px;
	margin: 5px;
	border-radius: 10px;
}
#logout a {
	color: white;
	text-decoration: none;
	font-size: calc(16px + 6 * ((30vw - 300px) / 150));
}
#logout:hover {
	background-color: rgb(255, 0, 0);
}
h2 {
	text-align: center;
}

#divInfoDossier {
	width: 100%;
	background-color: rgb(255, 255, 255);
	display: flex;
}
#showInfoMb, #listSensorsMb {
	padding: 0px 10px 10px 10px;
	color: rgb(0, 17, 68);
}

.titleParagraph {
	background-color: rgb(0, 17, 68);
	color: rgb(255, 255, 255);
	width: 100%;
	padding: 5px 0;
	border-radius: 10px;
	font-size: calc(20px + 6 * ((100vw - 700px) / 680));
}
.subTitleParagraph {
	background-color: rgba(17, 41, 100, 0.5);
	color: rgb(255,255,255);
	width: 100%;
	padding: 5px 20px;
	font-size: calc(16px + 6 * ((50vw - 400px) / 420));
}
#showInfoMb h2, #listSensorsMb h2 {
	background-color: rgb(0, 17, 68);
	color: rgb(255, 255, 255);
	width: 100%;
	padding: 5px 0;
	border-radius: 10px;
	font-size: calc(20px + 6 * ((100vw - 700px) / 680));
}
#showInfoMb h3 {
	color: rgb(17, 41, 100);
}
.tabSession {
	margin-left: 20px;
}
.tabSession td {
	padding-top: 10px;
}
.tabSession .firstCol {
	width: 40%;
	vertical-align: top;
}
.blinkTxt {
  animation: blinkTxt 1s infinite;
}
@keyframes blinkTxt { 
  0% { opacity:0; }
  50% { opacity:1; } 
  100% { opacity:0; }
}
.otherSens {
	margin-left: -20%;
}
/*.transitionHover {
    transition: all 0.3s ease;
}
.title li a:hover:not(.otherSens) {
	color: rgb(8, 7, 58);
	text-decoration: none;
	background-color: rgb(37, 91, 255);
	border-radius:30%;
}*/
.titleAdmin {
	background-color: rgb(34, 64, 131);
	padding: 10px;
	color: white;
}

.divTitleTypeSens {
	width:90%;
	display: inline-block;
	vertical-align: text-top;
}
.titleTypeSens {
	color: rgb(17, 41, 100);
}
.tabFormat {
	font-weight: bold;
	background-color: rgb(37, 91, 255) !important;
	color: white !important;
}
.nav {
	margin-top: -10px !important;
}
.nav li {
	margin: 0 2px;
	color: rgb(0, 17, 68) !important;
	z-index: 10 !important;
}
.nav-tabs>li>a {
	border-radius: 15px !important;
	margin-bottom: 10px !important;
}
.nav-tabs>li>a:hover{
	border-color:#eee #eee rgb(34, 64, 131) #ddd !important;
	background-color:rgb(34, 64, 131) !important;
	color: white;
}
.nav-tabs>li>a.active,  .nav-tabs>li>a.active:focus,  .nav-tabs>li>a.active:hover {
	color:#ffffff !important;
	cursor:default;
	background-color:rgb(10, 0, 68) !important;
	border:1px solid rgb(10, 0, 68) !important;
	-webkit-box-shadow: 2px -1px 4px rgb(10, 0, 68);
	-moz-box-shadow: 2px -1px 4px rgb(10, 0, 68);
	box-shadow: 2px -1px 4px rgb(10, 0, 68);
	z-index: -10;
}
body.modal-open {
    overflow: visible;
}

#gestionMb {
	display:flex;
	background-color: snow;
	height: 1070px;
}
#gestionSensors {
	display:flex;
}
body div, #bouttons button {
	transition: all 0.5s ease;
}
#AddSensor {
	position: inline-block;
	width: 59%;
	margin-left: 1%;
	background-color: rgb(57, 169, 219);
	height: 350px;
	border-radius: 15px 15px 15px 15px;
	opacity: 0.8;
}
#AddSensor:hover {
	opacity: 1.0;
}
#delSensor {
	position: inline-block;
	width: 39%;
	margin: 0 1%;
	background-color: rgb(64, 188, 216);
	height: 350px;
	border-radius: 15px 15px 15px 15px;
	opacity: 0.8;
}
#delSensor:hover {
	opacity: 1.0;
}
#bouttons {
	width: 35%;
	height: 400px;
}
#bouttons button {
	width: 80%;
	display: inline-block;
	border-radius: 10px 10px 10px 10px;
}
#rightArrowAddProj, #rightArrowAddSens, #rightArrowAddExpert, #rightArrowListUser, #rightArrowModProj, 
#rightArrowModSens, #rightArrowDelSens {
	visibility: hidden;
	text-shadow: 0 0 10px black;
	color: black;
	font-size: calc(24px + 6 * ((100vw - 700px) / 680));
}

#divSumProj {
	display: flex;
	flex-direction: column;
	width: 98%;
	height: 480px;
	margin: 1%;
	/*background-color: rgb(158, 181, 255);*/
	border: 2px solid rgb(158, 181, 255);
	border-radius: 15px 15px 15px 15px;
	opacity: 0.8;
	z-index: 1;
}
#divSumProj:hover {
	opacity: 1.0;
}
#choiceProjSum {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 80px;
	margin-top: 3px;
	color: rgb(12, 62, 73);
}
#choiceProjSumL {
	margin-left: 3%;
	margin-top: 10px;
	width: 40%;
}
#choiceProjSumL > h3 {
	font-size: calc(16px + 6 * ((50vw - 400px) / 420));
}
#choiceProjSumM {
	margin-top: 20px;
	width: 42%;
	height: 35px;
}

#choiceProjSumR {
	width: 5%;
	height: 30px;
}
#dataSumProj {
	display: flex;
	flex-direction: row;
	/*margin-top: -330px;*/
	z-index: 10;
}
#leftSumProj {
	margin-left: 10%;
	display: flex;
	flex-direction: column;
	width: 40%;
}
#userProjSum {
	margin-top: 30px;
	margin-bottom: -50px;
	font-size: calc(12px + 6 * ((100vw - 700px) / 680));
}
#choiceSumProj > select {
	min-width: 90% !important;
}
#pictProjSum > img {
	max-width: 110%;
	max-height: 250px;
	margin-top: 40px;
	margin-left: -15%;
}
#pictProjSum > h3 {
	margin-left: -50px;
}
#titleProjSum {
	font-size: calc(14px + 6 * ((100vw - 700px) / 680));
}
#rightSumProj {
	display: flex;
	flex-direction: column;
	margin: 5% 0 0 5%;
	font-size: calc(12px + 6 * ((100vw - 700px) / 680));
}
#rightSumProj li {
	margin: 0 0 30px 0;
}
.btn2 {
	background-color: rgb(6, 94, 182);
	border: none;
	color: white;
	margin: 12px 2%;
	cursor: pointer;
	font-size: calc(16px + 6 * ((100vw - 700px) / 680));
	width: 90%;
	height: 50px;
}
.btn2:hover, .btn2:focus {
	background-color: rgb(0, 39, 155);
	color: white;
}
.btn3 {
	background-color: rgb(78, 110, 93)!important;
}
.btn3:hover, .btn3:focus {
	background-color: rgb(49, 68, 58)!important;
}
.btn4 {
	background-color: rgb(77, 161, 103)!important;
}
.btn4:hover, .btn4:focus {
	background-color: rgb(45, 94, 60)!important;
}
.btn5 {
	background-color: rgb(83, 19, 30)!important;
}
.btn5:hover, .btn5:focus {
	background-color: rgb(56, 13, 20)!important;
}
#infosMb {
	width: 60%;
	height: 650px;
	padding-top: 1%;
}
.col-20 {
	width: 20%;
	text-align: left;
	font-size: calc(4px + 6 * ((100vw - 100px) / 680));
}
.col-30 {
	width: 30%;
	text-align: right;
	font-size: calc(4px + 6 * ((100vw - 100px) / 680));
}
.col-60 {
	width: 60%;
	margin-top: 3px;
	text-align: left;
	color: black;
}
.col-40 {
	width: 40%;
	margin-top: 3px;
	text-align: right;
	font-size: calc(6px + 6 * ((100vw - 100px) / 680));
}
.col-90 {
	width: 90%;
	margin-top: 3px;
	font-size: calc(16px + 6 * ((100vw - 100px) / 680));
	text-align: left;
	color: rgb(64, 188, 216);
}
.col-95 {
	width: 95%;
	margin-left: 5%;
	text-align: left;
	font-size: calc(4px + 6 * ((100vw - 100px) / 680));
	color: black;
	font-style: italic;
}
.col-md-3 > label {
	font-size: 0.9em;
}
#sensorToModify, #expertProj {
	background-color: rgb(0, 39, 155);
	color: white;
}
.selectProject {
	display: block;
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .6em 1.4em .5em .8em;
	width: 40%;
	max-width: 40%;
	box-sizing: border-box;
	margin: 0 0 0 20px;
	border: 1px solid #aaa;
	-webkit-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	-moz-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.selectProject::-ms-expand {
	display: none;
}
.selectProject:hover {
	border-color: #888;
}
.selectProject:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.selectProject option {
	font-weight:normal;
}
#selectProjectToMod, #selProj {
	width: 60%;
	max-width: 60%;
}
.selectProjectSum {
	display: block;
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .6em 1.4em .5em .8em;
	width: 80%;
	max-width: 80%;
	box-sizing: border-box;
	margin: 0 0 0 20px;
	border: 1px solid #aaa;
	-webkit-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	-moz-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.selectProjectSum::-ms-expand {
	display: none;
}
.selectProjectSum:hover {
	border-color: #888;
}
.selectProjectSum:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.selectProjectSum option {
	font-weight:normal;
}

.selectSensor {
	display: block;
	font-size: 14px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .6em 2.4em .5em 1.8em;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #aaa;
	-webkit-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	-moz-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #000000;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.selectSensorSmaller {
	font-weight: 400;
	line-height: 1.0;
}
.centerSelect {
	display: block;
	margin: 0 auto;
}
#newUser, #password, #password2, #addressUser, #noRef, #newSensor, #initOpen, #initOpenF, #enCours,
	 #newSensorF, #sensorToModify, #initOpenMod, #profFondMod, #profPiezoMod, #userMod, #pswdMod, #pswdMod2, #addrUserMod, 
	 #noRefMod, #correctMod, #expertProj, #expertPswd, #expertFirstName, #expertLastName, #expertEmail,
	 #expertCompany, #expertTel, #extWeathStat, #extWeathStatMod {
	height: 30px;
	width: 90%;
}
#enterLimitInf, #enterLimitSup {
	height: 22px;
	width: 25%;
	padding-left: 10px !important;
	background-color: rgb(34, 64, 131);
	font-weight: bolder;
	color: white;
}
.row {
	height: 45px;
}
.row:after {
	content:"";
	display: table;
	clear: both;
}
.row span {
	color: red;
}
#messageNewUser, #messagePassword, #messageAddressUser, #messageNewSensor, 
#messageCatSens, #messageNoRef, #messageInitOpen, #messageAddressUserF, #messageNewSensF, 
#messageInitOpenF, #messageCatSensF {
	font-size: calc(5px + 6 * ((100vw - 100px) / 680));
	color:red;
	width: 90%;
	margin-top:-22px;
	margin-left:20%;
}
#messageCatSens, #messageCatSensF {
	margin-top:-5px;
}
#messageAddressUserF {
	margin-top:5px;
	margin-left:-20px;
}

.closeWindow {
	color: white;
	background-color: rgb(0, 39, 155);
	border-radius: 0 15px 0 15px;
	font-size: 2em;
	padding: 0px 10px;
	float: right;
	cursor: pointer;
}
.closeWindow:hover {
	color: white;
	background-color: red;
    transition: all 0.3s ease;
}
input[type=submit], input[type=button] {
	background-color: #45a049;
	color: white;
	padding: 12px 20px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	float: left;
	margin: 20px 0 0 40%;
}

input[type=submit]:hover, input[type=button]:hover {
	background-color: #1a701d;
    transition: all 0.3s ease;
}
#divNew, #divNewSensor, #divAddExpert, #divModifySens, #divModifyProj {
	background-color: rgb(0, 39, 155);
	border-radius: 15px 15px 15px 15px;
	width: 90%;
	height: 1055px;
	margin-left: 5%;
	padding: 0 auto;
	display: none;	
	text-align: center;
	font-family: "Lucida Console", Courier, monospace;
	-webkit-box-shadow: 5px 5px  #444444;
	-moz-box-shadow: 5px 5px  #444444;
	box-shadow: 5px 5px  #444444;
	color: white;
}
#divNewSensor, #divModifySens {
	height: 1000px;
}
#divModifyProj {
	height: 750px;
}
#listFissuroProj, #listFissTempProj, #listHumidSolProj, #listPiezoProj, #listInclinoProj, #listGeophProj, #listWeathStProj {
	height: 30px;
	margin-top: -20px;
	font-style: italic;
	font-size: 0.9em;
	color:rgb(113, 151, 255)
}

#initOpening1, #initOpening2, #messageInitOpen, #initOpening1N, #initOpening2N, 
	#messageInitOpenF, #locWeathStat1N, #locWeathStat2N, #locWeathStat1M, #locWeathStat2M {
	display: none;
}
.recordOnOff {
	background-color: rgb(230, 230, 230);
	border-radius: 5px;
}
.Blink {
	font-size: 12px !important;
	animation: blinker 1.0s cubic-bezier(.5, 0, 1, 1) infinite alternate;  
}
@keyframes blinker {  
	from { opacity: 1; }
	to { opacity: 0; }
}
.noBlink {
	opacity: 0;
}

.delBtn {
	margin: 50px 0 0 60% !important;
}
#divList, #divDeleteSens {
	background-color: rgb(0, 39, 155);
	border-radius: 15px 15px 15px 15px;
	width: 90%;
	margin-left: 5%;
	padding: 0 auto;
	display: none;
	font-family: "Lucida Console", Courier, monospace;
	-webkit-box-shadow: 5px 5px  #444444;
	-moz-box-shadow: 5px 5px  #444444;
	box-shadow: 5px 5px  #444444;
}
#divList {
	height: 600px;
	overflow:hidden;
	overflow-y:scroll;
}
#divDeleteSens {
	margin-top: 50px;
	height: 200px;
}
#divMod {
	width: 90%;
	margin-left: 5%;
	padding: 0 auto;
	display: block;
	font-family: "Lucida Console", Courier, monospace;
	-webkit-box-shadow: 5px 5px  #444444;
	-moz-box-shadow: 5px 5px  #444444;
	box-shadow: 5px 5px  #444444;
}
.modalWindow {
	background-color: rgb(0, 0, 59);
	color: white;
}
.containerModal {
	width: 80%;
	height: 250px;
	margin: auto;
	padding: 10px;
}
.w3Modal{
	z-index:50;
	/*display:none;*/
	padding-top:20px;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	overflow:auto;
	background-color:rgba(136, 134, 255, 0.4)
}
.modal {
    padding-top: 200px !important;
}

.modal-header {
	background-color:rgb(0, 17, 68);
}
.modal-title, .close-white {
	color: #FFFFFF !important;
	font-size: 2vw;
}
.modal-body {
    background-color: #d4d6d5;
}
.close-white span {
	color: #FFFFFF !important;
	font-size: 2vw;
}
.modLeft {
	margin-top: 60px;
	width: 60%;
	height: 250px;
	float: left;
	margin-left: -60px;
}
.modRight {
	margin-top: 50px;
	width: 40%;
	height: 250px;
	float: right;
}
.modRight {
	object-fit: contain;
}
#messages {
	display: none;
	padding: 0.01em 16px;
	margin: 40px 0;
	color:#fff;
	background-color:#4CAF50;
	font-size: calc(16px + 6 * ((100vw - 320px) / 680));
	text-align: center;
	line-height: 100px;
	height: 100px;
	border-radius: 10px;
}
.formSens {
	margin-left: 5% !important;
	font-family: "Lucida Console", Courier, monospace;
	height: 30px;
	width: 25%;
}
#tableMb {
	margin-left: 5%;
	color: white;
	font-weight: bolder;
}
#bodyLogin {
	font-family: Arial, Helvetica, sans-serif;
	background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url("");
	background-size: cover;
	background-position: center;
	background-position-y: 150px;
}
#bodyAdMb {
	background-color: white;
	font-family: Arial, Helvetica, sans-serif;
}
.container{
	width: 500px;
	height: 450px;
	text-align: center;
	margin: 0 auto;
	background-color: rgba(44, 62, 80,0.7);
	margin-top: 160px;
}
.containerNewMb {
	height: 600px;
}

#imgLogin{
	width: 150px;
	height: 150px;
	margin-top: -100px;
	margin-bottom: 50px;
	opacity: 0.9;
}
#imgEnvelope {
	height: 150px;
}
.msgConfirmVerify {
	padding: 30px;
	color: white;
	font-weight: bold;
	font-size: calc(12px + 6 * ((100vw - 320px) / 680));
}
#pictProject {
	background-color: white;
	padding: 2% 0;
}
.carousel-item img {
	max-width: 100% !important;
	max-height: 350px !important;
	width: auto !important;
	height: auto !important;
	margin-left: auto !important;
	margin-right: auto !important;
	display: block !important;
}
.carousel-indicators li {
	width: 50px !important;
	height: 5px !important;
    background-color:rgb(34, 64, 131) !important;
    box-shadow: inset 1px 1px 1px 1px rgba(0,0,0,0.5) !important;    
}
.carousel-indicators .active {
    background-color: rgb(0, 39, 155) !important;
}
.carousel-indicators {
	bottom:-5px !important;
}  
.carousel-control-next,
.carousel-control-prev /*, .carousel-indicators */ {
    filter: invert(100%);
}
.sensorTotal {
	display: flex;
	flex-direction: column;
}
.sensor {
	display: flex;
	width: 98%;
	/*background-image: linear-gradient(to bottom right, #224083, #39A9DB);*/
	background-color: rgb(255, 255, 255);
	border-radius: 5px;
	border: 2px solid rgb(34, 64, 131);
	padding: 1%;
	margin: 1% 1% 0 1%;
}
.sensorWeathStat {
	display: flex;
	background-color: rgb(255, 255, 255) !important;
	border-radius: 10px;
	margin: -1% 0 0 0;
}

.sensors {
	width: 98%;
	height: 550px;
	display: flex;
	/*background-image: linear-gradient(to bottom right, #224083, #39A9DB);*/
	background-color: rgb(255, 255, 255);
	border-radius: 10px;
	border: 2px solid rgb(34, 64, 131);
	padding: 1%;
	margin: 1% 1% 0 1%;
}
#WS0, #WS1, #WS2, #WS3, #WS4, #WS5, #WS6, #WS7, #WS8, #WS9, #WS10, #WS11 {
	display: none;
}
.weatherStation {
	/*display: none;*/
	background-color: rgb(255, 255, 255) !important;
	width: 98%;
	height: auto;
	border-radius: 10px;
	border: 2px solid rgb(34, 64, 131);
	padding: 1%;
}

div {
	scroll-margin-top: 100px;
}
* {
	scroll-behavior: smooth;
}
.amcharts-amexport-item.amcharts-amexport-item-level-0 {
	background-color: rgb(255, 221, 157) !important;
	color: black !important;
	padding-top: 5px !important;
	padding-right: 5px !important;
	padding-bottom: 5px !important;
	padding-left: 5px !important;
	margin-top: -10px;
	margin-right: 10px;
}
.amcharts-amexport-item.amcharts-amexport-item-level-1 {
	border-radius: 2px !important;
	width: 250px;
	background-color: rgb(181, 203, 243) !important;
	color: black !important;
	margin-top: -5px;
}
.amcharts-amexport-item.amcharts-amexport-item-level-2 {
	border: 0.5px solid rgb(181, 203, 243);
	border-radius: 2px !important;
	width: 85px;
	background-color: rgb(181, 203, 243) !important;
	color: black !important;
	margin-bottom: 5px !important;
}
  
/*.infoSensor {
	width: 98%;
	height: 125px;*/
	/*background-image: linear-gradient(to top right, #224083, #39A9DB);*/
/*	background-color: rgb(34, 64, 131);
	padding: 1% 10%;
	margin: -2% 1% 0% 1%;
	border-radius: 0 0 15px 15px;
}*/
.infoSensorLeft table, .infoSensorBottom table {
	color: rgb(0, 0, 0);
	line-height: 20px;
	font-weight: bold;
}
.rangeSensor {
	width: 20%;
	/*background-image: linear-gradient(to top right, #224083, #39A9DB);*/
	margin: 2%;
}
.rangeSensor table {
	color: rgb(211, 211, 211);
	line-height: 25px;
	font-weight: bold;
	font-size: calc(12px + 6 * ((70vw - 320px) / 880));
}

.fade {
    -webkit-transition-duration: 0.3s !important; /* Safari */
    transition-duration: 0.3s !important;
}

.pictSensor {
	justify-content: space-between;
  	display: flex;
}
.pictSensor > img {
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #000000;
	border-radius: 5px;
}
.pictSensor > img:hover {
	cursor: pointer;
}
.pictSensor .belowPictSensor {
	justify-content: flex-end;
	display: flex;
}
.btnExport {
	background-color: rgb(34, 64, 131) !important;
	margin: 0 !important;
	float: left !important;
	border: 1px solid rgb(0, 17, 68) !important;
	font-size: calc(15px + 6 * ((25vw - 400px) / 150));
	padding-left: 10px !important;
	padding-right: 10px !important;
}
.btnAlert {
	background-color: rgb(0, 39, 155) !important;
	margin: 10px 0 0 10px !important;
	border: 1px solid rgb(0, 17, 68) !important;
	font-size: calc(14px + 6 * ((25vw - 400px) / 500));
	padding-left: 10px !important;
	padding-right: 10px !important;
}
.btnExport:hover, .btnAlert:hover {
	background-color: rgb(0, 55, 221) !important;
}
.belowPictSensor {
	flex-direction: column;
}
.btnGraph {
	background-color: rgb(0, 39, 155) !important;
	height: 30px !important;
	padding: 0 5px !important;
	float: right !important;
	margin: 0 0 10px 10px !important;
}
.btnGraph:hover {
	background-color: rgb(0, 55, 221) !important;
}

@media screen and (min-width: 1000px) {
	.infoSensorBottom {
		display: none;
	}
	.infoSensorLeft {
		width: 98%;
		height: 125px;
		/*background-image: linear-gradient(to top right, #224083, #39A9DB);*/
		background-color: rgb(255, 255, 255);
		padding: 2% 0%;
		margin: 2% 0% 0% 1%;
		border-radius: 0 0 15px 15px;
		font-size: calc(3.5px + 6 * ((100vw - 220px) / 700));
	}
	.sensor {
		flex-direction: row;
		height: auto;
	}
	.pictSensor {
		flex-direction: column;
		width: 25%;
		height: 500px;
	}
	.pictSensor > img {
		width: 100%;
	}
	.pictSensor > img:hover {
		cursor: pointer;
	}
	.modal-body > img {
		width: 100%;
	}
	.graphSensor {
		width: 83%;
		margin-left: 1%;
		margin-bottom : 0px;
	}
	.graphsSensor {
		width: 98%;
	}
	.superpFissuro {
		height: 500px;
		margin-top: -50px;
	}
	.graphSensorHum div {
		margin-top: 5%;
	}
	.titleGraph {
		font-size: calc(12px + 6 * ((50vw - 300px) / 120));
	}
	.btnAlert {
		display: block;
	}
	#formAddLimitAlert {
		display: block;
	}
	#listMbsLogin {
		margin: 5% 1% 0 1%;
	}
	.weatherStation {
		margin: 1% 1% 0 1%;
	}
}
@media screen and (max-width: 1000px) {
	.weatherStation {
		margin: 10% 1% 0 1%;
	}
	.infoSensorLeft {
/*		display: none;   */
		width: 98%;
		height: 125px;
		/*background-image: linear-gradient(to top right, #224083, #39A9DB);*/
		background-color: rgb(255, 255, 255);
		padding: 2% 0%;
		margin: 2% 0% 0% 1%;
		border-radius: 0 0 15px 15px;
		font-size: calc(6.5px + 6 * ((100vw - 220px) / 700));
	}
	.infoSensorBottom {
		display: block;
		width: 49%;
		height: 125px;
		/*background-image: linear-gradient(to top right, #224083, #39A9DB);*/
		padding: 1% 1%;
		margin: -25% 1% 0% 50%;
		font-size: calc(8px + 6 * ((100vw - 220px) / 680));
	}
	.sensor {
		flex-direction: column;
		height: auto;
	}
	.pictSensor {
		flex-direction: row;
		max-width: 95%;
		max-height: 350px;
		margin-bottom: 10px;
	}
	.pictSensor > img {
		max-width: 100%;
		max-height: 200px;
	}
	.pictSensor > img:hover {
		cursor: pointer;
	}
	.modal-body > img {
		width: 100%;
	}
	.graphSensor {
		width: 98%;
		margin-left: 1%;
		margin-bottom : 20px;
	}
	.superpFissuro {
		height: 430px;
		margin-top: -20px;
	}
	.titleGraph {
		font-size: calc(12px + 6 * ((50vw - 150px) / 120));
	}
	.btnAlert {
		display: none;
	}
	#formAddLimitAlert {
		display: none;
	}
	.btnExport {
		margin-left: 30px !important;
		font-size: calc(7px + 6 * ((100vw - 220px) / 700)) !important;
	}
	#listMbsLogin {
		margin: 15% 1% 0 1%;
	}
}
@media screen and (min-width: 800px) {
	#divInfoDossier {
		flex-direction: row;
	}
	#showInfoMb {
		width: 40%;
	}
	#pictProject {
		width: 60%;
	}
	#showInfoMb h2 {
		display: block;
	}
	#listSensorsMb {
		width: 100%;
	}
	.titleTypeSens {
		font-size: calc(12px + 6 * ((40vw - 400px) / 250));
		margin-bottom: -2px !important;
	}
	#listSensorsMb li {
		font-size: calc(15px + 6 * ((100vw - 900px) / 680));
		margin-left: -20%;
		margin-right: -20%;
	}
	#showInfoMb h3 {
		font-size: calc(14px + 6 * ((40vw - 400px) / 150));
	}
	.padTop {
		padding-top: 20px;
	}
	#showInfoMb img {
		width: 50px;
	}
}
@media screen and (max-width: 800px) {
	#divInfoDossier {
		flex-direction: column;
	}
	#showInfoMb {
		width: 100%;
	}
/*	#showInfoMb h2 {
		display: none;
	}*/
	#listSensorsMb {
		width: 100%;
	}
	#listSensorsMb h2 {
		margin-top: -10px;
	}
	.superpFissuro {
		height: 450px;
		margin-top: -20px;
	}
	.titleTypeSens {
		font-size: calc(14px + 6 * ((40vw - 400px) / 250));
	}
	.graphSensorHum div {
		margin-top: 7%;
	}
	#listSensorsMb li {
		font-size: calc(18px + 6 * ((100vw - 900px) / 680));
		margin-left: -20%;
		margin-right: -20%;
	}
	#showInfoMb h3 {
		font-size: calc(22px + 6 * ((40vw - 400px) / 150));
	}
	.titleOtherSens li {
		margin-left: -60%;
		margin-right: -20%;
	}
	#listSensorsMb img {
		width: 35px;
	}
}
@media screen and (max-width: 600px) {
	.sensor {
		height: auto;
	}
	.pictSensor {
		flex-direction: row;
		max-width: 95%;
		max-height: 250px;
		margin-bottom : 10px;
	}
	.pictSensor img {
		max-width: 80%;
		max-height: 120px;
	}
	.pictSensor > img:hover {
		cursor: pointer;
	}
	.titleTypeSens {
		font-size: calc(14px + 6 * ((40vw - 400px) / 250));
		margin-bottom: 0px !important;
	}
	#listSensorsMb li {
		margin-left: -10%;
		margin-right: -10%;
	}
	#listSensorsMb img {
		width: 30px;
	}
	.titleOtherSens li {
		margin-left: -20%;
		margin-right: -20%;
	}
}



.switchOnOff {
	background-color: rgb(212, 255, 148) !important;
	color: green !important;
	height: 30px !important;
	padding: 0 5px !important;
	float: right !important;
	margin: 0 0 10px 10px !important;
}
.switchOnOff:hover {
	background-color: white !important;
	color: rgb(32, 197, 32) !important;
}

.fa-input {
  font-family: FontAwesome, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.graphSensor {
	height: 500px;
	background-color: rgb(255, 255, 255);
	color: black;
}
.graphSensorWeatSt {
	height: 400px;
	width: 100%;
}
input[type="text"],input[type="password"],input[type="email"],input[type="addressUser"]{
	height: 60px;
	width: 300px;
	font-size: 18px;
	margin-bottom: 20px;
	background-color: #fff;
	padding-left: 40px;
}
.befInput > input[type="text"] {
	height: 30px;
	font-size: 18px;
	margin-bottom: -20px;
	background-color: rgb(104, 144, 255);
	padding-left: 10px;
	font-size: calc(22px + 6 * ((25vw - 400px) / 150));
}
@media screen and (min-width: 830px) {
	.befInput > input[type="text"] {width: 130px;}
}
@media screen and (max-width: 830px) {
	.befInput > input[type="text"] {width: 90px;}
}

.form-input-Login::before, .form-input-LoginNewMb::before{
	content: "\f007";
	font-family: "FontAwesome";
	padding-left: 7px;
	padding-top: 5px;
	position: absolute;
	font-size: 35px;
	color: #2980b9; 
}
.form-input-Login:nth-child(2)::before{
	content: "\f023";    /* lock logo */
}
.form-input-LoginNewMb:nth-child(3)::before{
	content: "\f1ad";    /* Company logo */
}
.form-input-LoginNewMb:nth-child(4)::before{
	content: "\f2c1";    /* Function logo */
}
.form-input-LoginNewMb:nth-child(5)::before{
	content: "\f1fa";    /* arobas logo */
}

.btn-login{
	padding: 15px 25px;
	border: none;
	background-color: #27ae60;
	color: #fff;
}

.titleGraph {
	padding-left: 5%;
	color: black;
}
.titleFissPiezo {
	display: flex;
	justify-content: space-between;
	font-size: calc(14px + 6 * ((50vw - 150px) / 180));
  }
.titleFissPiezo > .titleFiss {
	padding-left: 5%;
	color : #FF0000;
}
.titleFissPiezo > .titlePiezo {
	padding-right: 5%;
	color : #0000FF;
}
.titleWeathSt {
	color: black;
	text-align: center;
}
#mainUsers {
	background-color: lavender;
}
#chartFissuro {
	background-color: white;
	width: 90%;
	margin: 1% auto;
}
.sensorData {
	margin: 3% auto;
	width: 80%;
	background-color: rgb(44, 73, 67);
}

#btnCreateAlert {
	background-color: rgb(34, 64, 131);
	border: none;
	border-radius: 0 0 15px 15px;
	margin: -1px 1% 0 1%;
}
#alertDetails {
	display: flex;
	flex-direction: row;
	background-image: linear-gradient(to bottom, rgb(34, 64, 131) , rgb(117, 154, 171));
	/*background-color: rgb(117, 154, 171);*/
	color: rgb(0, 17, 68);
	border: none;
	border-radius: 0 0 15px 15px;
}
#alertDetails p {
	font-weight: bold;
}
.sizeLimits {
	margin-bottom: 10px;
	margin-left: 25px;
}
#titleAlert {
	font-size: 24px;
	margin: -20px -500px 20px 0;
	font-style: italic;
	color: #C9DCB3;
}
.containerLeftAlert {
	display: flex;
	flex-direction: column;
	width: 25%;
}
#modEmail {
	margin: 0 30px 0 20px;
	color:rgb(29, 49, 45);
	font-size: 12px;
	line-height: 14px;
}
/* pour tooltip */
#tt {
	position: relative;
	font-size: 16px;
}
  
#tt:hover:after {
	content: attr(data-title);
	width: 270px;
	position: absolute;
	font: 13px verdana;
	top: -55px;
	left: -100px;
	background: #ace;
	color: black;
	box-sizing: border-box;
	border: 1px solid gray;
	border-radius: 5px;
	padding: 3px;
}
  
.containerMiddleAlert {
	display: flex;
	flex-direction: column;
	width: 28%;
}
#containerRightAlert {
	display: flex;
	flex-direction: column;
	margin: 70px 0 0 0;
	width: 38%;
}
.questionsAlerts {
	margin-bottom: 20px;
}
.divQuestionsAlert {
	width: 63%;
}
.divRadioQuestions {
	width: 37%;
}
.questionsAlerts p {
	margin-top: 7px;
	margin-right: 10px;
	text-align: right;
}
#containerRightRightAlert {
	width: 4%;
}
#btnEnvoyerAlert {
	margin-top: 150px;
	padding: 5px 10px 5px 10px !important;
}

.btnNewMbAlert {
	position: relative;
	bottom: 0;
	left: 0;
	width: 100%;
	background: none;
	border: none;
	margin: 20px 0 0 10px;
	cursor: pointer;
	outline: inherit;
	text-align: left;
	font-size: calc(16px + 6 * ((25vw - 400px) / 200));
	font-style: italic;
	color: wheat;
}
/*.selectValueAlert {
	display: inline-block;
	font-size: 12px;
	font-family: sans-serif;
	font-weight: 500;
	color: #444;
	line-height: 1.3;
	padding: .4em 1.4em .3em .8em;
	width: 20%;
	max-width: 20%;
	box-sizing: border-box;
	margin: 0 0 0 20px;
	border: 1px solid #aaa;
	-webkit-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	-moz-box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.selectValueAlert::-ms-expand {
	display: none;
}
.selectValueAlert:hover {
	border-color: #888;
}
.selectValueAlert:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.selectValueAlert option {
	font-weight:normal;
}*/
#titleTableAlert {
	margin: 45px 0 10px 20px;
	color: rgb(0, 17, 68) !important;
}
#titleChangeAlert {
	margin: 50px 0 10px 20px;
	color: rgb(0, 17, 68) !important;
}
.tableAlert {
	margin: 0 0 -10px 20px !important;
	font-size: 14px;
	width:70% !important;
	color: white !important;
	text-align: center !important;
}
.tableAlert th, .tableAlert td {
	line-height:5px !important;
	text-align: center !important;
}


#displayUser {
	font-weight: bolder;
	font-size: x-large;
	margin-left: 20%;
	color: rgb(19, 19, 61);
}

#listMbsLogin {
	width: 98%;
	height: 300px;
	/*background-image: linear-gradient(to bottom right, #224083, #39A9DB);*/
	background-color: rgb(34, 64, 131);
	color: rgb(211, 211, 211);
	border-radius: 15px 15px 15px 15px;
	padding: 1%;
}
#listMbsLoginFlex {
	display: flex;
	flex-direction: row;
	margin-top: 20px;
}
#listMbsLogin > span {
	width: 100%;
	font-size: x-large;
}
#listMbsForLogin {
	width: 30%;
	margin-left: 5%;
}
#nbConnTabs {
	width: 35%;
	margin-left: 5%;
}
#listDateConnexion {
	width: 25%;
}
.selectListMbs {
	font-size: 14px;
	font-weight: 1000;
	width: 30%;
	max-width: 30%;
	margin: 30px 0 30px 20px;
}
.selectListMbs option {
	font-weight: 1000;
	font-size: 16px;
}
#navDateLogin ul {
	height: 170px;
	width: 70%;
	border-radius: 10px;
	background-color: rgb(170, 177, 250);
	color: black;
	overflow:hidden;
	overflow-y:scroll;
}
#ulDateLogin li {
	font-size: calc(12px + 6 * ((30vw - 400px) / 250));
}

.divSwitchBtn {
	padding-bottom: 10px;
}
#slider1, #slider2 {
	margin-left: 50px;
}
.switch {
	position: relative;
	display: inline-block;
	margin-bottom: -8px;
	margin-right: 50px;
	width: 70px;
	height: 30px;
	background-color: #bb0808;
	border-radius: 20px;
	transition: all 0.3s;
}
.switch::after {
	content: '';
	position: absolute;
	width: 27px;
	height: 27px;
	border-radius:50%;
	background-color: white;
	top: 1px;
	left: 1px;
	transition: all 0.3s;
}
  
.checkbox:checked + .switch::after {
	left : 40px;
}
.checkbox:checked + .switch {
	background-color: #42f020;
}
.checkbox {
	display : none;
}


/* Website version 2.0 */

.titleSession {
	padding-left: 40%;
}
.titleListProj {
	color: rgb(0, 0, 0);
	width: 100%;
	padding: 20px 10px;
	font-weight: bolder;
	font-size: calc(20px + 6 * ((100vw - 700px) / 680));
}
.btnListProj li {
	width: 90%;
	margin: auto;
	font-size: calc(10px + 6 * ((100vw - 700px) / 680));
}
#listProjects, #managProj {
	display: flex;
	flex-direction: row; /* Afficher les colonnes côte à côte par défaut */
	padding-top: 30px;
}
.listProjectsUser {
	flex: 0 0 20%; /* Colonne de gauche avec une largeur fixe de 20% */
}

.detailsProjectsUser {
	flex: 1; /* Colonne de droite qui utilise le reste de l'espace disponible */
	margin-bottom: 50px;
}

.containerDetailsProj {
	position: relative;
	display: flex;
	flex-direction: row; /* Afficher les colonnes côte à côte par défaut */
    border: 1px solid rgb(34, 64, 131);
	border-radius: 5px;
	width: 100%;
	height: auto;
    margin: 0 auto;
    padding: 30px 10px;
	font-size: calc(10px + 6 * ((150vw - 700px) / 1200));

}
.listDtlProj {
	flex: 0 0 45%; /* Colonne de gauche avec une largeur fixe de 45% */
	margin-top: 20px;
	margin-left: 7%;
}
.colHundredPercent {
	flex: 0 0 100% !important; /* Colonne de gauche avec une largeur fixe de 100% */
}
.listDtlProj table th {
	padding-right: 15px;
	padding-bottom: 10px;
	vertical-align: top;
}
.pictDtlProj {
	flex: 1; /* Colonne de droite qui utilise le reste de l'espace disponible */
	margin: 20px 10px;
}
.txtDtlsProj {
	text-decoration: underline;
}
#goToProjPage {
	position: absolute;
	right: 0;
/*	bottom: 0;*/
	background-color: rgb(37, 91, 255);
	padding: 5px;
	margin: 5px;
	border-radius: 10px;
}
#goToProjPage a {
	color: white;
	text-decoration: none;
	font-size: calc(16px + 6 * ((30vw - 300px) / 150));
}
#goToProjPage:hover {
	background-color: rgb(0, 17, 68);
}
.btnOpenNewMb {
	border-radius: 4px;
	background-color: rgb(37, 91, 255);
	border: none;
	color: #fff;
	text-align: center;
	font-size: calc(10px + 6 * ((100vw - 700px) / 680));
	padding: 0 16px;
	padding-bottom: -40px !important;
	width: 150px;
	transition: all 0.5s;
	cursor: pointer;
	box-shadow: 0 10px 20px -8px rgba(37, 91, 255,.7);
	display: inline-block;
	position: relative;
	transition: 0.5s;
}
.btnOpenNewMb:after {
	padding: 0 16px;
	content: '»';
	position: absolute;
	opacity: 0;  
	right: -20px;
	transition: 0.5s;
}
.btnOpenNewMb:hover{
	background-color: rgb(0, 17, 68);
	box-shadow: 0 10px 20px -8px rgba(0, 0, 0,.7);
	padding-right: 24px;
	padding-left:8px;
}
.btnOpenNewMb:hover:after {
	box-shadow: 0 10px 20px -8px rgba(37, 91, 255,.7);
	opacity: 1;
	right: 10px;
}
	
/* Utilisez une règle de média query pour ajuster la mise en page en dessous de 600px */
@media (max-width: 800px) {
	#listProjects {
		flex-direction: column; /* Afficher les colonnes les unes au-dessus des autres */
	}
	.containerDetailsProj {
		flex-direction: column; /* Afficher les colonnes les unes au-dessus des autres */
	}

	.detailsProjectsUser, .listDtlProj, .pictDtlProj {
		flex: 1; /* Les deux colonnes utilisent 100% de la largeur */
	}
}

.ampopup-title {
	font-weight: bold;
	font-size: 120%;
	background: #777;
	color: #000;
}
  
  

.selectListExp {
	font-size: rem1.1;
	padding: 2px 5px;
	color: #FFF;
	background-color: rgb(0, 17, 68);
	border-radius: 5px;
}
#pictAdminDetailProj img {
	border-radius: 10px;
	margin-top: 30px;
}  
.positionBtn {
	right: 0;
	bottom: 0;
	position: absolute;
	margin: 20px;
}
.btnCreateNewProj, .btnModProj {
	background-color: rgb(37, 91, 255) !important;
	right: 0;
	bottom: 0;
	position: absolute;
}
.btnDisplaySensor {
	background-color: rgb(37, 91, 255) !important;
	margin-bottom: 30px !important;
}
.btnCreateNewProj:hover, .btnModProj:hover, .btnDisplaySensor:hover{
	background-color: rgb(0, 17, 68) !important;
	box-shadow: 0 10px 20px -8px rgba(0, 0, 0,.7) !important;
}
#listBattLvl h2, #formNewProj h2, #formModProj h2, #formModSens h2{
	font-weight: bolder;
	color: rgb(0, 17, 68);
	font-size: rem1.1;
}
#listBattLvl h3 {
	font-weight: bold;
	color: rgb(34, 64, 131);
	font-size: rem1.2;
}
#listBattLvl .enumBattLvl {
	margin-left: 20px;
	font-size: rem0.9;
}
.battOK {
	color: rgb(30, 134, 21);
}
.battToCheck {
	color: rgb(255, 166, 12);
}
.battToChange {
	color: rgb(134, 21, 21);
}
#userNewProj, #nameNewProj, #pswdNewProj, #refNewProj, #addressNewProj, #nbFissNewProj, #nbPiezoNewProj, #nbInclinoNewProj, #nbPluvioNewProj,
#userModProj, #nameModProj, #pswdModProj, #refModProj, #addressModProj, #nbFissModProj, #nbPiezoModProj, #nbInclinoModProj, #nbPluvioModProj,
#sensorID, #initialOpening, #inUseOrNot, #correctionToAdd, #stoppedOrNot, #facade, #infoMisc, #profFond, #profPiezo, #limitMax, #limitMin {
	height: 30px;
}
#formNewProj, #formModProj, #formModSens {
	width: 100% !important;
}
#flexFormNewProj {
	width: 100% !important;
	display: flex;
}
/* Utilisez une règle de média query pour ajuster la mise en page en dessous de 800px */
@media screen and (min-width: 800px) {
	#flexFormNewProj {
		flex-direction: row; /* Afficher les colonnes côte à côte par défaut */
	}
	#flexCol1, #flexCol2 {
		width:47%;
	}
	.margNeg {
		margin-top: -30px;
	}
}
@media screen and (max-width: 800px) {
	#flexFormNewProj {
		flex-direction: column; /* Afficher les colonnes les unes au-dessus des autres */
	}
	#flexCol1, #flexCol2 {
		width:100%;
	}
	.margNeg {
		margin-top: 0px;
	}
}
#flexCol1, #flexCol2 {
	padding-left: 10px;
}
#formNewV2 label{
	width: 100% !important;
	text-align: right;
	padding-bottom: 15px;
}
#flexCol1 input{
	width: 100% !important;
}
#flexCol2 {
	padding-left: 10%;
}
#flexCol2 h3{
	padding-bottom: 25px;
}
#flexCol2 label{
	width: 10em;
	padding-right: 30px;
	padding-bottom: 17px;
}
#flexCol2 input{
	width: 3em !important;
	padding-left: 10px;
}
.set-width-input {
	width: 150px !important;
}

.trHeight {
	height: 40px;
}
.alignRight {
	text-align: right;
}
.paddingBot {
	padding-bottom: 10px;
}
.noBorder > input {
    outline:none !important;
    outline-width: 0 !important;
	border: none;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
	background-color: #dddddd;
}
[type=checkbox] {
	width: 2rem;
	height: 2rem;
	color: dodgerblue;
	vertical-align: middle;
	-webkit-appearance: none;
	background: none;
	border: 0;
	outline: 0;
	flex-grow: 0;
	border-radius: 50%;
	background-color: #FFFFFF;
	transition: background 300ms;
	cursor: pointer;
	margin-bottom: 20px !important;
  }
  
  
  /* Pseudo element for check styling */
  
  [type=checkbox]::before {
	content: "";
	color: transparent;
	display: block;
	width: inherit;
	height: inherit;
	border-radius: inherit;
	border: 0;
	background-color: transparent;
	background-size: contain;
	box-shadow: inset 0 0 0 1px #CCD3D8;
  }
  
  
  /* Checked */
  
  [type=checkbox]:checked {
	background-color: currentcolor;
  }
  
  [type=checkbox]:checked::before {
	box-shadow: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E %3Cpath d='M15.88 8.29L10 14.17l-1.88-1.88a.996.996 0 1 0-1.41 1.41l2.59 2.59c.39.39 1.02.39 1.41 0L17.3 9.7a.996.996 0 0 0 0-1.41c-.39-.39-1.03-.39-1.42 0z' fill='%23fff'/%3E %3C/svg%3E");
  }
  
  
  /* Disabled */
  
  [type=checkbox]:disabled {
	background-color: #CCD3D8;
	opacity: 0.84;
	cursor: not-allowed;
  }
  
.listCd {
	font-weight: bold;
	color: rgb(34, 64, 131);
	font-size: calc(16px + 6 * ((30vw - 300px) / 150));
}
.tableData {
	line-height: 20px;
	font-weight: bold;
	margin: 0 40px;
	text-align: center !important;
}
.tableData th {
	padding-right: 15px;
	vertical-align: top;
	padding-bottom: 10px;
}