
body {
  background-color: black;
  -webkit-font-smoothing: antialiased;
  font-size: 17px;
  line-height: 22px;
  font-family: "Cutive Mono", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: rgb(230,230,230) !important;
  overflow-x: hidden;
}

ul {
  list-style: none;
}

ul.bullets {
  list-style: inside;
}

svg {
  height: 90px;
  float: left;
  margin-right: 15px;
  opacity: 0;
}

svg polygon, svg rect, svg path {
  fill: none;
  stroke: #fff;
  stroke-miterlimit: 10;
  stroke-width: 2px;
}

p {
  margin-bottom: 20px;
  letter-spacing: -1px;
}
nav {
border-top: 1px solid white;
    display: inline-block;
    font-size: .9em;
    border-bottom: 1px solid white;
}

nav a {
    color: white;
    transition: all .4s;
    display: inline-block;
    padding: 10px 3px;
}

nav a:hover{
  background-color: #fff;
  color: black; 
  text-decoration: none;
}
.done .ray {
  transition: fill 2s !important;
  fill: white;
}

.fullscreen, .fullscreen .container, .fullscreen .row {
  min-height: 100vh;
}

header {
  margin-bottom: 48px;
}
.loader-interpage {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
}

.glitch__img {
  position: absolute;
  top: calc(-1 * 5px);
  left: calc(-1 * 10px);
  width: calc(100% + 10px * 2);
  height: calc(100% + 5px * 2);
  background-color: transparent;
  background-size: cover;
  transform: translate3d(0,0,0);
  background-blend-mode: none;
}

.glitch__img:nth-child(n+2) {
  opacity: 0;
}

.loader-interpage.in  .glitch__img:nth-child(n+2) {
  animation-duration: 4s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.loader-interpage.in  .glitch__img:nth-child(2)  {
  background: url(../img/fondorayo1.svg) no-repeat center;
  background-color: transparent;
  background-blend-mode: none;
  animation-name: glitch-anim-1;
}

.loader-interpage.in  .glitch__img:nth-child(3)  {
  background: url(../img/fondorayo1.svg) no-repeat center;
  background-color: transparent;
  background-blend-mode: none;
  animation-name: glitch-anim-2;
}

.loader-interpage.in  .glitch__img:nth-child(4)  {
  background: url(../img/fondorayo1.svg) no-repeat center;
  animation-name: glitch-anim-3;
  background-color: transparent;
  background-size: 300%;
}

.loader-interpage.in  .glitch__img:nth-child(5)  {
  background: url(../img/fondorayo1.svg) no-repeat center;
  background-color: transparent;
  background-blend-mode: none;
  animation-name: glitch-anim-1;
  background-size: 150%;
  background-position: right bottom
}


.loader-interpage.in  .glitch__img:nth-child(6)  {
  background-color: white;
  animation: blink .3s linear;
}


@keyframes blink {
  0% {
    opacity: 0
  }
  10% {
    opacity: 1;
  }
  20% {
    opacity: 0;
  }

  80% {
    opacity: 0;
  }
  90%{
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
  
}



@keyframes glitch-anim-1 {
  0% { 
    opacity: 1;
    transform: translate3d(10px,0,0);
    -webkit-clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
  }
  2% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
    clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
  }
  4% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
    clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
    clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
  }
  8% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  10% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  12% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  14% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  16% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  18% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(10px,0,0);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0,0,0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}

@keyframes glitch-anim-2 {
  0% { 
    opacity: 1;
    transform: translate3d(calc(-1 * 10px),0,0);
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
  }
  3% {
    -webkit-clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
    clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
  }
  5% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
  }
  7% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  9% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
    clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
  }
  11% {
    -webkit-clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
    clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
  }
  13% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  15% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
    clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
  }
  17% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
    clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
  }
  19% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
    clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
  }
  20% {
    -webkit-clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
    clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(calc(-1 * 10px),0,0);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0,0,0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}

