@import url("fonts.css");
/*  CSS definations for Union Group  */
/*-------------------------------------------------------------------------------------------

INDEX:

0. RESET

1. SETUP
	1.1 Defaults
	1.2 Common Tags

2. SITE STRUCTURE & APPEARANCE
	2.1 Logo
	2.2 Navigation
	2.3 Container
	2.4 Footer
-------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------*/
/* 0. RESET */
/*-------------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
*{
	outline:none;
}

/*-------------------------------------------------------------------------------------------*/
/* 1. SETUP */
/*-------------------------------------------------------------------------------------------*/
/* 1.1 Defaults */
h1, h2, h3, h4, h5, h6, strong {
	font-weight:bold;
}
i, em { 
	font-style:italic; 
}
.left {
	float:left;
}
.right {
	float:right;
}
.alignleft{
	text-align:left;	
}
.alignright{
	text-align:right;	
}
.aligncenter{
	text-align:center;	
}
.clear  {
	clear:both;
	line-height:1px;
	height:1px;
}
textarea{
	overflow:auto;
	font-family:Arial, Helvetica, sans-serif; /* Body Font Family Will Come Here */
}
a { 
	color:#333;
	text-decoration:none;
}
a:hover {
	color:#336699;
}
address {
	font-style:normal;
}

/* 1.2 Common Tags */

/*-------------------------------------------------------------------------------------------*/
/* 2. SITE STRUCTURE & APPEARANCE */
/*-------------------------------------------------------------------------------------------*/
body {
/*	background:url(../images/img_slide1.jpg) no-repeat top center;*/

	font-size:12px;
	color:#333;
	overflow-x:hidden;
	background-size:cover;
}
.box {
	width:845px;
	margin-left:70px;
}
.wrap {
	min-height:561px;
	padding-top:65px;
}

.leftcol {
	width:211px;
	float:left;
}
.rightcol {
	width:631px;
	float:left;
}

/* 2.1 Logo */
.logo {
	/*width:211px;
	height:141px;*/
 
	width: 100%;
	margin: 0 auto;
	display: block;
		
}

/* 2.2 Navigation */
.navigation {
	background:#fff;
	width:211px;
}
.navigation ul {
	padding:25px 30px;
}
.navigation li {
	line-height:28px;
	font-size:20px;
	font-style:italic;
	font-weight:500;
	border-top:1px solid #c6c3c6;
}
.navigation li a {
	display:block;
	color:#514f4f;
	padding-left:2px;
}
.navigation li a:hover, .navigation li.active a {
	color:#336699;
}
.navigation li:first-child {
	border-top:none;
}
.signature-line {
	background:url(../images/bg_common.png) repeat;
	margin-top:141px;
	font-size:25px;
	font-style:italic;
}
#slidecaption {
	height:140px;
	display:table;
}
.signature-line p {
	display:table-cell;
	vertical-align:middle;
	line-height:26px;
	padding:0 10px 0 52px;
}

/* Common */
.common {
	width:178px;
	float:left;
	margin-left:31px;
}
.common.gap {
	margin:0 20px 0 30px;
}
.common.gap h5 {
	color:#fff;
}
.common.gap p {
	color:#a8a7a7;
}
.common h5 {
	color:#a8a7a7;
	padding-bottom:18px;
	font-style:italic;
	font-weight:normal;
}
.common p {
	color:#fff;
	line-height:14px;
	padding-bottom:15px;
	font-family:"Trebuchet MS";
}
.common h6 {
	color:#a8a7a7;
	font-weight:normal;
	font-family:"Trebuchet MS";
}



/* 2.3 Container */
.container {
	background:url(../images/bg_container.png) repeat;
	min-height:383px;
	padding:38px 0 0 50px;
	margin-bottom:-1px;
}
.container_portfolio {
	background:url(../images/bg_container.png) repeat;
	min-height:560px;
	padding:30px 35px 51px 35px;
	margin-bottom:-1px;
}
.container_our {
	background:url(../images/bg_container_our.png) repeat;
	min-height:560px;
	padding:38px 0 0 50px;
	margin-bottom:-1px;
}
.container h2 {
	font-size:24px;
	color:#050505;
	font-weight:normal;
	font-style:italic;
	padding-bottom:27px;
	width:100%;
	float:left;
}
.container h4 {
	font-size:24px;
	color:#050505;
	font-weight:normal;
	font-style:italic;
	padding-bottom:27px;
	width:433px;
	float:left;
}
.container h3 {
	font-style:italic;
	color:#3b3838;
	font-size:17px;
	margin:0 38px 0 0;
	line-height:22px;
	font-weight:normal;
	border-bottom:1px solid #babcc1;
}
.container h3 span {
	display:block;
}
.about-us p {
	margin-right: 20px;
	margin-left: 0px;
}
.container p {
	color:#3b3838;
	padding-bottom:17px;

}
.readmore{
	width:100%;
	margin:15px 0 15px 0;
	font-size:14px;
}
.back{
	width:100%;
	padding:10px 0 13px 0;
	font-size:14px;
}

