body{
	font-family: "Lato", sans-serif;
	background-color: rgba(255, 255, 255, 0);
	/*overflow-x: hidden;*/
}
body {
  font-family: "Outfit", sans-serif;
}
.Outfit {
  font-family: "Outfit", sans-serif;
}

:root{
	--main-fontsize: 13px;
}

body {
  margin: 0;
  padding: 0;  

}

* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.page {
 	 width: 1100px;
  	min-height: 29.7cm;
	padding: 10px;
  	border-radius: 3px;
  	box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.pagePDF {
  width: 21cm;
  min-height: 29.7cm;
  border-radius: 3px;
  background: white;
}

@page {
  size: A4;
}

@media print {
  .page {
    page-break-after: always;
  }
}


.bandeau_ref_projet{
	border:1px solid rgb(43, 43, 43);
	display:inline-flex;
	width:100%;
}


.ref_projet{
	min-width: 50px;
	background: rgba(255, 233, 110, 0.747);
	padding: 3px 10px 3px 10px;
	border-radius:7px;
	font-size: 25px;
	width:fit-content;
	height:fit-content;
	margin:5px 10px 5px 10px;
	text-align: center;
}

.appelation{
	font-size: 18px;
	grid-row: 1;
	margin:0px;
	transform: translateY(4px);
}
.coord{
	color:rgb(0, 0, 0);
	font-size: 11px;
	grid-row: 2;
	margin:0px;
}
a,p, .coordonnees{
	color:rgb(0, 0, 0);
	font-size: 11px;
	margin:0px;
}
.info_production{
	font-size: 12px;
	border:0px solid red;
	width:300px;
}

.container-maps{
	width:100%;
	display:flex;
	justify-content: space-evenly;
	
}

.recherche-adresse-container{
    height:fit-content;
	margin-top:20px;
	right:-10px;
	z-index:999;
	border-radius: 5px;
	background: white;
	width:480px;
}

.info_conso{
	width:480px;
	height:300px;
	border:0px solid black;
	margin-top:20px;
}

#mymaps{
	margin:0px 0px 0px 0px;
	border-radius: 3px;
	width:100%;
	height:250px;
	min-width: none;
}

.attribut_donnee{	
		display:block;
		margin-inline: 10px;
		width:fit-content;
		height:fit-content;
		border-radius: 20px;
		box-shadow: 0px 5px 20px -10px rgba(0, 0, 0, 0.212);
		overflow:hidden;
		background:white;
		padding: 20px;
		
}

.po{
	font-size: var(--main-fontsize);
	border-radius: 12px;
	background-color: #ffffff;
	color: rgb(0, 0, 122);
	cursor:pointer;
	border:none;
	padding: 5px 10px;
	text-align:center;
	margin: 0px;
}
.po:hover{
	background:rgb(219, 237, 255);
	color:rgb(0, 62, 119);
}


.t1{
	backdrop-filter: blur(0px);
	background:rgb(255, 255, 255);
    text-align:center;
	font-size: 10px;
	padding: 0px;
	z-index:999;
	width:fit-content;
	height: fit-content;
	font-size: var(--main-fontsize);

	caption{padding: 1px; text-align:left;};
	th, td{
  		vertical-align: middle;
		min-width:80px;

	};
}
.consomation_annuelle_PDF{display:flex;align-items: center;

}
.graph_conso_PDF{
	display:flex;
	width:100%;
	height:50%;
}

