:root {
  --menuTxtDecoThickness: 18%;
  --mnuTxtDecoClr: green;
  --initialTextColor: black;
}


.old-bg_slider {
  --slideTextColor: green;

  color: var(--initialTextColor);
 
  background-image: linear-gradient(90deg,
      var(--initialTextColor) 0%,
      var(--initialTextColor) 50%,
      var(--initialTextColor) 50%,
      var(--initialTextColorBgColor) 100%);
  transition: background-position .3s cubic-bezier(.47, .1, 1, .63),
    color .2s linear;
  transition-delay: 0.0s, 0.10s;
  z-index:50;
}

.bg_slider {
  --slideTextColor: green;
  font-family:Arial;
  font-size:2vh;
  font-weight:bold;
  color:var(--initialTextColor);
 
  background-image: linear-gradient(90deg,
      var(--initialTextColor) 0%,
      var(--initialTextColor) 50%,
      var(--initialTextColor) 50%,
      var(--initialTextColorBgColor) 100%);
  transition: background-position .3s cubic-bezier(.47, .1, 1, .63),
    color .2s linear;
  transition-delay: 0.0s, 0.10s;
  z-index:50;
}

.bg_slider:hover {
 text-decoration:underline;
 text-decoration-color: var(--mnuTxtDecoClr);
 text-decoration-thickness: var(--menuTxtDecoThickness);
 cursor: pointer;
 background-position: -100% 100%;
 }

.nav_bg_slider {
  display: none;
  position:absolute;  
  padding-left:.5%;
  cursor: pointer;
  font-weight:900;
  z-index:50;
}

.nav_bg_slider a {
  display: inline-block;
  color: var(--initialTextColor);
  font-weight:900;
  padding-top:.51%;
  padding-left: .26%;
  text-decoration:none;
  cursor: pointer;
  z-index:50;

 }
 
.slider {
 float:left;
 color: var(--initialTextColor);
 font-size:var(--topMenuFontSize); 
 font-weight:700; 
 cursor: pointer;
 z-index:50;
}
 
.slider-content {
  display: none;
  color: var(--initialTextColor);
  position:absolute;
  padding-left:1%;
  padding-top:1.7%;
  cursor: pointer;
  font-weight:900;
  z-index:50;
}

.slider-content a {
  display: inline-block;
  color: var(--initialTextColor);
  font-weight:900;
  padding-top:.51%;
  padding-left: .26%;
  text-decoration:none;
  cursor: pointer;
  z-index:50;

}

.slider-content a:hover {
  display: inline-block;
  cursor:pointer;
  font-weight:900;
  padding-left: 1.02%;
  padding-bottom: .26%;
  text-decoration:underline;
  text-decoration-color: var(--mnuTxtDecoClr);
  text-decoration-thickness: var(--menuTxtDecoThickness);
  z-index:50;
}

 .slider:hover .slider-content {
  display: block;
}

 
.slider_nav_link_text {
  --slideTextColor: green;

  color: var(--initialTextColor);
  padding-left:1%;
  background-image: linear-gradient(90deg,
      var(--initialTextColor) 0%,
      var(--initialTextColor) 50%,
      var(--initialTextColor) 50%,
      var(--initialTextColorBgColor) 100%);
  transition: background-position .3s cubic-bezier(.47, .1, 1, .63),
    color .2s linear;
  transition-delay: 0.0s, 0.10s;
  z-index:50;
 }

.slider_nav_link_text:hover { 
  text-decoration:underline;
  text-decoration-color: var(--mnuTxtDecoClr);
  text-decoration-thickness: var(--menuTxtDecoThickness);
  cursor: pointer;
  background-position: -100% 100%;
  display: inline-block;
  font-weight:900;
  font-size:var(--topMenuFontSize);
  padding-left: 1.3%;
  padding-bottom: .51%;
  z-index:50;
 }
