.homepage-news { float: left; width: 75%; } .homepage-news:before, .homepage-news:after { content: " "; display: table; } .homepage-news:after { clear: both; } @media (max-width: 767px) { .homepage-news { float: none; width: auto; } } @media print { .homepage-news { height: auto !important; } } .homepage-news .content { float: left; width: 33.3333%; height: 100%; background: url(/_Layers/GCSAA/WebsiteTemplates/2016/App_Themes/default/images/homepage-news.jpg) center center no-repeat; background-size: cover; color: #fff; } @media (max-width: 767px) { .homepage-news .content { display: none; } } .homepage-news .content header { font-family: "Roboto Condensed", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; font-weight: 700; text-transform: uppercase; background: rgba(255, 255, 255, 0.15); color: #fff; padding: 10px 20px; } .homepage-news .content ul { margin: 0; padding: 10px 10px 20px 10px; list-style-type: none; } .homepage-news .content ul li { margin: 18px 0 0 0; line-height: 1.2em; text-transform: uppercase; } .homepage-news .content ul li:first-child { margin: 0; } .homepage-news .content ul li a { color: #ccc; } .homepage-news .content ul li a strong { color: #fff; display: block; font-size: 16px; text-transform: none; font-weight: 400; } .homepage-news .content ul li a:hover strong { text-decoration: underline; } .homepage-news .content footer { padding: 0 10px 10px 10px; } .homepage-news .content footer a { color: #fff; text-decoration: underline; } .homepage-news .content footer a:after { content: "\f054"; font-family: "FontAwesome"; position: absolute; margin: 3px 0 0 3px; font-size: 10px; } .homepage-news .image { float: left; width: 66.6667%; height: 100%; } @media (max-width: 767px) { .homepage-news .image { float: none; width: auto; height: auto; margin: 0 -10px; } } .homepage-news .image div { height: 100%; } .homepage-news .image a { display: block; width: 100%; height: 100%; } .homepage-news .image a img { display: block; width: 100%; height: 100%; }