/* ---------------------------------------------------
	
	Cliente: Clement y Asoc. - http://www.clement.com.ar

	Hoja de estilos: default.css
    Media: screen
    Versión: 2.0rc1
	
	Autor
    Alejandro Prieto
    ABC Comunicación
    http://www.abccomunicacion.com
    info@abccomunicacion.com
	
	Índice
    Reseteo
    Estilos generales
    Diagramación y estructura
    Diseño
    Navegación
    Formularios
	
	Colores
    blanco: #fff
    cyan: #09d
    gris fondo: #bac3c8
    gris medio (bajadas): #c9d0d5
    gris oscuro (titulos): #34373c
    gris claro (textos): #68737a
    ---
    links: #09d; #68737a; #00b0ff
    menus: #d8dee2; #818c93;
    sombra: #0083bd
    	
/* ---------------------------------------------------
	Reseteo
------------------------------------------------------ */

html,body,div,span,
applet,object,iframe,
h1,h2,h3,h3,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	line-height: 1;
	font-family: inherit;
	text-align: left;
}
html, body {
	height: 100%;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
ol,ul {
	list-style: none;
}
a img, :link img, :visited img {
	border:none
}
q:before, q:after,
blockquote:before, blockquote:after {
	content: "";
}

/* ---------------------------------------------------
	Estilos generales
------------------------------------------------------ */

body {
	background: #bac3c8 url(../imagenes/fnd-sup-body.png) repeat-x top left;
	font: 100% /*"Lucida Grande", */"Trebuchet MS", Genevea, Helvetica, sans-serif;
	color: #000;
	margin-top:-12px;
}
h1{
  padding-bottom: 14px;
  font-size: 32px;
  color: #fff;
  /*text-shadow: #333 2px 2px 4px;*/
}
h2 {
  font-size: 18px;
}
h2, h3, h4, th, dt, label {
  color: #34373c;
}
h3, h4, p, ol, ul, dl, td, li, dt, dd, label, span {
  font-size: 14px;
  line-height: 1.5;
}
p, ol, ul, dl, td {
  color: #68737a;
}
blockquote *, cite {
  font-style: italic;
}
cite {
  font-size: 12px;
}
sup {
  font-size: 14px;
}
small {
  font-size: 12px;
}
p.bajada {
  font-size: 18px;
  line-height: 1.2;
  color: #c9d0d5;
}
th, td {
  padding: 4px;
}
th {
  border-bottom: 2px solid #09d;
}
tr.impar {
  background: #eee;
}
tbody tr:hover {
  background: #ccebf8;
}
form {
}
label {
  display: block;
}
input {
}
select {
}
a {
}
a:link {
	color: #09d;
}
a:visited {
	color: #68737a;
}
a:hover{
  color: #00b0ff;
}

/* ---------------------------------------------------
	Diagramación y estructura
------------------------------------------------------ */
#principal {
  width: 914px;
  margin: 0 auto;
}
.logos {
  width: 100%;
}
.logos div {
  float: left;
  width: 50%;
  padding: 20px 0 8px;
}
#contenido {
  clear: both;
	background: #fff url("../imagenes/fnd-titulo.png") repeat-x;
}
#contenido:after {
  clear: both;
  display: block;
  height: 0px;
  content: ".";
  visibility: hidden;
}
#portada {
  clear: both;
  background: #fff;
}
.menu_izq, 
.sidebar {
  float: left;
  width: 290px;
}
.titulo {
  height: 145px;
  padding: 24px 78px 0 318px;
}
.textos {
  padding: 20px 78px 20px 28px;
  margin-left: 290px;
}
.tituloMemo {
  padding: 20px 78px 0px 20px;
  /*margin-left: 290px;*/
}

#pie {
	clear: both;
	margin-bottom: 20px;
  padding: 8px 12px;
  background: #d8dee2 url(../imagenes/fnd-pie.png) no-repeat bottom;
}
body.meta #contenido, 
body.operaciones #contenido {
	background-position: 0 -85px;
}
body.meta .titulo, 
body.operaciones .titulo {
  height: 60px;
}

/* ---------------------------------------------------
	Diseño
------------------------------------------------------ */

/*--- Encabezado ---*/
.logo-sgs {
  text-align: right;
}
.logo-clement {
	margin-top:10px;
}
/*--- Contenido ---*/
.contenido {
}