.bandeau_PV{
	width:99%;
	height:70px;
	border-top-left-radius: 25px;
	border-top-right-radius: 25px;
	border:none;
	display:flex;
	justify-content: space-evenly;
	align-items: center;
	background: linear-gradient(90deg,rgba(251, 255, 9, 0.952) 70%, rgb(253, 228, 5) 100%);
}
.tableau_champs_PDF{

	display:flex;
	justify-content:center;
	align-items: center;
	margin-inline:auto;
	
	
}
.tableau_champs_PDF .table_champ_PV{
	width:70%;
	margin-top:40px;
	padding:10px;
	border-bottom:1px solid rgba(185, 185, 185, 0);
	border-radius: 10px 10px 0px 0px;
	border:1px solid rgba(114, 114, 114, 0.952);
	border-bottom: 0px;

}
.table_champ_PV td{
	font-size:12px;
	text-align: center;
}
.prod_champ_PV{
	border-radius: 5px;
	border:1px solid black;
}
.puissance_champ_PV{
	border-radius: 5px;
	background: linear-gradient(0.25turn,#ff8636, #ffaa0d);
	color:rgb(255, 255, 255);
}
.param_champ_PV{
	border-radius: 5px;
	background: rgb(216, 113, 17);
	color:white;
	padding:3px;
}

.info_install{
	margin-inline:10px;
	font-size: 30px;
	text-shadow: 1px 1px 0 #ffffff, 2px 2px 0 #ffffff;
}

.bandeau_Batterie{
	width:99%;
	height:70px;
	display:flex;
	justify-content: space-evenly;
	align-items: center;
	border-bottom-left-radius: 25px 30px;
	border-bottom-right-radius: 25px;
	background:
	linear-gradient(12deg, rgba(54, 255, 4, 0.699)  10%, rgba(114, 247, 158, 0.973) 98%);
	
	border-top:3px solid black;
}

.horizon_chart{
	width:40vw;
	height:150px;
}


.résultatsannuelPDF{
	display:flex;
	justify-content: center;
	align-items: center;
}

.Head{
	background:rgb(75, 75, 75);
	border-top-left-radius:15px;
	border-top-right-radius:15px;
	color:white;
	width: 60px;
	height:30px;
	font-size: var(--main-fontsize);
}

.Head-installation{
	background:rgb(75, 75, 75);
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	color:white;
	font-size: var(--main-fontsize);
	width:130px;
}



.bouton-recherche{
	/*filter: invert(100%);*/
	display:inline;
	position: relative;
	background: rgba(255, 255, 255, 0);
	top: 7px;
	right:0px;
	width:30px;
	transition: transform 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
	z-index:1000;
}
.bouton-recherche:hover{
	animation-name: rotate;
	animation-duration: 0.3s;
}
#Adresse{
	display: relative;
	width:90%;
	border:none;
	margin:auto;
}

.bouton_lancer{
	width:fit-content;
	padding-inline: 30px;
	height:25px;
	color:rgb(87, 87, 87);
	font-size: var(--main-fontsize);
	margin-inline: 50px;
	border-radius: 5px;
	background: rgb(235, 235, 235);
	border:none;
}
.bouton_lancer:hover{
	transition: all 0.1s ease-out;
	background:rgba(241, 241, 241, 0.452);
	color:rgb(43, 43, 43);
	box-shadow:1px 1px 1px 2px rgb(168, 168, 168);
}
.bouton_lancer:active{
	background:rgb(211, 211, 211);
	box-shadow: -1px -1px 1px rgb(87, 87, 87);
	color:rgb(43, 43, 43);
	border:1px solid grey;
}
.bouton-courbe{
	width:70px;
	height:30px;
	position:bottom;
	transition:transform 0.1s ease-out, filter 0.2s ease;
	filter:grayscale(100);
}
.bouton-courbe:hover{
	filter:grayscale(0);
	animation-name: rotate;
	animation-duration: 0.3s;
}
@keyframes rotate {
	
	0% {
	  transform: rotate(0);
	}
	25% {
	  transform: rotate(30deg);
	}
	50% {
		transform: rotate(0);
	  }
	75% {
		transform: rotate(-30deg);
	  }
	100% {
		transform: rotate(0deg);
	  }
  }

label{
	font-size: var(--main-fontsize);
}

.detailsPDF{
	cursor: pointer;
}
.detailsPDF:hover>summary{
	background:rgba(231, 231, 231, 0.527);

}

input[type=text], input[type=number]{
	  width:100%;
	 
	  padding: 6px 6px;
	  display: inline-block;
	  border: 0px solid rgb(216, 216, 216);
	  border-bottom: 1px solid rgb(173, 173, 173);
	  border-radius: 2px;
	  box-sizing: border-box;
	  font-size: var(--main-fontsize);
	  line-height: 0.5;
	  background: rgb(255, 255, 255,1);

	}
input[type=submit] {
	padding: 5px;
	padding-inline: 15px;
	background: transparent;
	border:0.5px solid rgba(223, 223, 223, 0);
	color: rgb(20, 49, 0);
	border-radius: 5px;
	font-size: var(--main-fontsize);
	cursor: pointer;
	font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
	}

input[type=submit]:hover {
	  background:rgb(245, 245, 245);
	  color:rgb(0, 93, 180);
	}

input[type=text]:hover{
		background-color: rgb(219, 237, 255);
		color:rgb(0, 62, 119);
}
iframe {
    width:100%;
    height:400px;
	border: None;
}

.production-annuelle{
	margin: auto;
	background:rgba(255, 255, 255, 0);
	font-size: 10px;
	color:rgb(53, 53, 53);
	place-content: center;
	vertical-align: middle;
	text-align: center;
	width:fit-content;
	display:grid;
	grid-template-rows: auto auto auto;
	grid-gap: 10px;
	margin-bottom: 50px;
	margin-top:10px;

}

