SCSS Placeholder hover SCSS

sass-placeholder-hover.scss

/* --- Box Shadow --- */
// -- Placeholder -- box shadow default placeholder
%box-shadow-ready { 
   box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .1); 
}
%box-shadow-hover { 
   box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .175); 
}
// -- Placeholder -- box-shadow
%box-shadow { 
   @extend %box-shadow-ready;
   transition: box-shadow .5s ease;
   &:hover {
     @extend %box-shadow-hover;
   }
}
.shape {   
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
   flex: 0 0 33.3%;
   max-width: 33.3%;   
   &-body {      
      @extend %box-shadow;
      background:white;
      padding: 2rem;
      position: relative;
      overflow: hidden;
      border-radius:5px;   
   }   
}