Form

Form wrapper

COPYwidth: 100%;
max-width: 560px;
border: solid 1px #ccc;
border-radius: 3px;
box-sizing: border-box;
padding: 2rem 1.6rem;
background-color: #dddddd;

Labels

COPYmargin-bottom: 0;
font-size: 0.875rem;
font-family: 'Roboto', sans-serif;
display: block;
width: 100%;

Input text

COPYfont-size: 0.875rem;
display: block;
width: 100%;
margin: 2px 0 8px;
padding: 3px 6px;
height: 36px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;

Input select

COPYfont-size: 0.875rem;
display: block;
width: 100%;
margin: 2px 0 8px;
padding: 3px 6px;
height: 36px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;

Textarea

COPYfont-size: 0.875rem;
display: block;
width: 100%;
margin: 2px 0 8px;
padding: 3px 6px;
height: 80px;
border: 1px solid #ccc;
border-radius: 3px;
box-sizing: border-box;
font-family: 'Roboto', sans-serif;

input:focus, select:focus, textarea:focus

COPYbackground-color: #f9f9f9;
border-color: #ef7d25;
outline-color: #ef7d25;