/**********************************************************************************************************************/
/** MEDIA QUERIES *****************************************************************************************************/
/**********************************************************************************************************************/

/***********************************************
Pantalla 3480x2160 16:9 4K
***********************************************/
@media only screen and (min-width:2651px) and (max-width: 3840px) {

	#avisoCookies {
		padding: 20px 40em;
	}

	.cabPortada {
		padding: 10px 40em 10px 40em;
		height: 110px;
	}

	.menuFijo {
		top: 110px;
	}
	
	.swiper-container {
		margin-top: 110px;
	}

	.bloqueMenu {
		padding: 30px 40em 30px 40em;
	}
	
	#empresa {
	    padding: 70px 0em 70px 0em;
	}	
	
	#empresa .texto {
		padding-right: 40em;
	}
	
	#bloqueCatalogo {
	    padding: 0px 40em 0px 40em;	
	}
	
	#catalogo {
	    padding: 70px 5em 70px 5em;
	}
	
	.ficha {
		margin-top: 215px;
	}
	
	#clientes {
	    padding: 70px 40em 70px 40em;
	}	

	#extras {
	    padding: 70px 40em 70px 40em;
	}

	#bloqueProductos {
	    padding: 240px 40em 70px 40em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 40em 100px 40em;	
	}	

	#contacto {
	    padding: 70px 40em 70px 40em;
	}
	
	#encuesta {
	    padding: 150px 0em 70px 0em;
	}	


}


/***********************************************
Pantalla 2560x1440 16:9 2K
***********************************************/
@media only screen and (min-width:1921px) and (max-width: 2560px) {

	#avisoCookies {
		padding: 30px 20em;
	}

	.cabPortada {
		padding: 10px 30em 10px 30em;
		height: 110px;
	}

	.menuFijo {
		top: 110px;
	}
	
	.swiper-container {
		margin-top: 110px;
	}
	
	.bloqueMenu {
		padding: 20px 30em 20px 30em;
	}

	#empresa {
	    padding: 70px 0em 70px 0em;
	}
	
	#empresa .texto {
		padding-right: 30em;
	}	
	
	#bloqueCatalogo {
	    padding: 0px 30em 0px 30em;	
	}	
	
	#catalogo {
	    padding: 70px 5em 70px 5em;
	}	
		
	.ficha {
		margin-top: 195px;
	}
			
	#clientes {
	    padding: 70px 30em 70px 30em;
	}
			
	#extras {
	    padding: 70px 30em 70px 30em;
	}	
	
	#bloqueProductos {
	    padding: 20px 30em 70px 30em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 30em 100px 30em;	
	}	
	
	#contacto {
	    padding: 70px 30em 70px 30em;
	}
	
	#encuesta {
	    padding: 150px 30em 70px 30em;
	}	
	
}


/***********************************************
Pantalla 1920x1080 16:9 
***********************************************/
@media only screen and (min-width:1681px) and (max-width: 1920px) {

    #avisoCookies {
		padding: 20px 10em;
	}

	.cabPortada {
		padding: 10px 20em 10px 20em;
		height: 100px;
	}

	.menuFijo {
		top: 100px;
	}	
	
	.swiper-container {
		margin-top: 100px;
	}
	
	.bloqueMenu {
		padding: 10px 20em 10px 20em;
	}
	
	#empresa {
	    padding: 70px 0em 70px 0em;
	}	
	
	#empresa .texto {
		padding-right: 20em;
	}		
	
	#bloqueCatalogo {
	    padding: 0px 20em 0px 20em;	
	}	
	
	#catalogo {
	    padding: 70px 5em 70px 5em;
	}	
	
	.ficha {
		margin-top: 165px;
	}
	
	#clientes {
	    padding: 70px 20em 70px 20em;
	}	
	
	#extras {
	    padding: 70px 20em 70px 20em;
	}	
	
	#bloqueProductos {
	    padding: 200px 20em 70px 20em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 20em 100px 20em;	
	}	
	
	#contacto {
	    padding: 70px 20em 70px 20em;
	}
	
	#encuesta {
	    padding: 120px 20em 70px 20em;
	}		
	
	.bloquePie.enc {
	    padding: 10px 20em 10px 20em;
	}		
	
}


