.component.newslist .article-list.wall, .component.newslist-v2 .article-list.wall { display: flex; flex-direction: row; flex-wrap: wrap; display: grid; grid-gap: 25px; grid-auto-rows: 250px; grid-template-columns: 1fr; } .component.newslist .article-list.list article, .component.newslist-v2 .article-list.list article { height: 250px; } .component.newslist .article-list.wall, .component.newslist-v2 .article-list.wall, .component.newslist .article-list.list, .component.newslist-v2 .article-list.list { font-family: 'Montserrat'; /* wall */ } @media (max-width: 1170px) { .component.newslist .article-list.wall, .component.newslist-v2 .article-list.wall, .component.newslist .article-list.list, .component.newslist-v2 .article-list.list { padding: 0 15px 0; } } .component.newslist .article-list.wall article, .component.newslist-v2 .article-list.wall article, .component.newslist .article-list.list article, .component.newslist-v2 .article-list.list article { display: flex; flex-basis: 33%; flex-grow: 1; overflow: hidden; position: relative; background-size: 0; transform: scale(1); background: #fff; box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.5); transition: transform 0.1s, box-shadow 0.1s, background 0.1s; margin-bottom: 15px; } .component.newslist .article-list.wall article .article-inner, .component.newslist-v2 .article-list.wall article .article-inner, .component.newslist .article-list.list article .article-inner, .component.newslist-v2 .article-list.list article .article-inner { display: grid; width: 100%; grid-gap: 25px; grid-template-columns: 1fr; grid-template-rows: 1fr; } .component.newslist .article-list.wall article .article-inner .image, .component.newslist-v2 .article-list.wall article .article-inner .image, .component.newslist .article-list.list article .article-inner .image, .component.newslist-v2 .article-list.list article .article-inner .image { display: flex; overflow: hidden; } .component.newslist .article-list.wall article .article-inner .image div, .component.newslist-v2 .article-list.wall article .article-inner .image div, .component.newslist .article-list.list article .article-inner .image div, .component.newslist-v2 .article-list.list article .article-inner .image div { flex-grow: 1; transition: transform .1s; background-size: cover; background-position: center center; } .component.newslist .article-list.wall article .article-inner .info, .component.newslist-v2 .article-list.wall article .article-inner .info, .component.newslist .article-list.list article .article-inner .info, .component.newslist-v2 .article-list.list article .article-inner .info { display: flex; flex-direction: column-reverse; justify-content: flex-end; position: relative; transition: background .1s; padding: 20px; } .component.newslist .article-list.wall article .article-inner .info .title, .component.newslist-v2 .article-list.wall article .article-inner .info .title, .component.newslist .article-list.list article .article-inner .info .title, .component.newslist-v2 .article-list.list article .article-inner .info .title { font-weight: 300; color: #333333; text-indent: 0; text-decoration: none; overflow-wrap: break-word; word-wrap: break-word; hyphens: auto; font-weight: 600; } .component.newslist .article-list.wall article .article-inner .info .title em, .component.newslist-v2 .article-list.wall article .article-inner .info .title em, .component.newslist .article-list.list article .article-inner .info .title em, .component.newslist-v2 .article-list.list article .article-inner .info .title em { letter-spacing: 0; } .component.newslist .article-list.wall article .article-inner .info .date, .component.newslist-v2 .article-list.wall article .article-inner .info .date, .component.newslist .article-list.list article .article-inner .info .date, .component.newslist-v2 .article-list.list article .article-inner .info .date, .component.newslist .article-list.wall article .article-inner .info .taglink, .component.newslist-v2 .article-list.wall article .article-inner .info .taglink, .component.newslist .article-list.list article .article-inner .info .taglink, .component.newslist-v2 .article-list.list article .article-inner .info .taglink { font-size: 12px; line-height: 14px; font-weight: 900; font-style: italic; margin: 0 0 10px 0; color: #e00122; } .component.newslist .article-list.wall article .article-inner .info img.source-logo, .component.newslist-v2 .article-list.wall article .article-inner .info img.source-logo, .component.newslist .article-list.list article .article-inner .info img.source-logo, .component.newslist-v2 .article-list.list article .article-inner .info img.source-logo { margin-bottom: 10px; width: 240px; max-width: 95%; height: 36px; object-fit: contain; object-position: left center; } .component.newslist .article-list.wall article .article-inner .info .by, .component.newslist-v2 .article-list.wall article .article-inner .info .by, .component.newslist .article-list.list article .article-inner .info .by, .component.newslist-v2 .article-list.list article .article-inner .info .by, .component.newslist .article-list.wall article .article-inner .info .description, .component.newslist-v2 .article-list.wall article .article-inner .info .description, .component.newslist .article-list.list article .article-inner .info .description, .component.newslist-v2 .article-list.list article .article-inner .info .description { display: none; } .component.newslist .article-list.wall article.card-bg-grey, .component.newslist-v2 .article-list.wall article.card-bg-grey, .component.newslist .article-list.list article.card-bg-grey, .component.newslist-v2 .article-list.list article.card-bg-grey { background: #f3f3f3; } .component.newslist .article-list.wall article.card-bg-red, .component.newslist-v2 .article-list.wall article.card-bg-red, .component.newslist .article-list.list article.card-bg-red, .component.newslist-v2 .article-list.list article.card-bg-red { background: #e00122; color: #fff; } .component.newslist .article-list.wall article.card-bg-red .article-inner .info .title, .component.newslist-v2 .article-list.wall article.card-bg-red .article-inner .info .title, .component.newslist .article-list.list article.card-bg-red .article-inner .info .title, .component.newslist-v2 .article-list.list article.card-bg-red .article-inner .info .title { color: #fff; } .component.newslist .article-list.wall article.card-bg-black, .component.newslist-v2 .article-list.wall article.card-bg-black, .component.newslist .article-list.list article.card-bg-black, .component.newslist-v2 .article-list.list article.card-bg-black { background: #000; color: #fff; } .component.newslist .article-list.wall article.card-bg-black .article-inner .info .title, .component.newslist-v2 .article-list.wall article.card-bg-black .article-inner .info .title, .component.newslist .article-list.list article.card-bg-black .article-inner .info .title, .component.newslist-v2 .article-list.list article.card-bg-black .article-inner .info .title { color: #fff; } .component.newslist .article-list.wall article.emergency, .component.newslist-v2 .article-list.wall article.emergency, .component.newslist .article-list.list article.emergency, .component.newslist-v2 .article-list.list article.emergency { grid-template-columns: 1fr !important; } .component.newslist .article-list.wall article.emergency .article-inner .info, .component.newslist-v2 .article-list.wall article.emergency .article-inner .info, .component.newslist .article-list.list article.emergency .article-inner .info, .component.newslist-v2 .article-list.list article.emergency .article-inner .info { border-left: 20px solid #e00122; margin-left: 0 !important; } .component.newslist .article-list.wall article.emergency .article-inner .title em, .component.newslist-v2 .article-list.wall article.emergency .article-inner .title em, .component.newslist .article-list.list article.emergency .article-inner .title em, .component.newslist-v2 .article-list.list article.emergency .article-inner .title em { font-weight: bold; } .component.newslist .article-list.wall article.emergency .image, .component.newslist-v2 .article-list.wall article.emergency .image, .component.newslist .article-list.list article.emergency .image, .component.newslist-v2 .article-list.list article.emergency .image { display: none !important; } .component.newslist .article-list.wall article.grid-article-square-small .article-inner .image, .component.newslist-v2 .article-list.wall article.grid-article-square-small .article-inner .image, .component.newslist .article-list.list article.grid-article-square-small .article-inner .image, .component.newslist-v2 .article-list.list article.grid-article-square-small .article-inner .image, .component.newslist .article-list.wall article.grid-article-square-large .article-inner .image, .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner .image, .component.newslist .article-list.list article.grid-article-square-large .article-inner .image, .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner .image { display: none; } .component.newslist .article-list.wall article.grid-article-square-small .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-square-small .article-inner .info .title, .component.newslist .article-list.list article.grid-article-square-small .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-square-small .article-inner .info .title { font-size: 1.2em; } @media (min-width: 768px) { .component.newslist .article-list.wall article.grid-article-square-small .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-square-small .article-inner .info .title, .component.newslist .article-list.list article.grid-article-square-small .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-square-small .article-inner .info .title { font-size: 0.8em; } } .component.newslist .article-list.wall article.grid-article-square-large .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner, .component.newslist .article-list.list article.grid-article-square-large .article-inner, .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner { background-size: cover; background-position: right center; } .component.newslist .article-list.wall article.grid-article-square-large .article-inner .info, .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner .info, .component.newslist .article-list.list article.grid-article-square-large .article-inner .info, .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner .info { justify-content: center; padding: 50px; } .component.newslist .article-list.wall article.grid-article-square-large .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner .info .title, .component.newslist .article-list.list article.grid-article-square-large .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner .info .title { font-size: 48px; } .component.newslist .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n), .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n), .component.newslist .article-list.list article.grid-article-square-large .article-inner:nth-child(3n), .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner:nth-child(3n) { background-image: url(site/wall/images/no-photo-news1.png); } .component.newslist .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n+1), .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n+1), .component.newslist .article-list.list article.grid-article-square-large .article-inner:nth-child(3n+1), .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner:nth-child(3n+1) { background-image: url(site/wall/images/no-photo-news2.png); } .component.newslist .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n+2), .component.newslist-v2 .article-list.wall article.grid-article-square-large .article-inner:nth-child(3n+2), .component.newslist .article-list.list article.grid-article-square-large .article-inner:nth-child(3n+2), .component.newslist-v2 .article-list.list article.grid-article-square-large .article-inner:nth-child(3n+2) { background-image: url(site/wall/images/no-photo-news3.png); } .component.newslist .article-list.wall article.grid-article-square-large:hover .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-square-large:hover .article-inner, .component.newslist .article-list.list article.grid-article-square-large:hover .article-inner, .component.newslist-v2 .article-list.list article.grid-article-square-large:hover .article-inner, .component.newslist .article-list.wall article.grid-article-square-large:focus .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-square-large:focus .article-inner, .component.newslist .article-list.list article.grid-article-square-large:focus .article-inner, .component.newslist-v2 .article-list.list article.grid-article-square-large:focus .article-inner { background-image: none; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image, .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image { display: flex; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image div, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image div, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image div, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image div, .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image div, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image div, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image div, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image div { background-size: cover; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image img, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .image img, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image img, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .image img, .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image img, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .image img, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image img, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .image img { display: none; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner .info .title, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-small .article-inner .info .title, .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner .info .title, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-large .article-inner .info .title { font-size: 22px; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-small .article-inner, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-small .article-inner, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-small .article-inner { grid-template-columns: 1fr 1fr; } .component.newslist .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-horizontal-large .article-inner, .component.newslist .article-list.list article.grid-article-rectangle-horizontal-large .article-inner, .component.newslist-v2 .article-list.list article.grid-article-rectangle-horizontal-large .article-inner { grid-template-columns: 2fr 1fr; } .component.newslist .article-list.wall article.grid-article-rectangle-vertical-small .article-inner, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-vertical-small .article-inner, .component.newslist .article-list.list article.grid-article-rectangle-vertical-small .article-inner, .component.newslist-v2 .article-list.list article.grid-article-rectangle-vertical-small .article-inner { grid-template-rows: 1fr 1fr; } .component.newslist .article-list.wall article.grid-article-rectangle-vertical-small .article-inner .info, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-vertical-small .article-inner .info, .component.newslist .article-list.list article.grid-article-rectangle-vertical-small .article-inner .info, .component.newslist-v2 .article-list.list article.grid-article-rectangle-vertical-small .article-inner .info { margin-top: -25px; } .component.newslist .article-list.wall article.grid-article-rectangle-vertical-small .article-inner .info .title, .component.newslist-v2 .article-list.wall article.grid-article-rectangle-vertical-small .article-inner .info .title, .component.newslist .article-list.list article.grid-article-rectangle-vertical-small .article-inner .info .title, .component.newslist-v2 .article-list.list article.grid-article-rectangle-vertical-small .article-inner .info .title { font-size: 22px; } .component.newslist .article-list.wall article:hover, .component.newslist-v2 .article-list.wall article:hover, .component.newslist .article-list.list article:hover, .component.newslist-v2 .article-list.list article:hover, .component.newslist .article-list.wall article:focus, .component.newslist-v2 .article-list.wall article:focus, .component.newslist .article-list.list article:focus, .component.newslist-v2 .article-list.list article:focus { transform: scale(1.05); z-index: 9; background-image: none !important; background: #333333; box-shadow: 1px 1px 20px rgba(51, 51, 51, 0.5); } .component.newslist .article-list.wall article:hover .image div, .component.newslist-v2 .article-list.wall article:hover .image div, .component.newslist .article-list.list article:hover .image div, .component.newslist-v2 .article-list.list article:hover .image div, .component.newslist .article-list.wall article:focus .image div, .component.newslist-v2 .article-list.wall article:focus .image div, .component.newslist .article-list.list article:focus .image div, .component.newslist-v2 .article-list.list article:focus .image div { transform: scale(1.1); transition: transform 1s; } .component.newslist .article-list.wall article:hover .info .title, .component.newslist-v2 .article-list.wall article:hover .info .title, .component.newslist .article-list.list article:hover .info .title, .component.newslist-v2 .article-list.list article:hover .info .title, .component.newslist .article-list.wall article:focus .info .title, .component.newslist-v2 .article-list.wall article:focus .info .title, .component.newslist .article-list.list article:focus .info .title, .component.newslist-v2 .article-list.list article:focus .info .title, .component.newslist .article-list.wall article:hover .info .title, .component.newslist-v2 .article-list.wall article:hover .info .title, .component.newslist .article-list.list article:hover .info .title, .component.newslist-v2 .article-list.list article:hover .info .title, .component.newslist .article-list.wall article:focus .info .title, .component.newslist-v2 .article-list.wall article:focus .info .title, .component.newslist .article-list.list article:focus .info .title, .component.newslist-v2 .article-list.list article:focus .info .title, .component.newslist .article-list.wall article:hover .info a, .component.newslist-v2 .article-list.wall article:hover .info a, .component.newslist .article-list.list article:hover .info a, .component.newslist-v2 .article-list.list article:hover .info a, .component.newslist .article-list.wall article:focus .info a, .component.newslist-v2 .article-list.wall article:focus .info a, .component.newslist .article-list.list article:focus .info a, .component.newslist-v2 .article-list.list article:focus .info a, .component.newslist .article-list.wall article:hover .info .date, .component.newslist-v2 .article-list.wall article:hover .info .date, .component.newslist .article-list.list article:hover .info .date, .component.newslist-v2 .article-list.list article:hover .info .date, .component.newslist .article-list.wall article:focus .info .date, .component.newslist-v2 .article-list.wall article:focus .info .date, .component.newslist .article-list.list article:focus .info .date, .component.newslist-v2 .article-list.list article:focus .info .date, .component.newslist .article-list.wall article:hover .info .taglink, .component.newslist-v2 .article-list.wall article:hover .info .taglink, .component.newslist .article-list.list article:hover .info .taglink, .component.newslist-v2 .article-list.list article:hover .info .taglink, .component.newslist .article-list.wall article:focus .info .taglink, .component.newslist-v2 .article-list.wall article:focus .info .taglink, .component.newslist .article-list.list article:focus .info .taglink, .component.newslist-v2 .article-list.list article:focus .info .taglink { color: #fff; } .component.newslist .article-list.wall article[data-template-tag="blog"]:hover, .component.newslist-v2 .article-list.wall article[data-template-tag="blog"]:hover, .component.newslist .article-list.list article[data-template-tag="blog"]:hover, .component.newslist-v2 .article-list.list article[data-template-tag="blog"]:hover, .component.newslist .article-list.wall article[data-template-tag="blog"]:focus, .component.newslist-v2 .article-list.wall article[data-template-tag="blog"]:focus, .component.newslist .article-list.list article[data-template-tag="blog"]:focus, .component.newslist-v2 .article-list.list article[data-template-tag="blog"]:focus { background: #e00122; box-shadow: 1px 1px 20px rgba(224, 1, 34, 0.5); } .component.newslist .article-list.wall article[data-template-tag="in-the-news"]:hover, .component.newslist-v2 .article-list.wall article[data-template-tag="in-the-news"]:hover, .component.newslist .article-list.list article[data-template-tag="in-the-news"]:hover, .component.newslist-v2 .article-list.list article[data-template-tag="in-the-news"]:hover, .component.newslist .article-list.wall article[data-template-tag="in-the-news"]:focus, .component.newslist-v2 .article-list.wall article[data-template-tag="in-the-news"]:focus, .component.newslist .article-list.list article[data-template-tag="in-the-news"]:focus, .component.newslist-v2 .article-list.list article[data-template-tag="in-the-news"]:focus { background: #890519; box-shadow: 1px 1px 20px rgba(137, 5, 25, 0.5); } .component.newslist .article-list.wall article[data-template-tag="in-the-news"]:hover img.source-logo, .component.newslist-v2 .article-list.wall article[data-template-tag="in-the-news"]:hover img.source-logo, .component.newslist .article-list.list article[data-template-tag="in-the-news"]:hover img.source-logo, .component.newslist-v2 .article-list.list article[data-template-tag="in-the-news"]:hover img.source-logo, .component.newslist .article-list.wall article[data-template-tag="in-the-news"]:focus img.source-logo, .component.newslist-v2 .article-list.wall article[data-template-tag="in-the-news"]:focus img.source-logo, .component.newslist .article-list.list article[data-template-tag="in-the-news"]:focus img.source-logo, .component.newslist-v2 .article-list.list article[data-template-tag="in-the-news"]:focus img.source-logo { filter: brightness(0) invert(1); } .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus { background: #d1b179; box-shadow: 1px 1px 20px rgba(209, 177, 121, 0.5); } .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover .info .title, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover .info .title, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus .info .title, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus .info .title, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover .info .title, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover .info .title, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover .info .title, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus .info .title, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus .info .title, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus .info .title, .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover .info a, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover .info a, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover .info a, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover .info a, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover .info a, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover .info a, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover .info a, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover .info a, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus .info a, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus .info a, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus .info a, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus .info a, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus .info a, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus .info a, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus .info a, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus .info a, .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover .info .date, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover .info .date, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover .info .date, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover .info .date, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .date, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .date, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover .info .date, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover .info .date, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus .info .date, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus .info .date, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus .info .date, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus .info .date, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .date, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .date, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus .info .date, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus .info .date, .component.newslist .article-list.wall article[data-template-tag="must-read"]:hover .info .taglink, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:hover .info .taglink, .component.newslist .article-list.list article[data-template-tag="must-read"]:hover .info .taglink, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:hover .info .taglink, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .taglink, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:hover .info .taglink, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:hover .info .taglink, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:hover .info .taglink, .component.newslist .article-list.wall article[data-template-tag="must-read"]:focus .info .taglink, .component.newslist-v2 .article-list.wall article[data-template-tag="must-read"]:focus .info .taglink, .component.newslist .article-list.list article[data-template-tag="must-read"]:focus .info .taglink, .component.newslist-v2 .article-list.list article[data-template-tag="must-read"]:focus .info .taglink, .component.newslist .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .taglink, .component.newslist-v2 .article-list.wall article[data-template-tag="magazine-feature"]:focus .info .taglink, .component.newslist .article-list.list article[data-template-tag="magazine-feature"]:focus .info .taglink, .component.newslist-v2 .article-list.list article[data-template-tag="magazine-feature"]:focus .info .taglink { color: #000; } .component.newslist .article-list.wall, .component.newslist .article-list.list { grid-auto-rows: auto; } .component.newslist .article-list.wall[data-card-style='forceCSS'] article, .component.newslist .article-list.list[data-card-style='forceCSS'] article { grid-template-columns: 1fr !important; } .component.newslist .article-list.wall[data-card-style='forceCSS'] article .article-inner, .component.newslist .article-list.list[data-card-style='forceCSS'] article .article-inner { grid-template-columns: 1fr !important; grid-template-rows: 1fr 1fr; grid-gap: 0; } .component.newslist .article-list.wall[data-card-style='forceCSS'] article .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'] article .article-inner .info { margin-left: 0; } .component.newslist .article-list.wall[data-card-style='forceCSS'] article .article-inner .info h3, .component.newslist .article-list.list[data-card-style='forceCSS'] article .article-inner .info h3 { font-size: 1.2em; line-height: 1.2; } .component.newslist .article-list.wall[data-card-style='forceCSS'] article .article-inner .info .date, .component.newslist .article-list.list[data-card-style='forceCSS'] article .article-inner .info .date { font-size: 12px; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-standard'] article .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-standard'] article .article-inner .info { border-bottom: 25px solid #333333; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="blog"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="blog"] .article-inner .info { border-bottom: 25px solid #e00122; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="in-the-news"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="in-the-news"] .article-inner .info { border-bottom: 25px solid #890519; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="must-read"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="must-read"] .article-inner .info, .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="magazine-feature"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-standard'] article[data-template-tag="magazine-feature"] .article-inner .info { border-bottom: 25px solid #d1b179; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info { border-right: 25px solid #333333; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="blog"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="blog"] .article-inner .info { border-right: 25px solid #e00122; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="in-the-news"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="in-the-news"] .article-inner .info { border-right: 25px solid #890519; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="must-read"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="must-read"] .article-inner .info, .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="magazine-feature"] .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article[data-template-tag="magazine-feature"] .article-inner .info { border-right: 25px solid #d1b179; } @media (min-width: 450px) { .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner { grid-template-columns: 1fr 1fr !important; grid-template-rows: 1fr; } } @media (min-width: 768px) { .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'], .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] { grid-auto-rows: 170px; grid-template-columns: 1fr 1fr !important; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner { grid-template-columns: 1fr 1fr !important; grid-template-rows: 1fr; grid-gap: 25px; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info { margin-left: -25px; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info h3, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article .article-inner .info h3 { font-size: 0.8em; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) { grid-area: 1/1/3/2; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) .article-inner .info h3, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) .article-inner .info h3 { font-size: 1em; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(2), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(2) { grid-area: 1/2/2/3; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(3), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(3) { grid-area: 2/2/3/3; } } @media (min-width: 1200px) { .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'], .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] { grid-template-columns: 2fr 1fr !important; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) { grid-area: 1/1/3/2; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) .info h3, .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(1) .info h3 { font-size: 2em; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(2), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(2) { grid-area: 1/2/2/3; } .component.newslist .article-list.wall[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(3), .component.newslist .article-list.list[data-card-style='forceCSS'][data-force-css-style='3-featured'] article:nth-child(3) { grid-area: 2/2/3/3; } } /* news list */ .component.newslist, .component.newslist-v2 { padding: 0; } .component.newslist:after, .component.newslist-v2:after { content: ""; display: table; clear: both; } .component.newslist .rss-link, .component.newslist-v2 .rss-link { display: none; } .component.newslist .number, .component.newslist-v2 .number { display: none; } .component.newslist .image, .component.newslist-v2 .image { background-size: 0; } .component.newslist span[data-replace-with], .component.newslist-v2 span[data-replace-with] { display: block; height: 100px; margin: 10px auto; } .component.newslist .read-time, .component.newslist-v2 .read-time, .component.newslist .word-count, .component.newslist-v2 .word-count { font-size: .8em; font-weight: 700; color: #979797; } .component.newslist .article-list .component.button, .component.newslist-v2 .article-list .component.button { text-align: center; } .component.newslist .article-list .component.button.loading, .component.newslist-v2 .article-list .component.button.loading { opacity: 0.5; } .component.newslist .article-list.loading, .component.newslist-v2 .article-list.loading { cursor: wait; } .component.newslist .article-list.loading *, .component.newslist-v2 .article-list.loading * { display: none; } .component.newslist .article-list.loading:before, .component.newslist-v2 .article-list.loading:before { content: "Loading..."; color: #e00122; text-align: center; display: block; } .component.newslist .article-list h3.page-number, .component.newslist-v2 .article-list h3.page-number { border-bottom: 2px solid #e00122; padding-bottom: 5px; margin: 15px 0; } .component.newslist .article-list.featuredCardV2 .component.button, .component.newslist-v2 .article-list.featuredCardV2 .component.button { text-align: left; } .component.newslist .article-list.featuredCardV2 .component.button a, .component.newslist-v2 .article-list.featuredCardV2 .component.button a { margin-left: 0; } .component.newslist .search-header, .component.newslist-v2 .search-header { background: #efefef; padding: 5px 5px 5px 0; margin-bottom: 20px; } .component.newslist .search-header .result-count, .component.newslist-v2 .search-header .result-count { display: block; font-weight: bold; padding: 10px; } .component.newslist .search-header .arrows .arrow, .component.newslist-v2 .search-header .arrows .arrow { fill: #000; height: 1em; position: relative; top: 2px; right: -5px; } .component.newslist .search-header #sort-dims, .component.newslist-v2 .search-header #sort-dims { display: none; border: 1px solid #979797; border-top: 0; background: #fff; position: absolute; z-index: 10; top: 33px; width: 100%; } .component.newslist .search-header #sort-dims li a, .component.newslist-v2 .search-header #sort-dims li a { padding: 5px 10px; color: #333333; display: block; font-size: 0.8em; font-weight: bold; } .component.newslist .search-header #sort-dims li a.active, .component.newslist-v2 .search-header #sort-dims li a.active { background: #efefef; } .component.newslist .search-header #sort-dims li a:hover, .component.newslist-v2 .search-header #sort-dims li a:hover { background: #e00122; color: #fff; } @media (min-width: 500px) { .component.newslist .search-header, .component.newslist-v2 .search-header { position: relative; } .component.newslist .search-header .result-count, .component.newslist-v2 .search-header .result-count { display: flex; position: absolute; bottom: 0; top: 0; align-items: center; } .component.newslist .search-header .btn-group, .component.newslist-v2 .search-header .btn-group { float: right; width: auto; } } .component.newslist .pagenumbers, .component.newslist-v2 .pagenumbers { display: flex; padding: 10px 0; } .component.newslist .pagenumbers div, .component.newslist-v2 .pagenumbers div { flex-grow: 1; text-align: center; } .component.newslist .pagenumbers div a, .component.newslist-v2 .pagenumbers div a { padding: 0 10px; } body[data-template="uc-home"] .component.newslist .article-list article .title, body[data-template="uc-home"] .component.newslist-v2 .article-list article .title { font-family: 'Jost', sans-serif; }