﻿.cuadro{
	border: 0px solid red;
	width: 32%;
	height: 260px;
	float: left;
	margin-right: 1.33%;
	cursor: pointer;''

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

.cuadro:hover .titulo-cuadro{
	background: rgba(256,256,256,0.9);
	padding: 12px 0;
}

.titulo-cuadro{
	background: rgba(256,256,256,0.7);
	width: 100%;
	color: blue;
	font-weight: bold;
	text-align: center;
	float: left;
	padding: 8px 0;

	transition:all 0.2s;
}

.uno{
	background: url(../images/uno.jpg) no-repeat center center;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
}

.dos{
	background: url(../images/dos.jpg) no-repeat center center;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
}

.tres{
	background: url(../images/tres.jpg) no-repeat center center;
	background-size: cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
}




.producto{
	border: 0px solid red;
	width: 32%;
	height: 260px;
	float: left;
	margin-right: 1.33%;
	cursor: pointer;''

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

.titulo-producto{
	width: 100%;
	color: blue;
	font-weight: bold;
	text-align: center;
	float: left;
	padding: 8px 0;

	transition:all 0.2s;
}

.imagen-producto{
	width: 100%;
	height: 200px;
	text-align: center;
	float: left;

	overflow: hidden;
}

.imagen-producto img{
	width: auto;
	height: 100%;
}



.leyenda{
	text-align: center;
	font-size: 18px;
	float: left;
	padding: 20px 0;
}


#formulario{
	width: 100%;
	padding: 10px 10px 20px 10px;
	float: left;

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

@media screen and (max-width: 600px){
	.producto{
		width: 98%;
	}
}

@media screen and (max-width: 500px){
	.cuadro{
		width: 98%;
	}
}