WEB Размытый текст меню

by pharma_nsk

HTML

<body>
<nav>
  <ul>
  <li><a href="#">home</a></li>
  <li><a href="#">personal</a></li>
  <li><a href="#">contact</a></li>
  </ul>
</nav>
</body>

CSS

body {background-color: white;}
nav {background-image: url('https://img3.goodfon.ru/wallpaper/big/1/1a/priroda-noch-plyazh-luna-bereg.jpg'); background-repeat: no-repeat; height:400px; padding:30px 100px;}
ul {font-size:30px; list-style:none;  }
li a {text-shadow: 1px 1px 2px rgba(250,250,250,1); color:transparent; text-decoration:none; text-transform:uppercase;}
li a:hover {color:black; margin-left:5px; text-shadow:none;transition: 0.5s ease; }