@import url("https://fonts.googleapis.com/css?family=Red+Hat+Display:400,900&display=swap");

@font-face {
  font-family: "rubik";
  src: url("/wp-includes/fonts/Rubik-VariableFont_wght.ttf");
}

h4,
h3 {
  margin: 0;
}

div {
  position: relative;
}

.tabs-btns-container {
  display: flex;
  justify-content: center;
  /* background: #F7F7F7; */
  height: 46px;
  direction: rtl;
  padding: 2px 10px 0;
  list-style-type: none;
  margin-top: 0;
}

/* #pension-tab-btn.active::after,
#pension-tab-btn:hover::after,
#pension-tab-btn:focus::after {
  left: 9% !important;
  right: 31% !important;
  width: 110px !important;
} */

/* #gemel-tab-btn.active::after,
#gemel-tab-btn:hover::after,
#gemel-tab-btn:focus::after {
  left: 9% !important;
  right: 34% !important;
  width: 90px !important;
} */

/* #bituach-tab-btn.active::after,
#bituach-tab-btn:hover::after,
#bituach-tab-btn:focus:after {
  right: 35%;
  width: 88px;
} */

#gemel-tab-btn span,
#pension-tab-btn span,
#bituach-tab-btn {
  color: #006bb7;
  font-size: 18.5px;
  font-weight: 600;
}

/* #pension-tab-btn {
    background-color: transparent !important;
} */

.tab-btn {
  font-size: 18px;
  color: #006bb7;
  /*#3d7fb8*/
  font-family: inherit;
  font-weight: 800;
  cursor: pointer;
  border: none;
  background: none;
  text-transform: uppercase;
  transition: color 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
  /* width: 50%; */
  width: calc(100% / 3);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

/* .tab-btn:after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 50%;
  width: 0%;
  height: 3px;
  background-color: #ffa527;
 
  transition: width 400ms cubic-bezier(0.25, 0.8, 0.25, 1),
    left 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
  pointer-events: none;
} */

#gemel-tab-btn.active span,
#pension-tab-btn.active span,
#bituach-tab-btn.active {
  color: #00367c;
  font-weight: 600;
}

#gemel-tab-btn span,
#pension-tab-btn span,
#bituach-tab-btn span {
  position: relative;
  display: inline-block;
}

#gemel-tab-btn.active span::after,
#pension-tab-btn.active span::after,
#bituach-tab-btn.active span::after,
/* #gemel-tab-btn.active:focus span::after, */
#gemel-tab-btn:hover span::after,
/* #pension-tab-btn.active:focus span::after, */
#bituach-tab-btn:hover span::after,
#pension-tab-btn:hover span::after {
  /* #pension-tab-btn:focus span::after, */
  /* #gemel-tab-btn:focus span::after, */
  /* #bituach-tab-btn:focus span::after { */
  position: absolute;
  content: "";
  bottom: -15px !important;
  height: 3px !important;
  background-color: #ffa527;
  right: 0px !important;
  width: 100% !important;
  transition:
    width 400ms cubic-bezier(0.25, 0.8, 0.25, 1),
    left 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
  pointer-events: none;
}

#gemel-buttons-container:after {
  content: "";
  position: absolute;
  background-color: #00367c21;
  right: 2px;
  width: 100%;
  height: 3px;
  bottom: -3px;
}

#gemel-buttons-container {
  margin-bottom: 11px;
}

/* chnged from px to % after the css broke - for future - try to change back to pixles */
/* .tab-btn.active:not(#bituach-tab-btn)::after, */
.tab-btn.active::after,
.tab-btn.active::after {
  left: 40%;
  width: 20%;
  /* width: 63px;
  right: 168px; */
}

