<!-- THIS GOES TO CSS --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><style><!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] -->/* Class .horizontal-blog is before all selectors to get this view only in this row */<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* main dimensions */ <!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post {<!-- [et_pb_line_break_holder] --> display:-webkit-box;<!-- [et_pb_line_break_holder] --> display:-ms-flexbox;<!-- [et_pb_line_break_holder] --> display:flex;<!-- [et_pb_line_break_holder] --> -webkit-box-orient: vertical;<!-- [et_pb_line_break_holder] --> -webkit-box-direction: normal;<!-- [et_pb_line_break_holder] --> -ms-flex-direction: column;<!-- [et_pb_line_break_holder] --> flex-direction: column;<!-- [et_pb_line_break_holder] --> -ms-flex-pack:distribute;<!-- [et_pb_line_break_holder] --> justify-content:space-around;<!-- [et_pb_line_break_holder] --> height:550px;<!-- [et_pb_line_break_holder] --> width:100%;<!-- [et_pb_line_break_holder] --> overflow:hidden;<!-- [et_pb_line_break_holder] --> margin:0;<!-- [et_pb_line_break_holder] --> padding:0;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post > a {<!-- [et_pb_line_break_holder] --> width:100%;<!-- [et_pb_line_break_holder] --> min-height:550px;<!-- [et_pb_line_break_holder] --> position:absolute;<!-- [et_pb_line_break_holder] --> margin-bottom:0;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* order */ <!-- [et_pb_line_break_holder] --> /* category first*/ <!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post .post-meta {<!-- [et_pb_line_break_holder] --> -webkit-box-ordinal-group:0;<!-- [et_pb_line_break_holder] --> -ms-flex-order:-1;<!-- [et_pb_line_break_holder] --> order:-1;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --> /* divider after category */<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post .post-meta:after {<!-- [et_pb_line_break_holder] --> content: '';<!-- [et_pb_line_break_holder] --> display: block;<!-- [et_pb_line_break_holder] --> margin: 0 auto;<!-- [et_pb_line_break_holder] --> padding-top: 30px;<!-- [et_pb_line_break_holder] --> height:2px;<!-- [et_pb_line_break_holder] --> width: 130px;<!-- [et_pb_line_break_holder] --> border-bottom: 5px solid #ff0000;<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> -webkit-transition: width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> -webkit-transition: -webkit-width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: -webkit-width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: width .2s ease-in-out, -webkit-width .2s ease-in-out;<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* -webkit-transition: transform .2s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: transform .2s ease-in-out;<!-- [et_pb_line_break_holder] --> -webkit-transition: -webkit-transform .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: -webkit-transform .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: transform .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out; */<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* background image*/<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post > a img {<!-- [et_pb_line_break_holder] --> position:absolute;<!-- [et_pb_line_break_holder] --> left:0;<!-- [et_pb_line_break_holder] --> top:-200px;<!-- [et_pb_line_break_holder] -->max-width:100%!important;<!-- [et_pb_line_break_holder] --> width:100%;<!-- [et_pb_line_break_holder] --> z-index:-1;<!-- [et_pb_line_break_holder] --> -webkit-transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --> /*gradient on bottom of post - visible on hover*/ <!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post > a:before {<!-- [et_pb_line_break_holder] --> content:'';<!-- [et_pb_line_break_holder] --> height:30%;<!-- [et_pb_line_break_holder] --> bottom: 0;<!-- [et_pb_line_break_holder] --> left:0;<!-- [et_pb_line_break_holder] --> width:100%;<!-- [et_pb_line_break_holder] --> position:absolute;<!-- [et_pb_line_break_holder] --> opacity:0;<!-- [et_pb_line_break_holder] --> background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0, .1)));<!-- [et_pb_line_break_holder] --> background: -webkit-linear-gradient(transparent, rgba(0,0,0, .3));<!-- [et_pb_line_break_holder] --> background: -o-linear-gradient(transparent, rgba(0,0,0, .3));<!-- [et_pb_line_break_holder] --> background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0, .3)));<!-- [et_pb_line_break_holder] --> background: linear-gradient(transparent, rgba(0,0,0, .3));<!-- [et_pb_line_break_holder] --> -webkit-transition: opacity .2s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: opacity .2s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: opacity .2s ease-in-out;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* setting width of title and content*/<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post .entry-title,<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post .post-content {<!-- [et_pb_line_break_holder] --> max-width:810px!important;<!-- [et_pb_line_break_holder] --> width:75%;<!-- [et_pb_line_break_holder] --> display:inline-block;<!-- [et_pb_line_break_holder] -->margin: 0 auto;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* to remove some margin below article */<!-- [et_pb_line_break_holder] --> .horizontal-blog .clearfix:after {<!-- [et_pb_line_break_holder] --> position:absolute;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* height of bottom blog part - excerpt and button */ <!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post .post-content {<!-- [et_pb_line_break_holder] --> height:180px;<!-- [et_pb_line_break_holder] -->} <!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* BUTTON */<!-- [et_pb_line_break_holder] --> .horizontal-blog .more-link {<!-- [et_pb_line_break_holder] --> display:inline-block;<!-- [et_pb_line_break_holder] --> max-width: 180px;<!-- [et_pb_line_break_holder] --> margin: 0 auto;<!-- [et_pb_line_break_holder] --> position:relative;<!-- [et_pb_line_break_holder] --> top:30px;<!-- [et_pb_line_break_holder] --> border: 2px solid #fff;<!-- [et_pb_line_break_holder] --> padding: .5em 1em;<!-- [et_pb_line_break_holder] --> border-radius: 40px;<!-- [et_pb_line_break_holder] --> -webkit-transition: all .1s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: all .1s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: all .1s ease-in-out;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* button arrow insivible in normal state*/<!-- [et_pb_line_break_holder] --> .horizontal-blog .more-link:after {<!-- [et_pb_line_break_holder] --> text-shadow: 0 0;<!-- [et_pb_line_break_holder] --> top:4px;<!-- [et_pb_line_break_holder] --> content: "\35";<!-- [et_pb_line_break_holder] --> font-family: ETmodules!important;<!-- [et_pb_line_break_holder] --> font-weight: 400;<!-- [et_pb_line_break_holder] --> font-style: normal;<!-- [et_pb_line_break_holder] --> font-variant: normal;<!-- [et_pb_line_break_holder] --> line-height: 1;<!-- [et_pb_line_break_holder] --> text-transform: none;<!-- [et_pb_line_break_holder] --> speak: none;<!-- [et_pb_line_break_holder] --> position: absolute;<!-- [et_pb_line_break_holder] --> margin-left: -.5em;<!-- [et_pb_line_break_holder] --> opacity: 0;<!-- [et_pb_line_break_holder] --> font-size: 32px;<!-- [et_pb_line_break_holder] --> -webkit-transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> -o-transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> transition: all .3s ease-in-out;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* HOVER STATES */<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* growing background image */<!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post:hover > a img {<!-- [et_pb_line_break_holder] --> -webkit-transform: scale(1.025);<!-- [et_pb_line_break_holder] --> -ms-transform: scale(1.025);<!-- [et_pb_line_break_holder] --> transform: scale(1.025);<!-- [et_pb_line_break_holder] --> -webkit-transform-origin: bottom 50%;<!-- [et_pb_line_break_holder] --> -ms-transform-origin: bottom 50%;<!-- [et_pb_line_break_holder] --> transform-origin: bottom 50%;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* gradient on post */<!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post:hover a:before {<!-- [et_pb_line_break_holder] --> opacity:1;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* divider length */<!-- [et_pb_line_break_holder] -->.horizontal-blog .et_pb_post:hover .post-meta:after { <!-- [et_pb_line_break_holder] --> width: 180px;<!-- [et_pb_line_break_holder] -->/* -webkit-transform: scale(1.25, 1);<!-- [et_pb_line_break_holder] --> -ms-transform: scale(1.25, 1);<!-- [et_pb_line_break_holder] --> transform: scale(1.25, 1);*/<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* button letters to left, change background and setting width */<!-- [et_pb_line_break_holder] --> .horizontal-blog .more-link:hover {<!-- [et_pb_line_break_holder] --> background: rgba(255, 255, 255, .3);<!-- [et_pb_line_break_holder] --> padding: .5em 2em .5em .7em;<!-- [et_pb_line_break_holder] --> border: 2px solid transparent;<!-- [et_pb_line_break_holder] --> max-width: 180px;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* button arrow on hover */<!-- [et_pb_line_break_holder] --> .horizontal-blog .more-link:hover:after {<!-- [et_pb_line_break_holder] --> margin-left: 0;<!-- [et_pb_line_break_holder] --> opacity: 1;<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --> @media all and (max-width: 1100px) {<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --> /*setting image on tablets and mobile to be centered and full height with proportially left/right margin */<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post > a img {<!-- [et_pb_line_break_holder] --> max-width: unset!important;<!-- [et_pb_line_break_holder] --> width: -webkit-max-content;<!-- [et_pb_line_break_holder] --> width: -moz-max-content;<!-- [et_pb_line_break_holder] --> width: max-content;<!-- [et_pb_line_break_holder] --> height:100%;<!-- [et_pb_line_break_holder] --> left: 50%;<!-- [et_pb_line_break_holder] --> top: 50%;<!-- [et_pb_line_break_holder] -->-webkit-transform: translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> -ms-transform: translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> transform: translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /*image scaling and make horizontal center*/<!-- [et_pb_line_break_holder] --> .horizontal-blog .et_pb_post:hover > a img {<!-- [et_pb_line_break_holder] --> -webkit-transform: scale(1.025) translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> -ms-transform: scale(1.025) translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> transform: scale(1.025) translate(-50%, -50%);<!-- [et_pb_line_break_holder] --> }<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --> /* TO HIDE SOME CATEGORY*/<!-- [et_pb_line_break_holder] --> /* instead of "demos/" could be different one like "featured/"<!-- [et_pb_line_break_holder] --> which one you want to hide */ <!-- [et_pb_line_break_holder] --> .horizontal-blog .post-meta a[href*="demos/"] {<!-- [et_pb_line_break_holder] --> display: none;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --> <!-- [et_pb_line_break_holder] --></style><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- THIS GOES TO JAVASCRIPT CODE --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><script><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->// remove comma in post-meta class - dividing categories <!-- [et_pb_line_break_holder] --> jQuery(function($){<!-- [et_pb_line_break_holder] --> $(".horizontal-blog .post-meta").each(function(){<!-- [et_pb_line_break_holder] --> $(this).html($(this).html().replace(/,/g , ''));<!-- [et_pb_line_break_holder] --> });<!-- [et_pb_line_break_holder] --> })<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --></script><!-- [et_pb_line_break_holder] -->