* { border: 0; margin: 0; padding: 0; box-sizing: border-box; } body { background: #282b3c; color: #ccc; font-family: Sans-serif; font-size: 13px; } a, a:visited, a:active { color: #96d9a1; text-decoration: none; opacity: .9; } a:hover { opacity: 1; transition: opacity .5s ease-in-out; } h1, h2, h3, h4, h5 { display: inline-block; font-weight: normal; } h1 { font-size: 16px; } h2 { color: #ccc; font-size: 16px; } a h2, a:visited h2, a:active h2 { /* @TODO doubts color: #a4d4ff; */ } input, select, textarea { background: #5d627d; color: #ccc; border: 0; border-radius: 3px; padding: 8px; font-size: 13px; } textarea:focus, input:focus { outline: none; color: #fff; } textarea { min-height: 160px; } /* @TODO improve focus out textarea:focus { min-height: 120px; } */ textarea::placeholder, input::placeholder { color: #9698a5; opacity: 1; } input:hover, textarea:hover { background: #636884; } input[type="submit"] { cursor: pointer; } td { padding: 2px 0; } header a.logo { color: #ccc; font-size: 22px; } header a.logo > span { color: #96d9a1; } a.button, a.button:visited, a.button:active, a.button:hover, .button { background: #5d627d; color: #ccc; border: 0; border-radius: 3px; padding: 6px 8px; font-size: 13px; }