/* .tab-btn:has(#pension-tab-btn):hover span::after,
.tab-btn:has(#gemel-tab-btn):hover span::after,
.tab-btn:has(#bituach-tab-btn):hover span::after,
.tab-btn:has(#pension-tab-btn):focus span::after,
.tab-btn:has(#gemel-tab-btn):focus span::after,
.tab-btn:has(#bituach-tab-btn):focus span::after {
  width: 20%;
  width: 63px;
  right: 168px;
  left: 40%;
} */

.tab-btn:hover::after,
.tab-btn:focus::after {
  width: 20%;
  left: 40%;
}

.info-container {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.ltr {
  direction: ltr;
  display: inline-block;
}

.title {
  margin-right: 15px;
  font-size: 12px;
}

.center {
  margin-left: 0;
  width: 75%;
  /* z-index: 10; */
  direction: ltr;
}

/* .top3 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    color: #4b4168;
    margin-right: -2rem;
}

.top3 .item {
    box-sizing: border-box;
    position: relative;
    background: white;
    width: 9rem;
    height: 10rem;
    text-align: center;
    margin: 0 1rem;

    border-radius: 0.5rem;
    transform-origin: bottom;
    cursor: pointer;
    transition: transform 200ms ease-in-out;
    box-shadow: 0 0 4rem 0 rgba(0, 0, 0, 0.1),
        0 1rem 2rem -1rem rgba(0, 0, 0, 0.3);
}

.top3 .item .pic {
    position: absolute;
    top: -2rem;
    left: 2.5rem;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    margin-right: 1rem;
    box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.2),
        0 1rem 1rem -0.5rem rgba(0, 0, 0, 0.3);
}

.top3 .item .pos {
    font-weight: 900;
    font-size: 1rem;
}

.top3 .item .name {
    font-size: 0.8rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    direction: rtl;
    padding: 0 5px;
}

.top3 .item .value {
    opacity: 0.5;
}

.top3 .item.one {
    width: 10rem;
    height: 10rem;
}

.top3 .item.one .pic {
    width: 5rem;
    height: 5rem;
    left: 2.5rem;
}

.top3 .item:hover {
    transform: scale(1.05);
} */

/* .list {
    margin: 15px auto 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
} */

/* .list .item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: white;
    height: 1.5rem;
    background: #ffebcd80;
    transform-origin: left;
    cursor: default;
    transition: transform 200ms ease-in-out;
    box-shadow: 0 0 4rem 0 rgba(0, 0, 0, 0.1),
        0 1rem 2rem -1rem rgba(0, 0, 0, 0.3);
    margin-bottom: 7px;
    width: 47%;
    margin-right: 8px;
    direction: ltr;
    max-width: 396px;
} */

/* .list .item:hover {
    transform: scale(1.02);
    box-shadow: 0px 0px 5px 3px rgb(33 33 33 / 20%);
} */

/* .list .item .pos {
    font-weight: 900;
    position: absolute;
    right: 0rem;
    text-align: center;
    font-size: 1rem;
    width: 1.5rem;
    color: #000;
    opacity: 0.6;
    transition: opacity 200ms ease-in-out;
} */

.list .item .pic {
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  margin-right: 1rem;
  box-shadow:
    0 0 1rem 0 rgba(0, 0, 0, 0.2),
    0 1rem 1rem -0.5rem rgba(0, 0, 0, 0.3);
}

/* .list .item .name {
    font-size: 0.8rem;
    margin-right: 30px;
    text-overflow: ellipsis;
    white-space: nowrap;
    direction: rtl; */
/* } */

/* .list .item .value {
    margin-right: 0.5rem;
    opacity: 0.5;
    font-weight: bold;
    font-size: 0.9rem;
} */

.list .item:hover .pos {
  opacity: 0.8;
}

/* .green {
    color: green;
}

.red {
    color: red;
} */

.arrows {
  display: flex;
  flex-direction: column;
  cursor: pointer;
}

.field-line {
  display: flex;
  align-items: center;
  gap: 10px;
  direction: ltr;
}

.field-line > span {
  cursor: pointer;
}

.period-btn {
  height: 50px;
  width: 50px;
  border-radius: 50%;
}

.field-line.active {
  color: green;
  font-weight: bold;
}

.field-line.active.ASC {
  color: red;
}

.field-line.active.DESC {
  color: green;
}

.period-buttons {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 50%;
  margin: auto;
}

.fields-container {
  z-index: 20;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-right: 40px;
}

/* .bottom-container {
    display: flex;
    justify-content: flex-start;
} */

#yieldGraph {
  direction: ltr;
}

