/*! Pure v1.0.1 Copyright 2013 Yahoo! Licensed under the BSD License. https://github.com/pure-css/pure/blob/master/LICENSE.md */ /*! normalize.css v^3.0 | MIT License | git.io/normalize Copyright (c) Nicolas Gallagher and Jonathan Neal */ /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ html { font-family: 'Roboto', sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; background-color: #f4f4f9; color: #333; } a { background-color: transparent; transition: color 0.3s ease; } a:active, a:hover { outline: 0; color: #0078e7; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; padding: 10px 20px; background-color: #0078e7; color: white; border: none; border-radius: 5px; box-shadow: 0 5px #005bb5; transition: background-color 0.3s ease, transform 0.2s ease; } button:hover { background-color: #005bb5; transform: translateY(-2px); } button:active { background-color: #004494; box-shadow: 0 2px #005bb5; transform: translateY(0); } button:focus { outline: none; } .pure-form input[type=text], .pure-form input[type=email], .pure-form select, .pure-form textarea { padding: 10px; display: inline-block; border: 1px solid #ccc; border-radius: 5px; box-shadow: inset 0 1px 3px #ddd; transition: border-color 0.3s ease, box-shadow 0.3s ease; } .pure-form input[type=text]:focus, .pure-form input[type=email]:focus, .pure-form select:focus, .pure-form textarea:focus { outline: none; border-color: #0078e7; box-shadow: inset 0 1px 3px rgba(0, 120, 231, 0.5); } .pure-form .pure-group fieldset { margin-bottom: 10px; } .pure-form .pure-group input, .pure-form .pure-group textarea { display: block; padding: 10px; margin: 0 0 -1px; border-radius: 0; position: relative; top: -1px; } .pure-form .pure-group input:focus, .pure-form .pure-group textarea:focus { z-index: 3; } .pure-form .pure-group input:first-child, .pure-form .pure-group textarea:first-child { top: 1px; border-radius: 5px 5px 0 0; margin: 0; } .pure-form .pure-group input:first-child:last-child, .pure-form .pure-group textarea:first-child:last-child { top: 1px; border-radius: 5px; margin: 0; } .pure-form .pure-group input:last-child, .pure-form .pure-group textarea:last-child { top: -2px; border-radius: 0 0 5px 5px; margin: 0; } .pure-form .pure-group button { margin: .35em 0; } .pure-form .pure-input-1 { width: 100%; } .pure-form .pure-input-3-4 { width: 75%; } .pure-form .pure-input-2-3 { width: 66%; } .pure-form .pure-input-1-2 { width: 50%; } .pure-form .pure-input-1-3 { width: 33%; } .pure-form .pure-input-1-4 { width: 25%; } .pure-menu { -webkit-box-sizing: border-box; box-sizing: border-box; } .pure-menu-fixed { position: fixed; left: 0; top: 0; width: 100%; z-index: 3; background: #0078e7; color: white; padding: 10px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); } .pure-menu-heading { text-transform: uppercase; color: #fff; } .pure-menu-link { color: #fff; transition: color 0.3s ease; } .pure-menu-link:hover { color: #d1ecff; } .pure-button { display: inline-block; zoom: 1; line-height: normal; white-space: nowrap; vertical-align: middle; text-align: center; cursor: pointer; -webkit-user-drag: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: inherit; font-size: 100%; padding: .5em 1em; color: #444; color: rgba(0, 0, 0, .8); border: 1px solid #999; border: none transparent; background-color: #e6e6e6; text-decoration: none; border-radius: 5px; transition: background-color 0.3s ease, transform 0.2s ease; } .pure-button-hover, .pure-button:focus, .pure-button:hover { background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(40%, rgba(0, 0, 0, .05)), to(rgba(0, 0, 0, .1))); background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1)); background-image: linear-gradient(transparent, rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .1)); transform: translateY(-2px); } .pure-button:focus { outline: 0; } .pure-button-active, .pure-button:active { -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, .15) inset, 0 0 6px rgba(0, 0, 0, .2) inset; box-shadow: 0 0 0 1px rgba(0, 0, 0, .15) inset, 0 0 6px rgba(0, 0, 0, .2) inset; border-color: #000; transform: translateY(0); } .pure-button-primary, .pure-button-selected, a.pure-button-primary, a.pure-button-selected { background-color: #0078e7; color: #fff; box-shadow: 0 4px #005bb5; } .pure-form input[type=color]:focus, .pure-form input[type=date]:focus, .pure-form input[type=datetime-local]:focus, .pure-form input[type=datetime]:focus, .pure-form input[type=email]:focus, .pure-form input[type=month]:focus, .pure-form input[type=number]:focus, .pure-form input[type=password]:focus, .pure-form input[type=search]:focus, .pure-form input[type=tel]:focus, .pure-form input[type=text]:focus, .pure-form input[type=time]:focus, .pure-form input[type=url]:focus, .pure-form input[type=week]:focus, .pure-form select:focus, .pure-form textarea:focus { outline: 0; border-color: #03dac6; box-shadow: inset 0 1px 3px rgba(3, 218, 198, 0.5); } .pure-form input[readonly], .pure-form select[readonly], .pure-form textarea[readonly] { background-color: #eee; color: #777; border-color: #ccc; } .pure-form input:focus:invalid, .pure-form select:focus:invalid, .pure-form textarea:focus:invalid { color: #b94a48; border-color: #e9322d; } .pure-form input[type=checkbox]:focus:invalid:focus, .pure-form input[type=file]:focus:invalid:focus, .pure-form input[type=radio]:focus:invalid:focus { outline-color: #e9322d; } .pure-form input[disabled], .pure-form select[disabled], .pure-form textarea[disabled] { cursor: not-allowed; background-color: #eaeded; color: #cad2d3; }