:root {
  --color-primary: #003b7c;
  --color-primary-10: #003b7c10;
  --color-primary-20: #003b7c20;
  --color-primary-30: #003b7c30;
  --color-primary-40: #003b7c40;
  --color-primary-50: #003b7c50;
  --color-primary-60: #003b7c60;
  --color-primary-70: #003b7c70;
  --color-primary-80: #003b7c80;
  --color-primary-90: #003b7c90;
  --color-primary-dark: #002650;
  --color-secondary: #2f71b9;
  --color-secondary-10: #2f71b910;
  --color-secondary-20: #2f71b920;
  --color-secondary-30: #2f71b930;
  --color-secondary-40: #2f71b940;
  --color-secondary-50: #2f71b950;
  --color-secondary-60: #2f71b960;
  --color-secondary-70: #2f71b970;
  --color-secondary-80: #2f71b980;
  --color-secondary-90: #2f71b990;
  --color-secondary-dark: #1b528d;
}
.bg-primary-10 {
  background-color: var(--color-primary-10) !important;
}
.bg-primary-20 {
  background-color: var(--color-primary-20) !important;
}
.bg-primary-30 {
  background-color: var(--color-primary-30) !important;
}
.bg-primary-40 {
  background-color: var(--color-primary-40) !important;
}
.bg-primary-50 {
  background-color: var(--color-primary-50) !important;
}
.bg-primary-60 {
  background-color: var(--color-primary-60) !important;
}
.bg-primary-70 {
  background-color: var(--color-primary-70) !important;
}
.bg-primary-80 {
  background-color: var(--color-primary-80) !important;
}
.bg-primary-90 {
  background-color: var(--color-primary-90) !important;
}
.bg-secondary-10 {
  background-color: var(--color-secondary-10) !important;
}
.bg-secondary-20 {
  background-color: var(--color-secondary-20) !important;
}
.bg-secondary-30 {
  background-color: var(--color-secondary-30) !important;
}
.bg-secondary-40 {
  background-color: var(--color-secondary-40) !important;
}
.bg-secondary-50 {
  background-color: var(--color-secondary-50) !important;
}
.bg-secondary-60 {
  background-color: var(--color-secondary-60) !important;
}
.bg-secondary-70 {
  background-color: var(--color-secondary-70) !important;
}
.bg-secondary-80 {
  background-color: var(--color-secondary-80) !important;
}
.bg-secondary-90 {
  background-color: var(--color-secondary-90) !important;
}
body {
  background-color: #f1f9f9;
  font-family: 'Raleway', 'Arial';
}
.bg-primary {
  background-color: var(--color-primary) !important;
  transition: 0.2s;
}
.bg-primary:hover {
  background-color: var(--color-primary-dark) !important;
}
.bg-secondary {
  background-color: var(--color-secondary) !important;
  transition: 0.2s;
}
.bg-secondary:hover {
  background-color: var(--color-secondary-dark) !important;
}
.border-radius {
  border-radius: 18px;
}
#bg_pattern {
  position: absolute;
  z-index: -1;
  width: 80%;
  height: 80%;
  opacity: 0.25;
  background-image: url('../../assets/images/triangle.svg');
  background-repeat: repeat;
  background-size: 300px;
  transform: rotate(9deg);
  top: -30%;
}
#logo {
  max-width: 200px;
  width: 100%;
}
#search_bar_holder {
  position: relative;
}
#search_bar_holder i {
  position: absolute;
  top: 1.1rem;
  right: 1.1rem;
  font-size: 20px;
  color: #333;
}
#search_bar_holder #search_bar {
  font-size: 16px;
}
#search_bar_holder #search_bar::placeholder {
  color: #aaaaaa;
}
#breadcrumb_holder {
  font-size: 17px;
  font-weight: 400;
  background-color: #FFF;
}
#breadcrumb_holder .breadcrumb-item.active {
  font-weight: bold;
}
#breadcrumb_holder .arrow-right {
  font-size: 14px;
}
#top_nav {
  font-size: 17px;
  font-weight: 600;
}
a {
  color: var(--color-primary);
  text-decoration: none;
}
.cluster {
  height: 100%;
}
.cluster .cluster-title {
  background-color: var(--color-primary-20);
  transition: 0.2s;
  font-weight: 600;
}
.cluster .cluster-title:hover {
  color: #FFF;
  background-color: var(--color-primary);
}
.cluster .epa-container {
  overflow-y: auto;
  height: calc(100% - 40px);
  overflow-x: hidden;
}
.cluster .epa-container::-webkit-scrollbar {
  width: 10px;
}
.cluster .epa-container::-webkit-scrollbar-track {
  background: var(--color-primary-30);
}
.cluster .epa-container::-webkit-scrollbar-thumb {
  background: var(--color-primary-60);
  border: var(--color-primary-70);
  border-radius: 15px;
}
.cluster .epa-container .epa {
  transition: 0.2s;
  border-radius: 18px;
}
.cluster .epa-container .epa .label {
  font-weight: bold;
}
.cluster .epa-container .epa .tag {
  background-color: #FFF;
  font-size: 13px;
}
.cluster .epa-container .epa:hover {
  opacity: 0.9;
  cursor: pointer;
  transform: scale(0.98);
}
#epa_info_container .epa-label {
  font-size: 1.75rem;
  font-weight: 600;
  word-break: break-word;
  color: var(--color-primary);
}
#epa_info_container .epa-code {
  font-size: 1.2rem;
  color: var(--color-primary);
}
#epa_info_container .cluster-label {
  background-color: var(--color-secondary);
  color: #FFF;
}
.conditional-epas li,
.styled-links-list li {
  transition: 0.2s;
}
.conditional-epas li:hover,
.styled-links-list li:hover {
  background-color: var(--color-primary-90);
  cursor: pointer;
  color: #FFF !important;
}
.conditional-epas li.pointer-events-none:hover,
.styled-links-list li.pointer-events-none:hover {
  cursor: none;
}
.hidden-text-holder {
  transition: 0.2s;
}
.hidden-text-holder .hidden-text {
  display: none;
}
.hidden-text-holder:hover .visible-text {
  display: none;
}
.hidden-text-holder:hover .hidden-text {
  color: #FFF;
  display: inline-block;
}
.hidden-text-holder:hover i {
  color: #FFF;
}
.bg-pattern {
  background-image: url(../../assets/images/fo-pattern.png);
  background-repeat: repeat;
  background-size: 12px;
}
.li-spaced {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#footer {
  font-size: 0.8rem;
}
/* Toggle button start */
.switch-toggle.switch-candy,
.switch-light.switch-candy > span {
  background-color: #EEE !important;
  color: #333 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  border-radius: 15px !important;
}
.switch-toggle {
  position: relative;
  margin: auto;
}
.switch-toggle a,
.switch-toggle label {
  border: none !important;
  border-radius: 15px !important;
}
.switch-toggle a {
  border-radius: 15px !important;
}
.switch-toggle label:not(.disabled) {
  cursor: pointer;
}
.switch-candy a {
  border: 1px solid #333;
  border-radius: 3px;
  color: #FFF !important;
  background-color: var(--color-primary-30) !important;
  text-shadow: none !important;
}
.switch-light.switch-candy span span,
.switch-light.switch-candy input:checked ~ span span:first-child,
.switch-toggle.switch-candy label {
  text-shadow: none !important;
  color: #333 !important;
}
/* Toggle button end */
.pointer-events-none {
  pointer-events: none;
}
.pointer-events-none:hover {
  cursor: none !important;
}