@charset "utf-8";
@import url("styles.css");
/* Juan Sebastian */
header,nav,section,article,footer,figure{
	display:block;
	}
{margin:0px;
padding:0px}
.limpiar{
	clear:both;
	}
	
body{
    background-attachment:fixed;
	background-color:#FFF;
    background-repeat:no-repeat;
	background-size:100%;
    margin:0px;
	

	
	

	}

	.general{
	width:230px;
	height:15px;
	display:block;
	float:left;
	margin:0px;
	font-size:1px;
	text-indent:-800px;
	
	}
#vacio{
	
	
	height:200px;

	}
	#contenedor{
		width:100%;
		height:960px;
			
		background-image: url(../Imagenes/fondoabajopantallaspeque%C3%B1as.jpg);
		background-color:#003c62;
		margin:auto;
	
		}
		
		#muela{
			width:100%;
			height:200px;
			background: url(../Imagenes/muelitaizgrande.jpg)no-repeat;
			position: fixed;
			
	
			}
		
			#logo{
         	width:270px;
			height:120px;

			
			}
			#menu{
		    left:150px;
			top:34px;
	        width:1000px;
			height:150px;
			position:fixed;
			

			}
			
			
			
				#icon{
				width:1000px;
				height:37px;
				 
				display:block;
				margin:auto;
		
				
				}

	.titulo{
		width:450px;
		margin-left:340px;
	    position:absolute;
	    font-family: 'Buda', cursive;
		font-size:22px;
		color: #CCC;
		margin-top:120px;

		}
		/*----------------Iconos Menu Pagina Index------------------------*/
		
		#icon ul{
	margin:auto;
	padding:0px;
	list-style:none;
    width:1000px;
}
#icon li a{
	margin:0px 0px 0px 0px;
	height:27px;
	display:block;
	float: left;
	padding:5px 40px 0px 35px;
	font-family: 'Buda', cursive;
	font-size:16px;
	text-decoration:none;
	color: #E9E9E9;
    transition:transform 0.4s;
	
}

#icon li a.inicio{
	
	transition:0.2s;
	font-family: 'Buda', cursive;
	background: url(../Imagenes/boto.jpg) no-repeat;
	
	

	}
	#icon li a.inicio:hover{
		color:#036;
		background: url(../Imagenes/botohover.jpg) no-repeat;
		font-family: 'Buda', cursive;
		transition:0.2s;
	}
	
	

	
	#icon li a.somos{
	
	transition:0.2s;
font-family: 'Buda', cursive;
	background: url(../Imagenes/boto2.jpg) no-repeat;
	

	}
#icon li a.somos:hover{
		color: #036;
		background: url(../Imagenes/boto2hover.jpg) no-repeat;
		
		transition:0.2s;
	}
#icon li a.servicios{
	transition:0.2s;
	font-family: 'Buda', cursive;
	background: url(../Imagenes/productos_boton.jpg) no-repeat;


	}
#icon li a.servicios:hover{
		color: #036;
		background: url(../Imagenes/productos_botonhover.jpg) no-repeat;
		
		transition:0.2s;
	}
#icon li a.productos{
	
	transition:0.2s;
	font-family: 'Buda', cursive;
	background: url(../Imagenes/servicios_boton.jpg) no-repeat;
	
	
	}
#icon li a.productos:hover{
		color:#036;
		background: url(../Imagenes/servicios_botonhover.jpg) no-repeat;
		
		transition:0.2s;
	}
	#icon li a.oficina{
	
	transition:0.2s;
	font-family: 'Buda', cursive;
	background: url(../Imagenes/centro_boton.jpg) no-repeat;
	
	
	}
#icon li a.oficina:hover{
		color: #036;
		background: url(../Imagenes/centro_botonhover.jpg) no-repeat;
		
		transition:0.2s;
	}
	#icon li a.contacto{
	width:170px;
    transition:0.2s;
	font-family: 'Buda', cursive;
	background: url(../Imagenes/contactenos_boton.jpg) no-repeat;
	

	}
