aside,body,html{height:100%}.card,.nav__links,.profile__links a{text-decoration:none}*{margin:0;padding:0;box-sizing:border-box}h1,h2,h3,h4{font-family:Bitter,serif;font-weight:700;margin:0}p{margin-bottom:15px}body{font-family:Raleway,sans-serif;line-height:1.5em;font-size:16px;display:flex}hr{box-sizing:content-box;height:0;margin-top:20px;margin-bottom:20px;border-top:1px solid #eee}aside{width:360px;display:inline-block;position:fixed;background:#fff;box-shadow:2px 1px 5px 0 rgba(157,157,158,.75)}.card,.hobby{box-shadow:0 2px 5px rgba(0,0,0,.26)}@media only screen and (max-width:767px){aside{width:75%;max-width:360px;height:100%;z-index:200;position:fixed;overflow-x:hidden;left:-75%;transition:left .3s ease-in}}.active{left:0}.aside__header{background:#ff5252;width:360px;padding-right:50px;text-align:right;height:360px}@media only screen and (max-width:767px){.aside__header{height:150px;width:auto;text-align:left;padding:20px 0 0 50px}}.hobbies__title,.hobby__text,.skills__title,.work__title{text-align:center}.header__name{color:#fff;padding:140px 0 10px}.header__surname{color:#000}@media only screen and (max-width:767px){.header__name{display:block;padding:25px 0 5px;font-size:1.4em}.header__surname{display:block;font-size:1.2em}}.header__job{color:#271218;padding-top:10px}.nav__links,.profile__title{color:#9a999c}@media only screen and (max-width:767px){.header__job{display:block;font-size:14px;padding:0}}.nav__links{border-bottom:1px solid #eee;padding:15px 15px 15px 50px;transition:background ease-out .2s;font-weight:700;display:block;list-style-type:none}.nav__links.active,.nav__links:hover{background:#eee;font-weight:700}.nav__span{vertical-align:top;margin-left:30px}.app-shell{display:none}main{margin-left:400px;width:100%}@media only screen and (max-width:767px){.app-shell{display:block;box-shadow:0 2px 5px rgba(0,0,0,.26);width:100%;background:#ff5252;padding:12px 12px 12px 50px;z-index:100;font-size:50px;position:fixed}main{margin:56px 0 0}}.profile{min-height:100%;background:url(../img/try3.png);background-size:cover;margin:0 0 0 -37px;padding:360px 0 0 50px}.profile ul{border-left:4px solid #d3d3d3}.profile li{padding:15px;list-style-type:none}@media only screen and (max-width:767px){.profile{margin:0;padding:50px 0 0}.profile ul{border:none}.profile li{padding:15px}.profile__title{margin-left:32px;padding:15px}}.profile__links{margin-top:20px}.profile__links a{color:#000}.profile__icons{margin-right:20px;color:#ff5252}.icon-person{color:#ff5252}.icon-assignment{color:#9c27b0}.icon-skills{color:#4caf50}.icon-code{color:#2196f3}.icon-menu{color:#fff;font-size:30px}.icon-github{width:22px;margin-left:10px;vertical-align:top}#hobbies:before,#skills:before,#work:before{display:block;content:" ";padding-top:50px;visibility:hidden}#work{height:100%;background:#f6f9f5;margin-left:-37px;padding-left:37px}@media only screen and (max-width:1199px) and (min-width:992px){#work{height:auto;padding-bottom:50px}}@media only screen and (max-width:991px) and (min-width:768px){#work{height:auto;padding-bottom:50px}}@media only screen and (max-width:767px){#work{padding-top:20px;height:auto;padding-bottom:50px}}.flex{padding:0;margin:0;display:flex;-webkit-flex-flow:row wrap;align-content:flex-start;justify-content:space-around}.card{opacity:.8;font-weight:400;border-radius:2px;margin:10px;padding:5px;background:#fff;color:#000;transition:opacity ease-in .2s}.card:hover{opacity:1}.card__caption{margin:0;color:#000}.sample{width:300px;height:200px;background:#eee;border-radius:4px;padding:10px}#hobbies,#skills{height:100%}.skills__text{margin:0 auto;width:70%;display:block}@media only screen and (max-width:767px){#hobbies,#skills{height:auto;padding-top:20px}.hobbies__title,.skills__title,.work__title{padding-top:0}.skills__text{width:90%;margin:0 15px}}.flex--around{justify-content:space-between;width:70%;margin:0 auto}@media only screen and (max-width:767px){.flex--around{justify-content:space-around}}.hobby{height:auto;width:150px;margin:20px 0}.hobby--reading{background:url(../img/myhealth.png) 50% 100%}.hobby--coding{background:url(../img/code.jpg) 47% 86%}.hobby--cooking{background:url(../img/knife.png) 50% 15% no-repeat}.hobby--gaming{background:url(../img/controller.png) center no-repeat}.hobby__text{padding-top:110px}.non-scroll{overflow:hidden}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:120;background-color:rgba(0,0,0,.5)}