html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{background:url(images/bg.jpg) no-repeat left top fixed;background-size:cover;color:#333;font-family:"Avenir Next",'Roboto',Arial,Helvetica,sans-serif;font-size:62.5%;margin:0;padding:0}body:before{content:'';position:fixed;left:0;top:0;width:100%;height:100%;background-color:#fff;transition:all 0.3s ease-out}h1{font-size:2.4em}h2{font-size:1.5em}b{font-weight:600}p{font-size:1.5em;line-height:1.6;font-weight:400}a{color:#333}.with-bg{color:#fff;text-shadow:0 2px 4px rgba(0,0,0,0.1)}.with-bg:before{content:'';background-color:rgba(0,0,0,0.3);transition:all 0.8s ease}.with-bg a{color:#fff}.container{margin:40px 40px 30px;position:relative;z-index:2}.group:after{content:"";display:table;clear:both}.user{margin-bottom:42px}@media only screen and (min-device-width:768px){.user{text-align:left}}.user img{display:inline-block;border-radius:50%;width:100px;height:100px;box-shadow:0 2px 4px rgba(0,0,0,0.2)}@media only screen and (min-device-width:768px){.user img{float:left;margin-right:18px;width:80px;height:80px}}.user h1{font-weight:400;margin-bottom:0;text-transform:uppercase}@media only screen and (min-device-width:768px){.user h1{padding-top:12px}}.user h2{font-weight:700;margin-top:6px;margin-bottom:0}.header{margin:0 auto 42px}.logo{display:inline-block;width:70px}.switch{display:inline-block;float:right;position:relative;width:30px;cursor:pointer}.switch input[type="checkbox"]{opacity:0;cursor:pointer}.switch div{width:100%;height:2px;position:absolute;background-color:#333;top:50%;transform:translateY(-50%);cursor:pointer;transition:all 0.3s ease}.switch div:after{content:'';width:12px;height:12px;border-radius:50%;position:absolute;left:0%;top:50%;transform:translateY(-50%);background-color:#333;display:inline-block;transition:all 0.3s ease}.switch input[type="checkbox"]:checked + div{background-color:#fff}.switch input[type="checkbox"]:checked + div:after{content:'';left:100%;transform:translate(-50%,-50%);background-color:#fff}.user-details{font-weight:300}@media only screen and (min-device-width:768px){.user-details{max-width:430px}}.tooltip{position:absolute;font-size:0.4em;font-weight:400;text-shadow:none;top:80%;opacity:0;left:50%;display:inline-block;white-space:nowrap;padding:2px 15px;background-color:#333;border-radius:20px;color:#fff;transition:all 0.3s ease;transform:translateX(-50%)}.tooltip:before{content:'';width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #333;position:absolute;top:-5px;left:50%;transform:translateX(-50%)}.with-bg .tooltip{background-color:#fff;color:#333}.with-bg .tooltip:before{content:'';border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #fff}.with-bg svg .st0{fill:#fff}.portfolio{margin-top:66px}.icons{margin:18px 0 0;padding:0;margin-left:-12px}.icons li{list-style:none;display:inline-block;font-size:3.5em;position:relative}@media only screen and (min-device-width:960px){.icons li:hover .tooltip{top:100%;opacity:1}}.icons li:last-child a{padding-right:0}.icons a{text-decoration:none;text-shadow:none;transition:all 0.2s ease;display:block;padding:0 12px}.icons a[class$="mail"]:hover{color:#c43d30}.icons a[class$="dribbble"]:hover{color:#ec4888}.icons a[class$="twitter"]:hover{color:#229ef0}.icons a[class$="instagram"]:hover{color:#579fca}.icons a[class$="linkedin"]:hover{color:#0e76a8}