html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

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

body {
    /*margin-bottom: 60px;*/
}

.bg-light-gray {
    background-color: #EEEEEE;
    overflow: hidden;
}

.bg-black {
    background-color: #000000;
}

.bg-red {
    background-color: #DE1725;
}

.bg-blue {
    background-color: #4087FF;
}

.card-top {
    height: 15px;
    border-top-right-radius: 0.75rem;
    border-top-left-radius: 0.75rem;
}

.tail-truncate-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-group {
    margin-bottom: 1rem;
}

.min-h-100{
    min-height: 100%
}

.btn {
    border-radius: .25rem !important;
}

/* ===== DEFAULT STYLES (for large desktops/monitors) ===== */
.bg-header {
    height: 40vh;
}

.content {
    margin-top: -20vh;
}

.content-success {
    margin-top: -20vh;
}

.min-height-300px {
    min-height: 300px;
}

/* ===== LG: Medium laptops / landscape tablets (992px - 1199.98px) ===== */
@media (min-width: 992px) {
    .bg-header {
        height: 35vh;
    }

    .content {
        margin-top: -35vh;
    }
    .content-success {
        margin-top: -15vh !important;
    }

    .min-height-300px {
        min-height: 400px;
    }
}

/* ===== MD: Tablets / iPads (768px - 991.98px) ===== */
@media (min-width: 768px) and (max-width: 991.98px) {
    .bg-header {
        height: 45vh;
    }

    .content {
        margin-top: -45vh;
    }
    .content-success {
        margin-top: -15vh !important;
    }

    .min-height-300px {
        min-height: 400px;
    }
}

/* ===== SM: Mobile phones and small tablets (<768px) ===== */
@media (max-width: 767.98px) {
    .bg-header {
        height: 35vh;
    }

    .content {
        margin-top: -35vh;
    }
    .content-success {
        margin-top: -15vh !important;
    }

    .seller-nm {
        padding-bottom: 5rem !important;
        padding-top: 5rem !important;
    }
}

.wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* full viewport height */
}

.content {
    flex: 1; /* take up available space */
}

.gutters-3 {
    margin-right: -.5rem;
    margin-left: -.5rem;
}

    .gutters-3 > .col,
    .gutters-3 > [class*="col-"] {
        padding-right: 0.5rem;
        padding-left: 0.5rem;
    }