@charset "UTF-8";
html{font-size: 100%;}

/*HEADER*/

.logo {
  margin-top: 0;
  font-size: 3rem;
  color: #000000;
  font-family: "Alex Brush", cursive;
  font-weight: 400;
  font-style: normal;
}
li a{text-decoration: none;}
.main-nav {display: flex;
font-size: 1rem;
text-transform: uppercase;
margin-top: 34px;
list-style: none;}
.main-nav li{margin-left: 36px;}
.main-nav a{color: black;}
.main-nav a:hover{color: red;}
.page-header{display: flex;justify-content: space-between;}


.title {text-align: center;font-size: 23px;}

.title-p {text-align: center;line-height: 0.9;}
.image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px; 
}

.image-grid img {
  width: 100%;
  height: auto; 
  object-fit: cover; 
  display: block;
}

.image-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); 
  gap: 16px;  max-width: 800px;
  margin: 0 auto;
}

.grid-item {
  display: flex;
  flex-direction: column; 
  text-decoration: none;  
  color: #333;            
  text-align: center;     
}