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; }

.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{
	width: 100%;
	padding-top: 0.5em;
}
.background-portada{
	background-image: url("../img/Portada nosotros-03.jpg");
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: 95%;
	background-position: 15% 12%;
	top: 40px;
	width: 400px;
	height: 200px;
}
.div-portada{
	width: 100%;
	padding-top: 2em;
}
.sb-portada{
	font-size: 1.8em;
}
.textosb-portada{
	font-size: 1.5em;
	margin: 0.5em;
	margin-left: 1em;
	margin-top: 1em;
	color: white;
}
.button-portada{
	padding: 10px;
	margin: 5px;
	margin-left: 0.8em;
	width: 260px;
	font-size: 1.3em;
	border: 1px solid #cc9900;
	border-radius: 15px;
	opacity: ;
	background-color: #cc9900;
}
.button-sin-margin{
	margin-left: 0;
}
.div0{ width: 0; }
.div-preguntas{
	align-content: center;
	text-align: center;
	width: 100%;
	margin-top: 2.5em;
}
/*-------CONTACTO + FORMULARIO---------*/
.div-contacto-formulario{
	padding: 1em;
}
.text-contacto{
	font-size: 1.5em;
	text-align: center;
}
.div-contact{
	position: relative;
}
.div-formulario {
    display: flex;
    flex:100%;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: 1em;
}
.formulario {
    width: 100%;
    flex-wrap: wrap;
    margin: auto;
    align-items: right;
    justify-content: space-between;
    align-items: flex-start;
}
.form-consulta{
    height: auto;
    width: 100%;
    font-family: 'Source Sans Pro', sans-serif; 
    color: black; 
    font-size: 1em;
}
.campo-form{
        width:100%; 
        height:auto; 
        margin:2px 0 6px; 
        padding:0.5em; 
        box-sizing: border-box; 
        border-radius:0.1em; 
        border:0; 
        font-family: 'Source Sans Pro', 
        sans-serif; 
        font-size: 1em;
        background-color: #cc9900; 
        opacity: 55%;
}
label span {color: #f00;}
textarea {min-height: 150px!important;}
.btn-form {
        display: inline-block; 
        border:0; 
        background: white; 
        width: 100%;
        height: 100%; 
        line-height: 1em; 
        padding: 0.7em;
        border-radius: 1em;
        border: 2px solid #cc9900;
        color: black; 
        text-decoration: none; 
        text-transform: uppercase; 
        letter-spacing: ;
        font-size: 1.2em;
        margin: 0.5em;
        margin-left: 0;
}
.btn-form:hover {background: lightgray}
.text-form{
    font-size: 1.2em;
}

/* 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;
}


.btn-pie-redes{
	width: 100%; 
	font-size: 3em;
	padding-top: 0.5em;
}
.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;
}
/* COPY */
.copy{
	margin-top: 1em;
}
.p-copy{
	text-align: center;
}

.div-margin{
	align-content: center;
	text-align: center;
	width: 100%;
	padding: 0.5em;
	padding-right: 0;
	padding-left: 0;
	margin-top: 1em;
}
.title-banner{
	padding-left: 1em;
	padding-right: 1em;
	text-align: center;
}


@media  screen and (min-width: 768px) {
	.background-portada{
		background-size: 100%;
		background-position: 10% 10%;
		width: 100%;
		height: 400px;
	}
	.textosb-portada{
		font-size: 1.8em;
		color: white;
		padding-top: 2em;
	}
	.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;
	}
	.contenedor-title{
		font-size: 2.5em;
	}
	.background-portada{
		background-size: 100%;
		background-position: ;
		width: 100%;
		height: 530px;
	}
	.textosb-portada{
		font-size: 2em;
		color: white;
		padding-top: 2.6em;
		margin-left: 3em;
	}
	.div-portada{

	}
	.title-portada{
		font-size: 2em;
		color: white;
		margin-top: 2em;
	}
	.button-portada{
		font-size: 1.5em;
		width: 300px;
	}
	.button-portada-margin{
		margin-left: 4em;
	}
	.div100-33{
		width: 33%;
		padding: 2em;
	}
	.piedepagina{
		display: flex;
		padding: 0;
	}
	.columna50-100{
		width: 50%;
		text-align: center;
	}
	.div-contact{ 
		text-align: center;
	}
	.contenedor-formulario{
		display: flex;
	}
	.div100-20{
		width: 20%
	}
	.div100-60{
		width: 60%
	}
}