.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(../Decoraciones/Sueltos/papel1.png);
    background-size: cover;
    background-color: #000000;
    border: 1vw 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;
    /* -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); */
}

.petalo.right {
    right: 0;
    border-left: none;
    border-radius: 100% 0 0 100%;
    /* -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); */
}

@font-face {
    font-family: 'Carattere';
    src: url(../Fuentes/Carattere/Carattere-Regular.ttf);
}

.sello {
    background-image: url(../Decoraciones/Sueltos/papel1.png) !important;
    background-size: cover;
    background: var(--color-sobre);
    border-radius: 1%;       
    text-align: center;
    outline: none;
    cursor: pointer;    
    position: absolute;
    text-align: center !important;
    width: 46vw;
    height: 46vw;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    filter: brightness(103%);
}


.sello-sombra{
    background-image: url(../Decoraciones/Sueltos/papel1.png) !important;
    background-size: cover;
    background: var(--color-sobre);
    border: solid 0vw var(--line-sobre);
    z-index: 2;
    border-radius: 1%;    
    position: absolute;
    width: 50vw;
    height: 50vw;
    top: 50%;
    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(../Decoraciones/Sueltos/papel1.png) !important;
    background-size: contain;
    background: var(--color-sobre);
    border: solid 1.4vw var(--line-sobre);
    z-index: 1;
    position: absolute;
    width: 100%;
    height: 32vw;
    top: 50%;
    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%);
}