.working { width: 24px; height: 24px; position: relative; display: inline-block; vertical-align: bottom; &::before, &::after { content: ' '; width: 100%; height: 100%; border-radius: 50%; background-color: #fff; opacity: 0.6; position: absolute; top: 0; left: 0; -webkit-animation: sk-bounce 2.0s infinite ease-in-out; animation: sk-bounce 2.0s infinite ease-in-out; } &::after { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } } @-webkit-keyframes sk-bounce { 0%, 100% { -webkit-transform: scale(0.0) } 50% { -webkit-transform: scale(1.0) } } @keyframes sk-bounce { 0%, 100% { transform: scale(0.0); -webkit-transform: scale(0.0); } 50% { transform: scale(1.0); -webkit-transform: scale(1.0); } } .btn, .form-control, .navbar { border-radius: 0; } .container { font-size: 18px; margin-bottom: 100px; } body, small, p, div { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } .input-row { margin-bottom: 20px; .form-control { margin-bottom: 5px; } .help-text { pointer-events: none; line-height: 20px; color: #888; font-size: 85%; display: none; } .input-field { border-right: 5px solid #FFF; } &.active { .input-field { border-right-color: #38B44A; padding-right: 20px; } .help-text { display: block; } } &.error { .input-field { border-right-color: #BF3E11; padding-right: 20px; } .help-text { display: block; } } }