*{box-sizing:border-box;margin:0;padding:0;font-weight:300}body{font-family:Courier,sans-serif;color:dimgray;font-weight:300}.wrapper{background:gainsboro;background:linear-gradient(to left,grey,ghostwhite);position:absolute;left:0;width:100%;height:100%;bottom:0;overflow:hidden}.container{max-width:600px;margin:0 auto;padding:80px 0;height:400px;text-align:center}.container h1{font-size:40px;transition-duration:1s;transition-timing-function:ease-in-out;font-weight:900}.bg-bubbles{top:0;left:0;width:100%;height:100%;z-index:1}.bg-bubbles li{position:absolute;list-style:none;display:block;width:40px;height:40px;line-height:40px;text-align:center;vertical-align:middle;background-color:rgba(255,255,255,0.15);color:white;font-weight:800;bottom:-160px;opacity:.8;-webkit-animation:square 25s infinite;animation:square 25s infinite;-webkit-transition-timing-function:linear;transition-timing-function:linear;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif}.bg-bubbles li:nth-child(1){left:10%;background-color:#111}.bg-bubbles li:nth-child(11){left:33%;background-color:#ffb515}.bg-bubbles li:nth-child(2){left:20%;width:80px;height:80px;line-height:80px;animation-delay:2s;animation-duration:17s;background-color:#ff5c00}.bg-bubbles li:nth-child(3){left:25%;animation-delay:4s;background-color:#2daebf}.bg-bubbles li:nth-child(12){left:18%;animation-delay:6s;background-color:#007d9a}.bg-bubbles li:nth-child(4){left:40%;width:60px;height:60px;line-height:60px;animation-duration:22s;background-color:rgba(255,255,255,0.25);background-color:#e33100}.bg-bubbles li:nth-child(5){left:70%;background-color:#872300}.bg-bubbles li:nth-child(13){left:77%;background-color:#a9014b}.bg-bubbles li:nth-child(6){left:69%;width:120px;height:120px;line-height:120px;animation-delay:3s;background-color:rgba(255,255,255,0.2);background-color:#630030}.bg-bubbles li:nth-child(7){left:32%;width:160px;height:160px;line-height:160px;animation-delay:7s}.bg-bubbles li:nth-child(14){left:66%;width:50px;height:50px;line-height:50px;animation-delay:9s;background-color:#d45500;opacity:.7}.bg-bubbles li:nth-child(8){left:55%;width:20px;height:20px;line-height:20px;animation-delay:15s;animation-duration:40s}.bg-bubbles li:nth-child(9){left:25%;width:15px;height:15px;line-height:15px;animation-delay:2s;animation-duration:40s;background-color:rgba(255,255,255,0.3)}.bg-bubbles li:nth-child(10){left:78%;width:160px;height:160px;line-height:160px;animation-delay:11s;background-color:#fc9200}.bg-bubbles li:nth-child(15){left:48%;width:77px;height:77px;line-height:77px;animation-delay:7s;background-color:#749a02}.bg-bubbles li:nth-child(16){left:8%;width:160px;height:160px;line-height:160px;animation-delay:15s;background-color:#91bd09;opacity:.5}@-webkit-keyframes square{0%{transform:translateY(0)}100%{transform:translateY(-700px) rotate(600deg)}}@keyframes square{0%{transform:translateY(0)}100%{transform:translateY(-700px) rotate(600deg)}}p{background:linear-gradient(to left,grey,ghostwhite);font-size:21px;padding:15px;border-radius:5px;margin:10px}.blog_left_home{position:fixed;top:110px;right:40px;z-index:1;width:30px;height:30px;border-radius:50%;box-shadow:0 0 10px #00b53f;background-color:white}.blog_left_home_a:hover>.blog_left_home{box-shadow:0 0 20px #0f0}.blog_left_home_a:hover>.blog_left_home_span{opacity:1.0}.blog_left_home_span{position:fixed;top:146px;height:15px;line-height:15px;right:35px;width:40px;z-index:1;font-size:9px;background-color:#3c3c3c;color:#bbb;border-radius:3px;opacity:.0;padding:1px;text-align:center}.blog_article_list{position:fixed;top:170px;right:41px;z-index:1;width:28px;height:30px;border-radius:10%;background-color:white;box-shadow:0 0 10px #0f0}.blog_article_list_span{position:fixed;top:206px;right:35px;width:40px;height:15px;line-height:15px;z-index:1;font-size:9px;background-color:#3c3c3c;color:#bbb;border-radius:3px;opacity:.0;padding:1px;text-align:center}.blog_article_list_a:hover>.blog_article_list{box-shadow:0 0 20px #0f0}.blog_article_list_a:hover>.blog_article_list_span{opacity:1.0}.blog_write{position:fixed;top:230px;right:41px;z-index:1;width:28px;height:30px;border-radius:10%;background-color:white;box-shadow:0 0 10px #0f0}.blog_write_span{position:fixed;top:266px;right:35px;width:40px;height:15px;line-height:15px;z-index:1;font-size:9px;background-color:#3c3c3c;color:#bbb;border-radius:3px;opacity:.0;padding:1px;text-align:center}.blog_write_a:hover>.blog_write{box-shadow:0 0 20px #0f0}.blog_write_a:hover>.blog_write_span{opacity:1.0}.blog_page_view{position:fixed;top:290px;right:41px;z-index:1;width:30px;height:30px;border-radius:10%;background-color:white;box-shadow:0 0 10px #0f0}.blog_page_view_span{position:fixed;top:326px;right:35px;width:40px;height:15px;line-height:15px;z-index:1;font-size:9px;background-color:#3c3c3c;color:#bbb;border-radius:3px;opacity:.0;padding:1px;text-align:center}.blog_page_view_a:hover>.blog_page_view{box-shadow:0 0 20px #0f0}.blog_page_view_a:hover>.blog_page_view_span{opacity:1.0}.blog_feedback{position:fixed;top:350px;right:41px;z-index:1;width:30px;height:30px;border-radius:50%;background-color:white;box-shadow:0 0 10px #0f0}.blog_feedback_span{position:fixed;top:386px;right:35px;width:40px;height:15px;line-height:15px;z-index:1;font-size:9px;background-color:#3c3c3c;color:#bbb;border-radius:3px;opacity:.0;padding:1px;text-align:center}.blog_feedback_a:hover>.blog_feedback{box-shadow:0 0 20px #0f0}.blog_feedback_a:hover>.blog_feedback_span{opacity:1.0}