/* CSS Document */
html { 
  background: url("http://especimen.com.mx/img/e/1/craneos.jpg") no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.centrado{
  margin-left: auto;
  margin-right: auto;
}

.custom {
	font-family: Arial;
	color: white;
	font-size:16px;
}

.encabezado {
	font-family: Arial;
	color: white;
	font-size:20px;
}

.url {
	font-family: Arial;
	color: red;
	font-size:16px;
}

img {
  max-width: 100%;
  height: auto;
}

.container {
		width:996px;
		margin:0px auto;
		font-size:1em;
		margin-top:10px;

	}
	section,aside {
		padding: 10px;
		background:#000;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
	}
	section {
		
		width: 80%;
		margin-left: auto;
        margin-right: auto;
	}
	aside {
		float: right;
		width: 25%;
	}
	
	.centrar {
   display: flex;
   justify-content: center;
   align-items: center;
}
	nav {
		overflow: hidden;
		
	}
	nav ul {
		list-style-type:none;
		float:left;
		padding:0px;

		
	}
	nav ul li {
		float:left;
		padding:3px 10px;
		margin:2px;
		background:#000;
		-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;border-radius:5px;
	}
	footer {
		margin:20px;
		text-align:center;
		clear:both;
	}

 .enlace {
  display:inline;
  border:0;
  padding:0;
  margin:0;
  text-decoration:underline;
  background:none;
  color:#FF0000;
  font-family: arial, sans-serif;
  font-size: 1.5em;
  line-height:1em;
}

.enlace:hover {
  text-decoration:none;
  color:FF0000;
  cursor:pointer;
}
	/* para 980px o menos */
	@media screen and (max-width:980px) {
			
		.container {
			width:98%;
		}
		section {
			width:86%;
		}
		i{
 list-style: none;
 }
 nav {
 text-align: center;
 }
 nav ul {
 display: inline-block;
 margin: 0;
 padding: 0;
 /* Para IE 7*/
 zoom:1;
 *display: inline;
 }
 nav li {
 float: left;
 padding: 2px 5px;
 border: 1px solid black;
 background-color:#CCC;
 margin: 50px;
 border-radius: 5px;
 }
 nav li a{
 text-decoration: none;
 font-family: century gothic;
 color: #000;
 }
 nav li a:hover{
 color: #fff;
 }
		
	}
	
	/* para 700px o menos */
	@media screen and (max-width:700px) {		
		aside,section {
			float:none;
			width:96%;
		}
		nav, section {
			font-size:1.2em;
			margin-top:5px;
		}
		aside {
			margin-top:20px;
		}
		nav ul {
			float:none;
			clear:both;
		}
		
		i{
 list-style: none;
 }
 nav {
 text-align: center;
 }
 nav ul {
 display: inline-block;
 margin: 0;
 padding: 0;
 /* Para IE 7*/
 zoom:1;
 *display: inline;
 }
 nav li {
 float: left;
 padding: 2px 5px;
 border: 1px solid black;
 background-color:#CCC;
 margin: 50px;
 border-radius: 5px;
 }
 nav li a{
 text-decoration: none;
 font-family: century gothic;
 color: #000;
 }
 nav li a:hover{
 color: #fff;
 }
		
	}
 
	/* para 480px o menos */
	@media screen and (max-width:480px) {
		.custom {
	font-family: Arial;
	color: white;
	font-size:20px;
}

.url {
	font-family: Arial;
	color: red;
	font-size:18px;
}
			aside {
			display:none;
		}
		nav, section {
			font-size:1.5em;
		}
		section {
			width:94%;
		}
		nav ul {
	float: left;
	clear: both;
	width: 50%;
		}
		nav ul li {
			float:none;
		}
	}
