/*
Notes

header: 960 * 98

unacol: 320
doscol: 640

naranja: #FCB131
Helvetica Neue LT Std 45Light
36pt titulares
12pt textos       


ToC

	1. defaults
	2. structure
	3. links and navigation
	4. fonts
	5. images

Notes

	thumbs: 239 * 104

*/	

/* --------- 1. defaults  --------- */

* {
		margin: 0;
		padding: 0;	
		}

html {
     	overflow: -moz-scrollbars-vertical;
     	overflow-y: scroll;
		
		}


body {
		background-color: #fff;
		color: #333333;
		
		}

/* --------- 2. strucutre  --------- */

#header {		
		background-color: #f7b322;
		height: 98px;	
		}

.wrapper {
		width: 915px;
		margin: 0 auto;	
		position: relative;
		}

#content {		
		clear: both;
		}		
		
#footer {
		clear: both;		
		padding-top: 7px;
		margin-top: 12px;		
		}

.unacol-proy {
		width: 240px;
		text-align: right;
		float: left;				
		}

.unacol {
		width: 231px;
		text-align: right;
		float: left;
		padding-left: 8px;
		overflow: hidden;	
		}
		
.doscol {
		width: 605px;
		padding: 38px 0;
		float: left;
		border-bottom: 1px dotted #666666;
		margin-left: 33px;
		}
		
.doscol-index {
		width: 605px;
		padding: 38px 0;
		margin-left: 33px;
		float: left;
		border-bottom: 1px dotted #666666;		
		}

.doscol-logos {
		width: 605px;
		padding: 38px 0;
		float: left;
		border-bottom: 1px dotted #666666;
		margin-left: 273px;
		}
		
.doscol-blog {
		width: 605px;
		padding: 6px 0 7px 0;
		float: left;
		border-bottom: 1px dotted #666666;
		margin-left: 273px;
		}

.doscol-capacitacion {
		width: 605px;
		padding: 38px 0 2px;
		float: left;
		border-bottom: 1px dotted #666666;
		margin-left: 38px;
		}

.doscol .titulo {
		margin-bottom:;
		}
		
cuatrocol {
		position: relative;
		}

.proyects {
		margin: -32px 0 -20px -130px;
		}

.proyects ul li a {
		color: #e39002;
		}
		
.dummy {
		width: 119px;
		height: 98px;
		float: left;
		/*background-color: #999;*/
		margin-right: 2px;
		margin-bottom: 2px;
		display: block;
		position: relative;
		}

.dummy a:hover {
		cursor: default;
		}

.dummy a.destino:hover {
		cursor: pointer;
		}

a.dummyb span {
		width: 119px;
		height: 98px;
		/*float: left;
		background-color: #999;
		margin-right: 2px;
		margin-bottom: 2px;*/
		display: block;
		}
		
.producto {
		border-bottom: 1px dotted #666666;
		margin-bottom: 24px;
		padding-bottom: 24px;
		float: left;
		width: 605px;
		}

.description {
		float: left;
		width: 240px;
		text-align: right;
		}

.dautor {
		clear: both;
		}

.dautor .unacol {
		
		}

.dautor.last {
		border-bottom: none;
		}

.dautor img {
		margin-bottom: 12px;
		}


.social {
		position: absolute;
		right: 39px;
		top: 58px;
		}
		
.social a {
		float: left;
		display: block;
		width: 18px;
		height: 18px;
		text-indent: -10000px;
		
		}

.social a.tw {
		margin-right: 4px;
		background: url(../imgs/layout/logo-tw.png) 0 0 no-repeat;
		}

.social a.fb {
		background: url(../imgs/layout/logo-fb.png) 0 0 no-repeat;
		}
.social a.tw:hover, .social a.fb:hover { background-position: 0 -18px; } 



/* ----- grid clientes ----- */
.amalaia {
		background: url(../clientes/amalaia.gif) 0 0 no-repeat;
		}
.amalaia:hover {
		background: url(../clientes/amalaia.gif) 0 -98px no-repeat;
		}
.bivaq {
		background: url(../clientes/bivaq.gif) 0 0 no-repeat;
		}
.bivaq:hover {
		background: url(../clientes/bivaq.gif) 0 -98px no-repeat;
		}
.destinos {
		background: url(../clientes/destinos.gif) 0 0 no-repeat;
		}
.destinos:hover {
		background: url(../clientes/destinos.gif) 0 -98px no-repeat;
		}
.electron {
		background: url(../clientes/electron.gif) 0 0 no-repeat;
		}
