body {
	font: 16px/28px;
	font-family: 'currier new', courier, monospace;
	background: #f9f9f9;
	line-height:25px;
}
hr{
	border-bottom: 0.5px solid #008000;
	border-top:none;
	margin:20px 0px 15px 0px;
}
#container {
	width: 960px;
	margin: 0 auto;
	background:#FFFFFF;
}
#header 	{
	width: 920px;
	float:none;
	text-align: center;
	text-color: #FFFFFF;
	padding: 20px;
	border-radius: 15px 15px 15px 15px;
	background:hsla(0, 0%, 1%, 0.965);
	background-image: linear-gradient(#01010b ,#010606);
} 
#menu{
	width: 100%;
	float:right;
	border-radius: 15px 15px 15px 15px;
	background: #F0F0F0;
}
#main {
	width: 920px;
	float:left;
	padding: 20px;
}
#footer{
	width: 920px;
	float:left;
	padding: 10px;
	border-radius: 15px 15px 15px 15px;
	background:#F0F0F0;
	color: #222222;
}
#footer a {
	font: 14px;
	text-decoration:none;
	
}
#titolo a {
	font-weight: bold; 
	font-size:60px;
	float: none;
	text-align: center;
	color:#FFFFFF;
	margin-bottom:20px;
	text-decoration:none;
}
#menu ul {
	margin: 0px 0 0px 0px;
	float:right;
	width:100%; 
	list-style: none;
}
#menu ul li {
	float: right;
	margin: 0px;
	poisition: relative;}
#menu a {
	color: #222222;
	text-decoration:none;	
	display: block;
	font: 14px;
	padding: 14px 20px;}
#menu a:horver {
	background:#F0F0F0;
	color:#000000;
}
#pagina{
		width:100%;
		float:left;
		display: block;
		font: 14px;
		color:#000205;
		font-weight:bold;	
	}
#link {
  	padding: 10px;
	margin-top:20px;
	width:auto;
	height:auto;
}
#box {
	margin-top:10px;
  	padding: 10px;
	border:1px dashed #0000CD;
	width:auto;
	height:auto;
}
#colonna50-sx{
	float:left;
	width:48%;
	margin-right:2%;
	height:auto;
	margin-bottom:10px;
}
#colonna50-dx{
	float:left;
	width:48%;
	margin-left:1%;
	height:auto;
	margin-bottom:10px;
}
.immagine{
	width:100%;
	height:auto;
	margin-bottom:10px
}
.centra {
	text-align:center;
}
.giustifica {
	text-align:justify;
}
.evidenzia {
	color:#000000;
	background:#FFFFA0;
	padding:5px;
	border-radius:4px
}
.linkpagina{
	width:100%;
	font:10px;
	margin-top:-20px;
	background:#777777;
	color:#FFFFFF;
	text-align:center;
}
.clear {
	clear: both;
}
.row::after {
  content: "";
  clear: both;
  display: table;
}

img {
  max-width: 100%;
  height: auto;
}
 

/*Media queries per il responsive design 
 
colonna-sx: posizionata a sinistra contiene i contenuti pi� importanti
colonna-dx: posizionata a destra, in pratica una sidebar
colonna-cn: contenuti in una sola riga
*/
@media (min-width: 1200px) {
/* quando lo schermo, o la finestra del browser, ha una dimensione >= di 1200px */
	#container{
		width: 1170px;
		margin: 0 auto;
	}
	#header,#main,#footer{
		width: 1130px;
		float:left;
		padding: 20px;
	} 
	#menu{
		width: 100%;
		float:right;
		display:block;
	}
	#colonna-cn {
		width: 98%;
		float:left;
	}
	#colonna-sx {
		width: 65%;
		float:left;
	}
	#colonna-dx {
		width: 30%;
		float:right;
	}


}
@media (min-width: 980px) and (max-width: 1199px) {
/* quando lo schermo, o la finestra del browser, ha una dimensione compresa tra 980 e 1199px */
	#container {
		width: 960px;
		margin: 0 auto;
	}
	#header, #main,#footer,#colonna-cn {
		width: 920px;
		float:left;
		padding: 20px;
	} 
	#menu{
		width: 100%;
		float:right;
		display:block;
	}
	#colonna-cn {
		width: 98%;
		float:left;
	}
	#colonna-sx {
		width: 65%;
		float:left;
	}
	#colonna-dx {
		width: 30%;
		float:right;
	}

}

