@charset "UTF-8";
/* CSS Document */

/* Standard CSS Reset */
html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
    margin: 0;
    padding: 0;
}

body {
    background-color: #FFFFFF;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 100%;
    font-weight: 300;
    font-style: oblique;
    color: #000;
}

.style-name {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding: 8px;
    display: block;
    font-weight: 200;
    font-size: 250%;
    float: none;
}

.style-name a {
    text-decoration: none;
    color: #000;
}

.style-name a:hover {
    color: aqua;
}

.style-nav ul {
    list-style-type: none;
    text-align: center;
    padding-top: 0;
    padding-left: 1em;
    padding-right: 1em;
    margin-top: 0;
}

.style-nav ul li a {
    text-decoration: none;
    padding-right: 1em;
    padding-left: 1em;
    font-style: oblique;
    color: #000;
    display: block;
}

.style-nav ul li a:hover {
    color: aqua;
}

/* INDEX PAGE /////////////////////////////*/

/* FIXED: Removed 'p' selector to match your actual HTML structure */
.style-image a img {
    display: block;
    margin: auto;
    width: 75%;
    border: 3px solid #fff;
    padding: 1px;   
}

.style-image {
    padding-top: 20px;
}

/* FIXED: Corrected 'fr' to '1fr' and removed invalid row rule */
.scroll {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-gap: 0;
}

/* about_projects /////////////////////////////////////////*/

.wrapper-wil-hist {
    color: #666;
    border: 1px solid black;
    margin-left: 20px;
    margin-right: 2em;
    margin-top: 2em;
    margin-bottom: 2em;
    padding: 1em;
}

.wrapper-wil-hist img {
    float: left;
    margin-left: 0px;
    padding-bottom: 12px;
    padding-right: 12px;
    max-width: 100%;
    height: auto;
}

.wrapper-history {
    color: #666;
    border: 1px solid black;
    margin-left: 20px;
    margin-right: 2em;
    margin-top: 2em;
    margin-bottom: 2em;
    padding: 1em;
}

.wrapper-history img {
    float: left;
    margin-left: 0px;
    padding-bottom: 12px;
    padding-right: 12px;
    max-width: 100%;
    height: auto;
}

/* MEDIA QUERIES /////////////////////////////////////////*/

@media (min-width: 756px) {
    .scroll {
        display: grid;
        /* Note: auto-fit overrides the 7-column grid below. Kept as you designed, but standardizing syntax */
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        grid-gap: .5em;
    }
    
    .style-nav ul li {
        display: inline-block;
    }
    
    .style-nav ul li a {
        color: #666;
    }
    
    .style-name a {
        color: #666;
    }
    
    .box-2 {
        justify-content: center;
        display: grid;
        grid-gap: 20px;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
    }
        
    .image6 {
        display: table-cell;
    }
    
    /* Cleaned up hover states */
    .image1 a p:hover, .image2 a p:hover, .image3 a p:hover, 
    .image4 a p:hover, .image5 a p:hover, .image6 a p:hover, 
    .image7 a p:hover, .image8 a p:hover, .image9 a p:hover, 
    .image10 a p:hover {
        color: aqua;
    }
    
    /* ABOUT LUTHER */
    .style-about {
        margin: 20px;
        padding-right: 40px;
        border: 2px solid #888888;
    }
    
    .style-about-text {
        align-items: normal;
        padding-top: 0px;
        padding-right: 0px;
        padding-left: 0px;
        padding-bottom: 20px;
    }
    
    .style-about-text p { 
        margin-top: auto;
    }
    
    .style-lutherleica img {
        padding-top: 9px;
    }
    
    .style-more_info li { 
        margin: auto;
        width: 70%;
        padding-right: 2em;
        align-content: center;
    }
    
    .style-heading ul li {
        align-content: center;
    }
    
    .style-nav {
        padding-bottom: 1.5em;
    }
.style-purchase {
    text-align: center;       /* Centers all the text lines */
    list-style-type: none;    /* Removes any bullet points */
    padding-left: 0;          /* Removes default browser indentation on lists */
    margin: 40px auto;        /* Adds space above/below and keeps the block centered */
}
	
}