
/*-----------------SECTION 1---------------------------*/
.section1{
    padding-top: 140px;
    padding-bottom: 100px;
}
.section1 .container .solutions{
    position: relative;
    width: 41%;
    max-width: 660px;
    height: 318px;
    margin-right: 25px;
}
.section1 .container .contactus{
    width: auto;
    height: 318px;
    margin-left: 25px;
}
.section1 .container .solutions .textContainer .title{
    color: var(--text-black);
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 38px;
    line-height: 45px;
    width: 100%;
    margin-bottom: 35px;
}
.section1 .container .solutions .textContainer .text{
    color: var(--text-text);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 14px;
    line-height: 15px;
    text-align: justify;
    width: 100%;
}
.section1 .iconCorner {
    width: 93px;
    height: 93px;
    margin-bottom: -39px;
    margin-left: -58px;
}

.section1 .container .contactus .textContainer {
    background: #FFFFFF;
    box-shadow: -8px 7px 8px 6px rgba(0, 0, 0, 0.15);
    border-radius: 0px 30px 30px 30px;
    width: 340px;
    margin-top: 10px;
    padding: 33px;
    padding-right: 30px;
    padding-left: 30px;
}

.section1 .container .contactus .textContainer .title {
   color: var(--text-title);
   font-family: var(--font-main);
   font-weight: 700;
   font-size: 25px;
   line-height: 30px;
   margin-bottom: 20px;
}
.section1 .container .contactus .textContainer .text{
    color: var(--text-text);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 14px;
    line-height: 15px;
    text-align: justify;
    margin-bottom: 35px;
}
.section1 .container .contactus .textContainer .button{
    padding: 10px;
    padding-left: 25px;
    padding-right: 25px;
    border: 1px solid #003F68;
    box-sizing: border-box;
    width: max-content;
}
.section1 .container .contactus .textContainer .button a{
    color: var(--text-text);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 14px;
    line-height: 15px;
    text-align: justify;
    outline: none;
    text-decoration: none;
}
.section1 .container .contactus .textContainer .button img{
    margin-left: 10px;
}

/*-----------------SECTION 2---------------------------*/
.section2{
    background: linear-gradient(90deg, #003F68 0%, rgba(0, 63, 104, 0.72) 100%);
}
.section2 .property{
    width: 50%;
}

.section2 .banner{
    width: 50%;
    background-image: url("https://res.cloudinary.com/dhga15zq8/image/upload/v1628905222/JE/banner1_ep6emx.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left bottom;
    height: 500px;
}
.section2 .property .container{
    width: max-content;
    margin-left: auto;
    margin-top: 18%;
    position: relative;
}

.section2 .property .container .title{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 37px;
    line-height: 43px;
    max-width: 493px;
    margin-bottom: 14px;
}

.section2 .property .container .text{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 14px;
    line-height: 15px;
    text-align: justify;
    max-width: 475px;
}

/*-----------------SECTION 3---------------------------*/
.section3{
    background: linear-gradient(180deg, #1F5C95 0%, #061A2D 100%);
    padding-top: 120px;
    padding-bottom: 228px;
}
.section3 .cardContainer {
    width: 90%;
    max-width: 996px;
    justify-content: space-between;
}
.section3 .cardContainer .card{
    width: 263px;
}
.section3 .cardContainer .card img{
    width: 147px;
    height: 125px;
}

.section3 .cardContainer .card img{
    animation: float 6s ease-in-out infinite;
}
.section3 .cardContainer .card img:last-of-type{
    animation: float2 5s ease-in-out infinite;
}

.section3 .cardContainer .card .title{
    color: var(--title-cards);
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    margin-bottom: 15px;
}
.section3 .cardContainer .card .text{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 15px;
    line-height: 18px;
    text-align: center;
}

@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-20px);
	}
	100% {
		transform: translatey(0px);
	}
}

@keyframes float2 {
	0% {
		transform: translatey(-20px);
	}
	60% {
		transform: translatey(0px);
	}
	100% {
		transform: translatey(-20px);
	}
}

