body{
    background-image: linear-gradient(180deg, rgb(173, 198, 244, 1), rgb(150, 141, 211, 1));
    /* background-image: linear-gradient(180deg, rgba(224, 236, 251, 0.6), rgba(181, 196, 215, 0.6), rgba(134, 160, 192, 0.6), rgba(117, 145, 179, 0.8)); */
    /* font-size: 20px; */
    margin: 80px 60px 80px 60px;
    padding: 0px;
    color: white;
    font-family: 'JetBrains Mono', monospace;
}
 h1, h2, h3{
    font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    letter-spacing: .10em;
    font-weight: 400;
}
.inner{
    background-color: rgba(47, 56, 121, 0.4);
    border: 2px solid #B0A6DC;
    box-shadow: 0 0 5px rgba(255, 255, 255, 0.25), 
                0 0 10px rgba(255, 255, 255, 0.4 ), 
                0 0 15px rgba(255, 255, 255, 0.3);
    border-radius: 10px;
    padding: 50px 0px 50px 0px;
}
.header-shift{
    padding: 40px 0px 10px 150px;
}
.header-shift p{
    font-size: large;
    font-weight: lighter;
    color: #e9e7e7;
    width: 90%;
}

/*             PROJECT SECTION         */

.grid-container {
    display: grid;
    /* margin: 20px; */
    padding-left: 120px;
    grid-template-columns: repeat(1fr); /* Create two equal-width columns */
}

figure img {
    width: 90%;      
    height: auto;  
    object-fit: cover;
    display: block;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

a{
    text-decoration: none;
}
figcaption h2 {
    text-decoration: none;
    font-size: 24px;
    margin: 0;
    padding: 10px;
    color: white;
    text-align: center;
}

.filter-button {
    font-family: 'JetBrains Mono', monospace;
    width: 150px;
    height: 50px;
    border-radius: 50px;
    border: solid 1px rgb(189, 185, 185);
    background-color: rgba(210, 198, 238, 0.2);
    color: white;
}
.filter-button:hover {
    transform: translateY(-4px);
    transition: background-color 0.3s ease; 
    background-color: rgba(136, 129, 153, 0.4);
    border: solid 1px rgb(206, 190, 190);
    cursor: pointer; 
}
body.dark-mode .filter-button:hover {
    background-color: rgba(110, 105, 128, 0.3);
}