forked from koding/koding
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathkoding-gitlab-main.css
More file actions
10 lines (8 loc) · 30.7 KB
/
Copy pathkoding-gitlab-main.css
File metadata and controls
10 lines (8 loc) · 30.7 KB
1
2
3
4
5
6
7
8
9
10
---
---
{% assign path = site.url | append: '/assets/img/landing/gitlab' %}
.MainSection-Description{background:#7fd4ff url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fblocks.png%26quot%3B) no-repeat bottom right;-webkit-background-size:auto 100%;-moz-background-size:auto 100%;background-size:auto 100%;overflow:hidden;width:100%;height:882px;min-height:882px;max-height:929px;position:relative;}.MainSection-Description.withKoding{background-color:#9ee0fb}.MainSection-Description.withoutKoding{background-color:#9fe1fc}.MainSection-Description .MainSection-Wrapper{width:auto;padding:80px;-webkit-transition:opacity 0.6s ease;-moz-transition:opacity 0.6s ease;-o-transition:opacity 0.6s ease;-ms-transition:opacity 0.6s ease;transition:opacity 0.6s ease;z-index:2;position:relative;}.MainSection-Description .MainSection-Wrapper > div{z-index:1;width:500px;position:relative;padding:50px;border:1px solid rgba(0,0,0,0.1);background-color:rgba(255,255,255,0.1)}.MainSection-Description.out video{opacity:1;-ms-filter:none;filter:none}.MainSection-Description h2.LustBig{margin:0 0 50px}.MainSection-Description h3.EavesDesc{margin-bottom:50px;color:#3c3c59}.MainSection-Description video{opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);bottom:0;right:0;position:absolute;width:auto;height:100%;min-height:100%;z-index:1}.MainSection-Description--buttons span{display:block;color:rgba(0,0,0,0.1);text-transform:uppercase;font-size:16px;position:relative;text-align:center;margin:16px 0;}.MainSection-Description--buttons span:after,.MainSection-Description--buttons span:before{content:'';width:220px;position:absolute;border-bottom:1px solid rgba(0,0,0,0.1);top:7px}.MainSection-Description--buttons span:after{left:0}.MainSection-Description--buttons span:before{right:0}a.MainSection-Description--button{width:100%;height:102px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0 36px;text-align:center;border:1px solid rgba(0,0,0,0.1);display:block;-webkit-border-radius:18px;border-radius:18px;font-size:26px;color:#fff;text-decoration:none;font-weight:500;position:relative;}a.MainSection-Description--button:before{content:'';display:block;width:37px;height:37px;background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fplay_button.png%26quot%3B);position:absolute;top:32px;left:32px}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){a.MainSection-Description--button:before{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fplay_button2x.png%26quot%3B);-webkit-background-size:37px 37px;-moz-background-size:37px 37px;background-size:37px 37px}}a.MainSection-Description--button.green{background:#18cd7a}a.MainSection-Description--button.pink{background:#f0788b}@media (min-width:1200px){.MainSection-Description .MainSection-Wrapper{position:absolute;width:auto;padding:70px 0;-webkit-transition:opacity 0.6s ease;-moz-transition:opacity 0.6s ease;-o-transition:opacity 0.6s ease;-ms-transition:opacity 0.6s ease;transition:opacity 0.6s ease;z-index:2;-webkit-transform:translateY(-50%) translateX(-100%);-moz-transform:translateY(-50%) translateX(-100%);-o-transform:translateY(-50%) translateX(-100%);-ms-transform:translateY(-50%) translateX(-100%);transform:translateY(-50%) translateX(-100%)}}@media (max-width:1200px){.MainSection-Description{width:100%;height:830px;min-height:830px;max-height:830px;}.MainSection-Description .MainSection-Wrapper{width:auto;padding:80px;z-index:2;}.MainSection-Description .MainSection-Wrapper > div{width:380px}.MainSection-Description--buttons span:after,.MainSection-Description--buttons span:before{width:170px}a.MainSection-Description--button{width:100%;height:80px;padding:29px 0 27px;-webkit-border-radius:18px;border-radius:18px;font-size:20px;}a.MainSection-Description--button:before{top:21px;left:21px}}@media (max-width:768px){.MainSection-Description{display:none}}
.MainSection-Hero{background:-webkit-linear-gradient(top, #fed88a, #fec34f 85%, #fed47e 100%);background:-moz-linear-gradient(top, #fed88a, #fec34f 85%, #fed47e 100%);background:-o-linear-gradient(top, #fed88a, #fec34f 85%, #fed47e 100%);background:-ms-linear-gradient(top, #fed88a, #fec34f 85%, #fed47e 100%);background:linear-gradient(to bottom, #fed88a, #fec34f 85%, #fed47e 100%);padding-bottom:90px;overflow:hidden}.HeroVideo-Wrapper{background:rgba(255,255,255,0.18);border:1px solid rgba(0,0,0,0.1);margin-top:78px;height:477px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:30px;position:relative;}.HeroVideo-Wrapper:before,.HeroVideo-Wrapper:after{content:'';opacity:.7;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);bottom:-100px;width:141px;height:244px;position:absolute;-webkit-transition:opacity 0.2s ease;-moz-transition:opacity 0.2s ease;-o-transition:opacity 0.2s ease;-ms-transition:opacity 0.2s ease;transition:opacity 0.2s ease;opacity:1;-ms-filter:none;filter:none;background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fstool.png%26quot%3B);}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){.HeroVideo-Wrapper:before,.HeroVideo-Wrapper:after{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fstool2x.png%26quot%3B);-webkit-background-size:141px 244px;-moz-background-size:141px 244px;background-size:141px 244px}}.HeroVideo-Wrapper:before{left:-180px}.HeroVideo-Wrapper:after{right:-180px}.HeroVideo-Wrapper--flex{border:1px solid rgba(0,0,0,0.1);display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;height:100%;}.HeroVideo-Wrapper--flex > div{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;width:50%;height:100%;}.HeroVideo-Wrapper--flex > div:first-child{background:#fec34f;padding:32px 23px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.HeroVideo-Wrapper--flex > div:last-child{background:#e1ac46 url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fvideo_placeholder.png%26quot%3B) 0 0 no-repeat;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;position:relative;}.HeroVideo-Wrapper--flex > div:last-child:after{content:'';background-color:#ffa900;position:absolute;top:0;left:0;opacity:.55;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=55)";filter:alpha(opacity=55);width:100%;height:100%;z-index:1}.HeroVideo-Wrapper--flex h2{margin-bottom:15px}.HeroVideo-Wrapper--flex h3{margin-bottom:32px}.HeroVideo-Wrapper--flex h4{font-size:19px;color:#fff;margin-bottom:10px;font-weight:300}.PlayButton{content:'';width:168px;height:168px;background-color:rgba(0,0,0,0.4);position:absolute;top:50%;left:50%;margin:-84px 0 0 -84px;z-index:2;cursor:pointer;-webkit-border-radius:50%;border-radius:50%;}.PlayButton:hover:after{border-left-color:#f0788b}.PlayButton:after{content:'';border:60px solid transparent;border-left-color:#fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-size:0;position:absolute;top:50%;left:50%;-webkit-transform:translate(-18%,-50%);-moz-transform:translate(-18%,-50%);-o-transform:translate(-18%,-50%);-ms-transform:translate(-18%,-50%);transform:translate(-18%,-50%);border-width:45px 80px}.HeroVideo-Buttons{margin:8px 0 0;height:68px;}.HeroVideo-Buttons a{border:1px solid rgba(0,0,0,0.1);background-color:rgba(255,255,255,0.18);display:inline-block;color:#f0788b;font-size:26px;text-decoration:none;padding:17px 38px 15px;-webkit-transition:background-color 0.1s ease;-moz-transition:background-color 0.1s ease;-o-transition:background-color 0.1s ease;-ms-transition:background-color 0.1s ease;transition:background-color 0.1s ease;}.HeroVideo-Buttons a:visited,.HeroVideo-Buttons a:active{color:#f0788b}.HeroVideo-Buttons a:hover{background:rgba(255,255,255,0.28)}.HeroVideo-Buttons a strong{font-weight:bold}.HeroVideo-Buttons > div{height:100%;position:relative;}.HeroVideo-Buttons > div cite{position:absolute;bottom:-7px}.HeroVideo-Buttons > div:after,.HeroVideo-Buttons > div:before{content:'';display:block;border:1px solid rgba(0,0,0,0.1);border-top:none;height:4px;position:absolute;bottom:-7px;width:45%}.HeroVideo-Buttons > div:before{border-left:none;right:0}.HeroVideo-Buttons > div:after{border-right:none;left:0}.HeroVideo-Buttons div.left{float:left;}.HeroVideo-Buttons div.left cite{border:8px solid transparent;border-top-color:rgba(0,0,0,0.1);position:absolute;bottom:-19px;left:50%;margin-left:-8px}.HeroVideo-Buttons div.right{float:right;}.HeroVideo-Buttons div.right:before,.HeroVideo-Buttons div.right:after{width:34%}.HeroVideo-Buttons div.right cite{position:absolute;bottom:-14px;width:48px;text-align:center;margin-left:-24px;left:50%;color:rgba(0,0,0,0.1);font-size:14px;letter-spacing:1.8px}.HeroVideo-Buttons div.right a{height:58px;width:58px;padding:0;background-repeat:no-repeat;background-position:center center;}.HeroVideo-Buttons div.right a.in{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_in.png%26quot%3B);}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){.HeroVideo-Buttons div.right a.in{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_in2x.png%26quot%3B);-webkit-background-size:18px 18px;-moz-background-size:18px 18px;background-size:18px 18px}}.HeroVideo-Buttons div.right a.fb{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_fb.png%26quot%3B);}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){.HeroVideo-Buttons div.right a.fb{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_fb2x.png%26quot%3B);-webkit-background-size:10px 20px;-moz-background-size:10px 20px;background-size:10px 20px}}.HeroVideo-Buttons div.right a.tw{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_tw.png%26quot%3B);}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){.HeroVideo-Buttons div.right a.tw{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fsocial_tw2x.png%26quot%3B);-webkit-background-size:20px 16px;-moz-background-size:20px 16px;background-size:20px 16px}}.MainSection.MainSection-FullScreenVideo{position:fixed;top:0;left:0;z-index:5;background:rgba(0,0,0,0);width:100%;height:100%;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-webkit-transition:background-color 0.3s ease , opacity 0.3s ease;-moz-transition:background-color 0.3s ease , opacity 0.3s ease;-o-transition:background-color 0.3s ease , opacity 0.3s ease;-ms-transition:background-color 0.3s ease , opacity 0.3s ease;transition:background-color 0.3s ease , opacity 0.3s ease;-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%);-o-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);}.MainSection.MainSection-FullScreenVideo.fade{background:rgba(0,0,0,0.7);opacity:1;-ms-filter:none;filter:none}.MainSection.MainSection-FullScreenVideo.in{-webkit-transform:translateY(0%);-moz-transform:translateY(0%);-o-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%)}.MainSection.MainSection-FullScreenVideo iframe{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}@media (max-width:1200px){.HeroVideo-Wrapper:before,.HeroVideo-Wrapper:after{opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0)}}@media (max-width:768px){.MainSection.MainSection-FullScreenVideo iframe{position:absolute;width:auto;height:40vh}.HeroVideo-Wrapper{margin-top:10px;padding:0;border:none;height:auto;}.HeroVideo-Wrapper:before,.HeroVideo-Wrapper:after{display:none}.HeroVideo-Wrapper--flex{display:block;height:100%;background:#fec34f;}.HeroVideo-Wrapper--flex > div{-webkit-box-flex:0;-moz-box-flex:0;-o-box-flex:0;box-flex:0;-webkit-flex:none;-ms-flex:none;flex:none;width:100%;height:100%;}.HeroVideo-Wrapper--flex > div:last-child{width:327px;height:150px;margin:-20px auto 30px;}.HeroVideo-Wrapper--flex > div:last-child:before{-webkit-transform:scale(.5);-moz-transform:scale(.5);-o-transform:scale(.5);-ms-transform:scale(.5);transform:scale(.5)}.HeroVideo-Wrapper--flex h2.LustBig{font-size:48px;margin-bottom:0}.HeroVideo-Wrapper--flex h3.EavesDesc{font-size:20px;margin-bottom:20px;line-height:1.2em}.HeroVideo-Wrapper--flex h4{font-size:16px;margin-bottom:10px;font-weight:300}.HeroVideo-Buttons{margin:8px 0 0;height:68px;}.HeroVideo-Buttons a{font-size:20px;padding:14px 30px 12px}.HeroVideo-Buttons > div:after,.HeroVideo-Buttons > div:before{bottom:9px}.HeroVideo-Buttons > div.left:after,.HeroVideo-Buttons > div.left:before{width:42%}.HeroVideo-Buttons > div.left cite{bottom:-3px}.HeroVideo-Buttons > div.right cite{bottom:2px}.HeroVideo-Buttons div.right{float:right;}.HeroVideo-Buttons div.right:before,.HeroVideo-Buttons div.right:after{width:30%}.HeroVideo-Buttons div.right a{height:45px;width:45px;padding:0;background-repeat:no-repeat;background-position:center center}.PlayButton{width:84px;height:84px;top:50%;left:50%;margin:-42px 0 0 -42px;}.PlayButton:after{border:30px solid transparent;border-left-color:#fff;-webkit-transform:translate(-18%,-50%);-moz-transform:translate(-18%,-50%);-o-transform:translate(-18%,-50%);-ms-transform:translate(-18%,-50%);transform:translate(-18%,-50%);border-width:22px 40px}}
body{font-family:'Mr Eaves San OT','mr-eaves-sans',sans-serif;}body .intercom-container{display:none !important}h2.LustBig{color:#fff;font-family:'Lust','lust',serif;font-size:54px;line-height:74px;letter-spacing:-1.1px}h3.EavesDesc{color:rgba(60,60,89,0.8);font-size:24px;font-weight:300;line-height:36px;margin-bottom:32px;}h3.EavesDesc a{color:rgba(0,124,195,0.8);text-decoration:none}strong{font-weight:600}.MainSection{overflow:hidden}.MainSection-Wrapper{width:790px;margin:0 auto}.MainSection-Hero header{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;width:364px;height:68px;border:1px solid rgba(0,0,0,0.1);border-top:none;background:#fedc95;margin:0 auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.MainSection-Hero header > div{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;border-right:1px solid rgba(0,0,0,0.1);text-align:center;height:100%;line-height:68px;position:relative;color:rgba(60,60,89,0.5);font-size:22px;font-weight:600;}.MainSection-Hero header > div:last-child{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;border-right:none;}.MainSection-Hero header > div:last-child:after{display:none}.MainSection-Hero header > div span{text-rendering:geometricPrecision}.MainSection-Hero header > div:after{content:'';position:absolute;top:22px;right:-13px;width:24px;height:24px;-webkit-border-radius:13px;border-radius:13px;border:1px solid rgba(0,0,0,0.1);background-color:#fedb93;background-position:center center;background-repeat:no-repeat;background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fplus.png%26quot%3B);}@media all and (-webkit-min-device-pixel-ratio:1.5),(min--moz-device-pixel-ratio:1.5),(-o-min-device-pixel-ratio:1.5/1),(min-device-pixel-ratio:1.5),(min-resolution:138dpi),(min-resolution:1.5dppx){.MainSection-Hero header > div:after{background-image:url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fplus2x.png%26quot%3B);-webkit-background-size:11px 11px;-moz-background-size:11px 11px;background-size:11px 11px}}.MainSection-Hero header > div a{font-size:0;display:block;width:182px;}.MainSection-Hero header > div a.KodingLogo{background:transparent url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fkoding.svg%26quot%3B) center center no-repeat;-webkit-background-size:93px 33px;-moz-background-size:93px 33px;background-size:93px 33px}.MainSection-Hero header > div a.GitlabLogo{background:transparent url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fgitlab.svg%26quot%3B) center center no-repeat;-webkit-background-size:95px 36px;-moz-background-size:95px 36px;background-size:95px 36px;opacity:.7;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70)}@media (min-width:1200px){.MainSection{height:100vh;min-height:800px;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.MainSection-Wrapper{width:790px;margin:0 auto;position:absolute;top:50%;left:50%;-webkit-transform:translateY(-50%) translateX(-50%);-moz-transform:translateY(-50%) translateX(-50%);-o-transform:translateY(-50%) translateX(-50%);-ms-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%)}}@media (max-width:1200px){h2.LustBig{font-size:36px;line-height:56px;letter-spacing:-.4px}h3.EavesDesc{font-size:22px;line-height:34px;margin-bottom:32px}}@media (max-width:768px){.MainSection{height:auto;min-height:auto;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding-bottom:40px}.MainSection-Wrapper{width:364px;position:relative;top:0;left:0;-webkit-transform:translateY(0) translateX(0);-moz-transform:translateY(0) translateX(0);-o-transform:translateY(0) translateX(0);-ms-transform:translateY(0) translateX(0);transform:translateY(0) translateX(0)}}
.MainSection.MainSection-Quotes{background:#ffd271;height:520px;min-height:520px;padding-top:80px;text-align:center;}.MainSection.MainSection-Quotes h3{font-size:16px;line-height:20px;display:inline-block;border-bottom:1px solid rgba(60,60,89,0.7);color:rgba(60,60,89,0.7)}.MainSection.MainSection-Quotes .MainSection-Wrapper{width:1200px;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;padding:114px 0;-webkit-box-align:center;-moz-box-align:center;-o-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}.MainSection.MainSection-Quotes .MainSection-Wrapper > div{width:50%;-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:1 0 auto;-ms-flex:1 0 auto;flex:1 0 auto;position:relative}.MainSection.MainSection-Quotes .MainSection-Wrapper cite,.MainSection.MainSection-Quotes .MainSection-Wrapper blockquote{font-weight:300;color:rgba(60,60,89,0.8);border:1px solid rgba(0,0,0,0.1);background-color:rgba(255,255,255,0.12)}.MainSection.MainSection-Quotes .MainSection-Wrapper blockquote{font-size:40px;white-space:wrap;font-style:italic;padding:42px;margin-right:30px;-webkit-border-radius:18px;border-radius:18px}.MainSection.MainSection-Quotes .MainSection-Wrapper cite{font-size:32px;position:absolute;right:30px;bottom:-75px;padding:28px 30px 8px;border-width:0 1px 1px 1px;font-style:italic;}.MainSection.MainSection-Quotes .MainSection-Wrapper cite b{font-style:normal;font-weight:400}.MainSection.MainSection-Quotes .MainSection-Wrapper cite:before{content:'';width:calc(100% - 12px);height:20px;position:absolute;top:0;left:6px;background:#ffd271;display:block;border:1px solid rgba(0,0,0,0.1);border-width:0 1px 1px 0;-webkit-transform:skew(-30deg);-moz-transform:skew(-30deg);-o-transform:skew(-30deg);-ms-transform:skew(-30deg);transform:skew(-30deg)}.MainSection.MainSection-Quotes .MainSection-Wrapper cite:after{content:'';width:20px;height:20px;position:absolute;top:0;left:-10px;background:#ffd271;display:block}@media (max-width:1200px){.MainSection.MainSection-Quotes{padding:42px 0;height:220px;min-height:220px;}.MainSection.MainSection-Quotes h3{display:none}.MainSection.MainSection-Quotes .MainSection-Wrapper{width:800px;padding:0;top:40px;}.MainSection.MainSection-Quotes .MainSection-Wrapper blockquote{font-size:26px;padding:20px;margin-right:20px;-webkit-border-radius:18px;border-radius:18px;min-height:120px;line-height:30px}.MainSection.MainSection-Quotes .MainSection-Wrapper cite{font-size:21px;bottom:-58px;right:20px}}@media (max-width:768px){.MainSection.MainSection-Quotes{display:none}}
.MainSection-Try{background:-webkit-linear-gradient(top, #7fe2b4, #2acb7d 85%, #7de2b3 100%);background:-moz-linear-gradient(top, #7fe2b4, #2acb7d 85%, #7de2b3 100%);background:-o-linear-gradient(top, #7fe2b4, #2acb7d 85%, #7de2b3 100%);background:-ms-linear-gradient(top, #7fe2b4, #2acb7d 85%, #7de2b3 100%);background:linear-gradient(to bottom, #7fe2b4, #2acb7d 85%, #7de2b3 100%);}.MainSection-Try.focus .MainSection-Try--appChrome{-webkit-animation:shadowize .5s .5s 1;-moz-animation:shadowize .5s .5s 1;-o-animation:shadowize .5s .5s 1;-ms-animation:shadowize .5s .5s 1;animation:shadowize .5s .5s 1}.MainSection-Try .MainSection-Wrapper{width:1200px;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;padding:155px 0 196px;}.MainSection-Try .MainSection-Wrapper > div{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;position:relative;width:691px;height:507px;}.MainSection-Try .MainSection-Wrapper > div:first-child{padding-top:27px;width:509px;padding-right:75px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.MainSection-Try h2.LustBig{margin-bottom:42px}.MainSection-Try form{width:100%;height:90px;display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-ms-flexbox;display:box;display:flex;}.MainSection-Try form > input{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;width:calc(100% - 200px);height:100%;margin:auto;display:inline-block;border:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;color:#3c3c59;font-size:22px;font-family:'Mr Eaves San OT','mr-eaves-sans',sans-serif;padding:0 35px;-webkit-border-radius:15px 0 0 15px;border-radius:15px 0 0 15px}.MainSection-Try form > button{-webkit-box-flex:1;-moz-box-flex:1;-o-box-flex:1;box-flex:1;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;width:200px;height:100%;display:inline-block;height:100%;color:#fff;background:#ffc442;border:none;padding:0 25px;-webkit-border-radius:0 15px 15px 0;border-radius:0 15px 15px 0;cursor:pointer;font-size:22px;font-family:'Mr Eaves San OT','mr-eaves-sans',sans-serif;}.MainSection-Try form > button:hover{background:rgba(255,196,66,0.95)}.MainSection-Try form > button:active{background:rgba(255,196,66,0.9)}.MainSection-Try--appChrome{background:transparent url(/sitelet?url=https%3A%2F%2Fgithub.com%2Fhectork01%2Fkoding%2Fblob%2Fmaster%2Fdocs%2Fcss%2F%26quot%3B%257B%257B%2520path%2520%257D%257D%2Fapp_chrome.svg%26quot%3B) no-repeat 0 0;-webkit-background-size:691px 40px;-moz-background-size:691px 40px;background-size:691px 40px;padding:40px 0 0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-webkit-border-radius:13px;border-radius:13px;border:1px solid rgba(0,0,0,0.1);}.MainSection-Try--appChrome video{width:100%;height:auto}.MainSection-Footer{background:#394457;height:300px !important;min-height:300px !important;padding-top:70px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center;}.MainSection-Footer h3{font-size:40px;font-weight:100;text-rendering:geometricPrecision;margin:0 0 30px;color:rgba(168,206,255,0.5)}.MainSection-Footer a.MainSection-Description--button{color:rgba(255,255,255,0.8);height:83px;font-weight:400;font-size:36px;display:inline-block;padding:25px 45px 15px;width:auto;}.MainSection-Footer a.MainSection-Description--button:before{display:none}@media (max-width:1200px){.MainSection-Try{width:100%;height:731px;min-height:731px;max-height:731px;}.MainSection-Try.focus .MainSection-Try--appChrome{-webkit-animation:shadowizeSmall .5s .5s 1;-moz-animation:shadowizeSmall .5s .5s 1;-o-animation:shadowizeSmall .5s .5s 1;-ms-animation:shadowizeSmall .5s .5s 1;animation:shadowizeSmall .5s .5s 1}.MainSection-Try .MainSection-Try--appChrome{margin-left:-100px;-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6)}.MainSection-Try .MainSection-Wrapper{width:auto;padding:30px 0;}.MainSection-Try .MainSection-Wrapper > div:first-child{width:380px;padding:80px 0 0 80px;border:none;background-color:transparent}.MainSection-Try form{display:block;height:60px;}.MainSection-Try form > input{width:100%;height:100%;-webkit-border-radius:10px;border-radius:10px;font-size:18px;text-align:center;margin-bottom:10px}.MainSection-Try form > button{width:100%;height:100%;margin-top:10px;font-size:18px;width:100%;-webkit-border-radius:10px;border-radius:10px}}@media (max-width:768px){.MainSection-Try{min-height:696px;max-height:696px;}.MainSection-Try .MainSection-Wrapper{width:364px;display:block;text-align:center;}.MainSection-Try .MainSection-Wrapper > div:first-child{width:auto;padding:80px 0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-flex:0;-moz-box-flex:0;-o-box-flex:0;box-flex:0;-webkit-flex:none;-ms-flex:none;flex:none}.MainSection-Try .MainSection-Wrapper > div:last-child{display:none}.MainSection-Footer{height:300px !important;min-height:300px !important;padding-top:70px;}.MainSection-Footer h3{font-size:26px;font-weight:100;text-rendering:geometricPrecision;margin:0 0 30px;color:rgba(168,206,255,0.5)}}@-moz-keyframes shadowize{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.96);-moz-transform:scale(.96);-o-transform:scale(.96);-ms-transform:scale(.96);transform:scale(.96);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@-webkit-keyframes shadowize{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.96);-moz-transform:scale(.96);-o-transform:scale(.96);-ms-transform:scale(.96);transform:scale(.96);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@-o-keyframes shadowize{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.96);-moz-transform:scale(.96);-o-transform:scale(.96);-ms-transform:scale(.96);transform:scale(.96);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@keyframes shadowize{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.96);-moz-transform:scale(.96);-o-transform:scale(.96);-ms-transform:scale(.96);transform:scale(.96);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@-moz-keyframes shadowizeSmall{0%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.56);-moz-transform:scale(.56);-o-transform:scale(.56);-ms-transform:scale(.56);transform:scale(.56);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(.62);-moz-transform:scale(.62);-o-transform:scale(.62);-ms-transform:scale(.62);transform:scale(.62)}100%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@-webkit-keyframes shadowizeSmall{0%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.56);-moz-transform:scale(.56);-o-transform:scale(.56);-ms-transform:scale(.56);transform:scale(.56);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(.62);-moz-transform:scale(.62);-o-transform:scale(.62);-ms-transform:scale(.62);transform:scale(.62)}100%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@-o-keyframes shadowizeSmall{0%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.56);-moz-transform:scale(.56);-o-transform:scale(.56);-ms-transform:scale(.56);transform:scale(.56);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(.62);-moz-transform:scale(.62);-o-transform:scale(.62);-ms-transform:scale(.62);transform:scale(.62)}100%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}@keyframes shadowizeSmall{0%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent}33%{-webkit-transform:scale(.56);-moz-transform:scale(.56);-o-transform:scale(.56);-ms-transform:scale(.56);transform:scale(.56);-webkit-box-shadow:0 0 100px 0 #cbffe6;box-shadow:0 0 100px 0 #cbffe6}66%{-webkit-transform:scale(.62);-moz-transform:scale(.62);-o-transform:scale(.62);-ms-transform:scale(.62);transform:scale(.62)}100%{-webkit-transform:scale(.6);-moz-transform:scale(.6);-o-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6);-webkit-box-shadow:0 0 500px 0 transparent;box-shadow:0 0 500px 0 transparent}}