:root {

    --theme-color-default: #be5add;

    --theme-color-one: #025ba0;

    --theme-color-two: #9bc72b;

    --theme-color-three: #f0c517;

    --theme-color-four: #bf1724;

    --theme-color-five: #5cc9f4;

    --white: #fff;

    --black: #000;

    --grey: #999;

    /*background-image:  url("../images/mainimages/backgroundTex4.JPG");*/

    background: radial-gradient(closest-side, #ffffff, #e0e0e0);

    --globe-width: 8px;

    --globe-height: 32px;

}

.light-bulbs {

  display: flex;

  justify-content: space-between;

  padding: 20px;

  width: 500px;

  margin: 0 auto;
}


.light-bulb {

  border-radius: 50%;

  height: var(--globe-height);

  width: var(--globe-width);

  position: relative;

  top: 10px;

  animation-duration: 1.1s;

  animation-iteration-count: infinite;
  
}


.light-bulb::before {

  content: '';

  position: absolute;

  border: 2px solid #222;

  width: 5px;

  height: 7px;

  background: #222;

  border-top-left-radius: 8px;

  border-top-right-radius: 8px;

  left: 0;

  top: -3px;
  

}

.light-bulb.theme-color-default {

    background: var(--theme-color-default);
    animation-name: light-up-theme-color-default;
}


.light-bulb.theme-color-one {

    background: var(--theme-color-one);
    animation-name: light-up-theme-color-one;
}


.light-bulb.theme-color-two {

  background: var(--theme-color-two);
    animation-name: light-up-theme-color-two;
}


.light-bulb.theme-color-three {

  background: var(--theme-color-three);
    animation-name: light-up-theme-color-three;
}


.light-bulb.theme-color-four {

  background: var(--theme-color-four);
  animation-name: light-up-theme-color-four;

}


.light-bulb.theme-color-five {

  background: var(--theme-color-five);
  animation-name: light-up-theme-color-five;

}

.light-bulbs::after {

  content: '';

  top: -60px;

  position: absolute;

  width: 510px;

  height: 150px;

  border-bottom: 4px solid #222;

  border-radius: 60%;

  z-index: -1;

  transform: translateX(-50%);

}

.l1::after
{
    left: 25%;
}

.l2::after
{
    left: 75%;
}

.light_cord {
    stroke: #858585;
}

/*
.light-bulb:last-of-type::after {

  border: none;

}


.light-bulbs::after {

  content: '';

  top: -20px;

  left: 60%;

  position: absolute;

  width: 90px;

  height: 28px;

  border-bottom: 4px solid #222;

  border-radius: 50%;

  z-index: -1;

}
*/

/* Light Bulb Left */

.light-bulbs-left::after {

  content: '';

  top: -60px;

  position: absolute;

  width: 150px;

  height: 510px;

  border-right: 4px solid #222;

  border-radius: 60%;

  z-index: -1;

  transform: translateX(-50%);

}

.light-bulbs-left {

  position: absolute;

  justify-content: space-between;

  padding: 20px;

  height: 500px;

  width: 50px;

  margin: 0 auto;

  left: 0%;

  top: 50%
}

.light-bulbs-left .light-bulb {
    margin-bottom: 53px;
    top:-80px
}

/* Light Bulb Right */

.light-bulbs-right::after {

  content: '';

  top: -60px;

  position: absolute;

  width: 150px;

  height: 510px;

  border-left: 4px solid #222;

  border-radius: 60%;

  z-index: -1;

  transform: translateX(-50%);

}

.light-bulbs-right {

  position: absolute;

  justify-content: space-between;

  padding: 20px;

  height: 500px;

  width: 50px;

  margin: 0 auto;

  right: 0%;

  top: 50%
}

.light-bulbs-right .light-bulb {
    margin-bottom: 53px;
    top:-80px
}

@keyframes light-up-theme-color-default {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-default);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-default);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-default);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-default);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-default);

  }

}

@keyframes light-up-theme-color-one {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-one);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-one);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-one);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-one);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-one);

  }

}


@keyframes light-up-theme-color-two {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-two);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-two);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-two);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-two);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-two);

  }

}


@keyframes light-up-theme-color-three {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-three);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-three);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-three);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-three);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-three);

  }

}


@keyframes light-up-theme-color-four {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-four);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-four);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-four);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-four);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-four);

  }

}


@keyframes light-up-theme-color-five {

  0% {

    box-shadow: 0 1px 10px 5px var(--theme-color-five);

  }

  25% {

    box-shadow: 0 1px 15px 5px var(--theme-color-five);

  }

  50% {

    box-shadow: 0 1px 20px 5px var(--theme-color-five);

  }

  75% {

    box-shadow: 0 1px 25px 5px var(--theme-color-five);

  }

  100% {

    box-shadow: 0 1px 15px 5px var(--theme-color-five);

  }

}