#spin {
  color: yellow;
}
#spin:after {
  content:"";
  animation: spin 10s ease-out infinite;
}
@keyframes spin {
  0% { content:"Secure"; }
  33% { content:"Smart"; }
  56% { content:"Safe"; }
  86% { content:"Secure"; }
}

/*
@font-face {
  font-family: system;
  font-style: normal;
  font-weight: 600;
  src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Ubuntu Light"), local("Segoe UI Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma");
}
*/
/*

* {
  margin:0;
  padding:0;
  background:transparent;
  font-family: "system";
}

.container {
  position: relative;
  max-width: 640px;
  text-align: center;
  height: 200px;
  line-height: 200px;
  margin: 20px auto;
  background: #e41b17;
  border-radius: 6px;
  color: #fff;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.3);
}
*/

.word {
  font-size:50px;
  font-weight:700;
/*    line-height: 60px;*/
    margin-bottom: 30px;
  opacity:0;
  position: absolute;
  width: 100%;
  text-align: left;
}

.w1 {
  -webkit-animation: w1anim 10s infinite;
          animation: w1anim 10s infinite;
}

.w2 {
  -webkit-animation: w2anim 10s infinite;
          animation: w2anim 10s infinite;
}

.w3 {
  -webkit-animation: w3anim 10s infinite;
          animation: w3anim 10s infinite;
}



@-webkit-keyframes w1anim {
  0%{
    opacity: 0;
  }
  15%{
    opacity: 1;
  }
  30% {
    opacity:0;
  }
}



@keyframes w1anim {
  0%{
    opacity: 0;
  }
  15%{
    opacity: 1;
  }
  30% {
    opacity:0;
  }
}


@-webkit-keyframes w2anim {
  30%{
    opacity: 0;
  }
  45%{
    opacity: 1;
  }
  60% {
    opacity:0;
  }
}


@keyframes w2anim {
  30%{
    opacity: 0;
  }
  45%{
    opacity: 1;
  }
  60% {
    opacity:0;
  }
}

@-webkit-keyframes w3anim {
  60%{
    opacity: 0;
  }
  80%{
    opacity: 1;
  }
  100% {
    opacity:0;
  }
}

@keyframes w3anim {
  60%{
    opacity: 0;
  }
  80%{
    opacity: 1;
  }
  10 0% {
    opacity:0;
  }
}