/*Home*/
html, body {
    margin: 0;
    font-family:'Poppins', sans-serif;
    overflow-x: hidden;
    background: linear-gradient(90.34deg, #0000FF 27.66%, #00FFFF 133.05%);
}

.loader-wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #0000FF;
    display:flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

#myVideo {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    display: none;
}  

.loader {
    display: inline-block;
    width: 30px;
    height: 30px;
    position: relative;
    border: 4px solid #00FFFF;
    animation: loader 2s infinite ease;
    z-index: 999;
}

.loader-inner {
    vertical-align: top;
    display: inline-block;
    width: 100%;
    background-color: #00FFFF;
    animation: loader-inner 2s infinite ease-in;
    z-index: 999;
}

@keyframes loader {
    0% { transform: rotate(0deg);}
    25% { transform: rotate(180deg);}
    50% { transform: rotate(180deg);}
    75% { transform: rotate(360deg);}
    100% { transform: rotate(360deg);}
}

@keyframes loader-inner {
    0% { height: 0%;}
    25% { height: 0%;}
    50% { height: 100%;}
    75% { height: 100%;}
    100% { height: 0%;}
}

nav {
    position: relative; /* Make it stick/fixed */
    top: 0; /* Stay on top */
    width: 100%; /* Full width */
    transition: top 0.3s; /* Transition effect when sliding down (and up) */
    display: block;
    z-index: 99;
    float: flex;
}

nav.white{
    background: white;
    transition: top 0.3s; /* Transition effect when sliding down (and up) */
}

.logo{
    width: 132px;
    height: 46px;
    background: url(img/logoe92_mobile.svg);
    background-size: cover;
    background-position: center;
    cursor: pointer;
    z-index: 1;
    position: relative;
    top: 20px;
    left: 9%; 
    margin-bottom: 45px;  
}

.menu{
    height: 32px;
    width: 44px;
    z-index: 3;
    cursor: pointer;
    fill: #ffffff;
    position: relative;
    z-index: 1;
    top: -10px;
    left: 80%;
    display: none;
}   

nav.white .logo{
    background: url(img/logoe92_mobile2.svg); 
}

nav.white .menu{
    fill: #2515E3;
    z-index: 1;
}   

/* The Overlay (background) */
.overlay {
    /* Height & width depends on how you want to reveal the overlay (see JS below) */   
    height: 0;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(0, 0, 255); /* Black fallback color */
    background-color: rgba(0, 0, 255, 0.9); /* Black w/opacity */
    overflow-y: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}
  
  /* Position the content inside the overlay */
