/* calculator design border/bredte en kleuren enzo*/
.Calculator {
    border: 2px solid grey; /* grijze border 2 pixels dik*/
    border-radius: 6px; /* maakt border wat ronderiger  */
    width: 500px; /* maakt rekenmachine breder */
    margin: auto; /* zorgt ervoor dat de calculator in het midden van de pagina staat*/
    background-color: white; /* Witte achtergrond */
}
/* design van de titel php calculator ++*/
.h1-title {
    color: black; /* tekst kleur zwart*/
    font-size: 40px; /* de groote 40 pixels */
    font-family: sans-serif; /* Letter type */
}
/* blauwe vak in de top van de calculator*/
.top {
    background-color: #1e88e5; /* blauw achtergrond */
    border: 1px solid grey; /* grijze border */
    text-align: center; /* Tekst in het midden zetten (center) */
}
/* velden waar je de nummers in moet vullen*/
.number-fields {
background: white; /* achtergrond number velden */
 padding: 2rem;  /* afstand tussen 2 number velden */
} 
/* design fields*/
.field {
    margin-bottom: 1.5rem; 
    input { 
    width: 300px; 
    padding: 0.75rem; 
    border: 2px solid black; 
    border-radius: 6px;}
}
/* h1 tekst design select operation */
.operations-title {
    text-align: center;
    font-family: sans-serif;
}
/* de vakken die je kan selecteren voor de formules */
.operations_checkboxes {
    margin: 20px;
}
/* calculate submit design */
#cbtn {
    background-color: #007bff;
    color: white; 
    padding: 12px 24px; 
    border: none;
    border-radius: 8px;
    font-size: 16px; 
    cursor: pointer;   
   
}
/* plek waar de de 2 knoppen staan */
.button-container {
   
  width: 200px;
  margin: 0 auto;

}
/* reset button */
#rbtn {
     background-color: #d1d873;
    color: white; 
    padding: 12px 24px; 
    border: none;
    border-radius: 8px;
    font-size: 16px; 
    cursor: pointer;   
}
/* plek waar reset staat*/
.button-container-reset {
     width: 200px;
  margin: 0 auto;
  padding: 10px;
}
/* de body van de hele pagina*/
body {
    background-image: url(../img/jens4k4k.jpg);
    font-family: sans-serif;
}
.results { 
    background-color: orange;
}