/* Hello World !

This is minified version of my css (Sass) for performance reason.

Sorry bro, nothing to see here ;)

P.S : dont worry, If you want to know how this website works, please go to
https://github.com/notyourdaniels/dnyworks-portofolio

dnyworks a.k.a Daniel Halim */


@import url(https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Nunito:wght@300;400;700&display=swap);@-webkit-keyframes introOpacity{0%{opacity:0}100%{opacity:1}}@keyframes introOpacity{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeIn{from{opacity:0;-webkit-transform:translate3d(0,-70%,0);transform:translate3d(0,-70%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}@keyframes fadeIn{from{opacity:0;-webkit-transform:translate3d(0,-70%,0);transform:translate3d(0,-70%,0)}to{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}}header{position:fixed;width:100%;background-color:transparent;margin:0;z-index:10}header .container{max-width:1600px;padding:50px 60px;position:relative;margin:0 auto}header .container .logo-header{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_light.png) no-repeat;background-size:200px;width:200px;height:50px;float:left;margin-top:-22px}header .container nav{float:right;margin:0 auto;margin-top:-10px}header .container nav .container-nav ul{display:inline-block}header .container nav .container-nav ul li{display:inline-block;color:#41413f;font-family:Nunito,sans-serif;font-weight:700;font-size:12pt;text-align:center;text-transform:uppercase;margin-right:50px}header .container nav .container-nav ul li .link{cursor:pointer;text-decoration:none;position:relative;margin-bottom:0;padding-bottom:5px;color:inherit;border-bottom:5px solid transparent;-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out}header .container nav .container-nav ul li .link::after{content:"";position:absolute;right:0;width:0;bottom:-5px;background-color:#41413f;height:5px;-webkit-transition:width .3s ease-in-out;transition:width .3s ease-in-out}header .container nav .container-nav ul li .link:focus::after,header .container nav .container-nav ul li .link:hover::after{left:0;right:auto;width:100%}header .container nav .container-nav .darkslider{float:right;margin-top:-19px;display:block}header .container nav .container-nav .darkslider .checkbox{opacity:0}header .container nav .container-nav .darkslider .label{background-color:#c9cece;border-radius:50px;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:5px;height:18px;width:40px;-webkit-transform:scale(1.1);transform:scale(1.1)}header .container nav .container-nav .darkslider .label .ball{background-color:#fff;background-image:url(../icons/sun.svg);background-size:contain;background-size:12px;background-repeat:no-repeat;background-position:center;border-radius:50%;position:absolute;height:20px;width:20px;-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition:.2s linear;transition:.2s linear}header .container nav .container-nav .darkslider .checkbox:checked+.label .ball{-webkit-transform:translateX(21px);transform:translateX(21px);background-image:url(../icons/moon.svg);background-color:#3e3e3e;-webkit-transition:.2s linear;transition:.2s linear}.solidHeader{background-color:#fff;-webkit-transition:.2s linear;transition:.2s linear}.solidHeaderShadow{background-color:#fff;-webkit-box-shadow:0 0 10px 5px #e1e1e1;box-shadow:0 0 10px 5px #e1e1e1;-webkit-transition:.2s linear;transition:.2s linear}body.dark header{-webkit-transition:background .2s linear;transition:background .2s linear}body.dark header .container .logo-header{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_dark.png) no-repeat;background-size:200px;width:200px;height:50px}body.dark header .container nav .container-nav ul li{color:#ccc}body.dark header .container nav .container-nav ul li .link::after{background-color:#ccc}body.dark header.solidHeader{background-color:#3e3e3e;-webkit-transition:.2s linear;transition:.2s linear}body.dark .solidHeaderShadow{background-color:#3e3e3e;-webkit-box-shadow:0 0 10px 5px #313131;box-shadow:0 0 10px 5px #313131;-webkit-transition:.2s linear;transition:.2s linear}@media only screen and (max-width:960px){header .container .burger-menu{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/burgermenu_light.svg) no-repeat;background-size:30px;width:30px;height:30px;float:right;margin-top:-10px;cursor:pointer}header .container .burger-menu:hover{-webkit-filter:invert(50%);filter:invert(50%)}header .container nav{-webkit-transform:translateX(100%);transform:translateX(100%);clear:both;position:fixed;bottom:0;right:0;background-color:#ebe9e9;opacity:1;height:100%;width:300px;border-radius:30px 0 0 30px;-webkit-box-shadow:none;box-shadow:none;margin:0;padding:0}header .container nav .container-nav{margin:30px 45px}header .container nav .container-nav .cross-burger{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/cross.svg) no-repeat;background-size:20px;width:20px;height:20px;background-position:center;border-radius:50px;padding:20px 35px;background-color:#008fff;float:right;cursor:pointer}header .container nav .container-nav .cross-burger:hover{background-color:#44adff}header .container nav .container-nav ul{clear:both;display:block;padding:40px 0 20px 0}header .container nav .container-nav ul li{display:block;margin:22px 0;text-align:left;font-size:14pt;font-weight:400}header .container nav .container-nav .darkslider{float:left}header nav.nav-mobile{-webkit-transform:translateX(0);transform:translateX(0);-webkit-box-shadow:0 0 6.6px rgba(0,0,0,.042),0 0 15.8px rgba(0,0,0,.061),0 0 29.7px rgba(0,0,0,.075),0 0 52.9px rgba(0,0,0,.089),0 0 99px rgba(0,0,0,.108),0 0 237px rgba(0,0,0,.15);box-shadow:0 0 6.6px rgba(0,0,0,.042),0 0 15.8px rgba(0,0,0,.061),0 0 29.7px rgba(0,0,0,.075),0 0 52.9px rgba(0,0,0,.089),0 0 99px rgba(0,0,0,.108),0 0 237px rgba(0,0,0,.15)}body.dark header .container .burger-menu{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/burgermenu_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark header .container .nav-mobile{background-color:#575555}body.dark header .container .nav-mobile .container-nav .cross-burger{background-color:#44adff}body.dark header .container .nav-mobile .container-nav .cross-burger:hover{background-color:#008fff}}@media only screen and (max-width:560px){header .container{padding:50px 30px}header .container .logo-header{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_light_mobile.png) no-repeat;background-size:40px;width:40px;height:40px}body.dark header .container .logo-header{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_dark_mobile.png) no-repeat;background-size:40px;width:40px;height:40px}}footer{margin-top:100px;display:block;background-color:#ebe9e9;width:100%}footer .container{position:relative;margin:0 auto;height:100%;max-width:1200px;padding:30px 60px 30px 60px}footer .container .container-top .logo-footer{float:left;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_light.png) no-repeat;background-size:170px;width:170px;height:50px}footer .container .container-top .container-links{float:right;margin-top:8px}footer .container .container-top .container-links ul li{font-family:Nunito,sans-serif;font-weight:300;text-transform:uppercase;display:inline;color:#41413f;margin-left:50px;font-size:12pt}footer .container .container-top .container-links ul li .link{text-decoration:none;color:inherit}footer .container .container-top .container-social{clear:both}footer .container .container-top .container-social ul li{display:inline-block;margin:0 10px}footer .container .container-top .container-social ul li .insta{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/insta_light.png) no-repeat;background-size:25px;width:25px;height:25px}footer .container .container-top .container-social ul li .github{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/github_light.png) no-repeat;background-size:25px;width:25px;height:25px}footer .container .container-top .container-social ul li .linkedin{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/linkedin_light.png) no-repeat;background-size:25px;width:25px;height:25px}footer .container .container-bottom hr{clear:both;margin:40px 0 20px 0;border:none;background-color:#41413f;color:#41413f;height:1.5px;opacity:.5}footer .container .container-bottom .container-copyright{text-align:center}footer .container .container-bottom .container-copyright span{font-family:Lato,sans-serif;font-weight:700;font-size:12pt;letter-spacing:.001em;color:#41413f}footer .container .container-bottom .container-copyright #random-text{margin-top:2px;font-family:Lato,sans-serif;font-weight:400;font-size:12pt;color:#41413f}body.dark footer{background-color:#575555;-webkit-transition:background .2s linear;transition:background .2s linear}body.dark footer .container .container-top .logo-footer{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/logo_dark.png) no-repeat;background-size:170px;width:170px;height:50px}body.dark footer .container .container-top .container-links ul li{color:#ccc}body.dark footer .container .container-top .container-social ul li .insta{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/insta_dark.png) no-repeat;background-size:25px;width:25px;height:25px}body.dark footer .container .container-top .container-social ul li .github{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/github_dark.png) no-repeat;background-size:25px;width:25px;height:25px}body.dark footer .container .container-top .container-social ul li .linkedin{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/linkedin_dark.png) no-repeat;background-size:25px;width:25px;height:25px}body.dark footer .container .container-bottom hr{background-color:#ccc;color:#ccc}body.dark footer .container .container-bottom .container-copyright span{font-family:Lato,sans-serif;font-weight:700;color:#ccc}body.dark footer .container .container-bottom .container-copyright #random-text{color:#ccc}@media only screen and (max-width:960px){footer .container{height:100%}footer .container .container-top .logo-footer{display:block;margin:0 auto;background-size:170px;width:170px;float:none}footer .container .container-top .container-links{float:none;text-align:center;margin-top:5px}footer .container .container-top .container-links ul li{margin:0 25px}footer .container .container-top .container-social{text-align:center;margin-top:35px}}@media only screen and (max-width:560px){footer .container .container-top .container-links ul li{display:block;margin:20px 0}}header.home{-webkit-animation:1s ease-in 0s 1 introOpacity;animation:1s ease-in 0s 1 introOpacity}.mobile-ver{opacity:0;position:fixed;z-index:-5;width:100%;height:100vh;background-image:url(../images/home_page1.png);background-position:center;background-repeat:no-repeat;background-size:cover}.mobile-ver .container-mobile{margin:0;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.mobile-ver .container-mobile #greetings-1-mobile{font-family:Nunito,sans-serif;font-weight:700;font-size:80pt;color:#008fff;opacity:1;text-align:center}.mobile-ver .container-mobile #greetings-2-mobile,.mobile-ver .container-mobile #greetings-3-mobile{font-family:Nunito,sans-serif;font-weight:400;font-size:16pt;text-align:center;color:#41413f}.mobile-ver .container-mobile #greetings-3-mobile{font-family:Nunito,sans-serif;font-weight:700;margin-bottom:50px}.mobile-ver .container-mobile #button-container-mobile{margin:0 auto}.mobile-ver .container-mobile #button-container-mobile ul li{list-style-type:none;text-align:center;margin:20px 0}.mobile-ver .container-mobile #button-container-mobile ul li a button{text-decoration:none;cursor:pointer;font-family:Nunito,sans-serif;font-weight:700;font-size:14pt;text-align:center;border-radius:50px;padding:15px;width:300px;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.mobile-ver .container-mobile #button-container-mobile ul li a .button1{background-color:#008fff;color:#fff;border:none}.mobile-ver .container-mobile #button-container-mobile ul li a .button1:hover{background-color:#007ad8}.mobile-ver .container-mobile #button-container-mobile ul li a .button2{font-family:Nunito,sans-serif;font-weight:700;position:relative;background-color:transparent;border:2px solid #008fff;color:#008fff}.mobile-ver .container-mobile #button-container-mobile ul li a .button2:hover{border-color:transparent;background-color:#008fff;color:#fff}.home-contents{position:fixed}.home-contents .section{text-align:center;display:block;position:relative}.home-contents .s1{-webkit-animation:1s ease-in 0s 1 introOpacity;animation:1s ease-in 0s 1 introOpacity;background-image:url(../images/home_page1.png);background-position:center;background-repeat:no-repeat;background-size:cover}.home-contents .s1 #greetings-1{font-family:Nunito,sans-serif;font-weight:700;font-size:130pt;color:#008fff;opacity:1;-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out}.home-contents .s1 #action-swipe{font-family:Lato,sans-serif;font-weight:300;margin-top:-20px;font-size:18pt;color:#41413f;opacity:1;-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out}.home-contents .s2{-webkit-animation:1s ease-in 0s 1 introOpacity;animation:1s ease-in 0s 1 introOpacity;background-image:url(../images/home_page2.png);background-position:center;background-repeat:no-repeat;background-size:cover}.home-contents .s2 #greetings-2{font-family:Nunito,sans-serif;font-weight:400;font-size:50pt;color:#008fff;opacity:1;-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out}.home-contents .s2 #greetings-3{font-family:Nunito,sans-serif;font-weight:700;margin-top:-10px;font-size:50pt;color:#008fff;opacity:1;-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out}.home-contents .s2 #button-info{display:absolute;margin-top:4%}.home-contents .s2 #button-info .button1{font-family:Nunito,sans-serif;font-weight:700;background-color:#008fff;border:none;border-radius:50px;cursor:pointer;color:#fff;padding:15px;text-align:center;text-decoration:none;display:inline-block;font-size:15pt;width:550px;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.home-contents .s2 #button-info .button1:hover{background-color:#007ad8;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.home-contents .s2 #button-info #button-container{margin:0 auto}.home-contents .s2 #button-info #button-container .button2{-webkit-appearance:button;-moz-appearance:button;appearance:button;text-decoration:none;font-family:Nunito,sans-serif;font-weight:700;position:relative;background-color:transparent;border:2px solid #008fff;border-radius:50px;cursor:pointer;color:#008fff;padding:15px;text-align:center;text-decoration:none;display:inline-block;font-size:15pt;width:235px;margin:15px 5px;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.home-contents .s2 #button-info #button-container .button2:hover{border-color:transparent;background-color:#008fff;color:#fff;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}body.dark .home-contents svg{opacity:10%}body.dark .s1{background-image:url(../images/home_page1_dark.png)}body.dark .s1 #greetings-1{color:#44adff}body.dark .s1 #action-swipe{color:#ccc}body.dark .s2{background-image:url(../images/home_page2_dark.png)}body.dark .s2 #greetings-2{color:#44adff}body.dark .s2 #greetings-3{color:#44adff}body.dark .s2 #button-info .button1{background-color:#44adff}body.dark .s2 #button-info .button1:hover{background-color:#008fff}body.dark .s2 #button-info #button-container .button2{border-color:#44adff;color:#44adff}body.dark .s2 #button-info #button-container .button2:hover{background-color:#44adff;color:#fff}body.dark .mobile-ver{background-image:url(../images/home_page1_dark.png)}body.dark .mobile-ver .container-mobile{-webkit-animation:1s ease-in 0s 1 introOpacity;animation:1s ease-in 0s 1 introOpacity}body.dark .mobile-ver .container-mobile #greetings-1-mobile{color:#44adff}body.dark .mobile-ver .container-mobile #greetings-2-mobile,body.dark .mobile-ver .container-mobile #greetings-3-mobile{color:#ccc}body.dark .mobile-ver .container-mobile #button-container-mobile ul li .button1{background-color:#44adff}body.dark .mobile-ver .container-mobile #button-container-mobile ul li .button1:hover{background-color:#008fff}body.dark .mobile-ver .container-mobile #button-container-mobile ul li .button2{border-color:#44adff;color:#44adff}body.dark .mobile-ver .container-mobile #button-container-mobile ul li .button2:hover{background-color:#44adff;color:#fff}@media only screen and (max-width:960px){.mobile-ver{opacity:1;z-index:2}.home-contents{opacity:0}}.work-contents{min-height:800px;height:100vh;max-width:1200px;margin:0 auto;padding:10px 60px 0 60px;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}.work-contents .container{-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:1200px}.work-contents .container .section-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;display:-webkit-box;display:-ms-flexbox;display:flex;margin-right:80px}.work-contents .container .section-2{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}.work-contents .container .section-2 .coverWorks{position:relative;-webkit-box-flex:1;-ms-flex:1 0 30%;flex:1 0 30%;margin:5px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;max-width:300px;max-height:300px;min-height:200px;min-width:200px;overflow:hidden;border-radius:20px}.work-contents .container .section-2 .coverWorks img{display:block;width:100%;height:100%;-webkit-transition:visibility .25s ease-in,-webkit-transform .25s;transition:visibility .25s ease-in,-webkit-transform .25s;transition:transform .25s,visibility .25s ease-in;transition:transform .25s,visibility .25s ease-in,-webkit-transform .25s}.work-contents .container .section-2 .coverWorks .cover-middle{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:100%;height:100%;-webkit-transition:opacity .2s ease-in;transition:opacity .2s ease-in;background:-webkit-gradient(linear,left top,left bottom,from(transparent),to(black));background:linear-gradient(to bottom,transparent 0,#000 100%);opacity:0}.work-contents .container .section-2 .coverWorks .cover-middle .cover-next{position:absolute;top:20px;right:20px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/arrow-left.svg) no-repeat;background-size:25px;width:25px;height:25px;-webkit-transform:scaleX(-1);transform:scaleX(-1);background-position:center;background-color:#008fff;border-radius:100px;width:50px;height:50px;-webkit-box-shadow:0 2.8px 2.2px rgba(0,0,0,.02),0 6.7px 5.3px rgba(0,0,0,.028),0 12.5px 10px rgba(0,0,0,.035),0 22.3px 17.9px rgba(0,0,0,.042),0 41.8px 33.4px rgba(0,0,0,.05),0 100px 80px rgba(0,0,0,.07);box-shadow:0 2.8px 2.2px rgba(0,0,0,.02),0 6.7px 5.3px rgba(0,0,0,.028),0 12.5px 10px rgba(0,0,0,.035),0 22.3px 17.9px rgba(0,0,0,.042),0 41.8px 33.4px rgba(0,0,0,.05),0 100px 80px rgba(0,0,0,.07)}.work-contents .container .section-2 .coverWorks .cover-middle .text-cover{position:absolute;padding:25px;bottom:0;color:#fff}.work-contents .container .section-2 .coverWorks .cover-middle .text-cover h1{font-size:24pt;font-family:Lato,sans-serif;font-weight:700}.work-contents .container .section-2 .coverWorks .cover-middle .text-cover h2{margin-top:3px;font-size:18px;font-family:Lato,sans-serif;font-weight:300}.work-contents .container .section-2 .coverWorks:hover img{-webkit-transform:scale(1.2);transform:scale(1.2)}.work-contents .container .section-2 .coverWorks:hover .cover-middle{opacity:1}body.dark .work-contents .container .section-2 .cover-middle .cover-next{background-color:#44adff}@media only screen and (max-width:960px){.work-contents{display:block;min-height:900px}.work-contents .container{display:block;margin-top:18%}.work-contents .container .section-1{display:block;margin-bottom:50px}.work-contents .container .section-2 .coverWorks{max-width:300px;max-height:300px;min-height:150px;min-width:150px}.work-contents .container .section-2 .coverWorks .cover-middle .text-cover h1{font-size:18pt}.work-contents .container .section-2 .coverWorks .cover-middle .text-cover h2{font-size:16px}}@media only screen and (max-width:560px){.work-contents{padding:50px 30px}}.insidework-contents{min-height:800px;height:100vh;margin:0 auto;padding:10px 60px 0 60px;max-width:1600px;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}.insidework-contents .container{-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.insidework-contents .container .section-1{margin-right:80px;min-width:400px;width:80%;height:auto}.insidework-contents .container .section-1 .swiper-container{border-radius:30px}.insidework-contents .container .section-1 .swiper-container .swiper-wrapper .swiper-slide img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:30px}.insidework-contents .container .section-1 .swiper-container .swiper-scrollbar{-webkit-transform:rotate(90deg) translateY(-50%);transform:rotate(90deg) translateY(-50%);top:50%;left:87%;width:15%;height:2%;background-color:#ebe9e9;opacity:.4}.insidework-contents .container .section-1 .swiper-container .swiper-scrollbar-drag{background-color:#008fff}.insidework-contents .container .section-2{width:30%;color:#41413f}.insidework-contents .container .section-2 h1{font-family:Nunito,sans-serif;font-weight:700;text-transform:uppercase;font-size:20pt;text-align:center}.insidework-contents .container .section-2 h2{font-family:Nunito,sans-serif;font-weight:300;text-transform:uppercase;font-size:14pt;text-align:center;margin-top:10px}.insidework-contents .container .section-2 hr{margin:10px auto 50px auto;border:none;background-color:#41413f;color:#41413f;height:2px;width:150px}.insidework-contents .container .section-2 p{font-family:Lato,sans-serif;font-weight:300;font-size:14pt;line-height:1.5}.insidework-contents .container .section-2 h3{margin-top:30px;font-family:Lato,sans-serif;font-weight:400;font-size:12pt;opacity:.5}.insidework-contents .container .section-2 .button-back{margin-top:12%;padding:7px 0 10px 30px;width:150px;height:50px;border:none;border-radius:50px;background:#008fff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px;font-family:Lato,sans-serif;font-weight:700;font-size:12pt;color:#fff;cursor:pointer;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.insidework-contents .container .section-2 .button-back:hover{background:#44adff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px}body.dark .insidework-contents .container .section-2{color:#ccc}body.dark .insidework-contents .container .section-2 hr{background-color:#ccc;color:#ccc}body.dark .insidework-contents .container .section-2 .button-back{background:#44adff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px}body.dark .insidework-contents .container .section-2 .button-back:hover{background:#008fff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px}@media only screen and (max-width:960px){.insidework-contents{display:block;margin:0;padding:0;height:-webkit-max-content;height:-moz-max-content;height:max-content}.insidework-contents .container{display:block;padding-top:11vh}.insidework-contents .container .section-1{margin:0;width:100%;height:auto}.insidework-contents .container .section-1 .swiper-container{border-radius:0}.insidework-contents .container .section-1 .swiper-container .swiper-wrapper .swiper-slide img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:0}.insidework-contents .container .section-1 .swiper-container .swiper-scrollbar{-webkit-transform:rotate(0) translateX(290%);transform:rotate(0) translateX(290%);top:90%;left:0;bottom:0;width:15%;height:2%}.insidework-contents .container .section-2{width:80%;display:block;margin:30px auto;color:#41413f}.insidework-contents .container .section-2 h1{font-family:Nunito,sans-serif;font-weight:700;text-transform:uppercase;font-size:20pt;text-align:center}.insidework-contents .container .section-2 h2{font-family:Nunito,sans-serif;font-weight:300;text-transform:uppercase;font-size:14pt;text-align:center;margin-top:10px}.insidework-contents .container .section-2 hr{margin:10px auto 50px auto;border:none;background-color:#41413f;color:#41413f;height:2px;width:150px}.insidework-contents .container .section-2 p{font-family:Lato,sans-serif;font-weight:300;font-size:14pt;line-height:1.5}.insidework-contents .container .section-2 h3{margin-top:30px;font-family:Lato,sans-serif;font-weight:400;font-size:12pt;opacity:.5}.insidework-contents .container .section-2 .button-back{margin-top:12%;padding:7px 0 10px 30px;width:150px;height:50px;border:none;border-radius:50px;background:#008fff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px;font-family:Lato,sans-serif;font-weight:700;font-size:12pt;color:#fff;cursor:pointer;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.insidework-contents .container .section-2 .button-back:hover{background:#44adff url(../icons/arrow-left.svg);background-position:26px 15px;background-repeat:no-repeat;background-size:20px}}@media only screen and (max-width:560px){.work-contents{padding:50px 30px}}.contact-contents{position:relative;min-height:800px;height:100vh;max-width:1200px;margin:auto;padding:10px 110px 0 60px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.contact-contents .container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both}.contact-contents .container .section-1{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;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:justify;-ms-flex-pack:justify;justify-content:space-between}.contact-contents .container .section-1 .bottom-section p{font-family:Nunito,sans-serif;font-weight:300;font-size:14pt;color:#41413f;margin-bottom:10px}.contact-contents .container .section-1 .bottom-section p b{font-family:Nunito,sans-serif;font-weight:700}.contact-contents .container .section-1 .bottom-section p a{text-decoration:none;color:inherit}.contact-contents .container .section-1 .bottom-section p a:hover{opacity:.5}.contact-contents .container .section-1 .bottom-section ul li{display:inline-block;margin-right:35px}.contact-contents .container .section-1 .bottom-section ul li .insta{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/insta_light.png) no-repeat;background-size:35px;width:35px;height:35px}.contact-contents .container .section-1 .bottom-section ul li .github{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/github_light.png) no-repeat;background-size:35px;width:35px;height:35px}.contact-contents .container .section-1 .bottom-section ul li .linkedin{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/linkedin_light.png) no-repeat;background-size:35px;width:35px;height:35px}.contact-contents .container .section-1 .bottom-section ul li:hover{opacity:.5}.contact-contents .container .section-2{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;margin:0;border-left:3px solid;border-color:#41413f;height:600px;margin:0 100px}.contact-contents .container .section-3{color:#41413f;-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3;width:70%;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}.contact-contents .container .section-3 p{font-family:Nunito,sans-serif;font-weight:400;font-size:14pt}.contact-contents .container .section-3 .input-contact li{list-style:none;margin:20px 0}.contact-contents .container .section-3 .input-contact li input,.contact-contents .container .section-3 .input-contact li textarea{overflow:auto;padding:0 30px;width:100%;resize:none;border:none;border-radius:15px;height:40px;background-color:#ebe9e9;color:#41413f;font-family:Lato,sans-serif;font-weight:400;font-size:12pt}.contact-contents .container .section-3 .input-contact li input:focus,.contact-contents .container .section-3 .input-contact li textarea:focus{outline:0}.contact-contents .container .section-3 .input-contact li ::-webkit-input-placeholder{font-family:Lato,sans-serif;font-weight:400;color:#41413f;opacity:.5}.contact-contents .container .section-3 .input-contact li :-ms-input-placeholder{font-family:Lato,sans-serif;font-weight:400;color:#41413f;opacity:.5}.contact-contents .container .section-3 .input-contact li ::-ms-input-placeholder{font-family:Lato,sans-serif;font-weight:400;color:#41413f;opacity:.5}.contact-contents .container .section-3 .input-contact li ::placeholder{font-family:Lato,sans-serif;font-weight:400;color:#41413f;opacity:.5}.contact-contents .container .section-3 .input-contact li textarea{padding:10px 30px;height:200px}.contact-contents .container .section-3 .input-contact .button2{overflow:hidden;margin-top:12%;padding:6px 30px 10px 0;width:150px;height:50px;border:none;border-radius:50px;background:#008fff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px;font-family:Lato,sans-serif;font-weight:700;font-size:12pt;color:#fff;cursor:pointer;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.contact-contents .container .section-3 .input-contact .button2:hover{background:#44adff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px}body.dark .contact-contents .container .section-1 .bottom-section p{color:#ccc}body.dark .contact-contents .container .section-1 .bottom-section ul li .insta{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/insta_dark.png) no-repeat;background-size:35px;width:35px;height:35px}body.dark .contact-contents .container .section-1 .bottom-section ul li .github{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/github_dark.png) no-repeat;background-size:35px;width:35px;height:35px}body.dark .contact-contents .container .section-1 .bottom-section ul li .linkedin{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/linkedin_dark.png) no-repeat;background-size:35px;width:35px;height:35px}body.dark .contact-contents .container .section-2{border-color:#ccc}body.dark .contact-contents .container .section-3{color:#ccc}body.dark .contact-contents .container .section-3 .input-contact li input,body.dark .contact-contents .container .section-3 .input-contact li textarea{background-color:#575555;color:#ccc}body.dark .contact-contents .container .section-3 .input-contact li ::-webkit-input-placeholder{color:#ccc}body.dark .contact-contents .container .section-3 .input-contact li :-ms-input-placeholder{color:#ccc}body.dark .contact-contents .container .section-3 .input-contact li ::-ms-input-placeholder{color:#ccc}body.dark .contact-contents .container .section-3 .input-contact li ::placeholder{color:#ccc}body.dark .contact-contents .container .section-3 .input-contact .button2{background:#44adff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px}body.dark .contact-contents .container .section-3 .input-contact .button2:hover{background:#008fff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px}@media only screen and (max-width:960px){.contact-contents{display:block;height:-webkit-max-content;height:-moz-max-content;height:max-content}.contact-contents .container{padding-top:25%;display:block}.contact-contents .container .section-1{display:block}.contact-contents .container .section-1 .top-section{margin-bottom:100px}.contact-contents .container .section-2{border-left:none;border-bottom:3px solid;height:0;width:100%;margin:100px auto}.contact-contents .container .section-3{color:#41413f;-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3;width:100%;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}.contact-contents .container .section-3 p{font-family:Nunito,sans-serif;font-weight:400;font-size:14pt}.contact-contents .container .section-3 .input-contact li{list-style:none;margin:20px 0}.contact-contents .container .section-3 .input-contact li input,.contact-contents .container .section-3 .input-contact li textarea{width:87%}.contact-contents .container .section-3 .input-contact .button2{margin-top:12%;padding:6px 30px 10px 0;width:150px;height:50px;border:none;border-radius:50px;background:#008fff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px;font-family:Lato,sans-serif;font-weight:700;font-size:12pt;color:#fff;cursor:pointer;-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.contact-contents .container .section-3 .input-contact .button2:hover{background:#44adff url(../icons/send.svg);background-position:86px 15px;background-repeat:no-repeat;background-size:20px}}@media only screen and (max-width:560px){.contact-contents{padding:50px 30px 0 30px}}.about-contents{position:relative;max-width:1200px;margin:0 auto}.about-contents .container{padding:120px 60px 0 60px}.about-contents .container .section-1{-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both;margin-top:1vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.about-contents .container .section-1 .left-section1{-webkit-box-flex:40%;-ms-flex:40%;flex:40%}.about-contents .container .section-1 .left-section1 img{max-width:350px;border-radius:20px}.about-contents .container .section-1 .right-section1{-webkit-box-flex:70%;-ms-flex:70%;flex:70%;padding-left:40px}.about-contents .container .section-1 .right-section1 p{font-family:Lato,sans-serif;font-weight:400;padding:10% 30% 0 0;font-size:12pt;line-height:30px;color:#41413f}.about-contents .container hr.divider-about{-webkit-animation:2s ease-in 0s 1 introOpacity;animation:2s ease-in 0s 1 introOpacity;margin:100px 0 100px 0;border:none;height:2px;color:#41413f;background-color:#41413f}.about-contents .container .section-2{-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both;margin-bottom:150px}.about-contents .container .section-2 .second-section2 .skillset-left{float:left}.about-contents .container .section-2 .second-section2 .skillset-left li{margin:30px 0}.about-contents .container .section-2 .second-section2 .skillset-left .logo-ai{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/illustrator.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-left .logo-xd{margin-top:40px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/xd.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-left .logo-html{margin-top:40px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/html5.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-left .logo-sass{margin-top:40px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/sass.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-left .logo-js{margin-top:40px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/js.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-left .logo-node{margin-top:40px;display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/node.svg) no-repeat;background-size:30px;width:30px;height:30px}.about-contents .container .section-2 .second-section2 .skillset-right ul li{position:relative;list-style:none;margin:50px 0 50px 50px;color:red;padding:10px 0}.about-contents .container .section-2 .second-section2 .skillset-right ul li:before{content:"";position:absolute;top:calc(100% + 10px);left:0;width:100%;height:30px;background-color:#ebe9e9;border-radius:1000px}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills:after{content:"";position:absolute;top:calc(100% + 10px);left:0;width:0;height:30px;background-color:#008fff;border-radius:1000px;-webkit-animation-duration:.7s;animation-duration:.7s;-webkit-animation-timing-function:ease;animation-timing-function:ease;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.ai:after{-webkit-animation-name:ai;animation-name:ai}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.xd:after{-webkit-animation-name:xd;animation-name:xd}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.html:after{-webkit-animation-name:html;animation-name:html}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.sass:after{-webkit-animation-name:sass;animation-name:sass}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.js:after{-webkit-animation-name:js;animation-name:js}.about-contents .container .section-2 .second-section2 .skillset-right ul li.toggle-skills.node:after{-webkit-animation-name:node;animation-name:node}@-webkit-keyframes ai{to{width:90%}}@keyframes ai{to{width:90%}}@-webkit-keyframes xd{to{width:82%}}@keyframes xd{to{width:82%}}@-webkit-keyframes html{to{width:85%}}@keyframes html{to{width:85%}}@-webkit-keyframes sass{to{width:82%}}@keyframes sass{to{width:82%}}@-webkit-keyframes js{to{width:75%}}@keyframes js{to{width:75%}}@-webkit-keyframes node{to{width:64%}}@keyframes node{to{width:64%}}body.dark .about-contents .container .section-1 .right-section1 p{color:#ccc}body.dark .about-contents .container hr.divider-about{color:#ccc;background-color:#ccc}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-ai{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/illustrator_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-xd{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/xd_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-html{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/html5_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-sass{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/sass_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-js{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/js_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-left .logo-node{display:block;-webkit-box-sizing:border-box;box-sizing:border-box;background:url(../icons/node_dark.svg) no-repeat;background-size:30px;width:30px;height:30px}body.dark .about-contents .container .section-2 .second-section2 .skillset-right ul li:before{background-color:#575555}body.dark .about-contents .container .section-2 .second-section2 .skillset-right ul li:after{background-color:#44adff}@media only screen and (max-width:960px){.about-contents{height:-webkit-max-content;height:-moz-max-content;height:max-content}.about-contents .container .section-1{padding-top:1vh;-webkit-animation:fadeIn .8s ease-out both;animation:fadeIn .8s ease-out both;display:block;width:100%}.about-contents .container .section-1 .left-section1{padding:0;margin:0;margin-bottom:40px}.about-contents .container .section-1 .left-section1 img{display:block;margin:0 auto;padding:0;width:300px;height:300px;-o-object-fit:cover;object-fit:cover;border-radius:20px}.about-contents .container .section-1 .right-section1 p{font-family:Lato,sans-serif;font-weight:400;padding:10% 0 0 0;font-size:12pt;line-height:30px;color:#41413f}}@media only screen and (max-width:560px){.about-contents .container{padding:100px 30px}}*{margin:0;padding:0}body{background-color:#fff;-webkit-transition:background .2s linear;transition:background .2s linear}body.dark{background-color:#3e3e3e;-webkit-transition:background .2s linear;transition:background .2s linear}.universal-header h1{font-family:Nunito,sans-serif;font-weight:700;text-transform:uppercase;font-size:40pt;color:#41413f}.universal-header h2{font-family:Nunito,sans-serif;font-weight:700;text-transform:uppercase;font-size:40pt;color:#008fff;padding-bottom:20px}.universal-header hr.divider-universalHeader{border:none;border-radius:5px;height:5px;width:220px;color:#41413f;background-color:#41413f}body.dark .universal-header h1{color:#ccc}body.dark .universal-header h2{color:#44adff}body.dark .universal-header hr{color:#ccc;background-color:#ccc}