/* General Styling */
.news-content:after {
	position: absolute;
	content: '';
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0.88) 16%,rgba(255,255,255,1) 20%,rgba(255,255,255,0) 30%);
	z-index: -1;
}

.news-content:before {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: translate(0%, 1%);
	-ms-transform: translate(0%, 1%);
	transform: translate(0%, 1%);
	background-size: 100%;
	background-position: 50% 25%;
	background-repeat: no-repeat;
	content: '';
	z-index: -1;
	background-image: url(/images/design/family-walking.jpg);
}

.news-content {
	padding-top: 6.389em;
	position: relative;
	z-index: 1;
}

.cms-admin .news-content {
	z-index: 0;
}
/* End General Styling */

/* Newsreel Styling */
.news-content .newsreel {
}

.cms-admin .news-content .newsreel {
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.news-content .newsreel header {
	transition: 1s ease .5s;
}

.no-touch .news-content .newsreel header {
	opacity: 0;
	top: 0;
}

.cms-admin .news-content .newsreel header {
	opacity: 1 !important;
	-webkit-transform: none !important;
	-ms-transform: none !important;
	transform: none !important;
	top: 0;
	width: 100% !important;
}

.no-touch .news-content .newsreel.visible header {
	top: 50%;
	opacity: 1;
}

.news-content aside {
	position: relative;
	width: 43%;
}

.news-content aside .container {
	opacity: 1;
	transition: 1s ease 0s;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}

.no-touch .news-content aside .container {
	opacity: 0;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.cms-admin .news-content aside .container {
	opacity: 1 !important;
	-webkit-transform: translateX(0) !important;
	-ms-transform: translateX(0) !important;
	transform: translateX(0) !important;
}

.news-content .visible aside .container {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}

_.news-content aside:before {
	position: absolute;
	content: '';
	width: 101%;
	height: 100%;
	top: 50%;
	left: 50%;
	display: block;
	box-shadow: inset 5em 0 1.5em -4.5em #fff, inset -5em 0 1.5em -4.5em #fff;
	pointer-events: none;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	z-index: 1;
}

.news-content aside .news-list li {
	position: relative;
	padding: 0 1em;
	width:100%;
}

.news-content aside .img-con {
	width: 100%;
	height: 22.944em;
	box-shadow: 0px 4px 13px rgba(0, 1, 1, 0.25);
}

.news-content aside .img-con img {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
}

.news-content aside .btn-con {
	position: absolute;
	bottom: 0;
	right: 1.667rem;
	-webkit-transform: translate(0%, 0%);
	-ms-transform: translate(0%, 0%);
	transform: translate(0%, 0%);
	text-align: right;
	-webkit-align-items: flex-end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	height: 100%;
	max-width: 20em;
	padding: 1.67em 0;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
}

.news-content aside .btn-con h3 {
	color: #FFFFFF; /* $white */
	font-size: 1.9em;
	font-weight: 500;
	line-height: 1.3;
	text-shadow: 2px 4px 5px rgba(0, 1, 1, 0.75);
	width: 100%;
}

.news-content aside .btn-con .btn {
	box-shadow: 0px 4px 13px rgba(0, 1, 1, 0.25);
}

.news-content aside .bottom {
	position: relative;
	margin: 0 3.111em;
	padding-top: 0.278em;
}

.news-content aside .bottom .btn.v3 {
	color: #E7B314; /* $secondary */
}

.no-touch .news-content aside .bottom .btn.v3:hover, .news-content aside .bottom .btn.v3:focus {
	color: #454545;
}

.news-content aside .bottom nav {
	left: auto;
	right: 0;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}

.news-content .scroll-controls {
    position: absolute;
    bottom: 1.5em;
    right: 0;
}

/* End Newsreel Styling */

/* Main Content Area */
.news-content article {
	width: 53%;
	transition: 1s ease .4s;
}

.no-touch .news-content article {
	opacity: 0;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}

.cms-admin .news-content article {
	opacity: 1 !important;
	-webkit-transform: translateX(0) !important;
	-ms-transform: translateX(0) !important;
	transform: translateX(0) !important;
}

.no-touch .news-content .visible article {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}

.news-content article h1, .news-content article h2 {
	line-height: 1.2;
	text-transform: initial;
	letter-spacing: 0;
}
/* End Main Content Area */

/* Responsive Width at 1600px */
@media screen and (max-width: 1600px) {
	.news-content:after {
		background-image: linear-gradient(to bottom,rgba(255,255,255,0.2) 0%,rgba(255,255,255,0.98) 7%,rgba(255,255,255,1) 20%,rgba(255,255,255,0) 50%);
	}
}
/* End Responsive Width at 1600px */

/* Responsive Width at 1530px */
@media screen and (max-width: 1530px) {
	.news-content aside {
		padding-left: 1em;
	}

	.news-content {
		padding-top: 4em;
	}
}
/* End Responsive Width at 1530px */

/* Responsive Width at 1440px */
@media screen and (max-width: 1440px) {
}
/* End Responsive Width at 1440px */

/* Responsive Width at 1200px */
@media screen and (max-width: 1200px) {
}
/* End Responsive Width at 1200px */

/* Responsive Width at 1000px */
@media screen and (max-width: 1000px) {
	.news-content:before {
		background-position: 50% 35%;
	}
}
/* End Responsive Width at 1000px */

/* Responsive Width at 800px */
@media screen and (max-width: 800px) {
	.newsreel .news-list li {
		padding: 0;
	}

	.newsreel .img-con {
		height: 20.267em;
		box-shadow: 0px 3px 7px rgba(0, 1, 1, 0.25);
	}

	.newsreel:before {
		content: none;
	}

	.news-content article {
		padding: 2em 5.8%;
		width: 100%;
	}

	.news-content aside {
		width: 100%;
		padding: 0;
	}

	.news-content > div.full {
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}

	.news-content:before {
		background-image: url(/images/design/family-walking-mobile.jpg);
		background-size: 100%;
		background-position: bottom;
		-webkit-transform: translate(0, -25%);
		-ms-transform: translate(0, -25%);
		transform: translate(0, -25%);
	}

	.news-content {
		padding-top: 2em;
	}
}
/* End Responsive Width at 800px */

/* Responsive Width at 650px */
@media screen and (max-width: 650px) {
	.news-content .scroll-controls {
	    position: relative;
	    bottom: 1.5em;
	    right: 0;
	    margin: 0 auto;
	}
	.news-content .scrolling-list-nav {
	    width: 100%;
	    justify-content: space-between;
	}
	.news-content .scrolling-list-nav .pages-cont {
		display:none;
	}
}
/* End Responsive Width at 650px */

/* Responsive Width at 550px */
@media screen and (max-width: 550px) {
	.newsreel .bottom {
		-webkit-justify-content: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.newsreel .bottom nav {
		display: none;
	}

	.newsreel .img-con {
		height: 18.056em;
	}
}
/* End Responsive Width at 550px */
