/* SCROLL REVEAL */

html.sr .hideload {
  visibility: hidden;
}

/* RIPPLE */

.ripplebg {
  background-color: var(--hi-color)!important;
  background-image: linear-gradient(90deg, var(--hi-color), var(--hi-color-light));
}

.intro-banner-vdo-play-btn{
    height:48px;
    width:48px;
    position: relative;
    text-align:center;
    border-radius:100px;
    background-color: transparent;
    z-index:1
}
.intro-banner-vdo-play-btn i{
    line-height:48px;
    font-size:30px
}
.intro-banner-vdo-play-btn .ripple{
    position:absolute;
    width:140px;
    height:140px;
    z-index:-10;
    left:9%;
    top:49%;
    opacity:0;
    margin:-70px 0 0 -70px;
    border-radius:100px;
    -webkit-animation:ripple 1.8s infinite;
    animation:ripple 1.8s infinite
}

@-webkit-keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
@keyframes ripple{
    0%{
        opacity:1;
        -webkit-transform:scale(0);
        transform:scale(0)
    }
    100%{
        opacity:0;
        -webkit-transform:scale(1);
        transform:scale(1)
    }
}
.intro-banner-vdo-play-btn .ripple:nth-child(2){
    animation-delay:.3s;
    -webkit-animation-delay:.3s
}
.intro-banner-vdo-play-btn .ripple:nth-child(3){
    animation-delay:.6s;
    -webkit-animation-delay:.6s
}

/* NIGHT & DAY */

.c-hero {
  position: absolute;
  top: 16px;
}

.c-theme-btn {
  display: inline-block;
  border: 0;
  width: .8rem;
  height: .8rem;
  padding: 0;
  border-radius: 50%;
  background: var(--white);
  cursor: pointer;
  margin: 0;
  position: relative;
  -webkit-transition: all 240ms ease-out 0ms;
  transition: all 240ms ease-out 0ms;
}
.c-theme-btn__inner {
  margin-bottom: .5rem;
  -webkit-transform: scale(1.5);
          transform: scale(1.5);
  color: var(--white);
  -webkit-transition: all 120ms ease-out 240ms;
  transition: all 120ms ease-out 240ms;
}
.c-theme-btn:hover {
  -webkit-transform: scale(1.05) rotate(-15deg);
          transform: scale(1.05) rotate(-15deg);
}
.c-theme-btn:before {
  content: '';
  position: absolute;
  width: .8rem;
  height: .8rem;
  background: var(--bg-color);
  border-radius: 50%;
  top: 50%;
  left: 50%;
  -webkit-transform: scale(0.5) translate(50%, -50%);
          transform: scale(0.5) translate(50%, -50%);
  -webkit-transform-origin: top right;
          transform-origin: top right;
  -webkit-transition: -webkit-transform 320ms ease-out 120ms;
  transition: -webkit-transform 320ms ease-out 120ms;
  transition: transform 320ms ease-out 120ms;
  transition: transform 320ms ease-out 120ms, -webkit-transform 320ms ease-out 120ms;
}
.c-theme-btn:active, .c-theme-btn:focus {
  outline: 0;
}
.c-theme-btn.is-active {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.c-theme-btn.is-active .c-theme-btn__inner {
  -webkit-transform: scale(0.5);
          transform: scale(0.5);
  opacity: 0;
}
.c-theme-btn.is-active:hover {
  -webkit-transform: scale(1.05) rotate(-60deg);
          transform: scale(1.05) rotate(-60deg);
}
.c-theme-btn.is-active:before {
  -webkit-transform: scale(1) translate(0%, -50%);
          transform: scale(1) translate(0%, -50%);
  -webkit-transition: -webkit-transform 320ms ease-out 0ms;
  transition: -webkit-transform 320ms ease-out 0ms;
  transition: transform 320ms ease-out 0ms;
  transition: transform 320ms ease-out 0ms, -webkit-transform 320ms ease-out 0ms;
}