modal thiny jquery

js.js

=== GLOBAL.JS INFORMATION === 
 
$('.close').click(function(e){  
            e.preventDefault();  
            $(".overlay").fadeOut(500);  
        }); 
 
        $('.pop').click(function(e){ 
            e.preventDefault(); 
             $(".overlay").fadeIn(500); 
    }); 
 
 
=== CSS INFORMATION === 
 
.overlay {  
    display: none;  
    position: fixed;  
    padding: 20px;  
    z-index: 1;  
    width: 100%;  
    height: 100%;  
    z-index: 9999;  
    background: rgba(0, 0, 0, 0.8);  
    z-index: 9999;  
    top: 0;  
    left: 0;  
    .content {  
        width: 60%;  
        height: 75%;  
        position: absolute;  
        z-index: 9999;  
        @include center();  
        background: $base;  
    }  
    a.close {  
        position: absolute;  
        top: 0;  
        font-size: 24px;  
        z-index: 999;  
        right: 10px;  
        text-decoration: none;  
        cursor: pointer;  
    }  
} 
 
 
=== HTML INFORMATION === 
 
<div class="overlay">  
   <div class="content"> 
      <a class="close"><i class="fa fa-times-circle" aria-hidden="true"></i></a> 
              
      Content Here 
 
   </div> 
</div>