@charset "utf-8";
/* CSS Document */

*{
  margin: 0;
  padding: 0;
}


@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 100;
  src: local('El Messiri'), local('El Messiri'), url(<link href="https://fonts.googleapis.com/css?family=El+Messiri:400,500,600,700|Share+Tech+Mono&amp;subset=arabic,cyrillic" rel="stylesheet.woff") format('woff');
}


body{
  background-color: #222222;
}

#container{
  width:500px;
  margin:00px 0px 0px 0px;
  
}


/*neeeeoooon*/
x{
  text-align:left;
  font-size:2.0em;
  font-weight: 100;
  letter-spacing: 1px;
  margin:3px; 
}

a{
  text-decoration:none; 
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
  margin:20px 0px 20px 0px;
}


x:nth-child(1) a{
  color:#C0FF1F;
  font-family:El Messiri;
  font-size:1.1em;
}
x:nth-child(1) a:hover{
  -webkit-animation: neon4 1.5s ease-in-out infinite alternate;
  -moz-animation: neon4 1.5s ease-in-out infinite alternate;
  animation: neon4 1.5s ease-in-out infinite alternate;
}



x a:hover{
color:#fff;  
	
}



/*glow for webkit*/

@-webkit-keyframes neon1 {
  from {
    text-shadow: 0 0 10px #fff,
               0 0 20px  #fff,
               0 0 30px  #fff,
               0 0 40px  #B6FF00,
               0 0 70px  #B6FF00,
               0 0 80px  #B6FF00,
               0 0 100px #B6FF00,
               0 0 150px #B6FF00;
  }
  to {
    text-shadow: 0 0 5px #fff,
               0 0 10px #fff,
               0 0 15px #fff,
               0 0 20px #B6FF00,
               0 0 35px #B6FF00,
               0 0 40px #B6FF00,
               0 0 50px #B6FF00,
               0 0 75px #B6FF00;
  }
}


/*glow for mozilla*/


@-moz-keyframes neon1 {
  from {
    text-shadow: 0 0 10px #fff,
               0 0 20px  #fff,
               0 0 30px  #fff,
               0 0 40px  #B6FF00,
               0 0 70px  #B6FF00,
               0 0 80px  #B6FF00,
               0 0 100px #B6FF00,
               0 0 150px #B6FF00;
  }
  to {
    text-shadow: 0 0 5px #fff,
               0 0 10px #fff,
               0 0 15px #fff,
               0 0 20px #B6FF00,
               0 0 35px #B6FF00,
               0 0 40px #B6FF00,
               0 0 50px #B6FF00,
               0 0 75px #B6FF00;
  }
}



/*glow*/


@keyframes neon4 {
  from {
    text-shadow: 0 0 10px #fff,
               0 0 20px  #fff,
               0 0 30px  #fff,
               0 0 40px  #B6FF00,
               0 0 70px  #B6FF00,
               0 0 80px  #B6FF00,
               0 0 100px #B6FF00,
               0 0 150px #B6FF00;
  }
  to {
    text-shadow: 0 0 5px #fff,
               0 0 10px #fff,
               0 0 15px #fff,
               0 0 20px #B6FF00,
               0 0 35px #B6FF00,
               0 0 40px #B6FF00,
               0 0 50px #B6FF00,
               0 0 75px #B6FF00;
  }
}




/*REEEEEEEEEEESPONSIVE*/
@media (max-width: 650px) {
  
  #container{
    width: 100%;
  }
  
  x{
    font-size:1.3em;
  }

}