/*##############################################
for Modals
*/
.overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
    display: none;
}
.overlay:target {
    pointer-events: all;
    display: block;
}

.close {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000000;
    opacity: 0.7;
    transition: opacity 200ms;

}
.close:hover {
      opacity: 0.4
    
}

/*#################################################
FOR HOVERS
#################################################
*/
.hover-link {
    position: relative;
    display: inline-block
}

.hover-link .hover-overlay {
    display: none;
    position: absolute;
    z-index: 1;
    top: 1.5rem;
    left:0;
}

.hover-link:hover .hover-overlay {
    display: block;
}