/*******************************************************************************
*
* News Topics
*
* Created by JDP Creative Outbursts
* https://www.facebook.com/jdpcreativeoutbursts
*******************************************************************************/
.topic {
	position: relative;	
	background-color:#eee;
	border:1px solid #aaa;
	overflow:hidden;
	margin-bottom:14px;
}

.topic a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=80); /* For IE8 and earlier */
	transition:all 0.5s;
}

article {
	padding:7px;
}
article h2 {
	font-size:10pt;
	border:none;
}
article h3 {
	font-size:10pt;
	border:none;
}
article p {
	font-size:10pt;
	color:#888;
	margin:0px;
}
article a.more {
	font-size:8pt;
	text-transform:uppercase;
}

.category {
	position: absolute;
	top:5px;
	left:5px;	
	color:#fff;
	text-transform: uppercase;
	font-size:8pt;
	padding: 3px 5px;	
}

.weather {
	background-color: #013b59;
}

.conservation {
	background-color: #376654;
}

@media screen and (max-width:640px) {
	.category {
		position: relative;
		display:block;
		font-size:7pt;			
		font-weight:bold;
		margin-bottom:5px;
		padding:1px 5px;
		left:0px;
		top:0px;
		background-color:transparent;
	}
	
	.weather {
		color: #013b59;
	}
	
	.conservation {
		color: #376654;
	}
	
	article {
		padding-top:0px;
	}
	.topic {
		padding: 5px;
		background-color: #eee;
		border: none;
		height:auto;
		margin-bottom:7px;
	}	
	article h2,
	article h3	{
		margin:0px;
		font-size:10pt;
		text-transform:none;
	}	
}

@media screen and (min-width:780px) and (max-width:1024px) {	
	.topic {
		
	}	
}

@media screen and (min-width:780px) and (max-width:900px) {	
	article h2 {
		font-size:10pt;
	}
	article h3		{
		font-size:9pt;
	}
}


/* Article page */
.article-info {
	color:#aaa;
	font-size:9pt;
	margin-top:7px;
	margin-bottom:0px;
}

.article-img {
	margin-bottom:14px;	
	position:relative;
}

.article-img img {
	width:100%;
}

.share-btn {
	position:absolute;
	bottom:10px;
	right:10px;
}

.share-btn .social-media li a {
	width:48px;
	height:48px;
	margin:3px!important;
	text-align:center;	
	color:#fff;	
}

.share-btn .social-media li a i {
	margin-left:-5px;
}

.sm-btn {
	margin-top:7px;
	clear:both;
	height:30px;
}