/* DISEÑO WEB: http://www.tripulacionweb.com */

/* ----------------------------------
	ETIQUETAS GENERALES
----------------------------------- */

body {
margin:0;
padding:0;
background:url(img/background/background.jpg) repeat-x #f2d243;
font-family:Calibri,Arial, Helvetica, sans-serif;
}

ul,ol,li,h1,h2,h3,h4,p,form {
margin:0;
padding:0;
}

ul,ol {
list-style:none;
}

a { text-decoration:none; }
a:hover { text-decoration:underline; }


/* ----------------------------------
	ESTRUCTURA GENERAL
----------------------------------- */
#background { /* <div> Fondo blanco sombreado */
	background:url(img/background/background-blanco.png) repeat-y 50% 0%;
}

/*  HEADER */
#header { /* <div> Sostiene la imagen blanca (transparente), liquid layout */
	background:url(img/header/background.png) repeat-x;
	height:159px;
	position:relative;
	z-index:5;  /* <-- Lo posicionamos encima de "#colDer" que también está posicionada */
}

  #header_wrapper { /* <div> Header (sostiene el encabezado, fondo blanco y logo) */
	  width:900px;
	  height:148px;
	  margin:0 auto 0 auto;
	  background:url(img/header/logo.jpg) no-repeat 0% 0% #fff;
  }
  
  #header #fecha { /* <div> Fecha (float righ) */
	  float:right;
	  font-size:12px;
	  margin-right:6px;
	  margin-top:4px;
  }
  
  #header #flash_header { /* <div> Flash (float right) */
	  width:500px;
	  height:130px;
	  float:right;
	  clear:right;
  }
 
/* WRAPPER */
#wrapper { /* <div>  Sostiene el contenido */
	width:900px;
	margin:-11px auto 0 auto; /*  Margen negativa (para estar abajo de la sombre del header */
	position:relative;
	background:white;
}

/* COLUMNA DERECHA */
#colDer { /* <div> Columna derecha (position absolute) */
	width:292px;
	position:absolute;
	right:0;
	top:0;
	z-index:0; /* <-- Posicionado abajo de "#header" */
	background:url(img/colDer/background.jpg) no-repeat 0 0 #5e0c01;
	border:1px solid #cd671d;
}

  #colDer h1 { /* Los encabezados (ej. "Productos", "Buscar un Producto", etc) */
	  background:url(img/colDer/titulos_background.png) repeat-x;
	  height:28px; /* 34px */
	  font:bold 18px Arial, Helvetica, sans-serif;
	  padding-left:50px;
	  padding-top:7px;
	  margin-left:-15px;
	  margin-top:21px;
	  margin-right:-20px;
	  border-left:1px solid #d88427;
	  border-right:1px solid #d88427;
	  position:relative;
  }
  
  #colDer h1 .curvatura { /*  <div> La curvatura (position absolute)*/
	position:absolute;
	right: -2px;
	top: 35px;
  }
  
  #colDer h1 .icono { /* <div> El ícono (position absolure) */
	  position:absolute;
	  left:5px;
	  top:2px;
  }
  
  #colDer ul { /* Lista de las categorías de los productos */
	  margin:15px;
	  padding:15px;
	  color:white;
	  background:url(img/colDer/productos_background.png) repeat;
	  font-size:14px;
  }
  
     #colDer ul li { /* Distancia entre las categorías */
		 margin-bottom:5px;
	 }
	 
	 #colDer ul li span { /* Color de los "»" */
		 color:#E7B238;
	 }
  
  #colDer a { color:white; } /* Links */
  
  #colDer form { /* El formulario de "Buscar Producto" */
	  margin:15px 0 15px 15px;
	  position:relative;
  }
  
  #colDer form .text { /* <input> El campo de texto*/
	  width:177px; /* 184px */
	  height:30px; /* 34px */
	  border:1px solid #d68025;
	  display:block;
	  color:#d68025;
	  font-size:20px;
	  padding:5px 0 0 7px;
  }
  
  #colDer form .submit_btn { /* <div> Posiciona el botón submit (position absolute) */
	  position:absolute;
	  right:15px;
	  top:0;
  }
  
  #colDer form .submit { /* <input> El botón submit */
	  font:16px Arial, Helvetica, sans-serif;
	  color:white;
	  height:38px;
	  background:url(img/colDer/btn_submit_background.png) repeat-x black;
	  border:1px solid black;
  }
  
  #colDer form span { /*  La leyenda "(ej. "acidos", "adhesivos", etc)" */
	  font:11px Arial, Helvetica, sans-serif;
	  color:white;
  }
  
  #colDer #promociones_menu { /* <div> La imagen de la promoción */
	  margin:15px;
	  font:16px Arial, Helvetica, sans-serif;
	  color:white;
  }
  
 
