.sobre {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 100;
    overflow: hidden;
    background-color: #ffffff00;
}

.petalo {
    position: absolute;
    width: 50%;
    height: 100%;
    background-image: url(../img/papel1.png);
    background-size: cover;
    background-color: #000000;
    border: 0.6vw solid #ffffff;
    z-index: 1;
    filter: brightness(108%);
    border: solid 0.2vw var(--line-sobre);
}

.petalo.left {
    left: 0;
    border-right: none;
    border-radius: 0 100% 100% 0;
}

.petalo.right {
    right: 0;
    border-left: none;
    border-radius: 100% 0 0 100%;
}

@font-face {
    font-family: 'Carattere';
   /* src: url(../Fuentes/Carattere/Carattere-Regular.ttf);*/
}

.sello {
    background-image: url(../img/papel1.png) !important;
    background-size: cover;
    background: #ead4ff;
    border-radius: 1%;       
    text-align: center;
    outline: none;
    cursor: pointer;    
    position: absolute;
    text-align: center !important;
    width: 46vw;
    height: 66vw;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    filter: brightness(103%);
}


.sello-sombra{
    background-image: url(../img/papel1.png) !important;
    background-size: cover;
    background: #ead4ff;
    border: solid 0vw #775197;
    z-index: 2;
    border-radius: 1%;    
    position: absolute;
    width: 50vw;
    height: 70vw;
    top: 45%;
    left: 50%;
    filter: brightness(106%);
    transform: translate(-50%, -50%);
    -webkit-box-shadow: 1vw 0.6vw 3vw 0.2vw rgba(0,0,0,0.41);
    box-shadow: 1vw 0.6vw 3vw 0.2vw rgba(0,0,0,0.41);
}


.banda-sobre{
    background-image:url(../img/papel1.png) !important;
    background-size: contain;
    background: #ead4ff;
    border: solid 1.4vw #775197;
    z-index: 1;
    position: absolute;
    width: 100%;
    height: 52vw;
    top: 45%;
    left: 50%;
    filter: brightness(104%);
    transform: translate(-50%, -50%);
    -webkit-box-shadow: 1vw 0.6vw 3vw 0.2vw rgba(0,0,0,0.41);
    box-shadow: 1vw 0.6vw 3vw 0.2vw rgba(0,0,0,0.41);
}

.sobre.open .petalo.left {
    transform: translateX(-100%);
}

.sobre.open .petalo.right {
    transform: translateX(100%);
}

.boom {
    animation: 1.5s boom infinite;
}

@keyframes boom {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.15);
    }

    100% {
        transform: scale(1);
    }
}

