/* reseteo universal */

*{
	border: 0;
	margin: 0;
	padding: 0;
}
/*
article,figcaption,figure,footer,header,hgroup,nav,section{
	display: block;
}


body {
	background: #E9E6F4;

	
	color: #blue;
	font-family: "Chalet", Helvetica, Verdana;
	font-size: 1em;
}


audio, iframe, img, video,aside#banner{
		max-width: 100%;
}


/* afecta a partir de aqui */

   /* nose   */

      /*nose */

          

*/

.redonda{
    /*
	border-radius: 2.5em;  /* 1em = 16px, si divido estoe la mitad del tamaño de imgaen 50px/16px=3.125
	box-shadow:5px 5px 10px rgba(255,255,255,.5); /* opacidad 
    */
}
.redonda1{
    /*
	border-radius: 1.5em;  /* 1em = 16px, si divido estoe la mitad del tamaño de imgaen 50px/16px=3.125
	box-shadow:5px 5px 10px rgba(255,255,255,.5); /* opacidad 
    */
}


footer{
   /*
	background: #E9E6F4;
	
	border-radius: 0 0 0.5em 0.5em; 

	 margin: 0 auto;
	max-width: 100%;
	vertical-align: middle;
	/* lo pasamos a media queri este parametro
	text-align: center;
	text-align: center;
*/
}

/* para maximo
main{
    margin-top: 100px;
}
*/
/* el hover se puede aplicar a cualquiera no es exclusivo de a */

/* M E D I A S    C U E R Y S */

@media screen and (min-width: 1081px){   
    section#aplicacion{
         display: block;
    }
    
  /*  main{
        display: none;
    }
    */

a{
	color: #57ABB8;
	text-decoration: none;
}
    
main{
    margin-top: 100px;
}
nav ul{
	list-style: none;
}

nav li{
	
	float: left;
	
	margin-left: 9px; 
    margin-right: 9px;
	padding: 0.1em;
	vertical-align: middle;
	
}

nav img {
	/* PONE BORDER A LA IMAGEN 
	border: 5px solid #ccc;
	*/
	max-width: 100%;
	 border-radius: 0.5em 0.5em 0.5em 0.5em;

}

    nav ul li span {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  padding-bottom: 20px;
  text-align:center;
  color:#362780;

}
    
nav ul li span:hover {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  text-align:center;
  color:#F60;

}
    
nav img:hover {
    
/* A G R A N D A  L A  I M A G E N */
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.5);
	
}
    
.fade{
	opacity: 1;
	filter:alpha(opacity=10);
	-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;
    
}

.fade:hover{
	/*
	opacity: 0.7;
    */
	
	filter:alpha(opacity=7);
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
    
}    

}
  

@media screen and (max-width: 1080px){
        /*
        section#aplicacion{
         display: none;
    }
	*/

	   section#aplicacion{
        display:block;
    }
a{
	color: #57ABB8;
	text-decoration: none;
}
    
main{
    margin-top: 100px;
}
nav ul{
	list-style: none;
}

nav li{
	
	float: left;
	
	margin-left: 9px; 
    margin-right: 9px;
	padding: 0.1em;
	vertical-align: middle;
	
}

nav img {
	/* PONE BORDER A LA IMAGEN 
	border: 5px solid #ccc;
	*/
	max-width: 100%;
	 border-radius: 0.5em 0.5em 0.5em 0.5em;

}

    nav ul li span {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  padding-bottom: 20px;
  text-align:center;
  color:#362780;

}
    
nav ul li span:hover {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  text-align:center;
  color:#F60;

}
    
nav img:hover {
    
/* A G R A N D A  L A  I M A G E N */
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.5);
	
}
    
.fade{
	opacity: 1;
	filter:alpha(opacity=10);
	-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;
    
}

.fade:hover{
	/*
	opacity: 0.7;
    */
	
	filter:alpha(opacity=7);
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
    
}  

   /*main{display: none;}*/
}

@media screen and (max-width: 800px){
      section#aplicacion{
        display:block;
    }
a{
	color: #57ABB8;
	text-decoration: none;
}
    
main{
    margin-top: 100px;
}
nav ul{
	list-style: none;
}

nav li{
	
	float: left;
	
	margin-left: 9px; 
    margin-right: 9px;
	padding: 0.1em;
	vertical-align: middle;
	
}

nav img {
	/* PONE BORDER A LA IMAGEN 
	border: 5px solid #ccc;
	*/
	max-width: 100%;
	 border-radius: 0.5em 0.5em 0.5em 0.5em;

}

    nav ul li span {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  padding-bottom: 20px;
  text-align:center;
  color:#362780;

}
    
nav ul li span:hover {
	
  font-family:Arial, Helvetica, sans-serif;
  display:block;
  font-size:12px;
  font-weight: bold;
  text-align:center;
  color:#F60;

}
    
nav img:hover {
    
/* A G R A N D A  L A  I M A G E N */
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.5);
	
}
    
.fade{
	opacity: 1;
	filter:alpha(opacity=10);
	-ms-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-webkit-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;
    
}

.fade:hover{
	/*
	opacity: 0.7;
    */
	
	filter:alpha(opacity=7);
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
    
}    

}


@media screen and (max-width:600px){
	
	
}































