h1,h2,h3,h4,h5,h6{ margin: 0; font-family: sans-serif; }
body { margin: 1em;}
p{ font-family: sans-serif; }
a{ text-decoration: none; color: black; }

/*MENU + LOGO + ICONO DE MENU DESPLEGABLE*/
	.header-principal{ width: 100%; }
	.nav-principal{
		width: 100%;
		position: relative;
		padding-bottom: 0.5em;
		background-color: white;
	}
	.contenedor{
		display: flex;
		width: 100%;
		flex-wrap: wrap;
		margin: auto;
		align-items: center;
		justify-content: space-between;
		text-align: center;
		align-items: flex-start;
	}
	.img-portada{
		width: 50%;
		margin-left: -80px;
		margin-top: 5px;
	}
	/*.logo{
		font-size: 1.75em;
		font-weight: normal;
		font-family: sans-serif;
		margin-top: 0.1em;
	}*/
	.logo-link{
		text-decoration: none;
		color: black;
	}
	.menu{
		position: absolute;
		top: 40px;
		width: 100%;
		left: 0;
		right: -10px;
		background-color: white;
		padding: 0;
		margin: 0;
		list-style: none;
		text-align: left;
		font-family: sans-serif;
		height: 0; /*altura*/
		overflow: hidden;
		transition: height .3s linear;
		z-index: 999;
	}
	.menu:hover {
	    color: black;
	}
	.menu-item{  }
	.menu-link{
	    display: block;
	    padding: 15px;
	    color: black;
	    text-decoration: none;
	}
	.menu-link:hover{ background-color: white; }
	.icon-menu{
		display: block;
		width: 30px;
		height: 30px;
		color: black;
		position: absolute;
		right: 20px;
		font-size: 2em;
		line-height: 40px;
		text-align: center;
		cursor: pointer;
	}
	.mostrar{ height: 196px; }

/* PORTADA */
	.portada-home{
		width: 100%;
		padding-top: 0.5em;
	}
	.background-portada-home{
		background-image: url("../img/portada.jpg");
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-size: 95%;
		background-position: 15% 12%;
		top: 20px;
		width: 100%;
		height: 230px;
	}
	.textosb-portada{
		font-size: 1.3em;
		margin: 0.5em;
		margin-left: 1em;
		margin-top: 0.5em;
		color: white;
	}
	.button-portada{
		padding: 10px;
		margin: 5px;
		margin-left: 0.8em;
		width: 190px;
		font-size: 1em;
		border: 1px solid #cc9900;
		border-radius: 15px;
		opacity: ;
		background-color: #cc9900;
	}
	.button-sin-margin{
		margin-left: 0;
	}
	.div0{ width: 0; }

/* BANNER DE TEXTO + CAJAS DE SERVICIOS */
	.div-servicios{
		align-content: center;
		text-align: center;
		width: 100%;
		padding-top: 2em;
	}
	.title-servicio{
		padding-left: 1em;
		padding-right: 1em;
		text-align: center;
	}
	.p-servicio{
		padding-left: 1em;
		padding-right:  1em;
	}
	.contenedor-servicios{ width: 100%; }
	.div100-33{
		width: 100%;
		margin-top: 0;
		align-content: center;
		text-align: center;
		margin-top:20px;
	}
	.btn-serv{
		width: 100%; 
		align-content: center;
		text-align: center;
		font-size: 4.5em;
	}

/* Banner texto */
	.div-banner{
		align-content: center;
		text-align: center;
		width: 100%;
		padding: 3em;
		padding-right: 0;
		padding-left: 0;
		margin-top: 1em;
	}
	.background-div-banner{
	/*  background-image: url("../img/div1.jpg");
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-position: center; */
		background-color: lightgrey;
		width: 100%;
		height: auto;
	}
	.title-banner{
		padding-left: 1em;
		padding-right: 1em;
		text-align: center;
	}
	.p-banner{
		padding-left: 1em;
		padding-right:  1em;
	}

/* Nuestro equipo */
	.div-servicios{
		align-content: center;
		text-align: center;
		width: 100%;
		padding-top: 3em;
		color: black;
	}
	.contenedor-equipo{ width: 100%; }
	.img-nosotros{
		width: 12em;
		height: auto;
		border-radius: 50% 50%;
	}

/* boton redirección acerca*/
	.div-button-acerca{
		width: 100%;
		align-content: center;
		text-align: center;
		width: 100%;
		padding: 0.5em;
		padding-right: 0;
		padding-left: 0;
		margin-top: 1em;
	}
	.button-acerca{
		padding: 5px;
		margin: 5px;
		margin-left: 0.8em;
		width: 260px;
		font-size: 1.3em;
		border-radius: 5px;
		opacity: 90%;
	}

