Слайдер 2-ое испытание

Курсы
1

В задании написано что все должно быть кратно 5. Ну удается подогнать картинку, подскажите что не так.

html:

<!DOCTYPE html>
<html>
<head>
    <title>Испытание 2: слайдер</title>
    <meta charset="utf-8">
</head>
<body>
    <div class="wrapper">
        <h1>Долго, дорого,<br> скрупулезно</h1>
        <img src="/assets/ifmo/slide-bg.png">    
        <p>Математически выверенный дизайн для вашего сайта или мобильного приложения.</p>
        <input type="submit" value="Узнать больше">
        <div class="slider">
            <a href="#" class="active"></a>
            <a href="#" class=""></a>
            <a href="#" class=""></a>
        </div>                
    </div>
</body>

css:

html,body{
  margin:0;
  padding:0;
}
body{
  width:500px;
  height:300px;
  font-size:16px;
  font-family:"Tahoma", sans-serif;
  line-height:20px;
  color:black;
  background:#eeeeee;
}

.wrapper {
  margin: 0;
  padding: 20px;
  padding-top: 40px;
}

.wrapper h1 {
  margin: 0;
  font-size: 25px;
  line-height: 25px;

}

.wrapper p {
  width: 250px;
  margin-bottom:0;
}

.wrapper img {
  margin: 0;
  padding: 0;
  float: right;
  font-size: 0;
  margin-top: -8px;
}


.wrapper input[type="submit"] {
  width: 200px;
  border-radius: 5px;
  border: none;
  padding: 10px;
  text-transform: uppercase;
  background-color: #fb565a;
  color: #FFFFFF;
  font-size: 15px;
  line-height: 20px;
  margin-top: 25px;
}

.slider {
  margin-top: 25px;
  margin-left: 205px;
}

.slider a {
  margin-right: 5px;
  display: inline-block;
  border:5px solid #666666;
  border-radius:50%; 
  width:5px;
  height:5px; 
  background: #666666;
}

.slider .active {
  width:5px;
  height:5px; 
  background:#FFFFFF;
}