.overlay-content {
    position: relative;
    top: 25%; /* 25% from the top */
    width: 100%; /* 100% width */
    text-align: center; /* Centered text/links */
    margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

.logo2{
    width: 132px;
    height: 46px;
    background: url(img/logoe92_mobile.svg);
    background-size: cover;
    background-position: center;
    cursor: pointer;
    z-index: 1;
    position: relative;
    top: -180px;
    left: 7%;   
}

/* The navigation links inside the overlay */
.overlay a {
    padding: 10px;
    text-decoration: none;
    font-size: 24px;
    font-weight: 500;
    color: #ffffff;
    display: block; /* Display block instead of inline */
    transition: 0.3s; /* Transition effects on hover (color) */
}
  
/* When you mouse over the navigation links, change their color */
  .overlay a:hover, .overlay a:focus {
    color: #00FFC4;
}
  
/* Position the close button (top right corner) */
.overlay .closebtn {
    position: absolute;
    top: 10px;
    right: 9%;
    font-size: 40px;
}
  
/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */

@media screen and (max-height: 450px) {
    .overlay {overflow-y: auto;}
    .overlay a {font-size: 20px}
    .overlay .closebtn {
      font-size: 40px;
      top: 15px;
      right: 35px;
}
}

h1 {
    font-size: 40px;
    font-weight: 900;
    color: #FAAB2A;
    text-align: left;
    margin-bottom: 18px;
    line-height: 37px;
    background: linear-gradient(180deg, #00FFC4 -8.89%, #00B2FF 100.73%););
    /* clip hackery */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

h2 {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    text-align: left;
    margin-bottom: 15px;
    line-height: 30px;
}

h3 {
    font-size: 25px;
    font-weight: 600;
    color: #ffffff;
    line-height: 30px;
    margin-block-start: 0px;
    margin-block-end: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

a {
    text-decoration: none;
}

p{
    font-size: 14px;
    font-weight: 300;
    color: #ffffff;
    text-align: left;
    margin-bottom: 25px;
    line-height: 24px;
    margin-block-start: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.bold{
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    text-align: left;
    margin-bottom: 25px;
    line-height: 24px;
}

.link{
    font-size: 12px;
    font-weight: 600;
    color: #ffffff;
    text-align: left;
    margin-bottom: 25px;
    line-height: 24px;
    text-decoration: none;
}

.bienvenida{
    height: 800px;
    width: 100%;
}

.wrapper-bienvenida{
    max-width: 80%;
    position: relative;
    left: 0%;
    top: 15%;
    margin: 0 auto 50px auto;
}

.wrapper-flecha{
    position: relative;
    left: 0%;
    top: 10px;
}

.circulo{
    fill: white;
    position: absolute;
    top: -3px;
    left: 160px;
    margin: 0 auto 0px auto;
}

.circulo:hover {
    fill: #00FFFF;
    transition: 1s;
    cursor: pointer;
}

.circulo:hover .flecha{
    fill: blue;
    cursor: pointer;
}

.circulo2{
    fill: white;
    position: absolute;
    left: 31%;
    top: 88%;
    margin: 0 auto 0px auto;
}

.flecha2{
    fill: #F4774F;
}

.circulo2:hover {
    fill: #00FFFF;
    cursor: pointer;
}

.circulo2:hover .flecha{
    fill: white;
    cursor: pointer;
}

.circulo3{
    fill: white;
    position: absolute;
    left: 31%;
    top: 89%;
    margin: 0 auto 0px auto;
}

.flecha3{
    fill: #191D29;
}

.circulo3:hover {
    fill: #0126A9;
    cursor: pointer;
}

.circulo3:hover .flecha{
    fill: white;
    cursor: pointer;
}

.flecha-top{
    display: none;
    height: 45px;
    position: fixed;
    left: 85%;
    top: 90%;
    z-index: 3;
    margin: 0 auto 0px auto;
}

.wrapper-sm{
    width: 0%;
    position: absolute;
    left: 85%;
    top: 55%;
    margin: 0;
    display: none;
}

.sm{
    fill: white;
    margin-bottom: 10px;
}

.sm:hover{
    fill: #00FFFF;
}

.emojis{
    width: 359px;
    height: 365px;
    position: relative;
    top: 120px;
    left: 3%;
    z-index: 2;
    text-align: center;
    margin: auto;
}

.equipomobile{
    width: 425px;
    height: 475px;
    background: url(img/team_1200.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 85px 0 0 auto;
    margin-bottom: 15px;
}

.presentacion{
    height: 1900px;
    width: 100%;
}

.wrapper-es92{
    max-width: 80%;
    position: relative;
    left: 0%;
    top: 0%;
    margin: 0 auto 50px auto;
}

.wrapper-expertise{
    max-width: 80%;
    position: relative;
    left: 0%;
    top: 2%;
    margin: 0 auto 100px auto;
}

/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color: rgb(255, 255, 255);
    color: #2022E3;
    cursor: pointer;
    padding: 12px;
    width: 90%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    margin-bottom: 10px;
    font-family: 'Poppins', sans-serif;
    font-size: 12px;
}

.text-accordion{
    font-size: 12px;
    font-weight: 300;
    color: #ffffff;
    text-align: left;
    line-height: 20px;
    margin-block-start: 0px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.active, .accordion:hover {
    background-color: rgb(241, 241, 241);
}

.accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: rgb(245, 14, 14);
    float: right;
    margin-left: 5px;
  }
  
.active:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}

/* Style the accordion panel. Note: hidden by default */
.panel {
    background-color: none;
    display: none;
    overflow: hidden;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
  }
  
.equipomobile2{
    width: 425px;
    height: 475px;
    background: url(img/javier_1200.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 0 0 15px auto;
}

.viveviajando{
    height: 1100px;
    width: 100%;
    background: linear-gradient(180deg, #F4C14F 0%, #F4774F 100%);;
}

.linea{ 
    position: relative;
    left: 0px;
    top: 0px;
    margin-bottom: 30px;
}

.wrapper-viveviajando{
    position: relative;
    left: 8%;
    top: 85px;
}

.img_viveviajando{
    width: 375px;
    height: 430px;
    background: url(img/fotoviveviajando_mobile.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 0 0 15px auto;
    position: relative;
    left: 0%;
    top: 120px;
}

.wrapper-viveviajando2{
    max-width: 80%;
    position: relative;
    left: 8%;
    top: 15%;
}

.guayaquilcity{
    height: 1100px;
    width: 100%;
    background: linear-gradient(99.33deg, #219FFF -5.8%, #002640 80.51%);
}

.wrapper-guayaquilcity{
    position: relative;
    left: 8%;
    top: 8%;
}

.wrapper-guayaquilcity2{
    max-width: 80%;
    position: relative;
    left: 8%;
    top: 15%;
}

.img_guayaquilcity{
    width: 375px;
    height: 452px;
    background: url(img/armadura_mobile.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 0 0 15px auto;
    position: relative;
    left: 0%;
    top: 120px;
}

.latina{
    height: 1100px;
    width: 100%;
    background: linear-gradient(180deg, #2950D3 -10.04%, #191D29 100%);;
}

.wrapper-latina{
    position: relative;
    left: 8%;
    top: 8%;
}

.img_latina{
    width: 378px;
    height: 480px;
    background: url(img/latina_mobile.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 0 0 15px auto;
    position: relative;
    left: 0%;
    top: 100px;
}

.wrapper-latina2{
    max-width: 80%;
    position: relative;
    left: 8%;
    top: 12%;
}

.clientes{
    height: 700px;
    width: 100%;
    background: #ffffff;
}

.wrapper-clientes{
    max-width: 80%;
    position: relative;
    left: 8%;
    top: 8%;
}

.img_clientes{
    width: 323px;
    height: 255px;
    background: url(img/logos_clientes_es92.png);
    background-size: cover;
    background-position: center;
    text-align: center;
    margin: 0 auto 15px auto;
    position: relative;
    left: 0%;
    top: 90px;
}

.clientes h3{
    color: #0000FF;
}

.clientes p{
    color: #545454;
    margin-top: 20px;
}

.contacto{
    height: 520px;
    width: 100%;
}

.wrapper-contacto{
    position: relative;
    left: 10%;
    top: 14%;
    margin-bottom: 70px;
}

.wrapper-contacto2{
    position: relative;
    left: 10%;
    top: 8%;
}

.contacto h3{
    margin-top: 20px;
    position: relative;
    left: 10%;
    top: 8%;
    background: linear-gradient(180deg, #00FFC4 -8.89%, #00B2FF 100.73%););
    /* clip hackery */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.contacto p{
    margin-bottom: 10px;
}

.footer{
    font-size: 12px;
    font-weight: 400;
    color: #ffffff;
    text-align: left;
    line-height: 24px;
    position: relative;
    left: 10%;
    top: 15%;
}

@media only screen and (min-width: 768px) {

    .logo2{
        position: relative;
        top: -208px;
        left: 8%;   
    }
    
      /* Position the close button (top right corner) */
    .overlay .closebtn {
        position: absolute;
        top: 14px;
        right: 14.5%;
        font-size: 35px;
    }

    h1 {
        font-size: 55px;
        font-weight: 900;
        margin-bottom: 30px;
        line-height: 50px;
    }

    .bienvenida{
        height: 700px;
        width: 100%;
    }

    .wrapper-bienvenida{
        max-width: 50%;
        position: relative;
        left: -16%;
        top: 18%;
        margin: 0 auto 80px auto;
    }

    .emojis{
        width: 501px;
        height: 504px;
        position: relative;
        top: -300px;
        left: 55%;
    }
    
    .descripcion-bienvenida br{
        display: none;
    }

    .equipomobile{
        width: 433px;
        height: 419px;
        background: url(img/team_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 0;
        margin-bottom: 15px;
        position: relative;
        top: -450px;
        left: -7%;
    }

    .presentacion{
        height: 1000px;
        width: 100%;
    }
    
    .wrapper-es92{
        max-width: 40%;
        position: relative;
        left: 55%;
        top: 0%;
        margin: 0 0 50px 0;
    }

    .wrapper-expertise{
        max-width: 40%;
        position: relative;
        top: -250px;
        left: 7%;
        margin: 0px 0px 50px 0px;
    }
    
    .equipomobile2{
        width: 442px;
        height: 423px;
        background: url(img/javier_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 auto;
        margin-bottom: 15px;
        position: relative;
        top: -700px;
        left: 8%;
    }

    .viveviajando{
        height: 1200px;
        width: 100%;
        background: linear-gradient(180deg, #F4C14F 0%, #F4774F 100%);;
    }

    .img_viveviajando{
        width: 733px;
        height: 575px;
        background: url(img/fotoviveviajando_tablet.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px 0;
        position: relative;
        left: -5%;
        top: 120px;
    }

    .wrapper-viveviajando2{
        max-width: 55%;
        position: relative;
        left: 8%;
        top: 15%;
    }

    .circulo2{
        fill: white;
        position: absolute;
        left: 17%;
        top: 86%;
        margin: 0 auto 0px auto;
    }

    .guayaquilcity{
        height: 1300px;
        width: 100%;
        background: linear-gradient(99.33deg, #219FFF -5.8%, #002640 80.51%);
    }

    .wrapper-guayaquilcity{
        position: relative;
        left: 33%;
        top: 8%;
    }

    .wrapper-guayaquilcity2{
        max-width: 55%;
        position: relative;
        left: 33%;
        top: 15%;
    }

    .img_guayaquilcity{
        width: 686px;
        height: 671px;
        background: url(img/armadura_tablet.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: 0%;
        top: 160px;
    }

    .circulo3{
        fill: white;
        position: absolute;
        left: 17%;
        top: 86%;
        margin: 0 auto 0px auto;
    }

    .latina{
        height: 1300px;
        width: 100%;
        background: linear-gradient(180deg, #2950D3 -10.04%, #191D29 100%);;
    }

    .img_latina{
        background: url(img/latina_tablet.png);
        background-size: cover;
        background-position: center;
        width: 815px;
        height: 626px;
        text-align: center;
        margin: 0 0 70px 0;
        position: relative;
        left: 0%;
        top: 100px;
    }

    .wrapper-latina{
        position: relative;
        left: 8%;
        top: 8%;
    }
    
    .wrapper-latina2{
        max-width: 55%;
        position: relative;
        left: 8%;
        top: 12%;
    }

    .clientes{
        height: 600px;
        width: 100%;
        background: #ffffff;
    }

    .img_clientes{
        width: 590px;
        height: 269px;
        background: url(img/logos_clientes_es92_tablet.png);
        background-size: cover;
        background-position: center;
        position: relative;
        left: -2%;
        top: 80px;
    }

    .clientes br{
        display: none;
    }

    .wrapper-contacto{
        position: relative;
        left: 40%;
        top: 20%;
        margin-bottom: 70px;
    }

    .contacto h3{
        margin-top: 20px;
        position: relative;
        left: 10%;
        top: 40%;
        background: linear-gradient(180deg, #00FFC4 -8.89%, #00B2FF 100.73%););
        /* clip hackery */
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    
    .wrapper-contacto2{
        position: relative;
        left: 70%;
        top: -25%;
    }

    .footer{
        font-size: 12px;
        font-weight: 400;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        position: relative;
        left: 30%;
        top: -10%;
    }

    .contacto{
        height: 390px;
        width: 100%;
    }
    
}

@media only screen and (min-width: 1200px) {

    html, body {
        margin: 0;
        font-family:'Poppins', sans-serif;
        overflow-x: hidden;
        background: linear-gradient(91.55deg, #0000FF 38.7%, #00FFFF 98.6%);
    }

    .logo{
        width: 132px;
        height: 46px;
        background: url(img/logoe92_mobile.svg);
        background-size: cover;
        background-position: center;
        cursor: pointer;
        z-index: 1;
        position: relative;
        top: 24px;
        left: 9%;   
    }
    
    .menu{
        height: 32px;
        width: 44px;
        z-index: 3;
        cursor: pointer;
        fill: #ffffff;
        position: relative;
        z-index: 1;
        top: -10px;
        left: 85%;
    }   
    
    nav.white .logo{
        background: url(img/logoe92_mobile2.svg); 
    }
    
    nav.white .menu{
        fill: #2515E3;
        z-index: 1;
    }   

    .logo2{
        position: relative;
        top: -200px;
        left: 8.5%;   
    }
    
      /* Position the close button (top right corner) */
      .overlay .closebtn {
        position: absolute;
        top: 14px;
        right: 12%;
        font-size: 35px;
    }

    h1 {
        font-size: 80px;
        font-weight: 900;
        margin-bottom: 30px;
        line-height: 65px;
        background: linear-gradient(180deg, #00FFC4 -8.89%, #00B2FF 100.73%););
        /* clip hackery */
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    h2 {
        font-size: 16px;
    }

    .titulo-principal br{
        display: block;
    }

    .bienvenida{
        height: 680px;
        width: 100%;
    }

    .wrapper-bienvenida{
        max-width: 39%;
        position: relative;
        left: 0%;
        top: 20%;
        margin: 0 0px 80px 125px;
    }

    .circulo2{
        fill: white;
        position: absolute;
        left: 28%;
        top: 87%;
        margin: 0 auto 0px auto;
    }

    .circulo2:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .middle{
        position: absolute;
        bottom: 5%;
        left: 50%;
        transform: translate(-50%);
        z-index: 1;
    }

    .mouse{
        width: 20px;
        height: 33px;
        border: 2px solid #01D6E4;
        border-radius: 80px;
    }

    .mouse::before{
        content: "";
        width: 6px;
        height: 6px;
        position: absolute;
        top: 10px;
        background: #01D6E4;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 50%;
        opacity: 1;
        animation: mouse 1.2s infinite;
    }

    @keyframes mouse {
        from{
        opacity: 1;
        top: 9px;
        }
        to{
        opacity: 0;
        top: 30px;
        }
    }

    .emojis{
        width: 620px;
        height: 623px;
        position: relative;
        top: -430px;
        left: 50%;
    }

    .equipomobile{
        width: 858px;
        height: 770px;
        background: url(img/team_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 0;
        margin-bottom: 15px;
        position: relative;
        top: -300px;
        left: -7%;
    }

    .presentacion{
        height: 1850px;
        width: 100%;
    }

    .wrapper-es92{
        max-width: 25%;
        position: relative;
        left: 59%;
        top: 280px;
        margin: 0 20px 50px 20px;
    }

    .equipomobile2{
        width: 918px;
        height: 818px;
        background: url(img/javier_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 auto;
        margin-bottom: 15px;
        position: relative ;
        top: -35%;
        left: 10%;
    }

    .wrapper-expertise{
        max-width: 26%;
        position: relative;
        top: -50px;
        left: 9%;
        margin: 0px 0px 50px 0px;
    }

    .viveviajando{
        height: 950px;
        width: 100%;
        background: linear-gradient(180deg, #F4C14F 0%, #F4774F 100%);;
    }

    .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-viveviajando{
        position: relative;
        left: 49%;
        top: 200px;
        z-index: 1;
    }

    .img_viveviajando{
        width: 844px;
        height: 690px;
        background: url(img/fotoviveviajando_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -47%;
        top: 20px;
    }

    .wrapper-viveviajando2{
        max-width: 25%;
        position: relative;
        left: 62%;
        top: -43%;
    }

    .guayaquilcity{
        height: 1100px;
        width: 100%;
        background: linear-gradient(121.12deg, #219FFF -5.8%, #002640 80.51%);;
    }

    .circulo3{
        fill: white;
        position: absolute;
        left: 28%;
        top: 88%;
        margin: 0 auto 0px auto;
    }

    .circulo3:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .wrapper-guayaquilcity{
        max-width: 25%;
        position: relative;
        left: 20%;
        top: 20%;
        z-index: 1;
        text-align: right;
    }

    .wrapper-guayaquilcity p{
        text-align: right;
    }

   .guayaquilcity .linea{ 
        position: relative;
        left: 120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-guayaquilcity2{
        max-width: 25%;
        position: relative;
        left: 9%;
        top: -45%;
    }

    .img_guayaquilcity{
        width: 897px;
        height: 819px;
        background: url(img/armadura_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: 0%;
        top: 40px;
    }
    
    .latina{
        height: 1050px;
        width: 100%;
        background: linear-gradient(180deg, #2950D3 -10.04%, #191D29 100%);;
    }

    .wrapper-latina{
        position: relative;
        left: 53%;
        top: 200px;
        z-index: 1;
    }

    .latina .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .img_latina{
        width: 891px;
        height: 700px;
        background: url(img/latina_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -42%;
        top: 50px;
    }

    .wrapper-latina2{
        max-width: 25%;
        position: relative;
        left: 66%;
        top: -35%;
    }

    .clientes{
        height: 800px;
        width: 100%;
        background: #ffffff;
    }

    .wrapper-clientes{
        max-width: 20%;
        position: relative;
        left: 9%;
        top: 30%;
    }

    .img_clientes{
        width: 705px;
        height: 492px;
        background: url(img/logos_clientes_es92_1200.png);
        background-size: cover;
        background-position: center;
        position: relative;
        left: 16%;
        top: -130px;
    }

    .clientes br{
        display: block;
    }

    .contacto h3 {
        font-size: 40px;
        font-weight: 600;
        line-height: 45px;
        position: relative;
        top: 130px;
        left: 9%;
    }

    .footer{
        font-size: 12px;
        font-weight: 400;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        position: relative;
        left: 38%;
        top: -10%;
    }

    .wrapper-contacto{
        position: relative;
        left: 50%;
        top: 10%;
        margin-bottom: 70px;
    }

    .wrapper-contacto2{
        position: relative;
        left: 70%;
        top: -35%;
    }

}

@media only screen and (min-width: 1300px) {

    .wrapper-sm{
        width: 0%;
        position: absolute;
        left: 95%;
        top: 45%;
        margin: 0;
        display: block;
    }

    .sm{
        margin-bottom: 10px;
    }
}

@media only screen and (min-width: 1600px) {

    html, body {
        margin: 0;
        font-family:'Poppins', sans-serif;
        overflow-x: hidden;
        background: linear-gradient(91.55deg, #0000FF 38.7%, #00FFFF 98.6%);
    }

    .logo{
        width: 132px;
        height: 46px;
        background: url(img/logoe92_mobile.svg);
        background-size: cover;
        background-position: center;
        cursor: pointer;
        z-index: 1;
        position: relative;
        top: 24px;
        left: 12%;   
    }
    
    .menu{
        height: 35px;
        width: 45px;
        z-index: 3;
        cursor: pointer;
        fill: #ffffff;
        position: relative;
        z-index: 1;
        top: -10px;
        left: 85%;
    }   
    
    nav.white .logo{
        background: url(img/logoe92_mobile2.svg); 
    }
    
    nav.white .menu{
        fill: #2515E3;
        z-index: 1;
    }   

    .logo2{
        position: relative;
        top: -260px;
        left: 11.5%;   
    }

    .overlay a {
        padding: 15px;
        text-decoration: none;
        font-size: 30px;
      }
    
      /* Position the close button (top right corner) */
    .overlay .closebtn {
        position: absolute;
        top: 14px;
        right: 12.75%;
        font-size: 35px;
    }

    h1 {
        font-size: 72px;
        font-weight: 900;
        margin-bottom: 30px;
        line-height: 65px;
    }

    .titulo-principal br{
        display: block;
    }

    .bienvenida{
        height: 880px;
        width: 100%;
    }

    .bienvenida p{
        font-size: 16px;   
        font-weight: 300;
        line-height: 28px;
    }

    .bienvenida .bold{
        font-size: 16px;   
        font-weight: 600;
        line-height: 28px;
    }

    .bienvenida .link{
        font-size: 16px;   
        font-weight: 700;
        line-height: 28px;
    }

    .wrapper-bienvenida{
        max-width: 30%;
        position: relative;
        left: 6%;
        top: 23%;
        margin: 0 0px 80px 125px;
    }

    .circulo{
        fill: white;
        position: absolute;
        top: -2px;
        left: 210px;
        margin: 0 auto 0px auto;
    }

    .circulo2{
        fill: white;
        position: absolute;
        left: 34%;
        top: 89%;
        margin: 0 auto 0px auto;
    }

    .circulo2:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .middle{
        position: absolute;
        bottom: 5%;
        left: 50%;
        transform: translate(-50%);
        z-index: 1;
    }

    .mouse{
        width: 20px;
        height: 33px;
        border: 2px solid #01D6E4;
        border-radius: 80px;
    }

    .mouse::before{
        content: "";
        width: 6px;
        height: 6px;
        position: absolute;
        top: 10px;
        background: #01D6E4;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 50%;
        opacity: 1;
        animation: mouse 1.2s infinite;
    }

    @keyframes mouse {
        from{
        opacity: 1;
        top: 9px;
        }
        to{
        opacity: 0;
        top: 30px;
        }
    }
    
    .wrapper-sm{
        width: 0%;
        position: absolute;
        left: 88%;
        top: 55%;
        margin: 0;
        display: block;
    }

    .sm{
        margin-bottom: 10px;
    }

    .emojis{
        width: 650px;
        height: 660px;
        position: relative;
        top: -350px;
        left: 50%;
    }

    .equipomobile{
        width: 1058px;
        height: 950px;
        background: url(img/team_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 0;
        margin-bottom: 15px;
        position: relative;
        top: -150px;
        left: -10%;
    }

    .presentacion{
        height: 2600px;
        width: 100%;
    }

    .wrapper-es92{
        max-width: 22%;
        position: relative;
        left: 65%;
        top: 540px;
        margin: 0 20px 50px 20px;
    }

    .equipomobile2{
        width: 1137px;
        height: 997px;
        background: url(img/javier_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 auto;
        margin-bottom: 15px;
        position: absolute;
        top: 2400px;
        left: 700px;
    }

    .wrapper-expertise{
        max-width: 25%;
        position: relative;
        top: 350px;
        left: 12%;
        margin: 0px 0px 50px 0px;
    }


    /* Style the buttons that are used to open and close the accordion panel */
    .accordion {
        background-color: rgb(255, 255, 255);
        color: #2022E3;
        cursor: pointer;
        padding: 30px;
        width: 100%;
        text-align: left;
        border: none;
        outline: none;
        transition: 0.4s;
        margin-bottom: 10px;
        font-family: 'Poppins', sans-serif;
        font-size: 14px;
    }

    .text-accordion{
        font-size: 14px;
        font-weight: 300;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        margin-block-start: 0px;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
    }

    .active, .accordion:hover {
        background-color: rgb(241, 241, 241);
    }

    .accordion:after {
        content: '\02795'; /* Unicode character for "plus" sign (+) */
        font-size: 16px;
        color: rgb(245, 14, 14);
        float: right;
        margin-left: 5px;
    }
    
    .active:after {
        content: "\2796"; /* Unicode character for "minus" sign (-) */
    }

    /* Style the accordion panel. Note: hidden by default */
    .panel {
        background-color: none;
        display: none;
        overflow: hidden;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
    }

    .viveviajando{
        height: 1000px;
        width: 100%;
        background: linear-gradient(180deg, #F4C14F 0%, #F4774F 100%);;
    }

    h3{
        font-size: 35px;
        margin-bottom: 5px;
        line-height: 40px;
    }

    .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-viveviajando{
        position: relative;
        left: 48%;
        top: 175px;
        z-index: 1;
    }

    .img_viveviajando{
        width: 1103px;
        height: 844px;
        background: url(img/fotoviveviajando_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -40%;
        top: -30px;
    }

    .wrapper-viveviajando2{
        max-width: 18%;
        position: relative;
        left: 66%;
        top: -57%;
    }

    .guayaquilcity{
        height: 1000px;
        width: 100%;
        background: linear-gradient(121.12deg, #219FFF -5.8%, #002640 80.51%);;
    }

    .circulo3{
        fill: white;
        position: absolute;
        left: 35%;
        top: 88%;
        margin: 0 auto 0px auto;
    }

    .circulo3:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .wrapper-guayaquilcity{
        max-width: 25%;
        position: relative;
        left: 20%;
        top: 14.5%;
        z-index: 1;
        text-align: right;
    }

    .wrapper-guayaquilcity p{
        text-align: right;
    }

   .guayaquilcity .linea{ 
        position: relative;
        left: 120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-guayaquilcity2{
        max-width: 18%;
        position: relative;
        left: 15%;
        top: -62%;
    }

    .img_guayaquilcity{
        width: 1084px;
        height: 886px;
        background: url(img/armadura_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: 0%;
        top: -40px;
    }
    
    .latina{
        height: 1000px;
        width: 100%;
        background: linear-gradient(180deg, #2950D3 -10.04%, #191D29 100%);;
    }

    .wrapper-latina{
        position: relative;
        left: 45%;
        top: 160px;
        z-index: 1;
    }

    .latina .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .img_latina{
        width: 1036px;
        height: 776px;
        background: url(img/latina_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -50%;
        top: -20px;
    }

    .wrapper-latina2{
        max-width: 18%;
        position: relative;
        left: 62%;
        top: -48%;
    }

    .clientes{
        height: 1000px;
        width: 100%;
        background: #ffffff;
    }

    .wrapper-clientes{
        max-width: 22%;
        position: relative;
        left: 10%;
        top: 30%;
    }

    .img_clientes{
        width: 795px;
        height: 525px;
        background: url(img/logos_clientes_es92_imac.png);
        background-size: cover;
        background-position: center;
        position: relative;
        left: 16%;
        top: -55px;
    }

    .clientes br{
        display: block;
    }

    .contacto h3 {
        font-size: 40px;
        font-weight: 600;
        line-height: 45px;
        position: relative;
        top: 130px;
        left: 10%;
    }

    .footer{
        font-size: 12px;
        font-weight: 400;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        position: relative;
        left: 38%;
        top: -10%;
    }

    .wrapper-contacto{
        position: relative;
        left: 50%;
        top: 10%;
        margin-bottom: 70px;
    }

    .wrapper-contacto2{
        position: relative;
        left: 70%;
        top: -35%;
    }
}

@media only screen and (min-width: 1900px) {

    html, body {
        margin: 0;
        font-family:'Poppins', sans-serif;
        overflow-x: hidden;
        background: linear-gradient(91.55deg, #0000FF 38.7%, #00FFFF 98.6%);
    }

    .logo{
        width: 132px;
        height: 46px;
        background: url(img/logoe92_mobile.svg);
        background-size: cover;
        background-position: center;
        cursor: pointer;
        z-index: 1;
        position: relative;
        top: 24px;
        left: 12%;   
    }
    
    .menu{
        height: 35px;
        width: 45px;
        z-index: 3;
        cursor: pointer;
        fill: #ffffff;
        position: relative;
        z-index: 1;
        top: -10px;
        left: 85%;
    }   
    
    nav.white .logo{
        background: url(img/logoe92_mobile2.svg); 
    }
    
    nav.white .menu{
        fill: #2515E3;
        z-index: 1;
    }   

    .logo2{
        position: relative;
        top: -260px;
        left: 11.5%;   
    }

    .overlay a {
        padding: 15px;
        text-decoration: none;
        font-size: 30px;
      }
    
      /* Position the close button (top right corner) */
    .overlay .closebtn {
        position: absolute;
        top: 14px;
        right: 12.75%;
        font-size: 35px;
    }

    h1 {
        font-size: 85px;
        font-weight: 900;
        margin-bottom: 30px;
        line-height: 75px;
    }

    .titulo-principal br{
        display: block;
    }

    .bienvenida{
        height: 880px;
        width: 100%;
    }

    .bienvenida p{
        font-size: 16px;   
        font-weight: 300;
        line-height: 28px;
    }

    .bienvenida .bold{
        font-size: 16px;   
        font-weight: 600;
        line-height: 28px;
    }

    .bienvenida .link{
        font-size: 16px;   
        font-weight: 700;
        line-height: 28px;
    }

    .wrapper-bienvenida{
        max-width: 30%;
        position: relative;
        left: 6%;
        top: 20%;
        margin: 0 0px 80px 125px;
    }

    .circulo{
        fill: white;
        position: absolute;
        top: -2px;
        left: 210px;
        margin: 0 auto 0px auto;
    }

    .circulo2{
        fill: white;
        position: absolute;
        left: 28%;
        top: 87%;
        margin: 0 auto 0px auto;
    }

    .circulo2:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .middle{
        position: absolute;
        bottom: 5%;
        left: 50%;
        transform: translate(-50%);
        z-index: 1;
    }

    .mouse{
        width: 20px;
        height: 33px;
        border: 2px solid #01D6E4;
        border-radius: 80px;
    }

    .mouse::before{
        content: "";
        width: 6px;
        height: 6px;
        position: absolute;
        top: 10px;
        background: #01D6E4;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 50%;
        opacity: 1;
        animation: mouse 1.2s infinite;
    }

    @keyframes mouse {
        from{
        opacity: 1;
        top: 9px;
        }
        to{
        opacity: 0;
        top: 30px;
        }
    }

    .wrapper-sm{
        width: 0%;
        position: absolute;
        left: 85%;
        top: 55%;
        margin: 0;
        display: block;
    }

    .sm{
        margin-bottom: 10px;
    }

    .emojis{
        width: 700px;
        height: 710px;
        position: relative;
        top: -420px;
        left: 50%;
    }

    .equipomobile{
        width: 1158px;
        height: 1050px;
        background: url(img/team_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 0;
        margin-bottom: 15px;
        position: relative;
        top: -150px;
        left: -5%;
    }

    .presentacion{
        height: 2600px;
        width: 100%;
    }

    .wrapper-es92{
        max-width: 18%;
        position: relative;
        left: 62%;
        top: 540px;
        margin: 0 20px 50px 20px;
    }

    .equipomobile2{
        width: 1237px;
        height: 1097px;
        background: url(img/javier_1200.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 0 auto;
        margin-bottom: 15px;
        position: absolute;
        top: 2400px;
        left: 1050px;
    }

    .wrapper-expertise{
        max-width: 19%;
        position: relative;
        top: 350px;
        left: 12%;
        margin: 0px 0px 50px 0px;
    }


    /* Style the buttons that are used to open and close the accordion panel */
    .accordion {
        background-color: rgb(255, 255, 255);
        color: #2022E3;
        cursor: pointer;
        padding: 30px;
        width: 100%;
        text-align: left;
        border: none;
        outline: none;
        transition: 0.4s;
        margin-bottom: 10px;
        font-family: 'Poppins', sans-serif;
        font-size: 14px;
    }

    .text-accordion{
        font-size: 14px;
        font-weight: 300;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        margin-block-start: 0px;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
    }

    .active, .accordion:hover {
        background-color: rgb(241, 241, 241);
    }

    .accordion:after {
        content: '\02795'; /* Unicode character for "plus" sign (+) */
        font-size: 16px;
        color: rgb(245, 14, 14);
        float: right;
        margin-left: 5px;
    }
    
    .active:after {
        content: "\2796"; /* Unicode character for "minus" sign (-) */
    }

    /* Style the accordion panel. Note: hidden by default */
    .panel {
        background-color: none;
        display: none;
        overflow: hidden;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease-out;
    }

    .viveviajando{
        height: 1000px;
        width: 100%;
        background: linear-gradient(180deg, #F4C14F 0%, #F4774F 100%);;
    }

    h3{
        font-size: 35px;
        margin-bottom: 5px;
        line-height: 40px;
    }

    .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-viveviajando{
        position: relative;
        left: 43%;
        top: 175px;
        z-index: 1;
    }

    .img_viveviajando{
        width: 1103px;
        height: 844px;
        background: url(img/fotoviveviajando_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -47%;
        top: -30px;
    }

    .wrapper-viveviajando2{
        max-width: 18%;
        position: relative;
        left: 62%;
        top: -57%;
    }

    .guayaquilcity{
        height: 1000px;
        width: 100%;
        background: linear-gradient(121.12deg, #219FFF -5.8%, #002640 80.51%);;
    }

    .circulo3{
        fill: white;
        position: absolute;
        left: 28%;
        top: 88%;
        margin: 0 auto 0px auto;
    }

    .circulo3:hover {
        fill: #F2F2F2;
        cursor: pointer;
    }

    .wrapper-guayaquilcity{
        max-width: 25%;
        position: relative;
        left: 30%;
        top: 14.5%;
        z-index: 1;
        text-align: right;
    }

    .wrapper-guayaquilcity p{
        text-align: right;
    }

   .guayaquilcity .linea{ 
        position: relative;
        left: 120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .wrapper-guayaquilcity2{
        max-width: 18%;
        position: relative;
        left: 15%;
        top: -62%;
    }

    .img_guayaquilcity{
        width: 1084px;
        height: 886px;
        background: url(img/armadura_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: 0%;
        top: -40px;
    }
    
    .latina{
        height: 1000px;
        width: 100%;
        background: linear-gradient(180deg, #2950D3 -10.04%, #191D29 100%);;
    }

    .wrapper-latina{
        position: relative;
        left: 45%;
        top: 160px;
        z-index: 1;
    }

    .latina .linea{ 
        position: relative;
        left: -120px;
        top: 53px;
        margin-bottom: 30px;
    }

    .img_latina{
        width: 1036px;
        height: 776px;
        background: url(img/latina_imac.png);
        background-size: cover;
        background-position: center;
        text-align: center;
        margin: 0 0 15px auto;
        position: relative;
        left: -50%;
        top: -20px;
    }

    .wrapper-latina2{
        max-width: 18%;
        position: relative;
        left: 62%;
        top: -48%;
    }

    .clientes{
        height: 1000px;
        width: 100%;
        background: #ffffff;
    }

    .wrapper-clientes{
        max-width: 18%;
        position: relative;
        left: 10%;
        top: 30%;
    }

    .img_clientes{
        width: 795px;
        height: 525px;
        background: url(img/logos_clientes_es92_imac.png);
        background-size: cover;
        background-position: center;
        position: relative;
        left: 16%;
        top: -70px;
    }

    .clientes br{
        display: block;
    }

    .contacto h3 {
        font-size: 40px;
        font-weight: 600;
        line-height: 45px;
        position: relative;
        top: 130px;
        left: 10%;
    }

    .footer{
        font-size: 12px;
        font-weight: 400;
        color: #ffffff;
        text-align: left;
        line-height: 24px;
        position: relative;
        left: 38%;
        top: -10%;
    }

    .wrapper-contacto{
        position: relative;
        left: 50%;
        top: 10%;
        margin-bottom: 70px;
    }

    .wrapper-contacto2{
        position: relative;
        left: 70%;
        top: -35%;
    }
    

}