/*-----------------SECTION 4---------------------------*/
.section4{
    padding-top: 0px;
    padding-bottom: 120px;
}
.section4 .globesContainer {
    width: 95%;
    max-width: 1040px;
    justify-content: space-around;
    margin-top: -112px;
    z-index: 2;
}
.section4 .globesContainer .globe {
    max-width: 300px;
    position: relative;
}
.section4 .globesContainer .globeContain {
    padding: 17px;
    padding-left: 21px;
    padding-right: 21px;
    padding-top: 10px;
    height: 80%;
    justify-content: space-around;
}
.section4 .globesContainer .globe .star {
    width: 25px;
    height: 25px;
    margin-bottom: 7px;
}
.section4 .globesContainer .text{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 13px;
    line-height: 15px;
    margin-bottom: 10px;
    min-width: inherit;
}
.section4 .globesContainer .inicials{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 15px;
    line-height: 18px;
}
.section4 .globesContainer .type{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 15px;
    line-height: 19px;
}
.section4 .globesContainer .globe .globeBack {
    width: 100%;
    position: absolute;
    z-index: -1;
    height: 180px;
}
/*-----------------CONTACT---------------------------*/
.contact{
    padding-top: 120px;
    padding-bottom: 120px;
}

/*-----------------FOOTER---------------------------*/
.footer{
    background: var(--main-bg-color);
    padding: 25px;
}
.footer .containerFooter{
    width: 90%;
    max-width: 1400px;
}
.footer .containerFooter .rows {
    justify-content: space-around;
    align-items: self-start;
    margin-bottom: 20px;
}
.footer .containerFooter .rows .title{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 500;
    font-size: 19px;
    line-height: 24px;
    text-align: start;
    margin-bottom: 15px;
}

.footer .containerFooter .text{
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 13px;
    line-height: 15px;
    text-align: justify;
}
.footer .containerFooter .rows .links{
    width: 190px;
    margin-right: 50px;
}
.footer .containerFooter .rows .about{
    width: 310px;
}
.footer .containerFooter .rows .contactFoo{
    width: 200px;
}