/* BUTTONS EFFECT */

.period-buttons-container {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 50%;
  margin: auto;
}

.buttons-ul {
  margin: 0px 10px;
  padding: 0;
  display: flex;
  height: 60px;
  overflow: visible;
  align-items: center;
}

.buttons-ul li {
  list-style: none;
  margin: 0 15px;
}

.buttons-ul li a {
  position: relative;
  display: block;
  width: 36px;
  height: 36px;
  text-align: center;
  line-height: 36px;
  background: #fff;
  border-radius: 50%;
  font-size: 30px;
  color: #666666;
  text-decoration: none;
  transition: 0.5s;
  border: 2px solid lightgrey;
  font-size: 15px;
  cursor: pointer;
}

.buttons-ul li a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #d35400;
  transition: 0.5s;
  transform: scale(0.9);
  z-index: -1;
}

/* .buttons-ul li a:hover:before {
  transform: scale(1.2);
  box-shadow: 0 0 15px #d35400;
  filter: blur(3px);
} */

/* .buttons-ul li a:hover {
  color: #01549d;
  box-shadow: 0 0 15px #ffbb75;
 text-shadow: 0 0 15px #ffbb75;
} */

.buttons-ul li a.active:before {
  color: #01549d;
  transform: scale(1.2);
  box-shadow: 0 0 15px #d35400;
  filter: blur(3px);
}

/* .medal-img {
    height: 45px;
} */

.full-page-link {
  position: fixed;
  left: 0;
}

.full-page-link {
  display: flex;
  justify-content: flex-end;
}

.read-more-icon {
  height: 12px;
}

.move-to-full-link-container {
  display: flex;
  align-items: center;
  width: fit-content;
  margin-right: auto;
}

.main-page-full-page-link-text {
  text-decoration: none;
  display: inline;
  color: black;
  font-size: 13px;
}

.main-page-full-page-link {
  text-decoration: none;
  display: flex;
  align-items: center;
  height: 15px;
}

/* new css */

body {
  display: flex;
  flex-direction: column;
  margin: 0;
  font-family: "rubik", arial;
  overflow: hidden;
}

#confetti-container {
  position: absolute;
  width: 100%;
  height: 100%;
}

.leaderboard-wrapper {
  width: 99%;
  padding: 3px;
  margin-top: 20px;
  align-self: center;
  border-radius: 10px;
  background: linear-gradient(
    94.79deg,
    rgba(0, 107, 183, 0.6) 0.81%,
    rgba(0, 54, 124, 0.9) 100%
  );
  box-shadow:
    3px 2px 4px 0px rgba(201, 207, 224, 1),
    0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}

.leaderboard-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 7px;
  background-color: white;
}

.selector-container {
  display: flex;
  gap: 30px;
  justify-content: center;
  align-items: center;
  padding: 10px;
  width: 60%;
  align-self: center;
}

.selector-container span {
  white-space: nowrap;
}

.menu-dropdown-container {
  width: 20%;
}

.bottom-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  padding: 10px;
}

.top-btns-container {
  margin: 0;
  gap: 10px;
}

.top-btns-container .topButton {
  background: linear-gradient(180deg, #5cfa96 0%, #03b50c 100%);
  filter: saturate(50%);
}

.top-btns-container .downButton {
  background: linear-gradient(180deg, #f36b41 0%, #ef4d50 100%);
}

.top-btns-container .topButton::before,
.top-btns-container .downButton::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(217, 217, 217, 0.5);
  z-index: 2;
  transition: background-color 0.3s ease;
}

.top-btns-container .topButton.active,
.top-btns-container .downButton.active {
  box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.25) inset;
}

