/*
CTC Separate Stylesheet
Updated: 2025-11-13 09:48:59
*/

/* 1. Stile Predefinito (Orizzontale) - Visto Prima */


/* 1. Stile Predefinito (Orizzontale) */
#page .containero {
  /* Aggiungendo #page si aumenta la specificità */
  display: flex !important; 
  gap: 15px; 
  width: 100%;
}

#page .boxo {
  /* Aumentata specificità per il box */
  flex: 1 !important; 
  padding: 20px;
  background-color: #007bff;
  color: white;
  border-radius: 8px;
  text-align: center;
}


/* 2. Media Query per la Responsività */
@media (max-width: 600px) {
  #page .container {
    flex-direction: row; 
    gap: 10px; 
  }
}


/* 2. Media Query per la Responsività */
/* Quando la larghezza dello schermo è inferiore o uguale a 600px, 
   sovrascrivi lo stile del contenitore. */
@media (max-width: 600px) {
  .container {
    /* La proprietà fondamentale per passare da orizzontale a verticale */
    flex-direction: row; 
    
    /* I box si estenderanno su tutta la larghezza */
    gap: 10px; /* Spazio tra i box verticali */
  }
  
  /* Opzionale: Rimuovi 'flex: 1' per lasciare che la larghezza sia gestita 
     automaticamente, ma non è strettamente necessario con 'flex-direction: column'. */
}