@charset "utf-8";
body, #mainENR{
    background-color: white;
    font-family: Roboto, Sans-serif !important;
    font-weight: 500;
    margin: 0;
	line-height: normal !important;
}

#contentENR {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}

#formSchema, #divFormulaire {
    /*width: 100%;*/
    min-height: 400px; /* Assurez-vous que ce n'est pas à 0 */
    padding: 20px;
    box-sizing: border-box;
}

.formLigne {
    margin-bottom: 20px;
}

.logoConseil {
  height : 20px;
}

#logoAttention{
  height : 20px;
}

.logoConseil50 {
  height : 50px;
}

table th {
  text-transform: none !important;
  font-weight : bold !important;
}

h1, h2{
    color: #21a3b7;
}

h2{
    font-weight: 100;
}

a {
    color: #21a3b7;
}

form {
    /*margin: 0px 3% 0px 3%;*/
    width: 44vw;
}
@media (max-width: 700px) {
    form {
        margin: 3vh;
        width: auto;
    }
}
/*@media (min-width: 1000px) {
    form {
        margin: 0px 3% 0px 30%;
    }
}*/
#formSchema {
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 1.5vw;
}
.schemaVerreCol {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 6vw;
}
#menuiserieCol {
    width: 5vw;
}
@media (max-width: 700px) {
    #formSchema {
        width: 95%;
        flex-direction: column;
    }
    .schemaVerreCol {
        width: 20vw;
    }
}
    
#divFormulaire {
    width: auto;
}

table{
    border-collapse: collapse;
    font-size: 1.8vh;
}
@media (min-width: 1800px) {
    table{
        font-size: 1.5vh;
    }
}
th{
    background: #9ccb57 !important;
}
td, th{
    padding: 4px !important;
    border: 1px solid !important;
    text-align: center !important;
    width: auto !important;
	vertical-align: middle !important;
}
#tabTunnel {
    width: 92%;
    margin: 2vh 0px;
}
#tabPV {
    width: 80%;
    margin: 2vh 0px 7vh 0px;
}
#tabSwDebitAir {
    width: 50%;
    margin: 2vh 0px 0px 0px;
}
#tabUwDebitAir {
    width: auto;
    margin-top: 2vh;
}
#tab15m3h {
    width: 35%;
    height: 10vh;
    margin-top: 2vh;
}

.tabVal {
    width: auto;
    height: 10vh;
    margin-top: 2vh;
}

header {
    position: fixed;
    z-index: 15;
    top: 0px;
    left: 0px;
    margin: 0px;
    padding: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto;
    background-color: white;
}

#logoEnr{
    margin-bottom: 8px;
}

#contentENR {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0px;
    padding: 0px;
    margin-top: 2.5vw;
}

label {
    font-size: 2.1vh;
}

input, select {
    margin-left: 1vh !important;
    border-radius: 5px !important;
    border: solid 2px #9ccb57 !important;
    font-size: 1.8vh !important;
    font-family: Roboto, Sans-serif !important;
    font-weight: 500 !important;
    background-color: #f6fcfd !important;
	width: auto !important;
}

select option {
    color: black !important;
}

input {
  max-width: 200px !important;	
}

@media (min-width: 1800px) {
    label, input, select {
        font-size: 1.8vh;
    }
}
input:hover {
    margin-left: 1vh !important;
    border-radius: 5px !important;
    border: solid 2px #21a3b7 !important;
}
select:hover {
    margin-left: 1vh !important;
    border-radius: 5px !important;
    border: solid 2px #21a3b7 !important;
    cursor: pointer !important;
}
input:focus, select:focus {
    margin-left: 1vh !important;
    border-radius: 5px !important;
    border: solid 2px #21a3b7 !important;
    outline: none !important;
}

#submitButton{
    margin: 0px 0px 4vh 0px !important;
    background-color: #21a3b7 !important;
    border-radius: 10px !important;
    border: 0px !important;
    cursor: pointer !important;
    color: white !important;
    padding: 1.5vh !important;
    font-size: 2vh !important;
    font-weight: 600 !important;
}
@media (min-width: 1800px) {
    #submitButton {
        font-size: 1.7vh;
    }
}
#submitButton:hover{
    transform: scale(1.05);
}

#formSeuil {
    --affichage: none;
    display: var(--affichage);
}

#formComposition {
    --affichage: none;
    display: var(--affichage);
}

#divCalculs {
    --affichage: none;
    display: var(--affichage);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: auto;
    width: auto;
}

#fenetreEnr1 {
	height: 215px;
    margin-right: 6vw;
}

#logoPDF {
	height: 65px;
}

#fenetreEnr2 {
    margin-top: 7.5vh;
}

#description {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: #21a3b7;
    color: white;
    height: auto;
    font-size: 2.2vh;
    width: 100%;
    padding: 1.5vh 0px 1.5vh 0px;
}
@media (max-width: 700px) {
    #description {
        flex-direction: column;
    }
}
@media (min-width: 1800px) {
    #description {
        font-size: 1.9vh;
    }
}