@media (min-width: 768px) and (max-width: 979px) {
/* quando lo schermo, o la finestra del browser, ha una dimensione compresa tra 768 e 979px */
	#container {
		width: 748px;
		margin: 0 auto;
	}
	#header, #main,#footer,#colonna-cn {
		width: 708px;
		float:left;
		padding: 20px;
	} 
	#menu{
		width: 100%;
		float:right;
		display:block;
	}
	#colonna-cn {
		width: 98%;
		float:left;
	}
	#colonna-sx {
		width: 65%;
		float:left;
	}
	#colonna-dx {
		width: 30%;
		float:right;
	}

}

@media (max-width: 767px) {
/* quando lo schermo, o la finestra del browser, diventa minore di  768px */
	
	body{
		padding:10px;
		background:#FFFFFF;
	}
	#container {
		width:100%;
		margin: 0 auto;
	}
	#header, #main,#footer {
		width:100%;
		padding: 10px 0 10px 0px;} 
	#menu{
		width:100%;
		float:right;
	}
	#colonna-cn {
		width: 100%;
		float:left;
		padding: 10px 0px 0px 0px;
		
	}
	#colonna-sx {
		width:100%;
		float:left;	
		padding: 10px 0px 0px 0px;
	}
	#colonna-dx {
		width:100%;
		float:right;
		padding: 10px 0px 0px 0px;
	}
	#titolo a {
		font-size:30px;
		margin-left:10px;
	}
	#foodter{
		width:100%;
		float:left;
		padding: 10px 0px 0px 0px;
	}
	#footer p    {
		margin-left:10px;
	}

	
	* 	
		in questo caso smartphone e piccoli tablet non viene visualizzato
    /* Inserisci qui il tuo codice CSS, es: */
   /* Smartphone con orientamento orizzontale e piccoli tablet (da 481px a 768px) */
@media (max-width: 768px) {
    /* Inserisci qui il tuo codice CSS, es: */
    body {
        font-size: 14px;
    }
}

/* Smartphone con orientamento verticale (fino a 480px) */
@media (max-width: 480px) {
  
    #menu {
		font-size: 10px;
		font-weight: bold;
        width: 100%;
        padding: 0%;
		margin-right: 0%;
    }
}

.table-container {
  width: 100%;
  overflow-x: auto; /* Attiva lo scroll orizzontale se serve */
  -webkit-overflow-scrolling: touch; /* Rende lo scroll fluido su iOS */
}

table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}




thead th:nth-child(1) {
  width: 100%;
  text-align: center;
  ;
}





td {
  text-align: center;
  width: 25%;
   
    padding: 20px;
}
tbody td {
	width: 25%;
  text-align: center;
}
thead th {
  background-color: #0a0d0e;
  color: #fff;
}

tfoot th {
  text-align: center;
}
tbody tr:nth-child(odd) {
  background-color: #d8d3d3;
}

tbody tr:nth-child(even) {
  background-color: #8b1111;
}
tr {
  border-bottom: 2px solid #232020; /* Sostituisci colore e spessore a piacere */
}


caption {
  padding: 20px;
  font-style: italic;
  font-size: extra-large;
  caption-side: bottom;
  color: #666;
  text-align:center;
}
<div class=”responsive-table”><table>...</table></div>
.responsive-table {
   overflow-y: scroll;
}