/*--- Textos ---*/
.titulo {
  background-repeat: no-repeat;
}
.textos * {
  margin-bottom: 18px;
}
.textos h3, .textos dt, label, input {
  margin-bottom: 0 !important;
}
.textos ul {
  list-style: disc;
}
.textos ul.sedes {
  list-style: none;
}
.textos li, .textos strong, .textos em, .textos a, .textos cite {
  margin-bottom: 0;
}
.textos strong {
	font-weight: bold;
}

/*--- Pie ---*/
#pie p, 
#pie li, 
#pie a {
  font-size: 12px;
}
#pie p {
}
#pie li {
  display: inline;
  margin-right: 8px;
}

/*--- Portada ---*/
#galeria {
  position: relative;
  overflow: hidden;
  width: 914px;
	height: 330px;
  background: url(../imagenes/fnd-portada-galeria.png) repeat-x;
}
#galeria .items {
  position: relative;
  left: 0;
  top: 0;
  width: 100%;
  list-style-type: none;
}
#galeria .panel {
  position: relative;
  float:left;
  width: 914px;
  height: 100%;
}
#galeria .panel .item {
  padding: 30px 70px;
}
#galeria .item div {
  margin-left: 404px;
}
#galeria .item h1 {
  padding: 0;
  font-size: 22px;
  text-transform: uppercase;
}
#galeria .item p {
  color: #c9d0d5;
}
#galeria strong {
	font-weight: bold;
  color: #fff;  
}
#galeria em {
	font-style: italic;
}
#galeria .item dl {
  float: left;
}
#galeria .item dd {
  font-size: 10px;
}
/*
#galeria .item p.link {
  padding-left: 4px;
  background: url(../imagenes/link-portada.png);
}
#galeria .item a {
  display: block;
  margin-top: 28px;
  padding: 6px 0 6px;
  font-size: 14px !important;
  text-decoration: none;
}
*/
.preloader {
  overflow: scroll
  width: 100%;
}
.preloader .loading {
  height: 330px;
  margin: 150px 0 0;
  text-align: center
}
.prev, .next {
  position: absolute;
  top: 139px;
}
.prev {
  left: 14px;
}
.next {
  right: 14px;
}
.prev a, .next a {
  display: block;
  overflow: hidden;
  text-indent: -9000em;
  width: 36px;
  height: 36px;
}
.prev a {
  background: url('../imagenes/btn-portada-prev.png');
}
.next a {
  background: url('../imagenes/btn-portada-next.png');
}
.prev a:hover {
  background: url('../imagenes/btn-portada-prev-hover.png');
}
.next a:hover {
  background: url('../imagenes/btn-portada-next-hover.png');
}
.secciones {
  background: url(../imagenes/fnd-menu-izq.png) repeat-y  60px;
}
.seccion {
  float: left;
  width: 268px;
  height: 100%;
  min-height: 100%;
  margin-left: 7px;
  padding: 14px 0;
}
.seccion p {
  font-size: 12px;
}
.seccion a, .more-link {
  padding-right: 14px;
  text-decoration: none;
  color: #09d;
  background: url(../imagenes/flecha.png) no-repeat right;
}
.seccion a:hover {
  text-decoration: underline;
}
.seccion.infocomex, .seccion.bdigital {
  width: 329px;
  min-height: 100%;
  height: 100%;
  margin-left: 0;
  padding-left: 14px;
  padding-right: 7px;
}
.seccion.destacado {
  width: 200px;
}
.seccion h1 {
  padding-bottom: 4px;
  font-size: 18px;
  color: #34373c;
}
.noticia {
  margin-bottom: 14px;
}
.noticia h2 {
  font-size: 14px;
  line-height: 1.5;
}
.noticia p, .noticia a {
  font-size: 12px;
}
.noticia .fecha {
  font-size: 10px;
}
.suscripcion {
  padding: 14px 4px 14px 42px;
  background: #ccebf8 url(../imagenes/rss-big.png) no-repeat 6px 6px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}
.suscripcion a {
  padding: 0;
  text-decoration: none;
  background: none;
}
.suscripcion .rss {
  color: #34373c;
}
.suscripcion .ayuda {
  font-size: 12px;
  font-style: italic;
  color: #68737a;
}
.destacado {
	margin-bottom: 12px;
}
.secciones:after {
  content: ".";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}
/*--- Varios ---*/
.imagenes {
	float: left;
}
/*--- Operaciones ---*/
.aviso-ie {
  padding: 4px;
  background: #ffc;
}
.error {
  padding: 4px;
  color: #c00;
}
.salir {
  display: block;
  float: right;
  padding-right: 14px;
  text-decoration: none;
  color: #09d;
  background: url(../imagenes/flecha.png) no-repeat right;
}
.op {
  padding: 20px 20px 28px;  
}
.op form {
  margin-bottom: 18px;
}
.op form div {
  margin-bottom: 8px;
}
.op form label, .op dl dt {
  float: left;
  clear: left;
}
.op dl {
  clear: both;
}
.op dl:after {
  clear: left;
  display: block;
  visibility: hidden;
  height: 0;
  content: ".";
}
.op table {
  width: 100%;
}
.op table * {
  font-size: 14px;
}

/*--- Meta ---*/
#mapa-sitio {
  background: #d8dee2;  
}
#mapa-sitio, #mapa-sitio ul {
  -webkit-border-radius: 8px;
  list-style: none;
}
#mapa-sitio a{
  text-decoration: none;
}
#mapa-sitio li {
  padding: 4px;
}
#mapa-sitio li ul {
  background: #c9d0d5;
}
#mapa-sitio li ul li ul {

}

