#section-heder{
    justify-content: center!important;
}

header{
    margin-top: 80px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
        
}

article>* {
    z-index:5;
}

.testatina-header1, .testatina-header2{
    height: 50px;
}
#testatina-cnt{
    height: 39px;
    padding: 0 10px;
    transition-delay: .2s;
}

#testatina-cnt:hover{
    background-color: rgba(0, 0, 0, .1);
    transition-delay: .2s;
}

section{
    justify-content: center;
}

section #app{
    width: auto;
}

.occhiello{
    font-size: 16px;
    line-height: 33px;
}

#descrizione{
    font-size: 16px;
    line-height: 22px;
}

h1{
    font-family: "SoleSans", Arial, Helvetica, sans-serif;
    font-size: 50px;
    line-height: 76px;
}

h1 select{
    border: none;
    background-color: transparent;
    padding: 0 9px 2px;
    font-weight: 700;
}

.colorato-base{
    color: #ed3fbf;
}
.colorato{
    color: var(--colore-principale);
}

/* MENU SLIDE */

#hamburger-menu-cnt {
	position: absolute;
    cursor: pointer;
    left: 35px;
    -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; transition: .3s ease-in-out;
}
.hamburger-menu {
    display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	cursor: pointer;
	width: 30px;
	height: 30px;
}
.menu-header .hamburger-menu {
	position:static;
}
#hamburger-menu-cnt:hover{
	background-color: rgba(0,0,0,0.10);
}

.sottolineato{
    text-decoration: underline;
    cursor: pointer;
}

#menu-slide-cnt{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
}

.menu-slide{
    position: fixed;
    left: -100%;
    height: 100vh;
    width: 25vw;
    box-shadow: 3px 0 3px 0 rgba(0, 0, 0, 0.16);
}

#menu-slide-1 {
    background-color: white;
    transition-delay: .2s;
}

#menu-slide-2 {
    background-color: var(--colore-principale);
    transition-delay: 0s;
    width: auto;
    color: white;
}

.noscroll #menu-slide-1{
    left: 0;
    transition-delay: 0s;
}
.noscroll #menu-slide-2:not(.generale){
    left: 25vw;
    transition-delay: .2s;
}
.noscroll #menu-slide-2.sezione{
    left: 25vw!important;
}


#menu-sfondo{
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0,0,0,.3);
    display: none;
    opacity: 0;
}
.noscroll #menu-sfondo{
    display: block;
    opacity: 1;
}

.noscroll { 
    overflow: hidden;
}

.menu-header{
    margin: 10px 20px;
}

#menu-slide-1 ul, #ul-indicatori{
    list-style-type: none;
    margin: 10vh 0 0 0;
    padding: 0;
}
#ul-indicatori ul{
    list-style-type: none;
    padding: 0;
}

#menu-slide-1 li{
    line-height: 40px;
    padding: 0 20px;
    margin: 20px 0;
    cursor: default;
    -webkit-transition: .3s ease-in-out; -moz-transition: .3s ease-in-out; -o-transition: .3s ease-in-out; transition: .3s ease-in-out;
}
#menu-slide-1 li:not(.selezionato):hover{
    cursor: pointer;
    color: white;
}
#menu-slide-1 .homepage {
    line-height: 40px;
    padding: 0 20px;
    margin: 20px 0;
    cursor: pointer;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

#menu-slide-1 .homepage:hover{
    background-color: rgba(0, 0, 0, .1);
}
#menu-slide-1 .homepage a:hover{
    color: black;
}

