:root{
    --colore-apertura:black;
    --colore-sta-per-chiudere:black;
    --colore-chiusura:black;
    --bianco-darker: white;
}
#navbar{
    transition: 1s ;
}

#info-orari{
    color:white!important;
    cursor: pointer;
}
.aperto{
    color: var(--colore-apertura)!important;
}
.staPerChiudere{
    color: var(--colore-sta-per-chiudere)!important;
}
.chiuso{
    color: var(--colore-chiusura)!important;
}
#dropdown-menu-orari{
    right: 0;
    top:3rem;
    z-index:99999;
    background-color: var(--bianco-darker);
    border-radius:0;
    padding:0;
    position: absolute;
    
}
#dropdown-menu-orari li{
    font-size:17px!important;
    font-weight: 400;
    text-transform: capitalize;
    width:290px;
    padding:0.3rem
}
.intro-banner-vdo-play-btn{
    top:0.2rem;
    height:12px;
    width:12px;
    position:absolute;
    border-radius:100px;
    z-index:1
    
}

.intro-banner-vdo-play-btn .ripple{
    position:absolute;
    width:160px;
    height:160px;
    z-index:-1;
    left:50%;
    top:50%;
    opacity:0;
    margin:-80px 0 0 -80px;
    border-radius:100px;
    -webkit-animation:ripple 1.8s infinite;
    animation:ripple 1.8s infinite
}
.ring-container {
    position: relative;
}
.circle {
    width: 15px;
    height: 15px;
    background-color: white;
    border-radius: 50%;
    position: absolute;
    top: 4px;
    right: 0px;
}

.ringring {
    border: 3px solid white;
    -webkit-border-radius: 30px;
    height: 25px;
    width: 25px;
    position: absolute;
    top: -1px;
    right: -5px;
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite; 
    opacity: 0.0
}
@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}
@-webkit-keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(0.2);
        transform:scale(0.2)
    }
}
@keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(0.2);
        transform:scale(0.2)
    }
}
.intro-banner-vdo-play-btn .ripple:nth-child(2){
    animation-delay:.3s;
    -webkit-animation-delay:.3s
}
.intro-banner-vdo-play-btn .ripple:nth-child(3){
    animation-delay:.6s;
    -webkit-animation-delay:.6s
}