.timeline {
	padding-top:3px;
}
.timeline h3 {
	color:#050505;
	font-size:24px;
	font-style:italic;
	float:left;
	margin:10px 40px 0 0;
	border-bottom:none;
	padding-bottom:10px;
}
.timeline .history {
	width:390px;
	float:left;
	margin-right:05px;
	border-top:1px solid #b7b6b2;
}
.timeline .history li {
	background:url(../images/bg_border.png) no-repeat top center;	
	width:27px;
	float:left;
	margin-left:25px;
	padding-top:15px;
	color:#3b3838;
	position:relative;
}
.timeline .history li:first-child {
	margin-left:-13px;
}
.timeline .history li.last {
	margin:0 -15px 0 27px;
}
.timeline .history li a:hover, .timeline .history li.active {
	color:#336699;
}
.history-detail {
	width:540px;
	padding:43px 0 0 10px;
	position:absolute;
	left:-175px;
	top:35px;
	display:none;
}
.history-detail a {
	float:right;
	font-size:14px;
}

.history-detail_2007 {
	background:url(../images/bg_histoy_detail_2007.png) no-repeat top left;
	left: -134px;	
}

.history-detail_2008 {
	background:url(../images/bg_histoy_detail_2008.png) no-repeat top left;
	left: -191px;	
}

.history-detail_2009 {
	background:url(../images/bg_histoy_detail_2009.png) no-repeat top left;
	left: -248px;	
}

.history-detail_2010 {
	background:url(../images/bg_histoy_detail_2010.png) no-repeat top left;
	left: -305px;	
}

.history-detail_2011 {
	background:url(../images/bg_histoy_detail_2011.png) no-repeat top left;
	left: -362px;	
}

.history-detail_2012 {
	background:url(../images/bg_histoy_detail_2012.png) no-repeat top left;
	left: -419px;	
}

.history-detail_2013 {
	background:url(../images/bg_histoy_detail_2013.png) no-repeat top left;
	left: -456px;	
}
#texto_novedad p{
	line-height: 18px;
	padding-bottom: 0px;
	width:550px;
	
}

/* 2.4.4 Portfolio */
.portfolio{
	width:382px;
	height:382px;
	float:left;
	margin:70px 0 0 75px;
	position:relative;
	z-index:1;
}
.portfolio-content{
	width:180px;
	position:absolute;
	left:101px;
	top:100px;
	z-index:2;
	font-size:16px;
	color:#404041;
	line-height:13px;
	text-align:center;
}
.portfolio-logo{
	margin-top:55px;
}
.portfolio-content p{
	padding-bottom:16px;
}

.portfolio [class*="office"]{
/*	background:url(../images/bg_office.png) no-repeat;*/
	position:absolute;
	font-size:12px;
	line-height:13px;
	text-align:center;
	/*display:none;*/
	z-index:9999;
}
.portfolio .office1{
	background-position:-349px 122px;
	width:126px;
	padding-bottom:40px;
	right:50px;
	bottom:353px;
}
.portfolio .thumb {
	margin-bottom:10px;
}
.portfolio .office2 {
	background-position:-475px 0px;
	width:103px;
	right:-100px;
	bottom:225px;
	padding-bottom:39px;
}
.portfolio .office2 .thumb {
	margin-top:42px;
}
.portfolio .office3 {
	background-position:-483px -243px;
	width:108px;
	right:-110px;
	bottom:115px;
	padding-bottom:0;
	padding-top:42px;
}
.portfolio .office4 {
	background-position:-401px -368px;
	width:126px;
	right:-42px;
	bottom:-20px;
	padding-bottom:0;
	padding-top:68px;
}
.portfolio .office5 {
	background-position: -233px -416px;
	width: 125px;
	right: 129px;
	bottom: -70px;
	padding-bottom: 0;
	padding-top: 49px;
}
.portfolio .office6 {
	background-position:-63px -368px;
	width:126px;
	right:302px;
	bottom:-20px;
	padding-bottom:0;
	padding-top:69px;
}
.portfolio .office7 {
	background-position:left -246px;
	width:103px;
	left:-110px;
	bottom:110px;
	padding-bottom:0;
	padding-top:41px;
}
.portfolio .office8 {
	background-position:-16px -39px;
	width:103px;
	left:-95px;
	top:50px;
	bottom:auto;
	padding-bottom:42px;
}
.portfolio .office9 {
	background-position:-128px 111px;
	width:126px;
	left:50px;
	top:-52px;
	bottom:auto;
	padding-bottom:67px;
}

