:root{--text:white;--bg:black;--footer:--bg;--red:#d93526;--blue:#19c3e6;--blue-darker:#0d93f2;--gray:#b8b8b8;--bg-challenger:white;--text-challenger:black;--primary:#4c2470;--primary-light:#a454f0}html{box-sizing:border-box}*,:before,:after{box-sizing:inherit}html{font-size:.625em}.soc{display:block;font-size:0;list-style:none;margin:0;text-align:center}.soc li{display:inline-block;margin:12px;margin:1.2rem}.soc a,.soc svg{display:block}.soc a{position:relative;height:4.5rem;width:4.5rem}.soc svg{height:100%;width:100%}.soc em{font-size:14px;line-height:1.5;margin-top:-.75em;position:absolute;text-align:center;top:50%;right:0;bottom:0;left:0}.icon-social{transition:-webkit-transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.icon-social:hover{border-radius:100%;color:#0e1a25;fill:#0e1a25;-webkit-transform:scale(1.25);transform:scale(1.25);transition:background .5s,-webkit-transform .5s ease-out;transition:background .5s,transform .5s ease-out;transition:background .5s,transform .5s ease-out,-webkit-transform .5s ease-out}.icon-social.github,.icon-social.email{color:var(--gray);fill:var(--gray)}.icon-social.github:hover,.icon-social.email:hover{background:var(--red);color:white;fill:white}.icon-social.linkedin{color:var(--gray);fill:var(--gray)}.icon-social.linkedin:hover{background:var(--blue-darker);color:white;fill:white}.icon-1:hover,.icon-2:hover,.icon-3:hover,.icon-4:hover,.icon-5:hover,.icon-6:hover,.icon-7:hover,.icon-8:hover,.icon-9:hover,.icon-10:hover,.icon-11:hover,.icon-12:hover,.icon-13:hover,.icon-14:hover,.icon-15:hover,.icon-16:hover,.icon-17:hover,.icon-18:hover,.icon-19:hover,.icon-20:hover,.icon-21:hover,.icon-22:hover,.icon-23:hover,.icon-24:hover,.icon-25:hover,.icon-26:hover,.icon-27:hover,.icon-28:hover,.icon-29:hover,.icon-30:hover{border-radius:100%;color:#0e1a25;fill:#0e1a25;-webkit-transform:scale(1.25);transform:scale(1.25);transition:background-color .5s,-webkit-transform .5s ease-out;transition:background-color .5s,transform .5s ease-out;transition:background-color .5s,transform .5s ease-out,-webkit-transform .5s ease-out}.icon-1{color:#d94a26;fill:#d94a26}.icon-1:hover{background:#d94a26}.icon-2{color:#d94a26;fill:#d94a26}.icon-2:hover{background:#d96e26}.icon-3{color:#d94a26;fill:#d94a26}.icon-3:hover{background:#d99126}.icon-4{color:#d94a26;fill:#d94a26}.icon-4:hover{background:#d9b526}.icon-5{color:#d94a26;fill:#d94a26}.icon-5:hover{background:#d9d926}.icon-6{color:#d94a26;fill:#d94a26}.icon-6:hover{background:#b5d926}.icon-7{color:#d94a26;fill:#d94a26}.icon-7:hover{background:#91d926}.icon-8{color:#d94a26;fill:#d94a26}.icon-8:hover{background:#6ed926}.icon-9{color:#d94a26;fill:#d94a26}.icon-9:hover{background:#4ad926}.icon-10{color:#d94a26;fill:#d94a26}.icon-10:hover{background:#26d926}.icon-11{color:#d94a26;fill:#d94a26}.icon-11:hover{background:#26d94a}.icon-12{color:#d94a26;fill:#d94a26}.icon-12:hover{background:#26d96e}.icon-13{color:#d94a26;fill:#d94a26}.icon-13:hover{background:#26d991}.icon-14{color:#d94a26;fill:#d94a26}.icon-14:hover{background:#26d9b5}.icon-15{color:#d94a26;fill:#d94a26}.icon-15:hover{background:#26d9d9}.icon-16{color:#d94a26;fill:#d94a26}.icon-16:hover{background:#26b5d9}.icon-17{color:#d94a26;fill:#d94a26}.icon-17:hover{background:#2691d9}.icon-18{color:#d94a26;fill:#d94a26}.icon-18:hover{background:#266ed9}.icon-19{color:#d94a26;fill:#d94a26}.icon-19:hover{background:#264ad9}.icon-20{color:#d94a26;fill:#d94a26}.icon-20:hover{background:#2626d9}.icon-21{color:#d94a26;fill:#d94a26}.icon-21:hover{background:#4a26d9}.icon-22{color:#d94a26;fill:#d94a26}.icon-22:hover{background:#6e26d9}.icon-23{color:#d94a26;fill:#d94a26}.icon-23:hover{background:#9126d9}.icon-24{color:#d94a26;fill:#d94a26}.icon-24:hover{background:#b526d9}.icon-25{color:#d94a26;fill:#d94a26}.icon-25:hover{background:#d926d9}.icon-26{color:#d94a26;fill:#d94a26}.icon-26:hover{background:#d926b5}.icon-27{color:#d94a26;fill:#d94a26}.icon-27:hover{background:#d92691}.icon-28{color:#d94a26;fill:#d94a26}.icon-28:hover{background:#d9266e}.icon-29{color:#d94a26;fill:#d94a26}.icon-29:hover{background:#d9264a}.icon-30{color:#d94a26;fill:#d94a26}.icon-30:hover{background:#d92626}:root{--text:white;--bg:black;--footer:--bg;--red:#d93526;--blue:#19c3e6;--blue-darker:#0d93f2;--gray:#b8b8b8;--bg-challenger:white;--text-challenger:black;--primary:#4c2470;--primary-light:#a454f0}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Roboto}.wrapper{background:var(--bg);min-height:100%;min-width:100%;width:100%;display:grid;grid-template-columns:repeat(4,1fr);position:relative}header{grid-column:1 / 5;grid-row:1 / 2;align-self:start;text-align:center}header h1,header h2{margin-top:20px}@media screen and (max-width:760px){header{padding:20px}}nav{grid-column:1 / 5;grid-row:2 / 3;justify-self:center;align-self:center;text-align:center}nav a:not(:last-child){margin-right:20px}nav a{font-size:16px;text-decoration:none;color:var(--blue);display:inline-block}nav a:after{content:'';display:block;width:0;height:2px;background:var(--blue-darker);transition:width 1s}nav a:hover{color:var(--blue-darker);transition:color 1s}nav a.active:after{width:100%}@media(pointer:fine){nav a:hover:after{width:100%}}main{grid-column:2 / 4;grid-row:3 / 4;justify-self:center;align-self:center;color:var(--text);font-size:16px;line-height:1.7em}main ul{padding:0}main small{color:rgba(206,206,206,.97)}main #projects li{list-style:none;margin-bottom:15px}main #projects a:not(:last-child){margin-right:20px}main #projects a{font-size:16px;text-decoration:none;color:var(--blue);display:inline-block}main #projects a:after{content:'';display:block;width:0;height:2px;background:var(--blue-darker);transition:width 1s}main #projects a:hover{color:var(--blue-darker);transition:color 1s}main #projects a.active:after{width:100%}@media(pointer:fine){main #projects a:hover:after{width:100%}}@media screen and (max-width:760px){main{grid-column:1 / 5;padding:20px}}footer{grid-column:1 / 5;grid-row:4 / 5;color:var(--text);align-self:center;justify-self:center;z-index:1}footer ul{padding:0}.hide{display:none}h1,h2{font-family:Montserrat,sans-serif;text-transform:uppercase;margin:0}h1{color:#c4c4c4;font-size:48px;text-align:center}h2{color:#7c7c7c;font-family:Montserrat,sans-serif;font-size:28px}