@import url(http://fonts.googleapis.com/css?family=Lato:400,700);

html, body {
	background-color:#6a6a6a;
	background-repeat:repeat-x;
	color:#8a8a8a;
	font-size:14px;
	font-family: 'Lato', arial;
	height:100%;
	line-height:1.2em;
	}


/* a general 
------------------------------------- */

a, a:visited {
	color:inherit;
	text-decoration:underline;
	}
	
a:hover {
	color:#003c5b;
	text-decoration:underline;
	}

header,
nav,
.container,
div.top,
footer {
	width: 100%;
	}


header div.in,
nav div.in,
div.top div.in,
.contenedor div.in,
.paneles,
footer div.in{
	margin:0px auto;
	width:960px;
	}

/*
---------- DIV TOP --------------------*/
div.top {
	background-color: #fff;
	background-image: url(../images/header-bg2.png);
	background-position: top;
	height:auto;
	}

div.top div.in {
	height: 30px;
	}

div.top div.in ul{
	height: 30px;
	float: left;
	list-style: none;
	margin:0px;
	padding: 0px;
	}

div.top div.in ul li{
	color: #ababab;
	display: inline-block;
	margin:0px 3px;
	}

div.top div.in ul li a,
div.top div.in ul li a:visited{
	color: #003c5b;
	display: block;
	font-weight: bold;
	font-size: 0.9em;
	height: 30px;
	line-height: 30px;
	text-decoration: none;
	}

div.top div.in ul li a:hover{
	color: #003c5b;
	display: block;
	height: 30px;
	line-height: 30px;
	text-decoration: underline;
	}


/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< HEADER >>>>>>>>>>*/
header {
	background-color:#fff;
	background-image: url(../images/header-bg.png);
	height: 100px;
	}


header div.in{
	height: 120px;
	position: relative;
	padding: 0px;
	}


ul.idioma {
	height: auto;
	margin: 0px;
	top: 40px;
	right: 0px;
	list-style: none;
	padding: 0px;
	position: absolute;
	width: 80px;
	}


ul.idioma li {
	display: block;
	float: left;
	font-size: 0.8em;
	height: 25px;
	line-height: 25px;
	margin-left: 3px;
	width: auto;
	}

ul.idioma li a, 
ul.idioma li a:visited{
	color: inherit;
	text-decoration: none;
	}

ul.idioma li a:hover{
	text-decoration: underline;
	}
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< NAV >>>>>>>>>>*/

nav,
nav div.in,
#nav li,
#nav ul li a {
	height: 50px;
	line-height: 50px;
	z-index:9999999999999999999999;
	}

nav {
	/*background-color:#dedede;*/
	background-color: #003c5b;
	}

nav div.in{
	background-color: #003c5b;
	padding: 0px;
	}


#nav ul{
	float: right;
	list-style: none;
	padding: 0px;
	margin:0px;
	width:auto;
	}


#nav li{
	float: left; /* quitar? */
	position: relative;
	}

#nav li a{
	display: block;
	font-size: 1.1em;
	text-decoration: none;
	text-align: left;
	text-indent: 15px;
	}

/* First level 
---------------------------------------*/
#nav ul li{
	background-color: #003c5b;
	}

#nav ul li:hover{
	background-color: #fff; 
	}

.btntransactions {width: 115px;}
.btnsectors {width: 120px;}
.btnservices {width: 120px;}
.btntools {width: 70px;}
.btncities {width: 200px;}


#nav ul li.arrow {
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: top right;
	}

#nav ul li.arrow:hover  {
	background-color: #fff;
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: bottom right;
	}

#nav ul li a{
	color: #dedede; 
	height: 100%;
	}

#nav ul li:hover a,
#nav ul li:active a {
	color: #003c5b;
	}


/* Second level 
---------------------------------------*/
#nav li ul{
	display: none;
	background-color:#fff;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	display: none; /*de inicio escondemos ul*/
	height: auto;
	padding-bottom: 5px;
	position: absolute;
	top: 100%;
	width: 280px;
	}

#nav li.btnservices ul {
	margin-left: -190px!important;
	width: 580px;
	}

#nav li.btnfinancial ul{
	}

#nav li.btnregional ul{
	margin-left: -100px;
	}


#nav li:hover ul{ /* se muestra ul*/
	display: block;
	left: 0;
	right: 0;
	}


#nav li ul li,
#nav li ul li a,
#nav li:hover ul li,
#nav li:hover ul li a {
	background-color:#fff;
	}

#nav li ul li {
	float: left;
	font-size: 1.1em;
	height: 30px;
	line-height: 30px;
	margin:0px 5%;
	width:90%;
	}