#menu-slide-1 li:nth-child(1):hover, #menu-slide-1 li:nth-child(1).selezionato{
    background-color: #000000;
}
#menu-slide-1 li:nth-child(2):hover, #menu-slide-1 li:nth-child(2).selezionatoTmp, #menu-slide-1 li:nth-child(2).selezionato{
    background-color: #262b91;
}
#menu-slide-1 li:nth-child(3):hover, #menu-slide-1 li:nth-child(3).selezionatoTmp, #menu-slide-1 li:nth-child(3).selezionato{
    background-color: #056bf1;
}
#menu-slide-1 li:nth-child(4):hover, #menu-slide-1 li:nth-child(4).selezionatoTmp, #menu-slide-1 li:nth-child(4).selezionato{
    background-color: #ff6d00;
}
#menu-slide-1 li:nth-child(5):hover, #menu-slide-1 li:nth-child(5).selezionatoTmp, #menu-slide-1 li:nth-child(5).selezionato{
    background-color: #ef2272;
}
#menu-slide-1 li:nth-child(6):hover, #menu-slide-1 li:nth-child(6).selezionatoTmp, #menu-slide-1 li:nth-child(6).selezionato{
    background-color: #02b95c;
}
#menu-slide-1 li:nth-child(7):hover, #menu-slide-1 li:nth-child(7).selezionatoTmp, #menu-slide-1 li:nth-child(7).selezionato{
    background-color: #a4068d;
}

#menu-slide-1 li.selezionato, #menu-slide-1 li.selezionatoTmp{
    cursor: pointer;
    color: white;
}

#menu-slide-2 li{
    line-height: 40px;
    padding: 0 20px;
    margin: 0 0;
    cursor: default;
}

#menu-slide-2 li:hover, #menu-slide-2.selezionata{
    background-color: rgba(255,255,255,.2);
    cursor: pointer;
}
#menu-slide-2.selezionata{
    cursor: default;
}

#menu-slide-1 li a, #menu-slide-1 li a:visited, #menu-slide-1 li a:active{
    text-decoration: none;
    color: black;
}
#menu-slide-1 li a:hover{
    text-decoration: none;
    color: white;
}
.primo-li:hover a{
    color:white!important;
}

.primo-li.selezionato a{
    color:white!important;
}

#menu-slide-2 li a, #menu-slide-2 li a:hover, #menu-slide-2 li a:visited, #menu-slide-2 li a:active{
    text-decoration: none;
    color: white;
}

#menu-slide-1 li:after {
    position: absolute;
    content: " ";
    background-image: url(img/menu-freccine.svg);
    background-repeat: no-repeat;
    background-position: center center;
    /* background-color: cadetblue; */
    width: 14px;
    height: 40px;
    right: 20px;
}

#menu-slide-1 li:first-of-type:after {
    display: none;
}

#ul-indicatori{
    overflow-y: scroll;

}

li.selezionato{
    cursor: default;
    background-color: rgba(255,255,255,.2);
}

/* TITOLAZIONE */


.titolo-4:first-of-type{
    margin-top: 0;
}

.filo-sotto{
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    margin-bottom: 15px;
    padding-bottom: 15px;
}


#ricerca-cnt .titolo-5 {
    margin-bottom: 6px;
}

#ul-indicatori {
max-height: calc(100vh - 159px);
overflow-y: auto;
scrollbar-color: rgba(0,0,0,0.27) rgba(0,0,0,0.27);
scrollbar-width: thin;
}

#ul-indicatori::-webkit-scrollbar {
width: 20px;
}

#ul-indicatori::-webkit-scrollbar-track {
    background-color:transparent;
    border-radius: 100px;
}

#ul-indicatori::-webkit-scrollbar-thumb {
    border-radius: 100px;
    border: 5px solid transparent;
    background-clip: content-box;
    background-color: rgba(0,0,0,0.27);
}

#ul-indicatori.haScrollBar {
    border-top: 1px solid rgba(255,255,255,.2);
    border-bottom: 1px solid rgba(255,255,255,.2);
}
* {
box-sizing: border-box;
}

#testatina-header{
    text-align: center;
}

#testatina-cnt {
    overflow-y: hidden;
    text-align: center;
}
#testatina-cnt div {
    height: 100%;
    display: flex;
    justify-items: center;
    align-items: center;
    transition: all 0.5s ease;
}

#testatina-cnt div:nth-child(2) {
    font-weight: 600;
}

.mostraTitolo #testatina-cnt div {
    transform: translateY(-100%);
}



#tabella-cnt{
    opacity: 0;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
#tabella-cnt.svela{
    opacity: 1;
}

#tabella-testata{
    margin: 0 105px 0;
    padding: 29.5px 30px 0px;	
}
#tabella-corpo{
    margin: 0 105px 0;
    padding: 29.5px 30px 42.5px;
    border-radius: 20px;
    box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.2);
    background-color: #fff;
    position:relative;
}

