html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    overflow-y: auto!important;
}

html, body {
    height: 100%;
}

[aria-hidden=true] {
    display: inherit;
}

/* Bootstrap 4.0-beta has no .text-white-50, so style the label ourselves. */
#sync-last-label {
    color: rgba(255, 255, 255, 0.65);
}

/* Sync button spins while a sync is running (FA5 JS renders <i> as <svg>). */
#btn-sync.syncing i,
#btn-sync.syncing svg {
    animation: sync-spin 1.2s linear infinite;
}

#btn-sync.syncing {
    pointer-events: none;
    opacity: 0.6;
}

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

.closer{
    position: absolute;
    right: 1em;
    top: 1em;
}

#image-container img{
    max-width:100%;
}

#closer-icon{
    font-size:40px;
    color:#666;
}

body.image-viewer{
    background-color:#333;
}

.footer {
    background: #efefef;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    height:60px;
    line-height:60px;
    width:100%;
}

#image-card-template{
    display:none;
}

.modal-dialog{
    background-color:transparent!important;
}

.card {
    cursor:pointer;
}

.card-img-overlay{
    display:none;
    background-color: rgba(190,230,255,0.6);
}

#btn-show-selection{
    display:none;
}