#panorama {
        width: 98%;
        height: 98vh;

    }
    .custom-hotspot {
        height: 50px;
        width: 50px;
        /* background: #f00; */
        background-image: url('../img/agua.png'); /* Ruta de la imagen */
        background-size: cover; /* Ajustar tamaño de la imagen */
        /* animation: pulse 2.5s infinite alternate ease-in-out; Animación de pulsación infinita */
        text-align: justify;
    }

    div.custom-tooltip span {
        visibility: hidden;
        position: absolute;
        border-radius: 3px;
        background-color: #8eefff;
        color: #000;
        text-align: center;
        /* max-width: 200px; */
        padding: 5px 10px;
        margin-left: -220px;
        cursor: default;
    }
    div.custom-tooltip:hover span{
        visibility: visible;
    }
    div.custom-tooltip:hover span:after {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-width: 10px;
        border-style: solid;
        border-color: #fff transparent transparent transparent;
        bottom: -20px;
        left: -10px;
        margin: 0 50%;
    }
    .custom-hotspot-blue {
    height: 50px;
    width: 50px;
    /* background: blue; Color azul */
    background-image: url('../img/tierra.png'); /* Ruta de la imagen */
    background-size: cover; /* Ajustar tamaño de la imagen */
    /*animation: pulse 2.5s infinite alternate ease-in-out;  Animación de pulsación infinita */
}

.custom-hotspot-RLR {
    height: 100px;
    width: 100px;
    background-image: url('../img/logo_3d.gif'); /* Ruta de la imagen */
    background-size: cover; /* Ajustar tamaño de la imagen */
    border-radius: 50%;
}

.custom-hotspot-green {
    height: 50px;
    width: 50px;
    /* background: green; Color verde */
    background-image: url('../img/viento.png'); /* Ruta de la imagen */
    background-size: cover; /* Ajustar tamaño de la imagen */
    /* animation: pulse 2.5s infinite alternate ease-in-out; Animación de pulsación infinita */
}

.custom-hotspot-yellow {
    height: 50px;
    width: 50px;
    /* background: yellow; Color amarillo */
    background-image: url('../img/fuego.png'); /* Ruta de la imagen */
    background-size: cover; /* Ajustar tamaño de la imagen */
    /* animation: pulse 2.5s infinite alternate ease-in-out; Animación de pulsación infinita */
}
.custom-hotspot-anim {
    height: 50px;
    width: 50px;
    /* background: yellow; Color amarillo */
    background-image: url('../img/fuego.png'); /* Ruta de la imagen */
    background-size: cover; /* Ajustar tamaño de la imagen */
    /* animation: pulse 2.5s infinite alternate ease-in-out; Animación de pulsación infinita */
}
/* menu principal */
.custom-hotspot-home {
    height: 80px;
    width: 80px;
    background-image: url('../img/home.png');
    background-size: cover;
    animation: pulse 2.5s infinite alternate ease-in-out;
}
.custom-hotspot-clientes {
    height: 80px;
    width: 80px;
    background-image: url('../img/clientes.png');
    background-size: cover;
    animation: pulse 2.5s infinite alternate ease-in-out;
}
.custom-hotspot-demos {
    height: 80px;
    width: 80px;
    background-image: url('../img/demos.png');
    background-size: cover;
    animation: pulse 2.5s infinite alternate ease-in-out;
}
.custom-hotspot-servicios {
    height: 80px;
    width: 80px;
    background-image: url('../img/servicios.png');
    background-size: cover;
    animation: pulse 2.5s infinite alternate ease-in-out;
}
/* menu principal */

/* menu inferior */
.custom-hotspot-contactenos {
    height: 50px;
    width: 50px;
    background-image: url('../img/contactenos.png');
    background-size: cover;
}
.custom-hotspot-infopersonal {
    height: 50px;
    width: 50px;
    background-image: url('../img/infopersonal.png');
    background-size: cover;
}
.custom-hotspot-trayectoria {
    height: 50px;
    width: 50px;
    background-image: url('../img/trayectoria.png');
    background-size: cover;
}
.custom-hotspot-avisolegal {
    height: 50px;
    width: 50px;
    background-image: url('../img/avisolegal.png');
    background-size: cover;
}
/* menu inferior */