table{
    width: 100%;
}	
    
thead button{
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
    margin-right: 18px;
    font-size:11px;
    text-transform: uppercase;
}

thead td {
    vertical-align: top;
    height: 33px;
}

tbody td{
    vertical-align: middle;
}

tbody tr:nth-child(odd) {background: transparent}
tbody tr:nth-child(even) {background: #f5f5f5}

.barra-classifica{
    height: 20px;
    margin: 0 7.5px;
}

.barra-sfondo-classifica{
    background-color:  var(--colore-principale);
    width: 100%;
    height: 100%;
    border-radius: 10px;
    position: absolute;
    border: 2px solid white;
}

.barra-scorri-classifica{
    border-radius: 10px;
    width: 50%;
    position: relative;
    height: 17px;
}

.barra-scorri-classifica:after{
    content: "";
    width: 13px;
    height: 13px;
    border-radius: 13px;
    background-color:  var(--colore-principale);
    border: 2px solid white;
    position: absolute;
    right: -7.5px;
}

tbody tr:nth-child(even) .barra-sfondo,
tbody tr:nth-child(even) .barra-scorri:after{
    border-color: #f5f5f5;
}

.ricerca-cnt{
    width: 480px;
    border-radius: 20px;
    box-shadow: 0 6px 6px 0 rgb(0 0 0 / 20%);
    background-color: #fff;
    padding: 29.5px 30px 42.5px;  
}

.righino {
    width: 1px;
    border-left: 1px solid #000;
    height: 5px;
    margin-top: 14px;
}
.righino50 {
    width: 45%;
}
.righino100 {
    width: 55%;
}

.righino1:before {
    content: '1';
    font-size: 11px;
    /* margin-top: 15px; */
    position: absolute;
    /* top: 13px; */
    margin-top: -15px;
    margin-left: -4px;
}
.righino50:before {
    content: '50';
    font-size: 11px;
    /* margin-top: 15px; */
    position: absolute;
    /* top: 13px; */
    margin-top: -15px;
    margin-left: -7px;
}
.righino100:before {
    content: '107';
    font-size: 11px;
    /* margin-top: 15px; */
    position: absolute;
    /* top: 13px; */
    margin-top: -15px;
    margin-left: -10px;
    width: 60px;
}
/* TOGGLE ************************************ */

/* The switch - the box around the slider */
.class-toggle {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
  }
  
  /* Hide default HTML checkbox */
.class-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .class-slider {
    position: absolute;
    cursor: pointer;
    top: 10px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    height: 11.5;
    width: 50px;
  }
  
  .class-slider:before {
    position: absolute;
    content: "";
    left: -6px;
    bottom: -14px;
    -webkit-transition: .4s;
    transition: .4s;
    width: 22px;
    height: 22px;
    margin: 7px 0 8px 5px;
    border-radius: 5px;
    border: solid 2px #ccc;
    background-color: #fff;
}
  
  input:checked + .class-slider {
    background-color: var(--colore-principale);
  }
  
  input:focus + .class-slider {
    box-shadow: 0 0 1px var(--colore-principale);
  }
  
  input:checked + .class-slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    border-color: var(--colore-principale);
    transform: translateX(26px);
  }
  
  .slider-valore{
    padding: 4px 4px;
    width: 110;
    text-align: right;
    background-color: rgba(0,0,0,.07);
  }

  /* Rounded sliders */
  .class-slider.round {
    border-radius: 34px;
  }
  
  .class-slider.round:before {
    border-radius: 50%;
  }

  .ss-main .ss-single-selected .placeholder .ss-disabled,
  .ss-main .ss-multi-selected .ss-values .ss-disabled {
        color: #000!important;
    }

    .ss-main .ss-single-selected {
        height: 40px!important;
    }
    .ss-main .ss-multi-selected{
        min-height: 40px!important;
    }

    .ss-main .ss-multi-selected .ss-add {
        margin: 0px 12px 0 5px!important;
        align-items: center;
    }

    .ss-main .ss-multi-selected .ss-values .ss-value {
        color: #fff;
        background-color: var(--colore-principale)!important;
    }
/* FINE TOGGLE ******************************* */

