/*Questo disabilita gli stili automatici dei browser */
input,reset, select, textarea, button {
  -webkit-appearance: none; /* Safari / Chrome */
  -moz-appearance: none;    /* Firefox */
  appearance: none;         /* standard */
}


:root {
 --margin-inferiore:10px;
}

/* Ora scegliamo noi gli stili da usare*/


/* Input text*/

/* stile base per l'input email */
input[type="email"] {
  width:330px;
  border: 1px solid #aaa;    /* bordo grigio */
  border-radius: 6px;        /* angoli arrotondati */
  font: inherit;             /* eredita il font dal body */
  color: #333;               /* testo scuro */
  background-color: #fff;    /* sfondo bianco */
  box-sizing: border-box;    /* include padding nel calcolo della larghezza */
  margin-bottom: calc(var(--margin-inferiore));
}


/* SELECT  */

.optionsClass>select
{
  width: 330px;
  padding: 5px;         /* spazio interno */
  border: 1px solid #ff8912;    /* bordo grigio */
  border-radius: 6px;        /* angoli arrotondati */
  background-color: #ce7a2b29;    /* sfondo bianco */
  font: inherit;             /* eredita font dal body */
  color: #000000;               /* testo scuro */    
  margin-bottom: var(--margin-inferiore);
}






/* SUBMIT style */

/* stile base */
input[type="submit"]  , input[type="reset"] {
  width:330px;
  background-color: #ff791a;   /* sfondo blu */
  color: #ffffff;                 /* testo bianco */
  border: none;                /* senza bordo nativo */
  border-radius: 6px;          /* angoli arrotondati */
  padding: 5px 8px;          /* spazio interno */
  font: inherit;               /* stesso font della pagina */
  cursor: pointer;             /* cursore a mano */
  transition: background 0.3s; /* animazione morbida al passaggio */
  margin-bottom: var(--margin-inferiore);
}

/* al passaggio del mouse */
input[type="submit"]:hover , input[type="reset"]:hover {
  background-color: #1a4db5;   /* blu più scuro */
}

/* quando cliccato */
input[type="submit"]:active , input[type="reset"]:active {
  background-color: #123273;   /* ancora più scuro */
}

/* se è disabilitato */
input[type="submit"]:disabled {
  background-color: #ccc;
  cursor: not-allowed;
}

