.form--create {
  display: flex;
  flex-direction: row;
  align-items: center; }
  .form--create .form-field input {
    margin-right: 20px;
    font-size: 36px;
    font-weight: 700; }
    .form--create .form-field input::placeholder {
      color: #ccc; }
.test-1 {
  background: #31B7D7;
  background: -webkit-linear-gradient(-90deg, #31B7D7, #EDAC7D);
  background: linear-gradient(180deg, #31B7D7, #EDAC7D); }

.test-2 {
  background: #E47D7D;
  background: -webkit-linear-gradient(left, #E47D7D 0%, #C195D3 50%, #4FB4E8 100%);
  background: linear-gradient(to right, #E47D7D 0%, #C195D3 50%, #4FB4E8 100%); }

.test-3 {
  background: #B58234;
  background: -webkit-linear-gradient(48deg, #B58234 0%, #D2B545 50%, #D7C04D 50.01%, #FFFFFF 100%);
  background: linear-gradient(42deg, #B58234 0%, #D2B545 50%, #D7C04D 50.01%, #FFFFFF 100%); }

.project {
  cursor: pointer;
  padding: 20px 0;
  border-bottom: 1px solid #eee;
  -webkit-transition: padding-left 300ms cubic-bezier(0.035, 0.92, 0.28, 0.93);
  -moz-transition: padding-left 300ms cubic-bezier(0.035, 0.92, 0.28, 0.93);
  -o-transition: padding-left 300ms cubic-bezier(0.035, 0.92, 0.28, 0.93);
  transition: padding-left 300ms cubic-bezier(0.035, 0.92, 0.28, 0.93); }
  .project:last-child {
    border-bottom: 0; }
  .project:hover {
    padding-left: 15px; }
@keyframes fly-up {
  0% {
    opacity: 0;
    transform: translate(0, 20px); }
  100% {
    opacity: 1;
    transform: translate(0, 0px); } }

@keyframes fly-down {
  0% {
    opacity: 0;
    transform: translate(0, -20px); }
  100% {
    opacity: 1;
    transform: translate(0, 0px); } }

.anim-delay-50 {
  animation-delay: 50ms !important; }

.anim-delay-100 {
  animation-delay: 100ms !important; }

.anim-delay-150 {
  animation-delay: 150ms !important; }

.anim-delay-200 {
  animation-delay: 200ms !important; }

.anim-delay-250 {
  animation-delay: 250ms !important; }

.anim-delay-300 {
  animation-delay: 300ms !important; }

.anim-delay-350 {
  animation-delay: 350ms !important; }

.anim-delay-400 {
  animation-delay: 400ms !important; }

.anim-delay-450 {
  animation-delay: 450ms !important; }

.anim-delay-500 {
  animation-delay: 500ms !important; }

.anim-delay-550 {
  animation-delay: 550ms !important; }

.anim-delay-600 {
  animation-delay: 600ms !important; }

.anim-delay-650 {
  animation-delay: 650ms !important; }

.anim-delay-700 {
  animation-delay: 700ms !important; }

.anim-delay-750 {
  animation-delay: 750ms !important; }

.anim-delay-800 {
  animation-delay: 800ms !important; }

.anim-delay-850 {
  animation-delay: 850ms !important; }

.anim-delay-900 {
  animation-delay: 900ms !important; }

.anim-delay-950 {
  animation-delay: 950ms !important; }

.anim-delay-1000 {
  animation-delay: 1000ms !important; }

.anim-delay-1050 {
  animation-delay: 1050ms !important; }

.anim-delay-1100 {
  animation-delay: 1100ms !important; }

.anim-delay-1150 {
  animation-delay: 1150ms !important; }

.anim-delay-1200 {
  animation-delay: 1200ms !important; }

.anim-delay-1250 {
  animation-delay: 1250ms !important; }

.anim-delay-1300 {
  animation-delay: 1300ms !important; }

.anim-delay-1350 {
  animation-delay: 1350ms !important; }

.anim-delay-1400 {
  animation-delay: 1400ms !important; }

.anim-delay-1450 {
  animation-delay: 1450ms !important; }

.anim-delay-1500 {
  animation-delay: 1500ms !important; }

.anim-delay-1550 {
  animation-delay: 1550ms !important; }

.anim-delay-1600 {
  animation-delay: 1600ms !important; }

.anim-delay-1650 {
  animation-delay: 1650ms !important; }

.anim-delay-1700 {
  animation-delay: 1700ms !important; }

.anim-delay-1750 {
  animation-delay: 1750ms !important; }

.anim-delay-1800 {
  animation-delay: 1800ms !important; }

.anim-delay-1850 {
  animation-delay: 1850ms !important; }

.anim-delay-1900 {
  animation-delay: 1900ms !important; }

.anim-delay-1950 {
  animation-delay: 1950ms !important; }

.anim-delay-2000 {
  animation-delay: 2000ms !important; }

.anim-delay-2050 {
  animation-delay: 2050ms !important; }

.anim-delay-2100 {
  animation-delay: 2100ms !important; }

.anim-delay-2150 {
  animation-delay: 2150ms !important; }

.anim-delay-2200 {
  animation-delay: 2200ms !important; }

.anim-delay-2250 {
  animation-delay: 2250ms !important; }

.anim-delay-2300 {
  animation-delay: 2300ms !important; }

.anim-delay-2350 {
  animation-delay: 2350ms !important; }

.anim-delay-2400 {
  animation-delay: 2400ms !important; }

.anim-delay-2450 {
  animation-delay: 2450ms !important; }

.anim-delay-2500 {
  animation-delay: 2500ms !important; }

.anim-delay-2550 {
  animation-delay: 2550ms !important; }

.anim-delay-2600 {
  animation-delay: 2600ms !important; }

.anim-delay-2650 {
  animation-delay: 2650ms !important; }

.anim-delay-2700 {
  animation-delay: 2700ms !important; }

.anim-delay-2750 {
  animation-delay: 2750ms !important; }

.anim-delay-2800 {
  animation-delay: 2800ms !important; }

.anim-delay-2850 {
  animation-delay: 2850ms !important; }

.anim-delay-2900 {
  animation-delay: 2900ms !important; }

.anim-delay-2950 {
  animation-delay: 2950ms !important; }

.anim-delay-3000 {
  animation-delay: 3000ms !important; }

.anim-delay-3050 {
  animation-delay: 3050ms !important; }

.anim-delay-3100 {
  animation-delay: 3100ms !important; }

.anim-delay-3150 {
  animation-delay: 3150ms !important; }

.anim-delay-3200 {
  animation-delay: 3200ms !important; }

.anim-delay-3250 {
  animation-delay: 3250ms !important; }

.anim-delay-3300 {
  animation-delay: 3300ms !important; }

.anim-delay-3350 {
  animation-delay: 3350ms !important; }

.anim-delay-3400 {
  animation-delay: 3400ms !important; }

.anim-delay-3450 {
  animation-delay: 3450ms !important; }

.anim-delay-3500 {
  animation-delay: 3500ms !important; }

.anim-delay-3550 {
  animation-delay: 3550ms !important; }

.anim-delay-3600 {
  animation-delay: 3600ms !important; }

.anim-delay-3650 {
  animation-delay: 3650ms !important; }

.anim-delay-3700 {
  animation-delay: 3700ms !important; }

.anim-delay-3750 {
  animation-delay: 3750ms !important; }

.anim-delay-3800 {
  animation-delay: 3800ms !important; }

.anim-delay-3850 {
  animation-delay: 3850ms !important; }

.anim-delay-3900 {
  animation-delay: 3900ms !important; }

.anim-delay-3950 {
  animation-delay: 3950ms !important; }

.anim-delay-4000 {
  animation-delay: 4000ms !important; }

.anim-delay-4050 {
  animation-delay: 4050ms !important; }

.anim-delay-4100 {
  animation-delay: 4100ms !important; }

.anim-delay-4150 {
  animation-delay: 4150ms !important; }

.anim-delay-4200 {
  animation-delay: 4200ms !important; }

.anim-delay-4250 {
  animation-delay: 4250ms !important; }

.anim-delay-4300 {
  animation-delay: 4300ms !important; }

.anim-delay-4350 {
  animation-delay: 4350ms !important; }

.anim-delay-4400 {
  animation-delay: 4400ms !important; }

.anim-delay-4450 {
  animation-delay: 4450ms !important; }

.anim-delay-4500 {
  animation-delay: 4500ms !important; }

.anim-delay-4550 {
  animation-delay: 4550ms !important; }

.anim-delay-4600 {
  animation-delay: 4600ms !important; }

.anim-delay-4650 {
  animation-delay: 4650ms !important; }

.anim-delay-4700 {
  animation-delay: 4700ms !important; }

.anim-delay-4750 {
  animation-delay: 4750ms !important; }

.anim-delay-4800 {
  animation-delay: 4800ms !important; }

.anim-delay-4850 {
  animation-delay: 4850ms !important; }

.anim-delay-4900 {
  animation-delay: 4900ms !important; }

.anim-delay-4950 {
  animation-delay: 4950ms !important; }

.anim-delay-5000 {
  animation-delay: 5000ms !important; }

.anim-fly-up {
  animation-name: fly-up;
  animation-timing-function: cubic-bezier(0, 0.92, 0.205, 1.255);
  animation-duration: 350ms;
  animation-fill-mode: both;
  animation-delay: 0ms; }

.anim-fly-down {
  animation-name: fly-down;
  animation-timing-function: cubic-bezier(0, 0.92, 0.205, 1.255);
  animation-duration: 350ms;
  animation-fill-mode: both;
  animation-delay: 0ms; }
.project-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 15px 0;
  border-bottom: 1px solid #eee; }
  .project-section .name {
    margin-right: 20px; }
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  box-sizing: border-box; }

html {
  height: 100%; }

body {
  min-height: 100%;
  background-color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 300; }

#root {
  height: 100vh; }

#app {
  height: 100vh; }

h1 {
  font-size: 74px;
  line-height: 81px;
  font-weight: 700;
  color: #000; }

h2 {
  font-size: 36px;
  line-height: 47px;
  font-weight: 600;
  color: #000; }

h3 {
  font-size: 21px;
  line-height: 28px;
  font-weight: 500;
  color: #000; }

p {
  font-size: 17px;
  line-height: 23px;
  font-weight: 300;
  color: #999; }

.test-1 {
  background: #31B7D7;
  background: -webkit-linear-gradient(-90deg, #31B7D7, #EDAC7D);
  background: linear-gradient(180deg, #31B7D7, #EDAC7D); }

.test-2 {
  background: #E47D7D;
  background: -webkit-linear-gradient(left, #E47D7D 0%, #C195D3 50%, #4FB4E8 100%);
  background: linear-gradient(to right, #E47D7D 0%, #C195D3 50%, #4FB4E8 100%); }

.test-3 {
  background: #B58234;
  background: -webkit-linear-gradient(48deg, #B58234 0%, #D2B545 50%, #D7C04D 50.01%, #FFFFFF 100%);
  background: linear-gradient(42deg, #B58234 0%, #D2B545 50%, #D7C04D 50.01%, #FFFFFF 100%); }

body {
  background-color: #fff;
  font-size: 36px;
  font-weight: 700;
  padding: 50px; }