.electron:hover {
		background: url(../clientes/electron.gif) 0 -98px no-repeat;
		}
.electroquimica {
		background: url(../clientes/electroquimica.gif) 0 0 no-repeat;
		}
.electroquimica:hover {
		background: url(../clientes/electroquimica.gif) 0 -98px no-repeat;
		}
.graetz {
		background: url(../clientes/graetz.gif) 0 0 no-repeat;
		}
.graetz:hover {
		background: url(../clientes/graetz.gif) 0 -98px no-repeat;
		}
.kafka {
		background: url(../clientes/kafka.gif) 0 0 no-repeat;
		}
.kafka:hover {
		background: url(../clientes/kafka.gif) 0 -98px no-repeat;
		}
.mundolana {
		background: url(../clientes/mundolana.gif) 0 0 no-repeat;
		}
.mundolana:hover {
		background: url(../clientes/mundolana.gif) 0 -98px no-repeat;
		}
.nike {
		background: url(../clientes/nike.gif) 0 0 no-repeat;
		}
.nike:hover {
		background: url(../clientes/nike.gif) 0 -98px no-repeat;
		}
.UD {
		background: url(../clientes/cdu.gif) 0 0 no-repeat;
		}
.UD:hover {
		background: url(../clientes/cdu.gif) 0 -98px no-repeat;
		}
.olaso {
		background: url(../clientes/olaso.gif) 0 0 no-repeat;
		}
.olaso:hover {
		background: url(../clientes/olaso.gif) 0 -98px no-repeat;
		}
.labelle {
		background: url(../clientes/labelle.gif) 0 0 no-repeat;
		}
.labelle:hover {
		background: url(../clientes/labelle.gif) 0 -98px no-repeat;
		}
.pharmaco {
		background: url(../clientes/pharmaco.gif) 0 0 no-repeat;
		}
.pharmaco:hover {
		background: url(../clientes/pharmaco.gif) 0 -98px no-repeat;
		}
.ueu {
		background: url(../clientes/ueu.gif) 0 0 no-repeat;
		}
.ueu:hover {
		background: url(../clientes/ueu.gif) 0 -98px no-repeat;
		}
.unionlatina {
		background: url(../clientes/unionlatina.gif) 0 0 no-repeat;
		}
.unionlatina:hover {
		background: url(../clientes/unionlatina.gif) 0 -98px no-repeat;
		}
.servimedic {
		background: url(../clientes/servimedic.gif) 0 0 no-repeat;
		}
.servimedic:hover {
		background: url(../clientes/servimedic.gif) 0 -98px no-repeat;
		}
.szames {
		background: url(../clientes/szames.gif) 0 0 no-repeat;
		}
.szames:hover {
		background: url(../clientes/szames.gif) 0 -98px no-repeat;
		}

.winteka {
		background: url(../clientes/winteka.gif) 0 0 no-repeat;
		}
.winteka:hover {
		background: url(../clientes/winteka.gif) 0 -98px no-repeat;
		}

.coleme {
		background: url(../clientes/coleme.gif) 0 0 no-repeat;
		}
.coleme:hover {
		background: url(../clientes/coleme.gif) 0 -98px no-repeat;
		}
.cceau {
		background: url(../clientes/cceau.gif) 0 0 no-repeat;
		}
.cceau:hover {
		background: url(../clientes/cceau.gif) 0 -98px no-repeat;
		}

.mujer {
		background: url(../clientes/imujer.gif) 0 0 no-repeat;
		}
.mujer:hover {
		background: url(../clientes/imujer.gif) 0 -98px no-repeat;
		}

.im {
		background: url(../clientes/im.gif) 0 0 no-repeat;
		}
.im:hover {
		background: url(../clientes/im.gif) 0 -98px no-repeat;
		}

.molino {
		background: url(../clientes/molino.gif) 0 0 no-repeat;
		}
.molino:hover {
		background: url(../clientes/molino.gif) 0 -98px no-repeat;
		}

/* ----- //grid clientes ----- */

a.destino {
		position: absolute;
		margin-top: -33px;
		margin-left: 89px;
		display: block;
		width: 32px;
		height: 19px;
		text-indent: -10000px;
		display: block;
		background: url(../imgs/layout/info-02.png) 0 0 no-repeat;
		}
		
.logo {
		float: left;
		
		margin-right: 0px;
		}
		
.modulos a {
		text-decoration: none;
		color: #333333;
		}

.modulos a:hover {
		color: #999999;
		}

/* --------- 3. links and navigation  --------- */

a.extlink {text-decoration: none;}

