*{
	margin:0;
	padding:0;

}

#introduccion{
	background: rgb(0,0,0,0.5);
	text-shadow: 0px 1px 0px darkorange;
	float: right;
	color: white;
	font-weight: bolder;
	font-size: 1.9em;
	text-align: center;
	padding: 74px;
	width: 50%;
	height: 100%;
	
	
}
.primero{
	background: url(images/repG.jpg);
	width: 100%;
	height: 500px;
	 background-size: 100% 100%;
	background-repeat: no-repeat;
	font-size: 16px;
	color: black;
	text-align: justify;
	display: inline-flex;	

}
.primero p img{
	width: 100%;
    height: 200px;
}
.p_uno{
	margin: 3%;
	width: 30%;
	box-shadow: 0px 0px 20px black;
	 height: max-content;;
	background: rgb(255,255,255,0.7);
	padding: 10px;
	

}


.p_dos {
	box-shadow: 0px 0px 20px black;
	margin: 3%;
	width: 30%;
	height: max-content;;
	background: rgb(255,255,255,0.7);
	padding: 10px;
	

}
.p_tres{
	margin: 3%;
	width: 30%;
	 height: max-content;;
	background: rgb(255,255,255,0.7);
	padding: 10px;
	box-shadow: 0px 0px 20px black;
}

#block{
	display: none;
}


.contenedor_ser{
	
	margin-top: 6%;
	margin-left: 5%;
	width: 90%;
	background: rgb(0,0,0,0.5);

	

}

@media screen and (max-width:390px)  {
	.contenedor_ser{
		margin-top: 22%;
	}
	.contenedor_ser img{
		width: 200px;
		margin-left: 20%;

	}
	#introduccion{
		width: 100%;
		font-size: 13px;
		padding: 5px;
	}
	.primero{
		font-size: 14px;
		display: inline-block;
		height: auto;
	}
	.p_uno{
		width: 90%;
	}
	.p_dos{
		width:90%;
	}
	.p_tres{
		width: 90%;
	}
	.primero p img{

		width: 90%;
		height: 100px;
		padding: 0;
		margin: 0;
	}
}

@media screen and (max-width:480px) and (min-width: 391px){
	.contenedor_ser{
		margin-top: 22%;
	}
	.contenedor_ser img{
		width: 200px;
		margin-left: 20%;

	}
	#introduccion{
		width: 100%;
		font-size: 13px;
		padding: 5px;
	}
	.primero{
		font-size: 14px;
		display: inline-block;
		height: auto;
	}
	.p_uno{
		width: 90%;
	}
	.p_dos{
		width:90%;
	}
	.p_tres{
		width: 90%;
	}
	.primero p img{
		
		width: 90%;
		height: 100px;
		padding: 0;
		margin: 0;
	}
}
@media screen and (max-width:760px) and (min-width: 481px){
	.contenedor_ser{
		margin-top: 17%;
	}
	.contenedor_ser img{
		width: 200px;
		margin-left: 20%;

	}
	#introduccion{
		width: 100%;
		font-size: 17px;
		padding: 5px;
	}
	.primero{
		font-size: 14px;
		display: inline-block;
		height: auto;
	}
	.p_uno{
		width: 90%;
	}
	.p_dos{
		width:90%;
	}
	.p_tres{
		width: 90%;
	}
	.primero p img{
		
		width: 70%;
		height: 200px;
		padding: 0;
		margin-left: 10%;
	}
	
}
@media screen and (max-width: 1024px) and (min-width: 761px){
	.contenedor_ser{
		margin-top: 10%;
	}
	.contenedor_ser img{
		width: 200px;
		margin-left: 2%;

	}
	#introduccion{
		width: 60%;
		font-size: 17px;
		padding: 30px;
		height: 100%;
	}
	.primero{
		
		height: auto;
	}
	
}
@media screen and (max-width: 1200px) and (min-width: 1025px){
	.contenedor_ser{
		margin-top: 10%;
	}
	.contenedor_ser img{
		width: 200px;
		margin-left: 2%;

	}
	#introduccion{
		width: 60%;
		font-size: 20px;
		padding: 30px;
		height: 100%;
	}
	.primero{
		
		height: auto;
	}
}