/*
	front end css for the XI Library
	- column sizing with responsive sizing to switch for full width at 767px
*/


/*
	section columns
	possition relative so that this becomes the parent frame of ref
	allows us to use absolute bottom:0 to place read more buttons along the bottom
*/

.cols_section{
	position:relative;
	clear:both;
	overflow: hidden;
	width: 100%;
}

.col,
.col1-2,
.col1-3,
.col2-3,
.col1-4,
.col2-4,
.col3-4,
.col1-5,
.col2-5,
.col3-5,
.col4-5
{
	position:relative;
	margin-right: 2%;
	float: left;
}

.col1-3 { width: 32%; }
.col2-3 { width: 66%; }
.col1-4 { width: 22%; }
.col1-2,
.col2-4 { width: 49%; }
.col3-4 { width: 74%; }
.col1-5 { width: 16.8%; }
.col2-5 { width: 37.6%; }
.col3-5 { width: 58.4%; }
.col4-5 { width: 67.2%; }

.last {margin-right:0 !important;}



/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 770px) {

	.col1-2,
	.col1-3,
	.col2-3,
	.col1-4,
	.col2-4,
	.col3-4,
	.col1-5,
	.col2-5,
	.col3-5,
	.col4-5 {
		width: 100%;
		margin-right:0 !important;
	}	
	

}


/* END */