body {
    background-color:white;
    font-family: arial;
    font-size: 100%;
    max-width: 1000px;
    margin: 70px auto 100px;
}

h1 {
    color: black;
    font-size: 200%;
}

h2 {
    color: black;
    font-size: 120%;
}

p  {
    color: black;
    font-size: 100%;
}

section {
    float:left;
    width:350px;
    padding:10px; 
}

/* for mobile */
@media (max-width: 768px) {
  /* Center the photo */
  body.container > div:first-of-type {
    float: none !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto 1rem auto !important;
  }

  body.container > div:first-of-type img {
    width: 160px;
    height: auto;
    margin-bottom: 0.5rem;
  }

  /* Center your name, which is in the next div */
  body.container > div:nth-of-type(2) h1 {
    text-align: center !important;
    width: 100%;
    margin: 0.5rem 0 1rem 0;
  }

  /* Keep the rest of your text left-aligned */
  body.container > div:nth-of-type(2) {
    text-align: left !important;
    width: 90%;
    margin: 0 auto;
  }
}