/*--------------------------------------------------------------------
LAYOUT BODY - grupeme(IE7+ FF1.5+ Opera9+)

Version: 	1.0 - 2012
author: 	Burocratik (alexandre r. gomes)
email: 		alex@burocratik.com
website: 	http://www.burocratik.com
-----------------------------------------------------------------------*/
@import url(body.css);

/*----------------------------------------------------------------------*/

/*-------------------------------------------------------------------------
=EMPRESA: section 1
-------------------------------------------------------------------------*/
blockquote{
	border-top: 1px solid #e5e4e4; border-bottom: 1px solid #e5e4e4;
	padding: 22px 0 26px; text-align: center; position: relative;
	font: 22px "vgI", Helvetica, Arial, sans-serif; color: #9c814e;
	line-height:28px!important; width: 1008px; left: -15px;
}
blockquote span{display: inline-block; position: relative; width: 35px;}
blockquote span.left{background: url(../imgs/blockquote-bg.png) no-repeat left top; margin-left: -35px; top: -5px;}
blockquote span.right{background: url(../imgs/blockquote-bg.png) no-repeat right bottom; bottom: -5px;}

#section1 article{position: relative; overflow: hidden; margin-top: 40px;}
#section1 div{position: relative; float: left; height: auto; width: 464px; line-height: 22px;}

/*-------------------------------------------------------------------------
=CLIENTES: section 2
-------------------------------------------------------------------------*/
#section2{position: relative; width: 100%; height: 360px; padding: 50px 0 70px; margin: 90px 0 0;}
#section2 .bg{
	position: absolute; top: 0;  left: -111px;  width: 1200px; height: 100%; z-index: 5;
	background: #9f8550 url(../imgs/empresa-clientes-bg.jpg) no-repeat center center;
}
#section2 article{
	position: relative; z-index: 20;
	font: 17px/22px "Reader Regular", Helvetica, Arial, sans-serif; color: #ffffff;
}
#section2 h3{font: 28px/26px "Reader Medium", Helvetica, Arial, sans-serif; color: #ffffff; margin-bottom: 5px;}
#section2 ul.clientes{
	position: relative; z-index: 20; color: #ffffff; margin: 70px 0 0 0;  
	font: 13px/15px "Reader Regular", Helvetica, Arial, sans-serif; overflow: hidden;
}
#section2 ul.clientes li{
	position: relative; float: left; /*padding-right: 63px;*/ padding-right: 99px;
	background: url(../imgs/empresa-clientes-ids-sep.png) no-repeat right center;
}
#section2 ul.clientes li:last-child{padding-right: 0px; background: none;}
#section2 .listaClientes{
	position: relative; z-index: 20; color: #ffffff; margin: 70px 0 0 0; width: 1020px;
	font: 15px/17px "Reader Regular", Helvetica, Arial, sans-serif; overflow: hidden;
}
#section2 .listaClientes ul{display: block; position: relative; float: left; width: 254px;}
/*#section2 .listaClientes ul:last-child{width: 215px;}*/

/*-------------------------------------------------------------------------
=MAPA: section 3
-------------------------------------------------------------------------*/
#section3{
	position: relative; width: 100%; /*height: 940px;*/ height: 930px; opacity:1;
	background: transparent url(../imgs/suporte-mapaPortugal.gif) no-repeat right 60px;
	-moz-transition: opacity 0.35s linear; -webkit-transition: opacity 0.35s linear; 
	-o-transition: opacity 0.35s linear; transitions: opacity 0.35s linear;
}
#section3 h3{
	font: 28px/26px "Reader Medium", Helvetica, Arial, sans-serif; color: #22265c; margin-bottom: 11px;
	margin-top: 100px; opacity:1;
}
#section3 h3+p{opacity:1; font-size: 16px; line-height: 23px;}
#section3 ul.enderecos{
	position: relative; overflow: hidden; padding-top: 60px;
	font: 14px/17px "Reader Regular", Helvetica, Arial, sans-serif; color:#979a9b;
}
#section3 ul.enderecos li{float: left; display: block;	width: 230px; padding-right: 24px;}
#section3 ul.enderecos h4{font: 16px/17px "Reader Medium", Helvetica, Arial, sans-serif; color:#a08651; padding-bottom: 5px;}
#section3 ul.enderecos li p{line-height: 16px; padding-bottom: 5px;}
#section3 ul.enderecos li ul{font-size: 13px;}
#section3 ul.enderecos em{color: #7d7f80;}

#section3 ul.enderecos ul li:nth-child(1), #section3 ul.enderecos ul li:nth-child(2),
#section3 ul.enderecos ul li:nth-child(3){opacity:1; margin: 0;}

