*{
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    box-sizing: border-box;
    
    font-family: Arial, Helvetica, sans-serif;
    }
   
.ww img{

position: fixed;

width: 55px;

height: 55px;

line-height: 155px;

bottom: 50px;

right:30px ;

background: #0df053;

color: #fff;

border-radius: 50px;

text-align: center;

font-size: 30px;

box-shadow: 0px 1px 10px rgba(0, 0, 0,0.3);

z-index: 100;

border-radius: 50px;

}
    header{
width: 100%;
padding: 40px;
color:aliceblue;
text-align: center;
background-color:rgb(12, 37, 179);
background-size: cover;
    }
    nav ul{

        list-style:none;
        background-color:blueviolet;
        text-align: center;
        
    }
    
    nav ul li{

        display: inline-block;
        padding: 20px;
        transition: all ease-in-out 250 ms;
    }

    ul li a{

        color: rgb(17, 17, 17);
        text-decoration: none;
        font-size: 18px;
         font-weight: 600;
    }

    nav ul li:hover{

        background:rgb(150, 231, 175);
        color: rgb(238, 21, 212);
       
        
    }

  
  
    .main{

        background-color: rgb(242, 0, 255);
        background-size: cover;
        width: 100%;
        height:auto;
        position: relative;
      display: flex;
      flex-direction: column;
     align-items: center;
     
    }
    .body,html{
        background-color: rgb(242, 0, 255);
        background-size: cover;
        width: 100%;
        height: auto;
        overflow-x: hidden;
    }
    nav ul li a img{
    width: 45px;
    height: 45px;
    border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;

}
 
   
    .fila{

        background-color:rgb(242, 0, 255);
        background-size:cover;
        background-position: center;
        height: 100%;
        width: 90%;
    }
  .titulo22{

  
      background-color:rgb(242, 0, 255);   
     width: 100%;
  }

  .titulo222{
    background-color:rgb(242, 0, 255);   
    width: 100%;
  }

  
.cabecera34{
   position: relative;
     
       width: 100%;
       
        
       
          display: flex;
          align-items: center;
         justify-content: center;
      background-color:rgb(242, 0, 255);   
}
.titulo22 h1{

    display: flex;
          align-items: center;
         justify-content: center;
         color:black;
         font-size: 24px;
         font-weight: 600;
}
.titulo22 h2{
    display: flex;
    align-items: center;
   justify-content: center;
   color:black;
   font-size: 24px;
   font-weight: 600;

}
.izquierda3{
    background-color: rgb(242, 0, 255);
   
}
    .contenedor1{
        position: relative;
        width: 100%;
        height: auto;
       padding: 20px 40px;
       margin: auto;
       background-color: rgb(242, 0, 255);
        display: flex;
         align-items: center;
         justify-content: center;
        
        }
        .contenedor2{
            position: relative;
            width: 100%;
            height: auto;
           padding: 20px 40px;
           margin: auto;
           background-color: rgb(242, 0, 255);
            display: flex;
             align-items: center;
             justify-content: center;
            
            }
            .contenedor3{
                position: relative;
                width: 100%;
                height: auto;
               padding: 20px 40px;
               margin: auto;
               background-color: rgb(242, 0, 255);
               
                display: flex;
                 align-items: center;
                 justify-content: center;
                
                }

                .contenedor4{
                  
                    width: 100%;
                    height: auto;
                   padding: 20px 40px;
                   margin: auto;
                   background-color:rgb(242, 0, 255);   
                    display: flex;
                    align-items: center;
                    Justify-content: center;
                    
                    }
                    .contenedor5{
                  
                        width: 100%;
                        height: auto;
                       padding: 20px 40px;
                       margin: auto;
                       background-color:rgb(242, 0, 255);   
                        display: flex;
                        align-items: center;
                        Justify-content: center;
                        
                        }
                        .contenedor6{
                            position: relative;
                            width: 100%;
                            
                           padding: 20px 40px;
                           margin: auto;
                           background-color:rgb(242, 0, 255);   
                            display: flex;
                             align-items: center;
                             justify-content: center;
                            
                            }

            .contenedor7{
                
                

                position: relative;
                width: 100%;
                height: auto;
               padding: 20px 40px;
               margin: auto;
               background-color: rgb(242, 0, 255);
                display: flex;
                 align-items: center;
                 justify-content: center;
            }

            .derecha711{
                width: 100%;
                         
                margin: 5px;
                padding: 50px;
                background-color:rgb(242, 0, 255);   
               
                display:flex;
                 align-items: center;
                 justify-content:center;
                

            }
            .derecha{
                background-color: rgb(242, 0, 255);
            }
            .derecha711 img{
                width:auto;
                                height: 100%;   
                margin: 5px;
                padding: 50px;
                background-color: aqua;
               
                display:flex;
                 align-items: center;
                 justify-content:center;
                

            }

           .izquierda712 img{
                
                    width: 50%;
                    height: 70%;   
                    
                    background-color:rgb(242, 0, 255);  
                   
                    
                    
    
                
            }
 

           .izquierda712{
                width: 100%;
                         
               
                background-color:rgb(242, 0, 255);  
               
                display: flex;
                 align-items: center;
                 justify-content: center;
                

            } 

            .contenedor8{

                position: relative;
        width: 100%;
        height: auto;
     padding: 20px 40px;
       margin: auto;
       background-color:rgb(242, 0, 255);   
        display: flex;
         align-items: center;
         justify-content: center;
            }
            caja81{
            
                position: relative;
                width: 100%;
                height: auto;
               padding: 20px 40px;
               margin: auto;
                background-color: brown;
                display: flex;
                 align-items: center;
                 justify-content: center;
            }
            .contenedorservicios1{

                position: relative;
                width: 100%;
                height: auto;
               padding: 20px 40px;
               margin: auto;
                background-color: brown;
                display: flex;
                 align-items: center;
                 justify-content: center;
    }
       
                        .basic1{
                            width: 50%;
                         
                            margin: 5px;
                            padding: 50px;
                            background-color: rgb(242, 0, 255);
                           
                            display: flex;
                             align-items: center;
                             justify-content: center;
                            
                        
                        }
                        

                        .derecha {
                            display: flex;
                            align-items: center;
                            justify-content: center;


                        }
                        .derecha img{
                            width: 70%;
                            height: 70%;


                        }
                        .izquierdamapa img{
                            width: 50%;
                            height: 80%;


                        }
                        .duo1 img{
                            width: 100%;
                            height: 100%;


                        }
                        
                        .duo1{
                           
                                margin: 10px;
                                padding: 50px;
                                background-color:rgb(242, 0, 255);   
                                width: 50%;
                                
                            
                        }
   
   