/* SLIDER ************************************ */

.scorri {
    z-index:1;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color:var(--colore-principale)!important;
}

.noUi-connect {
    background: #ccc!important;
    box-shadow: none!important;
    -webkit-transition: background 450ms;
    transition: background 450ms;
}

.noUi-background {
    background: #ccc!important;
    box-shadow: none!important;
}

.noUi-target {
    border: radius 0, im !important;;
    border: none!important;
    box-shadow: none!important;
}
	
.noUi-horizontal {
    height: 11.5px!important;
}

.noUi-horizontal .noUi-handle {
    width: 34px;
    height: 28px;
    left: -17px;
    top: -6px;
}

.noUi-horizontal .noUi-handle {
    width: 25px!important;
    height: 25px!important;
    left: -15px!important;
    top: -8px!important;
}

.noUi-handle {
	background-color: #ffffff!important;
	box-shadow: none; 
	border: 2px solid var(--colore-principale)!important;
    box-shadow:none!important;
    border-radius: 5px!important;
    cursor: pointer!important;
}

.noUi-handle:after, .noUi-handle:before {
   content: none!important;
   background-color: transparent;
}
.noUi-connect {
	background: none
}

.noUi-base{
    cursor: pointer;
}
/* FINE SLIDER ******************************* */

.disabilita .scorri{
    background-color: #929292!important;
}

.disabilita .noUi-handle {
    border: 2px solid #929292!important;
}

.disabilita input:checked + .class-slider {
    background-color: #929292;
}

.disabilita .class-slider:before {
    border: 2px solid #929292!important;
}

.disabilita .ss-main .ss-multi-selected .ss-values .ss-value {
    color: #fff;
    background-color: #929292!important;
}

.disabilita .ss-main .ss-single-selected {
    background-color: rgba(0, 0, 0, .07)!important;
}

.disabilita .ss-main .ss-multi-selected {
    background-color: rgba(0, 0, 0, .07)!important;
}

.disabilita .titolo-4 {
    color: #929292!important;
}

.disabilita{
    opacity:.4;
}

/* 10 */
.bottone-pieno-tabella span, .bottone-outline-tabella span{
    position:inherit;
    z-index: 1;
}

.bottone-pieno-tabella {
    transition: all 0.1s ease;
    border-radius: 5px;
    border: 2px solid var(--colore-bottone);
    min-width: 90px;
    color: white;
    cursor: pointer;
    text-align: center;
    padding: 7px 6px;
    position: relative;
    overflow: hidden;
}
.bottone-pieno-tabella:before {
    position: absolute;
    content: " ";
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: var(--colore-bottone);
}
.bottone-pieno-tabella:after {
    position: absolute;
    content: " ";
    top: -125%;
    left: -125%;
    z-index: 0;
    width: 300%;
    height: 300%;
    border-radius: 50%;
    transition: all 0.3s ease;
    -webkit-transform: scale(.1);
    transform: scale(.1);
}
.bottone-pieno-tabella:hover {
    color: #fff;
}
.bottone-pieno-tabella:hover:after {
    background: rgba(255, 255, 255, .4);
    -webkit-transform: scale(1);
    transform: scale(1);
}

.bottone-outline-tabella {
    transition: all 0.1s ease;
    border-radius: 5px;
    border: 2px solid var(--colore-bottone);
    min-width: 90px;
    color: var(--colore-bottone);
    cursor: pointer;
    text-align: center;
    padding: 7px 6px;
    position: relative;
    overflow: hidden;
}
.bottone-outline-tabella:before {
    position: absolute;
    content: " ";
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: white;
}
.bottone-outline-tabella:after {
    position: absolute;
    content: " ";
    top: -125%;
    left: -125%;
    z-index: 0;
    width: 300%;
    height: 300%;
    border-radius: 50%;
    transition: all 0.3s ease;
    -webkit-transform: scale(.1);
    transform: scale(.1);
    opacity: .1;
}
.bottone-outline-tabella:hover {
    color: #000;
}
.bottone-outline-tabella:hover:after {
    background: #000;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.bottone-generico{
    padding: 6px;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, .9);
    transition: all 0.2s ease;
}
.bottone-generico img{
    width: 20px;
    height: 20px;
    cursor: pointer;
}
.bottone-generico:hover{
    background: rgba(255, 255, 255, .4);
}

