style.css

body {
    background-color: #f8f8ff;
}

.header {
    padding-left: 20px;
    font-family: sans-serif;
}

.header h2 {
    margin-bottom: 4px;
    font-size: 25px;
}

.header p {
    margin-top: 0;
    font-size: 18px;
    color: #74736f;
}

.textarea-container {
    padding: 0 20px 20px 20px; /* Used to emulate margin on #main-textarea, otherwise we have to use calc(100% - 20px) which isn't widely supported. */
}

#main-textarea {
    width: 100%;
    height: 80vh;
    font-size: 19px;
    line-height: 1.3;
    border: 20px solid rgba(0, 0, 0, 0); /* Alternative to padding, brings the resizer handle inwards. */
    box-shadow: rgba(234, 82, 248, 0.3) 0px 0px 1px, rgba(0, 102, 255, 0.3) 0px 0px 1px 1px, rgba(38, 38, 38, 0.3) 0px 3px 3px;
    border-radius: 10px;
    background-color: #fbfbff;
    box-sizing: border-box;
    position: relative;
}

#download-link {
    width: 160px;
    height: 50px;
    margin-left: 20px;
    color: #fbfbff;
    font-family: sans-serif;
    font-size: 19px;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    background: rgba(0, 0, 0, 0) linear-gradient(45.34deg, rgb(234, 82, 248) 5.66%, rgb(0, 102, 255) 94.35%) repeat scroll 0% 0%; 
    box-shadow: rgba(38, 38, 38, 0.3) 0px 3px 3px;
    border-radius: 5px;
    opacity: 0.9;
    transition-duration: 0.2s;
    display: inline-block;
}

#download-link:hover {
    opacity: 1;
    transition-duration: 0.2s;
}

.feather {
    bottom: 2px;
    width: 24px;
    height: 50px;
    margin-right: 2px;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
    vertical-align: middle;
    position: relative;
}

#auto-update {
    bottom: 3px;
    width: 30px;
    height: 30px;
    margin-left: 20px;
    vertical-align: middle;
    position: relative;
}

.auto-update-text {
    margin-left: 5px;
    font-family: sans-serif;
    font-size: 19px;
}