@charset 'UTF-8';
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, font, 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, caption, hr, button
{
margin:0;
padding:0;
border:0;
outline:0;
font-size:inherit;
/* [disabled]vertical-align: baseline; */
background:transparent;
}
html{
height: 100%;
width: 100%;
font-size: 0;
}
body{
height:100%;
width:100%;
background-color: white;
font-family: 'Titillium Web', sans-serif;
font-size: 12px;
color: #555;
}
a{
text-decoration:none;
color:inherit;
cursor: pointer;
font-size: inherit;
}
input, textarea{
margin:0;
padding:0;
-webkit-appearance: none;
border-radius: 0;
border:0;
}
input:focus, textarea:focus{
outline: 0;
}
li{
list-style: none;
}
/*
LOADER ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
svg {
max-width: 100%;
}
@-webkit-keyframes spin {
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes spin {
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.loader {
-webkit-animation: spin 1s ease-in-out infinite alternate both;
animation: spin 1s ease-in-out infinite alternate both;
height: 30px;
position: relative;
width: 30px;
margin-left: 40%;
}
.loader svg:not(#circle-middle) {
-webkit-animation: spin 1s ease-in-out infinite alternate both;
animation: spin 1s ease-in-out infinite alternate both;
position: absolute;
top: -50%;
left: 0;
-webkit-transform-origin: bottom center;
-ms-transform-origin: bottom center;
transform-origin: bottom center;
}
.loader svg:nth-of-type(1):not(#circle-middle) {
-webkit-transform: rotate(30deg);
-ms-transform: rotate(30deg);
transform: rotate(30deg);
}
.loader svg:nth-of-type(2):not(#circle-middle) {
-webkit-transform: rotate(60deg);
-ms-transform: rotate(60deg);
transform: rotate(60deg);
}
.loader svg:nth-of-type(3):not(#circle-middle) {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.loader svg:nth-of-type(4):not(#circle-middle) {
-webkit-transform: rotate(120deg);
-ms-transform: rotate(120deg);
transform: rotate(120deg);
}
.loader svg:nth-of-type(5):not(#circle-middle) {
-webkit-transform: rotate(150deg);
-ms-transform: rotate(150deg);
transform: rotate(150deg);
}
.loader svg:nth-of-type(6):not(#circle-middle) {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.loader svg:nth-of-type(7):not(#circle-middle) {
-webkit-transform: rotate(210deg);
-ms-transform: rotate(210deg);
transform: rotate(210deg);
}
.loader svg:nth-of-type(8):not(#circle-middle) {
-webkit-transform: rotate(240deg);
-ms-transform: rotate(240deg);
transform: rotate(240deg);
}
.loader svg:nth-of-type(9):not(#circle-middle) {
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
}
.loader svg:nth-of-type(10):not(#circle-middle) {
-webkit-transform: rotate(300deg);
-ms-transform: rotate(300deg);
transform: rotate(300deg);
}
.loader svg:nth-of-type(11):not(#circle-middle) {
-webkit-transform: rotate(330deg);
-ms-transform: rotate(330deg);
transform: rotate(330deg);
}
.loader svg:nth-of-type(12):not(#circle-middle) {
-webkit-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
.loader svg:nth-of-type(13):not(#circle-middle) {
-webkit-transform: rotate(390deg);
-ms-transform: rotate(390deg);
transform: rotate(390deg);
}
/*
FIN LOADER ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/
.wrapper{
max-width: 1140px;
width: 100%;
margin: 0 auto;
position: relative;
}
.header{
height: 85px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,dddee0+100 */
/*background: #ffffff; /* Old browsers */
/*background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.9) 0%,rgba(221, 222, 224, 0.92) 100%); /* FF3.6-15 */
/*background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.9) 0%,rgba(221, 222, 224, 0.92) 100%); /* Chrome10-25,Safari5.1-6 */
/*background: linear-gradient(to bottom, rgba(255, 255, 255, 0.9) 0%,rgba(221, 222, 224, 0.92) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddee0',GradientType=0 ); /* IE6-9 */
/*position: relative;*/
position: fixed;
/*left: calc(50% - 570px);*/
width: 100%;
left: 0;
right: 0;
z-index: 100;
/*background-color: rgba(255,255,255,.91);*/
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(253,253,253,0) 1%, rgba(0,0,0,0.9) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(253,253,253,0) 1%,rgba(0,0,0,0.9) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(253,253,253,0) 1%,rgba(0,0,0,0.9) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000', endColorstr='#f25a5a5d',GradientType=0 );
top: 0;
}
.logo{
display: inline-block;
/*background: url('../img/logo2.png') 60px 295px no-repeat;*/
background: url('../img/jakarta_logo_inicio.png') 60px 255px no-repeat;
width: 255px;
height: 60px;
background-size: contain;
background-position: 50% 50%;
margin-left: 30px;
margin-top: 26px;
}
.logo:hover{
background-image: url('../img/jakarta_logo_inicio_over.png');
}
.menu{
display: inline-block;
margin-right: 10px;
float: right;
height: 85px;
}
.menu li {
display: inline-block;
vertical-align: top;
margin-top: 40px;
position: relative;
}
.menu li a{
text-align: center;
margin-right: 12px;
margin-left: 12px;
font-size: 16px;
height: 30px;
padding: 5px;
line-height: 30px;
color: white;
/*text-transform: uppercase;*/
}
.menu li > a:hover, .menu li.current-menu-item > a{
font-weight: 300;
border-bottom: 2px white solid;
cursor: pointer;
color: #f1a32c;
border-color: #f1a32c;
}
.menu li:hover .sub-menu{
display: block;
}
.banner{
position: relative;
height: 100%;
z-index: 1;
top: 0px;
/*margin-bottom: 40px;*/
/*margin-bottom: 1px;*/
}
.cc{
font-size: 30px;
color: #555;
width: 564px;
position: absolute;
right: 40px;
bottom: 35px;
text-align: right;
}
.separador{
height: 120px;
text-align: center;
width: 100%;
font-size: 60px;
font-weight: 200;
line-height: 100px;
}
.linea{
border: 1px #f2a32a solid;
width: 15%;
margin: 0 auto;
}
.noticia{
padding: 30px 15px 10px 15px;
height: 290px;
position: relative;
vertical-align: top;
}
.fecha{
position: absolute;
left: 15px;
top: 0;
font-weight: 300;
color: #f2a32a;
font-size: 14px;
}
.thumb{
display: inline-block;
width: 340px;
height: 260px;
margin-right: 5px;
vertical-align: top;
}
.info{
display: inline-block;
height: 270px;
margin-left: 5px;
-moz-column-count: 2;
-moz-column-gap: 10px;
-webkit-column-count: 2;
-webkit-column-gap: 10px;
column-count: 2;
column-gap: 10px;
font-size: 16px;
font-weight: 300;
width: 750px;
}
.info .titulo{
font-size: 35px;
color: #f1a22c;
font-weight: 600;
display: inline-block;
text-align: left;
line-height: 36px;
margin-bottom: 10px;
text-transform: uppercase;
}
.separador2{
height: 85px;
color: white !important;
text-align: left;
width: 100%;
font-size: 48px;
font-weight: 200;
line-height: 85px;
margin: 0 auto;
margin-bottom: 30px;
background: rgb(240,163,44);
background: -moz-linear-gradient(left, rgba(240,163,44,1) 0%, rgba(65,64,66,1) 100%);
background: -webkit-linear-gradient(left, rgba(240,163,44,1) 0%,rgba(65,64,66,1) 100%);
background: linear-gradient(to right, rgba(240,163,44,1) 0%,rgba(65,64,66,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0a32c', endColorstr='#414042',GradientType=1 );
padding-left: 55px;
box-sizing: border-box;
}
.separador2 .linea{
border: 1px white solid;
width: 15%;
}
.separador2 .copete{
width: 700px;
text-align: center;
color: white;
font-size: 21px;
font-weight: 300;
line-height: 30px;
margin: 0 auto;
margin-top: 10px;
}
.contentB{
width: 1140px;
overflow: hidden;
}
.contentB2{
width: 1140px;
font-size: 0;
}
.casos{
white-space: nowrap;
overflow: hidden;
}
.contentB2 .casos{
white-space: normal;
overflow: visible;
padding-left: 30px;
}
.casos .caso{
color: white;
background-color: #4d4d4f;
width: 280px;
height: 420px;
display: inline-block;
margin: 0 15px;
text-align: center;
padding: 30px;
vertical-align: top;
white-space: normal;
overflow: hidden;
}
.casos .caso:first-child{
margin-left: 30px;
}
.contentB2 .casos .caso{
margin: 0;
margin-bottom: 30px;
margin-right: 30px;
}
.contentB2 .casos .caso:first-child{
margin-left: 0;
}
.casos .caso .titulo{
font-size: 32px;
font-weight: 600;
width: 250px;
margin: 0 auto;
margin-bottom: 30px;
line-height: 37px;
}
.casos .caso .texto{
font-size: 16px;
font-weight: 300;
text-align: center;
overflow: hidden;
display: block;
}
.navCasos{
color: #f2a32c;
font-size: 40px;
text-align: center;
font-weight: 200;
margin-bottom: 20px;
}
.flecha, .texto{
display: inline-block;
}
.flecha:hover{
font-weight: 400;
color: red;
}
.contentC{
overflow: hidden;
width: 1096px;
margin: 0 auto;
}
.contentC .productos{
white-space: nowrap;
overflow: hidden;
height: 360px;
position: relative;
}
.contentC .productos .producto{
width: 268px;
height: 340px;
display: inline-block;
vertical-align: bottom;
white-space: normal;
position: absolute;
left: 15px;
}
.navProductos{
color: white;
font-size: 40px;
text-align: center;
font-weight: 200;
height: 65px;
background-color: #4d4d4f;
}
.contentD{
/*height: 450px;*/
background-color: #f1f1f3;
font-size: 0;
margin-bottom: 20px;
}
.contentD .lineamiento{
display: inline-block;
width: 380px;
font-size: 38px;
font-weight: 300;
color: #4e4e50;
/*height: 450px;*/
line-height: 45px;
margin-top: 40px;
margin-bottom: 40px;
}
.contentD .lineamiento img{
display: block;
margin: 0 auto;
margin-bottom: 30px;
}
.contentD .lineamiento span{
display: block;
width: 240px;
text-align: center;
margin: 0 auto;
}
.contentD .lineamiento span .linea{
margin-top: 20px;
width: 30%;
}
.contentE{
background-color: white;
text-align: center;
}
.contentE .titulo{
color: #f1a22c;
font-size: 60px;
font-weight: 200;
line-height: 80px;
margin-top: 20px;
}
.contentE .titulo .linea{
border-color: #4d4d4f;
}
.contentE .copete{
width: 580px;
color: #4d4d4f;
font-size: 24px;
font-weight: 300;
margin: 0 auto;
margin-top: 15px;
margin-bottom: 30px;
}
.contentE .listado{
-moz-column-count: 3;
-moz-column-gap: 30px;
-webkit-column-count: 3;
-webkit-column-gap: 30px;
column-count: 3;
column-gap: 30px;
color: #f1a22c;
text-align: left;
width: 1080px;
margin-left: 30px;
margin-bottom: 30px;
font-size: 19px;
line-height: 36px;
}
.contentE .listado li:before{
/* content: "";
color: #4d4d4f;
font-size: 35px;
line-height: 36px;*/
}
.round{
width: 10px;
height: 10px;
vertical-align: middle;
border-radius: 10px;
margin-right: 10px;
background-color: #4d4d4f;
display: inline-block;
}
.last, .contentF.last{
padding-bottom: 105px !important;
}
.footer{
/*position: fixed;*/
/*left: calc(50% - 570px);*/
z-index: 1000;
/*bottom: 0;*/
box-sizing: border-box;
}
.separador3{
height: 30px;
background-color: #4d4d4f;
display: none;
}
.contacto{
height: 30px;
text-align: left;
/*color: #4d4d4f; */
color: white;
font-size: 14px;
line-height: 30px;
font-weight: 300;
padding-left: 30px;
background-color: #f1a22c;
}
.contacto a:hover{
color: #4d4d4f;
text-decoration: underline;
}
.copyright{
background-color: #4D4D4F;
color: white;
font-size: 12px;
line-height: 20px;
font-weight: 300;
height: 20px;
text-align: left;
padding-left: 30px;
}
.copyright .left{
float: left;
margin-left: 20px;
}
.copyright .right{
float: right;
margin-right: 20px;
}
.copyright a:hover{
color: #f1a22c;
text-decoration: underline;
}
.contentF{
padding: 0px 30px;
border-top: 1px #333 dashed;
margin-bottom: 20px;
}
.contentF .mision{
font-size: 0;
border-bottom: 1px #333 dashed;
position: relative;
}
.contentF .mision .left{
display: inline-block;
background-color: #f1f1f3;
width: 340px;
text-align: center;
position: absolute;
top: 0;
bottom: 0;
}
.contentF .mision .right{
display: inline-block;
background-color: white;
width: 710px;
margin-left: 370px;
vertical-align: top;
padding: 40px 0px 30px 0px;
}
.contentF .mision .left img{
display: block;
vertical-align: top;
margin: 0 auto;
margin-top: 32px;
margin-bottom: 10px;
}
.contentF .mision .left .titulo{
font-size: 42px;
line-height: 48px;
font-weight: 200;
color: #4d4d4f;
display: block;
vertical-align: bottom;
width: 260px;
margin: 0 auto;
margin-bottom: 40px;
}
.contentF .mision .right .texto{
font-weight: 300;
font-size: 18px;
line-height: 20px;
margin-bottom: 20px;
}
.contentF .mision .right .resaltado{
color: #f1a22c;
}
.contentF .mision .right .texto li{
list-style: circle;
margin-left: 20px;
line-height: 21px;
margin-bottom: 5px;
}
.contentG{
}
.lineamiento a:hover{
font-weight: 400;
}
.contentH{
margin-bottom: 30px;
margin-top: 25px;
}
.contentH .left, .contentH .right{
width: 525px;
margin-left: 30px;
display: inline-block;
vertical-align: top;
}
.contentH .left .main2{
font-size: 21px;
line-height: 24px;
font-weight: 300;
color: #4d4d4f;
margin-bottom: 25px;
}
.contentH .titulo{
font-size: 24px;
line-height: 25px;
color: #f1a22c;
margin-bottom: 15px;
}
.contentH .listado li{
list-style: circle;
font-size: 16px;
line-height: 18px;
color: #4d4d4f;
margin-left: 22px;
font-weight: 300;
}
.contentH .main{
font-size: 16px;
line-height: 18px;
font-weight: 300;
color: #4d4d4f;
margin-bottom: 25px;
}
.contentI{
margin-top: 10px;
margin-bottom: 20px;
}
.contentI .columna{
width: 340px;
margin-left: 30px;
display: inline-block;
position: relative;
vertical-align: top;
}
.perfil{
}
.flechaAbajo{
position: absolute;
top: 295px;
right: 15px;
font-size: 50px;
color: #f1a22c;
line-height: 50px;
}
.flechaDerecha{
position: absolute;
bottom: 0;
right: 15px;
font-size: 50px;
color: #f1a22c;
line-height: 50px;
}
.contentI .columna .descripcion{
position: relative;
background-color: #4d4d4f;
padding: 30px;
height: 420px;
margin-bottom: 30px;
}
.contentI .columna .descripcion .texto{
margin-top: 30px;
color: white;
font-size: 34px;
line-height: 36px;
font-weight: 200;
}
.contentI .columna .empleado{
padding: 30px;
background-color: #f2a32c;
height: 358px;
margin-top: 28px;
}
.contentI .columna .empleado .nombre{
margin-top: 20px;
margin-bottom: 10px;
color: white;
font-size: 38px;
line-height: 40px;
}
.contentI .columna .empleado .cargo{
color: white;
font-size: 17px;
line-height: 19px;
margin-bottom: 30px;
}
.contentI .columna .empleado .historia{
color: white;
font-size: 15px;
line-height: 17px;
font-weight: 200;
}
.contentJ{
margin-top: 20px;
font-size: 0;
padding: 0 15px;
border-bottom: 1px #333 dashed;
}
.contentJ .prod{
padding: 15px;
display: inline-block;
/*background-color: #f2a32c;*/
/*height: 670px;*/
width: 310px;
margin: 0 15px;
text-align: center;
vertical-align: top;
-moz-transition: all ease-in-out 0.5s;
-webkit-transition: all ease-in-out 0.5s;
transition: all ease-in-out 0.5s;
margin-bottom: 30px;
}
.contentJ .prod .descripcion{
padding: 20px;
color: white;
}
.contentJ .prod .descripcion .titulo{
font-size: 36px;
line-height: 40px;
font-weight: 600;
margin-bottom: 20px;
}
.contentJ .prod .descripcion .breef{
font-size: 17px;
line-height: 21px;
font-weight: 200;
max-height: 170px;
overflow: hidden;
}
.contentJ .prod:hover{
-moz-transition: all ease-in-out 0.5s;
-webkit-transition: all ease-in-out 0.5s;
transition: all ease-in-out 0.5s;
/*background-color: #F2752C;*/
}
.contentK{
margin-top: 20px;
font-size: 0;
padding: 0 15px;
}
.contentK .prod{
padding: 15px;
display: inline-block;
/*background-color: #4d4d4f;*/
/*height: 670px;*/
width: 310px;
margin: 0 15px;
text-align: center;
vertical-align: top;
-moz-transition: all ease-in-out 0.5s;
-webkit-transition: all ease-in-out 0.5s;
transition: all ease-in-out 0.5s;
margin-bottom: 30px;
}
.contentK .prod .descripcion{
padding: 20px;
color: white;
}
.contentK .prod .descripcion .titulo{
font-size: 36px;
line-height: 40px;
font-weight: 600;
margin-bottom: 20px;
}
.contentK .prod .descripcion .breef{
font-size: 17px;
line-height: 21px;
font-weight: 200;
max-height: 170px;
overflow: hidden;
}
.contentK .prod:hover{
-moz-transition: all ease-in-out 0.5s;
-webkit-transition: all ease-in-out 0.5s;
transition: all ease-in-out 0.5s;
/*background-color: #777;*/
}
.separador4{
height: 120px;
text-align: center;
width: 100%;
font-size: 60px;
font-weight: 200;
line-height: 100px;
color: #1e9abe;
}
.linea4{
border: 1px #4d4d4f solid;
width: 15%;
margin: 0 auto;
}
.contentL {
font-size: 0;
position: relative;
min-height: 390px;
}
.contentL .left{
display: inline-block;
background-color: #f2a32c;
width: 340px;
text-align: center;
position: absolute;
top: 0;
bottom: 0;
}
.contentL .left img{
display: block;
vertical-align: top;
margin: 0 auto;
margin-top: 32px;
}
.contentL .right{
display: inline-block;
background-color: white;
width: 710px;
margin-left: 370px;
vertical-align: top;
padding: 40px 0px 30px 0px;
}
.contentL .right .texto{
font-weight: 300;
font-size: 18px;
line-height: 20px;
margin-bottom: 20px;
}
.contentL .right .titulo{
font-weight: 600;
font-size: 32px;
line-height: 35px;
color: #f1a22c;
margin-bottom: 20px;
}
.contentL .right .titulo2{
font-weight: 600;
font-size: 32px;
line-height: 35px;
color: #4c4c4e;
margin-bottom: 20px;
}
.contentL .right .resaltado{
color: #f1a22c;
font-size: 20px;
line-height: 22px;
font-weight: 300;
}
.contentL .right .texto li{
list-style: circle;
margin-left: 20px;
line-height: 21px;
margin-bottom: 5px;
}
.contentL .right .columnas{
-moz-column-count: 2;
-moz-column-gap: 30px;
-webkit-column-count: 2;
-webkit-column-gap: 30px;
column-count: 2;
column-gap: 30px;
margin-bottom: 40px;
}
.contentL .right .columnas .titulo{
font-size: 21px;
font-weight: 600;
line-height: 23px;
color: #4c4c4e;
margin-bottom: 20px;
}
.contentL .right .columnas .listado{
font-weight: 300;
font-size: 18px;
line-height: 20px;
margin-bottom: 20px;
color: #f1a22c;
}
.contentL .columnas .listado li{
list-style: circle;
margin-left: 20px;
line-height: 21px;
margin-bottom: 5px;
}
.contentL .TOTVS{
background-color: #4d4d4f;
}
.contentContacto{
margin-bottom: 30px;
margin-top: 25px;
position: relative;
}
.contentContacto .left, .contentContacto .right{
width: 525px;
margin-left: 30px;
display: inline-block;
vertical-align: top;
}
.contentContacto .right{
height: 420px;
border: 5px solid #333;
}
.contentContacto .left .line{
margin-bottom: 20px;
display: block;
}
.contentContacto .left .line .label{
font-size: 18px;
font-weight: 300;
display: inline-block;
color: #555;
vertical-align: top;
}
.contentContacto .left .line input{
width: 400px;
background-color: orange;
padding: 5px 10px;
font-size: 18px;
font-weight: 300;
display: inline-block;
color: white;
float: right;
vertical-align: top;
}
.contentContacto .left .line textarea{
width: 390px;
height: 170px;
padding: 15px;
background-color: orange;
font-size: 18px;
font-weight: 300;
resize: none;
display: inline-block;
color: white;
float: right;
vertical-align: top;
}
.contentContacto .left .line input[type=submit]{
background-color: #555;
color: white;
text-align: right;
font-size: 18px;
font-weight: 300;
padding: 5px 10px;
width: 190px;
margin-top: 12px;
}
.contentContacto .left .line input[type=submit]:hover{
cursor: pointer;
background-color: #666;
}
.aguarde{
background-color: white;
position: absolute;
top: 0;
height: 50px;
width: 525px;
text-align: center;
color: white;
font-size: 20px;
line-height: 50px;
background: url(../img/bg2.png) #3E3E3E;
transition: background-position 48s linear;
display: none;
}
.contentContacto:hover .aguarde{
background-position: -1000px 0;
}
.ok{
background-color: white;
position: absolute;
top: 0;
height: 50px;
width: 525px;
text-align: center;
color: white;
font-size: 20px;
line-height: 50px;
background: url(../img/bg2.png) #329400;
transition: background-position 48s linear;
display: none;
}
.contentContacto:hover .ok{
background-position: -1000px 0;
}
.error{
background-color: white;
position: absolute;
top: 0;
height: 50px;
width: 525px;
text-align: center;
color: white;
font-size: 20px;
line-height: 50px;
background: url(../img/bg2.png) #860000;
transition: background-position 48s linear;
display: none;
}
.contentContacto:hover .error{
background-position: -1000px 0;
}
.contentF .fullW{
font-size: 0;
border-bottom: 1px #333 dashed;
position: relative;
padding: 10px 30px;
}
.contentF .fullW .texto.resaltado{
font-weight: 300;
font-size: 36px;
line-height: 38px;
color: #f1a22c;
margin-top: 10px;
margin-bottom: 20px;
}
.contentF .fullW .texto{
margin-bottom: 20px;
}
.contentF .fullW .texto li{
list-style: circle;
margin-left: 20px;
line-height: 24px;
margin-bottom: 5px;
font-size: 22px;
}
.menu ul.sub-menu {
display: none;
position: absolute;
left: 12px;
z-index: 1000;
top: 27px;
padding-top: 10px;
width: 140px;
background-color: rgba(237, 160, 59, 0.9);
}
.menu ul.sub-menu li{
margin-top: 0px;
padding: 5px 10px;
display: block;
}
.sub-menu li a{
text-align: left;
padding: 0;
margin: 0;
text-transform: uppercase;
}
.sub-menu li a:hover, .sub-menu li.current-menu-item a{
font-weight: 600;
border-bottom: 2px white solid;
cursor: pointer;
}
.moreNews{
text-align: center;
}
.masnoticias{
padding: 10px;
background-color: #F1A22C;
display: inline-block;
color: white;
font-size: 18px;
height: 25px;
width: 130px;
}
.masnoticias:hover{
color: #F1F1F3;
background: url(../img/bg2.png) repeat;
background-color: #A96604;
}
.contentF .fullW .texto li:last-child {
list-style: none;
margin-top: 30px;
font-style: italic;
}
.GD{
background: url(../img/logo-gooddata-big.png) no-repeat;
width: 330px;
height: 108px;
background-size: contain;
display: inline-block;
margin-right: 35px;
vertical-align: top;
margin-top: 10px;
}
.custom{
margin-bottom: 5px;
font-size: 20px;
margin: 60px 0px 40px 0px;
text-align: justify;
line-height: 28px;
padding: 0px 30px;
}
.tt{
display: inline-block;
width: 700px;
}
.goodBox,.propBox{
display: inline-block;
width: 525px;
margin-bottom: 60px;
position: relative;
vertical-align: top;
margin: 0px 20px 60px 20px;
}
.goodBox{
}
.goodBox .im{
background-color: #4d4d4f;
width: 525px;
height: 300px;
text-align: center;
vertical-align: top;
}
.propBox .im{
background-color: #f1a32c;
width: 525px;
height: 300px;
text-align: center;
vertical-align: top;
}
.goodBox .description{
background-color: #4d4d4f;
font-size: 18px;
line-height: 28px;
font-weight: 200;
color: white;
padding: 40px 30px;
min-height: 415px;
height: auto;
text-align: justify;
box-sizing: border-box;
}
.propBox .description{
background-color: #4d4d4f;
font-size: 18px;
line-height: 28px;
font-weight: 200;
color: white;
padding: 40px 30px;
min-height: 415px;
height: auto;
text-align: justify;
box-sizing: border-box;
}
.goodBox .description a,.propBox .description a{
font-size: 24px;
line-height: 28px;
font-weight: 200;
color: white;
position: absolute;
bottom: 15px;
right: 30px;
}
.goodBox .im img,.propBox .im img{
/*margin-top: 82px;*/
}
.goodBox .description a:hover,.propBox .description a:hover{
text-decoration: underline;
}
.navProductos.separa{
background-color: #f1a32c;
margin-top: 25px;
margin-bottom: 30px;
}
.navProductos.separa a:hover{
color: #4d4d4f;
}
.title{
font-size: 28px;
line-height: 32px;
color: #000;
margin-bottom: 40px;
font-weight: 200;
}
.pad{
/*padding: 0 50px;*/
}
.biBox .title{
color: #F1A32C;
}
.biBox p{
color: #4d4d4f;
font-size: 28px;
font-weight: 300;
text-align: left;
margin-bottom: 40px;
}
.biBox{
margin-bottom: 45px;
}
.biList li{
color: #F1A32C;
font-size: 28px;
font-weight: 300;
}
.biList{
column-count: 2;
column-gap: 55px;
margin-bottom: 50px;
}
.goodDataWrapper{
font-size: 0;
}
.goodDataWrapper .col, .conch{
display: inline-block;
/*margin: 0 25px;*/
width: 100%;
max-width: 520px;
box-sizing: border-box;
vertical-align: top;
/*margin-right: 100px;*/
font-size: 0;
}
.conch.first, .col.first{
margin-right: 97px;
}
.conch.first img{
margin-top: 25px;
height: auto;
width: 85%;
}
.goodDataWrapper .col > img, .conch > img{
margin-bottom: 60px;
/*margin-top: 25px;*/
max-width: 520px;
}
.conch .title{
color: #F1A32C;
font-size: 28px;
font-weight: 200;
line-height: 42px;
}
.goodDataWrapper .col p{
font-size: 19px;
line-height: 28px;
color: #4D4D4F;
text-align: justify;
margin-bottom: 30px;
font-weight: 200;
}
.conch{
display: inline-block;
height: 300px;
margin-bottom: 50px;
}
.dummy{
/*background-color: #70cad1;*/
width: 100%;
height: 300px;
margin-bottom: 30px;
}
.beneficios{
text-align: center;
}
.beneficiosBox{
margin: 20px 25px;
display: inline-block;
width: 100%;
max-width: 430px;
vertical-align: top;
text-align: center;
}
.beneficiosBox .icono{
/*background-color: #4d4d4f;*/
/*width: 70px;*/
height: 70px;
/*border-radius: 35px;*/
margin: 0 auto;
margin-bottom: 20px;
}
.beneficiosBox .icono img{
/*width: 100%;*/
height: 100%;
}
.beneficiosBox .title{
color: #4d4d4f;
line-height: 36px;
font-size: 28px;
font-weight: 300;
margin-bottom: 5px;
}
.beneficiosBox .meta{
color: #f1a32c;
font-size: 19px;
line-height: 28px;
font-weight: 200;
}
.goodDataWrapper2{
/*background-color: #70cad1;*/
background: url('../img/web_jakarta_GoodData_beneficios_sinLOGO_1150x450.jpg') no-repeat;
/*padding: 90px 75px 70px 25px;*/
margin-bottom: 5px;
width: 100%;
height: 450px;
background-size: cover;
box-sizing: border-box;
padding-top: 80px;
margin-top: 30px;
}
.goodDataWrapper2.ph{
background-image: url('../img/web_jakarta_prophix_beneficios_sinLOGO_1150x450.jpg');
}
.imagenGood{
display: inline-block;
margin-right: 95px;
width: 100%;
max-width: 425px;
vertical-align: top;
margin-top: 90px;
}
.goodDataWrapper2 .costado{
display: inline-block;
width: 100%;
max-width: 470px;
float: right;
vertical-align: top;
}
.goodDataWrapper2 .costado .title{
color: #4d4d4f;
font-size: 28px;
line-height: 36px;
font-weight: 300;
font-style: italic;
margin-bottom: 50px;
}
.goodDataWrapper2 .costado p{
color: #f1a32c;
font-size: 30px;
line-height: 36px;
font-weight: 400;
font-style: italic;
}
.goodDataWrapper2 .costado p span{
margin: 0 25px;
}
.s1{
background-image: url('../img/Jakarta_web2015_headers_1140x365_01.jpg');
background-size: cover;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: 50% 50%;
}
.s2{
background-image: url('../img/Jakarta_web2015_headers_1140x365_02.jpg');
background-size: cover;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: 50% 50%;
}
.s3{
background-image: url('../img/Jakarta_web2015_headers_1140x365_03.jpg');
background-size: cover;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: 50% 50%;
}
.inicio{
background: url('../img/web_jakarta_inicio_1348x675.jpg') no-repeat;
background-size: cover;
width: 100%;
/*position: absolute;
top: 0;*/
min-height:100%;
height: auto;
}
.block{
position: relative;
}
.inicio .copete{
padding-top: 15%;
/*padding-left: 10px;*/
}
.inicio .copete p{
color: white;
font-size: 28px;
line-height: 36px;
font-style: italic;
font-weight: 400;
/*text-indent: -10px;*/
padding-bottom: 15px;
text-align: justify;
padding-left: 10px;
}
.reseller{
padding-top: 3%;
text-align: right;
}
.reseller span{
font-size: 28px;
color: #f1a32c;
margin-right: 35px;
font-weight: 300;
font-style: italic;
}
.reseller img{
margin-right: 15px;
vertical-align: bottom;
}
.reseller a:hover img{
opacity: .8;
}
.abajo{
position: absolute;
bottom: 3%;
left: 0;
right: 0;
display: block;
text-align: center;
}
.nav-icon{
display: none;
}
/* nav icon */
.nav-icon {
width: 45px;
height: 45px;
position: absolute;
top: 33px;
right: 24px;
cursor: pointer;
z-index: 4;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
-o-transform: rotate(0);
transform: rotate(0);
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.nav-icon span:nth-child(1) {
top: 15px;
}
.nav-icon span:nth-child(2) {
top: 22px;
}
.nav-icon span:nth-child(3) {
width: 24px;
top: 29px;
}
.nav-icon:hover span:nth-child(3) {
width: 32px;
}
.nav-icon span {
display: block;
position: absolute;
height: 2px;
width: 32px;
background: white;
left: 6px;
-moz-opacity: 1;
-khtml-opacity: 1;
-webkit-opacity: 1;
opacity: 1;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
-o-transform: rotate(0);
transform: rotate(0);
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.nav-icon.open span {
right: 6px;
background-color: white;
}
.nav-icon.open span:nth-child(1) {
top: 22px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-ms-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);
}
.nav-icon.open span:nth-child(2) {
top: 22px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.nav-icon.open span:nth-child(3) {
left: -30px;
-moz-opacity: 0;
-khtml-opacity: 0;
-webkit-opacity: 0;
opacity: 0;
}
/* nav icon */
/* nav menu */
.nav-wrapper {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 3;
text-align: center;
background-color: rgba(35,41,45,.95);
display: inline-block;
overflow: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 50px;
-moz-opacity: 0;
-khtml-opacity: 0;
-webkit-opacity: 0;
opacity: 0;
-webkit-transform: translatey(-130%);
-moz-transform: translatey(-130%);
-ms-transform: translatey(-130%);
-o-transform: translatey(-130%);
transform: translatey(-130%);
-webkit-transition: all .2s ease-in;
-moz-transition: all .2s ease-in;
-ms-transition: all .2s ease-in;
-o-transition: all .2s ease-in;
transition: all .2s ease-in;
}
.nav-wrapper.open {
-moz-opacity: 1;
-khtml-opacity: 1;
-webkit-opacity: 1;
opacity: 1;
-webkit-transform: translatey(0);
-moz-transform: translatey(0);
-ms-transform: translatey(0);
-o-transform: translatey(0);
transform: translatey(0);
-webkit-transition: all .25s ease-out;
-moz-transition: all .25s ease-out;
-ms-transition: all .25s ease-out;
-o-transition: all .25s ease-out;
transition: all .25s ease-out;
}
.nav-wrapper .nav {
position: relative;
list-style: none;
margin: 0;
padding: 0;
margin: 90px 0 40px 0;
}
.nav-wrapper .nav li a {
outline: 0;
text-decoration: none;
color: #fff;
text-transform: uppercase;
padding: 2.3% 0;
margin: 0;
display: inline-block;
font: 700 36px/36px proxima-nova,Helvetica Neue,Arial,serif;
width: 100%;
-webkit-transition: opacity .2s ease-in;
-moz-transition: opacity .2s ease-in;
-ms-transition: opacity .2s ease-in;
-o-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
font-family: 'Titillium Web', sans-serif;
font-weight: 400;
font-size: 28px;
line-height: 28px;
}
.nav-wrapper .nav li a:hover {
-webkit-transition: opacity .2s ease-out;
-moz-transition: opacity .2s ease-out;
-ms-transition: opacity .2s ease-out;
-o-transition: opacity .2s ease-out;
transition: opacity .2s ease-out;
-moz-opacity: .5;
-khtml-opacity: .5;
-webkit-opacity: .5;
opacity: .5;
}
.list {
list-style: none;
}
.list li {
float: left;
margin: 0px 15px;
}
.list--social li a {
color: #6f797b;
display: inline-block;
/*width: 29px;*/
height: 29px;
position: relative;
-webkit-transition: opacity .3s ease;
-moz-transition: opacity .3s ease;
-ms-transition: opacity .3s ease;
-o-transition: opacity .3s ease;
transition: opacity .3s ease;
font-size: 35px;
}
.list--social li a:hover {
-webkit-transition: opacity .3s ease;
-moz-transition: opacity .3s ease;
-ms-transition: opacity .3s ease;
-o-transition: opacity .3s ease;
transition: opacity .3s ease;
-moz-opacity: .6;
-khtml-opacity: .6;
-webkit-opacity: .6;
opacity: .6;
}
.list--social-nav {
display: inline-block;
float: none!important;
margin-bottom: 50px;
}
.list--social li a span{
vertical-align: middle;
font-size: 20px;
line-height: 35px;
}
/* nav menu */
.separador2.nues{
background: url('../img/web_jakarta_inicio_clientes_1140x180.jpg') no-repeat;
background-size: cover;
height: 180px;
line-height: 260px;
margin-bottom: 65px;
}
.hGood{
height: 365px;
background: url('../img/web_jakarta_GoodData_header_sevicios_1348x365.jpg') no-repeat;
background-size: cover;
width: 100%;
position: relative;
margin-bottom: 10px;
}
.hGood .text{
text-align: right;
font-size: 60px;
color: white;
line-height: 48px;
font-style: italic;
position: absolute;
bottom: auto;
right: 0;
top: 140px;
font-weight: 200;
}
.hProp{
height: 365px;
background: url('../img/web_jakarta_prophix_header_1348x365.jpg') no-repeat;
background-size: cover;
width: 100%;
position: relative;
margin-bottom: 10px;
}
.hProp .text{
text-align: right;
font-size: 60px;
color: white;
line-height: 48px;
font-style: italic;
position: absolute;
bottom: auto;
right: 0;
top: 170px;
font-weight: 200;
}
.etiqueta{
background-color: #f1a32c;
height: 60px;
width: 30%;
box-sizing: border-box;
text-align: right;
line-height: 60px;
font-size: 28px;
color: white;
font-weight: 200;
padding-right: 50px;
margin-bottom: 60px;
}
.seccionG{
}
.seccionG p{
color: #4d4d4f;
font-size: 19px;
line-height: 24px;
margin-bottom: 30px;
font-weight: 200;
}
.separador2.benef{
background: url('../img/web_jakarta_gooddata_beneficios_1140x180.jpg') no-repeat;
background-size: cover;
height: 180px;
line-height: 260px;
margin-bottom: 65px;
margin-top: 25px;
}
.contentE .listado.ph{
-moz-column-count: 2;
-moz-column-gap: 100px;
-webkit-column-count: 2;
-webkit-column-gap: 100px;
column-count: 2;
column-gap: 100px;
}
.separador2.benef.ph{
background-image: url('../img/web_jakarta_prophix_beneficios_1140x180.jpg');
}
.hEmpresa{
height: 365px;
background: url('../img/web_jakarta_empresa_header_1348x432.jpg') no-repeat;
background-size: cover;
width: 100%;
position: relative;
margin-bottom: 10px;
}
.us{
text-align: center;
margin-bottom: 70px;
}
.us .col{
display: inline-block;
max-width: 510px;
width: 100%;
margin: 0 25px;
vertical-align: top;
}
.us .col p{
font-size: 28px;
color: #4d4d4f;
line-height: 33px;
margin-bottom: 50px;
text-align: left;
font-weight: 300;
}
.us .col p.naranja{
color: #f0a22c;
font-style: italic;
}
.misionBox{
vertical-align: top;
text-align: center;
}
.misionBox .titulo{
font-size: 36px;
line-height: 40px;
margin-bottom: 30px;
color: #f0a22c;
font-weight: 400;
text-align: left;
}
.misionBox .bajada{
font-size: 19px;
line-height: 24px;
margin-bottom: 30px;
color: #4d4d4f;
font-weight: 200;
text-align: left;
}
.misionBox a{
display: inline-block;
margin: 0 9px;
}
.misionBox a.ext{
background: url('../img/jakarta_alianza_extend_off.png') no-repeat;
background-size: contain;
width: 155px;
height: 40px;
}
.misionBox a.prophi{
background: url('../img/jakarta_alianza_prophix_off.png') no-repeat;
background-size: contain;
width: 155px;
height: 40px;
}
.misionBox a.totvs{
background: url('../img/jakarta_alianza_totus_off.png') no-repeat;
background-size: contain;
width: 140px;
height: 40px;
}
.misionBox a.ext:hover{
background-image: url('../img/jakarta_alianza_extend_on.png');
}
.misionBox a.prophi:hover{
background-image: url('../img/jakarta_alianza_prophix_on.png');
}
.misionBox a.totvs:hover{
background-image: url('../img/jakarta_alianza_totus_on.png');
}
.etiqueta.gris{
background-color: #4d4d4f;
}
.us .misionBox p{
font-size: 19px;
line-height: 24px;
margin-bottom: 30px;
color: #f1a32c;
font-weight: 200;
text-align: left;
}
.equipo{
text-align: center;
}
.equipo h2{
font-size: 36px;
color: white;
line-height: 38px;
font-weight: 500;
text-align: left;
}
.equipo .contentI .columna .empleado .nombre{
font-weight: 400;
text-align: left;
font-size: 28px;
line-height: 30px;
margin-bottom: 10px;
}
.equipo .contentI .columna .empleado .cargo{
text-align: left;
}
.equipo .contentI .columna .descripcion .texto{
text-align: left;
font-size: 30px;
font-weight: 200;
}
.equipo .contentI .columna .empleado .historia{
text-align: left;
}
.contentContacto{
text-align: center;
}
.contentContacto .left .line textarea,.contentContacto .left .line input{
background-color: #f1a22c;
}
.hContacto{
background-image: url('../img/web_jakarta_contacto_header_1348x365.jpg');
}
.hClientes{
background-image: url('../img/web_jakarta_clientes_header_1348x365.jpg');
}
.goodDataWrapper{
font-size: 0;
column-count: 2;
column-gap: 97px;
height: 220px;
}
.goodDataWrapper.ciento{
height: 170px;
}