#section3 ul.enderecosFotos{
	display: block; position: relative; width: 978px;
	overflow: hidden; margin-top: 80px;
}
#section3 ul.enderecosFotos li{
	display: block; position: relative; float: left; margin-right: 4px;
}
#section3 ul.enderecosFotos li:last-child{margin-right: 0px;}
#section3 ul.enderecosFotos li h5{
	display: block; position: absolute; left: 14px; bottom: 11px; z-index: 10;
	font-size: 18px; color: #FFF;
}
#section3 ul.enderecosFotos li img{display: block; position: relative; float: left; z-index: 0;}

#pinsMap li:nth-child(1), #pinsMap li:nth-child(2),#pinsMap li:nth-child(3),
#pinsMap li:nth-child(4),#pinsMap li:nth-child(5){
	opacity:1; 
	-webkit-transition: all .3s cubic-bezier(0.680, 0, 0.265, 1);
	-webkit-transition: all .3s cubic-bezier(0.680, -0.550, 0.265, 1.550); 
   	-moz-transition: all .3s cubic-bezier(0.680, -0.550, 0.265, 1.550); 
    -ms-transition: all .3s cubic-bezier(0.680, -0.550, 0.265, 1.550); 
    -o-transition: all .3s cubic-bezier(0.680, -0.550, 0.265, 1.550); 
    transition: all .3s cubic-bezier(0.680, -0.550, 0.265, 1.550);	
}
#section3.goAnim #pinsMap li:nth-child(1){
	-moz-transition-delay:1.5s; -webkit-transition-delay:1.5s;
	-o-transition-delay:1.5s; transition-delay:1.5s;
}
#section3.goAnim #pinsMap li:nth-child(2){
	-moz-transition-delay:1.7s; -webkit-transition-delay:1.7s;
	-o-transition-delay:1.7s; transition-delay:1.7s;
}
#section3.goAnim #pinsMap li:nth-child(3){
	-moz-transition-delay:1.9s; -webkit-transition-delay:1.9s;
	-o-transition-delay:1.9s; transition-delay:1.9s;
}
#section3.goAnim #pinsMap li:nth-child(5){
	-moz-transition-delay:2.0s; -webkit-transition-delay:2.0s;
	-o-transition-delay:2.0ss; transition-delay:2.0s;
}
#section3.goAnim #pinsMap li:nth-child(4){
	-moz-transition-delay:2.2s; -webkit-transition-delay:2.2s;
	-o-transition-delay:2.2s; transition-delay:2.2s;
}
#section3.goAnim #pinsMap li:nth-child(1){top: 84px; opacity:1;}
#section3.goAnim #pinsMap li:nth-child(2){top: 168px; opacity:1;}
#section3.goAnim #pinsMap li:nth-child(3){top: 265px; opacity:1;}
#section3.goAnim #pinsMap li:nth-child(5){top: 328px; opacity:1;}
#section3.goAnim #pinsMap li:nth-child(4){top: 387px; opacity:1;}

#section3 #pinsMap{position: absolute; top: 0; right:0;}
#section3 #pinsMap li{
	display: block; width: 45px; height: 58px;  position: absolute; top: 0; right:0; z-index: 20;
	background: transparent url(../imgs/gmap-icon.png) no-repeat; text-indent: -5555px; 
}
#section3 #pinsMap li[title="Porto"]{top: 78px; right:108px;}
#section3 #pinsMap li[title="Coimbra"]{top: 162px; right:93px;}
#section3 #pinsMap li[title="Lisboa"]{top: 259px; right:151px;}
#section3 #pinsMap li[title="Faro"]{top: 381px; right:73px;}
#section3 #pinsMap li[title="Funchal"]{top: 322px; right:258px; z-index: 10;}

#section3 #pinsMap li p{
	position: absolute; top: 3px; left: -155px; width: 157px; height: 70px; margin-left: -15px;
	background: transparent url(../imgs/suporte-mapa-balao.png) no-repeat; text-indent: 0;	
	font: 13px/17px "Reader Regular", Helvetica, Arial, sans-serif; color: #717171; display: none;
}
#section3 #pinsMap li p a{
	display: block; width: 110px; height: 23px;	margin: 10px 0 0 18px; 
	text-shadow: 1px 1px 1px #ffffff; color: #717171;	 
}
#section3 #pinsMap li p a:hover{color: #a08651;}

.es #section3 #pinsMap li p a{width: 130px;	margin: 10px 0 0 12px;}

