From 44d2c5a036864287c9a69510f75a7a5b2770f7bc Mon Sep 17 00:00:00 2001 From: Brittany Chiang Date: Mon, 25 Dec 2017 20:32:17 -0500 Subject: [PATCH] update transitions --- _data/skills.yml | 3 ++- _includes/employment-status.html | 4 ++-- _scss/partials/_base.scss | 28 ++++++++++++++-------------- _scss/partials/_globals.scss | 4 ++++ _scss/partials/_intro.scss | 2 +- _scss/partials/_switch.scss | 2 +- css/main.css | 2 +- 7 files changed, 25 insertions(+), 20 deletions(-) diff --git a/_data/skills.yml b/_data/skills.yml index 4e9a7e7..2da2b93 100644 --- a/_data/skills.yml +++ b/_data/skills.yml @@ -1,5 +1,6 @@ languages: - item: JavaScript (ES6) + - item: TypeScript - item: HTML - item: CSS/Sass - item: Python @@ -7,7 +8,7 @@ languages: - item: SQL frameworks: - - item: Ember + - item: Ember / Glimmer - item: Jekyll - item: Backbone - item: D3 diff --git a/_includes/employment-status.html b/_includes/employment-status.html index 1b18189..d586866 100644 --- a/_includes/employment-status.html +++ b/_includes/employment-status.html @@ -1,7 +1,7 @@ -
+
Currently seeking full-time opportunities!
-
+ diff --git a/_scss/partials/_base.scss b/_scss/partials/_base.scss index 63dde3d..a32726c 100644 --- a/_scss/partials/_base.scss +++ b/_scss/partials/_base.scss @@ -19,10 +19,10 @@ html, body { line-height: 1.5; a { + @include transition; text-decoration: none; font-weight: 700; color: $black; - transition: all 0.25s ease-in-out; } ul { @@ -141,24 +141,26 @@ html, body { transition: height 0.3s, opacity 0.3s, transform 0.3s; transform: translateY(-5px); } - &:hover:after, - &:focus:after { - height: 2px; - border-radius: 3px; - opacity: 1; - transform: translateY(-2px); + &:hover, &:focus { + &:after { + height: 2px; + border-radius: 3px; + opacity: 1; + transform: translateY(-2px); + } } } } } .arrow-link { + @include transition; font-weight: 700; display: inline-block; - transition: all 0.15s ease-in-out; background-color: transparent; white-space: nowrap; &:after { + @include transition; position: relative; bottom: 2px; margin-left: 15px; @@ -169,7 +171,6 @@ html, body { height: 15px; display: inline-block; vertical-align: middle; - -webkit-transition: all .15s ease-in-out; } &:hover:after { transform: translateX(7px); @@ -187,6 +188,7 @@ html, body { } #top-button { + @include transition; background: transparent; border: none; outline: none; @@ -195,7 +197,6 @@ html, body { bottom: 25px; right: 10px; cursor: pointer; - transition: all 0.25s ease; display: none; @include desktop { bottom: 20px; @@ -214,14 +215,13 @@ html, body { width: 100%; } } - } .waypoint { - opacity: 0; - transform: translate3d(0,20px,0); - transition: opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1); + opacity: 0; + transform: translate3d(0,20px,0); + transition: opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1); } .in-view { diff --git a/_scss/partials/_globals.scss b/_scss/partials/_globals.scss index e423463..5904c93 100644 --- a/_scss/partials/_globals.scss +++ b/_scss/partials/_globals.scss @@ -29,6 +29,10 @@ $mobile-width: 480px; $small-mobile-width: 360px; $tiny-mobile-width: 330px; +@mixin transition { + transition: all 0.2s ease-in-out; +} + @mixin thirteen { @media screen and (max-width: #{$thirteen-inch}) { @content; diff --git a/_scss/partials/_intro.scss b/_scss/partials/_intro.scss index 9c43805..49a8dcb 100644 --- a/_scss/partials/_intro.scss +++ b/_scss/partials/_intro.scss @@ -120,11 +120,11 @@ } } .highlight-link { + @include transition; font-weight: 400; text-decoration: none; display: inline-block; padding: 2px 3px; - transition: all .2s ease-in-out; text-decoration: none; box-shadow: inset 0 -3px 0 $blue; &:hover { diff --git a/_scss/partials/_switch.scss b/_scss/partials/_switch.scss index 364e9a8..abb1a35 100644 --- a/_scss/partials/_switch.scss +++ b/_scss/partials/_switch.scss @@ -47,6 +47,7 @@ border-radius: 100px; position: relative; &:after { + @include transition; content: ''; position: absolute; top: 3px; @@ -55,7 +56,6 @@ height: 19px; background: #fff; border-radius: 100%; - transition: 0.25s; } } } diff --git a/css/main.css b/css/main.css index d4c3788..b8c68cc 100755 --- a/css/main.css +++ b/css/main.css @@ -1 +1 @@ -@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Light.eot);src:url(../fonts/apercu/Apercu-Light.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Light.woff2) format("woff2"),url(../fonts/apercu/Apercu-Light.woff) format("woff"),url(../fonts/apercu/Apercu-Light.ttf) format("truetype"),url(../fonts/apercu/Apercu-Light.svg#Apercu-Light) format("svg");font-weight:300;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-LightItalic.eot);src:url(../fonts/apercu/Apercu-LightItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-LightItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-LightItalic.woff) format("woff"),url(../fonts/apercu/Apercu-LightItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-LightItalic.svg#Apercu-LightItalic) format("svg");font-weight:300;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Regular.eot);src:url(../fonts/apercu/Apercu-Regular.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Regular.woff2) format("woff2"),url(../fonts/apercu/Apercu-Regular.woff) format("woff"),url(../fonts/apercu/Apercu-Regular.ttf) format("truetype"),url(../fonts/apercu/Apercu-Regular.svg#Apercu-Regular) format("svg");font-weight:400;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Italic.eot);src:url(../fonts/apercu/Apercu-Italic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Italic.woff2) format("woff2"),url(../fonts/apercu/Apercu-Italic.woff) format("woff"),url(../fonts/apercu/Apercu-Italic.ttf) format("truetype"),url(../fonts/apercu/Apercu-Italic.svg#Apercu-Italic) format("svg");font-weight:400;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Medium.eot);src:url(../fonts/apercu/Apercu-Medium.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Medium.woff2) format("woff2"),url(../fonts/apercu/Apercu-Medium.woff) format("woff"),url(../fonts/apercu/Apercu-Medium.ttf) format("truetype"),url(../fonts/apercu/Apercu-Medium.svg#Apercu-Medium) format("svg");font-weight:500;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-MediumItalic.eot);src:url(../fonts/apercu/Apercu-MediumItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-MediumItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-MediumItalic.woff) format("woff"),url(../fonts/apercu/Apercu-MediumItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-MediumItalic.svg#Apercu-MediumItalic) format("svg");font-weight:500;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Bold.eot);src:url(../fonts/apercu/Apercu-Bold.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Bold.woff2) format("woff2"),url(../fonts/apercu/Apercu-Bold.woff) format("woff"),url(../fonts/apercu/Apercu-Bold.ttf) format("truetype"),url(../fonts/apercu/Apercu-Bold.svg#Apercu-Bold) format("svg");font-weight:700;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-BoldItalic.eot);src:url(../fonts/apercu/Apercu-BoldItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-BoldItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-BoldItalic.woff) format("woff"),url(../fonts/apercu/Apercu-BoldItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-BoldItalic.svg#Apercu-BoldItalic) format("svg");font-weight:700;font-style:italic}*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-moz-selection{background:#fff10d}::selection{background:#fff10d}body,html{margin:0;padding:0;background-color:#fff;color:#444452;font-family:Apercu,Source Sans Pro,Helvetica,Arial,sans-serif;line-height:1.5}body a,html a{text-decoration:none;font-weight:700;color:#36363c;-webkit-transition:all .25s ease-in-out;transition:all .25s ease-in-out}body ul,html ul{list-style:none;padding:0}body strong,html strong{font-weight:700;color:#36363c}body.night,html.night{background-color:#131417;color:#afafbf}body.night ::-moz-selection,html.night ::-moz-selection{color:#36363c;background:#fff10d}body.night ::selection,html.night ::selection{color:#36363c;background:#fff10d}body.night .switch-wrapper .sun,html.night .switch-wrapper .sun{background:url(../img/switch/sun-white.svg) no-repeat center;background-size:100%}body.night .switch-wrapper .moon,html.night .switch-wrapper .moon{background:url(../img/switch/moon-white.svg) no-repeat center;background-size:100%}body.night .experience .job__time,body.night .footer__copyright,body.night .intro,body.night .skills .skillz__category__label,body.night .status,body.night a,body.night strong,html.night .experience .job__time,html.night .footer__copyright,html.night .intro,html.night .skills .skillz__category__label,html.night .status,html.night a,html.night strong{color:#e7e7e7}body.night .section__content .underline-link:after,html.night .section__content .underline-link:after{background:#e7e7e7}body .emoji,html .emoji{display:inline-block;vertical-align:text-top;background-size:contain;background-repeat:no-repeat;background-position:center}body .section,html .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:100px 170px}@media screen and (max-width:1280px){body .section,html .section{padding:100px}}@media screen and (max-width:1024px){body .section,html .section{padding:50px}}@media screen and (max-width:768px){body .section,html .section{display:block}}@media screen and (max-width:480px){body .section,html .section{padding:50px 35px}}body .section__title,html .section__title{-ms-flex-negative:0;flex-shrink:0;width:200px;margin-right:70px;color:#007bff;text-transform:uppercase;text-align:right;font-weight:700;letter-spacing:2px}@media screen and (max-width:1024px){body .section__title,html .section__title{margin-right:50px}}@media screen and (max-width:850px){body .section__title,html .section__title{width:150px}}@media screen and (max-width:768px){body .section__title,html .section__title{text-align:left;width:auto}}body .section__content,html .section__content{font-weight:300;font-size:1rem;width:100%;max-width:650px}@media screen and (max-width:768px){body .section__content,html .section__content{padding-top:30px;padding-left:50px}}@media screen and (max-width:480px){body .section__content,html .section__content{padding-left:30px}}body .section__content p,html .section__content p{margin-top:0;margin-bottom:25px}body .section__content .underline-link,html .section__content .underline-link{position:relative;display:inline-block}body .section__content .underline-link:after,html .section__content .underline-link:after{position:absolute;top:100%;left:0;width:100%;height:1px;background:#36363c;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-5px);transform:translateY(-5px)}body .section__content .underline-link:focus:after,body .section__content .underline-link:hover:after,html .section__content .underline-link:focus:after,html .section__content .underline-link:hover:after{height:2px;border-radius:3px;opacity:1;-webkit-transform:translateY(-2px);transform:translateY(-2px)}body .arrow-link,html .arrow-link{font-weight:700;display:inline-block;-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;background-color:transparent;white-space:nowrap}body .arrow-link:after,html .arrow-link:after{position:relative;bottom:2px;margin-left:15px;content:"";background:url(../img/arrow.png) no-repeat center;background-size:100%;width:15px;height:15px;display:inline-block;vertical-align:middle;-webkit-transition:all .15s ease-in-out}body .arrow-link:hover:after,html .arrow-link:hover:after{-webkit-transform:translateX(7px);transform:translateX(7px)}body .small,html .small{font-family:Inconsolata,monospace;font-size:.85rem;display:inline-block;margin-top:15px}body .small:after,html .small:after{display:none}body #top-button,html #top-button{background:0 0;border:none;outline:0;width:40px;position:fixed;bottom:25px;right:10px;cursor:pointer;-webkit-transition:all .25s ease;transition:all .25s ease;display:none}@media screen and (max-width:1024px){body #top-button,html #top-button{bottom:20px;right:7px;width:35px}}@media screen and (max-width:480px){body #top-button,html #top-button{bottom:15px;right:3px}}body #top-button:focus,body #top-button:hover,html #top-button:focus,html #top-button:hover{-webkit-transform:translateY(-10px);transform:translateY(-10px)}body #top-button img,html #top-button img{width:100%}.waypoint{opacity:0;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0);-webkit-transition:opacity .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1)}.in-view{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.switch-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:20px;right:30px}@media screen and (max-width:480px){.switch-wrapper{top:10px;right:20px}}.switch-wrapper .moon,.switch-wrapper .sun{width:17px;height:17px}.switch-wrapper .sun{background:url(../img/switch/sun.svg) no-repeat center;background-size:100%}.switch-wrapper .moon{background:url(../img/switch/moon.svg) no-repeat center;background-size:100%}.switch-wrapper .toggle-wrapper{margin:10px}.switch-wrapper .toggle-wrapper #switch{height:0;width:0;visibility:hidden;position:absolute}.switch-wrapper .toggle-wrapper #switch:checked+label{background:#bada55}.switch-wrapper .toggle-wrapper #switch:checked+label:after{left:calc(100% - 3px);-webkit-transform:translateX(-100%);transform:translateX(-100%)}.switch-wrapper .toggle-wrapper label{cursor:pointer;text-indent:-9999px;width:45px;height:25px;background:grey;display:block;border-radius:100px;position:relative}.switch-wrapper .toggle-wrapper label:after{content:'';position:absolute;top:3px;left:3px;width:19px;height:19px;background:#fff;border-radius:100%;-webkit-transition:.25s;transition:.25s}.intro{padding:120px 100px;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;max-width:1440px;margin:0 auto}@media screen and (max-width:630px){.intro{padding:120px 70px}}@media screen and (max-width:550px){.intro{padding:120px 50px}}@media screen and (max-width:480px){.intro{padding:70px 50px}}.intro__hello,.intro__tagline{font-size:2.5rem}@media screen and (max-width:1024px){.intro__hello,.intro__tagline{font-size:2.25rem}}@media screen and (max-width:768px){.intro__hello,.intro__tagline{font-size:2rem}}@media screen and (max-width:550px){.intro__hello,.intro__tagline{font-size:1.75rem}}@media screen and (max-width:360px){.intro__hello,.intro__tagline{font-size:1.5rem}}@media screen and (max-width:330px){.intro__hello,.intro__tagline{font-size:1.4rem}}.intro__hello .emoji,.intro__tagline .emoji{width:40px;height:40px}@media screen and (max-width:1024px){.intro__hello .emoji,.intro__tagline .emoji{width:35px;height:35px}}@media screen and (max-width:768px){.intro__hello .emoji,.intro__tagline .emoji{width:30px;height:30px}}@media screen and (max-width:360px){.intro__hello .emoji,.intro__tagline .emoji{width:25px;height:25px}}.intro__hello{font-weight:300}.intro__hello .wave-hand{background-image:url(../img/emojis/wave.png);margin-left:10px;cursor:pointer}.intro__hello .wave-hand.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.intro__hello .wave-hand.wave{-webkit-animation-name:wave;animation-name:wave}@-webkit-keyframes wave{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg)}30%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg)}to{-webkit-transform:none;transform:none}}@keyframes wave{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg)}30%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg)}to{-webkit-transform:none;transform:none}}.intro__tagline{font-weight:300;max-width:700px}.intro__tagline .name{font-weight:700}.intro__tagline .technologist{background-image:url(../img/emojis/technologist.png)}.intro__contact{font-size:1.25rem;font-weight:400}@media screen and (max-width:550px){.intro__contact{font-size:1rem}}.intro__contact .emoji.pointer{background-image:url(../img/emojis/pointright.png);width:30px;height:30px;margin:0 5px;vertical-align:text-bottom}@media screen and (max-width:550px){.intro__contact .emoji.pointer{width:25px;height:25px}}.intro__contact .highlight-link{font-weight:400;text-decoration:none;display:inline-block;padding:2px 3px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;text-decoration:none;-webkit-box-shadow:inset 0 -3px 0 #007bff;box-shadow:inset 0 -3px 0 #007bff}.intro__contact .highlight-link:hover{-webkit-box-shadow:inset 0 -33px 0 0 #007bff;box-shadow:inset 0 -33px 0 0 #007bff;color:#fff}.skills .skillz{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media screen and (max-width:630px){.skills .skillz{-ms-flex-wrap:wrap;flex-wrap:wrap}}@media screen and (max-width:630px){.skills .skillz__category{width:47%;margin-right:5px;margin-bottom:25px}}.skills .skillz__category__label{font-weight:700;color:#36363c;text-transform:uppercase}.skills .skillz__category__item{margin:3px 0;font-size:.9rem}.experience .jobs{margin-bottom:100px}.experience .job{margin-bottom:25px}.experience .job .time-place{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media screen and (max-width:480px){.experience .job .time-place{display:block}}.experience .job__company{font-weight:700}.experience .job__time{font-size:.9rem;font-family:Inconsolata,monospace}@media screen and (max-width:480px){.experience .job__time{font-size:.8rem}}.experience .arrow-link{font-size:1.25rem}.experience .arrow-link:after{width:20px;height:20px}.status{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:1.1rem;font-family:Inconsolata,monospace;margin-top:70px;color:#131417}.status__light{width:30px;height:30px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.status__light__ring{position:absolute;width:25px;height:25px;-webkit-animation:pulsate 2s ease-out;animation:pulsate 2s ease-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;opacity:0;border:3px solid #bada55;border-radius:30px}@-webkit-keyframes pulsate{0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}50%{opacity:1}100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}}@keyframes pulsate{0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}50%{opacity:1}100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}}.status__light__led{position:absolute;width:13px;height:13px;background:#bada55;border-radius:100%}.status__message{margin-left:15px}.featured-projects a:after{display:none}.featured-projects .project{display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:100px;margin-left:-5%;width:125%}@media screen and (max-width:1280px){.featured-projects .project{width:115%}}@media screen and (max-width:1024px){.featured-projects .project{width:105%}}@media screen and (max-width:768px){.featured-projects .project{width:100%;display:block;margin-bottom:70px}}.featured-projects .project.screentime{margin-bottom:70px}.featured-projects .project:last-of-type{margin-bottom:0}.featured-projects .project__pic{max-width:700px;overflow:visible;margin:0}.featured-projects .project__pic a{display:block}.featured-projects .project__pic.phones a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.featured-projects .project__pic.phones .phone{margin:0 -7%}.featured-projects .project__pic.phones .phone:first-of-type{margin-left:-5%}.featured-projects .project__pic img{width:100%;max-width:100%;vertical-align:bottom}.featured-projects .project__caption{width:125px;-ms-flex-negative:0;flex-shrink:0;margin-left:30px}@media screen and (max-width:768px){.featured-projects .project__caption{width:100%;margin-top:25px;margin-left:0}}.featured-projects .project__name{margin-bottom:10px}.featured-projects .project__name a{font-weight:700}.featured-projects .project p{font-size:.85rem;line-height:1.3}.other-projects .project{max-width:600px;margin-bottom:50px}.other-projects .project__name{margin-bottom:10px}.other-projects .project p{font-size:.9rem;margin-bottom:20px}.other-projects .project__used__item{display:inline-block;margin:3px 3px 3px 0;font-family:Inconsolata,monospace;font-size:.75rem;font-weight:700;padding:2px 7px;border-radius:3px;color:#007bff;border:1px solid #007bff;background:0 0}.other-projects .project__used__item:first-of-type{margin-left:0}.footer{padding:50px 80px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:1024px){.footer{padding:50px}}@media screen and (max-width:630px){.footer{display:block}}@media screen and (max-width:480px){.footer{padding:50px 30px}}.footer__copyright{font-weight:700;width:200px}@media screen and (max-width:630px){.footer__copyright{width:auto;text-align:center;margin-bottom:25px}}@media screen and (max-width:630px){.footer__copyright .bottom,.footer__copyright .top{display:inline-block}}@media screen and (max-width:480px){.footer__copyright .bottom,.footer__copyright .top{display:block}}.footer__copyright .emoji{width:20px;height:20px;margin:0 3px;vertical-align:text-bottom}@media screen and (max-width:630px){.footer__links{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}}.footer__links a{position:relative;display:inline-block;color:#007bff!important;text-transform:uppercase;font-weight:700;margin:0 15px;outline:0}@media screen and (max-width:1024px){.footer__links a{margin:0 10px}}.footer__links a:after{position:absolute;top:100%;left:0;width:100%;height:1px;background:#007bff;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-5px);transform:translateY(-5px)}@media screen and (max-width:850px){.footer__links a:after{display:none}}.footer__links a:focus:after,.footer__links a:hover:after{height:2px;border-radius:3px;opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}.footer__links a .text{font-size:.9rem;display:inline;letter-spacing:1px}@media screen and (max-width:850px){.footer__links a .text{display:none}}.footer__links img{display:none;width:22px}@media screen and (max-width:850px){.footer__links img{display:inline-block}}.not-found{width:100%;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;padding:0 20px}.not-found .name{position:absolute;top:25px;left:30px;font-weight:700;color:#007bff;font-size:1.5rem}@media screen and (max-width:480px){.not-found .name{top:20px;left:25px;font-size:1.25rem}}.not-found h1{font-size:4rem;margin:10px 0}.not-found h2{font-size:1.5rem}@media screen and (max-width:480px){.not-found h2{font-size:1.25rem}}@media screen and (max-width:360px){.not-found h2{font-size:1.1rem}}.not-found a{font-weight:700;color:#007bff!important;position:relative;display:inline-block}.not-found a:after{position:absolute;top:100%;left:0;width:100%;height:3px;background:#007bff;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.not-found a:focus:after,.not-found a:hover:after{height:3px;opacity:1;-webkit-transform:translateY(-5px);transform:translateY(-5px)} \ No newline at end of file +@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Light.eot);src:url(../fonts/apercu/Apercu-Light.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Light.woff2) format("woff2"),url(../fonts/apercu/Apercu-Light.woff) format("woff"),url(../fonts/apercu/Apercu-Light.ttf) format("truetype"),url(../fonts/apercu/Apercu-Light.svg#Apercu-Light) format("svg");font-weight:300;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-LightItalic.eot);src:url(../fonts/apercu/Apercu-LightItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-LightItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-LightItalic.woff) format("woff"),url(../fonts/apercu/Apercu-LightItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-LightItalic.svg#Apercu-LightItalic) format("svg");font-weight:300;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Regular.eot);src:url(../fonts/apercu/Apercu-Regular.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Regular.woff2) format("woff2"),url(../fonts/apercu/Apercu-Regular.woff) format("woff"),url(../fonts/apercu/Apercu-Regular.ttf) format("truetype"),url(../fonts/apercu/Apercu-Regular.svg#Apercu-Regular) format("svg");font-weight:400;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Italic.eot);src:url(../fonts/apercu/Apercu-Italic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Italic.woff2) format("woff2"),url(../fonts/apercu/Apercu-Italic.woff) format("woff"),url(../fonts/apercu/Apercu-Italic.ttf) format("truetype"),url(../fonts/apercu/Apercu-Italic.svg#Apercu-Italic) format("svg");font-weight:400;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Medium.eot);src:url(../fonts/apercu/Apercu-Medium.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Medium.woff2) format("woff2"),url(../fonts/apercu/Apercu-Medium.woff) format("woff"),url(../fonts/apercu/Apercu-Medium.ttf) format("truetype"),url(../fonts/apercu/Apercu-Medium.svg#Apercu-Medium) format("svg");font-weight:500;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-MediumItalic.eot);src:url(../fonts/apercu/Apercu-MediumItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-MediumItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-MediumItalic.woff) format("woff"),url(../fonts/apercu/Apercu-MediumItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-MediumItalic.svg#Apercu-MediumItalic) format("svg");font-weight:500;font-style:italic}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-Bold.eot);src:url(../fonts/apercu/Apercu-Bold.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-Bold.woff2) format("woff2"),url(../fonts/apercu/Apercu-Bold.woff) format("woff"),url(../fonts/apercu/Apercu-Bold.ttf) format("truetype"),url(../fonts/apercu/Apercu-Bold.svg#Apercu-Bold) format("svg");font-weight:700;font-style:normal}@font-face{font-family:Apercu;src:url(../fonts/apercu/Apercu-BoldItalic.eot);src:url(../fonts/apercu/Apercu-BoldItalic.eot?#iefix) format("embedded-opentype"),url(../fonts/apercu/Apercu-BoldItalic.woff2) format("woff2"),url(../fonts/apercu/Apercu-BoldItalic.woff) format("woff"),url(../fonts/apercu/Apercu-BoldItalic.ttf) format("truetype"),url(../fonts/apercu/Apercu-BoldItalic.svg#Apercu-BoldItalic) format("svg");font-weight:700;font-style:italic}*,:after,:before{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-moz-selection{background:#fff10d}::selection{background:#fff10d}body,html{margin:0;padding:0;background-color:#fff;color:#444452;font-family:Apercu,Source Sans Pro,Helvetica,Arial,sans-serif;line-height:1.5}body a,html a{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;text-decoration:none;font-weight:700;color:#36363c}body ul,html ul{list-style:none;padding:0}body strong,html strong{font-weight:700;color:#36363c}body.night,html.night{background-color:#131417;color:#afafbf}body.night ::-moz-selection,html.night ::-moz-selection{color:#36363c;background:#fff10d}body.night ::selection,html.night ::selection{color:#36363c;background:#fff10d}body.night .switch-wrapper .sun,html.night .switch-wrapper .sun{background:url(../img/switch/sun-white.svg) no-repeat center;background-size:100%}body.night .switch-wrapper .moon,html.night .switch-wrapper .moon{background:url(../img/switch/moon-white.svg) no-repeat center;background-size:100%}body.night .experience .job__time,body.night .footer__copyright,body.night .intro,body.night .skills .skillz__category__label,body.night .status,body.night a,body.night strong,html.night .experience .job__time,html.night .footer__copyright,html.night .intro,html.night .skills .skillz__category__label,html.night .status,html.night a,html.night strong{color:#e7e7e7}body.night .section__content .underline-link:after,html.night .section__content .underline-link:after{background:#e7e7e7}body .emoji,html .emoji{display:inline-block;vertical-align:text-top;background-size:contain;background-repeat:no-repeat;background-position:center}body .section,html .section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:100px 170px}@media screen and (max-width:1280px){body .section,html .section{padding:100px}}@media screen and (max-width:1024px){body .section,html .section{padding:50px}}@media screen and (max-width:768px){body .section,html .section{display:block}}@media screen and (max-width:480px){body .section,html .section{padding:50px 35px}}body .section__title,html .section__title{-ms-flex-negative:0;flex-shrink:0;width:200px;margin-right:70px;color:#007bff;text-transform:uppercase;text-align:right;font-weight:700;letter-spacing:2px}@media screen and (max-width:1024px){body .section__title,html .section__title{margin-right:50px}}@media screen and (max-width:850px){body .section__title,html .section__title{width:150px}}@media screen and (max-width:768px){body .section__title,html .section__title{text-align:left;width:auto}}body .section__content,html .section__content{font-weight:300;font-size:1rem;width:100%;max-width:650px}@media screen and (max-width:768px){body .section__content,html .section__content{padding-top:30px;padding-left:50px}}@media screen and (max-width:480px){body .section__content,html .section__content{padding-left:30px}}body .section__content p,html .section__content p{margin-top:0;margin-bottom:25px}body .section__content .underline-link,html .section__content .underline-link{position:relative;display:inline-block}body .section__content .underline-link:after,html .section__content .underline-link:after{position:absolute;top:100%;left:0;width:100%;height:1px;background:#36363c;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-5px);transform:translateY(-5px)}body .section__content .underline-link:focus:after,body .section__content .underline-link:hover:after,html .section__content .underline-link:focus:after,html .section__content .underline-link:hover:after{height:2px;border-radius:3px;opacity:1;-webkit-transform:translateY(-2px);transform:translateY(-2px)}body .arrow-link,html .arrow-link{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;font-weight:700;display:inline-block;background-color:transparent;white-space:nowrap}body .arrow-link:after,html .arrow-link:after{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;position:relative;bottom:2px;margin-left:15px;content:"";background:url(../img/arrow.png) no-repeat center;background-size:100%;width:15px;height:15px;display:inline-block;vertical-align:middle}body .arrow-link:hover:after,html .arrow-link:hover:after{-webkit-transform:translateX(7px);transform:translateX(7px)}body .small,html .small{font-family:Inconsolata,monospace;font-size:.85rem;display:inline-block;margin-top:15px}body .small:after,html .small:after{display:none}body #top-button,html #top-button{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;background:0 0;border:none;outline:0;width:40px;position:fixed;bottom:25px;right:10px;cursor:pointer;display:none}@media screen and (max-width:1024px){body #top-button,html #top-button{bottom:20px;right:7px;width:35px}}@media screen and (max-width:480px){body #top-button,html #top-button{bottom:15px;right:3px}}body #top-button:focus,body #top-button:hover,html #top-button:focus,html #top-button:hover{-webkit-transform:translateY(-10px);transform:translateY(-10px)}body #top-button img,html #top-button img{width:100%}.waypoint{opacity:0;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0);-webkit-transition:opacity .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1);transition:opacity .6s cubic-bezier(.694,0,.335,1),transform .6s cubic-bezier(.694,0,.335,1),-webkit-transform .6s cubic-bezier(.694,0,.335,1)}.in-view{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.switch-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:absolute;top:20px;right:30px}@media screen and (max-width:480px){.switch-wrapper{top:10px;right:20px}}.switch-wrapper .moon,.switch-wrapper .sun{width:17px;height:17px}.switch-wrapper .sun{background:url(../img/switch/sun.svg) no-repeat center;background-size:100%}.switch-wrapper .moon{background:url(../img/switch/moon.svg) no-repeat center;background-size:100%}.switch-wrapper .toggle-wrapper{margin:10px}.switch-wrapper .toggle-wrapper #switch{height:0;width:0;visibility:hidden;position:absolute}.switch-wrapper .toggle-wrapper #switch:checked+label{background:#bada55}.switch-wrapper .toggle-wrapper #switch:checked+label:after{left:calc(100% - 3px);-webkit-transform:translateX(-100%);transform:translateX(-100%)}.switch-wrapper .toggle-wrapper label{cursor:pointer;text-indent:-9999px;width:45px;height:25px;background:grey;display:block;border-radius:100px;position:relative}.switch-wrapper .toggle-wrapper label:after{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;content:'';position:absolute;top:3px;left:3px;width:19px;height:19px;background:#fff;border-radius:100%}.intro{padding:120px 100px;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:distribute;justify-content:space-around;max-width:1440px;margin:0 auto}@media screen and (max-width:630px){.intro{padding:120px 70px}}@media screen and (max-width:550px){.intro{padding:120px 50px}}@media screen and (max-width:480px){.intro{padding:70px 50px}}.intro__hello,.intro__tagline{font-size:2.5rem}@media screen and (max-width:1024px){.intro__hello,.intro__tagline{font-size:2.25rem}}@media screen and (max-width:768px){.intro__hello,.intro__tagline{font-size:2rem}}@media screen and (max-width:550px){.intro__hello,.intro__tagline{font-size:1.75rem}}@media screen and (max-width:360px){.intro__hello,.intro__tagline{font-size:1.5rem}}@media screen and (max-width:330px){.intro__hello,.intro__tagline{font-size:1.4rem}}.intro__hello .emoji,.intro__tagline .emoji{width:40px;height:40px}@media screen and (max-width:1024px){.intro__hello .emoji,.intro__tagline .emoji{width:35px;height:35px}}@media screen and (max-width:768px){.intro__hello .emoji,.intro__tagline .emoji{width:30px;height:30px}}@media screen and (max-width:360px){.intro__hello .emoji,.intro__tagline .emoji{width:25px;height:25px}}.intro__hello{font-weight:300}.intro__hello .wave-hand{background-image:url(../img/emojis/wave.png);margin-left:10px;cursor:pointer}.intro__hello .wave-hand.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.intro__hello .wave-hand.wave{-webkit-animation-name:wave;animation-name:wave}@-webkit-keyframes wave{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg)}30%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg)}to{-webkit-transform:none;transform:none}}@keyframes wave{from{-webkit-transform:none;transform:none}15%{-webkit-transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-20%,0,0) rotate3d(0,0,1,-10deg)}30%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,7deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg);transform:translate3d(-15%,0,0) rotate3d(0,0,1,-10deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg);transform:translate3d(10%,0,0) rotate3d(0,0,1,5deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg);transform:translate3d(-5%,0,0) rotate3d(0,0,1,-2deg)}to{-webkit-transform:none;transform:none}}.intro__tagline{font-weight:300;max-width:700px}.intro__tagline .name{font-weight:700}.intro__tagline .technologist{background-image:url(../img/emojis/technologist.png)}.intro__contact{font-size:1.25rem;font-weight:400}@media screen and (max-width:550px){.intro__contact{font-size:1rem}}.intro__contact .emoji.pointer{background-image:url(../img/emojis/pointright.png);width:30px;height:30px;margin:0 5px;vertical-align:text-bottom}@media screen and (max-width:550px){.intro__contact .emoji.pointer{width:25px;height:25px}}.intro__contact .highlight-link{-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;font-weight:400;text-decoration:none;display:inline-block;padding:2px 3px;text-decoration:none;-webkit-box-shadow:inset 0 -3px 0 #007bff;box-shadow:inset 0 -3px 0 #007bff}.intro__contact .highlight-link:hover{-webkit-box-shadow:inset 0 -33px 0 0 #007bff;box-shadow:inset 0 -33px 0 0 #007bff;color:#fff}.skills .skillz{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media screen and (max-width:630px){.skills .skillz{-ms-flex-wrap:wrap;flex-wrap:wrap}}@media screen and (max-width:630px){.skills .skillz__category{width:47%;margin-right:5px;margin-bottom:25px}}.skills .skillz__category__label{font-weight:700;color:#36363c;text-transform:uppercase}.skills .skillz__category__item{margin:3px 0;font-size:.9rem}.experience .jobs{margin-bottom:100px}.experience .job{margin-bottom:25px}.experience .job .time-place{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}@media screen and (max-width:480px){.experience .job .time-place{display:block}}.experience .job__company{font-weight:700}.experience .job__time{font-size:.9rem;font-family:Inconsolata,monospace}@media screen and (max-width:480px){.experience .job__time{font-size:.8rem}}.experience .arrow-link{font-size:1.25rem}.experience .arrow-link:after{width:20px;height:20px}.status{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:1.1rem;font-family:Inconsolata,monospace;margin-top:70px;color:#131417}.status__light{width:30px;height:30px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.status__light__ring{position:absolute;width:25px;height:25px;-webkit-animation:pulsate 2s ease-out;animation:pulsate 2s ease-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;opacity:0;border:3px solid #bada55;border-radius:30px}@-webkit-keyframes pulsate{0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}50%{opacity:1}100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}}@keyframes pulsate{0%{-webkit-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0}50%{opacity:1}100%{-webkit-transform:scale(1.2,1.2);transform:scale(1.2,1.2);opacity:0}}.status__light__led{position:absolute;width:13px;height:13px;background:#bada55;border-radius:100%}.status__message{margin-left:15px}.featured-projects a:after{display:none}.featured-projects .project{display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:100px;margin-left:-5%;width:125%}@media screen and (max-width:1280px){.featured-projects .project{width:115%}}@media screen and (max-width:1024px){.featured-projects .project{width:105%}}@media screen and (max-width:768px){.featured-projects .project{width:100%;display:block;margin-bottom:70px}}.featured-projects .project.screentime{margin-bottom:70px}.featured-projects .project:last-of-type{margin-bottom:0}.featured-projects .project__pic{max-width:700px;overflow:visible;margin:0}.featured-projects .project__pic a{display:block}.featured-projects .project__pic.phones a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.featured-projects .project__pic.phones .phone{margin:0 -7%}.featured-projects .project__pic.phones .phone:first-of-type{margin-left:-5%}.featured-projects .project__pic img{width:100%;max-width:100%;vertical-align:bottom}.featured-projects .project__caption{width:125px;-ms-flex-negative:0;flex-shrink:0;margin-left:30px}@media screen and (max-width:768px){.featured-projects .project__caption{width:100%;margin-top:25px;margin-left:0}}.featured-projects .project__name{margin-bottom:10px}.featured-projects .project__name a{font-weight:700}.featured-projects .project p{font-size:.85rem;line-height:1.3}.other-projects .project{max-width:600px;margin-bottom:50px}.other-projects .project__name{margin-bottom:10px}.other-projects .project p{font-size:.9rem;margin-bottom:20px}.other-projects .project__used__item{display:inline-block;margin:3px 3px 3px 0;font-family:Inconsolata,monospace;font-size:.75rem;font-weight:700;padding:2px 7px;border-radius:3px;color:#007bff;border:1px solid #007bff;background:0 0}.other-projects .project__used__item:first-of-type{margin-left:0}.footer{padding:50px 80px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media screen and (max-width:1024px){.footer{padding:50px}}@media screen and (max-width:630px){.footer{display:block}}@media screen and (max-width:480px){.footer{padding:50px 30px}}.footer__copyright{font-weight:700;width:200px}@media screen and (max-width:630px){.footer__copyright{width:auto;text-align:center;margin-bottom:25px}}@media screen and (max-width:630px){.footer__copyright .bottom,.footer__copyright .top{display:inline-block}}@media screen and (max-width:480px){.footer__copyright .bottom,.footer__copyright .top{display:block}}.footer__copyright .emoji{width:20px;height:20px;margin:0 3px;vertical-align:text-bottom}@media screen and (max-width:630px){.footer__links{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}}.footer__links a{position:relative;display:inline-block;color:#007bff!important;text-transform:uppercase;font-weight:700;margin:0 15px;outline:0}@media screen and (max-width:1024px){.footer__links a{margin:0 10px}}.footer__links a:after{position:absolute;top:100%;left:0;width:100%;height:1px;background:#007bff;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-5px);transform:translateY(-5px)}@media screen and (max-width:850px){.footer__links a:after{display:none}}.footer__links a:focus:after,.footer__links a:hover:after{height:2px;border-radius:3px;opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}.footer__links a .text{font-size:.9rem;display:inline;letter-spacing:1px}@media screen and (max-width:850px){.footer__links a .text{display:none}}.footer__links img{display:none;width:22px}@media screen and (max-width:850px){.footer__links img{display:inline-block}}.not-found{width:100%;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;padding:0 20px}.not-found .name{position:absolute;top:25px;left:30px;font-weight:700;color:#007bff;font-size:1.5rem}@media screen and (max-width:480px){.not-found .name{top:20px;left:25px;font-size:1.25rem}}.not-found h1{font-size:4rem;margin:10px 0}.not-found h2{font-size:1.5rem}@media screen and (max-width:480px){.not-found h2{font-size:1.25rem}}@media screen and (max-width:360px){.not-found h2{font-size:1.1rem}}.not-found a{font-weight:700;color:#007bff!important;position:relative;display:inline-block}.not-found a:after{position:absolute;top:100%;left:0;width:100%;height:3px;background:#007bff;content:'';opacity:0;-webkit-transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,-webkit-transform .3s;transition:height .3s,opacity .3s,transform .3s;transition:height .3s,opacity .3s,transform .3s,-webkit-transform .3s;-webkit-transform:translateY(-10px);transform:translateY(-10px)}.not-found a:focus:after,.not-found a:hover:after{height:3px;opacity:1;-webkit-transform:translateY(-5px);transform:translateY(-5px)} \ No newline at end of file