*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto,sans-serif;font-weight:300;font-style:normal}body{background-color:#f4f9fc}.htmlAndCss,.project,.btn-container,.about-main,.aboutTxt-wrapper,.projectBtn-container,.skills,.work-title,.skill,.overlay,.projects-wrapper>div,.hero-container{display:flex}.frontend-icons,.backend-icons,.leedsYouAround-icons,footer,header,.projects-container,.skills-grid-container,nav,header ul,.projects-wrapper{display:grid}body{margin:0;min-height:100vh;display:flex;flex-direction:column}html{font-size:62.5%}.no-scroll{overflow:hidden;height:100vh}.htmlAndCss{justify-content:space-between}.project{background-color:#ddd;flex-direction:column;align-items:center;box-shadow:0 10px 15px -3px #0000001a}.project>img{padding:5px;object-fit:cover;border-radius:10px}.frontend-icons,.backend-icons,.leedsYouAround-icons{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);background-color:#fff;flex-grow:2;width:80%;padding:20px}.frontend-icons>img,.backend-icons>img,.leedsYouAround-icons>img{max-width:50px;max-height:50px}.a:hover .overlay,.b:hover .overlay,.c:hover .overlay{opacity:1}.overlay{position:absolute;inset:0;height:250px;width:100%;opacity:0;transition:.5s ease;background-color:#f6f6f6;flex-direction:column;justify-content:space-between;align-items:center}.overlay p{margin-top:10px;font-weight:500;color:#0d77b1;font-size:2em}.btn-container{flex-direction:column;width:70%;gap:5px;margin-bottom:20px}.btn-container>button a{color:#fff;border:none;text-decoration:none}.btn-container>button{border:none;background-color:#0d77b1;color:#fff;padding:10px 30px;border-radius:5px}.a img,.b img,.c img{width:100%;height:250px;overflow:hidden}.a{grid-area:2/1 / span 1 / span 1;background-color:#fff;position:relative}.b{position:relative;background-color:#fff;grid-area:3/1 / span 1 / span 1}.c{grid-area:4/1 / span 1 / span 1;background-color:#fff;position:relative}.a img{width:100%;height:100%;overflow:hidden}footer{height:120px;grid-template-columns:1fr auto 1fr;grid-template-rows:repeat(2,1fr);background-color:#f4f9fc;color:#919795;font-size:1.2rem}footer>.trademark{grid-area:2/2 / span 1 / span 1}.footer-message{grid-area:1/2 / span 1 / span 1;align-self:center}footer>img{grid-area:1/1 / span 1 / span 1;max-height:70px}.footerImg{max-height:80px;grid-area:1/1 / span 1 / span 1;margin-left:30px}.aboutPage{background-color:#f7f8f9}.aboutPage,.contactPage,.homePage{min-height:100vh}.about-main{padding-top:150px}.about-main,.aboutTxt-wrapper{flex-direction:column;align-items:center}.aboutTxt-wrapper{font-size:13px;line-height:20px}.about-main>a{text-decoration:none;color:#0d77b1;font-size:1.2em;font-weight:400}.about-title{text-align:center;font-size:20px;margin-bottom:15px}.img-container>img{border-radius:5px;margin-bottom:50px}.aboutme-prof,.aboutme-pers{width:90%}.aboutme-prof p:last-child,.aboutme-pers p:last-child{margin-bottom:30px}.mailme-link{margin-bottom:50px}.projects-wrapper{margin:150px 0;width:90%;gap:50px}.projects-wrapper>img{height:100%;width:100%;border-radius:5px;object-fit:cover}.projects-wrapper>div{line-height:1.5;flex-direction:column;width:90%;gap:20px;margin:0 auto}.philsNewsFrontend-img{grid-area:1/1 / span 1 / span 1}.philsNewsBackend-img{grid-area:2/1 / span 1 / span 1}.LeedsYouAround-img{grid-area:3/1 / span 1 / span 1}.portfolio-img{grid-area:4/1 / span 1 / span 1}.philsNewsFrontend-txt{grid-area:1/2 / span 1 / span 1}.philsNewsBackend-txt{grid-area:2/2 / span 1 / span 1}.LeedsYouAround-txt{grid-area:3/2 / span 1 / span 1}.portfolio-txt{grid-area:4/2 / span 1 / span 1}.projectBtn-container{max-width:500px;justify-content:space-between}.project-title{font-size:1.2em;font-weight:300;height:auto}.projectBtn-container>a{width:200px;padding:10px;background-color:#0d77b1;border:none;color:#fff;border-radius:4px;font-size:1.1em;text-align:center;text-decoration:none}header{overflow:hidden;grid-template-rows:100px;grid-template-columns:100px repeat(2,auto);position:fixed;top:0;left:0;width:100%;-webkit-overflow-scrolling:touch;scroll-behavior:none;z-index:99}header img{max-width:120px;width:100%;align-self:center}header ul{list-style-type:none;grid-template-columns:repeat(4,1fr)}.headerOpen{background-color:#aadcec}.headerClose{background-color:#f4f9fc;height:100px}.hero-container{height:550px;justify-content:center;align-items:center;background-color:#f4f9fc}.home-image{height:300px}.home-aboutme{background-color:#f4f9fc;color:#0f1b61}.home-aboutme b,.home-aboutme h2{font-weight:700}.home-aboutme h2{font-size:38px;text-align:center}.home-aboutme p{padding:20px;font-size:16px;line-height:25px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.menu-toggle{display:none;display:inline;grid-column:2/3;grid-row:1/2;align-self:center;border:none;font-size:1.2rem;font-weight:700;letter-spacing:4px;background:transparent}.menu-toggle:before{content:"";display:inline-block;width:1px;height:26px;margin-right:26px;background:#919795;vertical-align:middle}.hire-me{display:inline;grid-column:3/4;grid-row:1/2;align-self:center;background:transparent;color:#fff;border:none;font-size:1.2rem;color:#0f1b61;font-weight:700;letter-spacing:4px}.open{display:block}nav{height:100vh;position:relative;grid-column:2 / span 1}nav ul{height:100%}.nav-links{position:absolute;top:100px;left:50%;transform:translate(-50%);z-index:99;background-color:#aadcec;width:95%;height:100vh}.nav-links>li{padding-bottom:35px;font-size:40px}.nav-links>li:first-letter{font-size:55px;color:#f6efef}.nav-links li a{text-decoration:none;color:#fff}.githubImg,.linkedinImg,.xImg,.emailImg{height:50px}.skills{padding:30px 0;background-color:#f4f9fc;justify-content:center;align-items:center;height:600px}.skill{height:auto;width:75px;flex-direction:column;justify-content:space-between;gap:30px}.skills-grid-container{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);margin:0 auto;gap:1.5em;height:auto}.skill>img{width:100%;flex-grow:1}.skill>p{align-self:center}.css{grid-area:1/2 / span 1 / span 1}.js{grid-area:1/3 / span 1 / span 1}.react{grid-area:2/1 / span 1 / span 1}.git{grid-area:2/2 / span 1 / span 1}.node{grid-area:2/3 / span 1 / span 1}.psql{grid-area:3/1 / span 1 / span 1}.jest{grid-area:3/2 / span 1 / span 1}.express{grid-area:3/3 / span 1 / span 1}.latestWork-wrapper{padding:50px;background-color:#f4f9fc}.projects-container{margin:50px auto;gap:30px}.work-title{grid-area:1/1 / span 1 / span 1;text-align:center;justify-content:center;align-items:center;font-size:1.5em}@media (min-width: 768px){.hero-container{padding-top:200px}.headerClose{height:150px}.headerClose>button{font-size:20px}.about-title{margin-bottom:30px}.aboutTxt-wrapper p{margin-bottom:50px}.home-aboutme p,.aboutme-prof>p,.aboutme-pers{font-size:30px;line-height:55px}.home-aboutme p{width:86%;margin:0 auto}.home-aboutme h2,.about-title{font-size:45px}.skills-grid-container{width:500px}.projects-container{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(100px,300px)}.work-title{grid-area:1/1 / span 1 / span 3;font-size:30px}.a,.b,.c{width:400px;margin:0 auto}.a{grid-area:2/1 / span 1 / span 1}.b{grid-area:2/2 / span 1 / span 1}.c{grid-area:3/1 / span 1 / span 1}.projects-wrapper{width:100%;grid-template-columns:repeat(2,1fr);height:100%;min-height:calc(100vh - 150px);margin:0 auto;padding-top:250px;background-color:#f4f9fc}.projects-wrapper>div{width:300px}.philsNewsFrontend-container{height:250px;width:250px}.img-container>img{width:600px}footer{height:150px}.footer-message{font-size:30px;text-align:center}footer .trademark{font-size:25px}}@media (min-width: 1280px){.home-aboutme p{width:70%}.projects-container{width:50%}footer .footer-message,footer .trademark{font-size:1em}.img-container img{width:300px}.aboutme-prof p,.aboutme-pers p{margin-bottom:30px}.projects-wrapper{width:1200px}}