/* ---------------------------------------------------
	InfoComex
------------------------------------------------------ */

/*--- Sidebar ---*/
.sidebar {
}
.widgets {
	margin-bottom: 14px;
  padding-bottom: 14px;
	background: url(../imagenes/fnd-base-menu-izq.png) no-repeat bottom;
}
.widgets ul {
	padding-top: 14px;
	background: url(../imagenes/fnd-menu-izq.png);
}
.widgets ul li ul {
	padding-top: 0;
}
.widgets h2  {
  padding: 10px 12px 8px;
  text-transform: uppercase;
  background: url(../imagenes/fnd-btn.png) no-repeat right;
  color: #09d;
}
.widgets h2, 
.widgets li, 
.widgets div, 
.widgets form{
  display: block;
  font-size: 12px;
  text-align: right;
}
.widgets li ul li {
  padding: 4px 12px 4px;
  color: #818c93;
}
.widgets li a, 
.widgets li a:visited {
  text-decoration: none;
  color: #818c93;
}
.widgets li a:hover{
  text-decoration: underline;
  color: #09d;
}
.sidebar .suscripcion {
	margin-left: 14px;
}
.sidebar .suscripcion a {
	font-size: 12px;
}

/*--- Posts ---*/
.post {
	margin-bottom: 28px;
	padding-bottom: 14px;
	border-bottom: 1px solid #d8dee2;
}
.post h2 {
  line-height: 1.25;
  margin-bottom: 7px;
}
.post h3 {
  font-size: 16px;
}
.post div {
  color: #68737a;
}
.post a, 
.post a:visited {
  text-decoration: none;
  color: #09d;
}
.post a:hover {
  text-decoration: underline;
}
.post h2 a, .post h2 a:visited, 
.post h3 a, .post h3 a:visited {
  color: #34373c;
}
.post h2 a:hover, 
.post h3 a:hover {
  color: #09d;
}
.post .fecha, 
.post .postmetadata {
  font-size: 12px;
  margin: 0;
}
.post .autor {
  font-size: 14px;
}
.post dl.autormetadata * {
  margin: 0;
  font-size: 12px;
}
.post dl.autormetadata dt {
  color: #34373c;
}
.post img {
	float: left;
	margin-right: 12px;
}
.hresume {
	min-height: 100px;
	color: #68737a;
  font-size: 12px;
}
.hresume span {
  font-size: 12px;
}
.hresume .photo {
	float: left;
	margin-right: 12px;
}
.hresume .fn {
	color: #34373c;
}
.hresume :after {
  clear: left;
  display: block;
  height: 0px;
  content: ".";
  visibility: hidden;
}
.navegacion {
	text-align: center;
}
.navegacion a {
	margin-right: 14px;
	font-size: 14px;
	text-decoration: none;
}