/* CONTENIDO */
#contenido { /* <div> Sostiene el contenido (margen a la derecha) */
	margin-right:317px;
	border-top:1px solid transparent; /*  Necesrio para hacer "margin-tops" dentro */
}
  
    #contenido h1 { /* Menú de navegación */
	  background:url(img/colDer/titulos_background.png) repeat-x;
	  height:28px; /* 34px */
	  font:bold 18px Arial, Helvetica, sans-serif;
	  padding-left:35px;
	  padding-top:7px;
	  margin-left:-20px;
	  margin-right:15px;
	  border-left:1px solid #d88427;
	  border-right:1px solid #d88427;
	  position:relative;
	  margin-top:20px;
  }
  
  #contenido h1 .curvatura { /* <div> Curvatura (position absolute) */
	position:absolute;
	left:-2px;
	top: 35px;
  }
  
  #contenido h1 a { color:black; } /*  Links */
  
  #contenido_wrapper { /* <div> Crea un padding izquierdo */
	  padding-left:33px;
	  padding-bottom:20px;
  }
  
/* FOOTER */
#footer {
	background:url(img/footer/background.jpg) repeat-x  #6b0b00;
	border:1px solid #d88427;
	height:69px;
	color:white;
	position:relative;
}

#footer p { /* La dirección */
	margin:15px 0 0 15px;
}

#footer span, #footer a { color: #f2d243 } /* Links */

#footer #tripulacion { /* http://www.tripulacionweb.com*/
	position:absolute;
	right:4px;
	bottom:2px;
	font-size:12px;
}

/* ----------------------------------
	SECCIONES / ESTILOS GENERALES 
----------------------------------- */
  .titulo { /* <div> Sostiene diversos títulos (imágenes) */
     margin:20px 0 20px 0;
  }
  
  .division { /* <div> Agrega una divisón */
	  background:url(img/s_general/division.png) no-repeat 50% 50%;
	  height:2px;
	  margin-bottom:20px;
  }
  
  #migajas { /* <div> Las migajas (KIMIKOLOR » Nuestros Proyectos) */
	  color:#535353;
	  font-size:14px;
	  margin-top:2px;
  }
  
     #migajas a { color:#535353; font-weight:bold; }
 
  
/* ----------------------------------
	SECCIONES ESPECIFICAS
----------------------------------- */
/* INDEX (index.php) */
  #flash_index { /* <div> Sostene la animación de la página princial */
	  margin-top:15px;
  }
  
  #s_index #imagen_circulo { /* <div> La imagen de la derecha (circular) */
	  float:right;
  }
  
  #s_index p { /* El texto de bienvenida */
	  font-size:14px;
	  width:252px;
	  text-align:justify;
  }
  
/* PROYECTOS (proyectos.php) */
#s_proyectos {
}

   #s_proyectos table { /* La tabla principal */
	   border-collapse:collapse;
	   width:100%;
	   text-align:center;
   }
   
   #s_proyectos table h3 { /*  Los títulos de las fotos */
	   font-size:14px;
   }
   
   #s_proyectos table td { /* Los <td> */
	   padding-bottom:35px;
   }
   
   #s_proyectos table img { /* Imágenes con borde */
	   border:1px solid #595959;
   }
   
   #s_proyectos table a { color:black; } /* Links */
  
  
