/* =====================
   GENERALE
   ===================== */



body {
    margin: 0;
    padding: 30px;
    font-family: Garamond; 
    /*line-height: 1.6;*/
    color: #fafafa; 
background: linear-gradient(135deg, #173B67 0%, #8FAFC4 50%, #F1F3F4 100%);
        
background-repeat: no-repeat;
    background-attachment: fixed; 

} 






/* =====================
   HEADER
   ===================== */

header {
    background: #0b0f14; 
    font-size: 30px; 
    border-radius:8px; 
     
}
    

h1 {
    text-align:center; 
    color: #40C4FF; 
} 

h1::before {
    content:"";
    display:inline-block;
    width:30px;
    height:30px;
    border-radius:50%;
    background:red;
    margin-right:20px;
 
}

#menu-toggle {
  background: transparent;
  border: 0;
  font-size: 30px;
  color: #fff;
  cursor: pointer;
}

#menu {
  display: none;
  
  
  
  
}

#menu.open {
  display: block;
}

#menu a {
  
  margin:2px 0 1px 0;
  padding: 10px;
  font-family: Arial; 
  font-size: 20px;
  color: #173B67; 
  background:#F5F0E6; 
  text-align: center;
  border-radius: 6px;
  text-decoration: none;
  font-weight: none; 
  letter-spacing: 0.04em; 
text-shadow: 0 1px 0 rgba(90, 70, 50, 0.18);
  
}
#menu a:hover {
    background: #546E7A;
}


#menu span {
  font-size: 10px;
  background: yellow;
  color: #000;
  padding: 2px 4px;
  border-radius: 3px;
}

.new-label {
    font-size: 10px;
    background: yellow;
    color: #000;
    padding: 2px 4px;
    border-radius: 3px;
    margin-left: 5px;
}

    
 
.brand {
    
    display: flex;
    align-items: center;
    justify-content: space-between;
    
    border-bottom: 1px solid;
}

 


.live-status {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-weight: bold;
}

.live-dot {
    width: 10px;
    height: 10px;
    background: #22c55e;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 8px #22c55e;
}
    







/* =====================
   CONTENUTO
   ===================== */

main { font-size:18px; } 



ul { list-style:none; margin-left:0; padding:0; }

li::before { content: "✔"; color: red; }   

a { margin:2px 0 1px 0; font-size:20px; display: block; color:#fff; background:red; padding:20px; text-align:center; border-radius:12px; text-decoration:none; font-weight: 400; 
letter-spacing: 0.04em; 
text-shadow: 0 1px 0 rgba(255,0,0,0.2); 
    
}

a:hover {
    background: #546E7A;
}


p { color:#111;} 

.c_b a { display: inline-block; } 


.top { text-align:right; } 

.top a { display:inline-block; } 







/* =====================
   FOOTER
   ===================== */

footer {
font-size:18px; margin-top: 40px; background: #0B0F14; padding:12px; border-radius:8px; 
}

footer a { font-size:18px; color:#fff; margin:0; padding:0; text-align:left; border-radius:0; text-decoration:none;} 

@media (max-width: 700px) {
header { font-size: 20px; }

}