/* левый контейнер */
.posts-list {
   margin-bottom: 30px;/*отступ от нижнего края элемента*/
   width: 64%;/*ширина блока*/
   float: left;/*элемент выравнивается по левой стороне*/
}
/* блок для статьи */
.post {
   margin-bottom: 35px;/*отступ от нижнего края элемента*/
}
.post-content p {
   line-height: 1.5;/*межстрочный интервал текста*/
   padding-bottom: 1em;/*значение поля от нижнего края содержимого элемента*/
}
.post-image {
   margin-bottom: 30px;/*отступ от нижнего края элемента*/
   box-shadow: 3px 3px 0 0 #c0c0c0;/* цвет тени картинки поста */
}
.category {
   margin-bottom: 15px;/*отступ от нижнего края элемента*/
}
.category a {
   color: #d3d3d3; /*цвет текста категорий в поле анонса под картинкой #d3d3d3 - бороды абдель-керима*/
   text-transform: uppercase;/*все символы текста становятся прописными (верхний регистр)*/
}
.post-title {
   margin-bottom: 12px;/*отступ от нижнего края элемента*/
   font-size: 26px;/* размер шрифта элемента */
}
/* блок с кнопкой "продолжить чтение" и кнопками социальных сетей */
.post-footer {
   border-top: 1.5px solid #2f4f4f;/* цвет и размер верхней полосы разделителей блока "продолжить чтение" */
   border-bottom: 1.5px solid #2f4f4f;/* цвет и размер нижней полосы разделителей блока "продолжить чтение" */
   position: relative;/*положение элемента устанавливается относительно его исходного места*/
   margin-top: 10px;/*отступ блока от текста-контента*/
}
.more-link {
   position: relative;/*положение элемента устанавливается относительно его исходного места*/
   display: inline-block;/*элемент обтекает другими  элементами страницы*/
   font-size: 10px;/* размер шрифта элемента */
   text-transform: uppercase;/*все символы текста становятся прописными (верхний регистр)*/
   color: white;/*цвет шрифта надписи "Продолжить чтение" white; белый*/
   line-height: 34px;/*межстрочный интервал между линиями блока "продолжить чтение" */
   padding: 0 20px;/* значение полей вокруг содержимого*/
   background: #2f4f4f;/* цвет фона блока "продолжить чтение" */
   letter-spacing: 0.1em;
   white-space: nowrap;
}
.more-link:after {
   content: '';
   display: block;/*элемент показывается как блочный*/
   position: absolute;/*указывает, что элемент абсолютно позиционирован*/
   width: 0;/*ширина блока*/
   height: 0;/*высота блочного элемента*/
   top: 0;/*расстояние от верхнего края родительского элемента*/
   right: 0;/*расстояние от правого края родительского элемента*/
   border: solid transparent;/*бордюр жирный прозрачный*/
   border-width: 17px 25px;/*высота и длина  треугольника блока "продолжить чтение" */
   border-left-color: #2f4f4f;/* цвет фона треугольника блока "продолжить чтение" */
   transform: translateX(100%);/*сдвиг элемента по горизонтали влево на указанное значение*/
}
.post-social {
   position: absolute;/*указывает, что элемент абсолютно позиционирован*/
   left: auto;/*расстояние от левого края родительского элемента расчитывается браузером*/
   top: 50%;/*расстояние от верхнего края родительского элемента*/
   right: 0;/*расстояние от правого края родительского элемента*/
   text-align: right;/*горизонтальное выравнивание текста в пределах элемента*/
   transform: translateY(-50%);/*сдвиг элемента по горизонтали вправо на указанное значение*/
   padding: 0;/* значение полей вокруг содержимого*/
   font-size: 12px;/* размер шрифта элемента */
}
.post-social a {
   display: inline-block;/*элемент обтекает другими  элементами страницы*/
   margin-left: 8px;/*отступ от левого края элемента*/
   color: #2f4f4f;/* цвет фона иконок соц сетей в блока "продолжить чтение" */
   width: 25px;/*ширина блока*/
   height: 25px;/*высота блочного элемента*/
   line-height: 23px;/*межстрочный интервал*/
   text-align: center;/*горизонтальное выравнивание текста в пределах элемента*/
   border-radius: 50%;/*радиус скругления уголков рамки*/
   border: 1px solid; /*размер бордюра 1px жирный*/
}