#description ul h3{
    margin: 1vh;
    list-style-type: "";
    margin-left: 7.5vw;
}
#description ul li{
    margin: 1vh;
    list-style-type: "";
}
#description ul{
    margin-bottom: 3vh;
}

.titreTab {
    margin: 5vh 0px 0px 0px;
    color: #21a3b7 !important;
    font-size: 2.6vh;
	font-weight: 500 !important
}
@media (min-width: 1800px) {
    .titreTab {
        font-size: 2.3vh;
    }
}

#calculs {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #21a3b7;
    color: white !important;
    height: auto;
    width: 100%;
    padding: 1.2vh 0px 2.5vh 0px;
    font-size: 2.2vh;
}
@media (min-width: 1800px) {
    #calculs {
        font-size: 1.9vh;
    }
}
#calculs h3{
    margin: 1.8vh;
	color: white !important;
	font-weight: 500;
}

h3{
    margin: 1.8vh;
	color: white !important;
	font-weight: 500;
}

.ligne {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0px;
    gap: 10vh;
}

.colonne {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.ligneCol {
    margin: 1vh;
}

#div2tabCalc {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: baseline;
    width: 90%;
    height: auto;
    gap: 6vw;
    margin: 0px;
}

.tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.calcS {
    margin-top: 5vh;
}

#logoRidoret {
    margin: 8vh 0px 4vh 0px;
}

.formLigne {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 1.5vh 0px 1.5vh 0px;
    padding: 0px;
}

.formLigneBoutonSchema {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
    margin: 1.5vh 0px 1.5vh 0px;
    padding: 0px;
	margin-left: 100px;
}

.formLigneSchemaMenuiserie {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: 0 0 0 65px;
    padding: 0px;
}

.conseil {
    --affichage: none;
    display: var(--affichage);
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0;
    margin-left: 1.5vw
}
.conseil p {
    margin: 0px 0px 0px 0.2vw ;
    color: #1160a1;
}

.probleme {
    --affichage: none;
    display: var(--affichage);
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0;
    margin-left: 1.5vw;
}
.probleme p {
    margin: 0px 0px 0px 0.2vw ;
    color: #ff9000;
}

#divConseilVitrage {
    display: flex;
}

#divConseilVisible {
    display: flex;
    margin: 1vh 0px 4vh 0px;
}

#divInfos {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 7px #9ccb57 solid;
    border-radius: 5px;
    padding: 2vh;
    gap: 1vw;
    font-size: 2vh;
	font-weight: normal;
}
@media (min-width: 1800px) {
    #divInfos {
        font-size: 1.7vh;
		font-weight: normal;
    }
}

#colNonVisible{
    border: none;
    background-color: white;
}

#divPbFE {
    margin: 0;
}

#schema {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-bottom: 5vh;
}
.texteSchema {
    margin: 2.5vh 1vh 0px 1vh;
    font-size: 1.7vh;
}

#schemaVerreRow {
    display: flex;
    flex-direction: row;
    align-items: start;
}

.schemaVerre {
    background-color: rgb(211, 234, 248);
    height: 16vh;
    width: 0.8vw;
    border: 1px solid black;
    display: flex;
    align-items: center;
    justify-content: center;
}

.texteExtInt {
    margin: 0;
    font-size: 1.7vh;
    font-weight: bold;
}

#schemaTitre {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#schemaTitre .schemaTextTitre {
    color: black;
    font-weight: bold;
    margin-bottom: 3vh;
}

#schemaTitreMenuiserie {
    --affichage: none;
    display: var(--affichage);
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 42vh;
    min-height: 48vh;
}
#schemaTitreMenuiserie h4 {
    color: #21a3b7;
    margin: 0px 0px 2.5vh 0px;
}

#graphiqueUw {
    margin-top: 1.5vh;
    width: 40vw;
    height: auto;
    margin-bottom: 3vh;
}
@media (min-width: 1800px) {
    #graphiqueUw {
        width: 40vw;
    }
}

#graphiqueSw {
    margin-top: 1.5vh;
    width: 40vw;
    margin-bottom: 5vh;
}

.ligneCategories {
    padding: 2.5vh 0vh 2.5vh 0vh;
}

#divConseilVisibleTab{
    display: flex;
    font-size: 1.9vh;
    margin: 0;
}

#aPDF {
    cursor: pointer;
    text-decoration: none;
    margin: 0vh 0vh 0vh 7.5vw;
}
#divPDF {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: white;
    padding: 1.2vh;
    border-radius: 10px;
    border: 5px solid #ebebeb;
}
.textPDF {
    margin: 0.5vh 0px 0px 0px;
    color: red;
}

#divDetailsCalculsUw, #divDetailsCalculsSw {
    --affichage: none;
    display: var(--affichage);
    flex-direction: column;
    align-items: center;
    height: 100%;
}

#divDetailsCalculsSw {
    margin-bottom: 5vh;
}

