body {
    background-color:black;
    text-align:center;
    font-family: macondo;
    letter-spacing:3px;
    max-width:100%;
    
}

h1 {
    color:white;
    text-align:center;
    margin-top:50px;
}

hr {
    margin-top:30px;
    width:50%;
    height:2px;
    background-color: rgb(76, 159, 226);
    border-color:rgb(76, 159, 226)
   
}

ul {
    color:white;
    font-size:22px;
    list-style:none;
    padding:25px;
    margin-top:-30px;
}

li {
    display:inline-block;
    padding:25px;   
}
li:hover{
  transform:scale(1.1);
  transition:0.3s ease-in-out;
  text-decoration:underline ;
    text-underline-offset: 15px;   /* space between text and underline */
}


a {
    text-decoration:none;
    color:rgb(127, 83, 143);
   
    
}

a:hover{
  color:green;


}


.image-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 equal columns */
  gap: 2px; /* spacing between images, adjust as needed */
  width: 80%; /* make grid fill more space */
  max-width: 700px; /* optional: cap grid width */
  margin: 25px auto; /* center grid and add top margin */
}

.image-grid img {
  width: 100%;   /* make each image fill its grid cell */
  height: 100%;  /* keeps all cells the same height */
  object-fit: cover; /* crops images evenly */
  border-radius: 5px; /* optional: rounded corners */
}
  
  .grid-item {
    aspect-ratio: 1 / 1; /* Maintain a 1:1 aspect ratio for perfect squares */
    overflow: hidden; /* Hide any overflow if images don't fit perfectly */
   
  }
  
  .grid-item img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* or "contain" */
  }

 

.textbox {
    display: block;
    margin: auto;
    width: min(700px, 90vw);
    max-width: 700%;
    height: auto;
    color: rgb(42, 35, 35);
    font-family: bellefair;
    font-size: clamp(14px, 1.5vw, 40px);
    text-align: left;
    letter-spacing: 1px;
    padding: 25px;
    overflow: auto;
    background: url("../images/VintagePaper.jpg");
    background-size: cover; /* or 'contain' or '100% 100%' */
    background-repeat: no-repeat;
    background-position: center;
    box-sizing: border-box;
}



.footermessage {
    color:white;
    /*position: static;
   left: 0;
   bottom: 0;
   width: 100%;*/

margin-top:80px;
   text-align: center;
}