/* CONTACTO (contacto.php) */
#s_contacto {
}

   #s_contacto table {
	   border-collapse:collapse;
	   width:100%;
   }
   
   #s_contacto label {
	   display:block;
   }
   
   #s_contacto form .text { /* <input> los textos */
	   width:253px;
	   background:#f3d144;
	   border:2px solid #d2833b;
   }
   
   #s_contacto table td {
	   padding-bottom:20px;
   }
   
   #s_contacto textarea { /* El <textarea> */
	   width:529px;
	   background:url(img/s_contacto/textarea_background.jpg) no-repeat 100% 100%  #f3d144;
	   border:2px solid #d2833b;
	   height:232px;
   }
   
   #s_contacto .submit { /* <input> El botón "submit" */
	   background:#fcf2ce;
	   border:2px solid #d2833b;
	   font:bold 14px Calibri,Arial, Helvetica, sans-serif;
   }
   
   #s_contacto p {
	   margin-bottom:20px; /* Los párrafos */
   }
   
   #s_contacto p a { color:#ba2c08; } /* Links */
   
   #s_contacto p.ok { background:#B8E987;padding:10px; border:1px solid #060; } /* Mensaje OK */
   #s_contacto p.error { background:#981A07;padding:10px; border:1px solid #6F0000; color:white;} /* Mensaje ERROR */
 
 
 
 
 /*  PRODUCTOS (productos.php?cat=25) */
 #s_productos {
 }
 
    #s_productos .titulo2 { /* <div> El título (en ves de imagen) */
		font:italic bold 30px Calibri,Arial, Helvetica, sans-serif;
		color:#b21500;
		margin:20px 0 20px 0;
	}
 
   #s_productos .color1 { background:#f1f1f1; } /* Backgrounds */
   #s_productos .color2 { background:#fbfbfb; } 
 
    #s_productos .producto { /* <table> El producto */
		border:1px solid #bebebe;
		margin-top:-1px;
		width:100%;
	}
	
	#s_productos .thumb { /* <td> La imagen*/
		width:100px;
		height:100px;
		padding:7px;
		text-align:center;
	}
	
	   #s_productos .thumb img { border:none; } 
	
	#s_productos h2 { /* El título */
	}
	
	   #s_productos h2 a { color:black; } /* Links */
	   #s_productos h2 a:hover { text-decoration:underline; }
	
	#s_productos .codigo { /* <div> El código */
		margin-top:-5px;
	}
	
	#s_productos span { /* Paginación, la página actual */
		color:#B21500;
		font-size:20px;
	}
	
	#s_productos p a { color:#ba2c08; } /* Links */
	
	
	
 /* PRODUCTOS (productos.php?cat=25&id=560) */
 #s_productos2 {
 }
 
    #s_productos2 .titulo2 { /* <div> El título (en ves de imagen) */
		font:italic bold 30px Calibri,Arial, Helvetica, sans-serif;
		color:#b21500;
		margin:20px 0 20px 0;
	}
	
	#s_productos2 table { /* Sostien el producto */
	margin-bottom:20px;
	}
	
	#s_productos2 #pdf { /* <div> "Descargar Ficha Técnica" */
		background:url(img/s_productos/icon-pdf.png) no-repeat 0% 50%;
		padding:8px 0 8px 40px;
		margin-bottom:10px;
	}
	
	   #s_productos2 #pdf a { color:#c24511;font:12px Tahoma, Geneva, sans-serif; }
	   
	#s_productos2 #imprimir { /* <div> "Versión para Imprimir"*/
		background:url(img/s_productos/icon-impresora.png) no-repeat 5px 50%;
		padding:8px 0 8px 40px;
	}
	 
	    #s_productos2 #imprimir a { color:#c24511;font:12px Tahoma, Geneva, sans-serif; }
  
    #s_productos2 td.info {
		padding:5px;
	}
  
    #s_productos2 p {
		font:12px Calibri,Arial, Helvetica, sans-serif;
		text-align:justify;
	}
	
	   #s_productos2 p a { color:#ba2c08; } /* Links */
	   
	   
	   
 /*  MUESTRARIOS (muestrarios.php) */
 #s_muestrarios {
 }
 
    #s_muestrarios .titulo2 { /* <div> El título (en ves de imagen) */
		font:italic bold 30px Calibri,Arial, Helvetica, sans-serif;
		color:#b21500;
		margin:20px 0 5px 0;
	}
	
  #s_muestrarios .division { /* <div> Agrega una divisón */
	  background:url(img/s_general/division.png) no-repeat 50% 50%;
	  height:2px;
	  margin-bottom:20px;
	  margin-top:20px;
  }
	
	#s_muestrarios p a { color:black; } /* Links */
	
	#s_muestrarios p a span { color:#b21500; }
	
   #s_muestrarios table { /* La tabla principal */
	   border-collapse:collapse;
	   width:100%;
	   text-align:center;
   }
   
   #s_muestrarios table h3 { /*  Los títulos de las fotos */
	   font-size:14px;
   }
   
   #s_muestrarios table td { /* Los <td> */
	   padding-bottom:35px;
   }
   
   #s_muestrarios table img { /* Imágenes con borde */
	   border:1px solid #595959;
   }
   
   #s_muestrarios table a { color:black; } /* Links */