<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="description" name="">
    <meta name="keywords" name="sistemas,micpu,utsem">
    <link rel="stylesheet" href= "css/estilosh.css">
    <link rel="stylesheet" href="css/pie.css">
    <link rel="stylesheet" href= "css/normalize.css">
    <link rel="icon" type="image/p" href="IMG/imgutsem/micpusinfondo.png"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
<link rel="styelsheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css">
<style>
    h1{text-align: center; background-color:mediumseagreen; font:white}
    h2{text-align: center; background-color:white;}
    p{text-align: center; background-color:white;}
    
</style>

    <title>MiCPU</title>
    
</head>

<body> 
 <header>
     <img src="IMG/imgutsem/UTSEM LOGO NUEVO.png" alt="" class="logoutsem">
     
     <div>
     <ul class="nav"><!-- menu de encabezado-->
				<li><a href="#titulonosotros">Inicio</a></li>
				<li><a href="#servicios">Servicio</a></li>
				<li><a href="">Estatus</a><!-- listea desplegable-->
					<ul>
						<li><a href="estatus.php">Mantenimiento Correctivo</a></li>
						<li><a href="estatus_software.php">Software</a></li>
					</ul>
                <li><a href="#Contacto">Contacto</a></li>
				<li><a href="iniciosesi.php">Administrador</a></li>
			</ul>
     </div>
 </header>
 <main>
 <section id="inicio">
     <img src="IMG/imgutsem/micpusinfondo.png" alt="">
     <div class="bloque-inicio"></div>
        <div>
         <h1 class="bloque-inicio-h1">BIENVENIDOS</h1>
         


     </div>
 </section> 
  <h2 id="titulonosotros" ></h2>
 <section id="nosotros" class="seccion">
 </section>  
 <h2 id="titulodep">DEPARTAMENTO DE SISTEMAS</h2>
 <p id="tituloservicios">              
 El Departamento de Sistemas de la Universidad Tecnológica Del Sur del Estado de México, es el encargado de realizar el mantenimiento correctivo y preventivo así como las actualizaciones de software en los equipos de las diferentes áreas, además de administrar sistemas de información local y páginas de la institución.
 <section id="servicios" class="seccion">
     <div class="containerser"><!-- secciones de los servicios de mantenimiento-->
         <div class="row">
             <div class="columna columna-33">   
               <div class="bloque-servicio">
                <div class="bloque-servicio-img cuadrado-perfecto">
                    <img src="IMG/imgutsem/manteprev.png" alt="">
                </div>
                <div class="bloque-contenido-servicio">
                   <h4>PROGRAMA ANUAL DE MANTENIMIENTOS</h4>
                 
                    <a class="boton" href="indexprev1.php" >Entrar</a>
                    
                </div>
                </div>
                 
             </div>
             <div class="columna columna-33">
                   <div class="bloque-servicio">
                <div class="bloque-servicio-img cuadrado-perfecto">
                    <img src="IMG/imgutsem/mantecorec.png" alt="">
                </div>
                <div class="bloque-contenido-servicio">
                   <h4> MANTENIMIENTO CORRECTIVO</h4>
                
                   <a class="boton" href="index_form.php">Entrar</a>
                    
                </div>
                 </div>
             </div>
             <div class="columna columna-33">
               <div class="bloque-servicio">
                <div class="bloque-servicio-img cuadrado-perfecto">
                    <img src="IMG/imgutsem/soft.jpg" alt="">
                </div>
                <div class="bloque-contenido-servicio">
                   <h4>SOFTWARE</h4>
                   
                   <a class="boton" href="index_soft.php">Entrar</a>
                    
                </div>
                 </div>
             </div>
         </div>
         
     </div>
 </section>
 <h2 id="titulogaleria">EVIDENCIAS</h2><!--galeria de fotos-->
 
 <section id="galeria">
    <div class="container-fluit">
       <div class="row">
        <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/site.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
         <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/imgutsem/cable.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
         <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/imgutsem/cpu.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
         <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/imgutsem/limpieza.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
         <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/mant.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
         <div class="columna-33">
            <div class="cuadrado-perfecto">
                <img src="IMG/imgutsem/telefono.jpeg" alt="">
                <h4></h4>
            </div>
        </div>
        </div>
    </div> 
    
    
    
 </section>
 
 </section>
    </main>
    <footer>
        <div class="container">
            <div class="row">
                <div class="columna columna-25">
                    <img src="IMG/imgutsem/UTSEM%20LOGO%20NUEVO.png" alt="">
                    <p></p>
                    
                </div>
                <div class="columna columna-25">
                   <h3 id="Contacto">Temas relacionados</h3>
                    <ul><!-- contactos de la universidad-->
                        <li><a href="http://www.utsem.edu.mx/ut/">Página Oficial UTsem</a></li>
                        <li><a href="http://201.116.64.229/eQDZpro_UTSEM/">Sistema de Calidad</a></li>
                        <li><a href="https://es-la.facebook.com/UTsemTejupilco/">Facebook Oficial</a></li>
                    </ul>
                </div>
                <div class="columna columna-25">
                   <h3>Datos de contacto</h3>
                    <ul>
                        <li>Extención de Teléfono: 127</li>
                        <li>Correo: sistemas@utsem.edu.mx</li>
                        <li>Dirección: Carr Tejupilco-Amatepec Kilómetro 12, 51400 Tejupilco de Hidalgo, Méx.</li>
                    </ul>
                </div>
            
            </div>
        </div>
        <div class="grupo-2">
            <small>&copy; 2023 <b>MI-CPU</b> - Todos los Derechos Reservados.</small>
        </div>
    </footer>
</body>
</html>