* { 
	margin: 0; 
	padding: 0; 
}

#page-wrap {
	margin: 50px;
}
p {
	margin: 20px 0; 
}

	/* 
	Generic Styling, for Desktops/Laptops 
	*/
	table { 
		width: 100%; 
		border-collapse: collapse; 
		font-size: 12px;
	}
	tr{ 
		background: #fff; 
	}
	/* Zebra striping */
	tr:nth-of-type(odd) { 
		background: #009383; 
	}
	th { 
		background: #009383; 
		color: white; 
		font-weight: bold; 
	}

	td, th { 
		padding: 6px; 
		border: 1px solid #ccc; 
	}

	tr:hover{
		background: rgba(100,100,100,.5);
		cursor: pointer;
	}
	label{		
		display: block;
	}

@media 
	only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px)  {


		#page-wrap {			
			margin: 10px;
			margin-top: 50px;
		}
		
		tr { border: 1px solid #ccc; }
		
		td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee; 
			position: relative;
			padding-left: 50%; 
		}
		
		/*
		Label the data

		*/
		#tabla-sedes td:nth-of-type(1):before { content: "Nombre sede: "; }
		#tabla-sedes td:nth-of-type(2):before { content: "Dirección: "; }
		#tabla-sedes td:nth-of-type(3):before { content: "Delegación/Municipio: "; }
		#tabla-sedes td:nth-of-type(4):before { content: "Estado: "; }
		#tabla-sedes td:nth-of-type(5):before { content: "Teléfono: "; }
		#tabla-sedes td:nth-of-type(6):before { content: "Nombre del Contacto: "; }
		#tabla-sedes td:nth-of-type(7):before { content: "Datos sede: "; }	

		/*
		Label the data para instructores

		*/
		#tabla-instructor td:nth-of-type(1):before { content: "Nombre instructor: "; }
		#tabla-instructor td:nth-of-type(2):before { content: "Apellido paterno: "; }
		#tabla-instructor td:nth-of-type(3):before { content: "Apellido materno: "; }
		#tabla-instructor td:nth-of-type(4):before { content: "Correo electrónico: "; }

		/*
		Label the data para temario

		*/
		#tabla-temario td:nth-of-type(1):before { content: "Nombre temario: "; }
		#tabla-temario td:nth-of-type(2):before { content: "Fecha creación: "; }
		#tabla-temario td:nth-of-type(3):before { content: "Numero Versión: "; }
			
	}
	
