﻿#efecto-conten{
	width: 100%;
	height: auto;
}

.texto{
	border: 0px solid red;
	width: 100%;
	line-height: 28px;
	margin: 0 0 30px 0;
	float: left;
}

#ladoi{
	width: 50%;
	float: left;
}

#ladod{
	width: 49%;
	float: left;
}

.cuadro{
	border: 3px solid gray;
	min-height: 328px;
	color: white;
	float: left;
	padding: 10px;
	margin: 0 20px 0 0;

	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-izing:border-box;
}

.cuadro a{
	color: white;
}

.azul{
	background: #195b7f;
	width: 23%;
}
.rojo{
	background: #ae3020;
	width: 39%;
}
.verde{
	background: #008f40;
	width: 34%;
	margin: 0 !important;
}

.marca{
	border: 0px solid red;
	width: 48%;
	text-align: center;
	float: left;
	margin: 0 10px 20px 0;
	padding: 10px;

	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

@media screen and (max-width: 1100px){
	.cuadro{
		width: 33% !important;
		min-height: auto;
		height: auto !important;
		margin: 0;
	}
}

@media screen and (max-width: 960px){
	.cuadro{
		width: 100% !important;
	}
}

@media screen and (max-width: 670px){
	.marca{
		width: 100%;
	}

	.marca .calentador{
		width: 100% !important;
		height: auto !important;
	}
}

@media screen and (max-width: 550px){
	#ladoi, #ladod{
		width: 100%;
	}

	#ladod{
		margin: 30px 0 0 0;
	}
}