/* MAPA*/
#mapMainWrapper{
	position: absolute; top: 34px; left: -111px; height: 523px; width: 1200px; z-index: 50; 
	background: transparent; overflow: hidden; 
}
#mapMainWrapper.off {top: -5555px;}
#mapWrapper{
	position: absolute; top: 530px;  left: 0;  height:509px; width: 100%; background: #ffffff;
	-webkit-box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, .3);
	box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, .3);	
}
#mapaID{height:509px; width: 100%; background: #ffffff;}
#btnMapClose, #btnMapClose2{
	position: absolute; top:0; right:96px; width: 57px; height: 66px; cursor: pointer;
	background: transparent url(../imgs/gmaps-btn-close.png) no-repeat left top; z-index: 50;
	background-color: rgba(255,255,255,.95); 
}
#btnMapClose2{
	position: absolute; top:16px; right:122px; width: 19px; height: 19px; cursor: pointer; display: none;
	background: transparent url(../imgs/gmaps-btn-close.png) no-repeat -19px -30px;  z-index: 50;
}
#btnMapClose:hover{background-position: left bottom;}
#btnMapClose2:hover{background-position: -19px -96px;}
#mapControls{
	position: absolute; top:50px; left:111px;	width: 57px; height: 102px; overflow: hidden;
	background: transparent url(../imgs/gmaps-btn-controles.png) no-repeat;
}
#mapControls li{
	position: absolute; width:17px; height: 17px;
	text-indent: 100%;white-space: nowrap;overflow: hidden; cursor: pointer;
}
#mapControls li#mapBtn_up{top:0px; left:20px;}
#mapControls li#mapBtn_down{top:34px; left:20px;}
#mapControls li#mapBtn_left{top:17px; left:2px;}
#mapControls li#mapBtn_right{top:17px; left:37px;}
#mapControls li#mapBtn_zoomIn{top:63px; left:20px;}
#mapControls li#mapBtn_zoomOut{top:81px; left:20px;}
#mapControls li#mapBtn_center{top:17px; left:20px;}
#mapDirectionsWrapper{
	position: absolute; top: 0; right: 96px; width: 350px; height:459px; overflow-y: auto; 
	background-color: rgba(255,255,255,.95); padding: 25px 25px;	display: none; 
	font: 12px/17px "Reader Regular", Helvetica, Arial, sans-serif; color:#202020;
}
#mapDirections{width: 320px;}
#btnPrintMap{
	position: absolute; bottom: 32px; left: 96px; width: 147px; height:32px;
	background: #ffffff url(../imgs/icon-locker-small2.png) no-repeat 15px 10px;
	font: 11px/32px "Reader Medium", Helvetica, Arial, sans-serif; color: #706f6f;
	box-shadow: 1px 1px 2px rgba(0,0,0,.3);  display: none;
}
#btnPrintMap a{
	display: block; position: absolute; top:0; left:0; width:112px ; height:30px; color: #706f6f;
	line-height: 32px; padding: 2px 0 0 36px;
}
#btnPrintMap a:hover{color: #A08651;}
#btnMensagem{margin-top: 40px;}

#btnMensagem a.btOverlay{
	display: inline-block; position: relative; width: 240px; height: 36px; text-transform: uppercase;
	font: 12px/36px "Reader Medium", Helvetica, Arial, sans-serif; color: #FFF; background: #cbcbcb;
	-moz-transition: background 0.2s linear; -webkit-transition: background 0.2s linear; 
	-o-transition: background 0.2s linear; transitions: background 0.2s linear;
	margin-right: 11px;
}
#btnMensagem span{
	display: inline-block; position: relative; float: left; width: 36px; height: 36px; overflow: hidden;
	border-right: 1px solid #eaeaea; margin-right: 17px;
}
#btnMensagem span img{margin-top: -108px;}
#btnMensagem a.btOverlay:hover{background: #a08651;}
#btnMensagem a{color: #a08651;}


