 *{
                margin: 0;
                padding: 0;
                box-sizing: border-box;
                font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 
                'Open Sans', 'Helvetica Neue', sans-serif;
            }

            body{
                height: 150vh;
            }

            section{                
              position: relative;
                width: 100%;
                height: 50vh;
                background: url(img/slider10.png);
                background-size: cover;
                background-position: center center;
                background-attachment: fixed;
                display: flex;
                display: inline-flex;
                background-blend-mode: multiply;
                                   
            }
            
  .text100{
    color: #8B9A46;
  }

/* From Uiverse.io by Shoh2008 */ 

 .cards-container01{
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
      justify-content: center;
    }

    /* Tarjeta */
    .card01 {
      width: 190px;
      height: 120px;
      transition: all 0.5s;
      box-shadow: 15px 15px 30px rgba(15, 14, 14, 0.432),
                  -15px -15px 30px rgba(60, 60, 60, 0.082);
      text-align: center;
      overflow: hidden;
      background: white;
    }

    .card01:hover {
      height: 260px;
      background: linear-gradient(360deg, #edededc5 60%, rgba(33, 33, 33, 0) 70%);
    }

    .card01 .header {
      padding: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin-bottom: 16px;
    }

    .card01 .header .img-box {
      width: 50px;
    }

    .card01 .header .title {
      font-size: 1em;
      letter-spacing: 0.1em;
      font-weight: 900;
      text-transform: uppercase;
      padding: 4px 0 14px 0;
      transition: all 0.5s;
      color: #fe4b37;
    }

    .card01:hover .header {
      clip-path: polygon(0 0, 100% 0, 100% 100%, 0 96%);
    }

    .card01:hover .header .title {
      padding: 0;
    }

    .card01 .content {
      display: block;
      text-align: left;
      font-size: 20px;
      color: #541212;
      margin: 0 18px;
      font-weight: 700;
    }

    .card01 .content p {
      transition: all 0.5s;
      font-size: 0.8em;
      margin-bottom: 8px;
    }

    .card01 .content a {
      color: #8B9A46;
      cursor: pointer;
      transition: all 0.5s;
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
    }

    .card01 .content .btn-link:hover {
      border-bottom: 1px solid #29282517;
    }

/* From Uiverse.io by codebykay101 */ 





            /*CARD*/
            /* Contenedor en grid responsive */
    .cards-container {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 10px;
      padding: 25px;
      max-width: 1100px;
      margin: auto;
    }

    /* Flip card */
         /*CARD*/

            .efecto {
              transition-property: transform;
              transition-duration: 500ms;
            }

            .efecto:hover{
              transform: scale(1.2);
              opacity: 75%;
            }

            .bg{
              background-color: #fff;
            }

             .bg02{
              color: #fff;
              font-size: 25px;
              font-weight: 700;
            }

            .parrafo01{
            color: #fff;
            font-size: 35px;
            background-color: #fe4b37;
            text-align: center;
            font-weight: 900;
        }

        
      
        .servicios01{
          color: #541212;
          font-size: 12px;
          font-weight: 900;
        }
        .titul05{
          color: #E9E3DF;
          font-size: 25px;
          font-weight: 700;
        }

        .carousel01{
            color: #183D3D;
            font-size: 25px;
            font-weight: 800;
        }
           .menu01{
            color: #fe4b37;
            font-size: 20px;
            font-weight: 900;
           }

           .tel01{
           color:#3E0703;
            font-weight: 800;
            font-size: 20px;
            font-family: Arial, Helvetica, sans-serif;
           }

           .tel02{
             color: #3E0703;            
             padding: 5px;
             font-size: 20px;
            font-size: 20px;
           }



           .titu01{
            font-weight: 800;
            letter-spacing: 3px;
            color: #fff;
            padding: 3px;
            font-size: 15px;
            background-color:#fe4b37;
            font-family: Arial, Helvetica, sans-serif;

             }

             .som01{
            color: #3E0703;           
            text-align: center;
            font-size: 55px;
            letter-spacing: 5px;
            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
            font-weight: 700;
            width: 0;
            white-space: nowrap;
            overflow: hidden;
            border-right: 3px solid #fff;
            animation: typing 3s steps(30) forwards, blink .6s infinite;
          }
   
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

@keyframes blink {
  50% { border-color: transparent }
}
           .containerzero{
            padding:0 70px;
            height: 400px;
          }

          .logsobre01{
            border-radius: 3%;
            transition: .4s ease;
            margin-top: 25px;
            opacity: 75%;
          }

          .logsobre01:hover{
             transform: scale(1.1);
             opacity: 100%;
               filter: brightness(120%);
          }

           .logsobre {
            width: 550px;
            height: 350px;
            border-radius: 3%;
            display: block;
            transition: .4s ease; 
            opacity: 75%;  
               
            }

           .logsobre:hover{
            box-shadow: 0 0 10px #302a29;
            animation: shake .4s linear;
            opacity: 100%;
            filter: brightness(120%);
          }

          @keyframes shake {
           0%,100% { transform: translateX(0); }
           25% { transform: translateX(-4px); }
           75% { transform: translateX(4px); }
      }
           
      .ser01{
        opacity: 65%;
        display: block;
        transition: .4s ease; 
         
      }

      .ser01:hover{
        opacity: 100%;
          filter: brightness(130%);
            transform: translateY(-12px);
      }


           .logsobre02 {
            width: 550px;
            height: 350px;
            border-radius: 3%; 
            display: block;
            transition: .4s ease; 
            opacity: 75%;          
           }

           .logsobre02:hover{
            box-shadow: 0 0 10px #302a29;
            animation: shake .4s linear;
            opacity: 100%;
              filter: brightness(120%);
          }
       @keyframes shake {
           0%,100% { transform: translateX(0); }
           25% { transform: translateX(-4px); }
           75% { transform: translateX(4px); }
      }
            .logsobre03 {
            width: 550px;
            height: 350px;
            border-radius: 3%;  
            display: block;
            transition: .4s ease; 
            opacity: 75%;         
           }

            .logsobre03:hover{
            box-shadow: 0 0 10px #302a29;
            animation: shake .4s linear;
            opacity: 100%;
              filter: brightness(120%);
          } 
       @keyframes shake {
           0%,100% { transform: translateX(0); }
           25% { transform: translateX(-4px); }
           75% { transform: translateX(4px); }
      }

          .containeruno{
           margin-top: 65px;
          }

          .sobre01{
            text-align: justify;
          }

            .titulos{
              color: #541212;
              font-size: 1.5rem;
              font-weight: 900;
           }

          .titulos01{
              color: #541212;
              font-size: 15px;
              font-weight: 500;
              text-align: center;
              text-decoration: underline;  
            
            }

          .titulos02{
           color: #37353E;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 13px;
          text-align: justify;
          }

          
          .correo01{
            font-size: 25px;
            color: #fff;
            font-family: Arial, Helvetica, sans-serif;
          }

       .titulos03{
            color: #541212;
            font-weight: 800;
            font-size: 25px;
            text-transform: uppercase;
       }

          .titulo03{
            color: #000000;
            text-align: left;
            font-size: 15px;
            font-weight: 600;
          }

          .titulo04{
            color: #8B9A46;
            font-size: 14px;
            font-weight: 800;
          }

             .titulo08{
            color: #37353E;
            font-weight:700;
            font-size: 20px;
          }

        .containerdos{
          margin-top: 180px;
          padding:0 70px;
          height: 400px;
        }
       
        .vis01{         
            font-weight: 800;
            letter-spacing: 3px;
            color: #fff;
            padding:10px 35px;
            font-size: 15px;
            margin: 15px auto;
            border-radius: 2%;
            background-color:#fe4b37;
            font-family: Arial, Helvetica, sans-serif;
        }

        .vis02{
          color: #37353E;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 13px;
          text-align: justify;
          margin-top: 35px;
        }


        .vis022{
          color: #37353E;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 13px;
          text-align: justify;
          margin-top: 35px;
        }

        .containertres{
          margin-top: 100px;
          padding: 0 150px;
        }
        
        .containercuatro{
          margin-top: 100px;
          padding:0 70px;
          height: 400px;
        }

        .bene01{
          color: #37353E;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 14px;
           text-decoration: underline;
        }

        .bene02{
         color: #37353E;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 13px;
          text-align: justify;
     }

       .vis011{         
            padding:10px 35px;
            font-size: 13px;
            margin: 15px auto;
            color: #fff;
            font-weight: 700;
            border-radius: 3%;
             font-family: Arial, Helvetica, sans-serif;
            background-color: #fe4b37;
        }

             .vis015{         
            padding:10px 35px;
            font-size: 13px;
            margin: 15px auto;
            color: #fff;
            font-weight: 700;
            border-radius: 3%;
             font-family: Arial, Helvetica, sans-serif;
            background-color: #fe4b37;
        }

        .iconuno{
          color:#fe4b37;
          font-size: 18px;
          margin:auto 10px;
         
        }

        .containercinco{
          margin-top: 100px;
          padding: 0 70px;
        }
          .icono01{
            color: #fff;
            font-weight: 900;
          }

          .icono02{
            color: #000000;
            font-size: 100px;
            margin:0 4px;
            padding:0 100px 100px;
            transition-property: transform;
            transition-duration: 300ms;
          }

          .icono02:hover{
              transform: scale(1.2);
              color: #8B9A46;
            }
      
            .logo{
                width: 90px;
                height: 90px;
                border-radius: 50%;
                
            }

            .servicios{
                  border-radius: 50%;
            }

            .formulario{
                background: url(img/img1.jpg);
                background-size: cover;
                }
             .fondo-blanco{
                 background: rgba(255, 255, 255, .5);
                }
            .btnWhats{
                bottom: 20px;
                right: 20px;
                width: 70px;
                }

                .footer02{
                    color: #fff;
                    font-size: 30px;
                }

                .footer01{
                  color: #fff;
                  font-weight: 700;
                }

                footer{
                  background: #541212;

                }


              @media screen and (max-width:480px) {
             
    .som01{
         font-size: 15px;
         text-align: left;
         font-weight: 900;
         font-family: Arial, Helvetica, sans-serif;
     }

       .containerzero{
          height: 550px;
          padding: 5px;
          overflow: hidden;
          max-width: 1200px;
          justify-items: center;
                  
        }

         .logsobre {
         width: 200px;
         height: 180px;
         max-width: 200px;
         margin:0 100px;
         display: flex;
        }

     .vis02{ 
         height: 550px;
         overflow: hidden;
         align-items: end;
         justify-items: center;
        font-size: 13px;
        padding: 0 75px;
             
        
        }
        .containerdos{
       height: 500px;
       margin-top: 55px;
        }

          .vis022{
          font-size: 13px;
          text-align: justify;
          margin-top: 35px;
          padding:0 5px;   
          
          
        }

    .vis01{         
           padding:10px 35px;
            font-size: 13px;
            margin: 15px auto;
           
        }


        .bene01{

          font-size: 13px;
           text-decoration: underline;
        }

        .bene02{
          font-size: 12px;
          text-align: justify;
     }

      .logsobre02 {
            width: 550px;
            height: 350px;
            border-radius: 3%; 
            max-width: 250px;  
            height: 200px;      
           }


           .containercuatro{
          margin-top: 450px;
          padding:0 70px;
          height: 700px;
        }

        .vis011{       
            padding:10px 15px;
            font-size: 13px;
            margin: 15px auto;
            display: flex;
           color: #fff;
          text-align: justify;
           background-color: #fe4b37;
        }

         .containercinco{
          margin-top: 120px;
          padding: 0 70px;
        }

          .vis015{         
            padding:10px 39px;
            font-size: 13px;
            margin: 15px auto;
            color: #fff;
            font-weight: 700;
            border-radius: 3%;
             font-family: Arial, Helvetica, sans-serif;
            background-color: #fe4b37;
        }

           .containertres{
          margin-top: 10px;
          padding: 0 20px;
          text-align: center;
        }

        .titulos03{
            color: #541212;
            font-weight: 800;
            font-size: 20px;
       }
        
          .titulo08{
            color: #37353E;
            font-weight:700;
            font-size: 15px;
            text-align: center;
          }
          
          .correo01{
            font-size: 16px;
          }

          .logsobre01{
            border-radius: 3%;
            max-width: 900px;
            width: 250px;
            height: 200px;
          }
          

             .logsobre03 {
            width: 250px;
            height: 200px;
            border-radius: 3%;   
            max-width: 1000px;      
           }

         .titu01{
             padding: 3px;
            font-size: 12px;

             }

               .icono02{
            color: #000000;
            font-size: 100px;
            margin:0 4px;
            padding:30px 20px 20px 90px;
            transition-property: transform;
            transition-duration: 300ms;
          }

             .titulos22{
            color: #000000;
            font-size: 28px;
            text-align: justify;
            font-weight: 900;
            padding: 10px;
          }
  }

          