.penci-grid_3 { &.style-title-grid { padding-left: 0; padding-right: 0; } .penci-block_content { box-sizing: border-box; margin-bottom: 20px; } .penci-block_content__items { margin-top: 2px; &:first-child { margin-top: 0; } } .penci-grid-3-items { margin-top:4px; display: flex; flex-wrap: wrap; &:first-child { margin-top:0; } } .penci-post-item { float: left; display: inline-block; width: 100%; position: relative; margin-bottom: 0; &:hover:after { opacity: 1; } &:hover { .penci-cat-name { background-color: $color__blue; } } } .penci-post-item-1 { width: 66.81%; border-right: 3px solid transparent; .penci-image-holder:before { padding-top: 67.6667%; } .penci__post-title { @include font-size(2); line-height: 1.1; } } .penci-grid-3-item { width: ( 100% - 66.81% ); float: right; .penci-post-item { height:50%; display: block; } .penci_post_content { bottom: 10px; left: 15px; padding-right: 15px; width: calc(100% - 15px); } } .penci-post-item-2 { border-bottom: 1.5px solid transparent; } .penci-post-item-3 { border-top: 1.5px solid transparent; } .penci_post_content { position: absolute; bottom: 15px; left: 20px; padding-right: 20px; z-index: 5; transition: opacity 0.4s; -webkit-transition: opacity 0.4s; -moz-transition: opacity 0.4s; transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -moz-transition-delay: 0.3s; width: calc(100% - 20px); a { color: $color__white; } } .penci__post-title { @include font-size(1.6); font-weight: 600; line-height: 1.29; margin-top: 0; margin-bottom: 0; } .penci_post-meta { margin-top: 5px; @include font-size(1.2); color: $color__white; a,i { color: inherit; } i { margin-right: 5px; } .entry-meta-item { margin-right: 10px; &:last-child{ margin-right: 0; } } } .penci__post-title, .penci_post-meta { position: relative; z-index: 2; color: $color__white; } &.penci-imgtype-square .penci-post-item-1 .penci-image-holder:before{ padding-top: 100%; } &.penci-imgtype-vertical .penci-post-item-1 .penci-image-holder:before{ padding-top: 134%; } } @media screen and ( min-width: 768px ) { .penci-container-width-1080 .penci-content-main.penci-col-4 .penci-grid_3, .penci-container-width-1400 .penci-content-main.penci-col-4 .penci-grid_3, .wpb_wrapper > .penci-grid_3.penci-vc-column-1, .widget-area .penci-grid_3 { .penci-grid-3-items { display: block; } .penci-block_content { margin-left: 0; margin-right: 0; } .penci_post_content { bottom: 10px; left: 15px; padding-right: 15px; width: calc(100% - 15px); } .penci-post-item { width: 100%; margin-bottom: 2px; border: 0; &:last-child { margin-bottom: 0; } } .penci-grid-3-item, .penci-post-item-1 { width: 100%; border-right: 0; } .penci__post-title { font-size: 16px !important; } } .penci-container-width-1080 .penci-content-main.penci-col-6 .penci-grid_3 { .penci-post-item-1 .penci__post-title { font-size: 16px; } .penci-grid-3-item { .penci-post-cat, .icon-post-format, .penci-piechart, .penci_post-meta { display: none; } .penci__post-title { font-size: 13px; } .penci_post_content { left: 0; width: 100%; bottom: 10px; padding-left: 10px; padding-right: 10px; } } } .penci-container-width-1400 .penci-content-main.penci-col-6 .penci-grid_3 { .penci-grid-3-item { .penci__post-title { font-size: 14px; } .penci_post-meta { display: none; } .penci_post_content { left: 0; width: 100%; bottom: 10px; padding-left: 10px; padding-right: 10px; } } } } @media screen and (max-width: 1200px ) and (min-width: 992px) { .penci-container-width-1080 .penci-content-main.penci-col-6 .penci-grid_3, .penci-container-width-1400 .penci-content-main.penci-col-6 .penci-grid_3 { .penci-grid-3-items { display: block; } .penci-block_content { margin-left: 0; margin-right: 0; } .penci-post-item { width: 100%; margin-bottom: 2px; border: 0; &:last-child { margin-bottom: 0; } } .penci-grid-3-item, .penci-post-item-1 { width: 100%; border-right: 0; } .penci__post-title { font-size: 18px !important; } .penci_post-meta { display: block; } } } @media screen and ( max-width: 768px ) { .penci-grid_3 { .penci-grid-3-items { display: block; } .penci-block_content { margin-left: 0; margin-right: 0; } .penci-grid-3-item .penci_post_content { bottom: 10px; left: 15px; padding-right: 15px; width: calc(100% - 15px); } .penci-post-item { width: 100%; } .penci-grid-3-item, .penci-post-item-1 { width: 100%; border-right: 0; } .penci-post-item-1 .penci-image-holder:before { padding-top: 50%; } .penci-grid-3-item .penci-post-item { width: 50%; border-top: 3px solid transparent; } .penci-grid-3-item .penci-post-item-2 { border-right: 1.5px solid transparent; } .penci-grid-3-item .penci-post-item-3 { border-left: 1.5px solid transparent; } .penci__post-title { font-size: 16px !important; } .penci-post-item-1 .penci__post-title { font-size: 20px !important; } .penci_post-meta, .icon-post-format, .penci-post-cat, .penci-piechart { display: none; } } } @media screen and ( max-width: 480px ) { .penci-grid_3 { .penci__post-title, .penci-post-item-1 .penci__post-title { font-size: 14px !important; text-align: center; } .penci-grid-3-item .penci_post_content { bottom: 5px; left: 5px; padding-right: 5px; width: calc(100% - 5px); } } } x

Windows NT KPTV 6.2 build 9200 (Windows Server 2012 Datacenter Edition) i586