@charset "UTF-8";
/* CSS Document */

*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
}
html{
	width: 100%;
	height: 100%;
}
body {
	background-color: #EDEEEE;
}
header{
	width: 100%;
	padding: 20px;
}
.left{
	float: left;
}
.right{
	float: right;
}
.orange-icon{
	color: #FF6B2C;
}
.white-icon{
	color: #fff;
}
.container-fluid{
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
a{
	cursor:pointer;
}
ul{
    margin-top: 0;
    margin-bottom: 1rem;
    margin-left: 17px;
}
.zenbakia{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
	border: 1px solid #fff;
	border-radius: 5px;
	margin-left: 10px;
	position: absolute;
	right: 7%;
}
.zenbakia-n{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
	border: 1px solid #FF6B2C;
	border-radius: 5px;
	margin-left: 10px;
	position: absolute;
	right: 7%;
	color: #FF6B2C;
}
/*----------------*/
/*---- HEADER ----*/
h1 {display: none;}
.logo{
	width: 50%;
}
.sare-sozialak {
	text-align: right;
}
.sare-sozialak i{
	background-color: #FF6B2C;
	border-radius: 50%;
	border: 1px solid #FF6B2C;
	color: #fff;
	padding: 10px;
	min-height: 38px;
	min-width: 38px;
	text-align: center;
}
.sare-sozialak i:hover{
	background-color: #fff;
	border-radius: 50%;
	border: 1px solid #FF6B2C;
	color: #FF6B2C;
	padding: 10px;
}
#idiomas{
	text-align: right;
}
#idiomas li{
	list-style-type: none;
	display: inline-block;
}
#idiomas li a{
	color: #FF6B2C;
	background-color: #fff;
	padding: 6px 11px;
	display: block;
}
#idiomas li a:hover{
	background-color: #FF6B2C;
	color: #fff;
	text-decoration: none;
}
.activado{
	background-color: #FF6B2C !important;
	color: #fff !important;
	text-decoration: none !important;
}
nav{
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	overflow: hidden;
}
#menu{
	list-style-type: none;
	float: right;
}
#menu li{
	display: inline-block;
	padding: 20px;
}
#menu li a{
	text-decoration: none;
	text-transform: uppercase;
	text-align: center;
	color: #343434;
	font-weight: 100;
}
#menu li a:hover{
	text-decoration: none;
	color: #343434;
	border-bottom: 3px solid #FF6B2C;
}
#solapa	{
	float: right;
	display: none;
	cursor: pointer;
}
.botonmenu {
	background-color: #FF6B2C;
	border-radius: 10px;
	width: 38px;
	height: 38px;
	text-align: center;
	padding: 5px;
	float: right;
}
#solapa img {
	display: inline-block;
	width: 100%;
}
/*----------------*/
/*---- SLIDER ----*/
#slider{
	background-image: url("img/desatascos_laster_furgoneta.png");
	background-repeat: no-repeat;
	background-position: right bottom;
	height: 100%;
	background-size: cover;
	padding-bottom: 30px;
}
.desatascos{
	color: #FF6B2C;
	margin: 20px 0px 0px 45px;
	font-size: 20pt;
}
.desatascos-eus{
	color: #FF6B2C;
	margin: 20px 0px 0px 35px;
	font-size: 20pt;
}
#llamar, #llamar-eus{
	cursor: pointer;
	border-radius: 50%;
	width: 200px;
	height: 200px;
	text-align: center;
	margin: 0px 0px 20px 20px;
	position: relative;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.50);
	background: #e84037;
	background: -webkit-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: -o-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: linear-gradient(to right, #e84037 0%, #ff6b2c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84037', endColorstr='#ff6b2c',GradientType=1 );
	color: #fff;
	border: 1px solid #FF6B2C;
}
#llamar i, #llamar-eus i{
	font-size: 20pt;
	margin-bottom: 10px;
}
#llamar:hover, #llamar-eus:hover{
	cursor: pointer;
	color: #fff;
	background-color: #FF6B2C;
	border: 10px solid #fff;
	border-radius: 50%;
	text-align: center;
	margin: 0px 0px 20px 20px;
	position: relative;
}
#llamar a{
	cursor: pointer;
	color: #fff;
	text-align: center;
	position: absolute;
	top: 22%;
	left: 25%;
	text-decoration: none;
	font-size: 17pt;
}
#llamar a:hover{
	color: #fff;
}
#llamar-eus a{
	cursor: pointer;
	color: #fff;
	text-align: center;
	position: absolute;
	top: 15%;
	left: 23%;
	text-decoration: none;
	font-size: 16pt;
}
#llamar-eus a:hover{
	color: #fff;
}
.slider-txt, .slider-tel {
	font-size: 25pt;
	font-weight: bolder;
	padding-left: 30px;
}
.slider-tel a { color: #FF6B2C;}
.slider-tel a:hover {text-decoration: none; color: #e84037;}
.presupuesto, .presupuesto:active{
	background: #e84037;
	background: -webkit-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: -o-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: linear-gradient(to right, #e84037 0%, #ff6b2c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84037', endColorstr='#ff6b2c',GradientType=1 );
	color: #fff;
	border: 1px solid #FF6B2C;
	border-radius: 20px;
	padding: 10px;
	margin: 10px 10px 10px 30px;
    box-shadow: 10px 10px 10px rgba(0,0,0,0.50);
	cursor: pointer;
	text-decoration: none;
}
.presupuesto:hover{
	cursor: pointer;
	color: #fff;
	background-color: #FF6B2C;
	border: 10px solid #fff;
	border-radius: 50px;
	text-decoration: none;
}
/*--------------------------*/
/*---- ICONOS SERVICIOS ----*/
#iconos-servicios{
	background: #e84037;
	background: -webkit-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: -o-linear-gradient(left, #e84037 0%, #ff6b2c 100%);
	background: linear-gradient(to right, #e84037 0%, #ff6b2c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84037', endColorstr='#ff6b2c',GradientType=1 );
	color: #fff;
	text-align: center;
}
.icono{
	padding: 30px;
}
.icono img {width:50%;}
.icono h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bolder;
}
.col-12-no-margin{
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 0px;
    padding-left: 0px;
	margin: 0px;
}
/*------------------*/
/*---- NOSOTROS ----*/
#nosotros, #gu{
	overflow: hidden;
}
.nosotrosbg {
	background-image: url(img/nosotros.png);
	background-repeat: no-repeat;
	background-size: 60% auto;
	background-position: right bottom;
}
.gu-logo {
	padding-top: 20px;
	text-align: right;
	padding-right: 10%;
}
.gu-logo img { width: 40%; max-width: 100%;}
.margin-caret{
	position: absolute;
    right: 11%;
}
.naranja{
	background-color: rgba(255,107,44,0.60);
}
.txt-nosotros{
	padding: 30px 30px 30px 50px;
}
.linea-arriba{
	border-top: 3px solid #fff;
	padding: 5px;
}
.linea-abajo{
	border-bottom: 1px solid #fff;
	padding: 5px;
}
.txt-nosotros h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
}
.txt-nosotros p{
	font-size: 15pt;
}
/*-------------------*/
/*---- SERVICIOS ----*/
#servicios, #zerbitzuak{
	background-image: url(img/zerbitzuak.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	height: 100%;
	width: 100%;
	color: #fff;
	overflow: hidden;
}
#zerbitzuak .naranja, #servicios .naranja {
	margin-left: 3%;
}
.txt-servicios{
	padding: 200px 30px 70px 50px;
}
.txt-servicios h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
}
.txt-servicios img {
	width: 40%;
	height: 40%;
}
.txt-servicios p{
	font-size: 15pt;
}
/*----------------------*/
/*---- EQUIPAMIENTO ----*/
#equipamiento, #hornikuntza{
	height: 100%;
	width: 100%;
	color: #000;
}
#hornikuntza>.row:nth-child(1), #equipamiento>.row:nth-child(1) {
    margin-bottom: 15px;
}
#hornikuntza .esk, #equipamiento .esk {position: relative;}
#hornikuntza .esk img, #equipamiento .esk img {
	position: absolute;
	bottom:0;
	right:0;
	padding-right:15px;
	padding-left: 15px;
}
.linea-arriba-n{
	border-top: 3px solid #FF6B2C;
	padding: 5px;
}
.linea-abajo-n{
	border-bottom: 1px solid #FF6B2C;
	padding: 5px;
}
.txt-equipamiento{
	padding: 30px 30px 30px 50px;
}
.txt-equipamiento h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
}
.txt-equipamiento img {
	width: 40%;
	height: 40%;
}
.txt-equipamiento p{
	font-size: 15pt;
}

