/* x-small */

.feature,
.ccm-ui .feature a,
.ccm-ui .feature a:hover {
color: #fff;
}

.ccm-ui .feature a:hover {
text-decoration: none;
}

.feature .rollover {
position:absolute;
bottom: 0;
width: 100%;
}

.feature {
position:relative;
opacity: 0;
width: 100%;
}

.feature.news .top {
background-color: #005e85;
background-color: rgba(0,94,133,0.95);
}

.feature.news .bottom {
background-color: #03546d;
}

.feature.events .top {
background-color: #4ea19e;
background-color: rgba(78,161,158,0.95);
}

.feature.events .bottom {
background-color: #1f7774;
}

.feature.flood .top {
background-color: #4e86a0;
background-color: rgba(78,134,160,0.95);
}

.feature.flood .bottom {
background-color: #437082;
}

.feature .top {
padding: 10% 6% 6% 6%;
position: relative;
}

.feature .top:hover {
cursor: pointer;
}

.feature .page {
margin: 4% 6%;
opacity: 0;
zoom: 1;
filter: alpha(opacity=0);
}

.feature .bottom {
height: 0;
overflow:hidden;
opacity: 0;
zoom: 1;
filter: alpha(opacity=0);
}

.feature .top .title {
text-transform:uppercase;
padding-top: 10px;
font-size: 12px;
font-weight: 600;
text-align: center;
display: block;
white-space: nowrap;
}

.feature .top .description {
display: none;
}

.feature .bottom .title {
display: block;
font-size: 20px;
margin-bottom: 4px;
font-weight: 300;
}

.feature .bottom .description {
font-weight: 100;
padding-bottom: 4px;
}

.feature .bottom .cover_image,
#mobile_feature_display .cover_image {
	width: 100%;
	padding-top: 100%;
}

.feature .left .date,
#mobile_feature_display .left .date {
font-weight:100;
text-transform:uppercase;
text-align: center;
}

.feature .left .date .day,
#mobile_feature_display .left .date .day {
font-size: 45px;
}

.feature .left .date .month,
#mobile_feature_display .left .date .month {
	font-size: 25px;
	line-height: 20px;
	padding-top: 5px;
}

.feature .top .left .contain_image,
#mobile_feature_display .top .left .contain_image {
	height: 0;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 3px solid #fff;
	padding-top: 55%;
	padding-top: calc(60% - 6px);
	width: 60%;
	margin: 0 auto;
}

.feature .cover_image {
	display: none;
}

.page-template-home #widgets .col-xs-4 {
	padding: 0;
}

.page-template-home #widgets .row {
	padding: 0;
}

/* mobile features */

#mobile_feature_display {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 0;
	width: 100%;
	z-index: 101;
	background-color: #ccc;
	color: #fff;
	overflow:auto;
}

#mobile_feature_display a {
	color: #fff;
}

#mobile_feature_display .left {
	width: 25%;
	float: left;
	padding-right: 5%;
}

#mobile_feature_display .right {
	width: 70%;
	float: left;
}

#mobile_feature_display .page {
	opacity: 0;
	margin: 2em;
	position: relative;
	top: 0;
	left: 0;
}

#mobile_feature_display .page .title,
#mobile_feature_display .page .title a {
	font-size: 24px;
	color: #fff;
}

.ccm-ui #mobile_feature_display .btn {
	display: block;
	text-transform: uppercase;
	size: 1.25em;
	font-weight: 600;
	border-radius: 0;
	background-color: #fff;
	color: #437082;
	margin-bottom: 0.5em;
	text-align: left;
}

.ccm-ui #mobile_feature_display .btn:hover {
	color: #437082;
	background-color: rgba(255,255,255,0.8);
}

/* end mobile features */

.ccm-ui .feature .status_meter,
#mobile_feature_display .status_meter {
	margin-top: 0.5em;
	width: 100%;
}

.feature.gold .top {
	background-color: #e3db08;
	background-color: rgba(227,219,8,0.95);
	color: #302f2f;
}
.feature.gold .top .left .contain_image {
	background-image: url(/application/files/2514/4605/8780/flood2.gif)!important;
	border-color: #444444;
}

.feature.orange .top {
	background-color: #f18903;
	background-color: rgba(241,137,3,0.95);
}

