body {
    font-family: 'Playfair Display', sans-serif;
    background-color: #f0f0f0;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    color: #333;
}

.header {
    display: flex;
    height:80px;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #272626;
    color: #FAFAFA;
}

.header h3 {
    font-size: 25px;
}

.background {
    background-image: url(images/IMG_3364.jpeg);
    background-size:cover;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 900px;
}

.container {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-image: url(images/blocktest.webp);
    background-size: cover;
    width: 70vmin;
    height: 70vmin;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    box-sizing: border-box;
}

.coming-soon {
    position: absolute;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    bottom: -50px; /* Adjust as needed */
    left: 0;
    right: 0;
    background-color: transparent;/* Or any other color */
    padding: 10px;
    font-size: 70px;
    color: white;
}

.bottom {
    background-color: #272626;
    color: #FAFAFA;
    padding-top: 20px;
    padding-bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap:10px;

}

.bottom h2 {
    font-size: 25px;
}

.bottom p{
    font-family: 'Work Sans', sans-serif;
    width: 50%;
    text-align: center;
}

.email a {
    font-family: 'Work Sans', sans-serif;
    color:#FAFAFA;
}



h4 {
    font-size: 2em;
    margin: 0 0 20px;
    color: white;
}

p {
    font-size: 1em;
    margin: 0 0 20px;
}

button {
    background-color: #FAFAFA;
    color: #333;
    border: none; /* No border */
    padding: 12px 32px; /* Padding to make the button larger */
    text-align: center; /* Center the text */
    text-decoration: none; /* Remove underline */
    display: inline-block;
    font-size: 16px; /* Set the font size */
    margin: 4px 2px;
    cursor: pointer; /* Change mouse cursor when hovering over the button */

}



a {
    font-family: 'Playfair Display', sans-serif;
    text-decoration: none;
    color: #333;
}

/* When the viewport is 600px or less, make the font size smaller */
@media (max-width: 770px) {
    .coming-soon {
        position: absolute;
        bottom: -50px; /* Adjust as needed */
        left: 0;
        right: 0;
        background-color: transparent;/* Or any other color */
        padding: 10px;
        font-size: 60px;
        color: white;
    }
 }

 @media (max-width: 570px) {
    .coming-soon {
        position: absolute;
        bottom: -80px; /* Adjust as needed */
        left: 0;
        right: 0;
        background-color: transparent;/* Or any other color */
        padding: 10px;
        font-size: 60px;
        color: white;
    }


 }