.button {
    display: inline-block;
    color: #53575a;
    cursor: pointer;
    min-width: 100px;
    font-family: proxima-nova,sans-serif;
    font-style: normal;
    font-weight: 400;
    white-space: nowrap;
    text-align: center;
    box-sizing: border-box;
}

@media (max-width: 360px) {
    .button { min-width: 90px; }
}

.button.border {
    border        : 2px #d0d3d4 solid;
    padding       : .25em 1em;
    border-radius : 4px;
}

.button.disabled {
    color  : #a2aaad;
    cursor : default;
}

@media (max-width:360px) and (max-height:640px) {
    .button.mobile { font-size: 14px; }
}

@media (min-width:361px) and (max-width:640px) {
    .button.mobile { font-size: 16px; }
}

@media (min-width:641px) and (max-width:800px) {
    .button.mobile { font-size: 20px; }
}

@media (min-width:801px) and (max-width:990px) {
    .button.mobile { font-size: 20px; }
}

@media (min-width:991px) and (max-width:1200px) {
    .button.desktop { font-size: 14px; }
    .button.mobile { font-size: 20px; }
}

@media (min-width:1201px) and (max-width:1500px) {
    .button.desktop { font-size: 16px; }
}

@media (min-width:1501px) and (max-width:1920px) {
    .button.desktop { font-size: 16px; }
}

@media (min-width:1921px) {
    .button.desktop { font-size: 20px; }
}

.button.icon {
    margin: 0;
    padding: 0;
    min-width: initial;
    width: initial;
    background: 0;
    color: initial;
    border: 0;
    border-color: initial;
}

.button.icon.search.mobile {
    margin-right: 8px;
}

.button.icon.search.mobile {
    height: 100%;
}

.button.icon.search.mobile > svg {
    width: auto;
    height: 100%;
    fill: #848484;
    transition: fill .25s;
}

.button.icon.search.mobile.active > svg {
    fill: #8e382f;
}

.button.icon.information,
.button.icon.pdf,
.button.icon.favorite,
.button.icon.share,
.button.icon.infographic,
.button.icon.regular_video,
.button.icon.video_summary,
.button.icon.orthojoe,
.button.icon.author_insights,
.button.icon.eletter,
.button.icon.free,
.button.icon.supplement,
.button.icon.surgical_video {
    margin-left: 32px;
    vertical-align: middle;
}

.article.button.icon,
.podcast.button.icon,
.webinar.button.icon,
.course.button.icon,
.exam.button.icon,
.summary.button.icon,
.product_page.button.icon {
    margin: 0 32px .4em 0;
}

.button.icon.information > svg,
.button.icon.pdf > svg,
.button.icon.favorite > svg,
.button.icon.share > svg,
.button.icon.infographic > svg,
.button.icon.regular_video > svg,
.button.icon.video_summary > svg,
.button.icon.orthojoe > svg,
.button.icon.author_insights > svg,
.button.icon.eletter > svg,
.button.icon.free > svg,
.button.icon.supplement > svg,
.button.icon.surgical_video > svg {
    width: 1.5em;
    height: auto;
    fill: #808080;
}

.button.icon.infographic > svg,
.button.icon.eletter > svg {
    fill: #707070;
}

.button.icon.surgical_video > svg {
    fill: #202020;
}

.button.icon.free > svg {
    width: initial;
}

.button.icon.favorite.active > svg {
    fill: #00b4e1;
}
/*
.button.icon.information.mobile > svg,
.button.icon.pdf.mobile > svg,
.button.icon.favorite.mobile > svg,
.button.icon.share.mobile > svg,
.button.icon.infographic.mobile > svg,
.button.icon.video_summary.mobile > svg,
.button.icon.author_insights.mobile > svg,
.button.icon.eletter.mobile > svg,
.button.icon.free.mobile > svg {
    width: 1.25em;
}
*/
.button.icon.image {
    position: absolute;
    margin: 0;
}

.button.icon.image.favorite {
    bottom: -1.6em;
    right: 2.5em;
}

.button.icon.image.share {
    bottom: -1.5em;
    right: 0;
}

.button.icon.individual_summary {
    position: absolute;
}

.button.icon.individual_summary.favorite {
    right: 2.5em;
}

.button.icon.individual_summary.share {
    right: 0;
}

.button.search-button {
    width: auto;
    min-width: auto;
    height: auto;
    border: 0;
    padding: 0;
}

.button.search-button svg {
    fill: var(--jbjs-color);
}

.button.search-button.mobile {
    margin-right: 8px;
}

.button.search-button.mobile svg {
    width: auto;
    height: 100%;
}