/* CSS Document */

/* common HTML5 elements */
header, footer, nav, article { margin: 0; padding: 0; display: block; width: auto; }

.rsc-ui .viewport {
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.rsc-ui .content-block {
	display: block;
	position: relative;
	width: auto;	
	height: auto;
}


/* columns */

.rsc-ui .column {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	display: inline;
	padding: 0 16px 0 0;
	float: left;
}
.rsc-ui .column.padded {
	padding: 0 16px;
}
.rsc-ui .column.full {
	width: 100%;
}
.rsc-ui .column.two {
	width: 100%;
}
.rsc-ui .column.three {
	width: 100%;
}
.rsc-ui .column.three.single {
	width: 100%;
}
.rsc-ui .column.three.double {
	width: 100%;
}
.rsc-ui .column.four {
	width: 100%;
}
.rsc-ui .column.four.single {
	width: 100%;
}
.rsc-ui .column.four.double {
	width: 100%;
}
.rsc-ui .column.four.triple {
	width: 100%;
}
.rsc-ui .column.six {
	width: 50%;
}


.rsc-ui .column .column {
	padding: 0;
}
.rsc-ui .column .column:last-child {
	padding: 0 0 0 0 !important;
}



/* positioning helpers */
.fl-r { float: right; }
.fl-l { float: left; }
.text-r { text-align: right; }
.text-l { text-align: left; }
.ver-t { vertical-align: top; }
.ver-b { vertical-align: bottom; }
.ver-m { vertical-align: middle; }

.rel { position: relative; width: 100%; height: 100%; }
.abs { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }

.pad-l { padding-left: 16px; }
.pad-r { padding-right: 16px; }


/* responsive classes */

/* small viewports */
@media only screen and (min-width: 480px) {
	
	
}

/* mid viewports */
@media only screen and (min-width: 640px) {
	.rsc-ui .viewport { max-width: 640px; }
	.rsc-ui nav.secondary li a {
		font-size: 15px;
	}
	.rsc-ui .column.four {
		width: 50%;
	}
	.rsc-ui .column.four.single,
	.rsc-ui .column.four.triple {
		width: 100%;
	}
	.rsc-ui .column.four.double {
		width: 100%;
	}
	.rsc-ui .column .column.two {
		width: 50%;
	}
	.rsc-ui .column.six {
		width: 33.33%;
	}

}


/* ipad specific viewports */
@media only screen and (min-width: 768px) {
	.rsc-ui .viewport { max-width: 768px; }
	.rsc-ui nav.secondary li {
		float: left;
	}
	
}

/* full viewports */
@media only screen and (min-width: 960px) {
	.rsc-ui .viewport { max-width: 960px; }
	
	.rsc-ui .column.two {
		width: 50%;
	}
	.rsc-ui .column.three {
		width: 33.333%;
	}
	.rsc-ui .column.three.double {
		width: 66.666%;
	}
	.rsc-ui .column.four,
	.rsc-ui .column.four.single {
		width: 25%;
	}
	.rsc-ui .column.four.wide {
		width: 50%;
	}
	.rsc-ui .column.four.double {
		width: 50%;
	}
	.rsc-ui .column.four.triple {
		width: 75%;
	}
	
}

/* wide viewports */
@media only screen and (min-width: 1200px) {
	.rsc-ui .viewport { max-width: 1220px; }
	.rsc-ui .column.four.wide,
	.rsc-ui .column.four.single {
		width: 25%;
	}
	.rsc-ui .column.six {
		width: 16.66%;
	}
}

/* super wide viewports */
@media only screen and (min-width: 1600px) {
	.rsc-ui .viewport { max-width: 1600px; }
}