.afficheDetails {
    margin: 5vh 0px 0px 0px;
    background-color: #21a3b7;
    border-radius: 10px;
    border: 0px;
    cursor: pointer;
    color: white;
    padding: 1.5vh;
    font-size: 2vh;
    font-weight: 600;
}
.afficheDetails:hover {
    transform: scale(1.05);
}
#idDetailsUw, #idDetailsSw {
    --affichage: flex;
    display: var(--affichage);
}
@media (min-width: 1800px) {
    #idDetailsUw, #idDetailsSw {
        font-size: 1.7vh;
    }
}


.cacheDetails {
    margin: 5vh 0px 0px 0px;
    background-color: #21a3b7;
    border-radius: 10px;
    border: 0px;
    cursor: pointer;
    color: white;
    padding: 1.3vh;
    font-size: 1.6vh;
    font-weight: 600;
}
.cacheDetails:hover{
    transform: scale(1.05);
}

.apparait {
    display: none;
    position: absolute;
    z-index: 10;
    background-color: #f5f5f5;
    padding: 1.2vh;
    border: rgb(226, 226, 226) 4px solid;
    border-radius: 10px;
    width: 15vw;
    bottom: -2.2vh;
    left: 2.5vh;
}
@media (min-width: 1800px) {
    .apparait {
        padding: 0.9vh;
        left: 2vh;
        font-size: 1.3vh;
    }
}
#apparaitAsterisque {
    left: 3.1vh;
}
@media (min-width: 1800px) {
    #apparaitAsterisque {
        left: 2.5vh;
        bottom: -1.1vh;
    }
}

.survol {
    position: relative;
    width: 20;
    display: flex;
    flex-direction: row;
}
.survol:hover {
    transform: scale(1.2);
    font-size: 1.6vh;
    cursor: help;
}
.survol:hover .apparait {
    display: block;
    cursor: help;
}

.divLigne {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0.5vw;
}

.enColonne {
    display: flex;
    flex-direction: column;
}
.enLigne {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.divColonne {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5vw;
}

#menuiserie {
    background-color: rgb(235, 235, 235);
    --hauteur: 0vh;
    --largeur: 0vh;
    height: var(--hauteur);
    width: var(--largeur);
    max-height: 32vh;
    max-width: 32vh;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px black solid;
    margin-top: 7vh;
}

#hauteurMenuiserie {
    --affichage: none;
    display: var(--affichage);
    width: 8vh;
    transform: rotate(-0.25turn);
}

#largeurMenuiserie {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

#schemaCadre1 {
    background-color: rgb(194, 194, 194);
    --hauteur: 0vh;
    --largeur: 0vh;
    height: var(--hauteur);
    width: var(--largeur);
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px black solid;
    --bordureDroite: 1px black solid;
    border-right: var(--bordureDroite);
}
#schemaCadre2 {
    background-color: rgb(194, 194, 194);
    --hauteur: 0vh;
    --largeur: 0vh;
    height: var(--hauteur);
    width: var(--largeur);
    display: flex;
    justify-content: center;
    align-items: center;
    --bordure: 0px black solid;
    border: var(--bordure);
}
#schemaVerre1 {
    background-color: rgb(211, 234, 248);
    --hauteur: 0vh;
    --largeur: 0vh;
    height: var(--hauteur);
    width: var(--largeur);
    max-height: 30vh;
    max-width: 30vh;
    border: 1px black solid;
}
#schemaVerre2 {
    background-color: rgb(211, 234, 248);
    --hauteur: 0vh;
    --largeur: 0vh;
    height: var(--hauteur);
    width: var(--largeur);
    max-height: 30vh;
    max-width: 30vh;
    --bordure: 0px black solid;
    border: var(--bordure);
}

#mentions {
    font-size: 1.7vh;
    margin-bottom: 5vh !important;
	font-weight: normal;
}
@media (min-width: 1800px) {
    #mentions {
        font-size: 1.5vh;
    }
}

#divMentions {
    width: 65%;
}
@media (max-width: 1300px) {
    #divMentions {
        width: 95%;
    }
}
@media (min-width: 1800px) {
    #divMentions {
        width: 55%;
    }
}

#largeur {
    width: 15vh;
}

#hauteur {
    width: 15vh;
}

#precision {
    padding-left: 5vh;
    margin: 0px;
    font-size: 1.8vh;
    font-style: italic;
}

#divForm {
    height: 100%;
    width: 45%;
    align-items: start;
}

p {
	margin: 0 0 0 0 !important;
}

#divAcoustique {
    width: 100%;
    text-align: center;
    font-size: 1.9vh;
    margin-top: 2.5vh;
    margin-bottom: 2.5vh;
    font-weight: normal;
}

#divEco {
    width: 100%;
    text-align: center;
    font-size: 1.9vh;
    margin-top: 2.5vh;
    font-weight: normal;
}
#divEcoLien {
    width: 100%;
    text-align: center;
    font-size: 1.6vh;
    margin-top: 1vh;
    font-weight: normal;
}

#bilanSaisie{
    margin: 1.8vh !important;
	color: white !important;
	font-weight: 500 !important;
    font-size: 1.4vw !important;
}