-
Notifications
You must be signed in to change notification settings - Fork 0
/
style.min.css
1 lines (1 loc) · 5.5 KB
/
style.min.css
1
/*! locomotive-scroll v3.5.4 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */html.has-scroll-smooth{overflow:hidden}html.has-scroll-dragging{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.has-scroll-smooth body{overflow:hidden}.has-scroll-smooth [data-scroll-container]{min-height:100vh}.c-scrollbar{position:absolute;right:0;top:0;width:11px;height:100vh;transform-origin:center right;transition:transform .3s,opacity .3s;opacity:0}.c-scrollbar:hover{transform:scaleX(1.45)}.c-scrollbar:hover,.has-scroll-dragging .c-scrollbar,.has-scroll-scrolling .c-scrollbar{opacity:1}.c-scrollbar_thumb{position:absolute;top:0;right:0;background-color:#000;opacity:.5;width:7px;border-radius:10px;margin:2px;cursor:-webkit-grab;cursor:grab}.has-scroll-dragging .c-scrollbar_thumb{cursor:-webkit-grabbing;cursor:grabbing}@font-face{font-family:Gilroy;src:url(assets/Gilroy-Regular.woff)}@font-face{font-family:GilroyBold;src:url(assets/Gilroy-Bold.woff)}:root{--blue:#3C78D8;--pad50:120px;--white:#fff}.white{color:#fff}.blue{color:var(--blue)}h1,h2,h3,h4{line-height:1.3em}strong{font-family:GilroyBold}h1{font-size:5em;margin:.5em 0 0;color:var(--blue);font-weight:600;font-family:GilroyBold}h2{font-size:2.5em}h2{font-size:1.9em}a.link-hover{display:inline-flex;font-family:GilroyBold;cursor:pointer}body{background-color:#222;font:normal 24px Gilroy;color:#fff;margin:0;padding:0;overflow-x:hidden;line-height:1.6em}a{color:var(--white);text-decoration:none}header{position:sticky;top:0;padding:20px 100px;text-align:center;z-index:3}header ul{display:flex;align-items:center;justify-content:center;padding:0;margin:0;width:100%}header a{color:#aaa;text-transform:uppercase;font-size:12px;font-weight:bolder;text-decoration:none;transition:all .5s}header a:hover{color:#222}header a.active{color:var(--blue)}header ul li{list-style:none;padding:10px 25px}section{min-height:50vh;padding:100px}.flex{display:flex;align-content:center;justify-content:center}.flex div{align-items:center;padding:0 50px;max-width:60%}.intro h1,.iphone-text h1{text-align:center}.iphone-text{width:50vw}.intro h1,.intro h2{text-align:center}.intro{width:70vw;margin:0 auto}.intro h1{width:70vw;text-align:center}.text{width:60vw;margin:auto}.center{text-align:center}img{width:100%}img.iphone{width:350px;height:auto}.c-scrollbar_thumb{background-color:var(--blue)}.intro-work{display:flex;margin-bottom:-10vh}.intro-work div{max-width:33%;padding:var(--pad50)}.intro-work div img{transform:skew(-10deg,-10deg) rotate(10deg);filter:grayscale(95%);transition:.25s all ease-out}.intro-work div img:hover{transform:skew(-10deg,-5deg) scale(1.1);filter:grayscale(0)}.cta{font-family:Gilroy;font-size:1.2em;padding:25px 50px;background-color:var(--blue);border-radius:50px;box-shadow:#fff 0 0 0}footer{background-color:var(--blue);color:var(--white);padding:50px}ul.transition{display:flex;position:absolute;z-index:10;height:100vh;width:100%;top:0;left:0;margin:0;padding:0;pointer-events:none}ul.transition li{transform:scaleY(0);background:var(--blue);width:33.3%;list-style-type:none}img.side{width:auto;height:700px;padding-left:25px}.iphone-side{text-align:right}.scroll-downs{margin:auto;width:34px;height:55px}.mousey{width:3px;padding:10px 15px;height:35px;border:2px solid #666;border-radius:25px;opacity:.75;box-sizing:content-box}.scroller{width:4px;height:12px;border-radius:25%;background-color:#fff;animation-name:scroll;animation-duration:2s;animation-timing-function:cubic-bezier(.15,.41,.69,.94);animation-iteration-count:infinite}@keyframes scroll{0%{opacity:0}10%{transform:translateY(0);opacity:1}90%{transform:translateY(15px);opacity:.3}100%{transform:translateY(0);opacity:0}}.lines{position:fixed;top:0;left:0;right:0;height:100vh;margin:auto;width:90vw}.line{position:absolute;width:1px;height:100%;top:0;left:50%;background:rgba(92,92,92,.1);overflow:hidden}.line::after{content:"";display:block;position:absolute;height:15vh;width:100%;top:-50%;left:0;background:linear-gradient(to bottom,rgba(255,255,255,0) 0,var(--blue) 75%,var(--blue) 100%);-webkit-animation:drop 7s 0s infinite;animation:drop 7s 0s infinite;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:cubic-bezier(.4,.26,0,.97);animation-timing-function:cubic-bezier(.4,.26,0,.97)}.line:nth-child(1){margin-left:-25%}.line:nth-child(4){margin-left:-40%}.line:nth-child(6){margin-left:-50%}.line:nth-child(3){margin-left:25%}.line:nth-child(5){margin-left:40%}.line:nth-child(7){margin-left:50%}.line:nth-child(1)::after{animation-delay:2s}.line:nth-child(3)::after{animation-delay:3.5s}.line:nth-child(4)::after{animation-delay:1.5s}.line:nth-child(5)::after{animation-delay:2.3s}.line:nth-child(6)::after{animation-delay:2.9s}.line:nth-child(7)::after{animation-delay:3.2s}@-webkit-keyframes drop{0%{top:-50%}100%{top:100%}}@keyframes drop{0%{top:-50%}100%{top:100%}}.svg-white{color:#fff;position:absolute;width:600px;height:auto;top:5%;left:-5%;animation:rotate 60s infinite}.svg-white svg{stroke-dasharray:829;stroke-dashoffset:4147;animation:dash 20s infinite;stroke:var(--blue);z-index:-1;transform:rotate(20deg)}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dashoffset:0;opacity:.8}60%{opacity:.8}80%{opacity:1}100%{stroke-dashoffset:1800;opacity:.2}}.ball{width:24px;height:24px;position:fixed;top:0;left:0;border:3px solid var(--blue);border-radius:50%;z-index:-1;transition:.2s ease-out}.smallball{width:12px;height:12px;position:fixed;top:0;left:0;border-radius:50%;background-color:var(--white);z-index:-2}