main.scss

body {
    background: #DCF5FF;
    margin: 0;
    height: 100vh;
    display: grid;
    justify-items: center;
    align-items:center;
    font-family: 'Nunito', 'sans-serif';
}


.inner {
    background: rgb(9, 201, 153);
    padding: 1em;
    border-radius: 10px;
    width: 250px;
    clip-path: circle(10% at 90% 20%);
    transition: all .5s ease-in-out;
    cursor: pointer;

    &:hover {
        clip-path: circle(75%);
        background: #00B6FF;
    }

    h1 {
        color: white;
        margin: 0;
    }

    p {
        color: white;
        font-size: .8rem;
    }
    span {
        float: right;
        color: white;
        font-weight: bold;
        transition: color .5s;
        position: relative;
        margin-right: 4%;
    }
    &:hover span {
        color: rgba(255,255,255,0)
    }
}