@charset "utf-8";
/* Latest News CSS Document */
.news-box{ position:relative; background-color:#ffffff; -webkit-box-shadow: 0px 3px 10px 2px rgba(20,33,43,0.1); box-shadow: 0px 3px 10px 2px rgba(20,33,43,0.1); margin:15px 0; }
.news-thumb{ position:relative; overflow:hidden; }
.news-thumb img{ -webkit-transition:0.6s; transition:0.6s; -webkit-backface-visibility:hidden; backface-visibility:hidden; filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); -webkit-filter: grayscale(0%); }
.news-thumb .post-meta{ margin:0; padding:0; }

.news-content{ margin:0; position:relative; z-index:10; }
.latest-news-para{ padding:25px 20px; }
.news-content h3{ margin:0 0 12px; font-family:'Barlow'; font-size:20px; font-weight:700; line-height:1.3; text-transform:uppercase; }
.news-content h3 a { color:#122e53; }
.latest-news-para p{ line-height:24px; margin-bottom:10px; }

.post-meta{ text-transform:capitalize; margin:0 0 20px; }
.post-meta span{ display:inline-block; position:relative; padding:0; margin-right:5px; }
.post-meta span:last-child{ padding-right:0; }
.post-date{ position:absolute; width: max-content; padding:8px 20px; background-color:#c01120; top:20px; left: 20px; display: table; margin: 0 auto; text-align:center; font-size:14px; font-weight:700; color:#ffffff; z-index: 1; }

.news-box:hover h3 a{ color:#c01120; }
.news-box:hover .news-thumb img{ filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); filter: gray; -webkit-filter: grayscale(100%); }

.ln-read-more{ text-transform:uppercase; display:inline-block; color:#ffffff; background-color: #c01120; padding:12px 40px 14px 20px; z-index:0; position:relative; font-weight: 700; line-height: 1; margin-top: 15px; }
.ln-read-more:before{ content: '\f178'; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-family: 'Font Awesome 5 Pro'; font-weight: 400; }
.ln-read-more:hover{ color:#ffffff; padding:12px 50px 14px 20px; background-color: #000000; }