#icon li a.contacto:hover{
		color: #036;
		background: url(../Imagenes/contactenos_botonhover.jpg) no-repeat;
		
		transition:0.2s;
	}
	/*----------------BANNER MOTHERFOCKERS------------------------*/
	
	#ban{
		
		margin:auto;
		height:210px;
		width:980px;

		}
	#Stage{
		margin:auto;
		height:210px;
		width:980px;
		position: relative;
		padding:0px 0px;
		
		}
		/**------** Menu Inferior**--------**/
		#azul{
			margin:auto;
			width:690px;
			height:370px;
			
			
			}
		
		#azul ul{
	
			padding:0px;
	        list-style:none;
	
			}
		#azul li a{
	margin:0px 0px 0px 0px;
	
	display:block;
	float: left;
	font-family: 'Buda', cursive;
	font-size:16px;
	text-decoration:none;
	color: #E9E9E9;
 
	margin-left:15px;

			height:350px;
			width:120px;

			}
			#azul li a.azuldos{
				
							background: url(../images/tapete%20HOVER.png) no-repeat;
						
						transition: 0.6s;
				}
				#azul li a.azuldos:hover{
				background: url(../images/alfombra%20inferior.jpg) no-repeat ;
							
									
									transition: 0.4s;
				}
				#azul li a.azultres{

					background: url(../images/tela%20HOVER.png) no-repeat ;
				
					
					transition: 0.6s;
				
				
				
				}
				#azul li a.azultres:hover{

background: url(../images/tela%20inferior.jpg) no-repeat;				
				transition: 0.4s;
				
				
				}
				
				#azul li a.azulcuatro{
background: url(../images/BAMBU%20HOVER.png) no-repeat ;
				transition: 0.6s;
				
			
				}
				#azul li a.azulcuatro:hover{
background: url(../images/bambu%20inferior.jpg) no-repeat ;					

transition: 0.4s;
				
				
			
				}
				
				
				#azul li a.azulcinco{
					background: url(../images/maquinaria%20pesada%20HOVER.png) no-repeat;
					
					

				transition: 0.6s;
				}
				
				#azul li a.azulcinco:hover{
background: url(../images/maquinaria%20boton%20inferior.jpg)  no-repeat; 
								
								
				transition: 0.4s;
				}
				#azul li a.azulseis{
 background: url(../images/contenedores%20HOVER.png) no-repeat;	
				
		
	
			
				transition: 0.6s;
				}
				
				#azul li a.azulseis:hover{

	background: url(../images/contenedor%20inferior.jpg) no-repeat;			
	
				transition: 0.4s;
				}	
				/*////----------Redes Sociales/////*/
					
				#redes{
					position: fixed;
					width:100px;
					height:190px;
					margin-top:-450px;
				
					
					
					}	
					
			#redes ul{

			
	        list-style:none;
			
			
			
				padding:0px;
			

			}
			
			#redes li a{
				display:block;
				
			
				width:60px;
				height:58px;
				
				
				
				
				}
	
	#redes li a.face{
				
	background: url(../Imagenes/face.png) no-repeat;
	transition: 0.6s;
	
	
				}
				#redes li a.face:hover{
				
	background:url(../Imagenes/facehover.png) no-repeat;
	transition: 0.7s;
				}
				
				#redes li a.tw{
				
	background: url(../Imagenes/tw.png)  no-repeat;
	transition: 0.6s;
				}

#redes li a.tw:hover{
				
	background: url(../Imagenes/twitterpnghover.png) no-repeat;
	transition: 0.7s;
				}
		
.cop{
	width:700px;
	height:20px;
	display:block;
	margin:auto;
    font-family: 'Buda', cursive;
	font-size:14px;
	color: #999;
	margin-top:60px;
	text-align:center;
	}
	
	#log{
		background:url(../images/triangulo%20logo%20blanco.png) no-repeat;
		margin:auto;
		display:block;
		width:69px;
		height:60px;
		
		
		}
		/*////----------iconos hom y tel/////*/
		#home{
			margin:auto;
			margin-top:40px;
			
			
					width:110px;
					height:40px;
			
			}
			#home ul{

			
	        list-style:none;
		    padding:0px 0px 0px 0px ;
			

			}
			#home li a{
				
				float:left;
				display:block;
				
				width:50px;
				height:40px;
				
				
			}
		
			
		
		/*////----------PAGINAS INTERIORES/////*/
		
		#columnaprincipal{
		
		margin:auto;
		height:450px;
		width:900px;

		}
		.texto{
			
	font-family: 'Buda', cursive;
	font-size:15px;
	color: #999;
	text-align:justify;
	
			
			}
			/*////----------PAGINAS servicios/////*/
			.titulocolumnas{
				
				font-family: 'Buda', cursive;
	font-size:17px;
	color: #666;
	
				
				
				}
			
			#columna{
				
			
		
		margin: auto;
		height:450px;
		width:1090px;

		}
		#columnauno{
		float:left;
	
		height:400px;
		width:150px;

		}
		#columnados{
			margin-left:14px;
			float:left;
		
		
		height:400px;
		width:130px;

		}
		#columnatres{
			margin-left:14px;
			float:left;
		
		
		height:400px;
		width:220px;

		}
		
		#columnacuatro{
			margin-left:14px;
			float:left;
		
		
		height:430px;
		width:310px;

		}
		#columnacinco{
			margin-top:0px;
			margin-left:14px;
			float:left;
		
		
		height:400px;
		width:220px;

		}
	
		
		/*////----------PAGINAS PRODUCTOS/////*/
		#prod{
			margin:auto;
			width:700px;
			height:490px;
			
			
			}
			#prod ul{
	
			padding:0px;
	        list-style:none;
	
			}
		#prod li a{
	margin:0px 0px 0px 0px;
	
	display:block;
	float: left;
	font-family: 'Buda', cursive;
	font-size:16px;
	text-decoration:none;
	color: #E9E9E9;
 
	margin-left:15px;

			height:470px;
			width:120px;

			}
			#prod li a.azuldo{
				
							background: url(../Imagenes/producto%20tapete.png) no-repeat;
						
						transition: 0.6s;
				}
				#prod li a.azuldo:hover{
				background: url(../images/alfombra%20inferior.jpg) no-repeat ;
							
									
									transition: 0.4s;
				}
				#prod li a.azultre{

					background: url(../Imagenes/producto%20telas.png) no-repeat ;
				
					
					transition: 0.6s;
				
				
				
				}
				#prod li a.azultre:hover{