.info-prod{
	background:rgb(255, 255, 255);
	width:100%;
	font-size: var(--main-fontsize);
	color:rgb(31, 31, 31);
	place-content: center;
	vertical-align: middle;
	padding: 5px;
	border-radius:7px;
	border-bottom:0px solid rgb(86, 176, 218);
	transition: all 0.2s ease-out;
}

.info-prod-bold{
	font-size:18px;
	font-weight:bold;
	display:inline-block;
}
.info-prod:hover{
	color:rgb(0, 0, 0);
}

.header_prodlist{
	border-bottom: 1px solid rgba(214, 214, 214, 0);
	color:white;
	background:rgba(86, 214, 1, 0.664);
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	padding:10px;
	font-size: var(--main-fontsize);
	place-content: center;
}

.container {
	transition: height 0.3s ease-out 0.3s, opacity 0.5s ease-out 0.3s;
	margin: 30px;
	/*padding: 20px;*/
	width:95%;
	height:40vh;
	/*display:None;*/
	border-radius:10px;
	background: white;
	justify-content: middle;
	overflow-y:scroll;
	box-shadow: 0px 0px 8px 2px rgb(139, 139, 139);
	opacity:0%;
	transition: height 0.3s ease-out 0.3s, opacity 0.5s ease-out 0.3s;
}

#chart {height:100%;}

.input_conso_mois{
	width:100px;
}

.modal {
	position: fixed;
	top: 0; 
	bottom: 0; 
	right: 0; 
	width:100%; 
	height:100%; 
	z-index: 3000; 
	backdrop-filter: blur(10px);
	background-color: rgba(0, 0, 0, 0.212);
	left:-100%;
	opacity:0%;
	transition: opacity 0.5s ease-out;
}

.details{
	transition: height 0.5s ease;
	width:100%;	
}

.details > summary{
	background:Transparent;
	padding: 20px;
	border-radius: 7px;
	cursor:pointer;
	margin:5px;
	transition:background 0.4s ease;
	font-size: var(--main-fontsize);
	color: rgb(65, 65, 65);
	padding: 20px;

}

.details > summary:hover{
	background:rgb(219, 237, 255);
	color:rgb(0, 62, 119);
}

.details[open]>summary{
	background:rgb(219, 237, 255);
	color:rgb(0, 62, 119);
}
@keyframes details{
	from {
	  opacity:0;
	  transform: var(--details-translate, translateY(-0.8em));
	}
  }
details[open] > *:not(summary) {
	animation: details 300ms ease-out;
  }

.input_tarif{
	:after{
		content:" €/kWh";
	}
}

select{
	font-size: var(--main-fontsize);
	border:0px solid rgba(49, 49, 49, 0.747);
	background: rgb(255, 255, 255);
	overflow-x:hidden;
	scrollbar-width: none;
	place-content: center;
	user-select: none;
	border-radius:10px;
	height:28px;
	overflow-y: hidden;
	justify-content:middle;
}
option{
	padding-inline:20px;
	padding-top:6px;
	padding-bottom:6px;
	border:0px solid black;
	display:inline-flex;
}
select:focus{
	border:none;
}

option:hover{
	background: rgba(228, 228, 228, 0.418);
}
option:checked{
	background: rgba(49, 49, 49, 0.747);
	color: rgb(255, 255, 255);
}



.mois{
	font-size: var(--main-fontsize);
	background:rgb(223, 223, 223);
	border-radius:5px;
	color:rgb(143, 143, 143);
	translate:0px -0px;
	width:fit-content;
	height:fit-content;
	margin-left:auto;
	padding:4px;
}


.tarif_input{
	margin:3px;
	width:100px;
}
.label_tarif_input{
	margin:10px;
	display: flex;
  	flex-wrap: wrap;
}
.Inj_checkbox{
	margin: 15px;

}

  
.highlight {
	border-left: 2px solid #e7e7e7a9;
	padding-left:3px !important;
}

.dygraph-axis-label-x {
	overflow-x: hidden;
}

.dygraph-roller{
	max-width: 30px;
	transform:translateX(-80);
	background-color:transparent;
}
  

.graphique{
	margin:none;
	padding:none;
	width:100%;
	height:100%;
}

.legend-dygraph{
	background:rgb(255, 255, 255);
	z-index:9999;
	font-size: 11px;
	padding:5px;
	display:inline-block;
}

.legend-dygraph>span{
	display:inline-block;
}

.dygraph-legend{
	border-radius: 7px;
	box-shadow: 0px 1px 3px rgb(218, 218, 218);
	background:transparent;
	
}

.legend-dygraph > span > span{
  display: inline;
}

.select_courbe_button{
	border:1px solid grey;
}