.bottone-icona{
    transition: all 0.2s ease;
    padding: 6px;
    cursor: pointer;
}
.bottone-icona:hover{
    background-color: rgba(0,0,0,0.10);
}

.form-input {
        border-radius: 5px;
        border: none;
        font-size: 14px;
        padding: 0 6px;
        margin-right: 18px;
}

input:focus, textarea {
    outline: none !important;
}

.riga-selezionata td{
    background-color: var(--colore-principale);
    color: white;
}

.riga-selezionata .barra-sfondo{
    background-color: white;
    border-color: var(--colore-principale)!important;
}

.riga-selezionata .barra-scorri::after{
    background-color: white;
    border-color: var(--colore-principale)!important;
}

.lightbox{
    position: fixed;
    top:0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: -1;
}

.lightbox #ricerca-cnt{
    transform: scale(.01);
    transition: all 0.4s ease;
}

body.ricerca-aperta{
    overflow: hidden;
}

.ricerca-aperta .lightbox{
    z-index:999999;
    background-color: rgba(0, 0, 0, .2);
}

.ricerca-aperta .lightbox #ricerca-cnt{
    transform: scale(1);
}


.slimSelect-divContieni{
    display: flex;
    flex-wrap: nowrap;
}
.slimSelect-bottone {
    text-transform: uppercase;
    white-space: nowrap;
    font-size: 12px;
    padding:6px;
    margin-left: 4px;
    cursor: pointer;
}
.slimSelect-bottone:hover{
    background-color: rgba(0,0,0,0.10);
}

.ss-content .ss-search {
    align-items: center;
}

.variazione-su{
    color:#0cce6b;
}
.variazione-giu{
    color:#ce0c0c;
}
.variazione-uguale{
    color:#797979;
}

#tabellaClassifica td:nth-child(1),
#tabellaClassifica td:nth-child(3),
#tabellaClassifica td:nth-child(5){
    text-align: right;
}

#tabellaClassifica tbody td:nth-child(1),
#tabellaClassifica tbody td:nth-child(3),
#tabellaClassifica tbody td:nth-child(5){
    padding-right: 17px;
}

#tabellaClassifica tbody td:nth-child(3) span{
    display: inline-block;
    width: 15px;
    text-align: center;
}

.medaglie {
    position: relative;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    font-size: 12px;
    font-weight: 500;
    color: white;
    border-radius: 50%;
}

.medaglie + .medaglie{
    margin-left: 10px;
}

.medaglie-oro{
    background-color: #e9ad00;
    border: solid 2px #e9ad00;
}
.medaglie-argento{
    background-color: #a6a8ab;
    border: solid 2px #a6a8ab;
}
.medaglie-bronzo{
    background-color: #a8827c;
    border: solid 2px #a8827c;
}

.riga-selezionata .medaglie{
    background-color: var(--colore-principale);
    border: 2px solid white;
}

#titolo .ss-main,
#titolo .ss-main  {
    position: relative;
    display: inline-block;
    user-select: none;
    color: #000;
    width: auto;
}

#titolo .ss-main .ss-single-selected,
#nav_header .ss-main .ss-single-selected {
    height: auto!important;
}

#titolo .ss-main .ss-single-selected,
#nav_header .ss-main .ss-single-selected {
    padding: 6px;
    border: none!important;
    border-radius: 0;
    background-color:transparent!important;
    transition: background-color .2s;
    margin: 7px;
}

#titolo .placeholde,
#nav_header .placeholder{
    color: #000!important;
}

#nav_header .placeholder{
    font-size: 18px;
    text-align: center;
    display: block;
    font-weight: 600;
}

#titolo .ss-content.ss-open,
#nav_header .ss-content.ss-open {
    display: block;
    opacity: 1;
    transform: scaleY(1);
    width: 143px;
    margin-left: 12px;
    margin-top: -13px;
}

#nav_header .ss-content.ss-open {
    width: 67px;
    margin-left: 12px;
    margin-top: -13px;
}


