<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
@keyframes slideInLeft {
0% {
transform: translateX(-100%);
}
100% {
transform: translateX(0);
}
}
header {
animation: 1s ease-out 0s 1 slideInLeft;
background: #666;
padding: 40px;
}
body {
margin: 0;
font-family: "Segoe UI", Arial, Helvetica, Sans Serif;
}
a {
text-decoration: none;
display: inline-block;
margin-right: 10px;
color: #fff;
}
</style>
</head>
<body>
<header>
<a href="#">Books</a>
<a href="#">Quizzes</a>
<a href="#">Snippets</a>
<a href="#">Tools</a>