body.selectionmenu{
    background-color: #161616;
}





body.gridbackground{
    background-color: #161616;
    height: 100vh; /* Full viewport height */
    background: url('backgroundphoto.jpg') no-repeat center center fixed;
    background-size: cover; /* Ensures the image covers the entire viewport */
    background-repeat: repeat; /* Prevent repeating */
    background-attachment: scroll; /* Background scrolls with the content */
}
body.gridbackground::before {
            content: '';
            position: fixed; /* Ensures it covers the viewport */
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5); /* Dark tint */
            z-index: -1; /* Places it below content */
        }

#backtomainsite{
    color: white;
    cursor: pointer;
    
}

ul {
    color: white;
    columns: 3 10px;       /* Split the list into two columns with a 10px gap */
    max-width: 500px;      /* Control the overall width of the list */
    margin: 0 auto;        /* Center the list horizontally */
    list-style-type: disc; /* Optional: ensures the default bullet points */
    padding-left: 0;       /* Optional: removes extra left padding */
    box-sizing: border-box;/* Ensures padding and margin don't interfere */
    margin-top: 10px;
}

h2 {
    color: white;
}



a {
    color: white;
    font-size: 20;
    
}

button {
    background: none;           /* Remove background */
    border: none;               /* Remove border */
}

p {
    text-align: center;
    color: white;
}

h1{
    color: white;
    text-align: center;
    font-size: 35pt;
    font-family: "DeaconFlock";
    
}

.bodybag {
    display: grid; /* Switch to grid layout */
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Flexible columns */
    gap: 5px; /* Space between grid items */
    /*padding: 5px; /* Add padding around the gallery */
    margin: auto; /* Center the gallery on the page */
    /*border: 5px outset blue; /* Optional border for styling */
}

.gallery {
    display: grid; /* Switch to grid layout */
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); /* Flexible columns */
    gap: 5px; /* Space between grid items */
    /*padding: 5px; /* Add padding around the gallery */
    margin: auto; /* Center the gallery on the page */
    /*border: 5px outset blue; /* Optional border for styling */
}

.collectionpic {
    transition: 0.15s;
    cursor: pointer; /* Make images look clickable */
}

.collectionpic:hover {
    transform: scale(1.04);
}

.collectionpic1 {
    transition: 0.15s;
    
}

.collectionpic1:hover {
    transform: scale(1.04);
}

.cover {
    width: 100%; /* Ensure the image fits within the grid item */
    height: 300px;/* Maintain a consistent height */
    object-fit: cover; /* Ensure the image scales properly */
}

.btn1 {
    background: none;
    margin: 0;
    padding: 0;
    cursor: pointer;
    color: white;
}

.btn2 {
    background:none;
    margin:0;
    padding:0;
    cursor: pointer;
    color: white;
}

.btn3 {
    background:none;
    margin:0;
    padding:0;
    cursor: pointer;
    color: white;
}

.btn4 {
    background:none;
    margin:0;
    padding:0;
    cursor: pointer;
    color: white;
}

.btn5 {
    background:none;
    margin:0;
    padding:0;
    cursor: pointer;
    color: white;
}

.btn6 {
    background:none;
    margin:0;
    padding:0;
    cursor: pointer;
    color:white;
}
}