/* ==========================

    Project Name : Jackpotdeck
    Author Name : Lucid Themeslab
    Store Link : https://www.templatemonster.com/store/lucid_themeslab/
    Version : 1.0.0

===============================*/
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap" rel="stylesheet"');

:root {
  --primefont: "Rubik", sans-serif;
  --secondfont: "Anton", sans-serif;
  --tertiaryfont: "Shrikhand", serif;
}
[data-jackpotdeck-theme="light"] {
  --body-bg: #fff;
  --head-bg: #fff8f8;
  --banner-bg: 122, 185, 232;
  --prime-bg: #b63abb;
  --second-bg: #f3c117;
  --alt-bg: #fdf5ff;
  --card-bg: #b63abb;
  --card-alt-bg: #151515;
  --card-alt-bg2: #a7acada4;
  --dark-bg: #29323c;
  --input-bg: #ffffff;
  --icon-bg: #b63abb;
  --icon-alt-bg: #151515;
  --footer-bg: #fff;
  --footer-copy-bg: #b63abb;

  --nav-text: #ffffff;
  --nav-alt-text: #b63abb;
  --white-text: #ffffff;
  --prime-text: #f3c117;
  --second-text: #b63abb;
  --head-text: #1515115;
  --para-text: #151515;
  --icon-text: #ffffff;
  --head-alt-text: #151515;
  --para-alt-text: #151515;

  --input-text: #111111;
  --footer-text: #ffffff;
  --footer-copy-text: #ffffff;

  --prime-btn: #b63abb;
  --prime-btn2: #cb58cf;
  --prime-btn-text: #ffffff;
  --prime-btn-text2: #fff;
  --prime-btn-border: #cb58cf;
  --prime-btn-border2: #cb58cf;
  --input-border: #fbfcf8;
  --prime-border: #b63abb;
  --second-border:#f3c117;
  --light-border: #adabab;

    --second-btn: #f3c117;
  --second-btn2: #eec747;
  --second-btn-text: #ffffff;
  --second-btn-text2: #fff;
  --second-btn-border: #cb58cf;
  --second-btn-border2: #f3c117;
  --second-border: #eec747;
}

[data-jackpotdeck-theme="dark"] {
   --body-bg: #0e0e0e;
  --head-bg: #151515;
  --banner-bg: 20, 20, 20;
  --prime-bg: #b63abb;
  --second-bg: #f3c117;
  --alt-bg: #1a1a1a;
  --card-bg: #1e1e1e;
  --card-alt-bg: #101010;
  --card-alt-bg2: #3a3a3a;
  --dark-bg: #0a0a0a;
  --input-bg: #111111;
  --icon-bg: #b63abb;
  --icon-alt-bg: #242424;
  --footer-bg: #151515;
  --footer-copy-bg: #b63abb;

  --nav-text: #ffffff;
  --nav-alt-text: #f3c117;
  --white-text: #ffffff;
  --prime-text: #f3c117;
  --second-text: #b63abb;
  --head-text: #ffffff;
  --para-text: #d3d3d3;
  --icon-text: #ffffff;
  --head-alt-text: #f1f1f1;
  --para-alt-text: #151515;

  --input-text: #ffffff;
  --footer-text: #ffffff;
  --footer-copy-text: #ffffff;

  --prime-btn: #b63abb;
  --prime-btn2: #cb58cf;
  --prime-btn-text: #ffffff;
  --prime-btn-text2: #fff;
  --prime-btn-border: #cb58cf;
  --prime-btn-border2: #cb58cf;
  --input-border: #222222;
  --prime-border: #b63abb;
  --second-border: #f3c117;
  --light-border: #3d3d3d;

  --second-btn: #f3c117;
  --second-btn2: #eec747;
  --second-btn-text: #ffffff;
  --second-btn-text2: #fff;
  --second-btn-border: #cb58cf;
  --second-btn-border2: #f3c117;
}

.body-bg {
  background-color: var(--body-bg) !important;
}

.head-bg {
  background-color: var(--head-bg) !important;
}
.head-bg-trans {
  background: transparent;
}

.banner-bg {
  background-color: var(--banner-bg) !important;
}

.prime-bg {
  background-color: var(--prime-bg) !important;
}
.second-bg {
  background-color: var(--second-bg) !important;
}

.alt-bg {
  background-color: var(--alt-bg) !important;
}
.card-bg {
  background-color: var(--card-bg) !important;
}
.dark-bg {
  background-color: var(--dark-bg) !important;
}
.card-alt-bg {
  background-color: var(--card-alt-bg) !important;
}

