.article{border:2px solid #b8b88b;border-radius:10px;padding:20px;background:#fff}.article .article-published-at{color:#b8b88b}.article h1.article-title{font-size:200%;font-weight:700}.article .category-tags ul{display:flex;flex-wrap:wrap;list-style:none}.article .category-tags .tag-link{color:purple}.article .article-writer img{width:40px;height:40px;border-radius:50%;border:2px solid #dab567}.article .article-writer .article-writer-name{font-size:120%;font-weight:700}.article .article-feature-image img{max-width:100%;max-height:400px}.related-articles{background:linear-gradient(90deg,#fff4bd,#fffdf5)}.related-articles h1{font-size:200%;font-weight:700}.related-articles .one-related-article{background:#f2fdf9;border:2px solid #f9de00;border-radius:20px;font-size:120%;color:#536d78}.related-articles .one-related-article .icon{width:10px;height:10px;border-radius:50%;background:#536d78}.share-button{position:fixed;right:0;top:calc(50% - 60px);background:linear-gradient(180deg,#c79bda,#9460cc);padding:20px 10px;border-top-left-radius:10px;border-bottom-left-radius:10px;color:#fff;font-weight:700;overflow:hidden;transition:all .5s}.share-button div:hover{scale:1.05}.share-panel{position:fixed;width:400px;max-width:90%;height:250px;top:calc(50% - 150px);right:0;background:#fff;border-top-left-radius:10px;border-bottom-left-radius:10px;box-shadow:0 2px 5px rgba(0,0,0,.3);transform:translateX(400px);transition:transform .5s}.share-panel.active{transform:translateX(0)}.share-panel h2{font-size:150%;font-weight:700}.share-panel .social-systems{padding:0 20px 20px;border-bottom:2px solid #eee}