add materials wide

src/files/css/main.css

@@ -10120,6 +10120,106 @@ img {
     font-size: 18px;
     color: #004d7b; }
 
+.trailernews {
+  display: -webkit-flex;
+  display: -ms-flex;
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 20px; }
+  @media screen and (max-width: 1220px) {
+    .trailernews {
+      width: 100%; } }
+  .trailernews__imgcase {
+    margin-right: 15px; }
+  .trailernews__imgc {
+    width: 110px;
+    max-width: 110px;
+    height: 72px;
+    max-height: 72px; }
+  .trailernews__imgcase:hover + .trailernews__textcase .trailernews__title {
+    color: #5597d1; }
+  .trailernews__textcase {
+    border-top: 1px solid #ececec;
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: column;
+    width: calc(100% - 110px - 15px);
+    justify-content: space-between; }
+  .trailernews__title {
+    font-family: "Cuprum", Impact, "Charcoal CY", sans-serif;
+    font-size: 17px;
+    display: block;
+    text-decoration: none;
+    color: #3b434d;
+    margin-top: 5px;
+    margin-bottom: 10px; }
+    .trailernews__title:hover {
+      color: #5597d1; }
+  .trailernews__details {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    font-size: 13px;
+    width: 100%;
+    justify-content: space-between;
+    height: 14px;
+    line-height: 14px; }
+  .trailernews__left {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    height: 14px;
+    line-height: 14px; }
+  .trailernews__date {
+    margin-right: 20px;
+    color: #929292; }
+  .trailernews__category {
+    color: #e65e26;
+    text-decoration: none;
+    margin-right: 20px;
+    height: 14px;
+    line-height: 14px;
+    background: url("../img/icon_category@2x.png") 0 -7px/30px 60px no-repeat;
+    padding-left: 23px; }
+    .trailernews__category:hover {
+      color: #eb914e;
+      background: url("../img/icon_category@2x.png") 0 -37px/30px 60px no-repeat; }
+  .trailernews__region {
+    color: #e65e26;
+    text-decoration: none;
+    margin-right: 20px;
+    background: url("../img/icon_regionmark.png") 0 0/10px 28px no-repeat;
+    padding-left: 15px;
+    height: 14px;
+    line-height: 14px;
+    position: relative;
+    z-index: 1; }
+    .trailernews__region:hover {
+      color: #eb914e;
+      background-position: 0 -14px; }
+  .trailernews__right {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    color: #929292;
+    height: 14px;
+    line-height: 14px; }
+  .trailernews__views {
+    margin-right: 20px;
+    background: url("../img/icon_views@2x.png") left center/auto 12px no-repeat;
+    padding-left: 23px;
+    height: 14px;
+    line-height: 14px; }
+  .trailernews__comments {
+    background: url("../img/icon_comments@2x.png") left center/auto 15px no-repeat;
+    padding-left: 18px;
+    height: 14px;
+    line-height: 14px; }
+
 @media (min-width: 992px) {
   .left-side {
     padding-right: 20px; }

src/files/scss/_materials-wide.scss

@@ -0,0 +1,122 @@
+.trailernews {
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    flex-direction: row;
+    margin-bottom: 20px;
+
+    @media screen and (max-width: 1220px) {
+        width: 100%;
+    }
+
+    &__imgcase {
+        margin-right: 15px;
+    }
+    &__imgc {
+        width: 110px;
+        max-width: 110px;
+        height: 72px;
+        max-height: 72px;
+    }
+
+    &__imgcase:hover + &__textcase &__title {
+        color: #5597d1;
+    }
+    &__textcase {
+        border-top: 1px solid #ececec;
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: column;
+        width: calc(100% - 110px - 15px);
+        justify-content: space-between;
+    }
+    &__title {
+        font-family: $fontcuprum;
+        font-size: 17px;
+        display: block;
+        text-decoration: none;
+        color: #3b434d;
+        margin-top: 5px;
+        margin-bottom: 10px;
+
+        &:hover {
+            color: #5597d1;
+        }
+    }
+    &__details {
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: row;
+        font-size: 13px;
+        width: 100%;
+        justify-content: space-between;
+        height: 14px;
+        line-height: 14px;
+    }
+    &__left {
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: row;
+        height: 14px;
+        line-height: 14px;
+    }
+    &__date {
+        margin-right: 20px;
+        color: #929292;
+    }
+    &__category {
+        color: #e65e26;
+        text-decoration: none;
+        margin-right: 20px;
+        height: 14px;
+        line-height: 14px;
+        background: url("../img/icon_category@2x.png") 0 -7px / 30px 60px no-repeat;
+        padding-left: 23px;
+
+        &:hover {
+            color: #eb914e;
+            background: url("../img/icon_category@2x.png") 0 -37px / 30px 60px no-repeat;
+        }
+    }
+    &__region {
+        color: #e65e26;
+        text-decoration: none;
+        margin-right: 20px;
+        background: url("../img/icon_regionmark.png") 0 0 / 10px 28px no-repeat;
+        padding-left: 15px;
+        height: 14px;
+        line-height: 14px;
+        position: relative;
+        z-index: 1;
+
+        &:hover {
+            color: #eb914e;
+            background-position: 0 -14px;
+        }
+    }
+    &__right {
+        display: -webkit-flex;
+        display: -ms-flex;
+        display: flex;
+        flex-direction: row;
+        color: #929292;
+        height: 14px;
+        line-height: 14px;
+    }
+    &__views {
+        margin-right: 20px;
+        background: url("../img/icon_views@2x.png") left center / auto 12px no-repeat;
+        padding-left: 23px;
+        height: 14px;
+        line-height: 14px;
+    }
+    &__comments {
+        background: url("../img/icon_comments@2x.png") left center / auto 15px no-repeat;
+        padding-left: 18px;
+        height: 14px;
+        line-height: 14px;
+    }
+}

src/files/scss/main.scss

@@ -31,6 +31,7 @@ p {
 @import "blind";
 @import "flat-links";
 @import "person-page";
+@import "materials-wide";
 
 @import "media-overrides";