.portfolio .ia {
	position: absolute;
	left: 0;
	top: 0;	
}

/* 2.4 Footer */
.footer {
	background:#3b3838;
	height:126px;
	padding-top:31px;
}
.footer .box {
	width:870px;
	position:relative;
}


/* Mapa */

.mapa_chico {
	position:absolute; left:202px; left:207px; top:61px;
}
.mapa_grande {
	position:absolute;
}
.mapa_eu {position:absolute; right:38px; top:267px}

#mapa_peru {
	width: 140px;
	height: 100px;
	background-image: url(../images/mapa_latinoamerica_lima.png);
	background-repeat:no-repeat;
	position: absolute;
	left: 40px;
	bottom: 96px;
/*	display: none;*/
	padding: 25px 36px 3px 8px;
	cursor: default;	
}
#mapa_uruguay {
	width: 140px;
	height: 105px;
	background-image: url(../images/mapa_latinoamerica_mvd.png);
	background-repeat:no-repeat;
	position: absolute;
	left: 268px;
	bottom: 25px;
/*	display: none;*/
	padding: 22px 15px 0 15px;
	cursor: default;	
}
#mapa_uk {
	width: 120px;
	height: 110px;
	background-image: url(../images/mapa_global_london.png);
	background-repeat:no-repeat;
	position: absolute;
	right: 168px;
	top: 240px;
	/*display: none;*/
	padding: 3px 5px 0 6px;
	cursor: default;	
}

.texto_chico {
	font-size:11px;
	line-height: 12px;
	color:#FFF;
}

.slider {
	width:490px; 
	height: 768px; 
	position: relative;	
}

.slider li {
	position:relative;
}

.slider li img {
	left:0; 
	top:0; 
	position:absolute;
}

.lmostrar, .imostrar {
	display:none;
}

.lmostrar, .imostrar {
	position:absolute;
	z-index:100;
}
#map1 {
	width:210px;
	height:150px;
	float:left;
	margin-right:15px;
	margin-bottom:20px;
}
#map2 {
	width:210px;
	height:150px;
	float:left;
	margin-right:15px;
	margin-bottom:20px;
}
#map3 {
	width:210px;
	height:150px;
	float:left;
	margin-right:15px;
}
.foto_team {
	position:relative;
	width:75px;
	height:100px;
	float:left;
}
.texto_team {
	position:relative;
	height:45px;
	/**width:543px;**/
    border-bottom:#babcc1 1px solid;
	margin-bottom:25px;
	font-size:13px;
}
.texto_team h2{
	font-size:14px;
	float:left;
	padding-bottom:5px;
}

.texto_team .col1 {
	float:left;
	width:200px;
}

.texto_team .col2 {
	float:right;
	width:200px;
}

.texto_team_last {
	border: none;
}

.texto_team_1 {
	position:relative;
	float:left;
	height:35px;
	width:300px;
	padding-right:10px;
	margin-top:5px;
}
.texto_team_2 {
	position:relative;
	float:left;
	height:35px;
	width:300px;
/*	border-bottom:#999 1px solid;*/
	margin-top:5px;
}
.texto_team h3{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#FFF;
}
.texto_team a{
	color:#000;
	text-decoration:underline;
}
.texto_team a:hover,
.texto_team a.active{	
	color: #336699;

}
.texto_team_1 a{
	color:#ffffff;
}
.texto_team_1 a:hover,
.texto_team_1 a.active{	
	color: #336699;

}
.texto_team_2 a{
	color:#ffffff;
	text-decoration:underline;
}
.texto_team_2 a:hover,
.texto_team_2 a.active{	
	color: #336699;
}
.texto_team_1 h3{
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#999;
}
.texto_team_1 h2{
	font-size:13px;
/*	margin-bottom:10px;*/
/*	height:30px;*/
	width:150px;
	float:left;
	color:#999;
}
.texto_team_2 h3{
	font-size:13px;
}
.texto_team_2 h2{
	font-size:13px;
/*	margin-bottom:10px;
	height:30px;*/
	width:150px;
	float:left;
	color:#999;
}

