body {
    font-family: "Roboto", sans-serif;
  }

  .roboto-thin {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .roboto-light {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .roboto-regular {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .roboto-medium {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .roboto-bold {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .roboto-black {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .roboto-thin-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .roboto-light-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .roboto-regular-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .roboto-medium-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .roboto-bold-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .roboto-black-italic {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    font-style: italic;
  }
  
  #hello {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-size: 4rem;
    color: #fff;
    background-color: #001F3F;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
  }

  #about {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-size: 4rem;
    color: #fff;
    background-color: #3A6D8C;
  }

  #aboutmetext {
    font-size: 2rem;
    font-family: "Roboto", sans-serif;
  }

  #projects {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-size: 4rem;
    color: #fff;
    background-color: #6A9AB0;
  }

  #contact {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    color: #000;
    background-color: #EAD8B1;
    font-weight: 400;
    font-style: normal;
  }

  .centered-div {
      display: flex;
      justify-content: center; /* Aligns content horizontally */
      align-items: center;    /* Aligns content vertically */
      font-size: 1rem;
  }

  .contact-me-email {
    display: flex;
    justify-content: center; /* Aligns content horizontally */
    align-items: center;    /* Aligns content vertically */
    vertical-align: top;
    font-family: "Roboto", sans-serif;
    font-weight: 100;
    font-style: normal;
    font-size: .75rem;
  }

  .links-div {
      display: flex;
      justify-content: center;
      align-items: center;
  }

  .centered-div-links {
      display: flex;
      justify-content: center; /* Aligns content horizontally */
      align-items: center;    /* Aligns content vertically */
      font-size: 2rem;
      font-family: "Roboto", sans-serif;
      border: 1px solid #0000;
      
  }

  .button {
      background-color: #001F3F; /* Green background */
      color: white; /* White text */
      padding: 12px 24px; /* Some padding */
      font-size: 16px; /* Font size */
      border: none; /* Remove borders */
      border-radius: 25px; /* Fully rounded corners */
      cursor: pointer; /* Pointer/hand icon */
      border: 2px solid #001F3F;
      text-decoration: none;
  }

  .button:hover {
      background-color: #003a74; /* Darker green on hover */
      border: 2px solid #fa9200;
  }

  #typewriter {
    font-size: 24px;
    color: #fa9200;
  }

  .hover-image {
    opacity: 1;
    transition: opacity 0.5s ease;
  }

  .hover-image:hover {
    opacity: 0.25;
  }

  #descr {
    font-size: 1rem;
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    font-style: normal;
    max-width: 600px;
  }

  form {
      margin: 0 auto;
      padding: 10px 20px 20px 0px;
      font-size: 1rem;
      font-family: "Roboto", sans-serif;
      font-weight: 400;
      font-style: normal;
      max-width: 400px;
  }
  label {
      display: block;
      margin-bottom: 5px;
  }
  input[type="text"], input[type="email"], textarea {
      width: 100%;
      padding: 8px;
      margin-bottom: 10px;
      border: 1px solid #ccc;
      border-radius: 4px;
  }
  textarea {
      resize: vertical;
      height: 100px;
  }
  input[type="submit"] {
      padding: 10px 15px;
      background-color: #28a745;
      color: white;
      border: none;
      border-radius: 4px;
      cursor: pointer;
  }
  input[type="submit"]:hover {
      background-color: #218838;
  }

  .portrait {
    height: 125px;
    border: 1px solid #001F3F;
    border-radius: 25px;

  }