/***********************************************
Pantalla 1680x1050 16:10
***********************************************/
@media only screen and (min-width:1367px) and (max-width: 1680px) {

    #avisoCookies {
		padding: 20px 5em;
	}

	.cabPortada {
		padding: 10px 5em 10px 5em;
		height: 100px;
	}

	.menuFijo {
		top: 100px;
	}
	
	.swiper-container {
		margin-top: 100px;
	}

	.bloqueMenu {
		padding: 10px 5em 10px 5em;
	}

	#empresa {
	    padding: 70px 0em 70px 0em;
	}	
	
	#empresa .texto {
		padding-right: 5em;
	}		
	
	#bloqueCatalogo {
	    padding: 0px 5em 0px 5em;	
	}	
	
	#catalogo {
	    padding: 70px 4em 70px 4em;
	}	
	
	.ficha {
		margin-top: 165px;
	}	
	
	#clientes {
	    padding: 70px 5em 70px 5em;
	}	
	
	#extras {
	    padding: 70px 5em 70px 5em;
	}

	#bloqueProductos {
	    padding: 200px 5em 70px 5em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 5em 100px 5em;	
	}	

	#contacto {
	    padding: 70px 5em 70px 5em;
	}
	
	#encuesta {
	    padding: 120px 5em 70px 5em;
	}	
	
}

/***********************************************
Pantalla 1366x768 16:9
***********************************************/
@media only screen and (min-width:1281px) and (max-width: 1366px) {

	#avisoCookies {
		padding: 20px 5em;
	}

	.cabPortada {
		padding: 10px 5em 10px 5em;
		height: 100px;
	}

	.menuFijo {
		top: 100px;
	}
	
	.swiper-container {
		margin-top: 100px;
	}
	
	.bloqueMenu {
		padding: 10px 5em 10px 5em;
	}

	.swiper-container h1 {
		font-size: 2em;
		letter-spacing: 3px;
	}
	
	.swiper-container h2 {
		font-size: 1.8em;
	}	
	
	#empresa {
	    padding: 60px 0em 60px 0em;
	}	
	
	#empresa .texto {
		padding-right: 5em;
	}		

	#bloqueCatalogo {
	    padding: 0px 5em 0px 5em;
	}
	
	#catalogo {
	    padding: 70px 2em 70px 2em;
	}	
	
	.ficha {
		margin-top: 165px;
	}	
	
	#clientes {
	    padding: 70px 5em 70px 5em;
	}	
	
	#extras {
	    padding: 70px 5em 70px 5em;
	}

	#bloqueProductos {
	    padding: 200px 5em 60px 5em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 5em 100px 5em;	
	}	

	#contacto {
	    padding: 60px 5em 60px 5em;
	}
	
	#encuesta {
	    padding: 120px 5em 60px 5em;
	}
		
}

/***********************************************
Pantalla 1280x720 16:9
***********************************************/
@media only screen and (min-width:1025px) and (max-width: 1280px) {

    #avisoCookies {
		padding: 20px 1em;
	}

	.cabPortada {
		padding: 10px 2em 10px 2em;
		height: 100px;
	}

	.menuFijo {
		top: 100px;
	}

	.swiper-container {
		margin-top: 100px;
	}

	.bloqueMenu {
		padding: 10px 2em 10px 2em;
	}

	.swiper-container h1 {
		font-size: 2em;
		letter-spacing: 3px;
	}
	
	.swiper-container h2 {
		font-size: 1.8em;
	}		
	
	#empresa {
	    padding: 50px 0em 50px 0em;
	}	
	
	#empresa .texto {
		padding-right: 2em;
	}		
	
	#bloqueCatalogo {
	    padding: 0px 5em 0px 5em;
	}
	
	#catalogo {
	    padding: 70px 2em 70px 2em;
	}		
	
	.ficha {
		margin-top: 165px;
	}	
	
	#clientes {
	    padding: 70px 2em 70px 2em;
	}	
	
	#extras {
	    padding: 70px 2em 70px 2em;
	}

	#bloqueProductos {
	    padding: 200px 2em 60px 2em;
	}
		
	#bloquePresupuesto {
	    padding: 100px 2em 100px 2em;	
	}	

	#contacto {
	    padding: 50px 2em 50px 2em;
	}

	#encuesta {
	    padding: 120px 2em 50px 2em;
	}
		
}

