@import url('https://fonts.googleapis.com/css2?family=Rouge+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&family=Rouge+Script&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Quicksand", Arial, Helvetica, sans-serif;
}

body {
    background-color: #191919;
}

#name {
    font-size: clamp(48px, 13vw, 200px);
    font-weight: 600;
    color: #e4e4e4;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: default;
    transition: all 0.5s
}

#name:hover {
    -webkit-transform: translate(-50%, calc(-50% - 50px));
    transform: translate(-50%, calc(-50% - 50px));
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    text-shadow: 0 1px 0 #797979, 0 2px 0 #797979, 0 3px 0 #797979, 0 4px 0 #797979, 0 5px 0 #797979, 0 6px 0 #797979, 0 7px 0 #797979, 0 8px 0 #797979, 0 9px 0 #797979, 0 50px 30px #404040;
}