body{
    background-color:#f3e5d8;
     display:flex;
     justify-content: center;
     align-content: center;
     margin-top: 5em;font-family: 'Outfit', sans-serif;
    
    
}
h1{
   font-family: 'Young Serif', serif;
    font-weight: 400;
}
.h{
    font-family: 'Young Serif', serif;
    color:hsl(14, 45%, 36%);
    font-weight: 400;
}
#whitebox{
   
background-color: white;
  border-radius: 1.5em;
  max-width: 40em;
  width: 100%;
  padding: 2em;
  box-shadow: 0 1em 2em rgba(0, 0, 0, 0.1);

}
img{
    border-radius: 18px;
    display:block;
    width:100%;
}
#pinkbox{
    background-color:  hsl(330, 100%, 98%);
    padding:.2em;
    border-radius: 18px;
    h3{
        color:hsl(332, 51%, 32%);
    }
}
table{
    width: 100%;
    border-collapse:collapse;
   margin-top: 1rem;
   td {
  padding: 12px 0;
  border-bottom: 1px solid #ddd;
}
td:last-child {
  font-weight: bold;
  color: #844d36; 
  }
}
.attribution{
 position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
    color:black;
  text-align: center;
  padding: 10px;
}
@media(max-width:375px){
    body{
         background-color:white;
         margin: 0;
         padding: 0;

    }
    #whitebox{
  background-color: white;
  border-radius: none;
  max-width: 100%;
  width: 100%;
  padding:0em;
  box-shadow:none;}
  #pinkbox{
    margin:2em;
  }

  img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius:0;
  
}

}