a.extlink:hover {text-decoration: underline;}

ul.recursos {
		list-style: none;
	}

ul.recursos a {
		text-decoration: none;
		font-size: 12px;
	}

ul.recursos a:hover {
		text-decoration: underline;
	}

.navigation {
		padding-top: 58px;
		margin-left: 124px;
		float: left;	
		}
		.navigation li {
				float: left;
				list-style-type: none;
				margin-right: 12px;
				padding-right: 12px;
				border-right: 1px solid #333;
				}
		.navigation li:last-child {			
				border-right: none;
				margin-right: 0;
				padding-right: 0;
				}
		.navigation li:last-child {			
				
				}
				
		.navigation li a {
				color: #333333;				
				font-style: normal;	
				text-decoration: none;
			}
		.navigation li a:hover {			
				color: #ffffff;
				}
		.navigation li.active {
				color: #ffffff;
				font-weight: normal;
				font-style: normal;
				}

ul#capacitacion li a {
		color: #333333;
		}

ul#capacitacion li a:hover {
		color: #999999;
		}

.activo {
		color: #999999;
		}

ol.modulos li a {
		color: #333333;
		}

ol.modulos li a:hover {
		color: #999999;
		}

ul#thumbs li {
		float: left;
		list-style-type: none;
		display: block;
		overflow: hidden;
		width: 240px;
		height: 484px;
		}
		
		ul#thumbs li#quienes-somos {
			background: url(../imgs/layout/th-quienes-somos.jpg) 0 0 no-repeat;	
		}
		ul#thumbs li#quienes-somos:hover {
			background: url(../imgs/layout/th-quienes-somos.jpg) 0 -484px no-repeat;	
		}
		ul#thumbs li#trabajos-realizados {
			background: url(../imgs/layout/th-trabajos-realizados.jpg) 0 0 no-repeat;	
		}
		ul#thumbs li#trabajos-realizados:hover {
			background: url(../imgs/layout/th-trabajos-realizados.jpg) 0 -484px no-repeat;	
		}
		ul#thumbs li#proyectos {
			background: url(../imgs/layout/th-proyectos.jpg) 0 0 no-repeat;	
		}
		ul#thumbs li#proyectos:hover {
			background: url(../imgs/layout/th-proyectos.jpg) 0 -484px no-repeat;	
		}
		ul#thumbs li#contacto {
			background: url(../imgs/layout/th-contacto.jpg) 0 0 no-repeat;	
		}
		ul#thumbs li#contacto:hover {
			background: url(../imgs/layout/th-contacto.jpg) 0 -484px no-repeat;	
		}

ul#grid {
		list-style: none;
		}

ul#capacitacion {
		list-style: none;
		font-size: 1.7em;	
		padding-top: 58px;;	
		}

ul#capacitacion a {
		text-decoration: none;
		}

ol.modulos {
		margin-bottom: 28px;
		padding-bottom: 14px;
		border-bottom: 1px dotted #666666;
		}

ol.modulos li {
		font-size: 1.4em;
		margin-top: 7px;
		margin-left: 18px;
		}

ol.modulos li a {
		text-decoration: none;
		float: left;
		}

.proyects ul li {
		list-style-type: none;
		float: left;
		
		}
.proyects ul li a {		
		text-decoration: none;
		margin-right: 12px;
		position: relative;
		display: block;
		}
		
.proyects ul li a:hover {		
		color: #666666;
		}

.proyects ul li a span {		
		position:absolute;
		top:0;
		left:0;
		height:100%;
		width:100%;
		z-index:100;
		cursor: pointer;		
		}

li a.prev {		
		background: url(../imgs/layout/_prev.jpg) 1px 3px no-repeat;
		width: 15px;
		height: 14px;
		}
li a.next {
		background: url(../imgs/layout/_next.jpg) 0px 3px no-repeat;
		width: 15px;
		height: 14px;
		}
		
li a.prev:hover {
		background: url(../imgs/layout/_prev.jpg) 1px -10px no-repeat;
		}
		
li a.next:hover {
		background: url(../imgs/layout/_next.jpg) 0px -10px no-repeat;
		}


#uno, #dos, #tres, #cuatro, #cinco, #seis, #siete, #ocho {
		padding-bottom: 14px;
		border-bottom: 1px dotted #666666;
		margin-bottom: 26px;
		}

.arriba {
		font-size: 1em;
		text-align: right;
		}
	
.arriba a {
		text-decoration: none;
		color: #e39002;
		
		}



/* --------- 4. fonts  --------- */



html {
		font-size: 100%;
		}

