main {
    margin-top: 90px;
    padding: 20px;
    background-color: white;
}

.locatie {
    background-color: #FDFAF2;
    margin: 20px;
    padding: 60px;
    margin-top: 20px;
    display: flex;
    
    align-items: flex-start;
    gap:150px;
}

.map {
    width: 600px;
    height: 400px;
    border: none;
    margin-left: 100px;
}

.contactinfocontainer {
    max-width: 500px; /* Zorg ervoor dat de contactinformatie ruimte krijgt */
}

#contactlogo {
    width: 500px;
    height: auto;
}

#adrescontact {
    font-size: 1.4rem;
    font-family: 'BakerFont';
    margin-bottom: 30px;
}

#tfmail {
    font-size: 1.4rem;
    font-family: CrimFont1;
    margin-bottom: 30px;
}

/*open in maps button */
.openmaps {
    font-size: 1.3em;
    padding: 10px 20px;
    background-color:#FAD081; 
    color: black;
    border: none;
    border-radius: 1px; 
    cursor: pointer;
    transition: background-color 0.3s ease;
    font-family: Goldfont;
    margin-right: 20px;
}

.openmaps:hover {
    background-color: #C78B1B; 
}



/*contactform*/
.contactus {
   background-color: #FDFAF2;
   margin: 20px;
   padding: 80px;
}

.formpngcontainer {
    display: flex; 
    justify-content: space-between; 
    gap: 20px; 
    align-items: stretch;
}

.contactus h6 {
    margin-bottom: 20px;
    font-size: 60px;
    font-family:'BakerFont';
    font-weight: normal;
}

/* afbeelding */
.item-container .contact-form { 
    flex: 1;
}

.pizzacontact {
    max-width: 100%;
    max-height: 550px;
    object-fit: cover;
}

.item-container {
    flex: 1;
    text-align: left;
}

.contact-form {
    max-width: 500px;
    padding: 20px;
    background-color: #DFE2E7;
    font-family: 'BakerFont';
}

.contact-form label {
    display: block; /* Elke label op een nieuwe regel */
    margin-bottom: 8px;
    font-weight: normal;

}

.contact-form input, 
.contact-form textarea, 
.contact-form button {
    width: 100%; 
    padding: 10px;
    margin-bottom: 15px;
    font-size: 1rem;
    border: none;
}

.contact-form input:focus, 
.contact-form textarea:focus {
    outline: none;
    box-shadow: 0 0 4px rgba(102, 175, 233, 0.5);
}

.contact-form button {
    font-size: 1.3em;
    padding: 10px 20px;
    background-color:#FAD081; 
    color: black;
    border: none;
    border-radius: 1px; 
    cursor: pointer;
    transition: background-color 0.3s ease; 
    font-family: 'Goldfont';
    margin-right: 20px;
}

.contact-form button:hover {
    background-color: #C78B1B;
}

/*openingstijden stukje*/
.openingstijdenblok {
    display: flex; 
    gap: 200px; 
    
    background-color: #FDFAF2; 
    margin: 20px;
    
    justify-content: space-between;
    padding: 60px 200px;
    
}

.dagcontainer {
    display: flex; 
    gap: 40px; 
    margin-top: 30px;
}

.Opendagen2, .Opentijden2 {
    list-style: none; 
    margin: 0; 
    padding: 0; 
    flex: 1;
    font-family: 'BakerFont'; 
    font-size: 1.6em; 

}

.Opendagen2 li, .Opentijden2 li {
    padding: 5px 0; 
    display: flex; 
    white-space: nowrap;
}

.Opendagen2 {
    text-align: left; 
}

.Opentijden2 {
    text-align: right; 
}

.openingstijden h2, .uitzonderingen h2 {
    margin-bottom: 15px; 
    font-size: 2.0em; 
    font-family: 'GoldFont';
    font-weight: normal;
    text-decoration: underline;
    text-underline-offset: 0.5em;

}

.uitzonderingen {
    max-width: 400px;
}