/* Badge */

.badge { /* https://codepen.io/rnarian/pen/nJGQKk */
    position: absolute;
    top:-5px;
    right: -8px;
    padding: 3px 9px;
    border: 2px solid white;
    border-radius:100px;
    background: -webkit-linear-gradient(top, #FF6969 0%,#ff0000 100%);
    box-shadow: 0 1px 2px rgba(0,0,0,.5), 0 1px 4px rgba(0,0,0,.4), 0 0 1px rgba(0,0,0,.7) inset, 0 10px 0px rgba(255,255,255,.11) inset; 
    -webkit-background-clip: padding-box;
    font:bold 16px/20px "Helvetica Neue", sans-serif; 
    color: white;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0,0,0,.6);
}


.nomostrar{
    display: none;
    visibility: hidden;
}

.ver{
    font-size: 12px;
    color: #ff9900;
}



/* ***** Inicio SLIDER ***** */

@-webkit-keyframes scroll {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(calc(-250px * 8)); /* 7, 8 */
            transform: translateX(calc(-250px * 8));
  }
}

@keyframes scroll {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  100% {
    -webkit-transform: translateX(calc(-250px * 8));
            transform: translateX(calc(-250px * 8));
  }
}


/* slider */

.slider {
  /* background: #ffffff; */
  background: var(--slider-bg);
  /*box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.125);*/ /* HEES v2.1.1 */
  height: 80px; /* 100 */
  margin: auto;
  overflow: hidden;
  position: relative; /* fixed */
  width: 640px; /* HEES 202211-13 960 px */
  bottom: 0px; /* top */
  z-index: 999;
}
.slider::before, .slider::after {
 /* background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);*/
  background: var(--slider-bg);
  content: "";
  height: 100px;
  position: absolute;
  width: 20px; /* 200 */
  z-index: 2;
}
.slider::after {
  right: 0;
  top: 0;
  -webkit-transform: rotateZ(180deg);
          transform: rotateZ(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
.slider .slide-track {
  -webkit-animation: scroll 40s linear infinite;
          animation: scroll 40s linear infinite;
  display: flex;
  width: calc(250px * 16); /* 7 = 14, 8 = 16 */
}
.slider .slide {
  height: 100px;
  width: 250px;
}
/* FIN SLIDER */




/*  Back to Top Button */
#backTop {
    position:fixed;
    bottom: 20px;
    right: 40px;
}

#backTop a {
  width: 50px;
  height: 50px;
  position: fixed;
  bottom: 50px;
  right: 20px; /* HEES 50 */
  z-index: 999999999;
  cursor: pointer;
  border-radius: 100px;
  transition: all 0.5s;
  background: #FF9900
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z' fill='%23fff'/%3E%3C/svg%3E")
    no-repeat center center;

}
#backTop a:hover {
   background: #F45000
    url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z' fill='%23fff'/%3E%3C/svg%3E")
    no-repeat center center;
    z-index: 999999999;
}

/* FIN Back to Top */

/* DIA NOCHE */


/* DEFAULT */
html {
  /*height: 100%;
  font-family: "Montserrat";
  display: grid;
  align-items: center;
  justify-items: center; */
  --bg: #ccc;
  --bg-panel: #EBEBEB;
  --color-headings: #29282b;
  --color-text: #333333;
  --color-hr: #cccccc;
  --menu: #ff9900;
  --personaliza-bg:  #CCC;
  --personaliza-txt: #000;
  --slider-bg:  #EBEBEB;
  /* Menu */
  --menu-burger: #fff;
}




/* DARK */
html[data-theme=dark] {
  --bg: #333333;
  --bg-panel: #434343;
  --color-headings: #000;
  --color-text: #fff;
  --color-hr: #FF9900;
  --menu:  #FFF;
  --personaliza-bg:  #bbb;
  --personaliza-txt: #000;
  --slider-bg:  #434343;
      /* Menu */
  --menu-burger: #FFF;
}



/* ************* FIN Day/Night *************** */


body {
  background-color: var(--bg);
}



input[type=checkbox] {
  height: 0;
  width: 0;
  visibility: hidden;
}

label {
  cursor: pointer;
  text-indent: -9999px;
  width: 52px;
  height: 27px;
  background: grey;
  float: center;
  border-radius: 100px;
  top:  -10px;
  position: relative;
}

label:after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 90px;
  transition: 0.3s;
}

input:checked + label {
  background: var(--color-headings);
}

input:checked + label:after {
  left: calc(100% - 5px);
  transform: translateX(-100%);
}

label:active:after {
  width: 45px;
}

html.transition,
html.transition *,
html.transition *:before,
html.transition *:after {
  transition: all 750ms !important;
  transition-delay: 0 !important;
}

/* Iframe */
iframe {
  height: 400px; /* 300px */
  width: 100%; /* 300px */
  resize: both;
  overflow: auto;
}