main{min-height:100vh}body{margin:0}.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"header header" "content content" "footer footer";min-height:100vh}header{grid-area:header;background-color:#0d47a1;color:#fff;display:flex;justify-content:space-between;padding:10px}.titleflex{display:flex;flex-direction:row}.maintitle{margin:6px;font-size:xx-large;color:#fff}.link-title{text-decoration:none}.navbar{display:flex;align-items:center}.navbar-item{font-size:x-large;color:#fff;text-decoration:none;padding:5px}.navbar-item{text-decoration:none;padding-bottom:5px;border-bottom:2px solid transparent;transition:border-color .3s ease;color:#fff}.navbar-item:hover{border-bottom-color:#007bff}.navbar-item.active{border-bottom-color:#007bff;font-weight:700}.language-dropdown{position:relative;display:inline-block;cursor:pointer}.language{font-weight:700;font-size:1rem;padding:5px 10px}.dropdown-content{display:none;position:absolute;background-color:#fff;min-width:30px;z-index:1;border-radius:4px;overflow:hidden}.dropdown-content a{color:#000;padding:8px 12px;text-decoration:none;display:block;font-weight:400}.dropdown-content a:hover{background-color:#007bff;color:#fff}.dropdown-content a.active{background-color:#007bff;color:#fff;font-weight:700}.portfolio-content{grid-area:content;background-color:#fff;color:#000;font-family:sans-serif}.homepage-image{width:300px;height:auto;border-radius:5px;object-position:50% 50%}.center-image-homepage{display:flex;justify-content:center;align-items:center}.homepage-center{display:flex;justify-items:center;justify-content:space-evenly;padding:80px 80px 30px}.homepage-subtext{font-size:xx-large;font-family:Helvetica Neue,Arial,Helvetica,sans-serif}.homepage-text{font-size:x-large;font-family:sans-serif}.homepage-name{font-size:xxx-large}.homepage-icons{width:30px;height:30px}.home-pages{display:flex;flex-direction:row;justify-content:space-evenly}.homepage-pages-container{max-width:300px;width:100%;background-color:#0d47a1;margin:20px;color:#fff;padding:10px;display:flex;justify-content:center;align-items:center;flex-direction:column;font-family:Helvetica Neue,Arial,Helvetica,sans-serif}.homepage-pages-container-title{display:flex;justify-content:center;align-items:center;font-size:x-large}.homepage-pages-container-button{display:inline-block;padding:.35em 1.2em;border:.1em solid #FFFFFF;margin:0 .3em .3em 0;border-radius:.12em;box-sizing:border-box;text-decoration:none;font-family:Roboto,sans-serif;font-weight:300;color:#fff;text-align:center;transition:all .2s}.homepage-pages-container-button-text:hover .homepage-icons,.homepage-pages-container-button:hover .homepage-icons{filter:brightness(0) saturate(100%) invert(0%)}.homepage-pages-container-button:hover .homepage-pages-container-button-text{color:#000}.homepage-pages-container-button:hover{background-color:#fff}.homepage-pages-container-button-text:hover{color:#000}.homepage-pages-container-button-text{color:#fff;text-decoration:none;display:flex;align-items:center;padding:9px;font-size:larger;font-family:sans-serif}div.projecten-images-homepage{width:80%;background-color:#fff;box-shadow:0 4px 8px #0003,0 6px 20px #00000030;margin-bottom:25px}.project-picture-homepage{width:100%}div.container-projecten-homepage{text-align:center;padding:10px 20px}.projecten-images-homepage:hover{opacity:.3}a.projecten-link{color:#000;font-size:larger;text-decoration:none}.projecten-homepage{display:flex;justify-content:space-evenly;flex-direction:row;margin-top:30px;margin-bottom:30px}.about-me-top-content{padding-left:10px;padding-top:20px;padding-right:60px;display:flex}.about-me-mid-content{padding-left:10px}.about-me-end-content{padding-bottom:30px;padding-left:10px}.about-me-sub-title{font-size:xx-large;margin:5px}.about-me-text{font-size:larger;font-family:Helvetica Neue,Arial,Helvetica,sans-serif;margin:10px}.about-me-picture{width:300px;height:auto;border-radius:7px}.skills-container{display:flex;flex-wrap:wrap;gap:15px;padding:10px}.skill-box{background-color:#0d47a1;border-radius:12px;padding:15px 25px;box-shadow:0 2px 6px #0000001a;font-weight:700;font-size:1rem;color:#fff;transition:transform .3s ease,background-color .3s ease}.about-me-button{background-color:#0d47a1;padding:10px;width:10%;display:flex;justify-content:center;align-items:center;flex-direction:row;text-decoration:none;border-radius:5px}.about-me-button-text{text-decoration:none;color:#fff}.about-me-button-icon{width:30px;height:30px}.about-me-button:hover{background-color:#007bff}.projects{display:flex;justify-content:center;align-items:center}.project-box{background-color:#0d47a1;width:20%;color:#fff;display:flex;justify-content:center;align-items:center;flex-direction:column;margin:30px;padding:15px;border-radius:20px}.project-box:hover{background-color:#007bff}.project-box-maintenance{background-color:#0d47a1;width:20%;color:#fff;display:flex;justify-content:center;align-items:center;flex-direction:column;margin:30px;padding:15px;border-radius:20px}.project-link{text-decoration:none;color:#fff}.project-text{display:flex;justify-content:center}.project-images{width:100%;height:auto}.project-maintenance{width:60%;height:auto;color:#fff}.project-box:not(.no-hover) .project-link{background-color:#0d47a1}.project-images-app{width:auto;height:180px}.popup{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.6);display:flex;justify-content:center;align-items:center}.popup.hidden{display:none}.popup-content{background:#007bff;color:#fff;padding:1rem;border-radius:8px;text-align:center}.popup-button{display:inline-block;padding:.35em 1.2em;border:.1em solid #FFFFFF;margin:0 .3em .3em 0;border-radius:.12em;box-sizing:border-box;text-decoration:none;font-family:Roboto,sans-serif;font-weight:300;color:#fff;text-align:center;transition:all .2s}.popup-button:hover{background-color:#fff;color:#000;cursor:pointer}.contact-container{display:flex;flex-wrap:wrap;gap:15px;padding:20px}.contact-box{background-color:#0d47a1;border-radius:12px;padding:15px 25px;font-weight:700;color:#fff;text-decoration:none}.contact-box:hover{background-color:#007bff}.contact-icon-github{width:40px;height:40px;margin-left:10px}.contact-icon-mail{width:40px;height:40px;margin-left:5px}.contact-icon-linkedin{width:40px;height:40px;margin-left:15px}.contact-icon-cv{width:40px;height:40px}.contact-text{font-weight:500;padding-left:7px}.contact{margin-top:40px;margin-bottom:20px}.scroll-top-button{padding:10px;background-color:#007bff;color:#fff;border-style:none;cursor:pointer;align-items:center;width:100%;font-size:100%;align-content:center}.scroll-top-button:hover{color:#000}footer{grid-area:footer;background-color:#0d47a1;color:#fff}.footer-portfolio{display:flex;justify-content:space-between;padding:10px}.footer-title{display:flex;justify-content:center;align-items:center}.footer-title-text{text-decoration:none;color:#fff}.footer-mid-content{display:flex;justify-content:end;flex-direction:column;align-items:center}.footer-nav{padding:10px}.footer-nav-item{color:#fff;text-decoration:none}.footer-nav-item:hover,.footer-nav-item.active{color:#007bff}.copyright{margin:0}.copyright-link{text-decoration:none;color:#fff}.footer-socials{display:flex;justify-content:center;align-items:center;padding:15px}.footer-git{width:30px}.hamburger{display:none;cursor:pointer;background:none}@media (max-width: 600px){.titleflex{display:none}.hamburger{display:block;z-index:1100}.navbar{max-height:0;overflow:hidden;display:none;flex-direction:column;background:#007bff;position:absolute;top:50px;left:0;width:100%;padding:10px;z-index:1000;transition:max-height 160s ease}.navbar.show{max-height:500px;transition:max-height 160s ease-in}.navbar-item.active{border-bottom-color:#fff;font-weight:700}.navbar.show{display:flex}.navbar a{padding:10px;color:#fff;text-decoration:none}.homepage-center{display:flex;flex-direction:column;padding-left:10px;padding-right:10px;padding-top:5px}.home-pages{display:flex;flex-direction:column}.homepage-pages-container{max-width:none;width:auto;margin:10px}.homepage-image{width:100%;height:auto}.homepage-sub-title{margin-left:5px}.projecten-homepage{display:flex;flex-direction:column;margin-bottom:0}div.projecten-images-homepage{width:auto;margin-bottom:0}.about-me-top-content{display:flex;flex-direction:column;padding-right:0;padding-left:0}.phone-about-me-picture{display:flex;justify-content:center;margin-bottom:10px;margin-left:10px;margin-right:10px}.about-me-picture{width:100%;height:auto;display:flex;justify-content:center;align-items:center}.about-me-mid-content{padding-left:0}.skill-box{width:100%;text-align:center}.about-me-end-content{padding-left:0}.about-me-button{width:auto;margin-right:10px;margin-left:10px}.projects{display:flex;flex-direction:column}.project-box{width:auto}.project-box-maintenance{width:80%}.contact-container{margin-top:1rem;margin-bottom:1rem}.contact-box{margin:1rem}.contact-icon{width:20px;height:20px}.contact-text{font-size:1rem;font-weight:500}.scroll-top-button:hover{color:#fff}.footer-portfolio{justify-content:center}.footer-title,.footer-socials{display:none}}