body 
{
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
font-size: 14px;
/* background-color: whitesmoke; */
color: teal;
text-align: left;
background-color: HoneyDew;
}

.nav
{
list-style:none;
margin:0;
padding: 0;
background-color: teal;
/* color: teal; */
height:60;
text-align: left;
}
.nav > li,
.nav > li > a
{
display:inline-block;
display:inline; /* Per IE7 */
zoom:1; /* Per IE 7 */
color:white;
}

.stacked > li
{
display:list-item;
}
.stacked > li > a
{
display:block;
}

.flyout,
.flyout-alt
{
position:relative;
height:40;
}
.flyout-content
{
position:absolute;
top:100%;

/* Posizioniamo i sottomenu fuori dallo
schermo; alternativa a display:none
*/
left:-99999px;
height:0;
overflow:hidden;
}

.flyout:hover > .flyout-content
{
left:0;
}
.flyout-alt:hover > .flyout-content
{
top:0;
left:100%;
}

.flyout:hover > .flyout-content,
.flyout-alt:hover > .flyout-content
{
height:auto;
overflow:visible;
opacity: 1;
}
/* Fine struttura menu */

/* Aspetto menu */
.site-nav td 
{
background-color:inherit;
color:black;
font-weight: normal;
text-align: left;
}

.site-nav a
{
line-height:2;
height:20;
padding:10;
/* background-color:teal; /* Colore di sfondo iniziale */
color:black; /* Colore del testo dei link  */
font-weight: bold;
width: 300px;
text-decoration: none;
text-align: left;
}


.site-nav .flyout:hover > a,
.site-nav .flyout-alt:hover > a,
.site-nav a:hover
{
background-color: cadetblue; /* #8ab8b8; Colore di sfondo sull'hover */
/* background-color: transparent; /* #8ab8b8; Colore di sfondo sull'hover */
text-align: left;
}
.site-nav .flyout-alt > a:after
{
content:" »";
} /* Inseriamo l'indicatore di presenza del sottomenu */

.site-nav
{
/* Colore e stile dei bordi;
azzeriamo lo spessore con 0px
*/
border: 0px solid #000;
text-align: left;
}
.site-nav a
{
/* Colore e stile dei bordi;
azzeriamo lo spessore con 0px
*/
border: 0px solid #000;
text-align: left;
}
.flyout-content
{
/* Colore e stile dei bordi;
azzeriamo lo spessore con 0px
*/
border: 0px solid #000;
}
.site-nav > li > a
{
/* Bordo sinistro sulle voci del menu principale */
border-left-width:1px;
}

.site-nav > li:first-child > a
{
/* Eliminiamo il bordo dalla prima voce del menu */
border:none;
}
.site-nav .flyout-content
{
/* Bordo superiore per il sottomenu */
border-width:0px 0 0 0;
}

.site-nav .flyout-content a
{
/* Bordo inferiore per le singole voci del sottomenu */
border-bottom-width:1px;
}
.site-nav .flyout-alt:hover > .flyout-content
{
/* Un piccolo aggiustamento per la posizione del
sottomenu sull'hover
*/
top:-1px;
}

/* Fine aspetto menu */

/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */
/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

.tabella
{
display: table;
}
.riga
{
display: table-row;
}
.cella
{
width: 600px;
height: 60px;
line-height: 60px;
border: 1px solid;
text-align:center;
display: table-cell;
}

div#container {
border: 1px solid #000000; 
height: 30px;
width:1340px;
display: table;
margin: 3 auto;
color: white;
font-family: 'Source Sans Pro', sans-serif;
font-size: 18px;
font-weight: bold;
width: 100%;
}

div#content {
border: none;
background: #008080;
display:table-cell;
vertical-align:middle;
margin: 0 auto;
text:bold;
}  

div#container2 {
border: 1px solid #000000; 
height: 30px;
width:1340px;
display: table;
margin: 0 auto;
color: black;
font-family: 'Courier New',monospace;
font-size: 14px;
font-weight: bold;
text-align: center;
}