.basic{
    width: 50%;
   
    margin: 5px;
    padding: 50px;
    background-color: rgb(248, 247, 250);
    color:black;
    font-size: 24px;
    font-weight: 600;
    border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;
}


.duo{
   
        margin: 10px;
        padding: 50px;
        background-color: rgb(248, 247, 250);
        width: 50%;
        color:black;
        font-size: 24px;
        font-weight: 600;
        border-radius: 20px;
        -webkit-border-radius: 20px ;
        -moz-border-radius: 20px ;
        -o-border-radius: 20px ;
        -ms-border-radius: 20px ;
}

.anual{
    
    margin: 10px;
    padding: 50px;
    background-color: rgb(248, 247, 250);
    width: 50%;
    color:black;
    font-size: 24px;
    font-weight: 600;
    border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;
    }

    .pareja{
             
        margin: 10px;
        padding: 50px;
        background-color: rgb(248, 247, 250);
        width: 50%;
        color:black;
        font-size: 24px;
        font-weight: 600;
        border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;
    }
    
    
    .trimestral{
       
        width: 50%;
        margin: 10px;
        padding: 50px;
        background-color: rgb(248, 247, 250);
        color:black;
        font-size: 24px;
        font-weight: 600;
        border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;
    }
    .semestral{
        width: 50%;
        margin: 10px;
        padding: 50px;
        background-color: rgb(248, 247, 250);
        color:black;
        font-size: 24px;
        font-weight: 600;
        border-radius: 20px;
    -webkit-border-radius: 20px ;
    -moz-border-radius: 20px ;
    -o-border-radius: 20px ;
    -ms-border-radius: 20px ;
    }

            .basic h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }.basic h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .anual h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .anual h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .duo h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .duo h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .trimestral h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .trimestral h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .pareja  h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .pareja  h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .semestral h1{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .semestral h2{
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .basic a{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .anual a{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .duo a{
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .trimestral a{
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .pareja  a{
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .semestral a{

                display: flex;
                align-items: center;
                justify-content: center;
            }

   
   
            .anual h3{
                   display: flex;
                     align-items: center;
                    justify-content: center;
                    color:black;
                      font: size 10px;
                     font-weight: 600;
            }
           
                  
     
  
   .goopadre{
    
    
   height: 300px;
   width: 50%;
   }
   .goohijo{
    width: 50%;
        margin: 10px;
        padding: 50px;
   
        background-color:rgb(242, 0, 255);   
    width: 95%;
    height: 95%;
   }
   .ima{
    width: 100%;
    height: 300px;

}

.azulpadre{
    align-items:end;
    justify-content:end;
    width: 50%;
    height: 50%;
    margin: 10px;
    padding: 50px;
    background-color:rgb(242, 0, 255);   
  
   }
   .caja72{
    background-color:rgb(242, 0, 255);  
    width: 100%;
   
   }

   
   .caja72 p{
    color:black;
    font-size: 28px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
   }

   .caja72 p a{
    
    text-decoration: none;
   }
   .anual h3{
    
    color:black;
      font-size: 14px;
     font-weight: 600;
     display: flex;
    align-items: center;
    justify-content: center;
}
.duo h3{
   
   color:black;
     font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}
.trimestral h3{
   
   color:black;
     font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}
.semestral h3{
   
   color:black;
     font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pareja h3{
   
   color:black;
     font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.asisa{
    padding: 20px 20px;
    margin-top: 10px;
    margin: 15px;
    width: 200px;
    height: 100px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 20px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.asefasalud{
    padding: 20px 20px;
    margin-top: 10px;
    margin: 15px;
    width: 200px;
    height: 100px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 20px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.alares{
    padding: 20px 20px;
    margin-top: 10px;
    margin: 15px;
   
    width: 200px;
    height: 100px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 20px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.final{
    height: 30px;
    width: 100%;
    color: blueviolet;

    padding: 0px 0px;
    margin-top: 0px;
    background-size: cover;
  
}
.final nav ul a img{
    height: 50px;
    width: 50px;
   
       
    
}
.final nav ul {
   
    color: rgb(67, 226, 43);
background-size: cover;
} 
   
 .carousel2 {
  width: 900px;
   height: 800px;
   overflow: hidden;
   position: relative;
   margin-left:27%;
  }

 .carousel2 img {
   width: 100%;
   height: 100%;
   position: absolute;
  /*top: 0;
   left: 0; */
        
   margin: auto;
   opacity: 0;
   transition: opacity 1s ease-in-out;
 }

 .carousel2 img.active {
   opacity: 1;
 }  
 .carousel {
  width: 900px;
   height: 800px;
   overflow: hidden;
   position: relative;
   margin-left:27%;
 }

 .carousel img {
   width: 100%;
   height: 100%;
   position: absolute;
  /*top: 0;
   left: 0; 
        
   margin: auto;*/
   opacity: 0;
   transition: opacity 1s ease-in-out;
 }

 .carousel img.active {
   opacity: 1;
 }  

@media (max-width: 768px){


.titulo22{

  width: 90%;
}

    nav ul{

        list-style:none;
        background-color:blueviolet;
        text-align: center;
        
    }     nav{

  width: 100%;
    
    flex-direction: column;
}
  ul li{
     width: 100%;
     padding: 26px;
     text-align: left;
 }
 .carousel2 {
   width: 350px;
   height: 380px;
   overflow: hidden;
   position: relative;
   margin-left:19%;
 }

 .carousel2 img {
   width: 100%;
   height: 350px;
   position: absolute;
  /*top: 0;
   left: 0; */
        
   margin: auto;
   opacity: 0;
   transition: opacity 1s ease-in-out;
 }

 .carousel2 img.active {
   opacity: 1;
 }  
 .carousel {
   width: 350px;
   height: 380px;
   overflow: hidden;
   position: relative;
   margin-left:19%;
 }

 .carousel img {
   width: 100%;
   height: 100%;
   position: absolute;
  /*top: 0;
   left: 0; */
        
   margin: auto;
   opacity: 0;
   transition: opacity 1s ease-in-out;
 }

 .carousel img.active {
   opacity: 1;
 }  

.ww img{

position: fixed;

width: 55px;

height: 55px;

line-height: 155px;

bottom: 50px;

right:70px ;

background: #0df053;

color: #fff;

border-radius: 50px;

text-align: center;

font-size: 30px;

box-shadow: 0px 1px 10px rgba(0, 0, 0,0.3);

z-index: 100;

border-radius: 50px;

}
.caja81{

    width: 100%;
    padding: 16px;
    flex-direction: column;
}

.contenedor7{
    width: 100%;
    padding: 16px;
    flex-direction: column;

}

.contenedor1{
    width: 100%;
    padding: 16px;
    flex-direction: column;
 

}
.contenedor2{
    width: 100%;
    padding: 16px;
    flex-direction: column;
   
}
.contenedor3{
    width: 100%;
    padding: 16px;
    flex-direction: column;
  
    
}
.header{


  width: 100%;

}
.main{

background-color: rgb(242, 0, 255);
width: 100%;
height:auto;
position: relative;
display: flex;
flex-direction: column;
align-items: center;

}
.body{
background-color: rgb(242, 0, 255);
width: 100%;
}
.contenedor6{
    width: 100%;
    padding: 16px;
    flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;

}
.caja72 p{
   padding: 3px 3px;
   width: 100%;
   text-align: center;
   font-size: 25;
}

.izquierda712 img{

    padding: 3px 3px;
    width: 300px;
    height: 100px;
    text-align: center;
}

.cabecera2 img{

    padding: 3px 3px;
    width: 300px;
    height: 100px;
    text-align: center;
}
.cabecera34 img{

    padding: 3px 3px;
    width: 300px;
    height: 100px;
    text-align: center;
}
.basic{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;

}
.basic h2{

    color:black;
    font-size: 18px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.duo{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;

}
.duo h2{

    color:black;
    font-size: 20px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
.duo a{
    display: flex;
    align-items: center;
    justify-content: center;
    color:black;
    font-size: 12px;
    font-weight: 600;
    margin-top: 10px;
}
.basic a{
    display: flex;
    align-items: center;
    justify-content: center;
    color:black;
    font-size: 12px;
    font-weight: 600;
    margin-top: 10px;
}
.anual{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;

}
.pareja{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 10px;
}
.trimestral{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 10px;
}
.semestral{
    padding: 20px 3px;
    width: 200px;
    height: 120px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    margin-top: 10px;
}
.anual h2{

    color:black;
    font-size: 20px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.anual a{
        display: flex;
        align-items: center;
        justify-content: center;
        color:black;
        font-size: 12px;
        font-weight: 600;
    
}

.pareja h2{

    color:black;
    font-size: 20px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.pareja a{
        display: flex;
        align-items: center;
        justify-content: center;
        color:black;
        font-size: 12px;
        font-weight: 600;
    
}
.trimestral h2{

    color:black;
    font-size: 20px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.trimestral a{
        display: flex;
        align-items: center;
        justify-content: center;
        color:black;
        font-size: 12px;
        font-weight: 600;
    
}

.semestral h2{

    color:black;
    font-size: 20px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.semestral a{
        display: flex;
        align-items: center;
        justify-content: center;
        color:black;
        font-size: 12px;
        font-weight: 600;
    
}

.derecha img{
    padding: 3px 3px;
    width: 250px;
    height: 350px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.izquierdamapa img {
    padding: 3px 3px;
    width: 300px;
    height: 300px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.duo1 img{
    padding: 3px 3px;
    width: 400px;
    height: 300px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}


.titulo22 h1 {
    color:black;
    font-size: 16px;
    font-weight: 600; 
    display: flex;
    align-items: center;
    justify-content: center;

}
.titulo22 h2{
    color:black;
    font-size: 18px;
    font-weight: 400; 
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px 3px 3px;
}

.anual h3{
    
     color:black;
       font-size: 14px;
      font-weight: 600;
}
.duo h3{
    
    color:black;
      font-size: 16px;
     font-weight: 600;
}
.trimestral h3{
    
    color:black;
      font-size: 14px;
     font-weight: 600;
}
.semestral h3{
    
    color:black;
      font-size: 14px;
     font-weight: 600;
}
.pareja h3{
    
    color:black;
      font-size: 14px;
     font-weight: 600;
}
.asisa{
    padding: 20px 20px;
    margin-top: 10px;
    width: 200px;
    height: 80px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 17px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.asefasalud{
    padding: 20px 20px;
    margin-top: 10px;
    width: 200px;
    height: 80px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 17px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.alares{
    padding: 20px 20px;
    margin-top: 10px;
   
    width: 200px;
    height: 80px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    background-color: aliceblue;
    color:black;
    font-size: 17px;
    font-weight: 600;
    border-radius: 20px;
-webkit-border-radius: 20px ;
-moz-border-radius: 20px ;
-o-border-radius: 20px ;
-ms-border-radius: 20px ;
}
.final{
    height: 30px;
    width: 100%;


   
}
.final nav ul a img{
    height: 50px;
    width: 50px;
   
       
    
}  
.caja72 p{

  color:rgb(0, 1, 2);
    font-size: 15px;
    font-weight: 400;
} 

.derecha img{
  height: 250px;
    width: 290px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
   
}
.derechaa img{
  height: 390px;
    width: 240px;
    text-align: center;
    justify-content: center;
    flex-direction: column;
   
}
.contenedor8{

position: relative;
/*width: 100%;
height: auto;

margin: auto;*/
background-color:rgb(242, 0, 255);   
display: flex;
align-items: center;
justify-content: center;
}
.tamano ul{


position: relative;
width: 100%;
height: auto;


background-color:rgb(242, 0, 255);   
display: flex;
align-items: center;
justify-content: center;

}
.tamano1 ul{


width: 100%;
height: auto;
padding: 20px 40px;

background-color:rgb(242, 0, 255);   

}
.contenedor8{
width: 87%;
}
.carousel2 imagen1{
width: 100px;
height: 200px;

}
}