/*PORTADA SOMOS TG*/
.portada-contacto{
    background: url("../img/bg-portada-contacto.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    padding-top: 200px;
    padding-bottom: 100px;
    color: #fff;
}

.tit-portada-contacto{ 
    width: 55%;
    padding: 50px 0px;
}

.tit-portada-contacto h1{
    font-size: 5em;
    font-weight: 400;
    letter-spacing: -2px;
    line-height: 1;    
}



.img-portada-contacto{
    margin-top: 50px;
}


@media (min-width: 1100px) and (max-width: 1199px){
            .portada-contacto{
    background: url("../img/bg-portada-contacto-1280.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
}
    .tit-portada-contacto{ 
        width: 60%;
    }

    .tit-portada-contacto h1{
        font-size: 4.5em;
    }
}

@media (min-width: 992px) and (max-width: 1099px){
    .tit-portada-contacto{ 
        width: 60%;
    }

    .tit-portada-contacto h1{
        font-size: 4.5em;
    }
}

@media (min-width: 768px) and (max-width: 991px){
        .portada-contacto{
    background: url("../img/bg-portada-contacto-1024.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

    .tit-portada-contacto{ 
        width: 65%;
    }

    .tit-portada-contacto h1{
        font-size: 4em;
    }
}

@media (min-width: 576px) and (max-width: 767px){
     .portada-contacto{
    background: url("../img/bg-portada-contacto-768.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

    .tit-portada-contacto{ 
        width: 75%;
    }

    .tit-portada-contacto h1{
        font-size: 3.5em;
    }
}

@media (max-width: 575px){
         .portada-contacto{
    background: url("../img/bg-portada-contacto-768.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

    .tit-portada-contacto{ 
        width: 85%;
    }

    .tit-portada-contacto h1{
        font-size: 3em;
    }
}


/*CONTACTO REDES SOCIALES*/

.contacto-rrss{
    padding-top: 100px;
    position: relative;
    z-index: 0;
}


.mod-info-rrss-contacto{
    padding: 0px 50px;
    padding-right: 0px;
    position: relative;
    z-index: 1;
}

.tit-info-rrss-contacto{
    margin-bottom: 30px;
    letter-spacing: -1px;
}

.tit-info-rrss-contacto h2{
    font-weight: 800;
    font-size: 4em;
    line-height: 1;
}

.tit-info-rrss-contacto h3{
    font-weight: 400;
    font-size: 1.3em;
}

.list-info-rrss-contacto{
    background: #E8E8E8;
    padding:  50px;
}

.list-info-rrss-contacto a h4{
    font-size: 1.5em;
    font-family: "IBM Plex Sans", sans-serif;
    font-weight: 400;    
    margin-bottom: 40px;
    color: #3E5F8A;
    letter-spacing: -1px;
}

.list-info-rrss-contacto a h4 span{
        padding-bottom: 5px;
        letter-spacing: -1px;
        border-bottom: solid 2px #A50034;
        text-shadow: 2px 2px 5px #00000000;
        transition: all 0.5s;    
}

.list-info-rrss-contacto a h4 i{
        color: #002357;
        font-size: 1.1em;
        padding-right: 5px;
        transition: all 0.5s;    
}


.list-info-rrss-contacto a h4:hover span{
        color: #002357;
        border-bottom: solid 2px #FF004C;
        text-shadow: 2px 2px 0px #00000025;
        transition: all 0.5s;    
}

.list-info-rrss-contacto a h4:hover i{
        color: #FF004C;
        transition: all 0.5s;    
}



.mod-img-info-rrss{
    position: relative;
    right: 0;
    bottom: 0;
    z-index: 0;

}

.mod-img-info-rrss img{
    width: 100%;
    height: auto;

}



@media (min-width: 1200px) and (max-width: 1399px){
    .mod-img-info-rrss{
    padding-top: 100px;
    margin-left: -100px;
    overflow: hidden;
    z-index: 2;
}

}

@media (min-width: 1100px) and (max-width: 1199px){
       .mod-img-info-rrss{
    padding-top: 100px;
    margin-left: -100px;
    overflow: hidden;
    z-index: 2;
}

.mod-info-rrss-contacto{
    padding: 0px ;
    padding-left: 50px;
}

.tit-info-rrss-contacto h2{
    font-size: 3.5em;
}

.list-info-rrss-contacto a h4{
    font-size: 1.4em;
}

}

@media (min-width: 992px) and (max-width: 1099px){
          .mod-img-info-rrss{
    padding-top: 130px;
    margin-left: -80px;
    overflow: hidden;
    z-index: 2;
}

.mod-info-rrss-contacto{
    padding: 0px ;
    padding-left: 50px;
}

.tit-info-rrss-contacto h2{
    font-size: 3.5em;
}

.list-info-rrss-contacto a h4{
    font-size: 1.4em;
}
}

@media (min-width: 768px) and (max-width: 991px){
    .mod-info-rrss-contacto{
    padding: 0px 100px;
}
.list-info-rrss-contacto{
    width: 85%;
}
.mod-img-info-rrss{
    text-align: center;
}

.mod-img-info-rrss img{
    width: 75%;
    height: auto;

}
}

@media (min-width: 576px) and (max-width: 767px){
        .mod-info-rrss-contacto{
    padding: 0px 50px;
}

.mod-img-info-rrss{
    text-align: center;
}

.mod-img-info-rrss img{
    width: 75%;
    height: auto;

}
}

@media (max-width: 575px){
           .mod-info-rrss-contacto{
    padding: 0px 20px;
}

.mod-img-info-rrss{
    text-align: center;
}

.mod-img-info-rrss img{
    width: 100%;
    height: auto;

}

.tit-info-rrss-contacto h2{
    font-size: 3em;
    overflow: hidden;
}
.tit-info-rrss-contacto h3{
    font-weight: 400;
    font-size: 1.2em;
    line-height: 1.2;
}

.list-info-rrss-contacto{
    padding:  50px 30px;
}

.list-info-rrss-contacto a h4{
    font-size: 1.3em;
    -webkit-hyphens: auto;
    hyphens: auto;
    line-height: 1.4;
}
}

/*CONTACTO DIVISIONES DE NEGOCIO*/
.info-divisiones-contacto{
    background: url("../../../assets/img/bg/bg-poligono-02.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
    padding-top: 100px;
    color: #fff;
    padding-bottom: 100px;
}

.tit-divisiones-contacto{
    padding: 50px 0px;
}

.tit-divisiones-contacto h2{
    font-size: 4em;
    font-weight: 800;
}

.tit-divisiones-contacto h2 img{
    height: 0.5em;
    width: auto;
}

.grid-divisiones-contacto{
    margin-top: 50px;
}

.mod-division-negocio{
    padding: 50px;
    margin-bottom: 50px;
    box-shadow: 5px 5px 15px 0px #00000025;
}

.logo-division-contacto{
    text-align: center;
    padding-top: 30px;
}

.logo-division-contacto.ibcj img{
    width: 50%;
    height: auto;
}

.logo-division-contacto.workus img{
    width: 70%;
    height: auto;
}

.logo-division-contacto.dempresarial img{
    width: 70%;
    height: auto;
}

.info-division-contacto{
    background: #002357;
    padding: 30px;
    letter-spacing: -1px;
}

.info-division-contacto h3{
    font-weight: 700;
    font-size: 2em;
    margin-bottom: 30px;
}

.info-division{
    font-size: 1.2em;
}

.info-division p {
    font-family: "IBM Plex Sans", sans-serif;
}

.info-division p a{
    color: #A4D2FF;
    text-decoration: underline #E51A4C;
    transition: all 0.5s;
}

.info-division p a:hover{
    color: #E51A4C;
    text-decoration: underline #A4D2FF;
    transition: all 0.5s;
}

@media (min-width: 1200px) and (max-width: 1399px){
    .info-division-contacto h3{
    font-size: 1.7em;
}


.logo-division-contacto.workus img{
    width: 80%;
    height: auto;
}

.logo-division-contacto.dempresarial img{
    width: 80%;
    height: auto;
}
}

@media (min-width: 1100px) and (max-width: 1199px){
    .mod-division-negocio{
    padding: 30px;
}

       .info-division-contacto h3{
    font-size: 1.7em;
}

.logo-division-contacto.ibcj img{
    width: 60%;
    height: auto;
}


.logo-division-contacto.workus img{
    width: 85%;
    height: auto;
}

.logo-division-contacto.dempresarial img{
    width: 85%;
    height: auto;
}
}

@media (min-width: 992px) and (max-width: 1099px){

       .mod-division-negocio{
    padding: 30px;
}

       .info-division-contacto h3{
    font-size: 1.6em;
}

.logo-division-contacto.ibcj img{
    width: 60%;
    height: auto;
}


.logo-division-contacto.workus img{
    width: 90%;
    height: auto;
}

.logo-division-contacto.dempresarial img{
    width: 90%;
    height: auto;
}
}

@media (min-width: 768px) and (max-width: 991px){
    .tit-divisiones-contacto h2{
    font-size: 3.5em;
    
}

.grid-divisiones-contacto{
    margin-top: 0px;
}

.mod-division-negocio{
    padding: 20px;
}

.logo-division-contacto.ibcj img{
    width: 70%;
    height: auto;
}

.logo-division-contacto.workus img{
    width: 100%;
    height: auto;
}

.logo-division-contacto.dempresarial img{
    width: 100%;
    height: auto;
}


.info-division-contacto{
    padding: 30px 20px;
}

.info-division-contacto h3{
    font-size: 1.6em;
}

}

@media (min-width: 576px) and (max-width: 767px){

    .tit-divisiones-contacto{
        padding: 50px;
    }

    
.tit-divisiones-contacto h2{
    font-size: 3.5em;
    text-indent: -1.1em;
    line-height: normal;
    padding-left: 1em;

}

.grid-divisiones-contacto{
    margin-top: 0px;
    padding: 0px 50px;
}

.mod-division-negocio{
    padding: 30px;
    margin-bottom: 50px;
    box-shadow: 5px 5px 15px 0px #00000025;
}

.logo-division-contacto{
    padding: 30px 10px;
}

.logo-division-contacto.ibcj img{
    width: 40%;
    height: auto;
}

.info-division-contacto h3{
    font-size: 1.5em;
}
}

@media (max-width: 575px){
     .tit-divisiones-contacto{
        padding: 50px 20px;
    }

    
.tit-divisiones-contacto h2{
    font-size: 2.5em;
    text-indent: -1.1em;
    line-height: normal;
    padding-left: 1em;

}

.grid-divisiones-contacto{
    margin-top: 0px;
    padding: 0px;
}

.mod-division-negocio{
    padding: 30px 20px;
    margin-bottom: 50px;
    box-shadow: 5px 5px 15px 0px #00000025;
}

.logo-division-contacto{
    padding: 30px 10px;
}

.logo-division-contacto.ibcj img{
    width: 40%;
    height: auto;
}

.info-division-contacto h3{
    font-size: 1.5em;
}
}


/*ESTILOS FORMULARIO DE CONTACTO*/
.formulario-contacto{
    background: #d5d7e1;
    padding-top: 100px;
    padding-bottom: 100px;
    text-align: center;
}

.form-contacto-left{
    text-align: left;
    letter-spacing: -1px;
    padding: 0px 30px;
}

.info-contacto-left{
    font-size: 1.3em;
    padding: 0px 50px;
}

.info-contacto-left h2 {
    font-weight: 800;
    font-size: 3em;
    line-height: 1;
    text-indent: -0.5em;
}

.info-contacto-left h2 img{
    height: 0.3em;
    width: auto;
}

.info-contacto-left p{
    margin-top: 30px;
    margin-bottom: 30px;
    font-family: "IBM Plex Sans", sans-serif;
    letter-spacing: -1px;
    line-height: 1.4;
    font-weight: 400;
    padding-right: 30px;
    color: #2b2b2b;
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.info-contacto-left p img{
    width: auto;
    height: 1em;
    
}

.img-form-left{
    text-align: center;
    margin-top: 30px;
}

.img-form-left img{
    width: 100%;
    height: auto;
}

.form-contacto-right{
    padding-right: 50px;
}

@media (min-width: 1200px) and (max-width: 1399px){
    .info-contacto-left p{
    padding-right: 0px;
}
  
}

@media (min-width: 1100px) and (max-width: 1199px){

    .info-contacto-left{
    font-size: 1.3em;
    padding: 0px ;
    padding-left: 30px;
}

.info-contacto-left p{
    padding-right: 0px;
}


.form-contacto-right{
    padding-right: 0px;
}
}

@media (min-width: 992px) and (max-width: 1099px){
    .form-contacto-left{
    padding: 0px;
}

.info-contacto-left{
    font-size: 1.2em;
    padding: 0px ;
    padding-left: 50px;
}

.info-contacto-left p{
    padding-right: 0px;
}

.form-contacto-right{
    padding-right: 0px;
}
  
}

@media (min-width: 768px) and (max-width: 991px){

    .form-contacto-left, .form-contacto-right{
    padding: 0px 100px;
}


}

@media (min-width: 576px) and (max-width: 767px){
    .info-contacto-left{
    font-size: 1.2em;
    padding: 0px 30px;
}
.form-contacto-right{
    padding: 0px 50px;
}
}

@media (max-width: 575px){
    .form-contacto-left{
    padding: 0px 15px;
}
.info-contacto-left{
    font-size: 1.2em;
    padding: 0px;
}

.info-contacto-left h2 {
    font-size: 2.5em;
    padding-left: 0.5em;
}

.info-contacto-left p{    
    padding: 0px 20px;
}


.form-contacto-right{
    padding: 0px;
}
}


/*

@media (min-width: 1200px) and (max-width: 1399px){}

@media (min-width: 1100px) and (max-width: 1199px){}

@media (min-width: 992px) and (max-width: 1099px){}

@media (min-width: 768px) and (max-width: 991px){}

@media (min-width: 576px) and (max-width: 767px){}

@media (max-width: 575px){}

*/