.ehss_button {
width: 100%;
height: auto;
padding: 10px;
line-height: normal; }
.ehss_button .fa {
margin-right: 6px;
font-size: 16px;
line-height: normal;
vertical-align: middle; }
.ehss_button span {
display: inline-block;
font-size: 13px;
line-height: normal;
vertical-align: middle; }
.ehss_button.aboveQuickReply { margin-bottom: 10px; }
.ehss_button.floating {
position: fixed;
width: 42px;
height: 42px;
left: 0;
bottom: 40px;
border-left-width: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
box-shadow: 0 2px 2px rgba(0,0,0,.2);
z-index: 9999; }
.ehss_button.floating .fa { margin-right: 0; }
/** OVERLAY TECHNIQUE, COURTESY OF SOCIAL:
http://tolgaergin.com/files/social/index.html **/
.ehss_overlay {
position: fixed;
top: 0;
left: 0;
background: rgba(0, 0, 0, .6);
z-index: 10000;
width: 100%;
height: 100%;
text-align: center;
overflow-y: auto; }
.ehss_overlay .ehss_items {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
text-align: center; }
.ehss_overlay .ehss_items:before {
content: '';
height: 100%;
display: inline-block;
vertical-align: middle; }
.ehss_overlay .ehss_items .ehss_inner {
display: inline-block;
vertical-align: middle;
width: 80%;
max-width: 720px;
padding: 1em; }
.ehss_overlay .ehss_items .ehss_inner ul li {
display: inline-block;
padding: 10px; }
.ehss_overlay .ehss_items .ehss_inner ul li > span {
display: block;
color: white;
font-weight: bold;
font-size: 13px;
margin-top: 10px;
text-shadow: 0 2px 2px rgba(0, 0, 0, .8); }
.ehss_overlay .ehss_items .ehss_inner ul li a span {
display: block;
width: 100px;
height: 100px;
box-shadow: 0 2px 2px rgba(0, 0, 0, .4);
transform: translateZ(0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-osx-font-smoothing: grayscale;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
cursor: pointer; }
.ehss_overlay .ehss_items .ehss_inner ul li a span:hover {
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36); }
.ehss_overlay .ehss_items .ehss_inner ul li a span:before {
content: '';
height: 100%;
display: inline-block;
vertical-align: middle; }
.ehss_overlay .ehss_items .ehss_inner ul li a span .ehss_count {
position: absolute;
font-style: normal;
font-weight: bold;
background-color: white;
bottom: 5px;
right: 5px;
padding: 1px 2px;
font-size: 12px;
border-radius: 2px;
box-shadow: 0 2px 2px rgba(0, 0, 0, .4); }
.ehss_overlay .ehss_items .ehss_inner ul li a span .fa,
.ehss_overlay .ehss_items .ehss_inner ul li a span .ehss {
vertical-align: middle;
color: white;
font-size: 50px;
text-shadow: 0 2px 2px rgba(0, 0, 0, .4); }
.ehss_overlay .ehss_items .ehss_inner ul li a span .ehss {
width: 100%;
height: 100%;
display: inline-block;
background-size: contain; }
.ehss_overlay .ehss_items .ehss_inner ul li a span .ehss.ehss-line {
background-image: url('styles/endlesshorizon/socialshare/line.png'); }
<xen:if is="@enableResponsive">
@media (max-width: @maxResponsiveNarrowWidth)
{
.Responsive .ehss_overlay .ehss_items .ehss_inner { width: auto; }
}
</xen:if>