* { margin: 0; padding: 0; } body { /* Positioning */ display: flex; flex-direction: column; justify-content: center; align-items: center; /* Styling */ background-color: #bbedbe; } h1 { /* Positioning */ width: 80%; padding: 2vw; /* Font */ font-size: 8vw; text-align: center; } h3 { font-size: 4vw; } h5 { font-size: 2vw; } h1, h3, h5, p, input { color: #0e3610; } #form { /* Positioning */ width: 80%; display: flex; flex-direction: column; justify-content: center; align-items: center; } form { /* Form Shape */ width: 60%; padding: 2.5vw 5vw 2.5vw 5vw; /* Positioning */ display: flex; flex-direction: column; justify-content: center; align-items: center; } .row { /* Row Shape */ width: 100%; display: flex; } input { /* Input Shape */ width: 50%; padding: 1vw; margin: 1vw; border: none; border-radius: 18px; /* Styling */ background-color: #f1fbf2; /* Font */ font-size: 1vw; font-weight: 400; } button { /* Button Shape */ width: 60%; padding: 1vw; border: none; border-radius: 18px; /* Font */ color: white; font-size: 1vw; font-weight: 600; /* Transition for hover */ transition-duration: 500ms; background-color: #1c6b20; } button:hover { background-color: #26942D; } #confirmation { width: 60%; padding: 5vw 0 5vw 0; border-radius: 18px; background-color: #57d45f; display: flex; flex-direction: column; justify-content: center; align-items: center; }