:root {
  --bg-color: #0000001c;
  --card-bg: #FFFFFF;
  --text-main: #2D3436;
  --text-secondary: #636E72;
  --primary-accent: #00B894;
  --secondary-accent: #0984E3;
  --button-primary: #00B894;
  --button-primary-text: #FFFFFF;
  --button-secondary: #0984E3;
  --button-secondary-text: #FFFFFF;
  --border-color: #E0E0E0;
}

:root {
  --box-shadow: 1px 1px 6px 3px #0000001c;
  --border-dark: 1px solid rgb(99, 99, 99);
}

.bodyColors{
  background-color: var(--bg-color);
  color: var(--text-main);
  background-image: none;
}
.navColors{
  /* background-color: var(--card-bg); */
  color: var(--text-main);
}
.toggleButtonColors{
  background-color: var(--button-secondary) !important;
  color: var(--button-primary) !important;
  border: 1px solid #E0E0E0 !important;
}
.navHomeButton{
  background-color: var(--button-secondary) !important;
  color: var(--button-secondary-text);
}
.navButtons{
  background-color: var(--card-bg);
  color: var(--button-primary-text);
  /* border: var(--border-dark); */
  box-shadow: var(--box-shadow);

}
.profileContainerColors{
  background-color: var(--card-bg) !important;
  border: var(--border-color) !important;
  box-shadow: var(--box-shadow);
  color: var(--text-main) !important;
}
.navContainerColor{
  /* box-shadow: var(--box-shadow); */
}
.imgRoundColors{
  border: var(--border-dark);
}
.downloadRColor{
  background-color: var(--button-secondary) !important;
  color: var(--button-primary-text) !important;
}
.heroTxtColors{
  color: var(--text-main) !important;
}
.jfdColors{
  color: var(--secondary-accent) !important;
}
.heroBtnColors {
  background-color: var(--button-secondary) !important;
  color: var(--button-secondary-text) !important;
  font-weight: bolder !important;
  font-size: 1.2vw !important;
}
.iconDivColors{
  background-color: white;
  border: var(--border-dark);
}
.contactBtnColors{
  border: var(--border-dark) !important;
}
.profileDescColors{
  color: black !important;
}
.aboutUsColors{
  color: var(--text-main) !important;
}
.aboutOneLinerColors{
  color: var(--text-main) !important;
}
.aboutSpan{
  color: var(--secondary-accent) !important;
}
.aboutBoxesColors{
  background-color: var(--card-bg) a !important;
  box-shadow: var(--box-shadow);
  color: var(--text-main) !important;
}
.inputColors{
  background-color: #0000000f !important;
  color: white !important;
}
.sendColors{
  background-color: var(--button-secondary) !important;
}