.feature.red .top {
	
	background-color: #e72831;
	background-color: rgba(231,40,49,0.95);
	
    -webkit-animation-name: red_blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;

    -moz-animation-name: red_blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;

    animation-name: red_blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes red_blinker {  
    0% { background-color: rgba(179,32,39,0.95); }
    50% { background-color: rgba(231,40,49,0.95); }
    100% { background-color: rgba(179,32,39,0.95); }
}

@-webkit-keyframes red_blinker {  
    0% { background-color: rgba(179,32,39,0.95); }
    50% { background-color: rgba(231,40,49,0.95); }
    100% { background-color: rgba(179,32,39,0.95); }
}

@keyframes red_blinker {  
    0% { background-color: rgba(179,32,39,0.95); }
    50% { background-color: rgba(231,40,49,0.95); }
    100% { background-color: rgba(179,32,39,0.95); }
}

/* end x-small */

/* custom */

@media only screen and (max-width : 768px) and (orientation : landscape), screen and (min-width : 768px) {

	.feature .left {
		float:left;
		width:28%;
		margin-right:2%;
	}
	
	.feature .right {
		float:left;
		width:70%;
	}
	
	.feature .top .title {
		padding-top: 0;
		text-align: left;
		font-size: 16px;
	}
	
	.feature .top .description {
		display: block;
		font-size: 12px;
		line-height: 14px;
	}
	
	.feature .top .left .contain_image {
		border: 2px solid #fff;
	}
	
}

/* small */ 
@media only screen and (min-width : 768px) {
	
	#mobile_feature_display {
		display: none;
	}
	
	.feature .top .left .contain_image {
		border: 3px solid #fff;
	}

	.feature .left {
		width:20%;
		margin-right:5%;
	}
	
	.feature .right {
		width:75%;
	}

	.feature {
	padding-top: 0;
	}
	
	.feature .top {
	padding: 8%;
	top: 0!important;
	}
	
	.feature .page {
	margin: 7% 8%;
	}
	
	.feature .bottom .title {
	font-size: 17px;
	line-height: 19px;
	}
	
	.feature .bottom .description {
	font-size: 13px;
	line-height: 15px;
	}
	
	.feature .left .date .day {
	font-size: 40px;
	}
	
	.feature .left .date .month {
	font-size: 20px;
	line-height: 15px;
	padding-top: 5px;
	}
	
	.feature .left {
	width:25%;
	}
	
	.feature .right {
	width: 70%;
	}
	
	.feature .top .left .contain_image {
	padding-top: 90%;
	padding-top: calc(100% - 6px);
	width: 100%;
	}
	
	.feature .cover_image {
	display: block;
	width: 100%;
	padding-top: 60%;
	}
	
	.page-template-home #widgets .col-xs-4 {
	padding-left: 5px;
	padding-right: 5px;
	}
	
	.page-template-home #widgets .row {
	padding-top: 5%;
	}
	
	.ccm-ui .feature .btn {
		display: block;
		text-transform: uppercase;
		size: 1.25em;
		font-weight: 600;
		border-radius: 0;
		background-color: #fff;
		color: #437082;
		margin-bottom: 0.5em;
		text-align: left;
	}
	
	.ccm-ui .feature .btn:hover {
		color: #437082;
		background-color: rgba(255,255,255,0.8);
	}

} /* end small */

/* small only */
@media only screen and (min-width : 768px) and (max-width : 991px) {

.feature .top .left .contain_image {
border: 2px solid #fff;
padding-top: 90%;
padding-top: calc(100% - 4px);
}

} /* end small only */

/* medium */
@media only screen and (min-width : 992px) {

.feature .top {
padding: 12%;
}

.feature .page {
margin: 8% 12%;
}

.feature .top .title {
font-size: 22px;
}

.feature .top .description {
font-size: 13px;
line-height: 15px;
}

.feature .bottom .title {
font-size: 18px;
line-height: 20px;
}

.feature .left .date .day {
font-size: 50px;
}

.feature .left .date .month {
font-size: 30px;
line-height: 25px;
padding-top: 5px;
}

.page-template-home #widgets .col-xs-4 {
padding-left: 15px;
padding-right: 15px;
}


} /* end medium */

/* large */
@media only screen and (min-width : 1200px) {

.feature .top {
padding: 8% 12%;
}

.feature .top .title {
font-size: 24px;
}

.feature .top .description {
font-size: 14px;
line-height: 16px;
}

.feature .bottom .title {
font-size: 22px;
}

.feature .bottom .description {
font-size: 15px;
line-height: 17px;
}



} /* end large */