/***********************************************
Pantalla 1024x600 16:10
***********************************************/
@media only screen and (min-width:960px) and (max-width: 1024px) {

	#avisoCookies {
		padding: 10px 1em;
	}

	.cabPortada {
		padding: 10px 2em 10px 2em;
		height: 100px;
	}
	
	.cabPortada .datos > img {
        height: 50px;
    }

	.menuFijo {
		top: 100px;
	}
	
	.swiper-container {
		margin-top: 100px;
	}

	.bloqueMenu {
		padding: 10px 2em 10px 2em;
	}
	
	.bloqueMenu ul li {
	    padding: 0px 10px 0px 10px;
		font-size: 0.8em;
    	letter-spacing: 1px;	    
	}	
		
	.submenu ul li {
	    padding: 5px 10px 5px 10px;
	    font-size: 0.7em;
	}
	
	.swiper-container h1 {
		font-size: 2em;
		letter-spacing: 3px;
	}
	
	.swiper-container h2 {
		font-size: 1.8em;
	}		
	
	#empresa {
	    padding: 40px 0em 40px 0em;
	}	
	
	#empresa .texto {
		padding-right: 2em;
	}		
	
	#empresa .boton {
		width: auto !important;
	}	
	
	#bloqueCatalogo {
	    padding: 0px 2em 0px 2em;
	}
	
	#catalogo {
	    padding: 70px 2em 70px 2em;
	}		
	
	.ficha {
		margin-top: 165px;
	}	
	
	#clientes {
	    padding: 40px 2em 40px 2em;
	}	
	
	#extras {
	    padding: 70px 2em 70px 2em;
	}

	#bloqueProductos {
	    padding: 200px 2em 40px 2em;
	}
	
	#bloquePresupuesto {
	    padding: 100px 2em 100px 2em;	
	}	

	#contacto {
	    padding: 40px 2em 40px 2em;
	}
	
	#encuesta {
	    padding: 110px 2em 40px 2em;
	}	
	
	#encuesta h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 2em;
	}	
		
}


/***********************************************
Tablet (Smaller than 959px)
***********************************************/
@media only screen and (min-width:768px) and (max-width: 959px) {
	
	.show-mobile { display:none !important; }
	.show-tablet { display:inherit !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:inherit !important; }
	.hide-tablet { display:none !important; }
	.hide-screen { display:inherit !important; }	
	
	#avisoCookies {
		padding: 10px 1em;
	}

	#avisoCookies > div > p {
		font-size: .8em;
	}

	html body {
		margin: 0px;
	}	
	
	html body#inicio {
		margin-top: 45px;
	}	
	
	.swiper-container {
		margin-top: 45px;
	}
	
	.swiper-container h1 {
		font-size: 2em;
		letter-spacing: 3px;
	}
	
	.swiper-container h2 {
		font-size: 1.8em;
	}		
	
	#empresa {
	    padding: 40px 0em 40px 0em;
	}	
	
	#empresa #imgEmpresa {
		width: 100%;
		height: 400px;
	}	
	
	#empresa .texto {
		width: 100%;
		padding-left: 30px;
		padding-right: 20px;
	}		
	
	#empresa .boton {
		width: auto !important;
	}	
	
	#bloqueCatalogo {
	    padding: 0px 0em 0px 0em;
	}
	
	#catalogo {
	    padding: 40px 2em 40px 2em;
	}		
	
	#catalogo h1 {
	    margin: 0px auto 40px auto;
	}	
	
	.ficha {
		margin-top: 45px;
	}	
	
	#clientes {
	    padding: 40px 20px 40px 20px;
	}	
	
	#clientes h1 {
	    margin: 0px auto 40px auto;	
	}	
	
	#extras {
	    padding: 40px 10px 40px 10px;
	}
	
	#extras h1 {
	    margin: 0px auto 40px auto;	
	}	
	
	#bloqueProductos {
	    padding: 100px 10px 40px 10px;
	}
	
	#bloqueProductos h1 {
	    margin: 0px auto 50px auto;
	}	
	
	#bloquePresupuesto {
	    padding: 100px 10px 100px 10px;	
	}	

	#contacto {
	    padding: 40px 20px 40px 20px;
	}
	
	.bloquePie p {
	    font-size: .7em;
	}	
	
	#bloqueProductos .cont {
		width: 100%;
	}	
	
	#encuesta {
	    padding: 130px 20px 40px 20px;
	}	
	
	#encuesta h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 2em;
	}	
	
	.enc {
		padding: 0px 20px;
	}
	
}


