@import"https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,200..800&display=swap";:root{--main-color-1: #ff873d;--main-color-2: #5271ff;--main-color-3: #8edf5f;--main-color-4: #995cd0}body{background-color:var(--main-color-1);width:100vw;height:100vh;overflow-x:hidden}.drop{box-shadow:4px 4px 0 8px #000}.outline{border:3px solid #000}p{font-family:noto sans,sans-serif;font-size:1.2em}nav{background:var(--Primary-Blue, #5271ff);border-bottom:#000 solid 4px;padding:20px;display:flex;justify-content:center;align-items:center}nav a{margin:0 20px;text-decoration:none;color:#fff;font-family:bricolage grotesque,sans-serif;font-size:1.2em}footer{background-color:#393939;display:flex;justify-content:center;align-items:center;color:#fff;font-family:Bricolage Grotesque,sans-serif;font-size:1em;padding:10px}@media only screen and (max-width: 600px){nav{position:absolute;z-index:2;width:100vw;height:auto;flex-direction:column;align-items:flex-start;gap:10px;display:none;padding:100px 0}nav.menu-open{display:flex}i.visible-menu{display:none}i.fa-xmark{color:#fff}nav a{text-decoration:none;padding:14px 16px;font-size:2em}nav a.active{text-decoration:underline}a.icon{color:#000;background:transparent;display:block;position:absolute;z-index:3;left:10px;top:10px;font-size:3em}}@media only screen and (min-width: 768px){nav{display:flex!important}a.icon{display:none}}body{padding:50px 80px;overflow:hidden}#catch_phrase{color:#fff;background-color:var(--main-color-4);display:flex;flex-direction:column;width:80%;padding:20px;align-items:flex-start;font-family:Bricolage Grotesque,sans-serif}#catch_phrase h1,#catch_phrase h2{margin:0;padding:0}#catch_phrase h1{font-size:5em;font-weight:600;line-height:1.2;text-transform:uppercase}#catch_phrase h2{font-size:4em;font-weight:300;line-height:1.4}#catch_phrase p{width:50%;font-size:1.5em;text-align:left}#home_photo{width:50%;height:70%;position:absolute;right:0;bottom:0;background-color:var(--main-color-3);background-image:url(../graphics/tile_cross.webp);background-repeat:repeat;overflow:hidden}#home_photo img{width:100%;height:100%;object-fit:contain;transform:translateY(10%)}#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:5%;bottom:2%}#projects svg{width:200px;height:200px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#projects svg:hover path{transform:rotate(360deg)}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:20%;bottom:2%}#contact svg{width:200px;height:200px}#about{position:absolute;bottom:10%;left:5%;width:200px;height:200px}#about svg{width:200px;height:200px}#about svg:hover{animation:horizontal-shaking .5s linear infinite}@keyframes horizontal-shaking{0%{transform:translate(0)}25%{transform:translate(5px)}50%{transform:translate(-5px)}75%{transform:translate(5px)}to{transform:translate(0)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}#contact svg:hover{animation:pulse 1s infinite ease-in-out}@media only screen and (max-width: 600px){body{padding:50px 0;overflow:hidden}#catch_phrase{margin:auto;padding:10px;color:#fff;background-color:var(--main-color-4);display:flex;flex-direction:column;width:80%;align-items:flex-start;font-family:Bricolage Grotesque,sans-serif}#catch_phrase h1,#catch_phrase h2{margin:0;padding:0}#catch_phrase h1{font-size:2.8em;font-weight:600;line-height:1.2;text-transform:uppercase}#catch_phrase h2{font-size:2em;font-weight:300;line-height:1.4}#catch_phrase p{width:100%;font-size:1.2em;text-align:left}#home_photo{width:60%;height:40%;position:absolute;right:0;bottom:0;background-color:var(--main-color-3);background-image:url(../graphics/tile_cross.webp);background-repeat:repeat;overflow:hidden}#home_photo img{object-fit:cover;position:absolute;bottom:0;overflow:visible}#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:5%;bottom:30%}#projects svg{width:180px;height:180px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#projects svg:hover path{transform:rotate(360deg)}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:50%;bottom:35%;overflow:hidden}#contact svg{width:180px;height:180px}}@media only screen and (min-width: 600px){#home_photo{width:60%;height:50%;position:absolute;right:0;bottom:0;background-color:var(--main-color-3);background-image:url(../graphics/tile_cross.webp);background-repeat:repeat;overflow:hidden}#home_photo img{object-fit:cover;overflow:visible}#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:5%;bottom:30%}#projects svg{width:220px;height:220px;transform:rotate(-10deg)}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:35%;bottom:40%;overflow:hidden}#contact svg{width:220px;height:220px}#about{position:absolute;bottom:10%;left:5%;width:200px;height:200px}#about svg{width:220px;height:220px}}@media only screen and (min-width: 768px){body{padding:50px 0;overflow:hidden}#catch_phrase{margin:auto;color:#fff;background-color:var(--main-color-4);display:flex;flex-direction:column;width:80%;padding:20px;align-items:flex-start;font-family:Bricolage Grotesque,sans-serif}#catch_phrase h1,#catch_phrase h2{margin:0;padding:0}#catch_phrase h1{font-size:5em;font-weight:600;line-height:1.2;text-transform:uppercase}#catch_phrase h2{font-size:4em;font-weight:300;line-height:1.4}#catch_phrase p{width:100%;font-size:1.5em;text-align:left}#home_photo{width:50%;height:45%;position:absolute;right:0;bottom:0;background-color:var(--main-color-3);background-image:url(../graphics/tile_cross.webp);background-repeat:repeat;overflow:hidden}#home_photo img{width:100%;height:100%;object-fit:contain;transform:translateY(10%)}#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:5%;bottom:30%}#projects svg{width:200px;height:200px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#projects svg:hover path{transform:rotate(360deg)}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:22%;bottom:15%}#contact svg{width:200px;height:200px}#about{position:absolute;bottom:3%;left:15%;width:200px;height:200px}#about svg{width:240px;height:240px}}@media only screen and (min-width: 992px){#catch_phrase p{width:50%;font-size:1.5em;text-align:left}#home_photo{width:50%;height:70%;position:absolute;right:0;bottom:0;background-color:var(--main-color-3);background-image:url(../graphics/tile_cross.webp);background-repeat:repeat;overflow:hidden}#home_photo img{width:100%;height:100%;object-fit:contain;transform:translateY(10%)}#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:5%;bottom:20%}#projects svg{width:240px;height:240px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:25%;bottom:15%}#contact svg{width:240px;height:240px}#about{position:absolute;bottom:5%;left:15%;width:200px;height:200px}#about svg{width:240px;height:240px}}@media only screen and (min-width: 1200px){#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:6%;bottom:4%}#projects svg{width:220px;height:220px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:25%;bottom:6%}#contact svg{width:220px;height:220px}}@media only screen and (min-width: 1440px){#projects{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:6%;bottom:5%}#projects svg{width:200px;height:200px;transform:rotate(-10deg)}#projects svg path{transform-origin:center;transition:transform 1s ease-in-out}#contact{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:20%;bottom:5%}#contact svg{width:200px;height:200px}#about{position:absolute;bottom:5%;left:35%;width:200px;height:200px}#about svg{width:240px;height:240px}}