.piece.alerta{
    box-sizing:border-box;
    border:1px solid #fff;
    border-left:0;
    border-right:0;
    background-color:rgba(255,255,255,1);
    transform: translate3d(0,0,0);
    opacity:1;
    height:inherit;
}

.piece.alerta.hidden{z-index:-1;border:0;opacitys:0;transform:translate3d(0,-100%,0);animation: fadeOutUp 0.3s 0s 1 ease-in normal forwards}
.piece.alerta.hidden .piece-wrapper{transform:translate3d(0,-100%,0);animation: fadeOutUpInt 0.2s 0s 1 ease-in normal forwards}

@keyframes fadeOutUp {
  from {
    transform:translate3d(0,0,0);
    height:inherit;
    opacity:1;
  }

  to {
    transform:translate3d(0,-100%,0);
    opacitys:0;
    height:0;
  }
}

@keyframes fadeOutUpInt {
  from {
    transform:translate3d(0,0,0);
    height:inherit;
    opacity:1;
  }

  to {
    transform:translate3d(0,-100%,0);
    opacity:0;
    height:0;
  }
}

.piece.alerta:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-color: rgba(0,0,0,0.8);}
.piece.alerta .canvas-width{text-align:left;display:flex;position:relative;padding:15px 0}
.piece.alerta .piecetitle{position:relative;background-color:red;color:#fff;padding:5px 20px;border-radius:3px;text-transform:uppercase;font-weight:bold;vertical-align:middle;font-size: 1.7em;margin:0 10px 0 0;line-height:1em;flex-shrink:0;font-family:var(--default-font);height:min-content;text-overflow:ellipsis;max-width:25%}
.piece.alerta .items{height: inherit;display: flex;align-items: center;}
.piece.alerta .title{position:relative;line-height: 1em;margin: 0;display:inline-block;padding:0;text-align:left;color:rgba(255,255,255,0.9);vertical-align:middle}
.piece.alerta .title a{color:rgba(255,255,255,0.9);transition:color 0.3s}
.piece.alerta .title:hover a{color:rgba(255,255,255,1)}
.piece.alerta .btn-close{position:absolute;left:50%;right:unset;bottom:5px;top:unset;z-index:3;background-image: url(/0/img/pieces/alerta/btn-close.png);background-repeat:no-repeat;background-size:13px 9px;width:35px;height:35px;background-position:50% 100%}


@media (max-width:768px){
    .piece.alerta .canvas-width{flex-direction:column}
    .piece.alerta .piecetitle{margin-right:0;max-width:100%}
}