html { height: 100%; } body { font-family: -apple-system, BlinkMacSystemFont, 'Verdana', 'Roboto', 'PT Sans', sans-serif; margin: 0 auto; text-rendering: optimizeLegibility; width: 100%; padding-bottom: 40px; } .container { width: 980px; margin-right: auto; margin-left: auto; } /* * Text * ------------------------------------------ */ .left { text-align: left; } .right { text-align: right; } .center { text-align: center; } /* * Directions * ------------------------------------------ */ .pull-right { float: right; } .pull-left { float: left; } /* * Buttons * ------------------------------------------ */ input[type=submit] { -webkit-appearance: none; width: auto; border: none; font-size: inherit; } .button, input[type=submit] { background-color: #00695C; color: #FFF; display: inline-block; padding: 16px 28px; cursor: pointer; } .button:hover, input[type=submit]:hover { background-color: #00796B; } a.button, a.button:hover, a.button:visited { color: #FFF; } .button.mini { color: #212121; background-color: #FFD740; padding: 4px 8px; } .button.mini:hover { color: #212121; background-color: #FFE57F; } a.button.mini, a.button.mini:hover, a.button.mini:visited { color: #212121; } /* * Forms * ------------------------------------------ */ form, .form { margin-bottom: 40px; } form label, .form label { width: 160px; max-width: 160px; min-width: 160px; } form.label-width-100 label, .form.label-width-100 label { width: 100px; max-width: 100px; min-width: 100px; } form.label-width-200 label, .form.label-width-200 label { width: 200px; max-width: 200px; min-width: 200px; } .field_with_errors { display: inline-block; } .actions { margin-top: 20px; } .actions a, .actions input[type=submit], .actions .button { margin-right: 40px; } /* * Inputs * ------------------------------------------ */ input { margin: 0 10px 14px 0; } input[type=text], input[type=password] { border: none; border-bottom: #FFE57F solid 1px; font-size: inherit; width: 400px; } input[type=text]:focus, input[type=password]:focus { border-bottom: #009688 solid 1px; } input:focus, textarea:focus { outline: none; } /* * Labels * ------------------------------------------ */ label { color: #757575; display: inline-block; margin-right: 18px; } /* * Links * ------------------------------------------ */ a { border: none; color: #1565C0; cursor: pointer; text-decoration: none; } a:hover { color: #1565C0; border: none; } a:visited { color: #1565C0; } /* * Linsts * ------------------------------------------ */ /* * Menu * ------------------------------------------ */ .menu { background-color: #009688; color: #FFF; overflow: auto; font-weight: bold; padding: 20px 0; } .menu a { color: #FFF; } .menu ul { list-style-type: none; margin: 0; padding: 0; display: inline-block; } .menu li { display: inline-block; padding-right: 20px; } .menu li:last-child { padding-right: 0; } /* * Tables * ------------------------------------------ */ table { border-collapse: collapse; margin-bottom: 40px; } table.wide { width: 100%; } table.rows tr { border-bottom: 1px solid #CFD8DC; } table.rows tr:last-child { border: none } th, td { text-align: left; padding: 10px 30px 10px 14px; vertical-align: top; } th:last-child, td:last-child { padding-right: 14px; } th { background-color: #CFD8DC; } /* * Misc * ------------------------------------------ */ pre { background-color: #E0F2F1; padding: 6px; } hr { border: 1px solid #FFE57F; } hr.strong { border: 2px solid #FFE57F; }