.custom-hotspot-perfil {
    height: 50px;
    width: 50px;
    background-image: url('../img/perfil.png');
    background-size: cover;
}

.custom-hotspot-informacion {
    height: 50px;
    width: 50px;
    background-image: url('../img/informacion.png');
    background-size: cover;
}
.custom-hotspot-portafolio {
    height: 50px;
    width: 50px;
    background-image: url('../img/portafolio.png');
    background-size: cover;
}

/* menu clientes */

.custom-hotspot-clientes2 {
    height: 50px;
    width: 50px;
    background-image: url('../img/clientes2.png');
    background-size: cover;
}

/* menu clientes */

/* menu demos */

.custom-hotspot-animaciones {
    height: 50px;
    width: 50px;
    background-image: url('../img/anim3d.png');
    background-size: cover;
}

.custom-hotspot-panorama {
    height: 50px;
    width: 50px;
    background-image: url('../img/panorama360.png');
    background-size: cover;
}

.custom-hotspot-landingpage {
    height: 50px;
    width: 50px;
    background-image: url('../img/landingpage.png');
    background-size: cover;
}

.custom-hotspot-casos {
    height: 50px;
    width: 50px;
    background-image: url('../img/casos.png');
    background-size: cover;
}

.custom-hotspot-videos {
    height: 50px;
    width: 50px;
    background-image: url('../img/videos.png');
    background-size: cover;
}

.custom-hotspot-logotipos {
    height: 50px;
    width: 50px;
    background-image: url('../img/logotipos.png');
    background-size: cover;
}

.custom-hotspot-cd {
    height: 50px;
    width: 50px;
    background-image: url('../img/cd.png');
    background-size: cover;
}

/* menu demos */


@keyframes pulse {
    0% {
        height: 80px;
        width: 80px;
    }
    50% {
        height: 90px; /* Cambia este valor al tamaño deseado en píxeles durante la pulsación */
        width: 90px; /* Cambia este valor al tamaño deseado en píxeles durante la pulsación */
    }
    100% {
        height: 80px;
        width: 80px;
    }
}

@keyframes rotateClockwise {
    to {
      transform: rotate(15deg);

    }
  }

  @keyframes rotateCounterClockwise {
    to {
      transform: rotate(-15deg);
      color: #ffffff;
      font-size: 20px;
    }
  }

  .infinite-rotation {
    display: inline-block;
    animation: rotateClockwise 1s linear infinite alternate, rotateCounterClockwise 1s linear infinite alternate;
  }

.close {
    color: #fff;
}

/* .overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: white;
    text-align: center;
    z-index: 9999;
} */

/* Estilos para dispositivos móviles */
@media only screen and (max-width: 767px) {
  .mensaje {
    display: block; /* Asegúrate de que el mensaje sea visible */
    z-index: 9999;
    height: 100vh;
    background-color:#000000;
  }

  .computadora {
    display: none; /* Asegúrate de que el contenido para computadoras esté oculto */
  }
}

/* Estilos para computadoras */
@media only screen and (min-width: 640px) {
  .mensaje {
    display: none; /* Asegúrate de que el mensaje esté oculto */
  }

  .imagen {
    display: none; /* Asegúrate de que la imagen esté oculta */
  }

  .computadora {
    display: block; /* Asegúrate de que el contenido para computadoras sea visible */
  }
}
.fullscreen-icon, .exit-fullscreen-icon {
    position: absolute;
    top: 15px;
    cursor: pointer;
    margin-left: 46%;
    z-index: 9998;
  }

  .content1 {
    /* Estilo para el contenido */
  }
  .icontent {
    background-color: #ffffff50;
    border-radius: 50%;
    color: #ffffff;
    font-size: 20px;
    padding: 12px;
    border: 1px solid #ffffff;
    box-shadow:3px 3px 3px #00000030;
  }
  .icontent:hover {
    background-color: #ffffff95;
  }