/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
    url('../font/OpenSans-VariableFont_wdth\,wght.ttf') format('wght');
}

@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local(''),
    url('../font/OpenSans-Italic-VariableFont_wdth\,wght.ttf') format('wght');
}

.open-sans-light {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-regular {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-medium {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-bold {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-extra-bold {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-light-italic {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-regular-italic {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-medium-italic {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-bold-italic {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.open-sans-extra-bold-italic {
  font-family: "Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  src: local(''),
    url('../font/Rubik-VariableFont_wght.ttf') format('wght');
}

@font-face {
  font-family: 'Rubik';
  font-style: italic;
  font-weight: 400;
  src: local(''),
    url('../font/OpenSans-Italic-VariableFont_wdth\,wght.ttf') format('wght');
}

/* <weight>: Use a value from 300 to 800 */

.rubik-light {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-regular {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-medium {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-bold {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-extra-bold {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: normal;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-light-italic {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-regular-italic {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-medium-italic {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-bold-italic {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

.rubik-extra-bold-italic {
  font-family: "Rubik", sans-serif;
  font-optical-sizing: auto;
  font-weight: 900;
  font-style: italic;
  font-variation-settings: 
    "wdth" 100;
}

@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local(''),
    url('../font/Ubuntu-Regular.ttf') format('truetype'),
    url('../font/Ubuntu-Medium.ttf') format('truetype'),
    url('../font/Ubuntu-Light.ttf') format('truetype'),
    url('../font/Ubuntu-Regular.ttf') format('truetype'),
}

.ubuntu-light {
  font-family: "Ubuntu", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.ubuntu-regular {
  font-family: "Ubuntu", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.ubuntu-medium {
  font-family: "Ubuntu", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.ubuntu-bold {
  font-family: "Ubuntu", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.ubuntu-extra-bold {
  font-family: "Ubuntu", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.ubuntu-light-italic {
  font-family: "Ubuntu", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.ubuntu-regular-italic {
  font-family: "Ubuntu", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.ubuntu-medium-italic {
  font-family: "Ubuntu", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.ubuntu-bold-italic {
  font-family: "Ubuntu", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.ubuntu-extra-bold-italic {
  font-family: "Ubuntu", sans-serif;
  font-weight: 900;
  font-style: italic;
}

@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  src: local(''),
    url('../font/RobotoMono-VariableFont_wght.ttf') format('wght');
}

.roboto-mono-regular {
  font-family: "Roboto Mono", monospace;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

body {
  font-family: "Open Sans", "Rubik", sans-serif;
  background-color: #fefcf8; /* #FAFAFA; */
  color: #3c3c3c;
  max-width: 800px;
  margin: auto;
  padding: 0;
  margin-top: 0px;
  margin-bottom: 0px;
  font-size: 16px;
}

a {
  color: #e0aa3e;
  text-decoration: none;
}

a:hover {
  color: #ca9221;
  text-decoration: none;
}

.nav-link:hover { color: #ca9221; }
.nav-link:focus { color: #ca9221; }
.nav-link.dropdown-toggle:hover { color: #ca9221; }
.nav-link.dropdown-toggle:focus { color: #ca9221; }
.dropdown-menu:focus { color: #ca9221; }
.dropdown-item:hover { color: #ca9221; }

h1, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", "Rubik", sans-serif;
}

/* https://flatuicolors.com/palette/defo */
.gold { color: #e0aa3e; }
.gold-shade-1 { color: #c48d1f; }
.gold-shade-2 { color: #b3811d; }
.gold-shade-3 { color: #a2751a; }
.gold-shade-4 { color: #916817; }
.gold-shade-5 { color: #805c15; }
.gold-shade-6 { color: #6f5012; }
.gold-shade-7 { color: #5e440f; }
.gold-shade-8 { color: #4d380c; }
.gold-shade-9 { color: #3d2c0a; }
.gold-shade-10 { color: #2c1f07; }
.gold-tint-1 { color: #e5b960; }
.gold-tint-2 { color: #e8c071; }
.gold-tint-3 { color: #ebc882; }
.gold-tint-4 { color: #eecf93; }
.gold-tint-5 { color: #f0d7a3; }
.gold-tint-6 { color: #f3deb4; }
.gold-tint-7 { color: #f6e6c5; }
.gold-tint-8 { color: #f8edd6; }
.gold-tint-9 { color: #fbf4e7; }
.gold-tint-10 { color: #fefcf8; }
.gold-similar-1 { color: #e0d33e; }
.gold-similar-2 { color: #e0c53e; }
.gold-similar-3 { color: #e0b83e; }
.gold-similar-4 { color: #e09d3e; }
.gold-similar-5 { color: #e08f3e; }
.gold-similar-6 { color: #e0823e; }
.gold-dark { color: #ca9221; }
.gold-light { color: #ebc780; }

.white { color: #ffffff !important; }
.black { color: #000000; }
.gris { color: #4d4d4d; }
.pome { color: #c0392b; }
.pumpkin { color: #d35400; }
.orange { color: #f39c12;}
.sunflower { color: #f1c40f; }
.carrot { color: #e67e22; }
.alizarin { color: #e74c3c; }
.clouds { color: #ecf0f1; }
.concrete { color: #95a5a6; }
.silver { color: #bdc3c7; }
.asbestos { color: #7f8c8d; }
.midnight { color: #2c3e50; }
.asphalt { color: #34495e; }
.amethyst { color: #9b59b6; }
.wisteria { color: #8e44ad; }
.belize { color: #2980b9; }
.river { color: #3498db; }
.green { color: #27ae60; }
.emerald { color: #2ecc71; }
.turquoise { color: #1abc9c; }
.greensea { color: #1abc9c; }

.d-hidden { visibility: hidden !important; }
.d-none { display: none !important; }
.d-visible { visibility: visible !important; }
.d-block { display: block !important; }
.tab { padding-left: 1rem; }
.tab-2 { padding-left: 2rem; }
.font-minor { font-size: 0.85rem; }

.btn-outlined-gris { color: #4d4d4d; background-color: #ffffff; border: 1px solid #4d4d4d; }
.btn-outlined-gris:hover { color: #ffffff; background-color: #4d4d4d; border: 1px solid #ffffff; }
.btn-outlined-gris:focus { color: #ffffff; background-color: #4d4d4d; border: 1px solid #ffffff; }
.btn-outlined-gold { color: #e0aa3e; background-color: #ffffff; border: 1px solid #e0aa3e; }
.btn-outlined-gold:hover { color: #ffffff; background-color: #e0aa3e; border: 1px solid #ffffff; }
.btn-outlined-gold:focus { color: #ffffff; background-color: #e0aa3e; border: 1px solid #ffffff; }
.btn-gold { color: #ffffff; background-color: #e0aa3e; border: 0px; }
.btn-gold:hover { color: #ffffff; background-color: #a2751a; border: 0px; }
.btn-gold:focus { color: #ffffff; background-color: #e0aa3e; border: 0px; }
.btn-outlined-fail { color: #c0392b; background-color: #ffffff; border: 1px solid #c0392b; }
.btn-outlined-fail:hover { color: #ffffff; background-color: #c0392b; border: 1px solid #ffffff; }
.btn-outlined-fail:focus { color: #ffffff; background-color: #c0392b; border: 1px solid #ffffff; }

.bg-lightgold { background-color: #fefcf8; }
.bg-gold { background-color: #e0aa3e; }
.bg-darkgold { background-color: #916817; }
.bg-off { background-color: #d0d0d0; opacity: 60%; }
.bg-lightgray { background-color: #f0f0f0; }
.border-gold { border-color: #e0aa3e !important; }
.bg-fail { background-color: #c0392b !important;}
.border-fail { border-color: #c0392b !important;}

.w-100 { width: 100%; }
.h-100 { height: 100%; }
.w-75 { width: 75%; }
.h-75 { height: 75%; }
.w-50 { width: 50%; }
.h-50 { height: 50%; }
.w-25 { width: 25%; }
.h-25 { height: 25%; }

.font-bolder { font-weight: 900; }
.font-bold { font-weight: 700; }
.font-regular { font-weight: 400; }
.font-light { font-weight: 200; }

.underline { text-decoration: underline !important;}
.text-justified { text-align: justify !important;}
.text-error { color: #c0392b !important; }
.text-header { font-weight: 600; color: #2c3e50; }

/* MAIN COLOR */
.primary-color { color: #FFCC00; }
.secondary-color { color: #D0D0D0; }
.complementary-color { color: #0033ff; }

/* MONOCHROMATIC VERSIONS */
.mono-1 { color: #b38f00; }
.mono-2 { color: #cca300; }
.mono-3 { color: #e6b800; }
.mono-4 { color: #FFCC00; }
.mono-5 { color: #ffd11a; }
.mono-6 { color: #ffd633; }
.mono-7 { color: #ffdb4d; }

/* ALTERNATIVE COLORS */
.alter-1 { color: #ff8c00; }
.alter-2 { color: #ffa200; }
.alter-3 { color: #ffb700; }
.alter-4 { color: #ffe100; }
.alter-5 { color: #fff700; }
.alter-6 { color: #f2ff00; }

/* SHADE COLORS */
.shade-1 { color: #ebbc00; }
.shade-2 { color: #d8ad00; }
.shade-3 { color: #c49d00; }
.shade-4 { color: #b18d00; }
.shade-5 { color: #9d7e00; }
.shade-6 { color: #896e00; }
.shade-7 { color: #765e00; }
.shade-8 { color: #624e00; }
.shade-9 { color: #4e3f00; }
.shade-10 { color: #3b2f00; }
.shade-11 { color: #271f00; }
.shade-12 { color: #141000; }

/* TINT COLORS */
.tint-1 { color: #ffd014; }
.tint-2 { color: #ffd427; }
.tint-3 { color: #ffd83b; }
.tint-4 { color: #ffdc4e; }
.tint-5 { color: #ffe062; }
.tint-6 { color: #ffe476; }
.tint-7 { color: #ffe789; }
.tint-8 { color: #ffeb9d; }
.tint-9 { color: #ffefb1; }
.tint-10 { color: #fff3c4; }
.tint-11 { color: #fff7d8; }
.tint-12 { color: #fffbeb; }

/* MAIN COLOR */
.primary-bg-color { background-color: #FFCC00; }
.secondary-bg-color { background-color: #D0D0D0; }

/* MONOCHROMATIC VERSIONS */
.mono-bg-1 { background-color: #b38f00; }
.mono-bg-2 { background-color: #cca300; }
.mono-bg-3 { background-color: #e6b800; }
.mono-bg-4 { background-color: #FFCC00; }
.mono-bg-5 { background-color: #ffd11a; }
.mono-bg-6 { background-color: #ffd633; }
.mono-bg-7 { background-color: #ffdb4d; }

/* ALTERNATIVE COLORS */
.alter-bg-1 { background-color: #ff8c00; }
.alter-bg-2 { background-color: #ffa200; }
.alter-bg-3 { background-color: #ffb700; }
.alter-bg-4 { background-color: #ffe100; }
.alter-bg-5 { background-color: #fff700; }
.alter-bg-6 { background-color: #f2ff00; }

/* SHADE COLORS */
.shade-bg-1 { background-color: #ebbc00; }
.shade-bg-2 { background-color: #d8ad00; }
.shade-bg-3 { background-color: #c49d00; }
.shade-bg-4 { background-color: #b18d00; }
.shade-bg-5 { background-color: #9d7e00; }
.shade-bg-6 { background-color: #896e00; }
.shade-bg-7 { background-color: #765e00; }
.shade-bg-8 { background-color: #624e00; }
.shade-bg-9 { background-color: #4e3f00; }
.shade-bg-10 { background-color: #3b2f00; }
.shade-bg-11 { background-color: #271f00; }
.shade-bg-12 { background-color: #141000; }

/* TINT COLORS */
.tint-bg-1 { background-color: #ffd014; }
.tint-bg-2 { background-color: #ffd427; }
.tint-bg-3 { background-color: #ffd83b; }
.tint-bg-4 { background-color: #ffdc4e; }
.tint-bg-5 { background-color: #ffe062; }
.tint-bg-6 { background-color: #ffe476; }
.tint-bg-7 { background-color: #ffe789; }
.tint-bg-8 { background-color: #ffeb9d; }
.tint-bg-9 { background-color: #ffefb1; }
.tint-bg-10 { background-color: #fff3c4; }
.tint-bg-11 { background-color: #fff7d8; }
.tint-bg-12 { background-color: #fffbeb; }

/*--------------------------------------------------------------
# Cookie consent banner
--------------------------------------------------------------*/

#cookieConsentBanner {
    display: none; /* Hidden by default, shown with JS */
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(40,40,40, 0.85); /* A dark, non-intrusive color */
    color: white;
    padding: 1rem 0;
    z-index: 999; /* High z-index to be on top */
    font-size: 1rem;
}

#cookieConsentBanner p {
    margin: 0;
    padding: 0 1rem;
}

/*--------------------------------------------------------------
# Pricing Carousel
--------------------------------------------------------------*/
#pricingPlans {
  font-family: "Open Sans", "Rubik", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  vertical-align: middle;
}

#carouselPlan {
  width: 100%;
  background: #fff;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  vertical-align: middle;
}

#carouselPlan .carousel-control-prev {
  z-index: 999;
  max-width: 2rem;
  justify-content: left;
  margin-left: -1rem;
}
#carouselPlan .carousel-control-next {
  z-index: 999;
  max-width: 2rem;
  justify-content: right;
  margin-right: -1rem;
}

#carouselPlan .card {
  max-width: 100%;
  margin: auto;
}

#carouselPlan .card-header {
  font-size: 2rem;
  font-weight: 800;
  color: #e0aa3e;
}

#carouselPlan .card-title {
  font-size: 3rem;
  font-weight: 600;
  color: #34495e;
  margin-top: -1rem;
}

#carouselPlan .month-price {
  position: relative;
  margin-top: -1rem;
  padding: 0;
  font-size: 0.9rem;
  color: #999999;
}

#carouselPlan ul {
  font-size: 1rem;
  padding-left: 0;
  text-align: left;
  list-style: none;
  color: #777777;
}
#carouselPlan ul li {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill:%23e0aa3e; transform: ;msFilter:;"><path d="m10 15.586-3.293-3.293-1.414 1.414L10 18.414l9.707-9.707-1.414-1.414z"></path></svg>');
  padding-left: 1.3rem;
  background-position: -5px -2px;
  background-repeat: no-repeat;
}

#carouselPlan ul ul {
  font-size: 0.85rem;
  padding-left: 0;
  text-align: left;
  list-style: none;
}
#carouselPlan ul ul li {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill:%23e0aa3e; transform: ;msFilter:;"><path d="M10.707 17.707 16.414 12l-5.707-5.707-1.414 1.414L13.586 12l-4.293 4.293z"></path></svg>');
  background-size: 1.25rem 1.25rem;
  background-position: -0.5rem -0.05rem;
  background-repeat: no-repeat;
  padding-left: 0.75rem;
  padding-bottom: 0.1rem;
}

#carouselPlan ul ul ul {
  font-size: 0.85rem;
  padding-left: 1rem;
  padding-bottom: 0.1rem;
  text-align: left;
  list-style: square;
}
#carouselPlan ul ul ul li::marker {
  color: #e0aa3e;
}
#carouselPlan ul ul ul li {
  padding-left: 0;
  background-image: none;
}

#carouselPlan .carousel-control-next-icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBzdHlsZT0iZmlsbDogcmdiYSgwLCAwLCAwLCAxKTt0cmFuc2Zvcm06IDttc0ZpbHRlcjo7Ij48cGF0aCBkPSJNMTAuMjk2IDcuNzEgMTQuNjIxIDEybC00LjMyNSA0LjI5IDEuNDA4IDEuNDJMMTcuNDYxIDEybC01Ljc1Ny01LjcxeiI+PC9wYXRoPjxwYXRoIGQ9Ik02LjcwNCA2LjI5IDUuMjk2IDcuNzEgOS42MjEgMTJsLTQuMzI1IDQuMjkgMS40MDggMS40MkwxMi40NjEgMTJ6Ij48L3BhdGg+PC9zdmc+);
  background-repeat: no-repeat;
  background-color: rgb(255, 255, 255, 0.45); 
  background-size: 2rem 2rem;
  border-radius: 50%;
  border: 0px;
}

#carouselPlan .carousel-control-prev-icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBzdHlsZT0iZmlsbDogcmdiYSgwLCAwLCAwLCAxKTt0cmFuc2Zvcm06IDttc0ZpbHRlcjo7Ij48cGF0aCBkPSJtMTIuNzA3IDcuNzA3LTEuNDE0LTEuNDE0TDUuNTg2IDEybDUuNzA3IDUuNzA3IDEuNDE0LTEuNDE0TDguNDE0IDEyeiI+PC9wYXRoPjxwYXRoIGQ9Ik0xNi4yOTMgNi4yOTMgMTAuNTg2IDEybDUuNzA3IDUuNzA3IDEuNDE0LTEuNDE0TDEzLjQxNCAxMmw0LjI5My00LjI5M3oiPjwvcGF0aD48L3N2Zz4=);
  background-repeat: no-repeat;
  background-color: rgb(255, 255, 255, 0.45); 
  background-size: 2rem 2rem;
  border-radius: 50%;
  border: 0px;
}

/*--------------------------------------------------------------
# card-credit
--------------------------------------------------------------*/
.card-body .card-credit {
  font-size: 0.85rem;
}
.card-body .card-credit .form-control {
  font-size: 0.85rem;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  color: #444444;
  font-size: 14px;
  background: #fff; /*#eeeef5;*/
 /* box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1); */
}

#footer .footer-top {
  padding: 2rem 0 2rem 0;
  background: #fafafa;
}

#footer .footer-top .footer-contact {
  margin-bottom: 10px;
}

#footer .footer-top .footer-contact h3 {
  font-size: 32px;
  margin: 0 0 10px 0;
  padding: 0;
  line-height: 1;
  font-weight: 700;
  color: #e0aa3e; /* #c0392b; */ /*#5a5af3;*/
}

#footer .footer-top .footer-contact p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  font-family: "Ubuntu", "Open Sans", sans-serif;
  color: #777777;
}

#footer .footer-top h4 {
  font-size: 16px;
  font-weight: bold;
  color: #2c3e50; /*#434175;*/
  position: relative;
  padding-bottom: 12px;
}

#footer .footer-top .footer-links {
  margin-bottom: 30px;
}

#footer .footer-top .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#footer .footer-top .footer-links ul i {
  padding-right: 2px;
  color: #e0aa3e; /* #c0392b; */ /*#5a5af3;*/
  font-size: 18px;
  line-height: 1;
}

#footer .footer-top .footer-links ul li {
  padding: 10px 0;
  display: flex;
  align-items: center;
}

#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}

#footer .footer-top .footer-links ul a {
  color: #777777;
  transition: 0.3s;
  display: inline-block;
  line-height: 1;
}

#footer .footer-top .footer-links ul a:hover {
  text-decoration: none;
  color: #e0aa3e; /* #c0392b; */ /*#5a5af3;*/
}

#footer .footer-newsletter {
  font-size: 15px;
}

#footer .footer-newsletter h4 {
  font-size: 16px;
  font-weight: bold;
  color: #444444;
  position: relative;
  padding-bottom: 12px;
}

#footer .footer-newsletter form {
  margin-top: 30px;
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 50px;
  text-align: left;
  border: 1px solid #4d4d4d; /*#b9b9fa;*/
}

#footer .footer-newsletter form input[type="email"] {
  border: 0;
  padding: 4px 8px;
  width: calc(100% - 100px);
}

#footer .footer-newsletter form input[type="submit"] {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: #e0aa3e; /* #c0392b; */ /*#5a5af3;*/
  color: #fff;
  transition: 0.3s;
  border-radius: 50px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-newsletter form input[type="submit"]:hover {
  background: #ca9221; /* #e74c3c; */ /*#7272f5;*/
}

#footer .credits {
  padding-top: 5px;
  font-size: 10px;
  color: #444444;
}

#footer .credits a {
  transition: 0.3s;
}

#footer .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #f0f0f0; /*#deddec;*/
  color: #e0aa3e; /* #c0392b; */ /*#434175;*/
  line-height: 1;
  padding: 8px 0;
  margin-right: 4px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

#footer .social-links a:hover {
  background: #ca9221; /* #e74c3c; */ /*#5a5af3;*/
  color: #fff;
  text-decoration: none;
}

/*--------------------------------------------------------------
# Form
--------------------------------------------------------------*/
.page-header {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    padding: 1rem;
}
.multi-step-form {
    max-width: 800px;
    margin: 0 auto;
    background-color: #fff;
    padding: 10px;
    /* border-radius: 10px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); */
}
.form-step {
    display: none; /* Hidden by default */
}
.form-step.active {
    display: block; /* Show the active step */
}
.progress-indicator {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
    position: relative;
}
.progress-indicator::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #dee2e6;
    transform: translateY(-50%);
    z-index: 1;
}
.step-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #dee2e6;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.1em;
    position: relative;
    z-index: 2;
    transition: background-color 0.3s, color 0.3s;
}
.step-circle.active {
    border-color: #e0aa3e;
    border-width: 4px;
    border-style: solid;
    color: #e0aa3e;
    background-color: #fff;
}
.step-circle.done {
    background-color: #e0aa3e;
    color: #fff;
}
.form-navigation {
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
}
.form-navigation button {
    min-width: 100px;
}
.invalid-feedback {
    display: block; /* To make it visible when needed */
}
.form-control.is-invalid {
    border-color: #c0392b;
    background-image: none;
    padding: 0.375rem 0.75rem;
}

.was-validated .custom-select:valid {
  background-image: none;
}

.was-validated .custom-select:invalid {
  background-image: none;
}

.token-validation-container {
    max-width: 300px;
    margin: 30px auto;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    background-color: #ffffff;
}
.token-input-group {
    display: flex;
    gap: 5px;
    margin: 0.3rem 0;
}
.token-inputA {
    width: calc(16.666% - 5px); /* Adjust width for 6 inputs with gap */
    text-align: center;
    font-size: 1rem;
    color: #000000;
}
.token-inputB {
    width: calc(16.666% - 5px); /* Adjust width for 6 inputs with gap */
    text-align: center;
    font-size: 1rem;
    color: #000000;
}
.countdown-timer {
    font-size: 0.9em;
    color: #000; /* Bootstrap danger color for emphasis */
    margin-top: 15px;
}

.linkDisabled {
  pointer-events: none;
  cursor: not-allowed;
  text-decoration: none;
}

.whatsapp-button {
    position: relative; /* Keeps the button in place relative to the viewport */
    bottom: 20px;    /* Distance from the bottom of the screen */
    right: 20px;     /* Distance from the right of the screen */
    z-index: 9999;   /* Ensures it stays on top of other content */
    display: block;  /* Ensures it takes up its own space */
    width: 60px;     /* Adjust size as needed */
    height: 60px;    /* Adjust size as needed */
    border-radius: 50%; /* Makes it a circle */
    overflow: hidden; /* Hides anything outside the circle */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Optional: Adds a shadow */
    transition: transform 0.3s ease-in-out; /* Optional: Smooth hover effect */
}

.whatsapp-button img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image covers the entire button */
}

/* Optional: Hover effect */
.whatsapp-button:hover {
    transform: scale(1.1); /* Slightly enlarge on hover */
}

.whatsapp-button {
    background-color: #25D366; 
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 36px; 
    text-decoration: none;
}