html,body { background-color: hsl(48, 93%, 73%); color: hsl(48, 93%, 13%); } #title,#description { text-align: center; } #title { width: fit-content; margin: 1rem auto auto; padding: 1rem 5rem; } #main { background-color: hsl(228, 93%, 73%); max-width: 900px; margin: 4rem auto auto; padding: 1rem; border-radius: 1rem; border-color: hsl(48, 93%, 13%); border-style: solid; border-width: medium; } .form-div { display: flex; flex-wrap: wrap; margin: .5rem 0; } .form-label { flex: 1 1 200px; min-width: 200px; text-align: right; padding-right: 2rem; margin: 1rem 0; } .form-input { flex: 1 1 200px; min-width: 200px; margin: 1rem 0; } #submit { display: flex; margin: 2rem auto; } @media (max-width: 500px) { .form-div { margin: .25rem 1rem; } .form-label { text-align: left; margin: .25rem 1rem; } .form-input { margin: .25rem 1rem; } } .attachment-full { position: absolute; right: 0px; height: 149px; width: 149px; } .githubLabel { background-color: #00293C; border: none; width: 149px; height: 0px; position: absolute; right: 0px; margin-top: -10px; } @media (orientation: portrait) { .attachment-full { height: 99px; width: 99px; } .githubLabel { width: 99px; } } @media (orientation: landscape) and (max-height: 400px) { .attachment-full { height: 99px; width: 99px; } .githubLabel { width: 99px; } }