9/18 100%

<!DOCTYPE html>
<html lang="ru">
  <head>
    <meta charset="utf-8">
    <title>Испытание: карточка курса</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
  <div class="card">
    <div class="title">Курс «Фоны»</div>
      <div class="description">Учимся использовать фоновые цвета и изображения, разбираемся с форматами, знакомимся с приёмами создания декоративных эффектов.
      </div>
        <div>
          <a class="social social-fb" href="https://www.facebook.com/htmlacademy"></a>
          <a class="social social-tw" href="https://twitter.com/htmlacademy_ru"></a>
          <a class="social social-g" href="https://google.com/htmlacademy_ru"></a>
        </div>
  </div>
  </body>
</html>
html,
body {
  margin: 0;
  padding: 0;
}

body {
  width: 280px;
  min-height: 280px;
  padding-top: 20px;
  padding-left: 20px;
  font-size: 14px;
  line-height: 1.2;
  font-family: "Arial", sans-serif;
  background-color: #ecf0f1;
}

.card {
  background-color: #1abc9c;
  color: white;
  padding: 20px;
  width: 200px;
}

.card .title {
  padding-bottom: 20px;
  font-size: 20px;
}

.description {
  text-align: left; 
  margin-bottom: 25px;
}

.social {
  display: inline-block;
  vertical-align: middle;
  background-color: #16a085;
  background-image: url("social-challenge.png");
  background-repeat: no-repeat;
  width: 30px;
  height: 30px;
  margin-right: 5px;
}

.social-fb {
  background-position: 0 0;  
}

.social-tw {
  background-position: -30px 0px;  
}

.social-g {
  background-position: -60px 0px;  
}


/*
Все размеры, отступы, координаты, размеры шрифтов (не заданные в body) кратны 5 или 10.
Адрес картинки-спрайта — social-challenge.png
*/

Почему текст в div обернут? Есть теги, которые лучше подходят для оформления текста.