body{ 
    font-family: 'Times New Roman', Times, serif;
    background-color: antiquewhite;
}

.menu{
    border: 0.1em solid black;
    padding: 0.5em;
    background-color: darksalmon ;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

nav a {
    display: block;
    margin-right: 4em;
    margin-left: 4em;
    color: black;
    font-size: larger;

}

a:hover{
    text-decoration: underline;
    color: rgb(229, 239, 45);
}

a{
    text-decoration-line: none;
    transition: all 250ms;
}

h1{
    font-family: monospace;
}


footer{
    border:2em solid antiquewhite
}

/*page 1 */ 

.page1 h1, .page1 h3{ 
    border: 0.25em;
    padding: 1em;
}

.page1 h1{
    font-size: 500%;
}
.page1 p {
     font-size: 150%;
     font-weight: 70;
}


.page1 article{
    border: 0.5em solid antiquewhite;
    padding:1.5em;
    display: flex;
    justify-content: left;

}

.img1{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50vw;
}
.imgjack{
    width: 21em;
}
.page1 div img{
     width: 10em;
} 

.page1 h2{
    display: flex;
    justify-content: center;
}

.page1 h1{
    display: flex;
    justify-content: center;
}

.page1 h3{
    font-size: 200%;
}


.page1 p{
    padding: 1em;
    font-size: larger;
}



/* html 2 */

.page2 img{
    
    margin-left: 10em;
    
}

.page2 h2, .page2 p, .page2 a{
    padding-left: 2em;
}

.page2 h1{
    font-size: 1000%;
}
.page2 ul{
    font-size: large;
}
ul a:hover{
    color: blue;
}

.page2 h2{  
    font-size: 200%;
}

.page2 a:hover{
    text-decoration-line: underline;
}

.page2 h3{
    padding: 2em;
    font-size: 200%;
}


/* html 3 */

.page3 h1{ 
    font-size: small;
    
}

.page3 h3{
    border: 0.25em solid black;
    display: flex;   
}

.page3 img{
    width: 15em;
    display: flex;
    justify-content: left;
}

.page3 a{
    text-decoration-line: none;
    transition: all 250ms;
}

.page3 a:hover{
    text-decoration-line: underline;
}
.page3 article a:hover{
    color: blue;
}

.page3 h1{
font-size: 500%;
display: flex;
justify-content: center;
}

.shop{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1em;
}

.groep1, .groep2, .groep3, .groep4, .groep5, .groep6, .groep7, .groep8, .groep9, .groep10{
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 0.25em solid black;
    background-color: white; 
}

/* html 4 */

.page4 h1{
    font-size: 550%;
    display: flex;
    justify-content: center;
}

.page4 img{
    width: 60em;
    height: 45em;  
}

.page4 p{
    width: 50em;
    font-size: larger;
}

.page4 h2{
    font-size: 250%;
    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}