* {
    font-family: Poppins, Arial, Helvetica;
    color: #000;
 }
 
 body {
     background-color: lightcyan;
     margin-left: 0;
     margin-right: 0;
 }
 
 #wrapper {
     display: block;
     width: 620px;
     margin: auto;
 }
 
 h1 {
     text-align: center;
     font-family: 'myPapyrus', papyrus, Texturina, Georgia;
     font-style: bold;
     font-size: 300%;
 }
 
 .zia-background {
     width: 600px;
     height: 400px;
     margin: auto;
     background-color: #FFD700;
     border: 2px solid black;
     position: relative;
 }
 
 #zia-color {
    position: absolute; 
    top: 23%;
    left: 32.5%;
 }
 
 #ColorButton, #SwapColorsButton {
     width: 500px;
     height: 75px;
     font-size: 145%;
     font-weight: bold;
     background-color: mediumturquoise;
     border: 2px solid #000;
     border-radius: 10px;
     margin-left: auto;
     margin-right: auto;
     margin-top: 20px;
 }
 
 #ColorButton:active, #SwapColorsButton:active {
     background-color: orange;
 }
 
 #selections {
     text-align: center;
     margin-top: 45px;
     width: 100%;
 }
 
 #selections input {
     position: relative;
     top: 15px;
     width: 50px;
     height: 50px;
     margin-right: 5px;
     border-radius: 5px;
 }
 
 
 #selections label {
     font-size: 120%;
     margin-right: 10px;
     margin-left: 10px;
 }
 
 #colors-div {
     width: 540px;
     margin-bottom: 20px;
     margin-left: auto;
     margin-right:auto;
     display: flex;
     flex-direction: row;
     justify-content: space-between;
 }
 
 footer {
     font-size: small;
     margin-top: 40px;
     margin-bottom: 25px;
     text-align: center;
 }
 
 @media screen and (max-width: 718px) {
     .zia-background {
         transform: scale(0.9);
     }
 
     h1 {
         font-size: 350%;
         margin-bottom: 5px;
     }
 }
 
 @media screen and (max-width: 600px) {
     #SwapColorsButton, #ColorButton {
         height: 90px;
         font-size: 200%;
     }
 
     #selections label {
         font-size: 200%;
     }
 
     #selections input {
         width: 75px;
         height: 75px;
     }
 
     #colors-div {
         flex-direction: column;
     }
 
     #background-color {
         margin-bottom: 30px;
     }
 
     footer {
         margin-top: 80px;
         font-size: medium;
     }
 }
 
 @font-face {
     font-family: 'myPapyrus';
     src: url('papyrus.ttf')  format('truetype'); /* Safari, Android, iOS */
 }
