.theme-light {
    --color-secondary: #fbfbfe;
    --color-button: #cbeef8;
    --color-select: #D3D3D3;
     --color-button-gris: #D3D3D3;/*LightGray*/
    --font-color: #000000;
    --color-input:#fef9e7   ;
    --color-range:#525e6b;
    --color-warning:  #fd3f3f ;/*#ff370c ;*/
  }
.theme-dark {
    --color-secondary: #243133;
    --color-button: #116179;
    --color-select: #696969;
    --color-button-gris: #696969; /*slateGray*/
    --font-color: #ffffff;
    --color-input:#283747 ;
    --color-range:#525e6b;
    --color-warning:  #fe8d8d;
  }


html {
    background: var(--color-secondary);
    color: var(--font-color);
}

header 
{   
    justify-content: center;
    align-items: center;
    width:90wv;
    margin: auto;
    padding:0px 5px 0px 5px;
    border: 1px solid var(--font-color);
    overflow: auto;
    
}

#imgBandeau{display : none;}
#nomAvion{display : none;}
#vues{display : none;}
#btnShowBase {display : none;}

#selAvion{
    color: var(--font-color);
    background-color: var(--color-button-gris);
    max-width:100px;
    height: 22px;
    
}


header ul { 
    display : inline-block;
   /* margin-top: 40px;
    flex:3;*/
}

.smallButton
{
  font-size: 0.8em;
  color: var(--font-color);
  padding: 2px 5px 2px 5px;
  margin:1px;
  text-decoration: none;
  border-bottom: 1px outset #760001;
  border-radius: 4px;
  background-color: var(--color-button);
}

#btnTheme{
    float : right;
    margin-top: 10px;
   /* flex:0.5
    margin-left: 20px;;*/
}



#chargement{
    width:50wv;
    margin-top: 10px;
     border: 1px solid var(--font-color);
     padding : 5px;
}

#chargement h4{
     color : var(--color-warning);
    margin-top: 0px;
    margin-bottom: 0px;
}

#chargement form{
    display :flex;
}


label {
    font-size: 0.8em;
    color : var(--font-color);
    margin-right: 15px;
}

.rang input {
  background-color: var(--color-input);
  color:var(--font-color);
  height: 10px;
  width: 50px;
  margin: 5px;
  padding:5px;
  border-width: 1px;
  border-radius: 6px;
}


#btnCalculer {
  /*margin-top: -20px;
  display: block;*/
  float: left;
}

#essence
{ 
  margin-top:20px;
  margin : 40px 5px 5px 5px;
  padding:5px;
  border: 1px solid var(--font-color);
}


#essence form {
    display:flex;
}

#essence form input{
    max-width: 100px;
    margin-right: 20px;
}

.conso
{
  font-size: 0.8em;
  color: var(--font-color);
  border: 1px solid var(--font-color);
  width : 30px;
  padding-left: 2px;
  padding-right: 2px;
  margin-left:5px;
  text-decoration: none;
  border-radius: 4px;
  background-color: var(--color-input);
}

#reserve{
    font-size: 8em;
    font-style: italic;
}


#dessin{
   
  /*  max-width: 50%;
   max-height: 100vw;*/
}

#canevas
{
   background-color: var(--color-input);

   /*aspect-ratio: 1 /1;*/
  width: min(100%, 100%);
  /*height: auto;*/
  max-height: 100%;
}




#info{
    width:90wv;
    max-height: 100px;
    padding: 5px 20px 5px 20px;
    font-size: 0.8em;
    overflow: auto;
    color :var(--font-color);
    border: 1px solid var(--font-color);
}

#avion{

}

footer p {
  margin-left: 25px;
  width : 90vw;
  color : var(--color-warning);
  font-size: 0.8em;
}

#alertePrint
{
  color: var(--color-secondary);  /*243133*/
}