templates/immobiliaria.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="es">
  4. <head>
  5.   <meta charset="utf-8">
  6.   <meta name="viewport" content="width=device-width, initial-scale=1">
  7.   <title>IMMO EXEM - IMMO EXEM</title>
  8.   <link rel="icon" href="Imatges-300x264.png">
  9.   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
  10.   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  11.   <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  13.   <!-- Google tag (gtag.js) -->
  14.   <script async src="https://www.googletagmanager.com/gtag/js?id=AW-16495662094">
  15.   </script>
  16.   <script>
  17.     window.dataLayer = window.dataLayer || [];
  18.     function gtag(){dataLayer.push(arguments);}
  19.     gtag('js', new Date());
  21.     gtag('config', 'AW-16495662094');
  22.   </script>
  24. </head>
  26. <body>
  27.   <div class="container container-fluid">
  28.   
  29.     <div class="row">
  30.       <!-- Columna izquierda con logo -->
  31.       <div class="col-12 col-lg-6">
  32.         <div style="text-align: center;">
  33.           <img src="images/LOGO-300x264.png" class="img-thumbnail border border-0" alt="...">
  34.         </div>
  35.       </div>
  36.       <!-- Columna derecha con enlace y botón -->
  37.       <div class="col-12 col-lg-6 text-center d-flex align-items-center w3-center w3-animate-zoom">
  38.         <a href="http://www.exem.cat/" style="color: white; text-decoration: none; width: 100%">
  39.           <button type="button" class="ps-5 pe-5 mb-3" style="position: relative; background: linear-gradient(#193771, #7da9b2); border: none; width: 100%;">
  40.             <div style="width: 100%; height: 110px; display: flex; justify-content: center; align-items: center;">
  41.               <span class="text-white fs-2" style="font-family: 'Martel Sans', sans-serif; font-weight: bold; text-align: center;">
  42.                 <img src="images/finger-of-a-hand-pointing-to-right-direction.png" class="me-3"> <span>BORSA D'IMMOBLES</span>
  43.               </span>
  44.             </div>
  45.           </button>
  46.         </a>
  47.       </div>
  48.     </div>
  50.     <!--Imagen  Obro Nueva en Alpicat-->
  51.     <div class="text-center mb-4 row w3-animate-right ">
  52.         <div class="col-12">
  53.             <img class="img-fluid" src="images/Cartell_Alpicat.png" alt="">
  54.         </div>
  55.     </div>
  57.     <!-- Sección de texto animado -->
  58.     <div class="animated tada infinite w3-animate-left">
  59.       <div class="p-3">
  60.         <h1 style="color:#193771; font-style: italic; font-weight: bold;">VOLS VENDRE EL TEU PIS?</h1>
  61.         <h1 style="color:#193771; font-weight: bold;">NOSALTRES T'AJUDEM.</h1>
  62.       </div>
  63.     </div>
  65.     <!-- Sección de texto a la derecha -->
  66.     <div class="d-flex flex-row-reverse w3-animate-right">
  67.       <div class="p-3 text-center">
  68.         <div data-aos="fade-left">
  69.         </div>
  70.         <div style="text-align: center; max-width: 100%; padding: 0 10px;">
  71.           <h1 style="color:#193771; font-style: italic; margin: 0;">VOLS UN LLOGUER FÀCIL?</h1>
  72.           <h1 style="color:#193771; margin: 0;">DEIXA’T ASSESSORAR.</h1>
  73.         </div>
  74.       </div>
  75.     </div>
  78.     <div class="row gx-0">
  79.         <div class="col-md-9 col-sm-12 mt-3">
  80.           <!-- Carrusel de imágenes -->
  81.           <div id="carouselExampleInterval" class="carousel slide" data-bs-ride="carousel" data-bs-interval="10000">
  82.             <div style="animation-duration: 1s;" class="carousel-inner w3-center w3-animate-top">
  83.               <div class="carousel-item active">
  84.                 <img src="images/imagenImmoExemCartel-1536x579.jpeg" class="d-block w-100" alt="Primera imagen">
  85.               </div>
  86.               <div class="carousel-item">
  87.                 <img src="images/Imagen1ImmoExemCartel.jpeg" class="d-block w-100" alt="Segunda imagen">
  88.               </div>
  89.             </div>
  90.             <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleInterval" data-bs-slide="prev">
  91.               <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  92.               <span class="visually-hidden">Previous</span>
  93.             </button>
  94.             <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleInterval" data-bs-slide="next">
  95.               <span class="carousel-control-next-icon" aria-hidden="true"></span>
  96.               <span class="visually-hidden">Next</span>
  97.             </button>
  98.           </div>
  99.         </div>
  100.         <div class="col-md-3  mt-3">
  101.           <!-- Video -->
  102.           <div class="video-container w-100 d-flex justify-content-center align-items-center">
  103.               <video id="myVideo" controls autoplay muted class="w3-center w3-animate-opacity" style="width: 70%;">
  104.                   <source src="images/videoImmoExem.mp4" type="video/mp4">
  105.               </video>
  106.           </div>
  107.         </div>
  108.         <script>
  109.           function ajustarTamañoVideo() { 
  110.               var video = document.getElementById('myVideo');
  111.               var carousel = document.getElementById("carouselExampleInterval");
  112.               var windowWidth = window.innerWidth;
  113.               if (windowWidth >= 756) {
  114.                   video.style.height = carousel.offsetHeight + 'px';
  115.                   video.style.width = (carousel.offsetWidth / 2) + 'px';
  116.               } else {
  117.                   video.style.height = 'auto';
  118.                   video.style.width = '50%';
  119.               }
  120.           }
  121.         
  122.           window.onload = ajustarTamañoVideo;
  123.           window.onresize = ajustarTamañoVideo;
  124.       </script>
  125.     
  126.     <!-- Botón de oficinas -->
  127.     <div class="container text-center mt-3 w3-center w3-animate-top ">
  128.       <button type="button" class="ps-3 pe-3 mb-3" data-bs-toggle="popover" style="position: relative; background: linear-gradient(#83b5e8, #b4cce2); border: none; width: 100%;">
  129.         <span class="text-white fs-7" style="font-family: 'Martel Sans', sans-serif; font-weight: bold; text-align: center;">
  130.           <span style="color:#62686a;">LES NOSTRES OFICINES</span>
  131.         </span>
  132.       </button>
  133.     </div>
  135.     <!-- Mapas -->
  136.     <div class="container">
  137.       <div class="row justify-content-center">
  138.         <div class="col-12 col-lg-6 text-center">
  139.           <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d1491.6546461600885!2d0.64346!3d41.60582300000001!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x12a6e086c0919439%3A0x10359f6e052f1905!2sCarrer%20Sant%20Jaume%2C%2011%2C%2025001%20Lleida%2C%20Espa%C3%B1a!5e0!3m2!1ses!2sus!4v1707996915671!5m2!1ses!2sus" width="100%" height="300" style="border:0; margin-bottom: 10px;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
  140.         </div>
  141.         <div class="col-12 col-lg-6 text-center">
  142.           <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d5965.129574675283!2d0.635779!3d41.621922!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x12a6e05ef569ae17%3A0xfe1110665614e3fc!2sCarrer%20Bar%C3%B3%20de%20Maials%2C%2023%2C%2025005%20Lleida%2C%20Espa%C3%B1a!5e0!3m2!1ses!2sus!4v1707996157284!5m2!1ses!2sus" width="100%" height="300" style="border:0; margin-bottom: 10px;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
  143.         </div>
  144.       </div>
  145.     </div>
  147.   </div>
  148.   <!-- Pie de página -->
  149.     <div style="width: 100%; max-width: 100%; height: 100px; background-color: #1e316f; color: rgb(119, 119, 119); text-align: center; line-height: 100px;">
  150.       <a href="{{ path('app_homepage') }}">Inmobiliaria EXEM 2021</a>
  151.       - 
  152.       <a href="{{ path('app_politica_privacidad_immo') }}" style="color: white; margin-right: 0px;">Política de privacidad</a>
  153.     </div>
  155.     <!-- Botón de ir arriba -->
  156.     <button onclick="irArriba()" id="botonIrArriba" title="Ir arriba"><i class="fa-solid fa-chevron-up"></i> </button>
  158.     <script>
  159.       function irArriba() {
  160.         document.body.scrollTop = 0; 
  161.         document.documentElement.scrollTop = 0; 
  162.       }
  164.       window.onscroll = function() {mostrarBoton()};
  166.       function mostrarBoton() {
  167.         if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
  168.           document.getElementById("botonIrArriba").style.display = "block";
  169.         } else {
  170.           document.getElementById("botonIrArriba").style.display = "none";
  171.         }
  172.       }
  173.     </script>
  174.     <style>
  175.       #botonIrArriba {
  176.         display: none;
  177.         position: fixed;
  178.         bottom: 20px;
  179.         right: 20px;
  180.         z-index: 99;
  181.         font-size: 18px;
  182.         border: none;
  183.         outline: none;
  184.         background-color: rgba(0, 0, 0, 0.5); 
  185.         color: white;
  186.         cursor: pointer;
  187.         padding: 15px;
  188.         border-radius: 10px; 
  189.         width: 50px; 
  190.         height: 50px; 
  191.         text-align: center; 
  192.         line-height: 1; 
  193.       }
  194.     </style>
  196.     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
  197.     </body>
  198. </html>