div#content2 {
border: none;
background: #F8F8FF;
display:table-cell;
vertical-align:middle;
margin: 0 auto;
text:bold;
}  

testo {
  column-count: 3;
  text-align:center;
}
div.contenitore
{
    width: 100%;
}
div.split2 
{
    text-align:center;
    width: 100%;
}

.lineaOrizz {
  border-top: 2px solid;
  color: blue;
}  
.column1of2 {
  float: left;
  width: 85px;
  margin: 3px;
  color: black;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 12px;
  font-weight: bold;
}   
.column2of2 {
  float: left;
  width: 1200px;
  margin: 3px;
  color: black;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 12px;
  font-weight: bold;

}

.box-top-left {
    position: relative;
    margin: 1.5em 0em;
    padding: 35px 10px 8px;
    border: inset 2px blue;
    height:10px;
}

.box-top-text {
  border: 2px inset blue;
  border-top: 1px solid blue;
}

.vl {
  border-left: 1px solid blue;
  border-right: 1px solid blue;
  height: 0.4px;
}
.box-title {
    position: static;
    display: inline-block;
    top: 0px;
    font:Source Sans Pro Semibold;
    left: 0px;
    padding: 2px 10px;
    height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #F5F5F5;
    color: blue;
    font-weight: bold;
}
.box-top-left p {
    margin: 0; 
    padding: 0;
    font: Source Sans Pro Semibold
}  

.table-ext {width:90%;}

.table-ext thead th {
height:50px;
line-height:50px;
border-bottom:1px solid #ddd;
text-align: left;
border:1px solid #ddd;
padding: 0 0 0 5px;
background: #008080;
color:#fff;
}

.table-ext tbody td {
border-bottom:1px solid #ddd;
border-left:1px solid #ddd;
padding: 5 5 5 5px;
text-align: left;
color:red;
}

.divinterno{
height:270px; 
overflow:auto;
width:100%;
}

.table-int {
width:100%; 
}

.table-int td {
height:20px;
line-height:40px;
color:red;
}


/* ============================================================== */
/* Class responsive                                               */
/* ============================================================== */

/* Small devices (portrait tablets and large phones, 600px and up) */
@media screen and (min-width:600px)
{
.responsive 
{
border-collapse:collapse;
border-spacing:0;
margin:0 auto 40px;
width:60%;
}

.responsive thead th 
{
height:50px;
line-height:50px;
border:1px solid #ddd;
background: #ffffcc;
/* color:#333300; */
text-align: center;
color:black;
width:10px;
}

.responsive tbody td 
{
height:25px;
line-height:40px;
border:1px solid #ddd;
width:10px;
color:black;
font-weight:bold;
}

.responsive tbody th 
{
height:40px;
line-height:40px;
border:1px solid #ddd;
width:10px;
text-align: center;
}
}

/* Extra small devices (phones, 600px and down) */
@media screen and (max-width:600px) 
{
    
.responsive thead th 
{
height:50px;
line-height:50px;
border:1px solid #ddd;
background: #ffffcc;
text-align: center;
color:red;
width:10px;
}

.responsive td:before 
{
position: absolute;
top: 0;
left: 5px;
padding-right: 0;
white-space: nowrap;
width:10px;
} 

.responsive tbody td 
{
border: none;
border-bottom: 1px solid #ddd;
position: relative;
height:30px;
line-height:30px;
padding-left: 70%;
width:10px;
}

.responsive td:nth-of-type(1):before 
{ content: "Stagione"; }
.responsive td:nth-of-type(2):before 
{ content: "Campione"; }
.responsive td:nth-of-type(3):before 
{ content: "Seconda"; }
.responsive td:nth-of-type(4):before 
{ content: "Terza"; }

.responsive tr:nth-of-type(odd) 
{ 
background:whitesmoke; 
}
}