/*
<div class="r2c2c1">
	<div class="r2c2">
		<div class="content"></div>
	</div>
	<div class="r1c1">
		<div class="content"></div>
	</div>
	<div class="r2c1">
		<div class="content"></div>
	</div>
</div>
	TRIPANE
*/
.r2c2c1 {
	position: relative;
	width: 100%;
}

.r2c2c1 .r2c2 {
	position: relative;
	padding-top: 10px;
	width: 100%;
	height: auto;
}

.r2c2c1 .r1c1 {
	position: relative;
	padding-top: 10px;
	width: 100%;
	height: auto;
	display: inline-block;
}

.r2c2c1 .r2c1 {
	position: relative;
	padding-top: 10px;
	width: 100%;
	height: auto;
	display: inline-block;
}

.r2c2c1 .r2c2 .content,
.r2c2c1 .r1c1 .content,
.r2c2c1 .r2c1 .content {
	position: relative;
	width: 100%;
	height: auto;
	min-height: 300px;
	background-color: #FFF;
	color: inherit;
	overflow: hidden;
}

.r2c2c1 .r2c1 .content:hover,
.r2c2c1 .r1c1 .content:hover,
.r2c2c1 .r2c1 .content:hover {
	
}

@media only screen and (min-width: 768px) {
	
	body.s-p-c .r2c2c1 .r2c2 .content,
	body.s-p-c .r2c2c1 .r1c1 .content,
	body.s-p-c .r2c2c1 .r2c1 .content {
		height: 100%;
		min-height: 0px;
	}
	
	body.s-p-c .r2c2c1 {
		height: 600px;
	}
	
	body.s-p-c .r2c2c1 .r2c2 {
		float: right;
		padding: 10px 0px 10px 5px;
		width: 60%;
		height: 100%;
	}
	
	body.s-p-c .r2c2c1 .r1c1 {
		float: left;
		padding: 10px 5px 5px 0px;
		width: 40%;
		height: 50%;
		display: block;
	}
	
	body.s-p-c .r2c2c1 .r2c1 {
		padding: 5px 5px 10px 0px;
		width: 40%;
		height: 50%;
	}
	
	body.s-p-c .r2c2c1 .r2c2 .content,
	body.s-p-c .r2c2c1 .r1c1 .content,
	body.s-p-c .r2c2c1 .r2c1 .content {
		height: 100%;
	}
	
}

@media only screen and (min-width: 1098px) {
	
	.r2c2c1 .r2c2 .content,
	.r2c2c1 .r1c1 .content,
	.r2c2c1 .r2c1 .content {
		height: 100%;
		min-height: 0px;
	}
	
	.r2c2c1 {
		height: 600px;
	}
	
	.r2c2c1 .r2c2 {
		float: right;
		padding: 10px 0px 10px 5px;
		width: 60%;
		height: 100%;
	}
	
	.r2c2c1 .r1c1 {
		float: left;
		padding: 10px 5px 5px 0px;
		width: 40%;
		height: 50%;
		display: block;
	}
	
	.r2c2c1 .r2c1 {
		padding: 5px 5px 10px 0px;
		width: 40%;
		height: 50%;
	}
	
	.r2c2c1 .r2c2 .content,
	.r2c2c1 .r1c1 .content,
	.r2c2c1 .r2c1 .content {
		height: 100%;
	}
	
}