.top-btns-container .topButton.active::before,
.top-btns-container .downButton.active::before {
  background-color: transparent;
}

.top3 {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.top3 .item {
  display: flex;
  border-radius: 100px;
  align-items: center;
  padding: 10px;
  height: 50px;
  box-sizing: border-box;
}

.item.one {
  background: linear-gradient(63.43deg, #fffbf0 0%, #ffce31 100%);
}

.item.two {
  background: linear-gradient(63.43deg, #fffbf0 0%, #d9d9d9 100%);
}

.item.three {
  background: linear-gradient(63.43deg, #fffbf0 0%, #d3976e 100%);
}

.medal-img {
  height: 45px;
}

.name-container {
  display: grid;
  grid-template-columns: 0.3fr 1fr;
  width: 100%;
  column-gap: 10px;
}

.name-container .name:first-child {
  grid-column: span 2;
}

.list span,
.name-container span {
  font-size: 15px;
  font-weight: 500;
}

.value {
  direction: ltr;
  place-self: start;
}

.list {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.list .item {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: space-between;
  transition: transform 200ms ease-in-out;
}

.list .item:hover {
  transform: scale(1.02);
  box-shadow: 0px 0px 5px 3px rgb(33 33 33 / 20%);
}

.list .item .value {
  font-weight: bold;
}

.list .item .pos {
  display: inline-block;
  width: 20px;
  height: 20px;
  text-align: center;
  font-weight: normal;
  font-size: 1rem;
  color: white;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.9861 0.415793C11.8578 0.284194 11.7045 0.179608 11.5351 0.108198C11.3657 0.0367887 11.1838 0 11 0C10.8162 0 10.6343 0.0367887 10.4649 0.108198C10.2955 0.179608 10.1422 0.284194 10.0139 0.415793L9.1352 1.3179C8.96225 1.49559 8.74453 1.6233 8.50503 1.68754C8.26553 1.75178 8.01313 1.75016 7.77447 1.68287L6.56248 1.33993C6.38549 1.29017 6.20032 1.27635 6.01789 1.29929C5.83547 1.32223 5.65949 1.38146 5.50032 1.4735C5.34115 1.56553 5.20203 1.68851 5.09114 1.83516C4.98025 1.98182 4.89986 2.1492 4.85469 2.32742L4.54343 3.54767C4.4824 3.78789 4.35769 4.00718 4.18244 4.18244C4.00718 4.35769 3.78789 4.4824 3.54767 4.54343L2.32742 4.85331C2.1492 4.89848 1.98182 4.97888 1.83516 5.08976C1.68851 5.20065 1.56553 5.33978 1.4735 5.49894C1.38146 5.65811 1.32223 5.83409 1.29929 6.01652C1.27635 6.19894 1.29017 6.38411 1.33993 6.56111L1.68287 7.77447C1.7499 8.01293 1.75137 8.26506 1.68714 8.50429C1.62291 8.74352 1.49535 8.961 1.3179 9.13382L0.415793 10.0139C0.284194 10.1422 0.179608 10.2955 0.108198 10.4649C0.0367887 10.6343 0 10.8162 0 11C0 11.1838 0.0367887 11.3657 0.108198 11.5351C0.179608 11.7045 0.284194 11.8578 0.415793 11.9861L1.3179 12.8662C1.49535 13.039 1.62291 13.2565 1.68714 13.4957C1.75137 13.7349 1.7499 13.9871 1.68287 14.2255L1.33993 15.4375C1.29017 15.6145 1.27635 15.7997 1.29929 15.9821C1.32223 16.1645 1.38146 16.3405 1.4735 16.4997C1.56553 16.6588 1.68851 16.798 1.83516 16.9089C1.98182 17.0197 2.1492 17.1001 2.32742 17.1453L3.54767 17.4566C3.78789 17.5176 4.00718 17.6423 4.18244 17.8176C4.35769 17.9928 4.4824 18.2121 4.54343 18.4523L4.85331 19.6726C4.89863 19.8507 4.97914 20.0179 5.09009 20.1644C5.20104 20.3109 5.34019 20.4337 5.49934 20.5256C5.65849 20.6175 5.83442 20.6766 6.01677 20.6995C6.19912 20.7223 6.3842 20.7085 6.56111 20.6587L7.77447 20.3171C8.01313 20.2498 8.26553 20.2482 8.50503 20.3125C8.74453 20.3767 8.96225 20.5044 9.1352 20.6821L10.0139 21.5842C10.1422 21.7158 10.2955 21.8204 10.4649 21.8918C10.6343 21.9632 10.8162 22 11 22C11.1838 22 11.3657 21.9632 11.5351 21.8918C11.7045 21.8204 11.8578 21.7158 11.9861 21.5842L12.8662 20.6821C13.039 20.5047 13.2565 20.3771 13.4957 20.3129C13.7349 20.2486 13.9871 20.2501 14.2255 20.3171L15.4375 20.6587C15.6144 20.7085 15.7995 20.7223 15.9819 20.6995C16.1642 20.6766 16.3401 20.6175 16.4993 20.5256C16.6584 20.4337 16.7976 20.3109 16.9085 20.1644C17.0195 20.0179 17.1 19.8507 17.1453 19.6726L17.4566 18.4523C17.5176 18.2121 17.6423 17.9928 17.8176 17.8176C17.9928 17.6423 18.2121 17.5176 18.4523 17.4566L19.6726 17.1467C19.8507 17.1014 20.0179 17.0209 20.1644 16.9099C20.3109 16.799 20.4337 16.6598 20.5256 16.5007C20.6175 16.3415 20.6766 16.1656 20.6995 15.9832C20.7223 15.8009 20.7085 15.6158 20.6587 15.4389L20.3171 14.2255C20.2498 13.9869 20.2482 13.7345 20.3125 13.495C20.3767 13.2555 20.5044 13.0378 20.6821 12.8648L21.5842 11.9861C21.7158 11.8578 21.8204 11.7045 21.8918 11.5351C21.9632 11.3657 22 11.1838 22 11C22 10.8162 21.9632 10.6343 21.8918 10.4649C21.8204 10.2955 21.7158 10.1422 21.5842 10.0139L20.6821 9.1352C20.5044 8.96225 20.3767 8.74453 20.3125 8.50503C20.2482 8.26553 20.2498 8.01313 20.3171 7.77447L20.6587 6.56248C20.7085 6.38558 20.7223 6.2005 20.6995 6.01815C20.6766 5.8358 20.6175 5.65987 20.5256 5.50072C20.4337 5.34157 20.3109 5.20242 20.1644 5.09147C20.0179 4.98052 19.8507 4.90001 19.6726 4.85469L18.4523 4.54343C18.2121 4.4824 17.9928 4.35769 17.8176 4.18244C17.6423 4.00718 17.5176 3.78789 17.4566 3.54767L17.1467 2.32742C17.1015 2.1492 17.0211 1.98182 16.9102 1.83516C16.7994 1.68851 16.6602 1.56553 16.5011 1.4735C16.3419 1.38146 16.1659 1.32223 15.9835 1.29929C15.8011 1.27635 15.6159 1.29017 15.4389 1.33993L14.2255 1.68287C13.9869 1.75016 13.7345 1.75178 13.495 1.68754C13.2555 1.6233 13.0378 1.49559 12.8648 1.3179L11.9861 0.415793ZM9.62274 5.49098V12.3773V16.509V8.24549V6.56248V5.49098Z" fill="%231C85DF"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.downButton .iconWrapper {
  transform: rotate(180deg);
}

.list .item:hover .tooltiptext {
  display: block;
}

#full-page-container {
  display: none;
}

.tooltiptext {
  display: none;
  position: absolute;
  width: 100%;
  height: fit-content;
  text-align: center;
  border-radius: 5px;
  background-color: #ebebeb;
  color: #101010;
  top: -100%;
  right: 10%;
  font-weight: normal !important;
  padding: 0 10px;
}

.green {
  color: #087c32;
}

.red {
  color: #ef4d50;
}

.logo-image {
  opacity: 1;
  position: absolute;
  width: 19%;
  height: 17%;
  left: 78%;
  bottom: 20%;
  z-index: 100;
}

.bottom-container #top-3 + #top-list #link-to-full-page {
  color: #00367c;
  font-weight: 500 !important;
  font-size: 15px !important;
  text-decoration: none;
  display: flex;
  gap: 10px;
  align-items: center;
  direction: ltr;
}

#arrow-to-full-page {
  display: inline-block;
  transform: rotateY(180deg);
  color: #00367c;
  font-weight: 500 !important;
  font-size: 17px !important;
  width: 25px;
  scale: 1.5;
}

@media only screen and (max-width: 768px) {
  .selector-container {
    width: 100%;
    gap: 10px;
  }

  .bottom-container {
    gap: 5px;
    padding: 5px;
  }

  .name-container .name:first-child {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .list .item .name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    direction: rtl;
    width: max-content;
    /*90px*/
    vertical-align: sub;
  }

  #top-3,
  #top-list {
    grid-column: span 2;
  }

  #top-list .item div:first-child .name {
    max-width: 14em;
  }
}

