img.cover {
	max-width: 300px;
}


/* 
Nell'inserire o modificare i css ricordarsi che sarebbe buona cosa:

-- creare regole css per i tag html, senza creare appositi div o span, in modo che le modifiche siano 
    estese a tutto il  sito, che cosi' manterra' una elevata coerenza interna.

-- nel caso si necessiti di div o span inserire tali tag in tutte le pagine in corrispondenza delle sezioni
   equivalenti rispetto al significato codato in html

-- se si decide di fare una modifica su una sola pagina, inserire un commento nella pagina e uno nel 
   css in corrispondenza degli attributi che si inseriscono
 
-- VERIFICARE CHE LE INFORMAZIONI INSERITE SIANO ANCORA DISPONIBILI ANCHE PER 
   BROWSER CHE NON SUPPORTANO I CSS 
   
-- limitarsi alle funzioni css1 che sono ampiamente piu' supportate rispetto al css2

-- documentare, in  lista o con un commento in questo file le modifiche fatte con data e autore in modo 
   che sia piu' facile debuggare il codice in caso di problemi
*/

BODY      { background-color: #000000; color: #00ff00; font-size: 100%; font-family: "Courier New", Courier, monospace; }
A:link, A:visited, A:active    { background-color: #000000; color: #b1f3bb; text-decoration: underline; }
A:hover   { background-color: #b1f3bb; color: #000000; text-decoration: none; }
HR        { color: #00ff00 } 
span.old      { background-color: #000000; color: #007700; }


header { display: flex;
	align-items: center;
}
header > div.header-logo { padding-right: 1rem; }
header img.logo {
	width: 10vw;
}
header > div.header-title {
}
nav { font-weight: bold; width: 80vw; }
nav ul, #contenuti-sito { list-style: none; }
nav ul {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
nav ul li { float: left; margin-right: 1.5rem; }
#contenuti-sito li { margin-bottom: 1rem; }

#prossimi-appuntamenti article {
	overflow: auto;
}
#prossimi-appuntamenti figure {
	float: right;
}
#prossimi-appuntamenti figure img {
	width: 30vw;
}
#prossimi-appuntamenti {
    margin-left: 0.5em;
    margin-top: 1em;
    padding-left: 1em;
}
#prossimi-appuntamenti.non-empty {
    border: 0.2em solid #00ff00;
}
#prossimi-appuntamenti.empty{
    border: none;
}

article { hyphens: auto; }
article, h1 { clear: both; }
article figure { float: right; }
article figure figcaption { font-style: italic; }
article h2 small { padding-left: 4em; font-size: 80%; display: block; }
figure { margin: 0.3em; }

#banner-trasmettiror img {
    max-width: 100%;
    border: 0;
}

ul.per-punti {
    list-style: none;
    padding-left: 0.2em;
}

ul.per-punti > li{
    margin-bottom: 0.2em;
}




/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

  #sidebar-right, #sidebar-separator {     display: none;  }
  article { max-width: 100vw; }
  img.cover { width: 100%; max-width: none; }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
  article { max-width: 100vw; }
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

    #sidebar-right, #sidebar-separator {     display: none;  }

}

/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px) {
}

/* Large screens ----------- */
@media only screen and (min-width : 1824px) {
}

/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {

  #sidebar-right, #sidebar-separator {     display: none;  }
  article { max-width: 100vw; }

}