.main .grid{width:1040px;margin:auto}.blog-head-box{height:auto;padding:180px 0 0 0;background-color:#f2f3f5}.blog-head-box .block{display:flex;height:calc(100vh - 320px);max-height:400px}.blog-head-box figure{width:520px;height:100%;opacity:0;transform:translateX(-30px);transition:transform .9s cubic-bezier(.165,.84,.44,1),opacity .9s cubic-bezier(.165,.84,.44,1);transition-delay:.6s;will-change:transform,opacity}.loaded .blog-head-box figure{opacity:1;transform:translateX(0)}.blog-head-box .textbox{display:flex;flex-direction:column;justify-content:center;width:420px;padding:0 0 0 60px}#rtl .blog-head-box .textbox{padding:0 60px 0 0}.blog-head-box .textbox .cat{font-size:18px;line-height:24px;font-weight:700;opacity:0;transform:translateY(30px);transition:transform .6s cubic-bezier(.165,.84,.44,1),opacity .6s cubic-bezier(.165,.84,.44,1);transition-delay:650ms;will-change:transform,opacity}.loaded .blog-head-box .textbox .cat{opacity:1;transform:translateX(0)}.blog-head-box .textbox h1{font-size:42px;line-height:44px;font-weight:700;width:450px;margin:20px 0 0 0;opacity:0;transform:translateY(30px);transition:transform .6s cubic-bezier(.165,.84,.44,1),opacity .6s cubic-bezier(.165,.84,.44,1);transition-delay:.7s;will-change:transform,opacity}.loaded .blog-head-box .textbox h1{opacity:1;transform:translateX(0)}.blog-head-box .textbox .author{color:#1c1734;font-size:18px;line-height:24px;font-weight:300;margin:25px 0 0 0;opacity:0;transform:translateY(30px);transition:transform .6s cubic-bezier(.165,.84,.44,1),opacity .6s cubic-bezier(.165,.84,.44,1);transition-delay:750ms;will-change:transform,opacity}.loaded .blog-head-box .textbox .author{opacity:1;transform:translateX(0)}article{padding:70px 0 0 0;opacity:0;transform:translateY(30px);transition:transform .6s cubic-bezier(.165,.84,.44,1),opacity .6s cubic-bezier(.165,.84,.44,1);transition-delay:.8s;will-change:transform,opacity}.loaded article{opacity:1;transform:translateX(0)}article .grid{margin:80px auto 0 auto}article .share.float{float:left;left:0;top:20px;width:36px}#rtl article .share.float{float:right;left:auto;right:0}article .share.bottom{height:36px;margin:40px 0 0 0}article .share ul{display:block}article .share ul li{float:left;display:flex;width:36px;height:36px;cursor:pointer;margin:0 0 10px 0;border-radius:100%;background-color:#000;transition:all .2s ease}#rtl article .share ul li{float:right}article .share.bottom ul li{margin:0 10px 0 0}#rtl article .share.bottom ul li{margin:0 0 0 10px}article .share ul li:hover{background-color:#00e9ff;transform:rotate(360deg)}article .share ul li svg{margin:auto}article .share ul li:last-of-type svg{left:2px}article .share ul li svg path{fill:#fff}article .content{width:650px;margin:auto}article .back-btn{margin-top:100px}@media only screen and (min-width:1024px) and (max-width:1365px){.main .grid{width:850px;margin:auto}.blog-head-box{padding:180px 0 0 0}.blog-head-box .block{height:300px}.blog-head-box figure{width:400px}}@media only screen and (min-width:768px) and (max-width:1023px){.main .grid{width:650px;margin:auto}.blog-head-box{padding:180px 0 0 0}.blog-head-box .block{height:240px}.blog-head-box figure{width:400px}.blog-head-box .textbox{width:420px;padding:0 0 0 40px}.blog-head-box .textbox h1{font-size:32px;line-height:40px;width:auto}article .share.float{display:none}}@media only screen and (max-width:767px){.main .grid{width:auto}.blog-head-box{height:auto;padding:180px 0 0 0;background-color:#f2f3f5}.blog-head-box .block{display:block;height:auto;max-height:unset}.blog-head-box figure{display:none}#rtl .blog-head-box .textbox,.blog-head-box .textbox{width:auto;padding:0 20px 0 20px}.blog-head-box .textbox h1{font-size:34px;line-height:42px;width:auto}article{padding:70px 20px 0 20px}article .share.float{display:none}article .content{width:auto}article .btn{margin-top:50px;width:140px}}