Gecko [ www.utparral.edu.mx ]

Name	Size	Permission
noticias	[ DIR ]	drwxrwxr-x
debug.log	125 B	-rwxrwxr-x
ele.php	229 B	-rwxrwxr-x
ingles.php	7.65 KB	-rwxrwxr-x
modalactividades.php	13.86 KB	-rwxrwxr-x
modaladminballeza.php	6.31 KB	-rwxrwxr-x
modaladmindespre.php	6.01 KB	-rwxrwxr-x
modaladmin.php	9.09 KB	-rwxrwxr-x
modalagriculturaingballeza.php	8.11 KB	-rwxrwxr-x
modalagriculturaing.php	8.1 KB	-rwxrwxr-x
modalagricultura.php	7.34 KB	-rwxrwxr-x
modalagriculturatsuballeza.php	7.43 KB	-rwxrwxr-x
modalagriculturatsu.php	7.42 KB	-rwxrwxr-x
modalbecas.php	3.55 KB	-rwxrwxr-x
modalbolsa.php	2.8 KB	-rwxrwxr-x
modaldiplomado.php	18.49 KB	-rwxrwxr-x
modalegresados.php	7.84 KB	-rwxrwxr-x
modalempresariales.php	8.7 KB	-rwxrwxr-x
modalesegreso.php	17.46 KB	-rwxrwxr-x
modalestadias.php	6.34 KB	-rwxrwxr-x
modalfep.php	9.53 KB	-rwxrwxr-x
modalmantenimientodespre.php	6.39 KB	-rwxrwxr-x
modalmantenimiento.php	8.93 KB	-rwxrwxr-x
modalmineriadespre.php	5.89 KB	-rwxrwxr-x
modalmineria.php	8.14 KB	-rwxrwxr-x
modalmmp.php	9.81 KB	-rwxrwxr-x
modalmovilidad.php	1.56 KB	-rwxrwxr-x
modalnodess.php	2.77 KB	-rw-rwxr--
modalpim.php	8.57 KB	-rwxrwxr-x
modalprograma.php	6.17 KB	-rwxrwxr-x
modalprogramas.php	1.88 KB	-rwxrwxr-x
modalpublicaciones.php	13.52 KB	-rwxrwxr-x
modalse.php	6.77 KB	-rwxrwxr-x
modalservicios.php	10.17 KB	-rwxrwxr-x
modalsistemasdespre.php	6.77 KB	-rwxrwxr-x
modalsistemas.php	8.2 KB	-rwxrwxr-x
modalticsballeza.php	8.25 KB	-rwxrwxr-x
modaltics.php	10.17 KB	-rwxrwxr-x
modaltirdballeza.php	9.25 KB	-rwxrwxr-x
modaltird.php	9.38 KB	-rwxrwxr-x
modaltirtballeza.php	10.33 KB	-rwxrwxr-x
modaltirt.php	10.4 KB	-rwxrwxr-x
modaltitulacion.php	11.77 KB	-rwxrwxr-x
modaltsumineria.php	10.55 KB	-rwxrwxr-x
noticia.php	918 B	-rwxrwxr-x

Code Editor : ingles.php

<div class="modal fade" id="myModal20" tabindex="-1">
  <div class="modal-dialog modal-xl modal-dialog-scrollable">
    <div class="modal-content">

<style>
        #myModal20 .modal-body * {
          font-family: 'Segoe UI', sans-serif;
        }

#myModal20 .modal-header {
          background: #43ad5e;
          color: white;
        }

#myModal20 h1,
        #myModal20 h2,
        #myModal20 h5 {
          color: #00796b;
          font-weight: bold;
        }

#myModal20 .btn-descargar {
          background-color: #00796b !important;
          color: white;
        }

#myModal20 .btn-descargar:hover {
          background-color: #00584f !important;
        }

#myModal20 .gallery-img {
          width: 100%;
          height: 220px;
          object-fit: cover;
          border-radius: 8px;
          border: 3px solid #00796b;
          transition: .3s;
        }

#myModal20 .gallery-img:hover {
          transform: scale(1.04);
        }

#myModal20 .card {
          border-top: 4px solid #00796b;
          border-radius: 10px;
          transition: .3s;
        }

#myModal20 .card:hover {
          transform: translateY(-5px);
          box-shadow: 0 10px 25px rgba(0, 0, 0, .1);
        }

