/* ——————————————————————- */
/* STILI GLOBALI E SFONDO */
/* ——————————————————————- */
body {
font-family: ‘Helvetica Neue’, Arial, sans-serif;
background-color: #f4f7f6; /* Sfondo grigio molto chiaro */
color: #333;
line-height: 1.6;
margin: 0;
padding: 20px;
}
/* ——————————————————————- */
/* CONTENITORE PRINCIPALE DEL FORM */
/* ——————————————————————- */
#quizForm {
max-width: 800px; /* Limita la larghezza per la leggibilità */
margin: 40px auto; /* Centra il form nella pagina */
padding: 30px;
background: #ffffff;
border-radius: 12px; /* Angoli arrotondati */
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Ombra leggera */
}
/* ——————————————————————- */
/* HEADERS E TITOLI */
/* ——————————————————————- */
h1 {
color: #007bff; /* Blu acceso per il titolo */
text-align: center;
margin-bottom: 5px;
}
header p {
text-align: center;
color: #666;
margin-bottom: 30px;
border-bottom: 2px solid #e0e0e0;
padding-bottom: 15px;
}
/* ——————————————————————- */
/* STILE PER CIASCUNA DOMANDA */
/* ——————————————————————- */
.question-block {
margin-bottom: 30px;
padding: 15px;
border-left: 5px solid #007bff; /* Barra laterale per evidenziare */
background-color: #f9f9ff; /* Sfondo leggermente azzurro */
border-radius: 8px;
position: relative;
}
/* Numero della domanda in grassetto e in alto */
.question-number {
font-weight: bold;
font-size: 1.1em;
color: #0056b3;
margin-bottom: 8px;
display: inline-block;
}
.question-block > label {
font-weight: 600; /* Testo della domanda */
display: block;
margin-bottom: 15px;
font-size: 1.1em;
}
/* ——————————————————————- */
/* STILE OPZIONI (RADIO BUTTONS) */
/* ——————————————————————- */
.options {
padding-left: 20px;
}
/* Spaziatura tra le opzioni */
.options label {
display: block;
margin-bottom: 10px;
cursor: pointer;
padding: 10px 0;
transition: background-color 0.2s;
border-radius: 4px;
}
/* Effetto hover per le opzioni */
.options label:hover {
background-color: #e9ecef;
}
/* Nasconde i radio button di default e li stila in modo moderno */
.options input[type=”radio”] {
display: none; /* Nasconde l’input standard */
}
/* Stile per l’opzione selezionata (usa la pseudo-classe checked) */
.options input[type=”radio”]:checked + label {
background-color: #d1e7ff; /* Sfondo blu chiaro per l’opzione scelta */
color: #004085;
font-weight: bold;
}
/* ——————————————————————- */
/* STILE PULSANTE DI INVIO */
/* ——————————————————————- */
#submitBtn {
display: block;
width: 100%;
padding: 15px;
background-color: #28a745; /* Verde per l’azione principale */
color: white;
border: none;
border-radius: 8px;
font-size: 1.2em;
cursor: pointer;
transition: background-color 0.3s, transform 0.1s;
margin-top: 30px;
}
#submitBtn:hover {
background-color: #218838; /* Verde più scuro all’hover */
}
#submitBtn:disabled {
background-color: #6c757d; /* Grigio quando disabilitato (durante l’invio) */
cursor: not-allowed;
}
/* Messaggio di caricamento */
#loadingMessage {
text-align: center;
margin-top: 10px;
color: #007bff;
font-weight: bold;
}
Gestisci Consenso Cookie
Funzionale Sempre attivo
L'archiviazione tecnica o l'accesso sono strettamente necessari al fine legittimo di consentire l'uso di un servizio specifico esplicitamente richiesto dall'abbonato o dall'utente, o al solo scopo di effettuare la trasmissione di una comunicazione su una rete di comunicazione elettronica.
Preferenze
L'archiviazione tecnica o l'accesso sono necessari per lo scopo legittimo di memorizzare le preferenze che non sono richieste dall'abbonato o dall'utente.
Statistiche
L'archiviazione tecnica o l'accesso che viene utilizzato esclusivamente per scopi statistici.
L'archiviazione tecnica o l'accesso che viene utilizzato esclusivamente per scopi statistici anonimi. Senza un mandato di comparizione, una conformità volontaria da parte del vostro Fornitore di Servizi Internet, o ulteriori registrazioni da parte di terzi, le informazioni memorizzate o recuperate per questo scopo da sole non possono di solito essere utilizzate per l'identificazione.
Marketing
L'archiviazione tecnica o l'accesso sono necessari per creare profili di utenti per inviare pubblicità, o per tracciare l'utente su un sito web o su diversi siti web per scopi di marketing simili.