/*
#010326
#F2E205
#F2B705
#F29F05
#F28705
*/

/*
#220901
#621708
#941B0C
#BC3908
#F6AA1C
*/

/*
#322C2B
#803D3B
#AF8260
#E4C59E
#F6AA1C
*/

/*
#fb8500
#ffb703
#023047
#220901
#040D12
*/

/*
#151515
#A91D3A
#C73659
#220901
#C40C0C
*/

:root {
  --white: #fff;
  --primary: #C40C0C;
  --secondary: #151515;
  --success: #28a745;
  --danger: #dc3545;
  --dark: #220901;
  --black: #000000;
}

/* text color */
.text-primary {
  color: var(--primary);
}
.text-secondary {
  color: var(--secondary);
}
.text-success {
  color: var(--success);
}
.text-danger {
  color: var(--danger);
}
.text-dark {
  color: var(--dark);
}
.text-white {
  color: var(--white);
}

/* bg-colors */
.bg-primary {
  background-color: var(--primary);
}
.bg-secondary {
  background-color: var(--secondary);
}
.bg-success {
  background-color: var(--success);
}
.bg-danger {
  background-color: var(--danger);
}
.bg-dark {
  background-color: var(--dark);
}
.bg-black {
  background-color: var(--black);
}

/* buttons */
.btn {
  cursor: pointer;
  display: inline-block;
  padding: 10px 30px;
  border: none;
  border-radius: 10px;
  border: 1px solid var(--primary);
}
.btn:hover {
  opacity: 0.9;
  border: var(--secondary) 1px solid;
  color: var(--primary);

}

.btn-primary {
  color: var(--white);
  background-color: var(--primary);
}

.btn-secondary {
  color: var(--white);
  background-color: var(--secondary);
}

.btn-danger {
  color: var(--white);
  background-color: var(--danger);
}

.btn-dark {
  color: var(--white);
  background-color: var(--dark);
}

.btn-outline {
  background: transparent;
  border: 1px solid var(--white);
  color: var(--white);
}

.btn-outline-primary {
  background: transparent;
  border: 1px solid var(--primary);
  color: var(--dark);
}
.btn-outline-primary:hover {
  background-color: var(--primary);
  border: 1px solid var(--primary);
  color: var(--white);
}