:root {
  --theme-black: #0a0000;
  --theme-red: #a60000;
  --theme-red-dark: #7b0000;
  --theme-cell: #680000;
  --theme-brown: #2e0900;
  --theme-gold: #c47b08;
  --theme-gold-light: #ffe36b;
  --theme-cream: #fff2cc;
  --theme-muted: #f2d9ae;
}

* { box-sizing: border-box; }

html, body { min-height: 100%; margin: 0; }

body {
  font-family: 'Kanit', Tahoma, sans-serif;
  width: 100%;
  min-height: 100vh;
  color: var(--theme-cream);
  background-image: linear-gradient(rgba(10, 0, 0, .88), rgba(46, 9, 0, .92)), url('img/bg.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

.form-check {
    position: relative;
    display: block;
    padding-left: 0rem !important;
}

.navbhar,
.navbar {
  cursor: pointer !important;
  color: var(--theme-cream);
  background: linear-gradient(180deg, var(--theme-red), var(--theme-red-dark));
  border-bottom: 2px solid var(--theme-gold);
  box-shadow: 0 5px 16px rgba(0, 0, 0, .45);
}

.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
  cursor: pointer !important;
  color: var(--theme-gold-light) !important;
}

.dropdown-toggle {
  cursor: pointer !important;
}

.dropdown-item {
  cursor: pointer !important;
  color: var(--theme-cream);
  background: var(--theme-cell);
}

.dropdown-menu {
  padding: .35rem;
  background: var(--theme-red-dark);
  border: 1px solid var(--theme-gold);
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--theme-gold-light);
  background: var(--theme-brown);
}

.card,
.modal-content,
.panel,
.content-box {
  color: var(--theme-cream);
  background: linear-gradient(180deg, var(--theme-red), var(--theme-red-dark));
  border: 2px solid var(--theme-gold);
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px var(--theme-gold-light), 0 12px 28px rgba(0, 0, 0, .42);
}

.card-header,
.modal-header,
.panel-heading {
  color: var(--theme-gold-light);
  background: var(--theme-red-dark);
  border-bottom: 1px solid var(--theme-gold);
}

.form-control,
.custom-select {
  color: #301000;
  background: #fff8e5;
  border: 2px solid var(--theme-gold);
}

.form-control:focus,
.custom-select:focus {
  border-color: var(--theme-gold-light);
  box-shadow: 0 0 0 .2rem rgba(196, 123, 8, .24);
}

.btn-primary,
.btn-warning {
  color: #351000;
  font-weight: 700;
  background: linear-gradient(180deg, #fff183, #ffc52e 52%, #b96a00);
  border-color: var(--theme-gold-light);
}

.btn-primary:hover,
.btn-warning:hover {
  color: #230900;
  background: linear-gradient(180deg, #fff6ad, #ffd348 52%, #c47b08);
  border-color: #fff6ad;
}

.offline {
  color: #ff766e;
  font-weight: 700;
}

.online {
  color: #a9ef78;
  font-weight: 700;
}

a { color: var(--theme-gold-light); }
a:hover { color: #fff6ad; }
::selection { color: var(--theme-cream); background: var(--theme-red); }

/* HEHEHERO FINAL BLUE */
html,body{background:#061f35!important;background-image:none!important;color:#eef9ff!important}
.card,.panel,.box,.content,.container .card{background:#083b61!important;border-color:#2189c2!important;color:#eef9ff!important;box-shadow:none!important}
.card-header,.panel-heading,.title{background:#0d78b7!important;color:#fff!important;border-color:#2189c2!important}
.btn-primary,.btn-success{background:#0d78b7!important;border-color:#62c9f6!important;color:#fff!important}
