*{  box-sizing: border-box  }

html, body{ 
	width:100%;
	/* height:100%; */
	padding:0;
	margin:0;
	/* letter-spacing:0.1em  */
}

body{ 
	/* background: url('../imgs/fondo1.jpg') no-repeat fixed center/cover; */
	background-color:#e4e4e4;
	/* background: linear-gradient(to bottom right,white,#e4e4e4); */
	font-family: VERDANA, Arial;
	/* font-size: 0.9em; */
	font-size:16px;
	/* overflow:auto */
}


/* #################### */

.textcenter{
	text-align:center
}

.visibleON{ 
	visibility: visible !important;
}
.visibleOFF{
	visibility:hidden
}

.displayON{
	display:block !important
}
.displayOFF{
	display:none !important
}
.displayINLINEBLOCK{
	display:inline-block !important
}
.opacidadON{
	opacity: 1 !important
}

.toggleflex{
	display:flex !important
}

.scrollOFF{
	overflow:hidden
}

.POSfixedON{
	position: fixed;
}

/* #################### */

.cookies{
	background-color:yellow
}	
.cookies p::first-letter{
	font-size:initial;
	font-weight:initial
	
}
	
.contenedor{
	position:relative;
	/* background-color:#f9f9f9; */
	/*background-color:rgba( 255, 255, 255, 0.1 );*/
	max-width:70%;
	/* height: 100%; */
	margin:auto;
	/*border-left: 2px solid #484848;
	border-right: 2px solid #484848;*/
	/*box-shadow: 0 0 20px 10px rgba(255, 255, 255, 1);*/
/* 	display:flex;
	flex-direction:column;
	align-items:normal;
	justify-content:center; */
	/* overflow:auto */
}

.divhr{
	border-top: 1px solid black;
	margin: 30px 0 0
}

