.btn-like-wrap {
    display: inline-block;
    position: relative;
    vertical-align: bottom;
    line-height: 1;
        font-size: 15.5px;
    margin: 0px 0px 0px 0px;
   /* min-width: 320px; */
}

/**
 * Button
 */
.btn-like {
    margin: 0;
    display: inline-block;
    border-radius: 1em;
    border: 1px solid #d3d3d3;
    line-height: 1em;
    padding: 0.25em 0.5em;
    font-size: 0.95em;
    font-weight: 700;

    color: #777;
    background: #dfdfdf;
    box-shadow: 1px 1px 0 rgba(255,255,255,0.5) inset;
    text-shadow: 0 1px 0 rgba(255,255,255,0.5);
    text-decoration: none;
}

.btn-like {
    -webkit-transition: .25s;
    -moz-transition: .25s;
    -ms-transition: .25s;
    -o-transition: .25s;
    transition: .25s;
}

.btn-like:focus {
    outline: none;
    border-color: #999;
}

.btn-like:hover,
.btn-like.active,
.btn-like:active {
    color: #fff;
    text-shadow: 0 1px 0 rgba(0,0,0, .3);
background-color: #ee4e4f;
    border-color: #b12f27;
}

.btn-like:active {
  box-shadow: 0 0 5px 3px rgba(0,0,0,0.2) inset;
}

.btn-like.active:focus {
    background-color: #ff7d75;
}

.btn-like--vertical {
    width: 100%;
}

/**
 * Counter
 */
.btn-like-counter {
    position: relative;
    display: inline-block;
    border: 1px solid #898F9C;
    border-radius: .25em;
    vertical-align: top;

    color: #afafaf;
    font-size: 1.0em; /*    color: #333;
    font-size: .75em; */
    text-align: center;
    text-decoration: none;
    background-color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a.btn-like-counter:hover {
    text-decoration: underline;
    color: #333;
}

.btn-like-counter--horizontal {
    padding: .25em .5em;
    margin-left: .5em;
    line-height: 1em;
    min-width: 2.25em;
}

.btn-like-counter--vertical {
    display: block;
    margin-bottom: .375em;
    padding: .5625em .5em;
    line-height: 1em;
    font-size: 1em;
}

/* Counter arrow */
.btn-like-counter:before {
    content: '';
    width: .25em;
    height: .25em;
    position: absolute;
    border: 1px solid transparent;
    background: #fff;
    border-bottom-color: #898F9C;

    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476, sizingMethod='auto expand');
}

.btn-like-counter--horizontal:before {
    left: -.2125em;
    top: 50%;
    margin-top: -.2em;
    border-left-color: #898F9C;
}

.btn-like-counter--vertical:before {
    left: 50%;
    bottom: -.1925em;
    margin-left: -.15em;
    border-right-color: #898F9C;
}

/**
 * Loader
 */
.btn-like-counter.is-loading:after {
    content: '';
    display: inline-block;
    border-radius: 50%;
    border: .125em solid transparent;
    border-top-color: #ccc;
    border-left-color: #ccc;
    width: .75em;
    height: .75em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    -webkit-animation: spin .7s infinite linear;
    -moz-animation: spin .7s infinite linear;
    -o-animation: spin .7s infinite linear;
    animation: spin .7s infinite linear;
}

@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg)   }
    to   { -webkit-transform: rotate(360deg) }
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg)   }
    to   { -moz-transform: rotate(360deg) }
}

@-o-keyframes spin {
    from { -o-transform: rotate(0deg)   }
    to   { -o-transform: rotate(360deg) }
}

@keyframes spin {
    from { transform: rotate(0deg)   }
    to   { transform: rotate(360deg) }
}

/**
 * Color themes
 */
.btn-like--default-dark {
    color: #ddd;
    border-color: #333;
    background: #666;
    text-shadow: 0 1px 0 rgba(0,0,0,0.5);
}

.btn-like--dark:hover,
.btn-like--dark.active,
.btn-like--dark:active {
    color: #eee;
    text-shadow: 0 1px 0 rgba(0,0,0, .3);
    background-color: #34495e;
    border-color: #2c3e50;
}

.btn-like--dark.active:focus {
    background-color: #46627e;
}

.btn-like--orange:hover,
.btn-like--orange.active,
.btn-like--orange:active {
    color: #eee;
    text-shadow: 0 1px 0 rgba(0,0,0, .3);
    background-color: #e67e22;
    border-color: #d35400;
}

.btn-like--orange.active:focus {
    background-color: #ff9a40;
}

.btn-like--green:hover,
.btn-like--green.active,
.btn-like--green:active {
    color: #eee;
    text-shadow: 0 1px 0 rgba(0,0,0, .3);
    background-color: #2ecc71;
    border-color: #27ae60;
}

.btn-like--green.active:focus {
    background-color: #6ad899;
}

.btn-like--blue:hover,
.btn-like--blue.active,
.btn-like--blue:active {
    color: #eee;
    text-shadow: 0 1px 0 rgba(0,0,0, .3);
    background-color: #64b2ee;
    border-color: #3498db;
}

.btn-like--blue.active:focus {
    background-color: #70c1ff;
}