@keyframes glitch-anim-3 {
  0% { 
    opacity: 1;
    transform: translate3d(0, calc(-1 * 5px), 0) scale3d(-1,-1,1);
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
  }
  1.5% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
    clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
  }
  2% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
  }
  2.5% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  3% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
    clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
  }
  5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
    clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
  }
  5.5% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
    clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
  }
  7% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
    clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
  }
  8% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  9% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
    clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
  }
  10.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
  }
  11% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
    clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
  }
  13% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
    clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
  }
  14% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
    clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
  }
  14.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
  }
  15% {
    -webkit-clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
    clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
  }
  16% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  18% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
    clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
    clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(0, calc(-1 * 5px), 0) scale3d(-1,-1,1);
  }
  22%, 100% {
    opacity: 0;
    transform: translate3d(0,0,0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}

/* Flash */
@keyframes glitch-anim-flash {
  0%, 5% { 
    opacity: 0.2; 
    transform: translate3d(10px, 5px, 0);
  }
  5.5%, 100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
}


h1 {
  font-size: 50px;
  line-height: 54px;
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 200;
  letter-spacing: 1px;
}

h1 > .subt {
  font-size: 13px;
  line-height: 20px;
  display: block; 
  letter-spacing: 0px;
    font-weight: 300;

}

.glitch {
  position: relative;
  white-space: nowrap;
  color: #ffffff;
}

.glitch::before, .glitch::after {
  color: #ffffff;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-direction: alternate-reverse;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  clip: rect(0, 9999px, 0, 0);
  content: attr(data-text);
}

.glitch.on::before {
  left: 3.5px;
  text-shadow: 1.75px 0 #00ffea;
  animation: glitch-animation 2s infinite linear;
}

.glitch.on::after {
  left: 1.4px;
  text-shadow: -1.75px 0 #fe3a7f;
  animation: glitch-animation 1s infinite linear;
}

@keyframes glitch-animation {
  0% {
    clip: rect(24.5614035088px, 9999px, 34.3137254902px, 0);
  }
  5% {
    clip: rect(7.700770077px, 9999px, 42.9447852761px, 0);
  }
  10% {
    clip: rect(30.1724137931px, 9999px, 17.5px, 0);
  }
  15% {
    clip: rect(28.8065843621px, 9999px, 56px, 0);
  }
  20% {
    clip: rect(42.1686746988px, 9999px, 16.8269230769px, 0);
  }
  25% {
    clip: rect(23.8095238095px, 9999px, 38.4615384615px, 0);
  }
  30% {
    clip: rect(60.3448275862px, 9999px, 49.2957746479px, 0);
  }
  35% {
    clip: rect(14px, 9999px, 14px, 0);
  }
  40% {
    clip: rect(2.3333333333px, 9999px, 1.75px, 0);
  }
  45% {
    clip: rect(17.5px, 9999px, 46.357615894px, 0);
  }
  50% {
    clip: rect(40px, 9999px, 69.3069306931px, 0);
  }
  55% {
    clip: rect(3.5px, 9999px, 32.2580645161px, 0);
  }
  60% {
    clip: rect(62.5px, 9999px, 21.021021021px, 0);
  }
  65% {
    clip: rect(37.8378378378px, 9999px, 18.9189189189px, 0);
  }
  70% {
    clip: rect(50.7246376812px, 9999px, 70px, 0);
  }
  75% {
    clip: rect(7px, 9999px, 5.8333333333px, 0);
  }
  80% {
    clip: rect(12.6126126126px, 9999px, 56px, 0);
  }
  85% {
    clip: rect(35px, 9999px, 39.5480225989px, 0);
  }
  90% {
    clip: rect(30.1724137931px, 9999px, 34.3137254902px, 0);
  }
  95% {
    clip: rect(23.102310231px, 9999px, 14px, 0);
  }
  100% {
    clip: rect(7px, 9999px, 7px, 0);
  }
}





@media (max-width: 980px) {

  h1, .h1 {
    font-size: 30px;
    line-height: 34px;
  }

  h1 > .subt {
    font-size: 10px;
    line-height: 15px;
  }
}

#langc {
  margin-left: 8px;
  transform: translateY(-2px);
  width: 20px;
  display: inline-block;
  z-index: 999;
}

#langc img {
  width: 100%;
}

@media all and (max-width: 767px) {
  

.loader-interpage.in  .glitch__img:nth-child(3)  {
  background-size: 200%;
}

.loader-interpage.in  .glitch__img:nth-child(4)  {
  background-size: 500%;
}

.loader-interpage.in  .glitch__img:nth-child(5)  {
  background-size: 250%;
}



  .fullscreen {
    height: auto;
    padding: 80px 0;
  }

  .fullscreen .container {
    top: 0;
    transform: none;
    -webkit-transform: none;
  }

  .timer {
    text-align: center
  }

  .timer ul {
    transform: translateX(-30px);
  }

  .hr {
    right: calc(50% - 30px);
  }

  
  .timer .h44 {
    right: calc(50% - 30px);
  }

}
