Efecto aparecer y desaparecer capa

[Silenn]

Para la capa de fondo puedes agregar otro div <div class="modal-fondo"></div>, ya con su css.
Aparece primero

Código Javascript:

var counter = 1;
    if(counter == 1){
        $('.tarea').click(function() {
            $('.modal-fondo').fadeIn();
            $('.capa').fadeOut();
            setTimeout(function(){$(".capa").animate({left: '0'})},150);
            counter = 2;
        });
    }else{
        $('.modal-fondo').click(function(){
            $('.modal-fondo').fadeOut();
            $(".capa").animate({left: '-100%'});
            setTimeout(function(){$(".capa").remove()},150); //Se quita "capa" del documento para que no cause problemas, esto es opcional si no se volviera a abrir, si no es así puedes eliminar esta línea.
            counter = 1;
        });
    }