.betterdocs-article-reactions { padding: 2em; background-color: #fff; border-radius: 5px; display: flex; flex-flow: row wrap; justify-content: space-between; } .betterdocs-article-reactions .betterdocs-article-reactions-heading { flex: 0 0 auto; } .betterdocs-article-reactions .betterdocs-article-reactions-heading .betterdocs-reactions-title-tag { display: inline-block; font-size: 1em; color: #566e8b; margin: 0; } .betterdocs-article-reactions .betterdocs-article-reaction-links { margin: 0; padding: 0; } .betterdocs-article-reactions .betterdocs-article-reaction-links li { list-style: none; display: inline-table; margin: 0; } .betterdocs-article-reactions .betterdocs-article-reaction-links li a { display: inline-block; width: 29px; height: 29px; margin-left: 5px; text-align: center; border-radius: 50%; background-color: #19ca9e; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; box-shadow: 0px 3px 10px 0px RGB(3 29 60/15%); } .betterdocs-article-reactions .betterdocs-article-reaction-links li a:hover { background-color: #fff; } .betterdocs-article-reactions .betterdocs-article-reaction-links li a:hover svg path { fill: #19ca9e; } .betterdocs-article-reactions .betterdocs-article-reaction-links li a svg { width: 15px; height: 15px; } .betterdocs-article-reactions .betterdocs-article-reaction-links li a svg path { fill: #fff; }