@charset "utf-8";
/* CSS Document */

<style>

	body {
		background-color: #d6e9ff;
		font-family: corbel;
	}
	img { 
		width: 100%;
		height:100%;
	}
@font-face {
  font-family: "corbel";
  src: url("fuente/corbel.ttf");
}

	.container {
		width:970px;
		margin:0px auto;
		font-size:15px;
		height:400px;

	}
	.img {
		width:100px;
		height:100px;
		padding:0px;
		margin-right:10px;
		float:left;

	}
	.size10{
		font-size:10px;
		}
	.img1 {
		width:418px;
		padding:15px;
		display:block;
		margin:auto;
	}
	.text-align {
		text-align:center;
	}
	
	.marcas {
		text-align:center;
		size:16px;
		font-weight:bold;
		color:#039;
	}
	section,aside {
		padding: 10px;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
		background-color: #F2F2F2;
	}
	input, select, button, textarea {
	border: 1px dotted #999;
	border-radius: 5px;
	width: 90%;
	height: 35px;
	margin-left: 20px;
	margin-bottom:20px;
	box-sizing: border-box;
	padding:5px;
}

 .titulo_beneficio{
	 color:#c70a1c;
	 font-weight:bold;
 }

/*Content Boxes*/
	.content-box-blue, .content-box-gray, .content-box-green, .content-box-purple, .content-box-red,
	.content-box-yellow {
margin: 0 0 15px;
overflow: hidden;
padding: 10px;
-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
}

	.content-box-red {
background-color: #49853F;
border: 1px solid #3F471F;
font-size:15px;
text-align:center;
color:#fff;
}

.content-box-green {
background-color: #7f7f7f;
border: spx solid #bcc3c7;
font-size:16px;
text-align:center;
color:#fff;
}

	section {
		float: left;
		width: 65%;
	}
	aside {
		float: right;
		width: 30%;
		background-color:#069 !important;
	}
	nav {
		overflow: hidden;
	}
	nav ul {
		list-style-type:none;
		float:left;
		padding:0px;
	}
	nav ul li {
		float:left;
		padding:3px 10px;
		margin:2px;
		background: #09F;
		color:#f1f1f1;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
	}
	footer {
	margin:10px;
	text-align:center;
	clear:both;
	}
 
	/* para 980px o menos */
	@media screen and (max-width:980px) {
		.container {
			width:98%;
		}
		section {
			width:68%;
		}
	}
 
	/* para 700px o menos */
	@media screen and (max-width:700px) {
		aside,section {
			float:none;
			width:96%;
		}
		nav, section {
			font-size:14px;
		}
		aside {
			margin-top:5px;
		}
		nav ul {
			float:none;
			clear:both;
		}
	}
 
	/* para 480px o menos */
	@media screen and (max-width:480px) {
		aside {
			/*display:none;*/
		}
		nav, section {
			font-size:13px;
		}
		section {
			width:94%;
		}
		nav ul {
			float:left;
			clear:none;
			width:50%;
		}
		nav ul li {
			float:none;
		}
	}
	.container aside p {
	color: #FFF;
}
    </style>.size10 {
	font-size: 10px;
}