.CAJAservicio{
	background: linear-gradient(to bottom, #000 50%, #5f5f5f);
	color: #b7b7b7;
	border: 1px solid #7b7b7b;
	border-radius: 10px;	
}

.imglogo{
	width:150px;
	height:auto;
	margin: 50px 0 20px 0;
}


.menu{
	display:flex;
	justify-content: space-evenly;
	flex-wrap:wrap;			
	/* font-weight:bold; */
	/* text-align:center; */
	/*border-left: 1px solid white;
	border-right: 1px solid white;*/
	margin: 26px 0 26px 0;
}
	.menu a, .botonenviar{			
		min-width: 220px;
		/* height:36px; */
		margin: 6px;
		padding: 6px;
		background-color:black;
		/*background: linear-gradient(to bottom,black,#2d2d2d);*/
		background: linear-gradient(to bottom,white 20%,#999);
		text-shadow: 0.4px 1px #6F6F6F;
		box-shadow: 0 0 6px 2px #b9b9b9;
		border-radius:2px;
		border: 1px solid #534e00;
		/*cursor:pointer;*/
		color:#272727;
		text-decoration:none;
		font-size:1.14em;				
		transition: background 2s;
		transition: box-shadow 0.4s		
	}
		.menu a:hover, .botonenviar:hover{
			background: linear-gradient(to bottom,#ff0 40%,#ffb300);
			color:black;
			box-shadow: 0 0 6px 2px #989898;
		}

		.menu .botonINICIO{
			background: linear-gradient(to bottom, #000 50%, #5f5f5f);
			color: #b7b7b7;
			border: 1px solid #7b7b7b 
		}
			.menu .botonINICIO:hover{
				background: linear-gradient(to bottom, #272727 50%, #5f5f5f);
				color: #b7b7b7;
				border: 1px solid #7b7b7b
			}


	
.contenido{
	/* background-color: rgba(255, 255, 255, 0.8); */
	/* margin: 6px auto; */
	/* border-radius:4px; */
	/* margin: 0 0 40px; */
	/* padding: 10px 20px 20px; */
	padding:40px;
	letter-spacing:1.4px
}
	.contenido hr{
		border:1px solid #ababab;
		/* width:90%; */
		margin:30px 0 30px 0
	}
		.contenido hr.factdvhr{
			border: 1px solid #515151;			
		}


.principal p::first-letter, .politicaprivacidad p::first-letter, .politicacookies p::first-letter{
	font-size:1.30em;
	font-weight:bold
}
	.principal .introtext{
		background: #f2f2f2;
		padding: 6px;
		border-radius: 8px;
	}
	.principal .infotext{
		color:#d56e00
	}

.tiposweb section p:first-of-type{
	font-size:large;
	font-weight:bold
}

.realizacontenedor{
	display:flex;
	flex-wrap:wrap;
	/* align-items: center; */
	/* justify-content: center; */	
	margin:auto !important
}
	.realiza, .tarifascontenedor{
		flex:50%;
	}
	.realiza{
		/* margin: 20px 0; */
		margin: initial;
	}
	.realiza h1{
		margin: 20px 0;
		font-size:1.4em;
		text-shadow: 2px 2px #c8c8c8
	}	
	.realiza ul{
		/* list-style-type: none; */
		margin-bottom:30px
	}
		.realiza ul li{
			margin: 0 0 4px;
			text-shadow: 1px 1px #c8c8c8;
		}


.tarifaslista{
  position: relative;
  display: inline-block;
  text-align:left;
}
/* .tarifaslista:hover .tarifasenlaces {display: block;} */

.tarifasenlaces{
  display: none;
  position: absolute;
  font-size:90%;
  background-color: #fffbf1;
  /* box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); */
  border: 1px solid #ad7f00;
  z-index: 1;
}
.tarifasenlaces a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  border-top: 1px solid #a1a1a1;
}
	.tarifasenlaces a:hover{
		font-weight: bold;
		background-color: #ffedaf	
	}

.botontarifas{
	padding: 20px;
	margin-top:20px;
	/* color: #4a4a4a; */
	background-color: gold;
	background: linear-gradient(to bottom,#fcff70,#ffb300);
	border: 1px solid #0119c9;
	border-radius: 4px;
	cursor: pointer;
	transition:padding 0.3s
}
	.botontarifas:hover{
		/* padding:24px; */
		background: linear-gradient(to bottom,#fff6c6,#ffa100);
	}


.tarifascontenedor{
	/* text-align:center */
 	/*display:flex;
	flex-wrap:wrap;
	 justify-content: center;			
	margin: 40px auto;*/
}
	.tarifa{
		/* display:none; */
		/* background-color:#FFF; */
		text-align:initial;
		background-color:#FFFFF9;
		margin:20px 30px;
		/*height:280px;*/
		/* width:260px; */
		/* width:44%; */
		/*border: 1px solid #dfdfdf;*/
		/* border-radius: 4px; */
		box-shadow: 0 0 10px 6px rgba(167, 167, 167, 0.4);
		transition:box-shadow 0.2s;					
	}
	.tarifa:hover{
		cursor:pointer;
		box-shadow: 0 0 10px 6px rgba(111, 111, 111, 0.4);
	}
		.tarifa hr{
			border:1px solid #e9e9e9;
			/* width:90%; */ 
			margin:0
		}	
		.tarifa img{
			margin:0;
			width:100%;
			/* border-radius: 4px 4px 0 0; */
		}
		.tarifa p{
			margin:0;
			padding:10px
		}
		.tarifa p::first-letter{
			font-size:initial;
			font-weight:initial
		}
		.tarifa ul{
			padding-right: 6px;
		}
		.tarifa ul li{
			padding: 0px 0px 6px;	
		}
	
		.tarifa .precio{
			text-align: center;
			font-weight: bold;
			font-size: 1.48em;
			padding: 10px 0;
		}
		.tarifa .letrapequenya{
			font-size:0.8em;
			background: linear-gradient(to bottom right,#ffd356,#ffbc00);
			padding: 6px;			
		}


/* .disenos{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-evenly;
} */
	.disproglist .disprog{
		display:flex;
		/* flex-wrap:nowrap; */
		flex-wrap:wrap;		
		/* width:90%; */
		margin:0 auto 30px;
		background: linear-gradient(-20deg, #aaa,#fff);
		box-shadow: 0px 0px 6px 2px gray;
	}
		.disproglist .disprogIZQ{
			flex:30%;
			padding: 10px;
			text-align:center;
		}
		.disproglist .disprogIZQ img{
/* 			width: 100%;
			height: auto;
			max-width:300px; */
			width:auto;
			max-height:240px;
			border: 1px solid #c8c8c8;			
		}
		.disproglist .disprogDER{
			flex:70%;
			padding: 10px;
			line-height: 22px;
		}
			.disproglist .disprogDER li{
				margin-bottom: 10px;
			}
				.botonmasinfo{
					padding: 8px;
					border: 1px solid black;
					cursor: pointer;
				}			
			.disprogDER .disprogVER{
				display: inline-block;
				padding: 10px;
				margin-top: 6px;
				/* border: 1px solid gray; */
				background: linear-gradient(to bottom, #ffe0a6,orange);
				cursor: pointer;
				font-size: 1.4em;
			}
/* 			.disenoDER .disenotags{
				display: inline-block;
				padding: 6px;
				margin-top:6px;
				background-color:aliceblue;
				border-radius:4px
			} */

		.formLISTimgvids{
			text-align:center;
		}
			.formLISTimgvids select{
				width:50%
			}
	
		.disproglist .letrapequenya{
			width:100%;
			/* font-size:0.8em; */
			background: linear-gradient(to bottom right,#ffd356,#ffbc00);
			padding: 6px;
		}
		
.infodisenos{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-color:white;
	padding:20px;
}
	.infodisenos .galeriaIMGS{
		display:flex;
		align-items:center;
		justify-content:space-evenly
	}
	.infodisenos .galeriaIMGS img{
		width:200px;
	}
	
.contacto, footer{
	margin-top:40px;
	background:initial !important
}

.botoncontacto{
	width:300px;
	padding: 20px;
	color: #fff;
	background-color: gold;
	background: linear-gradient(to bottom,#00c600,#004700);
	border: 1px solid #00810f;
	border-radius: 4px;
	cursor: pointer;
	transition:padding 0.3s
}
	.botoncontacto:hover{
		/* padding:24px; */
		background: linear-gradient(to bottom,#00d800,#006b00);
	}
	
#contactar{
	text-align:center;
	max-width:650px;
	margin:20px auto
}
	#contactar fieldset{
		border:2px solid gray;
		background-color:rgba(255,255,255,0.8);
		/* border-radius:4px */
	}
	#contactar legend{
		background-color: gold;
		background: linear-gradient(to bottom right,gold,yellow);			
		padding: 4px;			
	}
	#contactar input[type="text"], input[type="email"], input[type="submit"], select, textarea{
		padding: 8px;
		margin:10px 0;
		width:80%
	}
	#contactar textarea{
		resize:vertical
	}
	#contactar label{
		display:block;
		margin:20px 0
	}
	
.respuesta{
	display:none;
	height:50px;
	background: linear-gradient(to top,#e0b72b,#ffe58c);
	margin:0;
	padding:14px;
	text-align:center
}



#modal{
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	/* background-color: rgba( 0, 0, 0, 0.8); */
	display:none;
	/* visibility:hidden; */
	opacity:0;
	overflow:auto;
	transition: opacity 0.5s; /* fade */
	z-index:500
}
/* .modalzindex{
	z-index:500 !important;
} */
	.modalcontenedor{
		position:relative;
		/* margin:2% auto; */
		/* padding:20px; */
		width:100%;
		height:100%;
		/* max-width: 860px; */
		/* min-width: 300px; */
		background-color: rgba( 0, 0, 0, 0.9);
		/* background-color:black; */
		/* border:1px solid #292929; */
		/* z-index:201 */
		text-align:center;
		overflow:auto
	}
	.modalcerrar{
		position: fixed;
		top: 4px;
		right:24px;
		color: white;
		font-size: 2.5em;
		/* font-weight: bold; */
		cursor: pointer;
		/* background-color: white;*/
		/* border-radius: 2px;  */
		/* background-color: #333; */
		/* border: 1px solid #474747;
		padding: 0 12px */
	}
/* 		.modalcerrar:hover{
			background-color:#363636;
		} */

	.modaldatos{
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		align-items:center;
		height:100%
	}
	
		.modaldatos .imgzoom{
			position: fixed;
			top: 10px;
			right:74px;			
			/* width:100%; */
			text-decoration:none;
			font-size: 2em;
		}
		.modaldatos img{
			/* max-width:100% */
			/* width:auto; */
			max-height:94%
		}
		.modaldatos p{
			width:96%;
			color:white;
			position: fixed;
			bottom: 0;
			background-color: rgba(57, 57, 57, 0.7);
			margin: 0;	
			padding: 6px;			
		}
		.modaldatos video{
			height:90%;
			max-width:96%
		}
		
		
		
		
@media only screen and (max-width: 1279px){

	.contenedor{
		max-width:96%
	}
	
	.realiza, .tarifascontenedor{
		flex:100%
	}
	.realiza{
		order:2
	}
	.tarifascontenedor{
		order:1
	}	
	.tarifa{
		width:96%;
		margin:20px auto;
	}

}

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

	.imglogo{
		margin-top:50px
	}
	
	.contenido{
		padding:16px
	}
	
	.disproglist .disprog{
		flex-wrap:wrap;
		width:100%
	}
	.disprog .disprogIZQ, .disprog .disprogDER{
		flex:100%
	}
		.disprog .disprogIZQ img{
			max-width:100%;
		}
	
}