#titolo .ss-content .ss-list .ss-option,
#nav_header .ss-content .ss-list .ss-option {
    padding: 6px 10px;
    cursor: pointer;
    user-select: none;
    font-size: 16px;
    line-height: 30px;
    text-align: center;
}

#nav_header .ss-content .ss-list .ss-option {
    line-height: 26px;
}

#nav_header .ss-main .ss-single-selected .ss-arrow {
    margin: 0 6px 0 0;
}

#tabella-prec, #tabella-succ{
    background-color: rgba(0, 0, 0, .25);
    height: 60px;
    width: 40px;
    display: flex;
    color: white;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

#tabella-prec:not(.disabilitato):hover, #tabella-succ:not(.disabilitato):hover{
    background-color: rgba(0, 0, 0, .50);
}
#tabella-prec{
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    position: absolute;
    top: 110px;
    margin-left: -70px;
}

#tabella-succ{
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    position: absolute;
    top: 110px;
    right: -40px;
}

#tabella-prec.disabilitato, #tabella-succ.disabilitato,
.tabella-prec.disabilitato, .tabella-succ.disabilitato{
    cursor: default;
    opacity: .4;

}
.tabella-prec, .tabella-succ{
    height: 30px;
    width: 30px;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.tabella-prec:not(.disabilitato):hover, .tabella-succ:not(.disabilitato):hover{
    background-color: rgba(0, 0, 0, .20);
}




.ordina-neutro:after{
    content: '';
    background-image: url("../img/ordina-neutro.svg");
    height: 10px;
    width: 10px;
    position: absolute;
    margin-top: 1px;
    margin-left: 4px;
}
.ordina-su:after{
    content: '';
    background-image: url("../img/ordina-su.svg");
    height: 10px;
    width: 10px;
    position: absolute;
    margin-top: 1px;
    margin-left: 4px;
}

.ordina-su, .ordina-giu{
    font-weight: 600;
}

.ordina-giu:after{
    content: '';
    background-image: url("../img/ordina-giu.svg");
    height: 10px;
    width: 10px;
    position: absolute;
    margin-top: 1px;
    margin-left: 4px;
}

.tabellaTbody-enter-active, .tabellaTbody-leave-active {
  transition: all 1s;
}

table{
    overflow: hidden;
}

#mediaItalia{
    position: relative;
    position:relative;
    display: flex;
}

#mediaItalia:before {
    content: "";
    position: absolute;
    width: 1px;
    height: 8000;
    border-right: 1px solid black;
    right: 0;
    top:27px;
}

#mediaItalia span {
    font-size: 11px;
    position: absolute;
    top: 0px;
    line-height: 12px;
    right: 0;
    width: -webkit-fill-available;
    min-width: 66px;
}

#mediaItalia .centro{
    transform: translateX(50%);
    text-align: center;
}
#mediaItalia .sinistra{
    transform: translateX(0);
    text-align: right;
}
#mediaItalia .destra{
    transform: translateX(100%);
    text-align: left;
}