background: url(../images/tela%20inferior.jpg) no-repeat;				
				transition: 0.4s;
				
				
				}
				
				#prod li a.azulcuatr{
background: url(../Imagenes/producto%20bambu.png) no-repeat ;
				transition: 0.6s;
				
			
				}
				#prod li a.azulcuatr:hover{
background: url(../images/bambu%20inferior.jpg) no-repeat ;					
transition: 0.4s;
				
				
			
				}
				
				
				#prod li a.azulcinc{
background: url(../Imagenes/producto%20pesada.png) no-repeat;
transition: 0.6s;
				}
				
				#prod li a.azulcinc:hover{
background: url(../images/maquinaria%20boton%20inferior.jpg)  no-repeat; 
transition: 0.4s;
				}
				#prod li a.azulsei{
 background: url(../Imagenes/producto%20contenedor.png) no-repeat;	
transition: 0.6s;
				}
				
				#prod li a.azulsei:hover{

background: url(../images/contenedor%20inferior.jpg) no-repeat;			
transition: 0.4s;
				}	
				
				
				/*////----------PAGINAS MAQUINARIA/////*/
				
				.textomaquina{
			
	font-family: 'Buda', cursive;
	font-size:15px;
	color: #999;
	text-align:justify;
	

			
			}
		#columnamaquina{
			
				
			
		
		margin: auto;
		height:780px;
		width:1000px;

		}
		#columnamaquinauno{
float:left;
		height:200px;
		width:240px;

		}
		
		#imagenservicios{
			
float:left;
		height:260px;
		width:250px;
		

		}
		
		#imagen2{
			margin-left:10px;
		
		
	float:left;
		height:470px;
		width:250px;

		}
		
		#columnamaquinados{
			margin-left:10px;
		
		
	float:left;
		height:470px;
		width:250px;

		}
		
		
	/*////----------PAGINAS CONTENEDORES----------------/////*/
	
	
	#columnacontenedores{
		margin:auto;
		
		
		height:680px;
		width:1070px;
		
		
		
		
		
		
		}
		
		/*////----------PAGINAS PISOS BAMBÚ----------------/////*/
		#columnabambu{
	
		margin:auto;
		height:680px;
		width:1000px;

		}
		#bambus{
			
	
		
		height:285px;
		width:1000px;

		}
		
		
		.textobambu{
	
			
	font-family: 'Buda', cursive;
	font-size:15px;
	color: #999;
	
		}
		.titulobam{
			margin-top:290px;
	
			
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
	font-size:18px;
	color: #FFF;
	text-align:center;

	
	
		}
		
		#bambuuno{
		
float:left;
		height:190px;
		width:400px;

		}
		

		#bambudos{
			margin-left:20px;
		
        float:left;
		height:190px;
		width:400px;

		}
		
		#bambutres{
		
        float:left;
		height:190px;
		width:400px;

		}
		#bambucuatro{
		margin-left:20px;
        float:left;
		height:190px;
		width:400px;

		}
		
		#sli{
			background: url(../Imagenes/contctenosbambu.jpg);
			
		
        float: right;
		height:380px;
		width:170px;

		}
		/*////----------PAGINAS PISOS BAMBÚ    esto es.....galeria de imagenes----------------/////*/
		
		#tube{
        background:url(../Imagenes/delbam.jpg);
		height:250px;
		width:1000px;

		}
		#infbambu{
			margin:auto;
			display:block;
			width:1000px;
			height:660px;
			
			
			
			}
			/*////----------PAGINAS TELA----------------/////*/
			
			#columnatela{
	
		margin:auto;
		height:300px;
		width:1000px;

		}
		#tela{
		
			
			background:url(../Imagenes/delbam.jpg);
		height:260px;
		width:100%;
		}
		#telas{
	
			margin:auto;
		height:290px;
		width:1000px;

		}
		#columnaalfombra{
	
		margin:auto;
		height:600px;
		width:1000px;

		}