.footer .containerFooter .copy .text{
    max-width: 482px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.footer .containerFooter .rows .links .option {
    color: var(--text-color);
    font-family: var(--font-menu);
    font-size: 13px;
    font-weight: 400;
    line-height: 16.11px;
    outline: none;
    height: unset;
    text-decoration: none;
    margin-bottom: 10px;
    position: relative;
}

.footer .containerFooter .rows .contactFoo p, .footer .containerFooter .rows .contactFoo p{
    margin-bottom: 10px;
}
.footer .containerFooter .rows .contactFoo .icos img{
    width: 19px;
    height: 19px;
    margin-left: 3px;
    margin-right: 3px;
}

.footer .containerFooter .rows .links .option:hover{
    cursor: pointer;
}
/*
.footer .containerFooter .rows .links .option:hover::after {
    content: "";
    position: absolute;
    left: 0%;
    right: 52%;
    bottom: 0;
    border: 0.5px solid var(--text-color);
  }*/


  /*-----------------HEAD RESOURCES---------------------------*/

.containerHeader.head{
    height: 442px;
}
.headBlog .containerHeader.head {
    height: 352px;
}
.head-main{
    width: 100%
}
.head-main .margin{
    width: 85%;
    max-width: 970px;
    margin-bottom: 50px;
    margin-top: -75px;
    position: relative;
}
.head-main .color{
    width: 22px;
    height: 100%;
    background: #1F70A5;
}
.head-main .title{
    padding: 23px;
    width: 250px;
}
.head-main .title p{
    color: #1F70A5;
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 30px;
    line-height: 31px;
    text-align: start;
}

.head-main .headContainer{
    width: 370px;
    height: 123px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    background-color: var(--text-color);
}

/*-----------------WAVE ANIMATION---------------------------*/
.editorial {
    display: block;
    width: 100%;
    height: 80px;
    max-height: 80px;
    margin: 0;
    z-index: 5;
    margin-top: auto;
    margin-bottom: 0px;
  }
  
  .parallax1 > use {
    animation: move-forever1 15s linear infinite;
  }
  .parallax1 > use:nth-child(1) {
    animation-delay: -2s;
  }
  
  .parallax4 > use {
    animation: move-forever4 12s linear infinite;
  }
  .parallax4 > use:nth-child(1) {
    animation-delay: -2s;
  }
  
  @keyframes move-forever1 {
    0% {
      transform: translate(85px, 0%);
    }
    100% {
      transform: translate(-90px, 0%);
    }
  }
  @keyframes move-forever2 {
    0% {
      transform: translate(-90px, 0%);
    }
    100% {
      transform: translate(85px, 0%);
    }
  }
  @keyframes move-forever3 {
    0% {
      transform: translate(85px, 0%);
    }
    100% {
      transform: translate(-90px, 0%);
    }
  }
  @keyframes move-forever4 {
    0% {
      transform: translate(-90px, 0%);
    }
    100% {
      transform: translate(85px, 0%);
    }
  }

/*-----------------CONTACT US---------------------------*/
.contactSection{
    padding-bottom: 120px;
    margin-top: 0px;
    background: linear-gradient(180deg, rgba(196, 196, 196, 0) 0%, #C4C4C4 100%);
}
.contactSection .contactContainer{
    width: 90%;
    max-width: 1400px;
    align-items: flex-end;
}
.contactSection .contactContainer .formColumn{
    width: 460px;
    margin-right: 20px;
}
.contactSection .contactContainer .formColumn form input{
    width: 100%;
    height: 35px;
    padding: 2px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 8px;
    box-sizing: border-box;
    border-radius: 26px;
    outline: none;
    border: 1px solid #E5E5E5;

    color: #737373;
    font-family: var(--font-menu);
    font-size: 13px;
    font-weight: 400;
    line-height: 16.11px;
}
.contactSection .contactContainer .formColumn form textarea{
    width: 100%;
    height: 188px;
    padding: 8px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 5px;
    box-sizing: border-box;
    border-radius: 26px;
    outline: none;
    border: 1px solid #E5E5E5;

    color: #737373;
    font-family: var(--font-menu);
    font-size: 13px;
    font-weight: 400;
    line-height: 16.11px;
}
.contactSection .contactContainer .formColumn .title{
    color: #737373;
    font-family: var(--font-main);
    font-weight: 700;
    font-size: 43px;
    line-height: 53px;
    margin-bottom: 25px;
}

.contactSection .contactContainer .formColumn form .buttons{
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 15px;
    line-height: 18px;
    margin-top: 15px;
    justify-content: flex-end;
}
.contactSection .contactContainer .formColumn form .buttons button{
    width: 145px;
    height: 45px;
    background: #1F70A5;
    border-radius: 32px;
    border: none;
    outline: none;
    text-decoration: none;
    color: var(--text-color);
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
}
.contactSection .contactContainer .formColumn form .buttons button:hover{
    cursor: pointer;
}
.contactSection .contactContainer .formColumn form .buttons .ok{
    color: #1F70A5;
    margin-left: 10px;
    display: none;
    margin-right: auto;
}
.contactSection .contactContainer .formColumn form .buttons .no{
    color: #1F70A5;
    margin-left: 10px;
    margin-right: auto;
    display: none;
}

.appear{display:initial !important;transition:0.5s;}

.contactSection .contactContainer .infoColumn{
    width: 460px;
    margin-left: 20px;
}

.contactSection .contactContainer .infoColumn .info{
    color: #575656;
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 15px;
    line-height: 15px;
    width: 320px;
    margin-bottom: 20px;
    display: inherit;
}
.contactSection .contactContainer .infoMobile {
    display: none;
    width: 320px;
}

.contactSection .contactContainer .infoMobile p{
    color: #575656;
    font-family: var(--font-main);
    font-weight: 400;
    font-size: 17px;
    line-height: 20px;
    margin-bottom: 20px;
}

.logosMenu{
    display: none;
}

.logoDrop{
    z-index: 10;
    position: absolute;
    width: 52px;
    top: 16px;
    left: 20px;
}
.gmap_canvas img{
    width: 100%; 
}

/*----------------MEDIA QUERYS ----------------*/

@media (max-width: 1100px) {
    .section2 .property .container {
        margin-left: 18%;
        margin-top: 25%;
        width: 90%;
    }
}
@media (max-width: 1000px) {
    .section4 .globesContainer{
        flex-wrap: wrap;
    }
    .section4 .globesContainer .globe:last-of-type {
        margin-top: 65px;
    }
    .section4 .globesContainer .globe {
        max-height: 190px;
    }
    .section4 .globesContainer .globe {
        max-width: 381px;
    }
    .footer .containerFooter .rows .about {
        width: 50%;
    }
    .footer .containerFooter .rows .links {
        width: 190px;
        margin-right: 4%;
    }
    .mission .cardContainer {
        flex-wrap: wrap;
    }
    .mission .cardContainer .card {
        margin-bottom: 30px;
    }
}

@media (max-width: 966px) {
    .cont1{
        flex-direction: column;
    }

    .section1 .container .solutions {
        width: 68%;
    }
    .containerHeader .textBox {
        width: 70%;
        margin-right: auto;
        margin-left: 5%;
    }
    .section3 .cardContainer{
        flex-wrap: wrap;
    }
    .section3 .cardContainer .card:last-of-type {
        margin-top: 40px;
    }
}
@media (max-width: 876px) {
    .section3 .cardContainer {
        justify-content: center;
    }
}


@media (max-width: 950px) {
    .hamburguer{
        display: inherit;
        
    }
    body section:first-of-type {
        z-index: -1;
    }
    .containerMenu {
        z-index: 30;
        height: 64px !important;
    }
    .containerMenu .normal{
        display: none;
    }

    .containerMenu .mobile.open{
        right: 0%;
        transition: 0.8s;
    }
    .containerMenu .mobile .resourcesBox{
        height: max-content;
        position: initial;
        margin-left: auto;
        margin-right: auto;
        transition: 0.8s;
        overflow-y: hidden;
        margin-top: 0px;
        margin-bottom: 0px;
        padding: 0px;
        width: 100%;
    }

    .containerMenu .option a {
        color: var(--text-color);
        font-family: var(--font-menu);
        font-size: 18px;
        text-align: center;
        font-weight: 500;
        line-height: 40px;
        outline: none;
        height: unset;
        text-decoration: none;
    }

    .containerMenu .mobile .resourcesBox.openBox{
        height: 160px;
        width: 200px;
        background: transparent;
        transition: 0.8s;
    }
    .containerMenu .option {
        width: 86%;
        margin-right: auto; 
        height: 40px;
    }
    .containerMenu .option {
        margin-left: auto;
    }
    .resMenu{
        overflow: hidden;
        transition: 0.8s;
    }
    .containerMenu .resourcesBox .option {
        font-weight: 600;
        font-size: 13px;
        line-height: 20px;
        transition: 0.8s;
        margin-left: auto;
        height: 20px;
        margin-bottom: 12px;
        background-color: transparent;
    }

    .containerMenu .resourcesBox {
        background-color: transparent;
        display: flex;
    }

    .containerMenu .option:hover{
        background-color: white;
        border-radius: 20px;
        height: 40px;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
    }
    .containerMenu .option.openBox{
        overflow: hidden;
        height: 175px;
        transition: 0.8s;
    }

    .containerMenu .option:hover a {
        color: var(--text-title);
    }
    
    .contactSection .contactContainer {
        flex-wrap: wrap;
    }
    .contactSection .contactContainer .infoColumn .info {
        display: none;
    }
    .contactSection .contactContainer .infoMobile {
        display: inherit;
    }
    .contactSection .contactContainer .infoColumn {
        margin-top: 50px;
        margin-left: auto;
        margin-right: auto;
    }

    .footer .containerFooter .rows {
        flex-direction: column;
    }
    .footer .containerFooter .rows .group{
        flex-direction: column;
    }

    .footer .containerFooter .rows .links {
        margin-bottom: 50px;
    }

    .footer .containerFooter .rows .about {
        margin-bottom: 50px;
    }

    .footer .containerFooter .rows .contactFoo {
        margin-bottom: 50px;
    }
    .footer .containerFooter .rows .about {
        width: 88%;
    }

    .logoMenu{
        display: inherit;
    }

    .containerMenu.smallMenu {
        padding-top: 0px;
        transition: 1s;
    }
    .containerMenu {
        height: 0px !important;
        padding-top: 0px;
        transition: 0s;
    }

    .logosMenu{
        display: inherit;
        position: fixed;
        background-color: var(--main-bg-color);
        width: 100%;
        height: 49px;
        z-index: 25;
    }

}
@media (max-width: 846px) {
    .section4 .globesContainer .globe:nth-child(2) {
        margin-top: 40px;
    }

    .section4 .globesContainer .globe:nth-child(2) .globeBack {
        transform: scaleX(-1);
    }

    .logoMenu {
        width: 71px;
        top: 10px;
        left: 30px;
        z-index: 20;
        transition: 1s;
    }
    .logoMenu.smallLogoMobile {
        transition: 1s;
    }
}
@media (max-width: 806px) {
    .section4 .globesContainer {
        flex-wrap: wrap;
        justify-content: center;
        align-items: flex-end;
    }
    .section4 .globesContainer .globe:last-of-type {
        margin-top: 40px;
    }
}

@media (max-width: 730px) {
    .section2 .property .container {
        margin-left: 15%;
        margin-top: 15%;
        width: 90%;
        min-width: 270px;
    }
    .section1 .container .solutions {
        position: relative;
        width: 70%;
        height: 318px;
        margin-right: initial;
    }
    .section1 .container .contactus {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
    .section1 .container .contactus .textContainer{
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }
    .section3 .cardContainer .card {
        width: 80%;
    }
    .section3 .cardContainer .card {
        margin-top: 60px;
    }
    .section3 {
        padding-top: 30px;
    }
    .section2 .property .container .title{
        font-size: 42px;
        line-height: 46px;
    }
}
@media (max-width: 628px) {
    .mission .cardContainer .card {
        width: 80%;
        margin-bottom: 20px;
    }
}
@media (max-width: 545px) {
    .contactSection .contactContainer .infoColumn {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
    .section1 {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .containerHeader .textBox .title {
        font-size: 36px;
        line-height: 39px;
    }
    .section1 .container .solutions .textContainer .title {
        font-size: 34px;
        line-height: 35px;
    }
    .section2 .property .container .title {
        font-size: 37px;
        line-height: 41px;
        margin-bottom: 20px;
        margin-top: 35px;
    }
    .section2 .banner {
        height: 408px;
    }
}

@media (max-width: 509px) {
    .gmap_canvas {
        width: auto !important; 
    }
    
    .mapouter {
        width: auto !important;
    }

    .contactSection .contactContainer .infoColumn .map{
        width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .section1 {
        padding-top: 35px;
        padding-bottom: 35px;
    }

    .footer .containerFooter .rows .about {
        width: 98%;
    }

    .aviso .containerAviso .title {
        width: 70%;
        text-align: center;
        font-size: 31px;
        line-height: 32px;
        margin-bottom: 10px;
    }
    
    .aviso .containerAviso .text{
        width: 80%;
        text-align: center;
    }
    .containerHeader.head {
        height: 230px;
    }
    .headBlog .containerHeader.head {
        height: 230px;
    }
}

@media (max-width: 475px) {
    .section1 .container .contactus {
        width: 90%;
    }

    .section1 .container .contactus .textContainer{
        width: 80%;
    }
    .section1 .container .solutions {
        height: max-content;
    }
    .section1 .iconCorner {
        width: 70px;
        height: 70px;
        margin-bottom: -33px;
        margin-left: -45px;
    }
    .section1 .container .solutions .textContainer .title {
        font-size: 28px;
        line-height: 28px;
    }

    .containerHeader .textBox .title {
        font-size: 33px;
        line-height: 33px;
    }

    .section2 .banner {
        display: none;
    }
    .section2 .property{
        width: 100%;
    }

    .section2 .property .container {
        margin: 5%;
        margin-left: auto;
        margin-right: auto;
        width: 85%;
        min-width: inherit;
    }
    .section2 .property .container .title {
        font-size: 29px;
        line-height: 30px;
        margin-bottom: 20px;
    }
    .section2 .property .container .text {
        margin-bottom: 30px;
    }

    .section4 .globesContainer {
        width: 75%;
        max-width: 1150px;
        justify-content: space-around;
        margin-top: -112px;
        z-index: 2;
    }

    .section4 .globesContainer .globeContain {
        padding-left: 20px;
        padding-right: 20px;
        height: 82%;
    }


    .contactSection .contactContainer .formColumn .title {
        font-size: 35px;
        line-height: 48px;
    }
    .contactSection .contactContainer .infoMobile p{
        font-size: 16px;
        line-height: 18px;
    }
    .contactSection .contactContainer .formColumn {
        margin-right: 0px;
    }
    .contactSection .contactContainer {
        width: 85%;
    }
    .contactSection {
        padding-bottom: 90px;
    }
    .section4 {
        padding-bottom: 60px;
    }
}

@media (max-width: 475px) {
    .head-main .headContainer {
        width: 84%;
        height: 135px;
    }
}

@media (max-width: 370px) {
    .head-main .title p {
        font-size: 28px;
        line-height: 28px;
    }
}