/*  POSITION        
	- static
	- relative
	- absolute
	- fixed
Todos los elementos HTML tienen por defecto asignada la posicion "Static" */

body {
	font-family: arial, helvetica, sans-serif;
	padding-bottom: 1200px;
}

#padre {
	width: 600px;
	height: 500px;
	border: 4px solid #0CC;
	margin: 20px auto;
	padding: 20px;
	position: relative; /* los elementos hijo dependen de la posicion del padre para tomar las coordenadas 0,0 */
}

#hijo {
	text-align: center;
	padding: 50px;
	background: rgba(128,128,128,0.7);
	font-size: 2em;
	position: absolute; /*absolute, relative (si el padre es relative las coordenandas hijo parten del 0,0 del padre)*/
	top: 150px;
	left:150px;
}

#fija {
	text-align: center;
	padding: 50px;
	background: rgba(220,20,128,0.5);
	font-size: 2em;
	position: fixed; /*posicion fija, no se mueve*/
	top: 50px;
	right: 350;
}