/*////----------PAGINA Centro Empresarial----------------/////*/
#columnaprincipalce{
		
		margin:auto;
		height:790px;
		width:950px;
		

		}
		
		
	
		/*-------FORMULARIO----*/		
		#columnacontactenos{
			margin:auto;
			
		
		
		height:550px;
		width:910px;

		}
	
	#for{
		margin-top:50px;
	width: 910px;
	height: 320px;
	background: no-repeat;
	
	
	
	}
	.i{
		width: 240px;
		height:550px;
		position:absolute;
		display:block;
		margin-top:110px;
		margin-left:600px;

		}
		.rotulos{
			font-family:'Buda', cursive;
			color:#FFF;
			
			
			
			
			 
			
			width:170px;
			height:22px;
			float: left;
			display:block;
			background: #002E5B;
			}
			
			.campos{
				font-family:'Buda', cursive;
				width:400px;
				height:20px;
				display:block;
				}
				
				input{
					
					width:210px;
					margin-left:10px;
					
					
					color: #333;
					}
.coment{
	
	width:220px;
				height:40px;
				display:block;
				float:none;
	}
	
	.dp{
		color: #999;
		font-family:'Buda', cursive;
		font-size:24px;
		text-shadow:2px;
		margin-left:10px;
		}
		/*////----------PARTE BOTONES INFERIORES----------------/////*/
		#botonmarco{
			display:block;
			
			margin:auto;
			width:1050px;
			height:320px;
			
			
			
			}
		
		#boton{
			
			margin:auto;
			width:1050px;
			height:320px;
			
			
			
			}
			
		
		#boton ul{
	
			padding:0px;
	        list-style:none;
	
			}
			#boton li a{
	margin:0px 0px 0px 0px;
	
	display:block;
	float: left;
	font-family: 'Buda', cursive;
	font-size:16px;
	text-decoration:none;
	color: #E9E9E9;
 
	margin-left:20px;

			height:320px;
			width:180px;

			}
			
			#boton li a.botondos{
				
							background: url(../Imagenes/BOTONparteINFERIOR__Somos.png) no-repeat;
						
						transition: 0.6s;
				}
				#boton li a.botondos:hover{
				background: url(../Imagenes/BOTONparteINFERIOR__SomosHOVER.png) no-repeat ;
							
									
									transition: 0.4s;
				}
				#boton li a.botontres{

					background: url(../Imagenes/BOTONparteINFERIOR__Centro%20Empresarial.png) no-repeat ;
				
					
					transition: 0.6s;
				
				
				
				}
				#boton li a.botontres:hover{

background: url(../Imagenes/BOTONparteINFERIOR__Centro%20EmpresarialHOVER.png)  no-repeat;				
				transition: 0.4s;
				
				
				}
				
				#boton li a.botoncuatro{
background: url(../Imagenes/BOTONparteINFERIOR__Productos.png) no-repeat ;
				transition: 0.6s;
				
			
				}
				#boton li a.botoncuatro:hover{
background: url(../Imagenes/BOTONparteINFERIOR__ProductosHOVER.png) no-repeat ;					

transition: 0.4s;
				
				
			
				}
				
				
				#boton li a.botoncinco{
					background: url(../Imagenes/BOTONparteINFERIOR__Servicios.png) no-repeat;
					
					

				transition: 0.4s;
				}
				
				#boton li a.botoncinco:hover{
background: url(../Imagenes/BOTONparteINFERIOR__ServiciosHOVER.png)  no-repeat; 
								
								
				transition: 0.4s;
				}
				#boton li a.botonseis{
 background: url(../Imagenes/BOTONparteINFERIOR__Cont%C3%A1ctenos.png) no-repeat;	
				
		
	
			
				transition: 0.6s;
				}
				
				#boton li a.botonseis:hover{

	background: url(../Imagenes/BOTONparteINFERIOR__Cont%C3%A1ctenosHOVER.png) no-repeat;			
	
				transition: 0.4s;
				}	
				
				#columnachao{
					height:300px;
					margin:auto;
					
	font-size: 15px;
font-family: 'Buda', cursive;
	
	margin-top: 25px;
	
	width: 1000px;
	text-align: center ;
	
	
	}