body {
  padding: 0;
  font-family: "Arial", sans-serif;  /* вид шрифта */
  font-size: 14px;  /* размер шрифта */
  line-height: 18px;  /* межстрочный интервал */
  color: #000000; /* цвет текста */
  background: #ffffff url("original.png") no-repeat 50% 0; /* цвет фона; путь фоновому изображению; изображение не повторяется; горизонтальное смещение (отступ слева на 50% ширины); вертикальное смещение */
  background-size: 80%;  /* размер фонового изображения в процентах от ширины или высоты элемента, которое заполняется фоном */
}

.container {
  width: 480px; /* ширина элемента */
  margin: 0 auto; /* внешние отспуты: верхний-нижний, левый-правый (при таких значениях элемент центрируется по горизонтали)*/
  padding: 0 50px 0; /* внутренние отступы: верхний, левый-правый, нижний */
  border-left: 2px solid #666666; /* левая граница: толщина, тип, цвет*/
  border-right: 2px solid #666666; /* правая граница: толщина, тип, цвет*/
  background-color: rgba(255, 255, 255, 0.6) /* цвет фона в формате RGB, четвертый параметр - прозрачность */
}

.header img {
  display: block; /* превращаем элемент в блочный */
  margin: 0 auto; /* внешние отспуты: верхний-нижний, левый-правый (при таких значениях элемент центрируется по горизонтали)*/
  width: 100%; /* ширина. 100% ширины родительского элемента*/
}

h1 {
  width: 260px; /* ширина 260px */
  font-family: "Georgia", serif; /* вид шрифта "Georgia", serif */
  font-size: 36px; /* размер шрифта 36px */
  line-height: 36px; /* межстрочный интервал 36px */
}

h2 {
  border-bottom: 1px solid #cccccc; /* нижняя граница: толщина, тип, цвет 1px solid #cccccc */
  padding-bottom: 12px; /* нижний внутренний отступ 12px */
}

.header {
  margin-bottom: 30px; /* нижний внешний отступ 30px */
}

.skills-item {
  margin-bottom: 15px; /* нижний внешний отступ 15px */
  padding-left: 20px ; /* левый внутренний отступ 20px */
  border-left: 10px solid #c4c4c4; /* левая граница: толщина, тип, цвет 10px solid #c4c4c4 */
  color: #999999; /* цвет текста #999999 */
}

.standart {
  border-color: #ffc5b3; /* цвет границы #ffc5b3 */
  color: #666666; /* цвет текста #666666 */
}

.vip {
  border-color: #ff5a26; /* цвет границы #ff5a26*/
  color: #000000; /* цвет текста #000000 */
}

.info {
  margin-bottom: 30px; /* внешний нижний отпступ 30px */
}

.info p {
  display: inline-block; /* делает наши параграфы блочно-строчными элементами: ширина зависит от содержания (а не на всю страницу, как ранее), отменяет перенос строки inline-block */
  vertical-align: top; /* выравниваем по вертикали, прижимая к верхней границе top */
  width: 30%;/* ширина 30%; */
  margin: 0 5px; /* внешние отступы: сверху-снизу слева-справа 0 5px */
  background-repeat: no-repeat; /* фон не повторяется no-repeat */
  background-position: center top; /* горизонтальное и вертикальное выравнивание фона: центр, верх center top */
  text-align: center; /* выравнивание текста по центру center */
}

.info-power {
  padding-top: 60px; /* верхний внутренний отступ 60px */
  background-image: url("yoda.png"); /* путь к фоновому изображению url("yoda.png") */
  background-size: 50%; /* размер фона 50% */
}

.info-lazy {
  padding-top: 60px; /* верхний внутренний отступ 60px */
  background-image: url("dart.png"); /* путь к фоновому изображению url("dart.png") */
  background-size: 40%; /* размер фона 40% */
}

.info-fan {
  padding-top: 60px; /* верхний внутренний отступ 60px */
  background-image: url("droid.png"); /* путь к фоновому изображению url("droid.png") */
  background-size: 40%; /* размер фона 40% */
}

.skills-list {
  padding: 0; /* внутренние отступы  0 */
  list-style: none; /* убираем маркеры (круги перед каждым пунктом) у списка none */
}


.footer {
  display: flex; /* делаем footer флекс-контейнером (не учили) flex */
  justify-content: space-between; /* выравниваем параграфы по горизонтали space-between */
  color: #999999; /* цвет текста #999999 */
}