.input-bg {
  background-color: var(--input-bg) !important;
}

.icon-bg {
  background-color: var(--icon-bg) !important;
}

.footer-bg {
  background-color: var(--footer-bg) !important;
}

.footer-copy-bg {
  background-color: var(--footer-copy-bg) !important;
}

.nav-text {
  color: var(--nav-text) !important;
}
.icon-text {
  color: var(--icon-text) !important;
}

.white-text {
  color: var(--white-text) !important;
}

.prime-text {
  color: var(--prime-text) !important;
}
.second-text {
  color: var(--second-text) !important;
}

.head-text {
  color: var(--head-text) !important;
}

.para-text {
  color: var(--para-text) !important;
}

.head-alt-text {
  color: var(--head-alt-text) !important;
}

.para-alt-text {
  color: var(--para-alt-text) !important;
}

.input-text {
  color: var(--input-text) !important;
}
.input-border {
  border: 1px solid var(--input-border) !important;
}
.footer-text {
  color: var(--footer-text) !important;
}

.footer-copy-text {
  color: var(--footer-copy-text) !important;
}

.prime-btn {
  background-color: var(--prime-btn) !important;
  color: var(--prime-btn-text) !important;
  border: 1px solid var(--prime-border) !important;
}

.prime-btn:hover {
  background-color: var(--prime-btn2) !important;
  color: var(--prime-btn-text) !important;
  border: 1px solid var(--prime-btn-border2) !important;
}

.second-btn {
  background-color: var(--second-btn) !important;
  color: var(--second-btn-text) !important;
  border: 1px solid var(--second-border) !important;
}

.second-btn:hover {
  background-color: var(--second-btn2) !important;
  color: var(--second-btn-text) !important;
  border: 1px solid var(--second-btn-border2) !important;
}
.prime-outline-btn {
  background-color: transparent !important;
  color: var(--prime-btn-text2) !important;
  border: 1px solid var(--prime-border) !important;
  text-transform: capitalize !important;
}

.prime-outline-btn:hover {
  background-color: var(--prime-btn) !important;
  color: var(--prime-btn-text) !important;
  border: 1px solid var(--prime-border) !important;
}

.prime-outline-btn2 {
  background-color: transparent;
  color: var(--prime-btn-text2);
  border: 1px solid var(--light-border);
  text-transform: capitalize;
}

.prime-outline-btn2:hover {
  background-color: var(--prime-btn);
  color: var(--prime-btn-text);
  border: 1px solid var(--prime-btn-border);
}

.prime-border {
  border-color: var(--prime-border) !important;
}

.light-border {
  border-color: var(--light-border) !important;
}
.prime-font {
  font-family: var(--primefont) !important;
}
.second-font {
  font-family: var(--secondfont) !important;
}
.tertiary-font {
  font-family: var(--tertiaryfont) !important;
}
.backgound-blur {
  backdrop-filter: blur(10px);
}
.fs-7 {
  font-size: 15px;
}
.fs-8 {
  font-size: 50px;
}
.fs-9 {
  font-size: 12px;
}
.fs-10 {
  font-size: 115px;
}
.pt {
  padding-top: 115px;
}
.ps-6 {
  padding-left: 15rem !important;
}
.pe-6 {
  padding-right: 15rem !important;
}
.dash-border{
    border-bottom: 1px dashed var(--second-bg);
}

html,
body,
body.body-bg,
[data-jackpotdeck-theme="dark"] body,
[data-jackpotdeck-theme="dark"] .body-bg {
  background: #000 !important;
  background-color: #000 !important;
  color: #fff !important;
}

:root {
  --body-bg: #000000 !important;
  --head-bg: #000000 !important;
  --card-alt-bg: #111111 !important;
  --para-text: rgba(255,255,255,0.82) !important;
  --head-text: #ffffff !important;
  --nav-text: #ffffff !important;
  --nav-alt-text: #ffffff !important;
  --white-text: #ffffff !important;
  --light-border: rgba(255,255,255,0.12) !important;
  --second-border: rgba(255,255,255,0.12) !important;
  --prime-border: rgba(255,255,255,0.18) !important;
  --icon-bg: #111111 !important;
  --icon-alt-bg: #1a1a1a !important;
}

section,
main,
footer,
header.fix,
.offcanvas,
.offcanvas-body,
.head-bg,
.alt-bg {
  background-color: transparent !important;
}

[data-logo="dark"] {
  display: block !important;
}

[data-logo="light"] {
  display: none !important;
}