body{

margin:0;

font-family:'Inter', Arial, sans-serif;

background:linear-gradient(#3e454a,#1f2427);

min-height:100vh;

display:flex;
justify-content:center;

}


/* container */

.container{

width:1000px;
max-width:95%;

margin-top:35px;
margin-bottom:40px;

background:#f6f3ee;

border-radius:14px;

box-shadow:0 20px 60px rgba(0,0,0,0.25);

display:flex;
flex-direction:column;

overflow:hidden;

}


/* header */

.header{

background-image:url("pixel-bg.svg");
background-repeat:repeat;
background-size:240px;

background-color:#d8cec3;

padding:20px 40px;

display:flex;
align-items:center;

}


/* logo */

.logo img{

height:70px;
display:block;

}


/* menu */

.menu{
background:linear-gradient(#2f9f9c,#228885);

display:flex;
justify-content:flex-end;

padding-right:20px;

border-bottom:1px solid rgba(0,0,0,0.15);
}


/* menu links */

.menu a{

color:white;
text-decoration:none;

font-size:16px;
font-weight:500;

padding:12px 22px;

display:flex;
align-items:center;

transition:background 0.2s;

}

.menu a:hover{
background:rgba(255,255,255,0.08);
}


/* welcome */

.welcome{

background:#f0e8de;

padding:24px 40px;

font-size:26px;
font-weight:600;

}


/* content */

.content{

flex:1;

padding:40px;

color:#333;

line-height:1.7;

}

.content h1{

margin-top:0;
font-size:28px;

}


.contactcard{
width:auto;
max-width:35%;
display:block;
margin-top:10px;
}


/* certification */

.certification{

text-align:center;

padding:10px 20px;

}

.cert-name{

font-size:18px;

margin-bottom:10px;

font-weight:600;

}

.cert-row{

display:flex;

justify-content:center;
align-items:center;

gap:20px;

}

.cert-logo img{

height:70px;

}

.cert-divider{

width:1px;
height:60px;

background:#999;

}

.cert-text{

text-align:left;

font-size:14px;

line-height:1.5;

}


/* bottom menu */

.bottommenu{

background:linear-gradient(#2f9f9c,#228885);

text-align:center;
padding:12px;

border-top:1px solid rgba(0,0,0,0.15);

}

.bottommenu a{

color:white;
text-decoration:none;

margin:0 10px;

}

.bottommenu a:hover{

text-decoration:underline;

}



/* ========================= */
/* RESPONSIVE (mobiel)      */
/* ========================= */

@media (max-width:900px){

.container{
margin:10px;
}

.header{
padding:15px 20px;
}

.logo img{
height:55px;
}

.menu{
flex-wrap:wrap;
justify-content:center;
padding-right:0;
}

.menu a{
padding:10px 14px;
font-size:14px;
}

.welcome{
font-size:22px;
padding:18px 20px;
}

.content{
padding:25px 20px;
}

.content h1{
font-size:22px;
}

.content img{
max-width:100%;
}

/* certificering blijft naast elkaar */

.cert-logo img{
height:55px;
}

.cert-row{
flex-direction:row;
}

.cert-divider{
display:block;
}

.cert-text{
text-align:left;
}

.bottommenu{
font-size:14px;
padding:10px;
}

}