/**
 * APP IO
 */
.notifica-io {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    z-index: 999;
}

.notifica-io a {
    text-decoration: none;
}

.notifica-io .cerchio {
    width: 4rem;
    height: 4rem;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    bottom: 3rem;
    right: 3rem;
    box-shadow: 0 0 2rem rgba(0, 0, 0, .2);
    z-index: 99999;
    cursor: pointer;
}

.notifica-io .cerchio img {
    position: absolute;
    width: 2rem;
    height: 2rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.notifica-io .fumetto {
    position: absolute;
    background: #fff;
    border-radius: .4em;
    padding: 1.4rem;
    width: 320px;
    font-size: 1rem;
    right: 1rem;
    bottom: 9rem;
    box-shadow: 0 0 2rem rgba(0, 0, 0, .2);
    animation: anifumetto 1.2s;
}

.notifica-io .fumetto .link-pagina-appio {
    text-decoration: underline;
}

.notifica-io .fumetto .icona-chiudi {
    position: absolute;
    color: #000;
    top: 0.5rem;
    right: 0.8rem;
    cursor: pointer;
}

.notifica-io .fumetto:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 1rem;
    width: 0;
    height: 0;
    border: 31px solid transparent;
    border-top-color: #fff;
    border-bottom: 0;
    border-left: 0;
    margin-left: -1.5rem;
    margin-bottom: -1.5rem;
}

@keyframes anifumetto {
    from {
        transform: translateY(20%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}