/* ✅ Carrusel dentro del modal */
        #myModal20 header,
        #myModal20 .carousel,
        #myModal20 .carousel-inner,
        #myModal20 .carousel-item {
          height: 270px !important;
        }

#myModal20 .carousel-item img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          object-position: center;
          filter: brightness(85%);
          transition: .5s ease;
        }

#myModal20 .carousel-item img:hover {
          transform: scale(1.03);
          filter: brightness(95%);
        }

@media(max-width:768px) {
          #myModal20 header,
          #myModal20 .carousel,
          #myModal20 .carousel-inner,
          #myModal20 .carousel-item {
            height: 180px !important;
          }
        }
      </style>

<div class="modal-header">
        <h4 class="modal-title">Diplomado de Inglés</h4>
        <button type="button" class="close text-white" data-dismiss="modal">✕</button>
      </div>

<div class="modal-body p-0">

<header>
          <div id="headerCarousel" class="carousel slide" data-ride="carousel" data-interval="4500">
            <ol class="carousel-indicators">
              <li data-target="#headerCarousel" data-slide-to="0" class="active"></li>
              <li data-target="#headerCarousel" data-slide-to="1"></li>
              <li data-target="#headerCarousel" data-slide-to="2"></li>
            </ol>

<section class="text-center my-4">
          <h1>Diplomado de Inglés</h1>
        </section>

<div class="container">

<div class="row mb-5">
            <div class="col-lg-6 col-md-12 mb-4 d-flex align-items-center">
                <div class="w-100 shadow rounded" style="height: 350px; overflow: hidden; position: relative;">
                <img 
                    src="img_diplomado/logo.jpeg" 
                    alt="Diplomado de Inglés"
                    style="
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    object-position: center;
                    display: block;
                    max-width: 100%;
                    max-height: 100%;
                    ">
                </div>
            </div>
            <div class="col-lg-6 text-center text-md-left">
              <h2 class="mb-3">Acerca del Diplomado</h2>
              <p style="text-align: justify;">
                El <strong>Diplomado de Inglés</strong> fortalece las competencias comunicativas reales del idioma, con docentes certificados y metodología moderna.
              </p>
              <p style="text-align: justify;">
                Ideal para estudiantes y profesionistas que buscan certificación internacional.
              </p>

<a href="#" class="btn btn-descargar btn-lg mt-2 shadow-sm">
                <i class="fas fa-file-alt mr-2"></i> Descargar folleto
              </a>
            </div>
          </div>

<h2 class="text-center mb-4">Galería de Fotos</h2>
          <div class="row text-center">
            <div class="col-md-4 mb-3">
              <img src="img_diplomado/concurso_diplomado.jpg" class="gallery-img">
            </div>
            <div class="col-md-4 mb-3">
              <img src="img_diplomado/apertura_diplomado.jpg" class="gallery-img">
            </div>
            <div class="col-md-4 mb-3">
              <img src="img_diplomado/dia_de_la_cosecha.jpeg" class="gallery-img">
            </div>
          </div>

<h2 class="text-center my-4">Información Relevante</h2>
          <div class="row">

<div class="col-md-4 mb-3">
              <div class="card text-center p-3">
                <i class="fas fa-calendar-alt fa-3x mb-2 text-warning"></i>
                <h5>Duración y Horarios</h5>
                <p>
                  4 meses por nivel<br>
                  Niveles: A1 | A2 | B1 | B2<br>
                  Martes y jueves 6:00-8:30 p.m<br>
                  Sábados 8:00 a.m - 1:00 p.m
                </p>
              </div>
            </div>

<div class="col-md-4 mb-3">
              <div class="card text-center p-3">
                <i class="fas fa-graduation-cap fa-3x mb-2 text-warning"></i>
                <h5>Requisitos</h5>
                <p>Ser mayor de 17 años</p>
              </div>
            </div>

<div class="col-md-4 mb-3">
              <div class="card text-center p-3">
                <i class="fas fa-envelope-open-text fa-3x mb-2 text-warning"></i>
                <h5>Contacto</h5>
                <p>
                  📞 (627) 118-6400 Ext. 214<br>
                  Dirección de Vinculación<br>
                  <a href="https://www.utparral.edu.mx/" target="_blank">Página Oficial</a>
                </p>
              </div>
            </div>

</div>

</div>
      </div>

<div class="modal-footer">
        <button class="btn btn-danger" data-dismiss="modal">Cerrar</button>
      </div>
    </div>
  </div>
</div>

${this.title}

Code Editor : ingles.php