.news-section {
	background: #fafafa;
}

.news-section.white {
	background: #fff;
}

.news-section.add-borders {
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

.news-section .two-col-section .col {
	width: 45%;
	float: left;
	padding: 60px 0 60px 15px;
}

.news-section .two-col-section .col:first-child {
	width: 55%;
}

.news-section .more {
	float: right;
	font-weight: normal;
}

.news-section .more:hover {
	color: #00a651 !important;
}

/****************************************************************              PC - LARGE             ***********************************************/

@media screen and (max-width: 2000px) {
}

/*   Above are specific PC-LARGE stylings, if needed; otherwise - this (PC-LARGE section) is the general design styling for the page, i.e colors, fonts, backgrounds. etc. You put down only dimensional and other dom-model related changes in the desigh in the screen-size queries below */

/****************************************************************              PC              ***********************************************/

@media screen and (max-width: 1218px) {
	.news-section .tab-content {
		height: 460px !important;
	}
}

/****************************************************************              TABLET              ***********************************************/

@media screen and (max-width: 977px) {
	.news-section .tab-content {
		height: 438px !important;
	}
	.news-section .two-col-section .col,
	.news-section .two-col-section .col:first-child {
		width: 100%;
		float: left;
		padding: 20px 0 0;
	}
	.news-section .more {
		margin: 0 10px 10px 0;
	}
}

/****************************************************************              MOBILE Landscape             ***********************************************/
@media screen and (max-width: 747px) {
	.news-section h2 {
		padding: 0 10px;
		font-size: 30px;
	}
	.news-section .more {
		margin: 0 10px 30px 0;
	}
}