*{
                margin: 0;
                padding: 0;
                box-sizing: border-box;
           }

            body{
                height: 150vh;
            }

            section{                
              position: relative;
                width: 100%;
                height: 50vh;
                background: url(../img/MESA.jpg);
                background-size: cover;
                background-position: center center;
                background-attachment: fixed;
                display: flex;
                display: inline-flex;
                background-blend-mode: multiply;                                   
            }
            
            h1{
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                color: #fe5757;
                font-size: 3em;
                font-weight: 800;
                letter-spacing: 2px;
                
            }

            .containerzero{
                text-align: center;  
                margin-top: 40px;
                padding-top: 50px;  
            }

            .zero01{
            font-size: 50px;
            font-family:'Times New Roman', Times, serif;
            text-align:  center;
            color: #4c4c4c;
            width: fit-content;
            padding: 5px 10px;
            border-radius: 3%;           
           }

           .zero02{         
            font-family:'Times New Roman', Times, serif;
            text-align: justify;
            color: #4c4c4c;
            font-size: 17px;
           }


           .containerzero01{
            margin-top: 50px;
           }

           .zero03{
            text-align: justify;
            color: #4c4c4c;
            font-size: 25px;
            font-family:'Times New Roman', Times, serif;
           }

           .zero04{
            text-align: center;
            color: #4c4c4c;
            font-size: 14px;
            font-family:'Times New Roman', Times, serif;
           }

           .mano04{
            width: 100%;
            opacity: 65%;
            border-radius: 3%;
            object-fit: cover;
            transition: clip-path 0.5s ease, transform 0.5s ease;
            clip-path: polygon(
              0% 0%,
              100% 0%,
              100% 100%,
              0% 100%
            );
           }

           .mano04:hover{
             opacity: 100%;
            transform: scale(1.1);
            clip-path: polygon(
              5% 5%,
              95% 0%,
              100% 95%,
              0% 100%
            );
           }


           .zero05{
          font-size: 35px;
          color: #3d4144;
           text-align: center;
          margin-bottom: 15px;
            font-family:'Times New Roman', Times, serif;
           }

           .zero06{
            margin-top: 30px;
            text-align: justify;
            color: #3d4144;
            font-size: 16px;
            font-family:'Times New Roman', Times, serif;
           }

          .zero07{
            font-family:'Times New Roman', Times, serif;
            text-align: justify;
            color: #4c4c4c;
            font-size: 25px;
          }

             .zero08{
            font-family:'Times New Roman', Times, serif;
            text-align: left;
            color: #4c4c4c;
            font-size: 18px;
            margin-top: 250px;
          }
        
            .zero09{
            font-family:'Times New Roman', Times, serif;
            text-align: left;
            color: #4c4c4c;
            font-size: 18px;
            margin-top: 50px;
          }

            .zero010{
            font-family:'Times New Roman', Times, serif;
            text-align: center;
            color: #4c4c4c;
            font-size: 25px;
            margin-top: 90px;
          }

          .cono01{
            margin-top: 25px;
          }

          .imgcon{
            width: 100%;
            margin-top: 50px;
           
        
          }

            .zero011{
             font-family:'Times New Roman', Times, serif;
             font-size: 19px;
            }

            .zero012{
              font-family:'Times New Roman', Times, serif;
              font-size: 17px;
              text-align: justify;
            }

            .zero01013{
              font-family:'Times New Roman', Times, serif;
              font-size: 30px;
              color: #4c4c4c;
              text-align: center;
              font-weight: 900;
            }

            .zero013{
            text-align: justify;
            color: #4c4c4c;
            font-size: 19px;
            font-family:'Times New Roman', Times, serif;
            }


            .foo07{
              font-weight: 900;
             font-family:'Times New Roman', Times, serif;
             font-size: 30px;
            }

            .foo04{
            font-family:'Times New Roman', Times, serif;
             font-size: 20px
            }

            .foo03{
             font-family:'Times New Roman', Times, serif;
             font-size: 30px;
              font-weight: 900;
            }

            .foo01{
             font-family:'Times New Roman', Times, serif;
             font-size: 19px;
             font-weight: 900;
             text-align: center;
            }

            .foo02{
            font-family:'Times New Roman', Times, serif;
             font-size: 45px;
             font-weight: 900;
             text-align: center;
            }

            .tres01{
              border-radius: 3%;
              width: 80%;
              filter: grayscale(100%) blur(2px);
              transition: filter 0.5s ease;
              transition: transform 0.4s ease;
              box-shadow: 0 8px 8px rgba(8, 58, 73, 0.726); /* Sombra suave */
            }
            
            .tres01:hover{
                 filter: grayscale(0) blur(0);
                  opacity: 100%;
                 transform: scale(0.9);
            }

            .mano05{
            width: 85%;
            border-radius: 3%;
            height: 100%;
            filter: grayscale(100%);
            transition: filter 0.5s ease;
            border-radius: 5%;
             transition: transform 0.4s ease;
            box-shadow: 0 8px 8px rgba(8, 58, 73, 0.726); /* Sombra suave */
           }

           .mano05:hover{
            filter: grayscale(0%);
            transform: scale(0.9);
           }

           .imgma{
            margin-top: 50px;
            width: 80%;
            opacity: 75%;
            height: 50%;
            border-radius: 3%;
             transition: transform 0.4s ease;
            box-shadow: 0 8px 8px rgba(8, 58, 73, 0.726); /* Sombra suave */
           }

          .imgma:hover{
             transform: scale(0.9);
            opacity: 100%;

          }

            
          .cata01{
            text-align: center;
            font-size: 15px;
           }
            .containeruno{
                text-align: center;  
                margin-top: 100px;    
            }

            .containerdos{
                text-align: center;
                margin-top: 100px;
             }

       
            .containertres{
                text-align: center;
                margin-top: 50px;

            }

            .containertres01{
                margin-top: 70px;
            }
     

            .bgcinco{
              background-image:linear-gradient( rgba(0,0,0,0.35),
              rgba(0,0,0,0.65)
              ),
               url(../img/conta01.jpg);
              color: #fff;
              align-items: center;
              background-size:cover;
              position: relative;
              font-size: 18px;
              height: 180%;
              margin: 10px;
              border-radius: 5%;
              padding: 20px;
              text-decoration: underline;
              align-items: center;
              display: flex;
              overflow: hidden;
              font-family: 'Times New Roman', Times, serif;
              justify-content: center;
              background-repeat: no-repeat;
              transition: 0.7s ease;
              box-shadow: 0 8px 8px rgba(45, 50, 51, 0.616); /* Sombra suave */
          } 
            
              .bgcinco:hover{
                transform:scale(1.1);
             
              }

              .bgseis{
              background-image:linear-gradient( rgba(0,0,0,0.35),
              rgba(0,0,0,0.65)
              ),
               url(../img/conta02.jpg);
              color: #fff;
              margin-top: 55px;
              align-items: center;
              background-size:cover;
              position: relative;
              gap: 25px;
              font-size: 18px;
              height: 180%;
              margin: 15px;
              border-radius: 5%;
              padding: 20px;
              padding-top: 35px;
              text-decoration: underline;
              align-items: center;
              display: flex;
              overflow: hidden;
              justify-content: center;
              background-repeat: no-repeat;
              font-family: 'Times New Roman', Times, serif;
              transition: 0.7s ease;
              box-shadow: 0 8px 8px rgba(45, 50, 51, 0.616); /* Sombra suave */
          }

              .bgseis:hover{
                 transform:scale(1.1);
              }


               .bgsiete{
              background-image:linear-gradient( rgba(0,0,0,0.35),
              rgba(0,0,0,0.65)
              ),
               url(../img/conta03.jpg);
              color: #fff;
              align-items: center;
              background-size:cover;
              position: relative;
              font-size: 18px;
              height: 180%;
              margin: 15px;
              border-radius: 5%;
              padding: 20px;
              text-decoration: underline;
              align-items: center;
              display: flex;
              overflow: hidden;
              justify-content: center;
              background-repeat: no-repeat;
              font-family: 'Times New Roman', Times, serif;
               transition: 0.7s ease;
              box-shadow: 0 8px 8px rgba(45, 50, 51, 0.616); /* Sombra suave */
          }

              .bgsiete:hover{
                transform:scale(1.1);
              }


              .bgocho{
              background-image:linear-gradient( rgba(0,0,0,0.35),
              rgba(0,0,0,0.65)
              ),
               url(../img/conta04.jpg);
              color: #fff;
              align-items: center;
              background-size:cover;
              position: relative;
              font-size: 18px;
              height: 180%;
              margin: 15px;
              border-radius: 5%;
              padding: 20px;
              text-decoration: underline;
              align-items: center;
              display: flex;
              overflow: hidden;
              justify-content: center;
              background-repeat: no-repeat;
              font-family: 'Times New Roman', Times, serif;
               transition: 0.7s ease;
              box-shadow: 0 8px 8px rgba(45, 50, 51, 0.616); /* Sombra suave */
             }
            
          .bgocho:hover{
               transform:scale(1.1);
            }

            .bg{
              background-color: #1c3e5d;
              color: #fff;
              font-family:'Times New Roman', Times, serif;
            }

            .titulos{
              color: #2A3663;
             /**font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;**/
              font-size: 2rem;
              margin-top: 50px;
           }

           .cabecera{
            background: #1c3e5d;
            font-family:'Times New Roman', Times, serif;
            font-weight: 600;
           }

         



           .titul{
              color: #2A3663;
              /**font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;*/
              font-size: 1.2rem;
              margin-top: 200px;
           }

           .titu{
            color: #2A3663;
            font-weight: 600;
            letter-spacing: 0.2em;
     
           }

            .imagenes{
                width: 200px;
                height: 200px;
                border-radius: 50%;
                box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
            }

           .imagenes01{
              border-radius: 3%;
              object-fit: cover;
              transition: clip-path 0.5s ease, transform 0.5s ease;
              clip-path: polygon(
              0% 0%,
              100% 0%,
              100% 100%,
              0% 100%
            );
            }

            .imagenes01:hover{
             opacity: 100%;
             transform: scale(1.1);
             clip-path: polygon(
              20% 20%,
              95% 0%,
              100% 100%,
              0% 100%
            );

            }

            .numero{
                color: #eaecee;
                font-size: 18px;
            }
            .logo{
                width: 90px;
                height: 90px;
                border-radius: 5%;
            }

            .formulario{
                background: url(img/img1.jpg);
                background-size: cover;
                }
             .fondo-blanco{
                 background: rgba(255, 255, 255, .5);
                }
            .btnWhats{
                bottom: 20px;
                right: 20px;
                width: 70px;
                }

                .footer{
                    background: #192655;
                    color: aliceblue;
                }

                .numero02{
                  font-size: 18px;
                 color: #FFF;
                 padding: 15px;
                  font-family: 'Times New Roman', Times, serif;
                }
                .foo05{
                  font-size: 25px;
                  font-family:'Times New Roman', Times, serif;
                }

                .foo06{
                  font-size: 20px;
                  padding: 25px;
                  margin: 15px;
                  font-family:'Times New Roman', Times, serif;
                }


                .logocab{
                  width: 22%;
                  border-radius: 50%;
                  opacity: 70%;
                }

                .historia{
                  width: 25%;
                   opacity: 75%;
                  border-radius: 50%;                  
                }

                h3{
                  position: relative;
                  margin: 100px;
                  font-size: 5vh;
                  color: #cbced8;
                  -webkit-text-stroke: 3px #383d52;
                 
                }

                h3::before{
                  content:attr(data-text);
                  position: absolute;
                  top: 0;
                  left: 0;
                  width: 0%;
                  height: 100%;
                  color: rgb(247, 248, 248);
                  -webkit-text-stroke: 0px #383d52;
                  border-right: 2px solid #327f9d;
                  overflow: hidden;
                  display: flex;
                  animation: animate 20s linear alternate infinite;
                }

                @keyframes animate {
                  0%{
                    width: 0;
                    }

                   70%, 100%{
                      width: 90%;
                    }
                }

                footer{
                  background: #1c3e5d;
                color: #FFF;
                 }

                 .conta01{
                  margin-top: 100px;
                 }

                 .foot01{
                  font-size: 14px;
                  margin-top: 30px;
                  font-family: 'Times New Roman', Times, serif;
                 }

                 .foot02{
                    margin-top: 150px;
                 }

                 @media screen and (max-width:480px){
                  .zero01{
                  font-size: 22px;
                    padding: 15px;
                                        
                }
                
            .containerzero{
                   text-align: center;  
                   padding-top: 10px;
                   margin-top: 15px;
                   justify-content: center;
                   place-items: center;
                   position: relative;
                   align-items: center;
              }

            .zero02{               
            font-size: 14px;
            width: 280px;
            margin: 20px 18px;
           }

         .imgma{
            position: absolute;
             display: flex;
             display: contents;
          }

           .containerzero01{
            margin-top: 20px;
            padding: 5px;
           }

              .zero03{
            text-align: justify;
            color: #4c4c4c;
            font-size: 20px;
            padding: 1px auto;
            margin: 15px;
            font-family:'Times New Roman', Times, serif;
           }

           .zero04{
            padding: 46px;
            text-align: justify;
            color: #4c4c4c;
            font-size: 14px;
           }

             .mano04{
            width: 80%; 
          }

          .containeruno{
               padding: 0 15px;
          }

          .zero05{
            text-align: justify;
            font-size: 16px;
            margin: 0;
            color: #4c4c4c;
            padding: 20px;
        }

          .zero06{
            font-size: 14px;
            margin: 10px 0;
            color: #4c4c4c;
            padding: 20px;
            text-align: justify;
          }

          .mano05{
            width: 82%;
            max-width: 100%;
            margin-bottom: 15px;
          }
          
          .zero07{
            font-size: 15px;
            color: #4c4c4c;
            padding: 0 10px;
          }

         
               .containerdos{
                text-align: center;
                margin-top: 10px;
                padding: 30px;
                margin: 5px;
            }

               .bgcinco{
                height: auto; /* Que la altura se ajuste al contenido */
                padding: 50px; /* Menos padding para ahorrar espacio */
                margin: 5px 0; /* Márgenes verticales para separar */
                font-size: 14px; /* Reducir tamaño de fuente para legibilidad */
             }

            
               .bgseis{
                height: auto; /* Que la altura se ajuste al contenido */
                padding: 50px; /* Menos padding para ahorrar espacio */
                margin: 5px 0; /* Márgenes verticales para separar */
                font-size: 14px; /* Reducir tamaño de fuente para legibilidad */
             }


             
               .bgsiete{
                height: auto; /* Que la altura se ajuste al contenido */
                padding: 50px; /* Menos padding para ahorrar espacio */
                margin: 5px 0; /* Márgenes verticales para separar */
                font-size: 14px; /* Reducir tamaño de fuente para legibilidad */
             }
             
               .bgocho{
                height: auto; /* Que la altura se ajuste al contenido */
                padding: 50px; /* Menos padding para ahorrar espacio */
                margin: 5px 0; /* Márgenes verticales para separar */
                font-size: 14px; /* Reducir tamaño de fuente para legibilidad */
             }

                  .zero08{
            font-family:'Times New Roman', Times, serif;
            text-align: justify;
            color: #4c4c4c;
            font-size: 14px;
            margin-top: 45px;
          }
          
            .zero010{
            font-family:'Times New Roman', Times, serif;
            text-align: justify;
            color: #4c4c4c;
            font-size: 17px;
            padding: 15px;
            margin-top: 10px;
          }

           .containertres01{
               margin-top: 5px;
               padding:0 49px;
               margin: 5px 28px 2px 5px;
            }

               .tres01{
              border-radius: 3%;
              width: 300px;             
            }

               .zero011{
             font-family:'Times New Roman', Times, serif;
             font-size: 19px;
            }

               .zero011{
             font-family:'Times New Roman', Times, serif;
             font-size: 18px;
             margin-top: 5px;
            }

                .zero012{
              margin-top: auto;    
              font-size: 15px;
              text-align: justify;
            }
               .cono01{
            margin-top: 5px;
            padding: 10px;
            margin: 15px;
            position: relative;
          }

            .zero013{
            padding: 20px;
            font-size: 15px;
            }

            .imagenes01{
              padding: 10px;    
            }

             .cono01{
            margin-top: 15px;
            padding:10px;
            margin: 10px;
          }

          .imgcon{
            width: 5%;
            margin-top: 1px;        
          }

              .zero01013{
              font-size: 20px;
            }

            .foo07{
              font-size: 25px;
            }

            .foo03{
              font-size: 25px;
            }

            .foo02{
              font-size: 30px;
            }

            .foo05{
              font-size: 22px;
            }

            .foo06{
                font-size: 18px;
            }

            .foo01{
              font-size: 14px;
            }
            
            .foot01{
                  font-size: 11px;
                  margin-top: 30px;
                  font-family: 'Times New Roman', Times, serif;
                 }

                   .foot02{
                    margin-top: 5px;
                    padding: 15px;
                 }
         }