/**
****************************************************************************************
* CCFF
****************************************************************************************
*/
.ccff-list { }
.ccff-item { margin: 0; padding-bottom: 60px; text-align: center; }
.ccff-item-info { padding: 0 8%; }
.ccff-item-info p { margin: 0 auto; margin-bottom: 20px; overflow-wrap: break-word; text-align: center; }
.ccff-item-img { margin: 0 auto; margin-bottom: 30px; }
.ccff-date { font-size: 12px; }
.ccff-msg { font-size: 14px; }
.ccff-list a { text-decoration: none; }
.ccff-item:hover { opacity: 0.7; }


/**
****************************************************************************************
* Square
****************************************************************************************
*/
.ccff-square {
  position: relative;
}

.ccff-square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.ccff-square-content {
	position: absolute;
	width: 100%;
	height: 100%;	
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	flex-grow: 1;
	overflow: hidden; /* IE11 & Firefox fix */	
	-webkit-align-items: center;	
	-webkit-box-pack: center;
	-ms-flex-pack: center;		

	background-size: cover;
	background-position: center center;	
	background-image: none;	
	background-color: #fff;	
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
}

.ccff-square-content img { width: 100%; }


/**
****************************************************************************************
* Square - END
****************************************************************************************
*/



/**
****************************************************************************************
* Responsive design
****************************************************************************************
*/
/*  Section  */
.ccff-section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  Column */
.ccff-col {
	display: block;
	float: left;
	margin: 0 0 0 0;
}
.ccff-col:first-child { margin-left: 0; }

/*  Grouping  */
.ccff-group:before,
.ccff-group:after {
	content:"";
	display:table;
}
.ccff-group:after {
	clear:both;
}
.ccff-group {
    zoom:1; /* For IE 6/7 */
}


/*  Full width */
@media only screen and (min-width: 768px) {
	.ccff-col { margin: 0% 0 0% 0%; }
}

.ccff-col-1, .ccff-col-2, .ccff-col-3, .ccff-col-4 { width: 100%; }

@media only screen and (min-width: 768px) {	
	.ccff-col-1 { width: 100%; }
	.ccff-col-2 { width: 48%; }
	.ccff-col-2:nth-child(2n+1) { margin: 0 4% 0 0; }
	.ccff-col-3 { width: 31.0%; }		
	.ccff-col-3:nth-child(3n+2) { margin: 0 3.5%; }	
	.ccff-col-4 { width: 22%; margin-right: 4%; }		
	.ccff-col-4:nth-child(4) { margin-right: 0; }
		
	.ccff-col.ccff-col-3:nth-child(3n+1) { clear: both;	}
}

/**
****************************************************************************************
* Responsive design - END
****************************************************************************************
*/