#nav li ul li:first-child {
	border-bottom: 1px solid #dedede;
	margin-top:15px;
	}

#nav li:hover ul li a{color: #6a6a6a;}
#nav li:hover ul li a:hover{color: #003c5b;}


#nav li ul li a{
	background-color: #756565;
	background-image: url(../images/arrow3.png);
	background-repeat: no-repeat;
	background-position:left top;
	height: 30px;
	line-height: 30px;
	font-size: 1em;
	text-indent:30px;
	width: 100%;
	}

#nav li ul a:hover{
	background-position:left bottom;
	}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< CONTENEDOR >>>>>>>>>>*/

.contenedor{
	background-image: url(../images/container-bg.jpg);
	background-repeat: repeat-x;
	background-color: #fff;
	}

.contenedor div.in {
	height: auto;
	overflow: hidden;
	min-height: 200px;
	}



/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< SECTION >>>>>>>>>>*/	

.interior{
	background-color:#fff;
	float: left;
	height:auto;
	margin:10px 0px;
	min-height: 500px;
	overflow: hidden;
	width: 100%;
	}

section,
aside {
	float: left;
	min-height: 500px;
	}


section {
	margin-left: 15px;
	/*overflow: hidden;*/
	/*width:630px;*/
	width: 665px;
	}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< ARTICLE >>>>>>>>>>*/
article {
	float: left;
	margin:5px 2%;
	width: 96%;
	}

article h2,
article p {
	display: block;
	float: left;
	width: 100%;
	}

article h2{
	border-bottom:1px solid #dedede;
	color: #6a6a6a;
	font-size: 1.4em;
	line-height: 1.5em;
	width: 100%;
	}

article div#pdf{
	height:500px;
	width: 100%;
	}



article p{
	display: block;
	float: left;
	text-align: justify;
	}


article p strong{
	color: #6a6a6a;
	}

article ul,
article ol{
	display: block;
	float: left;
	height: auto;
	margin-left: 30px;
	padding: 0px;
	width: auto;
	}

article p img{
	display: inline-block;
	float: none;
	margin-left: 10px auto
	}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< ASIDE >>>>>>>>>>*/	
aside{
	overflow: hidden;
	width:280px;	
	}

aside img{
	height: auto;
	width:100%;	
	}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< FOOTER >>>>>>>>>>*/		
footer {
	display:block;
	height:auto;
	}

footer p {
	color:#bababa;
	display:block;
	font-size:0.8em;
	float:left;
	padding-bottom: 10px;
	text-align:left;
	width:100%;
	}

footer p a, 
footer p a:visited{
	color:#535151;
	text-decoration:none;
	}

footer p a:hover{
	color:#fb7102;
	text-decoration:underline;
	}


/* //////////////////// INDEX ////////////////////*/
.paneles {
	/*background-image: url(../images/img-global.jpg);
	background-repeat: no-repeat;
	background-position:right;*/
	border-top:1px solid #dedede;
	float: left;
	margin:6px 0px;
	height: 200px;
	}

.paneles div {
	float: left;
	height: 200px;
	margin:0px 1.32%;
	margin-top:10px;
	width: 23%;
	}

.paneles div p {
	text-align: left;
	}

.paneles div p strong{
	text-transform: uppercase;
	}

.paneles div p a{
	display: block;
	background-image: url(../images/arrow2.png);
	background-repeat: no-repeat;
	background-position: right;
	float: left;
	padding-right: 20px;
	width: auto;
	}

.paneles div:first-child {
	margin-left:0%;
	}

.paneles div:last-child {
	margin-right:0%;
	overflow: hidden;
	}

.mapaflash {
	position: relative;
	margin: 20px 0px 0px -90px;
	}
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< WELCOME >>>>>>>>>>*/	

p.welcome {
	display: block;
	}

p.welcome span{
	color: #003c5b;
	display: block;
	float: left;
	font-weight: bold;
	font-style:italic;
	margin:20px 0px 0px 30px;
	padding:30px;
	width: 360px;
	}
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< WHERE WE ARE >>>>>>>>>>*/

#contactus .envolvente{
	margin-top: 15px;
	width: 300px;
	}


/* ---------- AUXILIARES ---------- */
.hide { display:none;}
.alertok {color:#039203; font-weight:bold;}
.alerterror {color:#d60615; font-weight:bold;}
.float-right {float: right;}

.envolvente {
	background-color: #fff;
	border-radius: 10px;
	box-shadow:0px 0px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	display: block;
	float: left;
	height: auto;
	padding: 10px;
	/*width: auto;  se determina en cada caso*/
	}