/**
 * Featured article grid specific styles
 * 
 */

/** General */
	.featured-article-grid .container {
		display: block;
	}

		.featured-article-grid .article-grid {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			align-items: stretch;
		}

			.featured-article-grid .owl-carousel .owl-stage{
				display: flex;
			}

			.featured-article-grid .article-grid .single-article-wrap {
				flex: 0 24%;
				height: 100%;
				box-sizing: border-box;
				background: #fff;
			}

				.featured-article-grid .article-grid .single-article-wrap a {
					text-decoration: none;
				}

				.featured-article-grid .article-grid .single-article .image-wrap {
					min-height: 225px;
					overflow: hidden;
					text-align: center;
				}

				.featured-article-grid .article-grid .single-article .content-wrap {
					padding: 1.5em 1em;
				}

					.featured-article-grid .article-grid .single-article .content-wrap span {
						font-size: 14px;
						font-weight: 100;
						text-transform: uppercase;
						color: #19253e;
					}

					.featured-article-grid .article-grid .single-article h3 {
						font-size: 18px;
						color: #152354;
						font-weight: 700;
						line-height: 1.25;
						margin: 0.4em 0 0;
					}
				
					.featured-article-grid .article-grid .single-article p:last-of-type {
						margin-bottom: 0;
					}

					.featured-article-grid .article-grid .single-article .image-wrap a {
						display: block;
						height: 100%;
						text-indent: -9999px;
						overflow: hidden;
					}

					.featured-article-grid .article-grid .single-article .content-wrap .buttons {
						margin: 0.5em 0 0;
					}
						.featured-article-grid .article-grid .single-article .content-wrap .buttons a { 
							font-weight: 700;
   							font-size: 14px;
						}


/** Responsive */
	@media only screen and (max-width: 1024px) {

		.featured-article-grid .article-grid .single-article .content-wrap {
			padding: 2em 1.5em;
		}

	}
	
	@media only screen and (max-width: 959px) {
		
			.featured-article-grid .article-grid .single-article-wrap {
				display: flex;
				flex: 1 0 auto;
				height: 100%;
			}

	}

	@media only screen and (max-width: 500px) {

		.featured-article-grid .article-grid .single-article-wrap {
			flex: initial;
		}

		.featured-article-grid .article-grid .single-article-wrap .single-article {
			width: 100%;
		}

		.featured-article-grid .article-grid{
			padding: 0;
		}
	}
