body {
  Background-color: powderblue;
}

.nav {
  Overflow: hidden;
  Background-color: #FBF9F6;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.nav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 14px 20px;
  text-decoration: none;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.writing {
  Background-color: white;
  Color: black;
  Padding: 25px;
  Margin: 3%;
  Text-decoration: none;
  Border-radius: 5px;
  Display: flex;
  Align-items: center;
  Gap: 20px;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.what-is {
  Background-color: white;
  Color: black;
  Padding: 25px;
  Margin: 40px 15%;
  Text-decoration: none;
  Border-radius: 5px;
  Display: flex;
  Align-items: center;
  Gap: 20px;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.bottom-part {
  Background-color: white;
  Color: black;
  Margin: 40px 15%;
  Padding: 25px;
  Border-radius: 5px;
  font-family: "Courier New", Courier, Monaco, monospace;
}
  
.words, .image {
  Flex: 1;
}

img {
  max-width: 100%;
}

button {
  Display: inline-block;
  Flex-shrink: 0;
  Min-width: 100px;
  Text-align: center;
  border-radius: 5px;
  width: 100px;
  font-family: "Courier New", Courier, Monaco, monospace;
  -webkit-appearance: none;
  appearance: none;
  color: black !important; 
}

.form {
  Background-color: white;
  Color: black;
  Padding: 25px;
  Margin: 40px 15%;
  Font-size: 30px;
  Text-align: center;
  Border-radius: 5px;
  Display: flex;
  Flex-direction: column;
  Gap: 10px;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.answer {
  Background-color: white;
  Color: black;
  Margin: 40px 15%;
  Padding: 25px;
  Border-radius: 5px;
  Text-align: center;
  font-family: "Courier New", Courier, Monaco, monospace;
}

.link {
  Background-color: powderblue;
  Color: inherit;
  Text-decoration: none;
  Border-radius: 5px;
  Padding: 10px;
  font-family: "Courier New", Courier, Monaco, monospace;
}
  

.input-wrapper {
  Display: flex;
  Justify-content: center;
  Align-items: flex-start;
  Gap: 15px;
  font-family: "Courier New", Courier, Monaco, monospace;
}

input {
  Border: 2px solid black;
  border-radius: 5px;
  Width: 20%;
  Padding: 5px 5px;
  Font-size: 15px;
  font-family: "Courier New", Courier, Monaco, monospace;
}

button {
  Border: 2px solid black;
  border-radius: 5px;
  Width: 10%;
  Padding: 5px 5px;
  Font-size: 15px;
  font-family: "Courier New", Courier, Monaco, monospace;
}
  
.footer {
  Background-color: black;
  Color: white;
  Text-align: center;
  Padding: 75px;
  Text-decoration: none;
  font-family: "Courier New", Courier, Monaco, monospace;
}
 
@media (max-width: 600px) {
  p {
    font-size: 14px;
  }
  h1 {
    font-size: 24px;
  }
  
  .writing, .bottom-part, .what-is {
    flex-direction: column;
    text-align: center;
  }
  
  .writing, .bottom-part, .what-is, .form, .answer {
    Margin: 2%;
  }
}
