body {
    background-color: #ECECEC;
}

.container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

.btn {
    font-family: arial;
    font-size: 20px;
    background-color: #ECECEC;
    color: rgba(black, 0.6);
    border: 1px rgba(black, 0.2) solid;
    border-radius: 50px;
    text-align: center;
    padding: 10px 30px;
    outline: none;
    @include transition(all .1s ease);
    box-shadow: 0 2px white inset,
                rgb(203, 203, 203) 1px 1px,
    rgb(206, 206, 206) 2px 2px,
    rgb(208, 208, 208) 3px 3px,
    rgb(211, 211, 211) 4px 4px,
    rgb(213, 213, 213) 5px 5px,
    rgb(216, 216, 216) 6px 6px,
    rgb(218, 218, 218) 7px 7px,
    rgb(221, 221, 221) 8px 8px,
    rgb(223, 223, 223) 9px 9px,
    rgb(226, 226, 226) 10px 10px,
    rgb(228, 228, 228) 11px 11px,
    rgb(231, 231, 231) 12px 12px,
    rgb(233, 233, 233) 13px 13px,
    rgb(236, 236, 236) 14px 14px;
    cursor: pointer;
    
    &:hover {
        background-color: #dcdcdc;
        @include filter-gradient(#dcdcdc, #eaeaea, vertical);
        @include background-image(linear-gradient(top, #dcdcdc 0%,#eaeaea 100%));
               box-shadow: 0 -1px white inset,
                           0 1px rgba(black, 0.1) inset; 
            }
}