Untitled


<html><head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, width=device-width">
    <link rel="stylesheet" href="assets/css/bitrune.css">
    <link rel="stylesheet" href="assets/css/slick.css">
    <link rel="stylesheet" href="assets/css/slick-theme.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicon-32x32.png">
    <title>BitRune - Under construction</title>
</head>
<style>
body, html {
  width: 100%;
  height: 100%;
  padding: 0px;
  margin: 0px;
}
slider {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(http://bitrune.net/assets/img/background.jpg);
    -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  overflow: hidden;
  position: absolute;
}
slider > * {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  left: 100%;
  background-color: #1f1f1f;
  -webkit-animation: slide 12s infinite;
  -moz-animation: slide 12s infinite;
  -o-animation: slide 12s infinite;
  animation: slide 12s infinite;
  overflow: hidden;
}
slide:nth-child(1) {
  left: 0%;
  -webkit-animation-delay: -1s;
  -moz-animation-delay: -1s;
  -o-animation-delay: -1s;
  animation-delay: -1s;
   background-image: url(http://bitrune.net/assets/img/background.jpg);
  background-size: cover;
  background-position: bottom;
}
slide:nth-child(2) {
  -webkit-animation-delay: 2s;
  -moz-animation-delay: 2s;
  -o-animation-delay: 2s;
  animation-delay: 2s;
  background-image: url(http://bitrune.net/assets/img/background.jpg);
  background-size: cover;
  background-position: bottom;
}
slide:nth-child(3) {
  -webkit-animation-delay: 5s;
  -moz-animation-delay: 5s;
  -o-animation-delay: 5s;
  animation-delay: 5s;
    background-image: url(http://bitrune.net/assets/img/background.jpg);
  background-size: cover;
  background-position: bottom;
}
slide p {
  font-family: 'Sue Ellen Francisco', cursive;
  font-size: 10vh;
  text-align: center;
  display: inline-block;
  width: 100%;
  margin-top: 30vh;
 color: white;
 text-shadow: 0px 0px 500px black;
}
@-webkit-keyframes slide {
  0% {left: 100%; width: 100%}
  5% {left: 0%;} /* IN */
  25% {left: 0%;} /*SHOW*/
  30% {left: -100%; width: 100%;} /*OUT*/
  30.00001% {left: -100%; width: 0%}
  100% {left: 100%;width: 0%;} /*SLEEP*/
}

@-moz-keyframes slide {
  0% {left: 100%; width: 100%}
  5% {left: 0%;} /* IN */
  25% {left: 0%;} /*SHOW*/
  30% {left: -100%; width: 100%;} /*OUT*/
  30.00001% {left: -100%; width: 0%}
  100% {left: 100%;width: 0%;} /*SLEEP*/
}

@-o-keyframes slide {
  0% {left: 100%; width: 100%}
  5% {left: 0%;} /* IN */
  25% {left: 0%;} /*SHOW*/
  30% {left: -100%; width: 100%;} /*OUT*/
  30.00001% {left: -100%; width: 0%}
  100% {left: 100%;width: 0%;} /*SLEEP*/
}
</style>
<body>
    <nav>
	<div class="navbar">
	<h1>BitRune</h1>

        <ul>
            <li><a href="#">Forum</a></li>
            <li><a href="#">Vote</a></li>
            <li><a href="#">Hiscores</a></li>
            <li><a href="#">Store</a></li>
        </ul>

	<ul class="navbar_user">
	    <li><a href="#" style="color:#cc9900">Log in</a> or <a href="#" style="color:#cc9900">sign up</a></li>
	</ul>
    </nav>
	<slider>
    <slide><p>Hello</p></slide>
    <slide><p>I am</p></slide>
    <slide><p>Jayzl</p></slide>
	</slider>
    <script type="text/javascript" src="assets/js/jquery.min.js"></script>
    <script type="text/javascript" src="assets/js/slick.js"></script>
    <script type="text/javascript" src="assets/js/carousel.js"></script>
</body>
</html>