.banner,.banner a,.banner a img{width:100%}.banner{position:relative;height:52vw;overflow:hidden;background:#000}.banner a{position:absolute;bottom:0;left:0;display:none;line-height:0}.banner h1,.banner h2{position:fixed;left:-10000px}.banner .bannerMenu{position:absolute;z-index:99;bottom:0;width:200px;text-align:center;left:calc(50% - 100px)}.banner .bannerMenu i{display:inline-block;width:20px;height:20px;margin:10px 4px 15px;border-radius:50%;background:#fff;opacity:.5;box-shadow:rgba(0,0,0,.3) 0 2px 6px;cursor:pointer;transition:.3s}.banner .bannerMenu i:hover{opacity:1}.banner .bannerMenu i.bannerSelect{cursor:default;opacity:1;background:#fa0}.banner-en{flex-direction:column;justify-content:center;align-items:center;display:-webkit-flex;-webkit-flex-direction:column;-webkit-justify-content:center;-webkit-align-items:center;width:100%;height:55vw;background:url(../../img/index/banner-en.jpg) center bottom no-repeat;background-size:100% auto}.banner-en h1,.banner-en h2{margin-left:-10000px}.content{margin:70px auto;min-height:0;width:85%}.content div{display:inline-block;width:33%;padding:30px 20px;vertical-align:top;font-size:15px}.content div h2{margin:10px 0 15px;color:#000;font-size:20px}.content div span{display:block;margin-left:50px;color:#666;line-height:24px;text-align:justify;word-wrap:break-word;word-break:break-all;white-space:pre-wrap}.content div i{float:left;margin-right:14px;font-size:36px;color:#24bde5}.blockly{width:100%;background-image:url(../../img/index/banner-space.jpg);background-size:cover;background-attachment:fixed;text-align:center;padding-left:1.5em;padding-right:1.5em;line-height:1.5}.blockly h2{color:#fff;margin:0 auto;padding:20px 0 0;text-align:center;font-size:36px}.blockly span{display:inline-block;padding:5px 0;font-size:18px;color:#aaa}.blockly span:first-child{padding-top:50px}.blockly span i{color:#ccc;text-decoration:underline}.blockly a.button{display:inline-block;color:#fff;outline:0;font-size:22px;background-color:#F2A521;border:none;width:200px;height:50px;border-radius:5px;line-height:50px;margin:0 auto 50px;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.blockly a.button i{width:22px;height:22px;margin-left:-30px;opacity:0;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.blockly a.button.b2{margin-left:10px;background-color:#16959f}.blockly a.button:hover i{margin-left:10px;opacity:1}.blockly img{width:100%;max-width:939px}.resources,.tutorials-menu{display:table;width:100%}.resources h2,.resources span,.tutorials-menu h2,.tutorials-menu span{display:block;width:100%;text-align:center}.resources h2,.tutorials-menu h2{margin-top:30px;margin-bottom:10px;font-size:30px;font-family:Arial}.resources span,.tutorials-menu span{margin-bottom:40px;font-size:18px}.resources .no,.tutorials-menu .no{opacity:.3}.tutorials-menu{border-top:5px solid #ddd}.tutorials-menu .menu-content{display:table;width:100%;margin:0 auto;text-align:center}.tutorials-menu .menu-content div{z-index:2;float:left;overflow:hidden;width:25%;margin:0;padding:0;vertical-align:top}.tutorials-menu .menu-content div:after,.tutorials-menu .menu-content div:before{pointer-events:none;width:100%;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.tutorials-menu .menu-content div:before{z-index:3;content:attr(data-title);color:#fff;height:50px;line-height:50px;font-size:15px;bottom:-50px;background:rgba(0,0,0,.8)}.tutorials-menu .menu-content div:after{z-index:2;height:100%;top:0;left:0;background:rgba(0,0,0,.2)}.tutorials-menu .menu-content div img{transition:.3s;-webkit-transition:.3s;-moz-transition:.3s;width:100%;height:100%}.tutorials-menu .menu-content div:hover{z-index:3}.tutorials-menu .menu-content div:hover img{margin-top:-2%;margin-left:-2%;height:104%;width:104%}.tutorials-menu .menu-content div:hover:after{background:rgba(0,0,0,0)}.tutorials-menu .menu-content div:hover:before{bottom:0}.tutorials-menu .goto-tutorials{padding:50px;background:#1D3557;box-shadow:inset rgba(0,0,0,.1) 0 5px 0 0;border-bottom:5px solid #ccc}.tutorials-menu .goto-tutorials h2{margin:0 0 20px;color:#fff}.tutorials-menu .goto-tutorials a{display:block;width:200px;height:50px;margin:0 auto;color:#fff;font-size:20px;line-height:50px;text-align:center;border:1px solid #fff;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.tutorials-menu .goto-tutorials a .fa{opacity:0;margin-left:-20px;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.tutorials-menu .goto-tutorials a:hover{background:rgba(255,255,255,.1)}.tutorials-menu .goto-tutorials a:hover .fa{opacity:1;margin-left:6px}.resources{padding:80px 0 50px;text-align:center;background:#f1f1f1}.resources h2{margin-bottom:30px}.resources a{display:inline-block;width:21%;padding:20px;vertical-align:top;color:#555}.resources a div,.resources a div:before{width:90px;height:90px;border-radius:50%}.resources a div{line-height:90px;background:#e1e1e1;margin:0 auto;font-size:26px;color:#555;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s}.resources a div:before{border:1px solid #000;top:0;left:0;opacity:0;transition:.2s;-webkit-transition:.2s;-moz-transition:.2s}.resources a h3{color:#000;font-size:18px;margin:30px 0 10px}.resources a span{color:#888;font-size:15px;text-align:justify;line-height:22px}.resources a:hover div{background:#000;color:#fff}.resources a:hover div:before{width:102px;height:102px;top:-7px;left:-7px;opacity:1}@media (max-width:1000px){.content{margin:30px auto}.content div{width:48%;padding:20px}.banner{height:450px}.banner h1{font-size:60px}.banner h2{font-size:50px}.banner .bannerMenu i{width:18px;height:18px;margin-bottom:12px}}@media (max-width:800px){.banner{height:400px}.banner .bannerMenu i{width:15px;height:15px;margin-bottom:10px}.tutorials-menu .menu-content div{width:50%}.tutorials-menu .menu-content div:before{opacity:.8;bottom:0}.tutorials-menu .menu-content div:after{opacity:0}.blockly h2{font-size:24px}.blockly span{font-size:18px}.resources a{width:45%}}@media (max-width:600px){.content div{width:100%;padding:10px 20px 20px 0}.banner{height:300px}.banner .bannerMenu{display:none}.tutorials-menu h2{font-size:26px}.blockly h2{font-size:20px}.blockly span{font-size:14px;padding:0 0 10px}.blockly a.button{width:300px;font-size:18px;margin:0 auto 10px}.blockly a.button.b2{margin:0 auto 30px}.resources a{width:90%}}@media (max-width:500px){.banner{margin-top:40px;height:200px}.tutorials-menu .menu-content div{width:100%}}