/* START TOOLTIP STYLES */
[tooltip] {
    position: relative; /* opinion 1 */
  }
  
  /* Applies to all tooltips */
  [tooltip]::before,
  [tooltip]::after {
    text-transform: none; /* opinion 2 */
    font-size: .9em; /* opinion 3 */
    line-height: 1;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    opacity: 0;
  }
  [tooltip]::before {
    content: '';
    border: 5px solid transparent; /* opinion 4 */
    z-index: 1001; /* absurdity 1 */
  }
  [tooltip]::after {
    content: attr(tooltip); /* magic! */
    
    /* most of the rest of this is opinion */
    text-align: center;
    
    /* 
      Let the content set the size of the tooltips 
      but this will also keep them from being obnoxious
      */
    min-width: 3em;
    max-width: 21em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 1ch 1.5ch;
    border-radius: .3ch;
    box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
    background: #333;
    color: #fff;
    z-index: 1000; /* absurdity 2 */
    display: block;
  }
  
  /* Make the tooltips respond to hover */
  [tooltip]:hover::before,
  [tooltip]:hover::after {
    display: block;
  }
  
  /* don't show empty tooltips */
  [tooltip='']::before,
  [tooltip='']::after {
    display: none !important;
  }
  
  /* FLOW: UP */
  [tooltip]:not([flow])::before,
  [tooltip][flow^="up"]::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: #333;
  }
  [tooltip]:not([flow])::after,
  [tooltip][flow^="up"]::after {
    bottom: calc(100% + 5px);
  }
  [tooltip]:not([flow])::before,
  [tooltip]:not([flow])::after,
  [tooltip][flow^="up"]::before,
  [tooltip][flow^="up"]::after {
    left: 50%;
    transform: translate(-50%, -.5em);
  }
  
  /* FLOW: DOWN */
  [tooltip][flow^="down"]::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: #333;
  }
  [tooltip][flow^="down"]::after {
    top: calc(100% + 5px);
  }
  [tooltip][flow^="down"]::before,
  [tooltip][flow^="down"]::after {
    left: 50%;
    transform: translate(-50%, .5em);
  }
  
  /* FLOW: LEFT */
  [tooltip][flow^="sinistra"]::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: #333;
    left: calc(0em - 5px);
    transform: translate(-.5em, -50%);
  }
  [tooltip][flow^="sinistra"]::after {
    top: 50%;
    right: calc(100% + 5px);
    transform: translate(-.5em, -50%);
  }
  
  /* FLOW: RIGHT */
  [tooltip][flow^="destra"]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: #333;
    right: calc(0em - 5px);
    transform: translate(.5em, -50%);
  }
  [tooltip][flow^="destra"]::after {
    top: 50%;
    left: calc(100% + 5px);
    transform: translate(.5em, -50%);
  }
  
  /* KEYFRAMES */
  @keyframes tooltips-vert {
    to {
      opacity: 1;
      transform: translate(-50%, 0);
    }
  }
  
  @keyframes tooltips-horz {
    to {
      opacity: 1;
      transform: translate(0, -50%);
    }
  }
  
  /* FX All The Things */ 
  [tooltip]:not([flow]):hover::before,
  [tooltip]:not([flow]):hover::after,
  [tooltip][flow^="up"]:hover::before,
  [tooltip][flow^="up"]:hover::after,
  [tooltip][flow^="down"]:hover::before,
  [tooltip][flow^="down"]:hover::after {
    animation: tooltips-vert 300ms ease-out forwards;
  }
  
  [tooltip][flow^="sinistra"]:hover::before,
  [tooltip][flow^="sinistra"]:hover::after,
  [tooltip][flow^="destra"]:hover::before,
  [tooltip][flow^="destra"]:hover::after {
    animation: tooltips-horz 300ms ease-out forwards;
  }

  #tabella-input-cnt{
        border-radius: 5px;
        border: 1px solid #000;
        overflow: hidden;
  }

  #tabella-pulisci {
    width: 30px;
    height: 100%;
    position: absolute;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -2px;
    background-color: white;
    cursor: pointer;
}

#tabella-pulisci:hover{
    background: rgba(255, 255, 255, .4);
}

#menu-piccolo {
    position: absolute;
    right: 25px;
    display: none;
}

#guardaAnno{
    display: none;
}
.tabella-prec, .tabella-succ {
    display: none;
}
/* @media only screen and (hover: none) and (min-width: 940px){ */


#menu-slide-2 .menu-chiudi{
    display: none;
}

.bottone-chiudi, .bottone-indicatori {
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 17px;
    display: none;
    margin-top: -2px;
}
.bottone-indicatori{
    margin-right: 5px;
}

.bottone-chiudi:hover, .bottone-indicatori:hover {
    background-color: rgba(255,255,255,.2);
}

a:visited #testatina-header1{
    color: black;
  }

@media only screen and (min-width: 940px){
    /* tablet grande */
    #tabella-corpo, #tabella-testata {
        margin: 0 55px 0;
    }
}

/* @media only screen and (hover: none) and (min-width: 481px) and (max-width: 939px){ */
@media only screen and (min-width: 481px) and (max-width: 939px){
    /* tablet */
    #tabella-corpo, #tabella-testata {
        margin: 0 55px 0;
    }

    td:nth-child(2){
        display: none;
    }

    section{
        display: block;
    }

    .px-classifica{
        padding-left: 20px!important;
        padding-right: 20px!important;
    }

    #nav_header.classifica{
        position:fixed!important;
        top: 0 !important;
        z-index: 1;
        left: 0!important;
        margin: 0!important;
    }

    header.classifiche {
        margin-top: 80px!important;
    }

    #descrizione {
        column-count: 1;
    }

    .menu-slide {
        width: 35vw!important;
    }
    .noscroll #menu-slide-2.sezione {
        left: 35vw!important;
    }
}

