/* This file was mostly made to deal with making the Glow website still
look 99% the same on both the front facing and admin side during the 
upgrade from Bootstrap 4 to Bootstrap 5. The other CSS files are only 
included on one layout or the other and I don't want to mess up 
existing CSS classes by mixing those files together. */

body {
    font-family: "Nunito", sans-serif !important;
}

.gg-container {
    box-shadow: 0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) !important;
    background-color: #000000 !important;
}

p, ul, label, input, select, h6,
.fs-7, .btn, .rental-options, .table-transparent {
    font-size: 0.9rem !important;
}

h1 {
    font-size: 2.25rem !important;
}

h2 {
    font-size: 1.8rem !important;
}

h3 {
    font-size: 1.575rem !important;
}

h4 {
    font-size: 1.35rem !important;
}

h5 {
    font-size: 1.125rem !important;
}

small {
    font-size: .775rem !important;
}

select, .select2-selection {
    border: 1px solid #e3e3e3 !important;
}

select {
    height: 38px !important;
}

.select2-selection {
    height: 31px !important;
}

.white-hr {
    opacity: 1 !important;
}

.amber-hr {
    border-top: 1px solid #916F18 !important;
    opacity: 1 !important;
}

.menu-item {
    color: #fff !important;
}

.gallery-link, .menu-item {
    text-decoration: none;
}

.gallery-link:hover, .menu-item:hover {
    text-decoration: underline;
}

.table-transparent {
    background-color: transparent !important;
    color: white !important;
}

.form-check-input {
    margin-top: 0.25rem !important;
}

/* Golden Button */
.gold-button, .gold-button:hover  {
    color: white !important;
    background-color: #916F18 !important;
    border-color: #916F18 !important;
}

.gold-button:focus, .gold-button:active  {
    outline: none !important;
    box-shadow: none !important;
}