/*--- Comentarios ---*/
#comentarios {
  margin-top: 18px;
}
.commentlist li * {
  margin: 0;
}
.commentlist li {
  position: relative;
  padding: 8px 0 10px 48px;
}
.commentlist li.alt {
  /* background: #e5e5e5; */
}
.commentlist img.avatar {
  position: absolute;
  margin: 0 0 0 -48px;
  padding: 4px;
  border: 1px solid #c9d0d5;
  background: #fff;
}
.commentmetadata {
  font-size: 12px;
}
#commentform * {
  margin-bottom: 0;
}
#commentform p {
  margin-bottom: 6px;
  line-height: normal;
}
#commentform label {
  font-size: 12px;
}

/* ---------------------------------------------------
	Navegación
------------------------------------------------------ */

/*--- Menu principal ---*/
.menu {
  clear: both;
  height: 37px;
  width: 100%;
  padding: 0 8px;
  background: url(../imagenes/fnd-menu.png) no-repeat;
}
.menu li {
	float: left;
}
.menu a {
	display: block;
	padding: 9px 12px 8px;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: #333 2px 2px 2px;
	font-size: 16px;
	letter-spacing: .2ex;
	color: #d8dee2;
}
.menu a:hover {
  background: url(../imagenes/fnd-btn-hover.png);
	color: #fff;
}
.inicio .menu a.inicio {
  background: url(../imagenes/fnd-btn-activo.png) repeat-x top left;
  color: #fff;
	text-shadow: #0083bd 2px 2px 2px;
}
body.inicio a#inicio,
body.empresa a#empresa, 
body.servicios a#servicios, 
body.tecnologia a#tecnologia, 
body.infocomex a#infocomex,
body.biblioteca-virtual a#biblioteca-virtual, 
body.operaciones a#operaciones {
  background: url(../imagenes/fnd-btn-activo.png) repeat-x top left;
  color: #fff;
	text-shadow: #0083bd 2px 2px 2px;
}
/*--- Submenu ---*/

.submenu {
  float: right;
  margin-top: -26px;
  margin-right: 8px;
}
.submenu li {
	float: left;
}
.submenu a {
	font-size: 12px;
	display: block;
	padding: 0 6px;
	text-decoration: none;
	color: #d8dee2;
}
.submenu a:hover {
	color: #fff;
}

/*--- Menu izquierda ---*/

.menu_izq {
	background: url(../imagenes/fnd-menu-izq.png) repeat-y;
}
.menu_izq ul {
  padding: 14px 0;
	background: url(../imagenes/fnd-base-menu-izq.png) no-repeat bottom;
}
.menu_izq ul li a{
  display: block;
  padding: 10px 12px 8px;
  font-size: 12px;
  text-align: right;
  text-decoration: none;
  text-transform: uppercase;
  color: #818c93;
}
.menu_izq ul li a:hover{
  color: #09d;
}
.menu_izq ul li.seleccionado a  {
  background: url(../imagenes/fnd-btn.png) no-repeat right;
  color: #09d;
}
.menu_izq ul li a span {
  text-transform: none;
  line-height: inherit;
  font-size: inherit;
}

/* ---------------------------------------------------
	Temas
------------------------------------------------------ */

.capital-humano {
  background-image: url(../imagenes/capital-humano.jpg);
}
.certificaciones {
  background-image: url(../imagenes/iso_9001_2008.png);
}
.confidencialidad {
  background-image: url(../imagenes/tecnologia-01.jpg);
}
.estructura {
  background-image: url(../imagenes/sedes.jpg);
}
.paso-sf {
  background-image: url(../imagenes/paso-san-fco.jpg);
}
.management {
  background-image: url(../imagenes/management.jpg);
}
.sobre {
  background-image: url(../imagenes/vision-corporativa.jpg);
}
.logistica {
  background-image: url(../imagenes/coordinacion-logistica.jpg);
}
.despacho {
  background-image: url(../imagenes/despacho-impo-expo.jpg);
}
.outsourcing {
  background-image: url(../imagenes/outsourcing.jpg);
}
.pymex {
  background-image: url(../imagenes/pymex.jpg);
}
.tecno, div.meta {
  background-image: url(../imagenes/tecnologia-01.jpg);
}
.avisos {
  background-image: url(../imagenes/tecnologia-02.jpg);
}
.biblioteca {
  background-image: url(../imagenes/tecnologia-01.jpg);
}
.consulta {
  background-image: url(../imagenes/tecnologia-02.jpg);
}
.comex {
  background-image: url(../imagenes/tecnologia-01.jpg);
}
.generico {
  background-image: url(../imagenes/vision-corporativa.jpg);
}
div.meta {
  background-position: left center;
}