/* Candidatura: Form */
section#formMensagem{
	position: fixed; width: 550px; height: 430px; top: 50%; left: 50%; margin: -265px 0 0 -325px;
	font: 13px/15px "Reader Medium", Helvetica, Arial, sans-serif; color: #9d9d9d;
	background: #f4f4f4; padding: 50px; border-radius: 3px;
	-webkit-box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, .4);
	box-shadow: 0px 0px 18px 0px rgba(0, 0, 0, .4);
}
section#formMensagem h3{font: 26px/30px "Reader Medium", Helvetica, Arial, sans-serif; color: #22265c;}
section#formMensagem h4{font: 26px/30px "Reader Regular", Helvetica, Arial, sans-serif;  color: #9d9d9d; margin-bottom: 30px;}
section#formMensagem p{float: left;}
section#formMensagem p input[type=text]{
	border: 4px solid #d1d1d1; width: 222px; padding: 10px 13px;
	font: 13px/15px "Reader Medium", Helvetica, Arial, sans-serif; color: #9d9d9d;
}
section#formMensagem p textarea{
	border: 4px solid #d1d1d1; width: 513px; height: 90px; padding: 10px 13px;
	font: 13px/15px "Reader Medium", Helvetica, Arial, sans-serif; color: #9d9d9d;resize: none;
}
section#formMensagem p select{
	border: 4px solid #d1d1d1; width: 258px; padding: 10px 13px;
	font: 13px/15px "Reader Medium", Helvetica, Arial, sans-serif; color: #9d9d9d;
}
section#formMensagem p .left{margin-right: 33px;}
section#formMensagem p{margin-bottom: 15px;}
section#formMensagem p span{display: inline-block; width: 108px; padding: 0 16px;}
section#formMensagem p label{display: inline-block; width: 55px; font: 13px/15px "Reader Medium", Helvetica, Arial, sans-serif; color: #9d9d9d;}
section#formMensagem p.on input, section#formMensagem p.on input:hover{border: 4px solid red; color: red;}

/* 	separadores */
section#formMensagem p.separadorTop{
	position: relative;
	padding-bottom: 40px; margin: 0px; border-bottom: 1px solid #e3e3e3;
}
section#formMensagem p.separadorBottom{
	padding-top: 40px; margin: 0px; border-top: 1px solid #FFF;
	font: 12px/15px "Reader Regular", Helvetica, Arial, sans-serif;
}
section#formMensagem p.separadorBottom strong{font-family: "Reader Medium", Helvetica, Arial, sans-serif;}
section#formMensagem p.separadorBottom span{width: 370px;}
section#formMensagem .btnEnviar{
	display: inline-block; position: relative; padding: 11px 11px 8px 15px; top: -10px; right: 0px;
	font: 12px/13px "Reader Medium", Helvetica, Arial, sans-serif; color: #ffffff;
  background: #cbcbcb; border:none; text-transform: uppercase;
  /*
	text-shadow: 1px 1px 1px rgba(255,255,255,1);
	border:1px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
	-moz-box-shadow: 0 1px 1px rgba(0,0,0,.3), inset 0 1px 0px rgba(255,255,255,.75);
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.3), inset 0 1px 0px rgba(255,255,255,.75);
	box-shadow: 0 1px 1px rgba(0,0,0,.3), inner 0 1px 0px rgba(255,255,255,.75);
	background-image: linear-gradient(top, rgb(241,241,241) 9%, rgb(213,214,214) 85%);
	background-image: -o-linear-gradient(top, rgb(241,241,241) 9%, rgb(213,214,214) 85%);
	background-image: -moz-linear-gradient(top, rgb(241,241,241) 9%, rgb(213,214,214) 85%);
	background-image: -webkit-linear-gradient(top, rgb(241,241,241) 9%, rgb(213,214,214) 85%);
	background-image: -ms-linear-gradient(top, rgb(241,241,241) 9%, rgb(213,214,214) 85%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.09, rgb(241,241,241)), color-stop(0.85, rgb(213,214,214)));     */
}
section#formMensagem .btnEnviar:hover{cursor: pointer;  background: #a08651;}
section#formMensagem .btnEnviar span{
	display: inline-block; width: auto!important; padding: 0 58px 0 0; 
	background: url(../imgs/btn-setas.png) no-repeat right -15px;
}


/* Fechar: Botão */
section#formMensagem span.btnFechar{
	display: block; position: absolute; right: -15px; top: -15px;
	width: 30px; height: 30px; text-indent: -5555px;
	-moz-border-radius: 15px; border-radius: 15px;
	background: #373737 url(../imgs/carreiras-formCandidatura-btnFechar.png) no-repeat left top;
	-moz-transition: all .3s linear; -webkit-transition: all .3s linear;
	-o-transition: all .3s linear; transition: all .3s linear;	
}
section#formMensagem span.btnFechar:hover{background-color: #9c814e; cursor: pointer;}

section#formMensagem p input, section#formMensagem p textarea, section#formMensagem p select{
	-webkit-transition: border 0.15s linear;  -moz-transition: border 0.15s linear; 	
	-o-transition: border 0.15s linear; transition: border 0.15s linear;	
}
section#formMensagem p input:hover, section#formMensagem p textarea:hover, section#formMensagem p select:hover{border: 4px solid #a08651; color: #9d9d9d;}

section#formMensagem p.formMsg{
	float: none; padding: 0; margin: 0; font-size:15px;
	position: absolute; top:400px; left:443px; color: red; display: none;
}