.cv {
	position: absolute;
	top: 341px;
	width: 501px;
	height: 300px; /*376px;*/
	border: #fff 1px solid;
	background-color: #fff;
	padding: 20px;
	font-size: 13px;
}
.foto_cv {
	position:relative;
	width:100px;
	height:100px;
	float:left;
}
.cv h2{
	font-size:13px;
	line-height:16px;
	color:#3b3838;
	width: 390px;	
}
.cv p{
	line-height:18px;
}
.close{
	font-size: 12px;
	position: relative;
	margin-bottom: 20px;
	height: 20px;
	width: 495px;
	border-bottom: #999 1px solid;
	text-align: right;
}
.close a{
	color:black;
}
.close a:hover,
.close a.active{	
	color: #336699;
}





/**** RE STYLING ****/
body {background:#ccc; font-family:"freight-sans-pro", sans-serif; -webkit-text-size-adjust: 100%;}
body p {font-size:13px; line-height:140%}

.wrap {padding-top:0px}
.box {margin-left:0; margin:0 auto}
.wrap .box {padding-top:55px}

a {transition:.2s ease; -moz-transition:.2s ease; -webkit-transition:.2s ease}
a:hover {color:#336699}


body.home .rightcol {width:575px}
.leftcol {width:165px}
/*.logo {width:164px; text-align:center; height:auto; margin-bottom:20px}*/
.navigation {width:164px}
.navigation ul {padding:21px 23px 18px 28px}
.navigation li {line-height:160%; font-size:14px; font-style:normal; text-transform:uppercase; border-top:none; margin:8px 0}
.navigation li a {color:black; transition:.2s ease; -moz-transition:.2s ease; -webkit-transition:.2s ease; letter-spacing:1px}
.navigation li a:hover {color:#336699}


.rightcol {margin-top:113px}

.container {background:white; padding:30px 35px 25px 35px; min-height:152px}

.rightcol .banner {display:none}


.container h2 {font-style:normal; text-transform:uppercase; float:none; padding-bottom:15px;}
.container h3 {font-style:normal; font-size:14px; color:#336699; padding:0 0 10px; line-height:140%; border-bottom:none; margin-bottom:0}
.container h4 {font-style:normal; width:100%; text-transform:uppercase}

.texto_about h3 {text-transform:uppercase; font-size:14px; padding-bottom:15px; line-height:125%}

.back a {text-transform:uppercase; font-size:11px}

.timeline h3 {text-transform:uppercase}
.history li a {font-size:13px}
.timeline .history {border-top:none; background:url(../images/bg-history.png) left top no-repeat; padding:0 5px}
.timeline .history li {background:none}


.signature-line {margin-top:0; font-style:normal; color:white; background:none; text-transform:uppercase; font-size:22px}
#slidecaption {height:auto}

.signature-line p {padding:17px 0 0 38px; line-height:160%}


.container_portfolio {background:white}
.portfolio .office9 {padding-bottom:0}

.container_portfolio .col1, .container_portfolio .col2 {width:280px; display:inline-block}
.container_portfolio .col1 {float:left}

.container_portfolio .col1 h2 {font-style:normal; text-transform:uppercase; padding-bottom:15px; font-size:24px; color:#050505; font-weight:normal}
.container_portfolio .col2 h3 {color:#336699; font-size:14px; padding-bottom:20px; line-height:140%}


.about-us .col1 {float:left}
.about-us .col1, .about-us .col2 {width:280px; display:inline-block}
.about-us .col2 {padding-top:5px; margin-bottom:10px}


.texto_team {border-bottom:none; margin-bottom:26px}
.texto_team .col1, .texto_team .col2 {padding:0 10px; padding-bottom:17px; border-bottom:1px solid #336699; width:223px}
.texto_team a {text-decoration:none; text-transform:uppercase; font-weight:bold; font-size:14px; line-height:120%}
.texto_team h2 {padding-bottom:0; text-transform:none; font-size:13px}
.texto_team.texto_team_last {margin-bottom:15px}
.texto_team.texto_team_last .col1, .texto_team.texto_team_last .col2 {border-bottom:none}

.texto_team .col-last {border-bottom:0; padding-bottom:0}
.txt-last {margin-bottom:12px}

.cv {min-height:450px; top:493px; width:560px; padding:40px 0 120px}
.cv p {font-size:14px; line-height:120%; max-width:520px}
.cv h2 {color:black; font-size:12px}
.cv h2:first-line {color:#336699; font-size:15px}
.close {width:100%; font-size:12px; text-transform:uppercase}

.container_our {background:#cacaca url(../images/bg-our-presence.png) center 8px no-repeat; position:relative; padding:30px 0 0 35px; height:601px}

.texto_chico {color:black}


#map1, #map2, #map3 {padding-right:55px}

#slidecaption p {letter-spacing:2px; text-shadow:0px 0px 26px rgba(4, 26, 40, 0.85)}


body.team-page .about-us .col2 {padding-top:0}
body.team-page h4 {float:none; font-size:11px; text-transform:uppercase; border-bottom:1px solid #336699; padding-bottom:13px; margin-bottom:9px; width:233px; padding-left:10px}
body.team-page .about-us .cols:first-child .col1 h2 {padding-bottom:10px}
body.team-page .about-us .team-img {padding-bottom:30px}


.history-detail a {display:inline-block; width:55px; position:absolute; right:-39px; top:24px; text-transform:uppercase; font-size:10px!important}

body.contact-page .cols {float:left; display:inline-block; width:33%}
body.contact-page .col2 {padding-top:0; margin-bottom:0}



body.portfolio-page .container_portfolio {min-height:500px}

.portfolio-inner {position:relative; display:block; margin-top:25px}

.portfolio-cover {position:absolute; display:block; opacity:1}

.mapa_grande {top:148px; left:25px}

.container_our h2 {text-transform:uppercase; font-size:24px; color:#336699; font-weight:normal}

.toronto-office {
	position: absolute;
	width: 148px;
	padding-left: 34px;
	top: 208px;
	left: 344px
}
.london-office {position:absolute; width:132px; padding-right:28px; top:287px; left:337px}
.lima-office {
	position: absolute;
	width: 120px;
	padding-right: 5px;
	bottom: 93px;
	left: 208px
}
.montevideo-office {
	position: absolute;
	width: 169px;
	padding-left: 25px;
	bottom: 30px;
	left: 419px
}


.toronto-office {background:url(../images/op-underline0.png) left 21px repeat-x}
.london-office {background:url(../images/op-underline0.png) left 21px repeat-x}
.lima-office {background:url(../images/op-underline0.png) left 20px repeat-x}
.montevideo-office {background:url(../images/op-underline0.png) left 21px repeat-x}

.london-office h3, .lima-office h3, .montevideo-office h3, .toronto-office h3 {text-transform:uppercase; color:white; font-size:14px; font-weight:normal; letter-spacing:1px; margin-bottom:15px}
.london-office p, .lima-office p, .montevideo-office p, .toronto-office p {font-size:11px; color:#336699; line-height:130%}


.history-detail_2014 {left:-515px; background:url(../images/bg_histoy_detail_2014.png) no-repeat 5px top}

.history li a.years {color:#336699; font-weight:bold; }
.history li a.years:hover {font-size:15px}

.union-blue {color:#336699}


/**** FOOTER ****/

.footer {padding-top:80px; height:140px; background:transparent url(../images/footer-repeater.png) left bottom repeat-x; overflow-x:hidden; position:relative}
.footer-line {width:100%; height:7px; border-bottom:1px solid white; position:absolute; left:-80px; bottom:45px;}
.footer-detail {position:absolute; right:0; bottom:-3px; width:105px; height:7px; background:white}

.footer-copy {position:absolute; bottom:-51px; left:32px;}
.footer-copy p {color:#f6f6f6; font-size:10px}

.footer .common h6, .footer .common.gap p, .footer .common h5 {color:white; font-style:normal}

.footer .common p {padding-bottom:3px; font-size:11px}
.footer .common h6 {font-size:11px}
.footer .common.gap {margin:0 0 0 30px; width:135px}

* {margin: 0}
html, body {height: 100%; background-color: #000; text-align: center}
.wrap {min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -220px}
.push {height: 220px}




#slidecaption p {line-height:156%; font-size:21px}

.highlight-wrap {margin-left:39px; margin-top:18px; padding-top:25px; border-top:1px solid #ddd}
.highlight-wrap a {display:inline-block}
.highlight-wrap a.image {float:left}
.highlight-wrap p {width:125px; padding-left:20px}
.highlight-wrap p a {text-transform:none; font-size:11px; color:white; line-height:140%!important; text-shadow: -1px 1px 2px rgba(0, 0, 0, 0.4);}
