body
{
	background-color: #feffe7;
	font-size: 18px;
	margin: 60px auto 150px auto;
	width: 800px;
	color: #3C3C3C;
	line-height: 144%;
	font-family: Times New Roman, serif;
	padding: 0;
}
a {
	color: #c00;
	}
a:hover {
	color: #015123;
	}
a:visited {
	color: #4caf50;
	}

h2 {
	font-family: Arial, sans-serif;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    letter-spacing: 1px;
    word-spacing: 3px;
}
.modifica_questo_evento
{
	font-family: Helvetica, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
}
.modifica_questo_evento a { text-decoration: none; }

table {    
	font-size: 13px;
}
.table { margin-top: 1.5rem; }.form-select { width: auto; display: inline-block; }
.list-group-item { margin-bottom: 10px; border-radius: 5px; }
.form-control, .form-select { width: 100%; }
.alert { margin-bottom: 20px; }
.table { margin-top: 20px; }
.btn-sm { margin-right: 5px; }
.alert-dismissible { margin-bottom: 20px; }
.form-control.date-input { max-width: 160px; }
.form-container { padding: 1.5rem; background-color: #f8f9fa; border-radius: 5px; }
.short-input { max-width: 160px; }
.form-container { padding: 1.5rem; background-color: #f8f9fa; border-radius: 5px; }

#table_elenco_eventi { 
	line-height: 130%;
	text-align: justify;
}
#table_elenco_eventi th { 
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	font-size: 10px;
}
#table_elenco_eventi .titolo_evento { 
	width: 20%;
	text-align: left;
}
#table_elenco_personaggi { 
	line-height: 130%;
	text-align: justify;
}
#table_elenco_personaggi th { 
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	font-size: 10px;
}
.lista_data
{
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: bold;
	color: #C00;
	letter-spacing: 1px;
}
.lista_anno
{
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: bold;
	color: #C00;
	letter-spacing: 1px;
}
.lista_titolo
{
	font-weight: bold;
	color: #00007D;
}
.lista_descrizione
{
	text-align: justify;
	line-height: 140%;
}
.full_strip {
	height: 48px;
	display: flex;
	margin-top: -8px; /* Compensa lo spazio di 4px */
}
.nd_strip {
	background-color: #FEFFE7;
	width: 18px;
	font-family: Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #00007D;
	margin: 0;
	text-align: center;
}
.capital_letter {
	font-size: 20px;
	margin: 0;
	padding: 0;
	transform: translateY(1px); /* Sposta la N e la D verso il basso di 1 pixel */
}
.otable_strip {
	font-family: Helvetica, sans-serif;
	background-color: #00007D;
	margin: 0;
	font-weight: 200;
	color: #FEFFE7;
	padding-right: 4px;
	padding-left: 4px;
}
.title_strip
{
	font-family: Helvetica, sans-serif;
	background-color: #00007D;
	margin: 0;
	font-weight: 200;
	color: #FEFFE7;
	padding-right: 9px;
	padding-left: 18px;
	font-size: 34px;
}
.nd_strip, .otable_strip, .title_strip, .login_frame {
	height: 42px;
	line-height: 100%;
	padding-top: 3px;
}
/* ============= MENU ================ */
.menu_nav-bar
{
	position: fixed;
	top: 0;
	width: 800px;
	background-color: #00007D;
	z-index: 999;
	overflow: visible;
	/* Importante per i dropdown */
}

.menu_ul
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: visible;
	/* Assicura che i dropdown non vengano tagliati */
	color: #feffe7;
	font-family: Arial, sans-serif;
	text-transform: uppercase;
	font-size: 12px;
}

.menu_li {
  float: left;
}

.menu_li a, .dropbtn {
  display: inline-block;
  color: #feffe7;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.menu_li a:hover, .dropdown:hover .dropbtn { background-color: #9C9C9C; }

.dropdown {
  display: inline-block;
  position: relative; /* Contesto per il dropdown */
}
.dropdown a {color: #feffe7;}

.dropdown-content
{
	font-size: 12px;
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1000;
	/* Sopra il menu */
	top: 100%;
	/* Subito sotto il pulsante */
	left: 0;
	line-height: 85%;
}
.spaziato { line-height: 125%; }
.dropdown-content a
{
	color: #00007D;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
}
.dropdown-content a:hover { background-color: #B9B9B9; }

.dropdown:hover .dropdown-content {
  display: block;
}
/* ============= FINE MENU ================ */
#mostratesto
{
	padding: 20px;
	scroll-margin-top: 100px;
	margin: 20px 0;
	background-color: #FFF;
}

#mostratesto:hover
{
	background-color: #f8f8f8;
	border-color: #aaa;
}

.feedback-copia {
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	margin: 15px 0;
	height: 30px;
}
.opaco { color: #BED5E5;}

.acapovisibili
{
	cursor: pointer;
	padding: 0px 9px 9px 9px;
	margin: 0;
	border: 2px dashed #ccc;
	border-radius: 10px;
	font-size: 18px;
	line-height: 1.6;
	transition: all 0.2s;
	background-color: #FFF;
	font-family: monospace;
	white-space: pre-wrap;
	overflow-wrap: normal;
	/* facoltativo ma utile su mobile */
	hyphens: auto;
}
/* Questo è il trucco principale */
.acapovisibili::before {
    content: "";
    display: block;
    height: 1em;                 /* regola questo valore */
    margin-top: -2em;            /* deve essere uguale o leggermente maggiore di height */
    width: 100%;
}