/* ¿Como podemos ayudarte? */

	.div-ayudarte{
		display: flex;
		text-align: center;
		padding: 0.5em;
		margin-top: 0.5em;
		position: relative;
	}
	.div15{
		width: 10%;
	}
	.text-justificado{
		text-align: left;
		padding: 0.5em;
	}

/* Div - Quienes han confiado en nosotros */
	.div-nosotros{
		align-content: center;
		text-align: center;
		width: 100%;
		padding-top: 3em;
		color: white;
	}
	.background-div-nosotros{
		background-color: black;
	}
	.div100-20{
		width: 100%; 
		/*background-color: gray;
		border-radius: 7px;
		margin: 5px;
	*/	margin-top: 0;
		align-content: center;
		text-align: center;
	}

/* BOTON FLOTANTE DE WHATSAPP*/
	.btn-whatsapp {
	    display:block;
	    width:0.6em;
	    height:0.6em;
	    color: #fff;
	    position: fixed;
	    right:0.5em;
	    bottom:1em;
	    border-radius:50%;
	    line-height:;
	    text-align:center;
	    z-index:999;
	    font-size: 4em;
	}


.background-grey{
	background-color: lightgrey;
}
.div-margin{
	align-content: center;
	text-align: center;
	width: 100%;
	padding: 0.5em;
	padding-right: 0;
	padding-left: 0;
	margin-top: 1em;
}
.div-padding{
	align-content: center;
	text-align: center;
	width: 100%;
	padding: 3em;
	padding-right: 0;
	padding-left: 0;
	margin-top: 1em;
}


/* PIE DE PAGINA */ 
	.piedepagina{
		width: 100%;
		/*background-color: rgb(240, 235, 243);*/
		margin-top: 1em;
	}
	.columna50-100{
		width: 100%;
		text-align: center;
	}
	.btn-pie{
		width: 100%; 
		align-content: center;
		text-align: center;
		font-size: 1.5em;
		padding-top: 0.5em;
	}

/* COPY */
	.copy{
		margin-top: 2.5em;
	}
	.p-copy{
		text-align: center;
	}


/* RESPONSIVE */
@media  screen and (min-width: 768px) {
	.background-portada-home{
		background-size: 100%;
		background-position: 40% 10%;
		width: 100%;
		height: 400px;
		padding: -10px;
	}
	.textosb-portada{
		font-size: 1.8em;
		color: white;
		margin-top: 2em;
	}
	.div-ayudarte{
		padding: 2em;
	}
	.text-justificado{
		padding: 1em;
	}
	.contenedor-equipo{
		display: flex; 
	}
	.contenedor-servicios{
		display: flex;
	}
	.piedepagina{
		display: flex;
		padding: 0;
	}
	.img-portada{
		width: 60%;
		margin-left: -50px;
		margin-top: 5px;
	}
}

@media  screen and (min-width: 1023px) {
	.logo{
		font-size: 2.2em;
		padding-left: 42px;
	}
	.icon-menu{
		display: none;
	}
	.menu{
		position: static;
		display: flex; 
		height: auto;
		width: auto;
	}
	.background-portada-home{
		background-position: 50% 10%;
		width: 100%;
		height: 530px;
		padding: -10px;
	}
	.sb-portada{
		font-size: 1.5em;
	}
	.textosb-portada{
		font-size: 2em;
		color: white;
		padding-top: 3.3em;
		margin-left: 3em;
	}
	.button-portada{
		font-size: 1.5em;
		width: 300px;
	}
	.button-portada-margin{
		margin-left: 4em;
	}
	.title-contenido{
		font-size: 35px;
		padding-left: 2em;
		padding-right: 2em;
	}
	.p-contenido{
		font-size: 1.2em;
		padding-left: 2em;
		padding-right: 2em;
	}
	.div-servicios{
		padding-top: 4em;
	}
	.contenedor-servicios{
		display: flex;
	}
	.contenedor-equipo{
		display: flex; 
	}
	.div100-33{
		width: 33%;
		padding: 2em;
	}
	.btn-pie{
		font-size: 2em;
	}
	.piedepagina{
		display: flex;
		padding: 0;
	}
	.columna50-100{
		width: 50%;
		text-align: center;
	}
	.div100-20{
		width: 20%; 
		padding: 2em;
	}
	.title-equipo{
		font-size: 35px;
		padding-left: 2em;
		padding-right: 2em;
		color: black;
	}
	.div-ayudarte{
		text-align: center;
		padding: 1em;
		margin-top: 0.5em;
	}
	.div15{
		width: 40%;
	}
	.text-justificado{
		text-align: left;
		padding: 1.2em;
	}
	.text-ayudarte{
		font-size: 1.2em;
	}
}