:root{--scale: 1}@media only screen and (max-width: 31.25em){:root{--scale: .7}}@media only screen and (max-width: 20em){:root{--scale: .5}}:root{--primary-button-offset: calc((20rem * 0.6 - 3.5rem) * var(--scale));--primary-button-offset-neg: calc((-20rem * 0.6 + 3.5rem) * var(--scale));--offset-from-center-x: 0rem;--offset-from-center-y: 0rem}@media only screen and (max-width: 43.75em){:root{--offset-from-center-y: -12rem;--offset-from-center-x: -2rem}}@media only screen and (max-width: 31.25em){:root{--offset-from-center-y: -7rem}}@media only screen and (max-width: 20em){:root{--offset-from-center-y: -6rem;--offset-from-center-x: -1.3rem}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(720deg);transform:rotate(720deg)}}@keyframes spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(720deg);transform:rotate(720deg)}}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.06);transform:scale(1.06)}40%{-webkit-transform:scale(1);transform:scale(1)}60%{-webkit-transform:scale(1);transform:scale(1)}80%{-webkit-transform:scale(1.04);transform:scale(1.04)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}20%{-webkit-transform:scale(1.06);transform:scale(1.06)}40%{-webkit-transform:scale(1);transform:scale(1)}60%{-webkit-transform:scale(1);transform:scale(1)}80%{-webkit-transform:scale(1.04);transform:scale(1.04)}100%{-webkit-transform:scale(1);transform:scale(1)}}*,*::after,*::before{margin:0;padding:0;box-sizing:inherit}html{--rem-resize: 62.5%;font-size:var(--rem-resize)}@media only screen and (max-width: 68.75em){html{font-size:51%}}@media only screen and (max-width: 56.25em){html{font-size:41%}}@media only screen and (max-width: 31.25em){html{font-size:37.5%}}body{box-sizing:border-box;background:#f3f3f3;font-family:'Ubuntu', sans-serif;height:100vh;width:100vw;min-height:72rem;min-width:109rem;position:relative;margin:auto}@media only screen and (max-width: 43.75em){body{min-height:92rem;min-width:65rem}}@media only screen and (max-width: 31.25em){body{min-height:71rem;min-width:49rem}}@media only screen and (max-width: 20em){body{min-height:49rem;min-width:34rem}}.btn-primary{-webkit-transform-origin:center;transform-origin:center;display:block;width:calc(20rem * 2 * var(--scale));height:calc(20rem * 2 * var(--scale));background-image:linear-gradient(to bottom right, #fa8231, #F02F46);border-radius:100%;padding:1rem;transition:all 0.2s;box-shadow:0rem 1.5rem 3rem rgba(17,17,17,0.7);cursor:pointer}@media only screen and (max-width: 31.25em){.btn-primary{padding:.5rem}}.btn-primary--small{width:calc(8rem * 2 * var(--scale));height:calc(8rem * 2 * var(--scale));box-shadow:0 1rem 2rem rgba(17,17,17,0.7)}.btn-primary__img{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:70%;height:70%;border-radius:100%;box-shadow:0 0 2rem rgba(17,17,17,0.7)}.btn-primary__icon{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);fill:#f3f3f3;width:50%;height:50%}.btn-primary__text{font-size:1rem;font-weight:500;letter-spacing:1px;text-transform:uppercase;-webkit-animation:spin 1s;animation:spin 1s;fill:#f3f3f3;transition:-webkit-transform 1s;transition:transform 1s;transition:transform 1s, -webkit-transform 1s}@media only screen and (max-width: 56.25em){.btn-primary__text{font-size:1.5rem}}@media only screen and (max-width: 31.25em){.btn-primary__text{font-size:1.75rem}}.btn-primary.pulsing{-webkit-animation:pulse .64s;animation:pulse .64s}.btn-primary.blurred{-webkit-animation:none;animation:none;-webkit-transform:scale(0.6);transform:scale(0.6);box-shadow:0 0 0 rgba(17,17,17,0.7)}.btn-primary.blurred .btn-primary__text{-webkit-transform:rotate(-720deg);transform:rotate(-720deg)}.btn-primary--small.blurred{-webkit-transform:scale(0.8);transform:scale(0.8)}.btn-primary:hover{-webkit-transform:scale(1.05);transform:scale(1.05);-webkit-animation:none;animation:none}.btn-primary.blurred:hover{-webkit-transform:scale(0.63);transform:scale(0.63);box-shadow:0 1rem 2rem rgba(17,17,17,0.7)}.btn-primary--small.blurred:hover{-webkit-transform:scale(0.83);transform:scale(0.83)}.btn-primary:active{-webkit-transform:scale(1);transform:scale(1)}.btn-primary.blurred:active{-webkit-transform:scale(0.6);transform:scale(0.6)}.btn-primary--small.blurred:active{-webkit-transform:scale(0.8);transform:scale(0.8)}.btn-primary.animating{transition:all 1s}.btn-primary.hidden{-webkit-transform:scale(0.6);transform:scale(0.6);opacity:0}.btn-primary.hidden .btn-primary__text{-webkit-transform:rotate(-720deg);transform:rotate(-720deg)}.info-blob{display:block;position:absolute;height:calc(4rem * 2 * var(--scale));width:calc(4rem * 2 * var(--scale));background:#333;border-radius:100%;box-shadow:0 0 0.3rem rgba(17,17,17,0.7);transition:all 0.2s;overflow:hidden}.info-blob:link,.info-blob:active,.info-blob:visited{text-decoration:none}.info-blob:link:hover{box-shadow:0 0.5rem 1rem rgba(17,17,17,0.7);-webkit-transform:scale(1.05);transform:scale(1.05)}.info-blob__icon{position:absolute;top:25%;left:25%;width:50%;height:50%;transition:-webkit-transform 0.2s;transition:transform 0.2s;transition:transform 0.2s, -webkit-transform 0.2s}.info-blob__description{color:#F02F46;position:relative;height:100%;top:calc(50% - .7rem);font-size:1.4rem;font-weight:500;text-align:center;transition:-webkit-transform 0.2s;transition:transform 0.2s;transition:transform 0.2s, -webkit-transform 0.2s;-webkit-transform:translateY(100%);transform:translateY(100%)}@media only screen and (max-width: 31.25em){.info-blob__description{font-size:1rem}}.info-blob--white .info-blob__icon{fill:#f3f3f3}.info-blob--white .info-blob__description{color:#f3f3f3}.info-blob:hover .info-blob__icon{-webkit-transform:translateY(-200%);transform:translateY(-200%)}.info-blob:hover .info-blob__description{-webkit-transform:translateY(0);transform:translateY(0)}.info-blob.hidden{-webkit-transform:scale(0.4);transform:scale(0.4);opacity:0}.info-blob.animating{transition:all 1s}.contact-list{list-style-type:none}.contact-list__item{display:flex;align-items:center}.contact-list__item:not(:last-child){margin-bottom:1rem}@media only screen and (max-width: 20em){.contact-list__item:not(:last-child){margin-bottom:0rem}}.contact-list__icon{height:3rem;width:3rem;margin-right:2rem;fill:#111}@media only screen and (max-width: 20em){.contact-list__icon{height:2rem;width:2rem;margin-right:1rem}}.contact-list__text{font-size:1.6rem;color:#111}@media only screen and (max-width: 31.25em){.contact-list__text{font-size:1.3rem}}@media only screen and (max-width: 20em){.contact-list__text{font-size:1.1rem}}.contact-list.hidden{opacity:0;-webkit-transform:translateX(-4rem);transform:translateX(-4rem)}.contact-list.animating{transition:all 1s}.project-link{position:relative;display:block;width:calc(25rem * var(--scale));height:calc(15rem * var(--scale));background-size:cover;background-position:center;border-radius:1rem;transition:all 0.2s;overflow:hidden}@media only screen and (max-width: 43.75em){.project-link{top:calc(25rem * var(--scale))}}.project-link:not(:last-child){margin-bottom:2rem}.project-link:link,.project-link:active,.project-link:visited{text-decoration:none}.project-link__description{position:absolute;bottom:0;color:#f3f3f3;background:#333;width:100%;font-size:1.6rem;text-align:center;padding:.5rem 1rem;transition:-webkit-transform 0.2s;transition:transform 0.2s;transition:transform 0.2s, -webkit-transform 0.2s;-webkit-transform:translateY(100%);transform:translateY(100%)}.project-link:hover{-webkit-transform:scale(1.05);transform:scale(1.05);box-shadow:0 1rem 2rem rgba(17,17,17,0.7)}.project-link:hover .project-link__description{-webkit-transform:translateY(0);transform:translateY(0)}.project-link.hidden{opacity:0;-webkit-transform:translateX(-120%);transform:translateX(-120%)}.project-link.animating{transition:all 1s}#link-sukkashop{background-image:url(../img/sukkashop.jpg)}#link-salon{background-image:url(../img/salon.jpg)}.section{position:absolute;width:40vw;height:50vh}.section.hidden,.section.blurred{z-index:-1000}#section-teemu .section__primary-button{position:relative;top:calc(-20rem * var(--scale) / 2);left:calc(-20rem * var(--scale) / 2)}#section-projects{width:51rem;height:33rem;top:calc(50% + var(--offset-from-center-y));right:calc(50% - var(--offset-from-center-x))}@media only screen and (max-width: 43.75em){#section-projects{width:28rem;height:58rem}}@media only screen and (max-width: 31.25em){#section-projects{width:21rem;height:44rem}}@media only screen and (max-width: 20em){#section-projects{width:15rem;height:30rem}}#section-projects .section__primary-button{position:absolute;top:var(--primary-button-offset);right:var(--primary-button-offset)}#section-projects .section__primary-button.hidden{-webkit-transform:translate(var(--primary-button-offset), var(--primary-button-offset-neg));transform:translate(var(--primary-button-offset), var(--primary-button-offset-neg))}#section-resume{width:calc(26rem * var(--scale));height:calc(26rem * var(--scale));bottom:calc(50% - var(--offset-from-center-y));right:calc(50% - var(--offset-from-center-x))}#section-resume .section__primary-button{position:absolute;bottom:var(--primary-button-offset);right:var(--primary-button-offset);background:#fa8231}#section-resume .section__primary-button.hidden{-webkit-transform:translate(var(--primary-button-offset), var(--primary-button-offset));transform:translate(var(--primary-button-offset), var(--primary-button-offset))}#section-techs{width:55rem;height:37rem;bottom:calc(50% - 2rem);left:calc(50% - var(--primary-button-offset) + var(--offset-from-center-x))}@media only screen and (max-width: 43.75em){#section-techs{width:42rem;height:44rem;bottom:calc(50% - 10rem - var(--offset-from-center-y))}}@media only screen and (max-width: 31.25em){#section-techs{width:31rem;height:32rem;bottom:calc(50% - 6rem - var(--offset-from-center-y))}}@media only screen and (max-width: 20em){#section-techs{width:22rem;height:23rem;bottom:calc(50% - 4.5rem - var(--offset-from-center-y))}}#section-techs .section__primary-button{position:absolute;bottom:calc(var(--primary-button-offset) + 2rem);left:calc(2 * var(--primary-button-offset))}@media only screen and (max-width: 43.75em){#section-techs .section__primary-button{bottom:calc(var(--primary-button-offset) + 10rem)}}@media only screen and (max-width: 31.25em){#section-techs .section__primary-button{bottom:calc(var(--primary-button-offset) + 6rem)}}@media only screen and (max-width: 20em){#section-techs .section__primary-button{bottom:calc(var(--primary-button-offset) + 4.5rem)}}#section-techs .section__primary-button.hidden{-webkit-transform:translate(var(--primary-button-offset-neg), var(--primary-button-offset));transform:translate(var(--primary-button-offset-neg), var(--primary-button-offset))}#section-contacts{width:54rem;height:33rem;top:50%;left:calc(50% + var(--offset-from-center-x))}@media only screen and (max-width: 43.75em){#section-contacts{width:37rem;height:39rem;top:calc(50% + 10rem + var(--offset-from-center-y))}}@media only screen and (max-width: 31.25em){#section-contacts{width:28rem;height:31rem}}@media only screen and (max-width: 20em){#section-contacts{width:18rem;height:24rem;top:calc(50% + 5rem + var(--offset-from-center-y))}}#section-contacts .section__primary-button{position:absolute;top:var(--primary-button-offset);left:var(--primary-button-offset);background:#F02F46}@media only screen and (max-width: 43.75em){#section-contacts .section__primary-button{top:calc(var(--primary-button-offset) - 10rem)}}@media only screen and (max-width: 20em){#section-contacts .section__primary-button{top:calc(var(--primary-button-offset) - 5rem)}}#section-contacts .section__primary-button.hidden{-webkit-transform:translate(var(--primary-button-offset-neg), var(--primary-button-offset-neg));transform:translate(var(--primary-button-offset-neg), var(--primary-button-offset-neg))}.header{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);height:calc(20rem * var(--scale));width:calc(20rem * var(--scale));z-index:1000;top:calc(50% + var(--offset-from-center-y));left:calc(50% + var(--offset-from-center-x))}.header__description{position:relative;width:calc(20rem * 2 * var(--scale));left:calc(-20rem / 2 * var(--scale));top:-5rem;font-size:2rem;color:#333;text-align:center;-webkit-transform-origin:center;transform-origin:center;transition:all 1s}@media only screen and (max-width: 31.25em){.header__description{font-size:1.6rem;top:-3rem}}@media only screen and (max-width: 20em){.header__description{font-size:1.4rem;top:-1rem}}.header.blurred .header__description,.header.hidden .header__description{opacity:0;-webkit-transform:translateY(200%) scale(0.7);transform:translateY(200%) scale(0.7)}#tech-blob-html5{bottom:15rem;left:8rem}@media only screen and (max-width: 43.75em){#tech-blob-html5{bottom:23rem;left:8rem}}@media only screen and (max-width: 31.25em){#tech-blob-html5{bottom:15rem;left:6rem}}@media only screen and (max-width: 20em){#tech-blob-html5{bottom:11.5rem;left:4rem}}#tech-blob-css3{bottom:24rem;left:1rem}@media only screen and (max-width: 43.75em){#tech-blob-css3{bottom:29rem;left:1rem}}@media only screen and (max-width: 31.25em){#tech-blob-css3{bottom:20rem;left:1rem}}@media only screen and (max-width: 20em){#tech-blob-css3{bottom:16rem;left:2rem}}#tech-blob-javascript{bottom:26rem;left:12rem}@media only screen and (max-width: 43.75em){#tech-blob-javascript{bottom:32rem;left:10rem}}@media only screen and (max-width: 31.25em){#tech-blob-javascript{bottom:22rem;left:8rem}}@media only screen and (max-width: 20em){#tech-blob-javascript{bottom:16.5rem;left:7rem}}#tech-blob-sass{bottom:28rem;left:23rem}@media only screen and (max-width: 43.75em){#tech-blob-sass{bottom:34rem;left:19rem}}@media only screen and (max-width: 31.25em){#tech-blob-sass{bottom:23rem;left:15rem}}@media only screen and (max-width: 20em){#tech-blob-sass{bottom:17.5rem;left:12rem}}#tech-blob-wordpress{bottom:28rem;left:41rem}@media only screen and (max-width: 43.75em){#tech-blob-wordpress{bottom:34rem;left:28rem}}@media only screen and (max-width: 31.25em){#tech-blob-wordpress{bottom:26rem;left:21.5rem}}@media only screen and (max-width: 20em){#tech-blob-wordpress{bottom:18.5rem;left:17rem}}#tech-blob-react{bottom:22rem;left:32rem}@media only screen and (max-width: 43.75em){#tech-blob-react{bottom:26rem;left:32rem}}@media only screen and (max-width: 31.25em){#tech-blob-react{bottom:19.5rem;left:22rem}}@media only screen and (max-width: 20em){#tech-blob-react{bottom:14rem;left:16rem}}#tech-blob-php{bottom:17rem;left:43rem}@media only screen and (max-width: 43.75em){#tech-blob-php{bottom:17rem;left:31rem}}@media only screen and (max-width: 31.25em){#tech-blob-php{bottom:13rem;left:23rem}}@media only screen and (max-width: 20em){#tech-blob-php{bottom:9.2rem;left:17rem}}#tech-blob-sql{bottom:6rem;left:46rem}@media only screen and (max-width: 43.75em){#tech-blob-sql{bottom:8.5rem;left:30rem}}@media only screen and (max-width: 31.25em){#tech-blob-sql{bottom:6.5rem;left:23rem}}@media only screen and (max-width: 20em){#tech-blob-sql{bottom:4.5rem;left:16rem}}#tech-blob-git{bottom:0rem;left:35rem}@media only screen and (max-width: 43.75em){#tech-blob-git{bottom:0rem;left:33rem}}@media only screen and (max-width: 31.25em){#tech-blob-git{bottom:0rem;left:25rem}}@media only screen and (max-width: 20em){#tech-blob-git{bottom:0rem;left:18rem}}#tech-blob-npm{bottom:11rem;left:34rem}@media only screen and (max-width: 43.75em){#tech-blob-npm{bottom:10.5rem;left:21rem}}@media only screen and (max-width: 31.25em){#tech-blob-npm{bottom:6.5rem;left:16rem}}@media only screen and (max-width: 20em){#tech-blob-npm{bottom:5rem;left:11rem}}#tech-blob-linux{bottom:2rem;left:24rem}@media only screen and (max-width: 43.75em){#tech-blob-linux{bottom:2rem;left:24rem}}@media only screen and (max-width: 31.25em){#tech-blob-linux{bottom:0rem;left:18rem}}@media only screen and (max-width: 20em){#tech-blob-linux{bottom:.5rem;left:13rem}}#contact-list{position:absolute;top:calc(calc(20rem * 0.6 - 4rem) + 8rem * (1 - 0.8));left:calc(calc(20rem * 0.6 - 4rem) + 8rem * 2 + 3rem);height:12.8rem;display:flex;flex-direction:column;align-content:center}@media only screen and (max-width: 43.75em){#contact-list{top:calc(calc(20rem * 0.6 - 4rem) + 8rem * 2 - 9.5rem);left:calc(calc(20rem * 0.6 - 4rem))}}@media only screen and (max-width: 31.25em){#contact-list{top:calc(calc(20rem * 0.6 - 4rem) + 8rem * 2 - 15.5rem);left:calc(calc(20rem * 0.6 - 4rem) - 5rem)}}@media only screen and (max-width: 20em){#contact-list{top:calc(calc(20rem * 0.6 - 4rem) + 8rem * 2 - 16.5rem);left:calc(calc(20rem * 0.6 - 4rem) - 6rem);height:9.6rem}}#contact-list>li{flex-grow:1}#contact-list li:nth-child(2n-1){-webkit-transform:translateX(-1rem);transform:translateX(-1rem)}@media only screen and (max-width: 43.75em){#contact-list li:nth-child(2n){-webkit-transform:translateX(-2rem);transform:translateX(-2rem)}}#contact-blob-github{top:24rem;left:7rem;background:#333}@media only screen and (max-width: 43.75em){#contact-blob-github{top:calc(24rem + 6rem)}}@media only screen and (max-width: 31.25em){#contact-blob-github{top:calc(24rem);left:5rem}}@media only screen and (max-width: 20em){#contact-blob-github{top:calc(24rem - 5rem);left:3rem}}#contact-blob-linkedin{top:24rem;left:18rem;background:#0077b5}@media only screen and (max-width: 43.75em){#contact-blob-linkedin{top:calc(24rem + 6rem)}}@media only screen and (max-width: 31.25em){#contact-blob-linkedin{top:calc(24rem);left:14rem}}@media only screen and (max-width: 20em){#contact-blob-linkedin{top:calc(24rem - 5rem);left:10rem}}