﻿/* Auth card styles (login, register, etc.)
------------------------------------------------- */

@media only screen and (max-width: 576px) {
    .auth-card {
        width: 100%;
    }
}

@media only screen and (min-width: 577px) {
    .auth-card {
        width: 30rem;
    }
}

.auth-card {
    margin: auto;
    margin-top: 5%;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.auth-card-btn {
    width: 100%;
}

.auth-card-header {
    text-align: right;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -.5px;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;
    background-color: #25A0DA; /*Soluta*/
    /*background-color: #002bf2; Boon Chapman*/
}

.card-img-top {
    display: block;
    max-width: 250px;
    height: auto;
    margin: 30px auto auto auto;
}

.label-link {
    float: right;
}

.account-load {
    text-align: center;
    margin-top: 25%;
}

#logoff {
    cursor: pointer;
}

.required::after {
    content: "*";
    font-weight: bold;
    color: red;
}

/* Body/content styles
-------------------------------------------------- */
body {
    overflow-y: scroll;
}

main {
    display: flex;
    flex-direction: column;
    font-family: Geneva,Tahoma,Verdana,sans-serif;
    min-height: 100vh;
    overflow-x: hidden;
    background-color: #f2f2f2;
}

#home-portal {
    border-left: 1px solid rgba(0, 0, 0, 0.125)
}

#search-bar {
    margin-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125)
}

#search-input-holder {
    padding-left: 15px;
    padding-right: 15px;
}

#view-holder {
    padding-left: 15px;
    padding-right: 15px;
}

.v-none {
    visibility:hidden
}


/* Input styles
-------------------------------------------------- */
textarea {
    resize: none;
    overflow: auto;
    word-break: break-word;
}

.input-error {
    background-color: rgba(255, 0, 0, 0.15) !important;
}

.input-warning {
    color: red;
}

.btn-group-xs > .btn, .btn-xs {
    padding: .55rem;
    font-size: .875rem;
    line-height: .5;
    border-radius: .2rem;
    width: auto !important;
}


/*
 * Force Bootstrap v4 transitions
 * (ignores prefers-reduced-motion media feature)
 * https://gist.github.com/robssanches/33c6c1bf4dd5cf3c259009775883d1c0
 */

.fade {
    transition: opacity 0.15s linear !important;
}

.modal.fade .modal-dialog {
    transition: -webkit-transform 0.3s ease-out !important;
    transition: transform 0.3s ease-out !important;
    transition: transform 0.3s ease-out,-webkit-transform 0.3s ease-out !important;
}

.form-control {
    transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out !important;
}

.btn {
    transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out !important;
}