body {
		font-size: 62.5%;
		font-family: "Open sans",  Helvetica, Arial, sans-serif;
		}

h1, h2, h3, h4 {
		font-weight: normal;
		}

h1 {
		font-size: 3em;
		}

h2 {
			
		}

h3 {
		font-size: 3em;	
		margin: 24px 0 10px;
		line-height: 30px;
		}

h3.first {
		margin-top: -25px;
		margin-bottom: 10px;
		}

h3.first-index {
		margin-top: -45px;
		margin-left: -1px;
		}

h3.title {
		margin: 31px 0 12px;
		line-height: 1em;
		}

		
.unacol h3 {
		padding-top: 3px;
		}

.dautor .unacol h3 {
		padding-top: 2px;
		}

.dautor .unacol h3 {
		line-height:31px; 
		padding-top:8px; 
		margin-top: 24px;
		margin-bottom: 10px;
		}
		
h4 {
		font-size: 2.2em;	
		line-height: 1em;	
		margin: 12px 0 17px; 0;	
		}
		
.recursos h4 {
		margin-top: 20px;
		margin-bottom: 12px;
		}

.cursos {
		margin-bottom: 24px;
		}

	.cursos .modulos {		
		
		}
.sub {
		margin-top: 12px;
		}

h5 {
		font-size: 1.8em;
		font-weight: normal;		
		margin-top: 18px;			
		}

p {
		font-size: 1.4em;
		margin-bottom: 12px;
		}

p.top {
		margin-top: 7px;
		}

p.gone {
		text-indent: -10000px;
		}
		
p.intro {
		margin-top: 6px;
		}
		
p.autor {
		margin-bottom: -8px;
		}

.data {	
		font-size: 1.1em;
		line-height: 1.39em;
		padding-top: 186px;
		}
		
ul {
		font-size: 1.2em;
		}

.date {
		font-size:18px; 
		line-height:15px;
		margin-top: 12px; 
		}


/* --------- 5. images  --------- */

a img {
		border: none;
		}


#load {  
		display: none;  
		position: absolute;  
		right: 10px;  
		top: 10px;  
		background: url(imgs/layout//ajax-loader.gif);  
		width: 43px;  
		height: 11px;  
		text-indent: -9999em;  
		}

.icon {
		margin-top: 6px; 
		margin-left: 6px;
		}

.capacitacion {
		margin-top: 8px;		
		}

#pics-intro {
		width:603px;
		height: 251px;
		overflow: hidden;
		}

#veinte {
		width: 170px;
		height: 98px;
		overflow: hidden;
		margin-left: -21px;
		float: left;
		}


/* --------- 6. cycle plug-in  --------- */

#slideshow {overflow: hidden; }
#navigation { width: 240px; margin: 0px }
#navigation li { width: 70px; float: left; margin-right: 1px; list-style: none }
#navigation li img { width: 65px; margin:3px 1px 0 0; padding: 1px;list-style: none }
#navigation a { width: 67px; padding: 0px; display: block; /*border: 1px solid #ccc;*/ }
#navigation li.activeSlide a { background: #666666 }
#navigation a:focus { outline: none; }
#navigation  img { border: none; display: block }
  
.pics { height: 398px; width: 258px; padding:0; margin:0; overflow: hidden }
.pics img { 
		width: 258px; 
		height: 399px;	
		top:0; left:0; 
		}

#productos {
		margin-top: -1px;
		margin-left: 12px;		
		text-align: right;		
		}

.cliente img {
		margin-bottom: 18px;
		}



/* ---------- 7. form ---------- */

label {
		
		}

.textInput {
		width: 250px;
		margin-bottom: 12px;
		}

textarea {
		width: 254px;
		height: 150px;
		}

#feedback {
		margin-top: 8px;
		margin-bottom: 12px;
		}

#send {
		margin-top: 3px;
		}

.button {
		border: 1px solid #fcb131;
		background-color: #fcb131;
		color: #ffffff;
		padding: 5px 10px;
		
		}

.button:hover {
		color: #c7901b;
		border: 1px solid #fcb131;
		background-color: #ffffff;
		cursor: pointer;
		}



/* --------- 8. floating plug-in  --------- */

/* required to avoid jumping */
#commentWrapper { 
		left: 450px;
		position: absolute;
		margin-left: 35px;
		width: 280px;
		}
#comment {
		position: absolute;
		/*top: 10;	*/	
		margin-top: 20px;
		padding-top: 19px;
		}

#comment.fixed {
		position: fixed;
		top: 0;
		}