/***********************************************
Mobile (portrait 300px)
***********************************************/
@media only screen and (max-width:767px) {
	
	table { width:auto; overflow-x: auto; display: block; }
	
	.show-mobile { display:inherit !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:none !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:inherit !important; }
	
	img.banner {
	    max-width: 90%;
	}	
	
    #avisoCookies {
		padding: 10px 1em;
	}

	#avisoCookies > div > p {
		width: 100%;
		font-size: .8em;
	}

	#avisoCookies > div > div {
		width: 100%;
		margin-top: 10px;
	}
	
	#avisoCookies > div > div div {
		margin: 0px auto;
	}
	
	#avisoCookies > div > div div:hover {
		background-color: #d0d8ff;
	}	

	.cabPortada img {
		margin: 50px auto 20px auto;
		height: 100px;
	}
	
	.swiper-container {
		margin-top: 45px;
	}	
	
	.swiper-container h1 {
		font-size: 1em;
		letter-spacing: 2px;
	}
	
	.swiper-container h2 {
		margin: 10px 0px 0px 0px;
		font-size: 0.8em;
	}		
	
	#empresa {
	    padding: 30px 0em 0px 0em;
	}	
	
	#empresa h1 {
	    margin: 0px auto 30px auto;
	    padding: 10px 20px 10px 20px;
	    font-size: 2em;
	}	
	
	#empresa #imgEmpresa {
		width: 100%;
		height: 200px;
	}
	
	#empresa .texto {
		width: 100%;
		padding-left: 20px;
		padding-right: 20px;
	}		
	
	#empresa .boton {
		width: auto !important;
	}	
	
	#bloqueCatalogo {
	    padding: 0px 0em 0px 0em;
	}
	
	#catalogo {
	    padding: 30px 20px 20px 20px;
	}		
	
	#catalogo h1 {
	    margin: 0px auto 30px auto;
	    padding: 10px 20px 10px 20px;
	    font-size: 1.5em;
	}		
	
	.ficha {
		margin-top: 45px;
	}		
	
	.productoCat {
		width: 100%;
		margin-bottom: 20px;
	}
	
	#extras {
	    padding: 30px 20px 30px 20px;
	}
	
	#extras h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 2em;
	}	
	
	.extra {
		width: 100%;
		margin: 0px 0px 30px 0px;
		box-sizing: border-box;
	}
	
	.extra p {
		font-size: 1.2em;
		text-align: center;
		text-transform: uppercase;
	}
	
	.producto {
		width: calc(50% - 10px);
		margin-bottom: 20px;
	}	
		
	#presupuesto {
	    margin-top: 30px;
	    padding: 10px 10px 30px 10px;
	}	
	
	#presupuesto legend {
		font-size: 0.8em;
	}

	#presupuesto .bloqueFormulario {
		width: 100% !important;
	}	
	
	#clientes {
	    padding: 30px 20px 30px 20px;
	}	
	
	#clientes h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 2em;
	}		
	
	#bloqueProductos {
	    padding: 70px 10px 70px 10px;
	}

	#bloqueProductos h1 {
	    margin: 0px auto 40px auto;
	}

	#bloquePresupuesto {
	    padding: 100px 10px 100px 10px;	
	}	

	#contacto {
	    padding: 70px 20px 70px 20px;
	}
	
	#contacto h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 2em;
	}	

	#contacto .formContacto {
		width: 100%;
		margin-bottom: 20px;
	}	
	
	#contacto .datosContacto {
		width: 100%;
	}	
	
	#contacto .formContacto .boton {
		margin: 0px auto;
	}
	
	#contacto .datosContacto p.dir {
		margin-top: 30px;
		font-weight: 700;
		font-size: 0.8em;
	}	
	
	.bloquePie p {
	    font-size: .7em;
	}	
	
	#bloqueProductos .cont {
		width: 100%;
	}	
	
	.formulario legend {
		padding: 0px 5px 0px 5px;
	}
	
	.formulario .bloqueFormulario {
		margin-bottom: 10px;
	}
	
	.formulario .bloqueFormulario {
		width: 100% !important;
	}	
	
	.formulario .bloqueFormulario input, .formulario .bloqueFormulario select {
		width: 100% !important;
	}	
	
	.formulario table th, .formulario table td {
		font-size: 0.8em;
	}
	
	#encuesta {
	    padding: 100px 20px 70px 20px;
	}
	
	#encuesta h1 {
	    margin: 0px auto 30px auto;
	    padding: 20px 20px 20px 20px;
	    font-size: 1.5em;
	}	
	
	.enc {
		padding: 0px 20px;
	}
	
	.enc img {
		width: 70%;
		height: auto;
		margin-top: 20px;
	}
	
	.enc .datos {
		display: none;
	}
	
	.swiper-button-next, .swiper-button-prev {
		display: none !important;
	}
	
}


/***********************************************
Mobile (landscape 420px)
***********************************************/
@media only screen and (min-width: 480px) and (max-width: 767px) {

	.show-mobile { display:inherit !important; }
	.show-tablet { display:none !important; }
	.show-screen { display:none !important; }
	.hide-mobile { display:none !important; }
	.hide-tablet { display:inherit !important; }
	.hide-screen { display:inherit !important; }

	.productoCat {
		width: 48%;
		margin-bottom: 20px;
	}
	
	.productoCat p {
		font-size: 1em;
		color: #222222;
	}
	
	.producto {
		width: calc(33% - 10px);
		margin-bottom: 20px;
	}	
	
	#encuesta {
	    padding: 100px 20px 70px 20px;
	}
	
	#encuesta h1 {
	    margin: 0px auto 30px auto;
	    padding: 10px 10px 10px 10px;
	    font-size: 1.2em;
	}	
	
	.enc {
		padding: 0px 20px;
	}
	
	.enc img {
		width: 40%;
		height: auto !important;
		margin-top: 10px;
	}

	
}