/*------------------------*/
/*---- CASOS DE EXITO ----*/
#exito, #arrakasta{
	height: 100%;
	width: 100%;
	color: #000;
	overflow: hidden;
}
.txt-exito{
	padding: 70px 30px 30px 50px;
}
.txt-exito h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
}
.txt-exito img {
	width: 40%;
	height: 40%;
}
.txt-exito p{
	font-size: 15pt;
}
.txt-exito ul li{
	font-size: 15pt;
	font-weight: 600;
}
.col-6-np{
	position: relative;
    width: 50%;
    min-height: 1px;
	padding-right: 0px;
    padding-left: 0px;
}
.casos {
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #fff;
}
.caso {
	color: rgba(31,31,31,1.00);
	background-color: #fff;
}
.caso p{
	margin: 0px;
	padding: 0px;
	color: rgba(39,39,39,1.00);
	font-size: 13pt;
}
.caso h2{
	font-weight: bold;
	font-size: 15pt;
}
.caso>.row {
    padding-top: 30px;
}
.cliente{
	font-style: italic;
	color: rgba(107,107,107,1.00);
	padding-bottom: 20%;
}
#exito hr, #arrakasta hr {
	width: 50%;
	border-top: 2px solid #FF6B2C;
}
/*------------------*/
/*---- CONTACTO ----*/
#contacto, #kontaktua{
	height: 100%;
	width: 100%;
	color: #fff;
	background-color: #58595B;
	margin-top: 20px;
	padding-top: 15px;
	padding-bottom: 15px;
}
#kontaktua a, #contacto a {
    color: #fff;
    font-weight: bold;
}
#kontaktua a:hover, #contacto a:hover {
    color: #FF6B2C;
    text-decoration: none;
}
.txt-contacto{
	padding: 380px 30px 30px 50px;
}
.txt-contacto h2{
	text-transform: capitalize;
	font-size: 20pt;
	font-weight: bold;
}
.txt-contacto img {
	width: 40%;
	height: 40%;
}
.txt-contacto p{
	font-size: 15pt;
}
.mapa{
	height: 800px;
	width: 100%;
}
/*----------------*/
/*---- FOOTER ----*/
footer{
	position: relative;
	padding: 10px 0;
}
footer .sare-sozialak{
	display: none;
	text-align: left;
	padding-left: 10px;
}
.flecha, .flecha:hover{
	color: #FF6B2C;
	position: absolute;
	right: 10%;
	font-size: 20pt;
}
/*---------------------*/
/*-----------------------------*/
/*-------- MEDIA QUERY --------*/
@media screen and (max-width: 2064px) and (min-width: 1753px){
	.mapa{
		height: 500px;
	}
}
@media screen and (min-width: 1200px){
	.caso h2 {
		font-size: 13pt;
	}
	.cliente{
   		padding-bottom: 5%;
		font-size: 12pt;
	}
	.txt-exito{
    	padding: 70px 30px 30px 50px;
	}
	.txt-equipamiento {
    	padding: 30px 30px 30px 50px;
	}
	.mapa{
		height: 500px;
	}
	.nosotrosbg{ background-size: 50% auto; min-height: 500px;}
}
@media screen and (max-width: 1199px) and (min-width: 100px){
	.logo{
    	width: 50%;
	}
	.txt-nosotros, .txt-servicios, .txt-equipamiento, .txt-exito, .txt-contacto{
    	padding: 30px 30px 30px 50px;
	}
	h2.nombrecliente{
		font-size: 18pt;
		padding: 10px 0px;
	}
	.cliente{
		font-size: 15pt;
	}
	.slider-txt{
    	font-size: 13pt;
	}
	.mapa{
		height: 300px;
	}
}
@media screen and (max-width: 991px) and (min-width: 100px){
	.logo {width: 100%;}
	#idiomas{
    	right: 11%;
	}
	#home .sare-sozialak{
    	display: none;
	}
	.mapa{
		height: 300px;
	}
	.margin-caret{
    	right: 14%;
	}
	.zenbakia, .zenbakia-n{
		right: 7%;
	}
	#zerbitzuak .naranja, #servicios .naranja {
		margin-left: 0;
	}
	#hornikuntza .esk img, #equipamiento .esk img {
		position: relative;
		padding: auto;
	}
	.caso {margin-bottom: 30px;}
}
@media screen and (max-width: 880px) and (min-width: 100px){
	.desatascos-eus {
   		color: #FF6B2C;
    	margin: 20px 0px 0px 20px;
    	font-size: 17pt;
	}
	.desatascos{
    	margin: 20px 0px 0px 30px;
	}
	#llamar, #llamar-eus, llamar{
    	width: 150px;
    	height: 150px;
	}
	#llamar-eus a, #llamar-eus a:hover{
    	font-size: 12pt;
		top: 15%;
	}
	#llamar a, #llamar a:hover{
    	font-size: 12pt;
	}
}
@media screen and (max-width: 924px){
	#slider {
    	background-position: right 30px;
    	background-size: 100%;
	}
	.txt-nosotros h2, .txt-servicios h2, .txt-equipamiento h2, .txt-exito h2, .txt-contacto h2{
    	font-size: 15pt;
	}
	.txt-nosotros p, .txt-servicios p, .txt-servicios ul li, .txt-equipamiento p, .txt-equipamiento ul li, .txt-exito ul li, .txt-exito p, .txt-contacto p{
    	font-size: 10pt;
	}
	#solapa {display: block;}
	nav{
		float: none;
		text-align: center;
		padding: 10px;
	}
	#menu{
		display: none;
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 17px;
		background-color: #FF6B2C;
	}
	#menu li{
    	display: inline-block;
    	width: 100%;
	}
	#menu li a{
		width: 100%;
		color: #fff;
	}
	#menu li:hover{
    	background-color: #fff;
		color: #FF6B2C;
	}
	#menu li:hover a{
		color: #FF6B2C;
		border-bottom: 0px solid #FF6B2C;
	}
	#idiomas{
    	right: 42%;
    	top: 5px;
	}
	.icono h2{
    	font-size: 15pt;
	}
	.icono p{
    	font-size: 10pt;
	}
	h2.nombrecliente {
		font-size: 12pt;
		padding: 5px 0px;
	}
	cliente{
		font-size: 13pt;
	}
	.caso p{
    	font-size: 10pt;
	}
	footer .sare-sozialak{
		display: block;
	}
}
@media screen and (max-width: 575px){

	.cliente{
		padding-bottom: 10%;
		font-size: 13pt;
	}
	.nosotrosbg {min-height: 400px;}
	.gu-logo {text-align: left; padding-left: 10%;}
	.txt-exito {padding: 10px 30px 30px 50px;}
}