#feature-wrapper {text-align: center;}
span.subtitle-text { margin-right: 2px; }

/* Dropdown */
#dropdown-wrap {margin:0 auto; display: inline-block; padding-bottom:8px;}
#blog-dropdown-text { cursor: pointer; color: #208a3d; border-bottom: dotted 1px #208a3d; padding-bottom: 4px; }
#dropdown-menu {border-color: #858585; border-style: solid; border-width: 1px; border-radius: 4px; margin: 0 auto; margin-top: 5px; max-height: 400px; overflow: hidden; transition: all 0.3s ease-out; transform-origin: top; position: absolute; z-index: 1; display:none;}
/*#dropdown-wrap:hover #dropdown-menu { display:block; }*/
#dropdown-menu a {font-size: 15px; line-height: 22px; display: inline;}
#dropdown-menu li {background-color:#fff; color:#2c2c2e; cursor: pointer; padding: 8px 20px; text-align: left;}
#dropdown-menu li:hover {background-color:#f2f2f7;}

/* All articles */
#feature-article p, #other-articles p { color: #999999; }
#feature-article .article-content .article-type, #other-articles .article-content .article-type { margin-bottom: 5px; color: #208a3d; font-size: 14px; font-weight: 500; line-height: 25px; }
#feature-article .img, #other-articles .img { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; height: 240px; transition: transform 250ms ease; }
#feature-article .row-flex .img:after, #other-articles .column-content .img:after { background-color: transparent; transition: background-color 250ms ease; }

/* Feature Article */
#feature-article .section { padding: 0 0 24px 0 }
#feature-article .column-flex{ background-color: #ffffff; display: flex; flex: 1 1 auto; flex-direction: column; justify-content: center; transition: transform 300ms ease;}
#feature-article .row-flex { box-shadow: 1px 1px 2px #eaeaea; }
#feature-article .row-flex .column-flex.large-7 { overflow: hidden; }
#feature-article .article-image .column-content {height:100%}
#feature-article .article-content { padding: 40px; display: flex; flex: 1 1 auto; flex-direction: column; justify-content: space-between;}
/* Having feature image height match info column */
@media only screen and (min-width: 736px) {#feature-article .img.img-feature-article {height: 100%}}

#other-articles .section { padding-top: 0px; }
#other-articles .row-flex { flex-wrap: wrap; justify-content: space-between; }
#other-articles .row-flex:last-child { margin-bottom: 0px; }
#other-articles .row-flex .column { overflow: hidden; box-shadow: 1px 1px 2px #eaeaea; }
#other-articles .row-flex .column.column-2 { width: calc(50% - 12px); margin-bottom:24px; }
#other-articles .row-flex .column-content { height: 100%; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; }
#other-articles .article-content { padding: 30px; background-color: #ffffff; transition: transform 300ms ease; display: flex; flex: 1 1 auto; flex-direction: column; justify-content: space-between;}
#other-articles .sub-header { position: absolute; bottom: -88px; left: 0px; padding: 30px; opacity: 0; transition: opacity 250ms ease, transform 300ms ease; }

/* Turn off hover for small screens */
@media only screen and (min-width: 735px) {
	/* Hover Effect */
	#feature-article .row-flex:hover .column-flex.large-5 { transform: translate(-20px, 0px); }
	#feature-article .row-flex:hover .column-flex.large-7 .img, #other-articles .column-content:hover .img { transform: scale(1.05); }
	#feature-article .row-flex:hover .img:after, #other-articles .column-content:hover .img:after { content: ''; display: block; position: absolute; height: 100%; width: 100%; top: 0; left: 0; background-color: rgba(0,0,0,0.15); }
	#other-articles .column-content:hover .sub-header { opacity:1; transform: translate(0, -92px); }
	#other-articles .column-content:hover .article-content { transform: translate(0, -62px); }
	#other-articles .column.column-3 .column-content:hover .article-content { transform: translate(0, -77px); }
}

/* X-LARGE SCREENS (CASCADE TO LOWER SCREEN) */
@media only screen and (min-width: 1442px) {
	
}
 
/* LARGE SCREENS (SPECIFIC) */
@media only screen and (min-width: 1069px) and (max-width:1441px) {
	
}
 
/* MEDIUM SCREENS (CASCADE TO LOWER SCREENS) */
@media only screen and (max-width: 1068px) {
}
 
/* MEDIUM SCREENS (SPECIFIC) */
@media only screen and (min-width: 736px) and (max-width:1068px) {
	#feature-article .article-content p { font-size: 12px; line-height:18px; }
	#feature-article .h5, #other-articles .h5 { font-size: 22px; line-height: 25px; }
	#other-articles .img { height:250px; }
	#feature-article .article-content { padding: 35px; }
}
 
/* SMALL SCREENS */
@media only screen and (max-width: 735px) {
	#other-articles .row-flex .column.column-2 { width: 100%; }
}
 
/* EXTRA SMALL SCREENS < 400px */
@media only screen and (max-width: 400px) {
 
}