@media only screen and (max-width: 600px) {
  .top3,
  .fields-container {
    margin-right: 0;
  }

  .bottom-container {
    flex-direction: column;
    gap: 15px;
  }

  .fields-container {
    flex-direction: row;
    justify-content: space-evenly;
  }

  .center {
    width: 100%;
  }

  .tabs-btns-container {
    padding: 2px 0px 0;
  }

  .title,
  .info-container {
    text-align: center;
    margin: 0;
  }
}

@media (min-width: 600px) and (max-width: 800px) {
  /* @media (min-width:600px) and (max-width:900px) { */
  .top3,
  .fields-container {
    margin-right: 0;
  }

  .list .item .name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    direction: rtl;
  }

  .bottom-container {
    flex-direction: row;
    gap: 15px;
  }

  .fields-container {
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-right: 40px;
  }

  .center {
    width: 75%;
  }

  .tabs-btns-container {
    padding: 2px 0px 0;
  }

  .title,
  .info-container {
    text-align: center;
    margin: 0;
  }
}

@media (max-width: 768px) {
  #gemel-buttons-container:not(.main-page) {
    justify-content: space-evenly;
    gap: 20px;
    padding: 2px 10px;

    .tab-btn {
      border-radius: 7px;
      background-color: rgba(240, 246, 251, 1);
      box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);

      span {
        color: rgba(0, 54, 124, 0.7);
      }

      &.active {
        background-color: rgba(0, 107, 183, 1);
        box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25) inset;

        span {
          color: white;
        }
      }

      span::after,
      span::before {
        content: unset;
      }
    }
  }

  #gemel-buttons-container .banner-component-container {
    box-shadow: none;
    height: 2em !important;
    flex-direction: row;
    width: 75%;
    justify-content: center;
    gap: 1em;
    left: 0px;
    white-space: nowrap;
  }

  #gemel-buttons-container .banner-component-container #banner-1,
  #gemel-buttons-container .banner-component-container #banner-2,
  #gemel-buttons-container .banner-component-container #banner-3 {
    width: auto;
    padding: 2px 5px;
    flex: 1 1 0;
  }

  #gemel-buttons-container:after {
    height: 0px;
  }

  .list {
    gap: 10px;
  }
}