/* CSS Document */
body{
margin:0px;
}

header{
background-color:#6C6;
width:100%;
min-height:55px;
position:fixed;
z-index:1000;
top:0;	
opacity:0.9;
box-shadow:0px 4px 3px rgba(0,0,0,.5);
}

#titu{
width:180px;
min-height:1px;
float:left;
padding:18px 0 0 100px;
font-family:"Arial Black", Gadget, sans-serif;
font-size:24px;
color:#FFF;
}

#horizontal{
width:480px;
min-height:1px;
float:right;
}

#esp{
width:100%;
height:70px;
/*box-sizing:border-box;*/
}

#slider{
min-height:50px;
}

#cuerpo{

max-width:1100px;
min-height:500px;
margin:0 auto;
overflow:hidden;
}

#izq{
width:750px;
min-height:500px;
float:left;
padding:0 0 10px 0;
}

#conte{
background-color:#FFF;
width:730px;
min-height:100px;
border:solid 3px #00FF00;
margin:10px 0 0 8px;
animation:4s aniconte 1;
transition: 1.5s ease;
-moz-transition: 1.5s ease; /* Firefox */
-webkit-transition: 1.5s ease; /* Chrome - Safari */
-o-transition: 1.5s ease; /* Opera */
}

@keyframes aniconte{
	0%{
		opacity:0;
		}
	}
#conte:hover{/*Cuando pongo el puntero encima*/
      background-color:#E1FFE9;/*cambia la caja al poner el puntero*/ 
	  transform : scale(1.02);
		-moz-transform : scale(1.02); /* Firefox */
		-webkit-transform : scale(1.02); /* Chrome - Safari */
		-o-transform : scale(1.02); /* Opera */
		-ms-transform : scale(1.02); /* IE9 */
}



#tituconte, #tituconte2{
width:710px;
min-height:20px;
margin:5px 0 5px 10px;
text-align:left;
font-size:24px;
overflow:hidden;
}

#fotoconte{
width:50%;
min-height:200px;
float:left;
box-sizing:border-box;
text-align:justify;
box-sizing:border-box;
}

.classdescripconte{
padding:0 10px 10px 10px;
}


#dere{
width:350px;
min-height:500px;
margin:10px 0 0 0;
float:left;
}

#catego{
width:90%;
min-height:10px;
margin:0 auto;
font-size:24px;
color:#060;
}

#vertical{
width:90%;
min-height:100px;
margin:0 auto;
padding:0px;
box-sizing:border-box;
}

#vertical ul{
   list-style:none; /*Elimina las Viñetas PUNTOS*/
   padding:0px;
   
}

#vertical  a{
  font-family:Arial, Helvetica, sans-serif;/*cambiar el tipo de letra*/
  font-size:14px;/*Cambiar tipo de letra*/
  text-decoration:none;/*Elimina la decoracion de Texto SUBRAYADO*/
  background-color:#DFFFDF; /*Color en el fondo de la Letra*/
  color:#0F0;/*Cambiar el color de Letra*/
  display:block;/*convertimos en caja */
  width:100%;
  margin:4px 0 0 0; /*Darle espacio a las cajas*/
  padding:8px;/*Darle mas espacio a las letras*/
  border-radius:6px;/*Curbear las esquinas de la caja*/
  box-sizing:border-box;
  animation:4s entradamenu 1;
}

@keyframes entradamenu{
	0%{
		opacity:0;/*transparencia al principio*/
	  }
	}

#vertical a:hover{/*Cuando pongo el puntero encima*/
      background:#390;/*cambia la caja al poner el puntero*/ 
	  color:#FFF;/*cambia el color de texto al poner el puntero*/
}

#catego b:hover{/*Cuando pongo el puntero encima*/
      color:#0F0;/*cambia el color de texto al poner el puntero*/
}

#vertical a:hover img{/*Solo para que la imagen rote*/
  animation:1s rotacion 1;
}

@keyframes rotacion{
	0%{
		transform:rotate(270deg);/*DEG es para grados*/
		}
	}

footer{
background-color:#333;
max-width:100%;
min-height:120px;
padding:30px 0 0 0;
text-align:center;
font-size:16px;
color:#FFF;
}

/*PANTALLA TABLE*/
@media screen and (max-width:1117px)
{
#cuerpo{
width:100%;
min-height:500px;
box-sizing:border-box;
}	

#izq{
width:90%;
min-height:200px;
float:inherit;
margin:0 auto;
box-sizing:border-box;
}

#conte{
background-color:#FFF;
width:100%;
min-height:400px;
border:solid 3px #00FF00;
margin:10px 0 0 0;
box-sizing:border-box;
}

#tituconte{
width:100%;
min-height:20px;
margin:0px;
text-align:left;
font-size:24px;
box-sizing:border-box;
}

#tituconte2{
width:100%;
min-height:20px;
margin:0 auto;
padding:0px;
text-align:left;
font-size:24px;
box-sizing:border-box;
}

#fotoconte img{
width:100%;
height:auto;
}

#dere{
width:90%;
min-height:200px;
float:inherit;
margin:0 auto;
box-sizing:border-box;
}

#catego{
margin:10px 0 0 0;
}

#vertical{
width:100%;
margin:0px;
}
	
}
/*PANTALLA TABLE*/

/*PANTALLA DE CELULAR*/
@media screen and (max-width:785px)
{
#titu{
width:100%;
min-height:1px;
padding:18px 0 0 0;
font-family:"Arial Black", Gadget, sans-serif;
font-size:24px;
color:#FFF;
text-align:center;
}

#horizontal{
width:100%;
min-height:1px;
}

#esp{
width:100%;
height:83px;
/*box-sizing:border-box;*/
}

#cuerpo{
box-sizing:border-box;
}

#izq{
width:95%;
min-height:200px;
margin:0 auto;
}

#conte{
background-color:#FFF;
width:100%;
min-height:200px;
border:solid 3px #00FF00;
box-sizing:border-box;
}

#tituconte{
width:100%;
min-height:20px;
margin:0px;
text-align:left;
font-size:24px;
padding:5px 0 5px 10px;
box-sizing:border-box;
}

#tituconte2{
width:100%;
min-height:20px;
margin:0px;
padding:0px;
text-align:left;
font-size:24px;
box-sizing:border-box;
}

#fotoconte{
width:100%;
min-height:100px;
box-sizing:border-box;
margin:0 auto;
box-sizing:border-box;
}

#fotoconte img{
width:100%;
height:auto;
}

#dere{
width:100%;
}



}
/*PANTALLA DE CELULAR*/