// // hover-preview tooltip //

.tooltip-wrapper {

@include fs-2;
z-index: 5;
background: $body-background-color;
padding: 2em; // don't use sass spacing variables -- it makes hover preview buggy.
border: 1px solid $border-color;
border-radius: 15px;
overflow: hidden;
position: absolute;
width: 400px;
height: 250px;
box-shadow: 0 1px 2px rgba($box-shadow-color, 0.12), 0 3px 10px rgba($box-shadow-color, 0.08);

}

.tooltip-wrapper:after {

content: "";
position: absolute;
z-index: 5;
bottom: 0;
left: 0;
pointer-events: none;
background-image: linear-gradient(to bottom, rgba(0,0,0,0), $body-background-color 90%);
width: 100%;
height: 75px;

}