body{margin:0;padding:0;background-color:rgb(142, 151, 240);overflow-x:hidden}li{list-style-type:none}a{text-decoration:none;color:#fff}.fa.fa-codepen,.fa.fa-github,.fa.fa-linkedin-square,.fa.fa-twitter,.fa.fa-youtube{display:inline-block;margin:0 5px;color:#cfd2e2;transition:all .2s linear}.fa:hover{color:#fff}.fa-2x{font-size:1.5em}.about__title,.contact__title,.portfolio__title{width:100%;margin:0;padding:2em 0 1em;color:rgb(142, 151, 240);font-size:2.5em;font-family:'Open Sans',sans-serif;font-weight:400;text-align:center;text-transform:uppercase}.title--white{color:#fff}.about__title__dot,.contact__title__dot,.portfolio__title__dot{display:inline-block;width:10px;height:10px;margin-left:5px;background-color:rgb(142, 151, 240)}.title__dot--white{background-color:#fff}.nav{max-width:100%;height:50px;margin:0 auto;background-color:#382266;opacity:0;position:fixed;top:0;left:0;right:0;z-index:5}.nav__logo{max-width:30px;height:auto;position:relative;top:.5em;left:.5em}.nav__hamburger{position:absolute;top:.6em;right:.8em;cursor:pointer;opacity:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.hamburger{stroke:#fff;stroke-width:3;stroke-linecap:round}.hamburger__name{padding:5px;position:absolute;bottom:1em;right:4.4em;font-size:.75em;font-family:'Open Sans',sans-serif;font-weight:600;color:#fff;border-right:2px solid #fff;text-transform:uppercase;letter-spacing:2px}.nav-menu{width:0;height:100%;background-color:#60689f;background:linear-gradient(to top,#60689f,#8d94ba);position:fixed;top:0;right:0;bottom:0;z-index:5;transition:all .5s linear}.nav-menu__cross{opacity:1;cursor:pointer;z-index:6;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-left:200px;margin-top:10px}.nav-menu__cross-line{stroke:#cfd2e2;stroke-width:3;stroke-linecap:round}.nav-menu__list{padding-top:1.2em;margin-left:-.7em}.nav-menu__list-item{color:#fff;font-size:1.2em;font-family:'Open Sans',sans-serif;font-weight:400;line-height:1.8em;position:relative;opacity:1}.nav-menu__link{color:#cfd2e2;transition:all .1s linear}.nav-menu__link:hover{color:#fff}.nav-menu__separator{width:195px;margin:2em 0 2em 1.7em;height:1px;background-color:#cfd2e2;border:none;opacity:1}.nav-menu__email,.nav-menu__text{margin:2em;width:200px;color:#cfd2e2;font-size:.9em;font-family:'Open Sans',sans-serif;font-weight:400;opacity:1}.nav-menu__link--email{color:#cfd2e2;transition:all .1s linear}.nav-menu__link--email:hover{color:#fff}.nav-menu__social-btn{margin:2em 1.3em;width:250px;opacity:1}.header{background-image:url(../images/header_background.svg);background-repeat:repeat;background-size:400px;background-position:top left;height:530px;text-align:center;position:relative;z-index:2;opacity:0;overflow:hidden}.header__title{display:inline-block;background-color:#fff;padding:0 15px;color:rgb(142, 151, 240);font-size:2.9em;font-family:'Open Sans',sans-serif;font-weight:800;text-transform:uppercase;opacity:0;position:absolute;top:2em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.header__subtitle{display:inline-block;background-color:#8d94ba;padding:3px 15px;color:#fff;font-size:1.8em;font-family:'Open Sans',sans-serif;font-weight:400;letter-spacing:1px;opacity:0;position:absolute;top:6em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.header__btn{border:4px solid #fff;border-bottom-color:transparent;border-top-color:transparent;width:220px;background-color:#8d94ba;border-radius:25px;padding:5px 0;color:#fff;font-size:1.3em;font-family:'Open Sans',sans-serif;font-weight:400;letter-spacing:1px;opacity:0;position:absolute;bottom:8em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);transition:all .3s linear}.header__btn:hover{box-shadow:0 3px 5px -3px #333,inset 0 -50px 0 0 #382266;color:#fff}.header__mouse__container{box-sizing:border-box;position:absolute;bottom:-100px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:170px;height:150px;background-color:#382266;border-radius:50%}.header__mouse{width:34px;height:auto;position:absolute;bottom:7.5em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:4}.header__mouse__roll{width:34px;height:auto;position:absolute;bottom:7.5em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:4}.header__mouse__text{color:#fff;font-size:.6em;font-family:'Open Sans',sans-serif;font-weight:400;letter-spacing:1px;position:absolute;bottom:9.2em;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:4}.main-container{opacity:0;z-index:1;position:relative;z-index:1}.about{background-color:#382266}.about__info__container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:0 2em 3em}.about__text{min-width:300px;max-width:560px;box-sizing:content-box;background-color:rgb(142, 151, 240);padding:0 2em 0;border-left:15px solid #8d94ba}.about__text__description{font-family:'Source Sans Pro',sans-serif}.about__text__description:first-of-type{padding-bottom:1em;color:#fff;font-size:1.6em;font-weight:400;border-bottom:1px solid #fff}.about__text__description:last-of-type{color:#fff;font-size:1.3em;font-weight:300}.about__btn{display:inline-block;height:26px;margin:.5em 0 1em 0;padding:5px 20px 3px;border-radius:26px;background-color:#8d94ba;color:#fff;font-size:1em;font-family:'Open Sans',sans-serif;font-weight:400;border:4px solid #fff;border-bottom-color:transparent;border-top-color:transparent;transition:all .3s linear}.about__btn:hover{box-shadow:inset 0 -50px 0 0 #382266;color:#fff}.about__img{display:block;max-width:360px;max-height:360px;border-radius:50%;border:15px solid rgb(142, 151, 240);border-top-left-radius:0;border-bottom-left-radius:0}.about__img__mobile{display:none}.portfolio{padding:0 2em 3em;background-color:#fff;z-index:4}.portfolio__description{max-width:65%;margin:0 auto 2em;color:#382266;font-size:1.2em;font-family:'Source Sans Pro',sans-serif;font-weight:300;text-align:center}.portfolio__nav__container{max-width:918px;margin:0 auto .5em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;background-color:#7078a9}.portfolio__nav__btn{width:128px;margin:1em .8em .8em;padding:0 5px 4px;background-color:transparent;color:#fff;font-size:1.1em;font-family:'Open Sans',sans-serif;font-weight:400;text-align:center;border:none;position:relative}.portfolio__nav__btn:after,.portfolio__nav__btn:before{content:"";position:absolute;top:-13%;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);border-width:0;border-style:solid;border-color:#fff;width:128px;height:115%;transition:all .3s linear}.portfolio__nav__btn:before{border-top-width:2px;border-left-width:2px}.portfolio__nav__btn:after{border-bottom-width:2px;border-right-width:2px}.portfolio__nav__btn:hover.portfolio__nav__btn:after,.portfolio__nav__btn:hover.portfolio__nav__btn:before{width:70%;height:0%}.portfolio__nav__btn:hover.portfolio__nav__btn:after{top:100%}.portfolio__items-container{max-width:932px;margin:0 auto;background-color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;overflow:hidden}.portfolio__item{display:block;margin:.5em;width:450px;background-color:#7078a9;position:relative;overflow:hidden;float:left}.portfolio__item__info{margin:.2em 0 .5em;color:#fff;font-size:1.4em;font-family:'Open Sans',sans-serif;font-weight:300;text-align:center}.portfolio__item__thumbnail{width:100%;height:auto;border-bottom:1px solid #cfd2e2;-webkit-transform:translateY(0);transform:translateY(0);transition:all .6s linear;z-index:4}.portfolio__item:hover .portfolio__item__thumbnail{-webkit-transform:scale(1.1) translateY(120%);transform:scale(1.1) translateY(120%)}.portfolio__item:hover .portfolio__item__hover{-webkit-transform:translateY(0);transform:translateY(0)}.portfolio__item__hover{position:relative;width:100%;height:100%;padding-top:2.5em;background-color:#ff4d7f;background:linear-gradient(to top,#ff99b6 0,#ff4d7f 100%);position:absolute;left:0;top:0;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition:all .6s linear;text-align:center;z-index:3}.portfolio__item__hover:before{content:"";position:absolute;top:2em;left:1.5em;width:0;height:0;border-width:0;border-top-width:1px;border-left-width:1px;border-style:solid;border-color:#fff;transition:all .8s linear}.portfolio__item__hover:after{content:"";position:absolute;bottom:4.5em;right:1.5em;width:0;height:0;border-width:0;border-bottom-width:1px;border-right-width:1px;border-style:solid;border-color:#fff;transition:all .8s linear}.portfolio__item:hover .portfolio__item__hover:after,.portfolio__item:hover .portfolio__item__hover:before{width:85%;height:65%}.portfolio__item__hover__title{margin:1.5em 0 0;color:#fff;font-size:2.4em;font-family:'Open Sans',sans-serif;font-weight:400}.portfolio__item__hover__description{max-width:60%;margin:.5em auto 0;color:#fff;font-size:1.3em;font-family:'Source Sans Pro',sans-serif;font-weight:300}.portfolio__item__hover__base-info{position:absolute;left:40%;bottom:3.5em;-webkit-transform:translateX(-35%);transform:translateX(-35%);color:#fff;font-size:1.1em;font-family:'Source Sans Pro',sans-serif;font-weight:300}.portfolio__item__hover__base-info__title{color:#fff;font-size:1.2em;font-family:'Open Sans',sans-serif;font-weight:400}.contact{padding:0 0 3em;background-color:rgb(142, 151, 240);text-align:center}.contact__description{margin:0 auto;color:#fff;font-size:1.4em;font-family:'Source Sans Pro',sans-serif;font-weight:300}.contact__link{display:inline-block;margin-top:1em;font-size:2em;font-family:'Open Sans',sans-serif;font-weight:400;border-bottom:1px solid #fff;transition:all .1s linear}.contact__envelope{background-image:url(../images/envelope.svg);background-size:550px;height:400px;background-position:95% 30%;background-repeat:no-repeat}.contact__social-btn__container{display:block;width:390px;margin:3em auto 0}.contact__btn__link:first-child{margin-left:-1.5em}.contact__social-btn{display:inline-block;width:25px;height:23px;padding:10px;background-color:rgba(255,255,255,.3);border-radius:25px;border:4px solid rgba(255,255,255,1);border-bottom-color:transparent;border-top-color:transparent;transition:all .3s linear;margin-left:-1.3em}.contact__social-btn__container .fa.fa-codepen,.contact__social-btn__container .fa.fa-github,.contact__social-btn__container .fa.fa-linkedin-square,.contact__social-btn__container .fa.fa-twitter,.contact__social-btn__container .fa.fa-youtube{color:#fff;position:relative;left:1.02em;top:-.67em}.contact__social-btn__container .fa.fa-twitter{left:1.05em}.contact__social-btn__container .fa.fa-codepen{left:1.1em}.contact__social-btn:hover{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.footer{border-top:2px solid #cfd2e2;height:100px;background-color:#382266;opacity:0;position:relative;top:2em}.footer__info__container{margin:1.5em 4em 1em;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.footer__copyright{-webkit-box-flex:2;-ms-flex:2;flex:2;margin:0;color:#cfd2e2;font-family:"Open Sans",sans-serif;font-size:1.1em;font-weight:400}.footer-menu__list{-webkit-box-flex:2;-ms-flex:2;flex:2;text-align:center;padding:0}.footer-menu__list-item{display:inline-block;margin:0 .5em;color:#fff;font-size:1.1em;font-family:'Open Sans',sans-serif;font-weight:400;opacity:1}.footer-menu__link{color:#cfd2e2;-webkit-transform:none;transform:none;transition:all .1s linear}.footer-menu__link:hover{color:#fff}.footer__social-btn{-webkit-box-flex:2;-ms-flex:2;flex:2;opacity:1;text-align:right}