/* font
------------------------------------------------------------------------------------------------------  */
@font-face {
	font-family: 'NeutraText-Demi';
	src: url('font/NeutraText-Demi.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NeutraText-DemiAlt';
	src: url('font/NeutraText-DemiAlt.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NeutraText-DemiSCAlt';
	src: url('font/NeutraText-DemiSCAlt.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NeutraText-Light';
	src: url('font/NeutraText-Light.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NeutraText-LightAlt';
	src: url('font/NeutraText-LightAlt.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}



/* root
------------------------------------------------------------------------------------------------------  */
:root {
	
	/* fonts  */
	--font-titles: 'NeutraText-Demi', sans-serif;
	--font-captions: 'NeutraText-LightAlt', sans-serif;
	--font-body: 'NeutraText-Light', sans-serif;
	--font-buttons: 'NeutraText-DemiSCAlt', sans-serif; 

	/* colors */
	--color-primary: #C09D33;
    --color-secondary: #232322; 
	--color-black: #000; 
	--color-white: #fff; 
	--color-lightgrey: #f0f0f0; 
	--color-success: #5cac20;

}


	/* body
	------------------------------------------------------------------------------------------------------  */
	body {
		margin: 0 auto;
		width: 100%;
		padding: 0px;
		font-size: 18px;
		line-height: 22px;
		font-family: var(--font-body);
		text-align: left;
		z-index: 1;
	}


	/* layout cols
	------------------------------------------------------------------------------------------------------  */
	.col_100    { float: left; margin: 0px; padding: 0px; width: 100%; }
	.col_90     { float: left; margin: 0px; padding: 0px; width: 90%; }
	.col_80     { float: left; margin: 0px; padding: 0px; width: 80%; }
	.col_75     { float: left; margin: 0px; padding: 0px; width: 75%; }
	.col_70     { float: left; margin: 0px; padding: 0px; width: 70%; }
	.col_66     { float: left; margin: 0px; padding: 0px; width: 66.66%; }
	.col_65     { float: left; margin: 0px; padding: 0px; width: 65%; }
	.col_60     { float: left; margin: 0px; padding: 0px; width: 60%; }
	.col_55     { float: left; margin: 0px; padding: 0px; width: 55%; }
	.col_50     { float: left; margin: 0px; padding: 0px; width: 50%; }
	.col_45     { float: left; margin: 0px; padding: 0px; width: 45%; }
	.col_40     { float: left; margin: 0px; padding: 0px; width: 40%; }
	.col_35     { float: left; margin: 0px; padding: 0px; width: 35%; }
	.col_33     { float: left; margin: 0px; padding: 0px; width: 33.33%; }
	.col_30     { float: left; margin: 0px; padding: 0px; width: 30%; }
	.col_25     { float: left; margin: 0px; padding: 0px; width: 25%; }
	.col_20     { float: left; margin: 0px; padding: 0px; width: 20%; }
	.col_10     { float: left; margin: 0px; padding: 0px; width: 10%; }


	/* row
	------------------------------------------------------------------------------------------------------  */
	.row{
		width: 100%;
		margin: 0 auto;
		padding: 0px;
	}


	/* contents
	------------------------------------------------------------------------------------------------------  */
	.content{
		margin: 0 auto;
		width: 90%;
	    max-width: 1200px;
	}
	.content-home{
		margin: 0 auto;
		width: 100%;
	    max-width: 1300px;
	}

	*{
		box-sizing: border-box;
	}

	/* h
	------------------------------------------------------------------------------------------------------  */
	h1{
		font-family: var(--font-titles);
		margin: 0px;
		font-size: 38px;
		line-height: 40px;
	}
	h2{
		margin: 0px;
		font-size: 33px;
		line-height: 38px;
	}
	h3{
		margin: 0px;
		font-size: 23px;
		line-height: 26px;
	}


	/* p
	------------------------------------------------------------------------------------------------------  */
	p {
		margin: 0px;
		hyphens: auto;
		text-align: justify;
	}


	/* a, link
	------------------------------------------------------------------------------------------------------  */
	a {
		cursor: pointer;
		transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;	
		text-decoration: none;
	}
	.link{
		color: var(--color-primary);
	}
	.link:hover{
		text-decoration: underline;
	}


	/* marcador validacion formulario */
	.warning {
		border: 1px solid #c00 !important;
	}

	/* video container responsive */
	#video .embed-container {
		position: relative;
		padding-bottom: 56.25%;
		height: 0;
		overflow: hidden;
		max-width: 100%;
	}
	#video .embed-container iframe, #video .embed-container object, #video .embed-container embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}


	/*  Error 404 */

	#error404 {
	text-align: center;
	padding: 50px 0;
	}
	#error404 .txt {
	font-size: 20px;
	padding: 50px 0;
	}

		

	/* float
	------------------------------------------------------------------------------------------------------  */
	.float-left{
		float: left;
	}
	.float-right{
		float: right;
	}
	.float-none{
		float: none;
	}


	/* text align
	------------------------------------------------------------------------------------------------------  */
	.text-center{
		text-align: center;
	}
	.text-right{
		text-align: right;
	}
	.text-left{
		text-align: left;
	}


	/* text colors
	------------------------------------------------------------------------------------------------------  */
	.text-color-primary{
		color: var(--color-primary);
	}
	.text-color-secondary{
		color: var(--color-secondary);
	}
	.text-color-white{
		color: var(--color-white);
	}
	.text-color-black{
		color: var(--color-black);
	}
	.text-color-lightgrey{
		color: var(--color-lightgrey);
	}


	/* btn
	------------------------------------------------------------------------------------------------------  */
	.btn{
		display: inline-block;
		font-size: 16px;
		font-family: var(--font-buttons);
		padding: 10px 30px;
		border-radius: 2px;
		text-transform: uppercase;
		letter-spacing: 1px;
		background-color: var(--color-primary);
		color: var(--color-white);
		border:1px solid var(--color-primary);
		cursor: pointer;
	}
	.btn-primary{
		background-color: var(--color-primary);
		border: 1px solid var(--color-primary);
		color: var(--color-white);
	}
	.btn-secondary{
		background-color: var(--color-secondary);
		border: 1px solid var(--color-secondary);
		color: var(--color-white);
	}
	.btn:hover{
		background-color: var(--color-secondary);
		color: var(--color-primary);
		border:1px solid var(--color-primary);
	}


	/* forms
	------------------------------------------------------------------------------------------------------  */
	form input{	
		display: inline-block;
		width: 100%;
		font-size: 16px;
		padding: 10px 20px;
		background-color: var(--color-white);
		font-family: var(--font-body);
		color: var(--color-black);
		border-radius: 2px;
		margin-top: 7px;
		border: 0px;
		outline: none;
	}
	form textarea{	
		display: inline-block;
		width: 100%;
		font-size: 16px;
		padding: 10px 20px;
		height: 120px;
		background-color: var(--color-white);
		font-family: var(--font-body);
		color: var(--color-black);
		border-radius: 2px;
		margin-top: 7px;
		border: 0px;
		outline: none;
	}
	form .loschecks{
		float: left;
		width: 100%;
	}
	form .loschecks #lopd{
		margin-top: 10px;
	}				  
	.msgs_form{
		float: left; 
		clear: both; 
		display: none; 
		color: var(--color-secondary); 
		background-color: var(--color-lightgrey);
	}		  
	.msgs_send{
		float: left; 
		clear: left; 
		width: auto; 
		background-color: var(--color-success);
		color: var(--color-white);
		display: none; 
	}
		  

	/* Cookies
	------------------------------------------------------------------------------------------------------  */
	#container_cookies {
		width: 96%;
		max-width: 28.125em;
		position: fixed;
		bottom: 0.625em;
		right: 2%;
		z-index: 100;
		padding: 2.5em;
		border: 1px dashed var(--color-primary);
		background: rgb(221,219,219);
		background: -moz-linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		background: -webkit-linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		background: linear-gradient(180deg, rgba(221,219,219,1) 0%, rgba(252,252,252,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#dddbdb",endColorstr="#fcfcfc",GradientType=1);
	}
	#container_cookies .mensaje {
		margin: 0 auto;
		width: 100%;
		text-align: justify;
		color: var(--color-secondary);
	}
	#container_cookies .mensaje .txt {
		float: left;
		padding-bottom: 1.5625em;
	}
	




	/* header
	------------------------------------------------------------------------------------------------------  */
	#main-header{
		float: left;
		width: 100%;
		padding: 20px 0px;
	}
	#main-header #logo{
		display: inline-block;
	}
	#main-header #logo img{
		width: 200px;
	}
	#main-header .telefonos{
		float: right;
		text-align: right;
		border-right: 1px solid var(--color-secondary);
		margin-right: 15px;
		padding-right: 15px;
		margin-top: 15px;
	}
	#main-header .telefonos a{
		color: var(--color-secondary);
		font-family: var(--font-captions);
	}
	#main-header .telefonos a:hover{
		color: var(--color-primary);
	}
	#main-header .pull{
		float: right;
		margin-right: 30px;
		margin-top: 15px;
	}
	#main-header .pull img{
		width: 25px;
		margin-top: 9px;
	}
	#main-header .pull img:hover{
		opacity: 0.8;
	}






	#main-header nav{
		display: none;
		position: absolute;
		position: fixed;
		top: 0px;
		width: 100%;
		padding: 60px;
		padding-bottom: 100px;
		background-color: var(--color-primary);
	}		
	#main-header nav .ico-close{
		width: 100%;
		text-align: center;
	}
	#main-header nav .ico-close img{
		width: 30px;
		cursor: pointer;
	}
	#main-header nav .ico-close img:hover{
		opacity: 0.8;
	}
	#main-header nav #nav-menu{
		float: left;
		width: 50%;
		font-size: 24px;
		font-family: var(--font-titles);
		color: var(--color-white);
		margin-top: 40px;
	}
	#main-header nav #nav-menu li a{
		display: inline-block;
		color: var(--color-white);
		padding: 7px 0px;
	}
	#main-header nav #nav-menu li a:hover{
		color: var(--color-secondary);
		text-decoration: none;
	}
	#main-header nav .info{
		float: left;
		width: 50%;
		text-align: right;
		margin-top: 50px;
	}
	#main-header nav .info .tels{
		display: inline-block;
	}
	#main-header nav .info .tels .ico{
		float: left;
		width: 55px;
	}
	#main-header nav .info .tels .ico img{
		width: 90%;
	}
	#main-header nav .info .tels .nums{
		float: left;
		width: auto;
		border-left: 1px solid var(--color-secondary);
		padding-left: 20px;
		margin-left: 20px;
	}
	#main-header nav .info .tels .nums a{
		display: inline-block;
		font-family: var(--font-buttons);
		width: 100%;
		font-size: 35px;
		padding: 2px 0px;
		color: var(--color-secondary);
	}
	#main-header nav .info .direccion{
		display: inline-block;
		width: 100%;
		margin-top: 40px;
	}





	/* home
	------------------------------------------------------------------------------------------------------  */

	#home{
		float: left;
		width: 100%;
	}
	#home .cabecera{	
		display: inline-block;
		width: 100%;	
		background-repeat: no-repeat;
		background-size: cover;
	}
	#home .cab-home{		
		background-image: url('../img/fotos/ohd-92g.jpg');
		background-position: center center;
	}
	#home .cabecera h1{
		display: inline-block;
		max-width: 500px;
		margin: 130px 0px;
		margin-left: 50px;
		background: rgba(255,255,255,0.7);		
		padding: 30px 50px;
	}
	#home .col-servicios{	
		float: left;
		margin-top: -120px;
		width: 100%;
		padding: 40px 40px;
		background-color: var(--color-secondary);			
	}
	#home .titulo{	
		float: left;
		width: 100%;
		text-align: center;
		padding-top: 20px;
		padding-bottom: 18px;
		color: var(--color-white);
		border: 1px solid #444;
		margin-bottom: 20px;
	}
	#home .col-servicios .servicio{	 	
		float: left;
		width: 100%;
		padding: 30px 20px;
		border-left: 1px solid var(--color-secondary);
	}
	#home .col-servicios .servicio:hover{	 	
		background-image: url('../img/ico-arrow-right.svg');
		background-position: left center;
		background-repeat: no-repeat;
		background-size: 7px;
		background-color: var(--color-black);
		border-left: 1px solid var(--color-primary);
	}
	#home .col-servicios .servicio .caption{		
		float: left;
		width: 100%;
		margin-bottom: 5px;
		color: var(--color-white);
		font-family: var(--font-captions);
		font-size: 16px;
	}
	#home .col-servicios .servicio .abstract{		
		float: left;
		width: 100%;
		color: var(--color-primary);
		font-family: var(--font-titles);
	}
	#home .col-servicios .btn{		
		display: inline-block;
		margin-top: 20px;
		margin-bottom: 10px;
		margin-left: 20px;
	}
	#home #intro{
		float: left;
		margin-top: -50px;
	}
	#home #intro h2{
		display: inline-block;
		width: 100%;
	}
	#home #intro .desc{
		display: inline-block;
		width: 100%;
		margin: 20px 0px;
		border-left: 1px solid var(--color-primary);
		padding-left: 20px;
	}
	#home #intro .btn{
		display: inline-block;
	}





	/* servicios-interior
	------------------------------------------------------------------------------------------------------  */

	#servicios-interior{
		float: left;
		width: 100%;
	}
	#servicios-interior .box{	
		background-color: var(--color-secondary);
		padding: 80px 60px;
	}
	#servicios-interior .tipo{	
		display: inline-block;
		width: 100%;
	}
	#servicios-interior .box .linea{	
		display: inline-block;
		width: 20px;
		margin-top: 10px;
		margin-bottom: 8px;
		height: 1px;
		border-bottom: 1px solid var(--color-primary);
	}
	#servicios-interior .box h1{	
		display: inline-block;
		width: 100%;
	}
	#servicios-interior .col-foto{	
		display: inline-block;
		width: 100%;
		height: 500px;
		margin-top: -120px;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	#servicios-interior .foto-dret-civil{	
		background-image: url('../img/fotos/ohd-5g.jpg');
	}
	#servicios-interior .foto-dret-concursal{	
		background-image: url('../img/fotos/ohd-3g.jpg');
	}
	#servicios-interior .foto-dret-successions{	
		background-image: url('../img/fotos/ohd-9g.jpg');
	}	
	#servicios-interior .foto-fullcompensation{	
		background-image: url('../img/fotos/ohd-28g.jpg');
	}	
	#servicios-interior #intro{	
		float: left;
		width: 93%;
		margin-top: -50px;
	}
	#servicios-interior #intro h2{	
		display: inline-block;
		width: 100%;
	}
	#servicios-interior #intro .desc{	
		display: inline-block;
		margin-top: 30px;
		width: 100%;
		text-align: justify;
	}
	#servicios-interior #intro .otros-servicios{	
		display: inline-block;
		margin-top: 50px;
		width: 100%;
	}
	#servicios-interior #intro .otros-servicios .tit{	
		display: inline-block;
		width: 100%;
		font-family: var(--font-titles);
	}
	#servicios-interior #intro .otros-servicios .box-otros{	
		display: inline-block;
		width: 100%;
		padding: 5px 30px;
		margin-top: 20px;
		border: 1px solid var(--color-primary);
		font-family: var(--font-titles);
	}
	#servicios-interior #intro .otros-servicios .box-otros ul{	
		display: inline-block;
		width: 100%;
		margin-left: -20px;
	}
	#servicios-interior #intro .otros-servicios .box-otros ul li{	
		width: 100%;
	}
	#servicios-interior #intro .otros-servicios .box-otros ul li a{	
		display: inline-block;
		width: 100%;
		padding: 5px 0px;
		text-decoration: none;
		font-size: 20px;
	}
	#servicios-interior #intro .otros-servicios .box-otros ul li a:hover{	
		color: var(--color-secondary);
	}


	#servicios-interior #intro form{	
		display: inline-block;
		margin-left: 19%;
		margin-top: 80px;
		width: 100%;
		text-align: justify;
		background-color: var(--color-lightgrey);
		padding: 40px;
	}
	#servicios-interior #intro form .ico{	
		display: inline-block;
		width: 100%;
		text-align: center;
	}
	#servicios-interior #intro form .ico img{ 	
		width: 40px;
	}
	#servicios-interior #intro form h2{	
		display: inline-block;
		width: 100%;
		text-align: center;
		color: var(--color-primary);
		font-family: var(--font-titles);
		font-size: 20px;
	}
	#servicios-interior #intro form p{	
		display: inline-block;
		width: 100%;
		padding: 10px 0px;
		font-size: 16px;
		line-height: 18px;
	}
	#servicios-interior #intro form .btn{	
		display: inline-block;
		margin-top: 10px;		
	}




	/* nosaltres
	------------------------------------------------------------------------------------------------------  */

	#nosaltres{
		float: left;
		width: 100%;
	}
	#nosaltres .box{	
		background-color: var(--color-secondary);
		padding: 80px 60px;
		padding-top: 200px;
		margin-top: -120px;
	}
	#nosaltres .tipo{	
		display: inline-block;
		width: 100%;
	}
	#nosaltres .box .linea{	
		display: inline-block;
		width: 20px;
		margin-top: 10px;
		margin-bottom: 8px;
		height: 1px;
		border-bottom: 1px solid var(--color-primary);
	}
	#nosaltres .box h1{	
		display: inline-block;
		width: 100%;
	}
	#nosaltres .row-foto-nosaltres{	
		display: inline-block;
		width: 100%;
		height: 260px;
		margin-top: 0px;
		background-image: url('../img/fotos/ohd-5g.jpg');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	#nosaltres #intro{	
		float: left;
		width: 93%;
		margin-top: -50px;
	}
	#nosaltres #intro h2{	
		display: inline-block;
		width: 100%;
	}
	#nosaltres #intro .desc{	
		display: inline-block;
		margin-top: 30px;
		width: 100%;
		text-align: justify;
	}
	#nosaltres #intro .desc strong{	
		font-family: var(--font-titles);
		font-size: 22px;
		line-height: 27px;
	}
	#nosaltres #intro100{	
		width: 100% !important;
	}
	#nosaltres #intro100 .desc{	
		float: left;
		margin-top: 40px;
		width: 46%;
		text-align: justify;
		border-left: 1px solid var(--color-primary);
		padding-left: 30px;
	}
	#nosaltres #intro100 .desc-last{	
		margin-left: 8%;
	}




	/* contacte
	------------------------------------------------------------------------------------------------------  */

	#contacte{
		float: left;
		width: 100%;
	}
	#contacte .box{	
		background-color: var(--color-secondary);
		padding: 80px 60px;
		padding-top: 200px;
		margin-top: -120px;
	}
	#contacte .tipo{	
		display: inline-block;
		width: 100%;
	}
	#contacte .box .linea{	
		display: inline-block;
		width: 20px;
		margin-top: 10px;
		margin-bottom: 8px;
		height: 1px;
		border-bottom: 1px solid var(--color-primary);
	}
	#contacte .box h1{	
		display: inline-block;
		width: 100%;
	}
	#contacte .mapa{	
		display: inline-block;
		width: 100%;
	}
	#contacte h2{	
		display: inline-block;
		width: 100%;
		margin-top: -150px;
		margin-bottom: 20px;
	}
	
	
	/* formulari
	------------------------------------------------------------------------------------------------------  */

	#formulari form{	
		display: inline-block;
		margin-left: 0px;
		margin-top: 60px;
		width: 100%;
		text-align: justify;
		background-color: var(--color-lightgrey);
		padding: 40px;
	}
	#formulari form h2{	
		display: inline-block;
		width: 100%;
		text-align: left;
		color: var(--color-secondary);
		font-family: var(--font-titles);
		font-size: 25px;
	}
	#formulari form p{	
		display: inline-block;
		width: 100%;
		padding: 10px 0px;
		font-size: 16px;
		line-height: 18px;
	}
	#formulari form .btn{	
		display: inline-block;
		margin-top: 10px;		
	}



	/* eficacia
	------------------------------------------------------------------------------------------------------  */
	#eficacia{
		float: left;
		width: 100%;
		margin-top: 140px;
	}
	#eficacia .box{
		display: inline-block;
		width: 100%;
		padding: 40px 50px;
		background-color: var(--color-secondary);
	}
	#eficacia .box h2{
		display: inline-block;
		width: 100%;
	}
	#eficacia .box .desc{
		display: inline-block;
		width: 100%;
		margin-top: 15px;
		color: var(--color-white);
		text-align: justify;
	}
	#eficacia .foto-eficacia{
		display: inline-block;
		height: 380px;
		width: 100%;
		background-image: url('../img/fotos/ohd-61g.jpg');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		margin-top: -80px;
	}




	/* equip
	------------------------------------------------------------------------------------------------------  */
	#equip{
		float: left;
		width: 100%;
		margin-top: 100px;
	}
	#equip h2{
		display: inline-block;
		width: 100%;
		text-align: center;
	}
	#equip .box-equipo{
		display: inline-block;
		width: 100%;
		margin-top: 40px;
	}
	#equip .box-equipo .persona{
		display: inline-block;
		width: 30%;
		margin: 0px 1%;
		text-align: center;
		margin-bottom: 40px;
		vertical-align: top;
		box-sizing: border-box;
	}

	#equip .box-equipo .persona img{
		display: inline-block;
		width: 70%;
		border-radius: 15px;
		box-shadow: 10px 10px 10px #ccc;
	}
	#equip .box-equipo .persona .nom{
		display: inline-block;
		width: 100%;
		font-family: var(--font-titles);
		margin-top: 10px;
	}
	#equip .box-equipo .persona .espe{
		display: inline-block;
		width: 100%;
	}




	/* serveis
	------------------------------------------------------------------------------------------------------  */
	#serveis{
		float: left;
		width: 100%;
		margin-top: 100px;
	}
	#serveis h2{
		display: inline-block;
		width: 100%;
		text-align: center;
	}
	#serveis .desc{
		display: inline-block;
		font-family: var(--font-titles);
		width: 100%;
		margin-top: 20px;
		text-align: center;
	}
	#serveis .box-serveis{
		display: inline-block;
		width: 100%;
		margin-top: 40px;
		border: 1px solid var(--color-primary);
		padding: 30px 40px;
	}
	#serveis .box-serveis .servei{
		float: left;
		width: 21%;
		margin: 0px 2%;
		text-align: left;
	}
	#serveis .box-serveis .servei h3{
		display: inline-block;
		width: 100%;
		font-family: var(--font-titles);
		font-size: 18px;
		line-height: 20px;
	}
	#serveis .box-serveis .servei span{
		display: inline-block;
		width: 100%;
		padding-top: 10px;
	}
	#serveis .box-serveis .servei .btn{
		display: inline-block;
		font-size: 14px;
		margin-top: 20px;
		padding: 6px 20px;
		padding-bottom: 4px;
	}


	

	/* valores
	------------------------------------------------------------------------------------------------------  */
	#valores{
		float: left;
		width: 100%;
		margin-top: 60px;
	}
	#valores .margen{
		float: left;
		width: 11%;
		min-height: 300px;
		text-align: center;
		background-color: var(--color-lightgrey);
	}
	#valores .valor{
		float: left;
		width: 26%;
		padding: 50px 30px;
		padding-bottom: 0px;
		min-height: 300px;
		margin: 0px;
		border-left: 30px solid var(--color-white);
		background-color: var(--color-lightgrey);
	}
	#valores .valor-last{
		border-right: 30px solid var(--color-white);
	}
	#valores .valor .ico{
		float: left;
		width: 100%;
		text-align: center;
	}
	#valores .valor .ico img{
		width: 40px;
	}
	#valores .valor .tit{
		color: var(--color-primary);
		font-family: var(--font-titles);
		display: inline-block;
		width: 100%;
		margin-top: 10px;
		text-align: center;
	}
	#valores .valor .texts{
		display: inline-block;
		width: 100%;
		text-align: center;
		padding: 20px 0px;
	}





	/* contactanos
	------------------------------------------------------------------------------------------------------  */
	#contactanos{
		float: left;
		width: 100%;
	}
	#contactanos .lineas{
		display: inline-block;
		width: 100%;
		text-align: center;
		padding: 60px;
	}
	#contactanos .lineas img{
		width: 40px;
	}
	#contactanos .barra{
		display: inline-block;
		width: 100%;
		background-color: var(--color-primary);
		padding: 20px 40px;
		border-radius: 2px;
		background-image: url('../img/ico-arrow-right-white.svg');
		background-position: left center;
		background-repeat: no-repeat;
		background-size: 9px;
	}
	#contactanos .barra .tit{
		float: left;
		font-family: var(--font-titles);
		color: var(--color-white);
		font-size: 30px;
		margin-top: 12px;
	}
	#contactanos .barra .datos{
		float: right;
		margin-top: 5px;
	}
	#contactanos .barra .datos .ico{
		float: left;
		margin-right: 25px;
	}
	#contactanos .barra .datos .ico img{
		width: 28px;
	}
	#contactanos .barra .datos .item-tel{
		display: inline-block;
		color: var(--color-secondary);
		margin-right: 10px;
		padding-right: 10px;
		padding-top: 5px;
		text-decoration: none;
		letter-spacing: -1px;
		font-size: 30px;
		font-family: var(--font-buttons);
	}
	#contactanos .barra .datos .item-tel:hover{
		color: var(--color-white);
	}
	#contactanos .barra .btn{
		float: right;
		margin-left: 20px;
		padding-bottom: 7px;
	}






	/* footer
	------------------------------------------------------------------------------------------------------  */
	#main-footer{
		float: left;
		width: 100%;
		margin-top: 100px;
		background-color: var(--color-lightgrey);
	}
	#main-footer .box-footer{
		display: inline-block;
		width: 100%;
		padding: 50px 0px;
	}
	#main-footer .txt{
		width: 80%;
		font-family: var(--font-titles);
	}
	#main-footer .txt i{
		display: inline-block;
		width: 100%;
		margin-top: 20px;
		font-family: var(--font-body);
	}	
	#main-footer ul{
		display: inline-block;
		width: 90%;
		margin: 0px;
		margin-left: 10%;
	}	
	#main-footer ul li a{
		font-family: var(--font-titles);
	}
	#main-footer ul li a:hover{
		text-decoration: none;
		color: var(--color-secondary);
	}	
	#main-footer #copy{
		float: left;
		width: 100%;
		padding: 15px 0px;
		background-color: var(--color-black);
		color: var(--color-white);
	}






	/* responsive
	------------------------------------------------------------------------------------------------------  */


	@media screen and (max-width: 1100px) {

		#valores .margen{
			display: none;
		}
		#valores .valor{
			width: 33.33%;
			min-height: 300px;
			border-left: 25px solid var(--color-white);
		}
		#valores .valor-last{
			border-right: 25px solid var(--color-white);
		}
		
	}

	@media screen and (max-width: 1020px) {

		#pull{
			display: inline-block;
		}
		#container_cookies {
			max-width: 96%;
		}

	}

	@media screen and (max-width: 930px) {

		#main-header .col_33{
			width: 50%;
		}
		#home .col_66, #home .col_33{
			width: 100%;
		}
		#home .col-servicios{	
			margin-top: 0px;
		}
		#home #intro{
			margin-top: 60px;
		}
		#main-header .pull{
			margin-right: 0px;
		}
		#contactanos .barra{
			display: inline-block;
			width: 100%;
			padding: 40px 40px;
			background-image: url('../img/ico-arrow-down-white.svg');
			background-position: center top;	
		}
		#contactanos .barra .tit{
			width: 100%;
			text-align: center;
		}
		#contactanos .barra .datos{
			float: left;
			width: 100%;
			margin-top: 50px;
			text-align: center;
		}
		#contactanos .barra .datos .ico{
			float: left;
			width: 100%;
			margin-right: 0px;
			text-align: center;
		}
		#contactanos .barra .datos .ico img{
			width: 40px;
		}
		#contactanos .barra .datos .item-tel{
			float: none;		
			width: 100%;
			margin-right: 0px;
			padding-right: 0px;
			font-size: 25px;
		}
		#contactanos .barra .btn{	
			float: right;		
			margin-left: 0px;
			width: 80%;
			margin: 0px 10%;
			margin-top: 30px;
			text-align: center;
		}
		#main-footer .col_40{
			width: 100%;
			margin-bottom: 40px;
		}
		#main-footer .txt{
			width: 100%;
		}	
		#main-footer .col_30{
			width: 50%;
		}
		#main-footer ul{
			width: 100%;
			margin-left: -20px;
		}	
		#servicios-interior .col_66, #servicios-interior .col_33{
			width: 100%;
		}
		#servicios-interior .col-foto{	
			height: 300px;
			margin-top: 0px;
		}
		#servicios-interior #intro{	
			width: 100%;
			margin-top: 50px;
		}
		#servicios-interior #intro form{	
			margin-left: 0px;
			margin-top: 50px;
		}
		#nosaltres .col_66, #nosaltres .col_33{
			width: 100%;
		}
		#nosaltres .box{	
			float: left;
			padding-top: 80px;
			margin-top: 0px;
		}
		#nosaltres .row-foto-nosaltres{	
			float: left;
			height: 200px;
		}
		#nosaltres #intro{	
			width: 100%;
			margin-top: 50px;
		}
		#nosaltres #intro100 .desc{	
			width: 100%;
			padding-left: 30px;
		}
		#nosaltres #intro100 .desc-last{	
			margin-left: 0px;
		}
		#serveis .box-serveis .servei{
			width: 42%;
			margin: 0px 2%;
			margin-bottom: 25px;
			margin-top: 25px;
		}
		#contacte .col_66, #contacte .col_33{
			width: 100%;
		}
		#contacte .box{	
			float: left;
			padding: 60px 60px;
			padding-top: 60px;
			margin-top: 0px;
		}
		#contacte .mapa{	
			float: left;
			width: 100%;
			height: 360px;
		}
		#contacte .mapa iframe{
			height: 360px !important;
		}
		#contacte h2{	
			margin-top: 50px;
			margin-bottom: 20px;
		}		


	}


	@media screen and (max-width: 830px) {

		#valores .margen{
			display: none;
		}
		#valores .valor{
			width: 100%;
			min-height: auto;
			border-left: 0px solid var(--color-white);
			margin-bottom: 20px;
			padding-bottom: 20px;
			text-align: center;
		}
		#valores .valor-last{
			border-right: 0px solid var(--color-white);
		}
		#valores .valor .texts{
			display: inline-block;
			width: 80%;
			max-width: 300px;
		}

		#main-footer #copy{		
			text-align: center;
			padding: 30px 0px;
		}
		#main-footer #copy strong{
			display: inline-block;
			width: 100%;
		}
		#main-footer #copy .punto{	
			display: inline-block;	
			text-align: center;
			width: 100%;
		}
		#main-footer #copy .quitar{
			display: none;
		}

			
	}

	@media screen and (max-width: 800px) {

		#main-header nav{
			padding: 60px 0px;
		}		
		#main-header #nav-menu{
			margin-left: -20px;
		}
	
	}


	@media screen and (max-width: 700px) {

		h1{
			font-size: 30px;
			line-height: 32px;
		}
		h2{
			font-size: 26px;
			line-height: 30px;
		}
		h3{
			font-size: 20px;
			line-height: 22px;
		}
		#home .cabecera h1{
			max-width: 80%;
			margin: 100px 0px;
			margin-left: 10%;
			margin-right: 10%;
			padding: 30px 50px;
		}

		#main-header .telefonos a{
			font-size: 16px;
		}
		#serveis .box-serveis .servei{
			width: 100%;
			margin: 0px 0px;
			margin-bottom: 25px;
			margin-top: 25px;
		}

	
	}



	@media screen and (max-width: 670px) {

		#eficacia .col_50{
			width: 100%;
		}	
		#eficacia{
			margin-top: 60px;
		}
		#eficacia .foto-eficacia{
			height: 330px;
			margin-top: 0px;
		}		
		#equip .box-equipo .persona{
			width: 46%;
			margin: 0px 1%;
			margin-bottom: 30px;
		}
	
	}


	@media screen and (max-width: 650px) {

		#main-header nav #nav-menu{
			width: 100%;
			font-size: 20px;
			margin-top: 40px;
			text-align: center;
			list-style: none;
		}
		#main-header nav .info{
			width: 100%;
			text-align: center;
		}
		#main-header nav .info .tels .ico{
			width: 55px;
		}
		#main-header nav .info .tels .nums a{
			font-size: 30px;
		}

	}



	@media screen and (max-width: 575px) {

		#main-footer .txt{
			text-align: center;
		}
		#main-footer .col_30{
			width: 100%;
		}
		#main-footer ul{
			width: 100%;
			margin-left: -20px;
			text-align: center;
			list-style: none;
			margin-bottom: 50px;
			margin-top: 20px;
		}	
		#main-footer p{
			text-align: center;
		}
	}

	@media screen and (max-width: 530px) {

		#main-header #logo img{
			width: 130px;
			margin-top: 13px;
		}

	}

	@media screen and (max-width: 500px) {

		#equip .box-equipo .persona{
			width: 100%;
			margin: 0px 0px;
			margin-bottom: 30px;
		}
		#equip .box-equipo .persona img{
			width: 50%;
		}
	
	}