﻿:root {
    --bs-secondary:  #FDEDF2;
    --bs-green: #006225;
    --bs-red: #A40606;
    --bs-yellow: #ffd500;
    --bs-white: #fff;
    --bs-gold: #CCA45D;
}

* {
color: black;
    font-weight: 300;
    font-family: 'Comfortaa', cursive;
}

.bg-white {
    background-color: var(--bs-white); 
}

.bg-secondary {
    background-color: var(--bs-secondary); 
}

.bg-green {
    background-color: var(--bs-green);
}


body {
    background-color: black;
    font-family: 'Comfortaa', cursive;
}
.text-white {
     color: var(--bs-white);
} 
.text-red {
     color: var(--bs-red);
}

.text-gold {
     color: var(--bs-gold);
}

.text-yellow {
     color: var(--bs-yellow);
}

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
 font-family: 'Comfortaa', cursive;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);

}

.btn {
    font-weight: 300;
}
.btn-red {
    color: #fff;
    background-color: var(--bs-red);
    border-color: #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        text-decoration: none !important;
}

.btn-yellow {
    color: var(--bs-red) !important;
    background-color: var(--bs-yellow);
    border-color: #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    text-decoration: none !important;
}

.btn-gold {
    color: #fff;
    background-color: var(--bs-gold);
    border-color: #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        text-decoration: none !important;
}
.btn-white {
    color: #fff;
    background-color: var(--bs-white);
    border-color: #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    text-decoration: none !important;
}
.btn-dark-1 {
    color: #fff;
    background-color: #A40606;
    border-color: #000000;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        text-decoration: none !important;
    
}
.btn-dark-1:hover {
    color: #fff;
    background-color: #446245;
    border-color: #27251b;
}
.btn-check:focus+.btn-dark-1, .btn-dark-1:focus {
    color: #fff;
    background-color: #212224;
    border-color: #b03e27;
    box-shadow: 0 0 0 0 rgba(71,  72,  74,  0.5);
}
.btn-check:checked+.btn-dark-1, .btn-check:active+.btn-dark-1, .btn-dark-1:active, .btn-dark-1.active, .show>.btn-dark-1.dropdown-toggle {
    color: #fff;
    background-color: #1f2022;
    border-color: #b03e27;
}
.btn-check:checked+.btn-dark-1:focus, .btn-check:active+.btn-dark-1:focus, .btn-dark-1:active:focus, .btn-dark-1.active:focus, .show>.btn-dark-1.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(71,  72,  74,  0.5);
}
.btn-dark-1:disabled, .btn-dark-1.disabled {
    color: #fff;
    background-color: #27282a;
    border-color: #b03e27;
}


.btn-group-sm>.btn {
    padding: .25rem .48rem !important;
    font-size: 0.5rem !important;
    border-radius: .3125rem !important;
}


a {
   font-family: 'Kanit', sans-serif;
   font-weight: 400;
   color: white;
    text-decoration: underline;
}

a:visited {
  color: white;
}

a:hover {
  color: white;
}

a:active {
  color: white;
}

.line-height-1 {
  line-height: 1;
}


