.box-shadow-1 {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}

.box-shadow-1:hover[role="button"] {
    box-shadow: rgba(50, 50, 93, 0.25) 2px 4px 10px 1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
.box-shadow-2 {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    /*box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;*/
}

.box-shadow-2:hover[role="button"] {
    box-shadow: rgba(50, 50, 93, 0.25) 2px 12px 24px -4px, rgba(0, 0, 0, 0.3) 0px 6px 14px -6px;
}

.box-shadow-3 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}

.box-shadow-3:hover[role="button"] {
    box-shadow: rgba(0, 0, 0, 0.1) calc(0px*2) calc(4px*2) calc(12px*2);
}

.box-shadow-4 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
}

.box-shadow-4:hover[role="button"] {
    box-shadow: rgba(0, 0, 0, 0.1) 0px calc(1px*2) calc(3px*2) 0px, rgba(0, 0, 0, 0.06) 0px calc(1px*2) calc(2px*2) 0px;
}