/*=============== Estilos de efecto Parallax en Cabecera  ===============*/

.contenedor-gral {
    max-width: 1200px; 
    margin: auto;
  }
  
  .contenedor {
    position: relative;
    height: 60vh;
    overflow: hidden;
    margin: 0px 0;
    justify-items: center;  /* Se utiliza cuand hay problemas de alineación */
  }

  .cont-parallax {
    position: relative;
    height: 30vh;
    overflow: hidden;
    margin: 0;
    justify-items: center;
  }
  
  .parallax {
    position: absolute;
    width:100%;
    background-image: url(/img/FotoPrincipal.png);
    background-size: cover;
    background-position: center;
    height: 100vh;
    z-index: -2;
  }
  
  .titulo {
    color: white;
    font-size: 2em;
    text-shadow: 3px 3px 2px #272727;
    text-align: center;
    max-width: 600px;
    margin-top: 120px;
  }
  
  .cont-leyenda {
    justify-items: center;  /* Se utiliza cuand hay 
                               problemas de alineación */
  }
  
  .leyenda {
    color: rgb(255, 255, 255);
    font-size: 1.2em;
    text-shadow: 1px 1px #272727;
    text-align: center;
    max-width: 500px;
    margin-top: 10px; 
  }

  .tit1 {
    position: absolute;
    margin-top: 2%;
    margin-left: -6%;
    font-size: 3em;
  }
  
  .logoCAEL {
    position: absolute;
    width: 150%;
    margin-top: -220px;
    margin-left: 50px;
    z-index: -2;
  }
  
  .imagenCAEL {
    width: 15%;
  }

  /* aplicará estilos solo si el ancho 
     del viewport de su navegador es igual 
     o menor que 400px: */
  @media (max-width: 400px) {
    .contenedor {
      height: 400px;
    }
    .parallax {
      height: 70vh;
    }
    .titulo {
      margin-top: 120px;
    }

    .tit1 {
      margin-top: 10%;
      margin-left: -15%;
      font-size: 3em;
    }

    .logoCAEL {
      margin-top: -70px;
      margin-left: 20px;
      z-index: -2;
    }

    .imagenCAEL {
      width: 35%;
    }
    
  }
  
  
  /*=============== Final Estilos de efecto Parallax en Cabecera  ===============*/
  .aviso {
    position: absolute;
    width:100%;
    height: 100vh;
    background-image: url(/img/Diplomas.png);
    background-size: cover;
    background-position: center;
    z-index: -2;
  }

  .ABCSec {
    position: absolute;
    width:100%;
    height: 100vh;
    background-image: url(/img/ABCsecurity.png);
    background-size: cover;
    background-position: center;
    z-index: -2;
  }

  .t-ABC {
    color: white;
    font-size: 2em;
    text-shadow: 3px 3px 2px #272727;
    text-align: center;
    margin-top: 40px;
  }

  .t-aviso {
    color: white;
    font-size: 2em;
    text-shadow: 3px 3px 2px #272727;
    text-align: center;
    margin-top: 40px;
  }

  .cont-parallax button {
     padding: 0;
     height: 35px;
     font-size: 1.3em;
  }

  .titulos {
    display: block;
    margin-top: 2%;
    justify-items: center;
    padding: 1%;
  }

  .mapa-mensaje {
    margin-top: 0;
  }   

  .conte {
    margin: auto;
    /* background: burlywood; */
    height: max-content;
    padding: 1%;
    /* justify-content: center; */
    /* align-items: center; */
  }
  
  .pri {
     height: 100px;
     background: rgb(0, 204, 255);
     width: 100%;
     margin-bottom: 2%;
     margin-top: 2%;
  }
  
  .segu {
     /* background: rgb(0, 255, 34); */
     /* height: 200px; */
     width: 100%;
     /* padding-top: 1%;
     padding-bottom: 1%; */
     background-color: aqua;
     height: 100px;
  }
  
  .foto {
     background: rgb(255, 72, 0);
     height: 200px;
     width: 40%;
  }
  
  .parrafo {
     background: rgb(204, 0, 255);
     height: 200px;
     width: 60%;
     
  }
  
  .tres {
     display: flex;
     /* background: rgb(251, 255, 0); */
     /* height: 150px; */
     justify-content: center;
     gap: 3%;
     width: 100%;
     padding-top: 2%;
     padding-bottom: 2%;
  }

  

  .cont-fichas {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 2%;
    padding-top: 3%;
    padding-bottom: 2%;
  }

  .cont-fichas .card {
    width: 22rem !important;
  }

  .cont-fichas a:hover {
    opacity: 0.8; 
  }  
  .cont-fichas p {
    font-size: 0.8em;
    margin-bottom: -2%;
  }
  .segu {
     display: flex;
  }
  
  .ficha1 {
     background: chocolate;
     width: 30%;
     height: 150px;
  }
  
  .ficha2 {
     background: rgb(210, 30, 99);
     width: 30%;
     height: 150px;
  }
  
  .ficha3 {
     background: rgb(16, 247, 139);
     width: 30%;
     height: 150px;
  }

  .titulo-curso {
     /* color: black; */
     font-weight: 600;
  }

  .sub-titul {
     margin-top: 1%;
     padding: 0;
     font-size: 1.5em;
  }

  .texto-a {
     padding: 1%;
  }

  .p-normal {
     padding: 5px;
  }

  @media (max-width: 400px) {
    .titulos {
      margin-top: 5%;
    }
       
  }

  /* ============= TEXTO CON IMAGEN ================== */
  
  .tex-img {
    margin: 2% auto;
    width: 95%;
  }

  .tex-img img {
    max-width: 100%;
  }

  .flot-L {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
  }

  .flot-R {
    float: right;
    margin-left: 15px;
    margin-bottom: 15px;
  }

  @media (max-width: 400px) {
    .tex-img img {
      width: 100%;
    }
  }