body {
    color: #222; /* text color */
    background: #fff; /* outer background */
    font-family:Garamond, 'Cormorant Garamond'  , serif; 
    padding: 2%;
    padding-top: 3%;
    padding-bottom: 5%;
    margin-left: 20%;
    margin-right: 20%;
    
  
}

h1, h2, h3, p {
    font-weight: 80;
    margin-bottom: 1em;
    
}

h1 {
    font-size: 250%;
    
}

h2 {
    font-size: 160%;
}

h3 {
    font-size: 150%;
}
p {
  font-size: 120%; 
}

.intro {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 1em;
}

.intro-photo {
  max-width: 230px;
  width: 100%;
  height: auto;
  flex-shrink: 0;
}

.intro-text p {
  margin-top: 0;
}

@media (max-width: 600px) {
  .intro {
    flex-direction: column;
    align-items: center;
    text-align: left;  
  }

  .intro-photo {
    max-width: 220px; 
    width: 70%;
  }

  .intro-text {
    width: 100%;
  }
}