@charset "utf-8";
/* CSS Document */
body {
	
	background:linear-gradient(#E5E7E9, #FFAE5E);
	max-width:1000px;
	margin:auto;}
p {
	font-size:100%;
	font-family:Arial, Helvetica, sans-serif;
	color:#333;}
.productos { font-size:100%;
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	margin:auto;
	list-style:none;
	padding:20px;
	width:90%;
	box-sizing:border-box;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
	}
#tb1 {
	width:100%;
	border-bottom:1px solid #FC9;
	}
table #td2 {
	width:100%;
	}

#tb1 img{
	width:100%;
}
table img {
	width: 100%;}
header{
	width:100%;
	background:#666;}
#anexos {
	background:#999;
    color:#FFF;
	font-family:"Courier New", Courier, monospace;
	padding:5px;
	font-size:90%;
	text-align:center;
	}
#anexos a {
	text-decoration:none;
    color:#CFF;
	 }
#btn-menu {
	display:none;}
header label{
	display:none;
	width:30px;
	height:30px;
	padding:10px;
	border-right:1px solid #fff;}
label img {
		width:100%;}
header label:hover {
	cursor:pointer;
	background:rgba(0,0,0,0.3);}
.menu ul {
	margin:0;
	list-style:none;
	padding:0;
	display:flex;}
.menu li {
	flex-grow:1;
	text-align:center;
	border-right:1px solid #FC9;}	
.menu li:hover {
	background:rgba(0,0,0,0.3);}
.menu li a{
	font-family:"Lucida Console", Monaco, monospace;
	display:block;
	padding:20px 15px;
	color:#F93;
	text-decoration:none;}
@media (max-width:650px){
	p {
	font-size:70%;}
	h3 {
		font-size:70%;}

	header label{
		display:block;
		height:20px;
		width:20px;}
	.menu {
		position:absolute;
		background:#666;
		width:50%;
		margin-left:-50%;
		transition:all 0.5s;}
	.menu ul {
			flex-direction:column;}
	.menu li {
		border-top:1px solid #FC9;}
	#btn-menu:checked ~ .menu{
		margin:0;}
	#anexos {
	padding:2.5px;
	font-size:70%;
	}
	}
@media (max-width:480px){
	p {
	font-size:70%;}
	h3 {
		font-size:60%;}
	#anexos {
	padding:2px;
	font-size:55%;
	}
	header label{
		display:block;
		height:15px;
		width:15px;}
	.productos { font-size:70%;
	}
	.menu {
		position:absolute;
		background:#666;
		width:50%;
		margin-left:-50%;
		transition:all 0.5s;}
	.menu ul {
			flex-direction:column;}
	.menu li {
		border-top:1px solid #FC9;}
	#btn-menu:checked ~ .menu{
		margin:0;}
	.menu li a{
	
	padding:10px 15px;
	color:#F93;
	text-decoration:none;}
	#pie  {
		font-size:70%;}}

.slider {
	width:100%;
	overflow:hidden;
	border:none;
	
	}

.slider ul{
	margin:0;
	list-style:none;
	padding:0;
	display:flex;
	width:300%;
	
	animation:cambio 8s infinite alternate;
	}
.slider li {
	
	list-style:none;
	width:100%;
	}
.slider img{
	width:100%;
	}
@keyframes cambio {
	0% {margin-left:0;}
	30% {margin-left:0;}
	
	35% {margin-left:-100%;}
	65% {margin-left:-100%;}
	
	70% {margin-left:-200%;}
	100% {margin-left:-200%;}
}
#h3 {
	
	font-size:100%;
	width:100%;
	}
	
#tb3
 {
	width:100%;
	}	
table #td1 {
	width:25%;}
table #td11 {
	width:75%;
	background:#DFDFDF;}
	
#whap  {
	width:100%;
	}
#whap img{
	alignment-adjust:central;
	width:35%;
	animation:escalar 1.5s infinite alternate;}
#gif {
	width:100%;}
#gif img {
	alignment-adjust:central;
	width:97%;
	animation:escalar 1.5s infinite alternate;}

#tb33 {
	width:75%;}
#tb4 {
	width:90%;}	
	
h4 {color:#408080;}

table #ri {
	width:90%;
	animation:escalar 1.5s infinite alternate;
	}

@keyframes escalar{
	to{
		transform:scale(1);}
	from {transform:scale(1.05);}}
	
#tbtexto	{
	width:80%;}
#ico1{
	width:25%;}
#ico2{
	width:25%;}
#ico3{
	width:25%;}
#ico4{
	width:25%;}

	
	
#pie {
    color:#CC9;}
#pie a{
    color:#CCC;
	text-decoration:none;}