/* @media only screen and (hover: none) and (max-width: 480px){ */
@media only screen and (max-width: 480px){
    /* Mobile */


    
    #nav_header{
        position: fixed!important;
        top: 0!important;
    }

    #menu-piccolo, #guardaAnno {
        display:block;
    }

    #scegliAnno,
    #tabella-succ,
    #tabella-prec{
        display: none;
    }

    .hamburger-menu {
        left: 0!important;
    }

    #menu-piccolo{
        right: 5px;
    }

    .titolo-anno{
        display: none;
    }

    #menu {
        margin-left: 8px!important;
        margin-right: 6px!important;
    }

    #testatina-cnt{
        position: relative;
        width: calc(100vw - 170px);
    }

    .testatina-header1{
        font-size: 18px!important;
    }

    .testatina-header2{
        display: block!important;
        margin-top: 16px!important;
        width: 100%!important;
        white-space: nowrap!important;
        overflow: hidden!important;
        text-overflow: ellipsis!important;
    }

    #tabella-indicatori td:nth-child(2), #tabella-indicatori td:nth-child(5),
    #tabellaClassifica td:nth-child(2), #tabellaClassifica td:nth-child(5),#tabellaClassifica td:nth-child(6){
        display: none;
    }

    h1 {
        font-size: 32px!important;
    }

    #descrizione{
        column-count: 1!important;
    }

    .px-classifica {
        padding-left: 5px!important;
        padding-right: 5px!important;
    }

    #tabella-corpo, #tabella-testata {
        margin: 0;
    }

    #tabella-testata {
        padding: 29.5px 0!important;
    }

    table {
        margin-left: 0!important;
        margin-right: 0!important;
    }

    #tabella-corpo {
        padding: 29.5px 22px 42.5px!important;
    }

    #tabella-titolo {
        text-align: center;
        font-size: 22px;

    }
    
    header.classifiche {
        margin-top: 60px;
    }

    .tabella-prec, .tabella-succ {
        display:flex;
    }

    #tabella-titolo{
        width: 100%;
    }

    #tabella-sezione{
        flex-direction: column;
    }

    #tabella-ricerca-cnt{
        margin-top: 20px;
        width: 100%;
        justify-content: flex-end;
    }

    #nav_header{
        z-index: 6;
    }

    #menu-slide-1, #menu-slide-2{
        width: 100vw;
    }

    #menu-slide-2{
        z-index: 2;
    }

    .noscroll #menu-slide-2:not(.generale):not(.chiuso) {
        left: 0;
    }

    .bottone-indicatori {
        display: flex;
    }
    
    #menu-slide-2 .menu-chiudi{
        display: flex;
    }
    

    #menu-slide-2 .menu-header{
        margin: 10px 10px;
    }

    .noscroll #menu-slide-2.sezione {
        left: 0!important;
    }

    a:visited .tabella-prec, a:visited .tabella-succ,
    a:link .tabella-prec, a:link .tabella-succ,
    a:hover .tabella-prec, a:hover .tabella-succ{
        text-decoration: none;
        color: black;
    }

    #section-heder, #tabelle-testata{
        flex-direction: column;
        height:initial;
      }


      #selettore{
          min-height: 280px;
          height: 50vh;
      }
    
      #advBlocco2{
        width: 100%;
      }
    
      #div-gpt-ad-MPU_Top {
        display: flex;
        justify-content: center;
      }
    
      #div-gpt-ad-MPU_Top div{
        margin: 50px 60px;
        border: 0pt none;
        margin: 50px 0;
      }

    #hamburger-menu-cnt{
        left:10px;
    }

    #hamburger-menu-cnt span{
        display: none;
    }
}

@media only screen and (max-width: 320px){
    .titolo-2 {
        font-size: 22px;
    }
}