/*@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;

}

:root{
    --primary-color:hsl(214,84%,56%);
    --texto-color:hsl(0,0%,31%);
    --bg-color:hsl(0,0%,90%);
    --transition:color 0.1s, background-color 0.2s ease-in-out;
    --skill-bar-length:0%;
    --primary: #007bff;
    --blue: #007bff;
    --color__titulos:darkblue;
}

/*efecto scrolling en todo el html5*/
html{
    scroll-behavior: smooth;
  }

  *main {display : block;}

/*home of page*/
.container_all {
    position: relative;
    right: 0;
    transition: all 300ms;
}

header {
    width: 100%;
    height: 100px;
    font-family: sans-serif;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    transition: all 300ms;
}
/* Add clas menu responsive*/
.move_content {
    right: 180px;
}
/*end menu class responsive*/

.container_header {
    max-width:76rem;
    height: 100%;
    display: flex;
    justify-content: space-between;
    margin: auto;
    padding: 0px 20px;
    
}

header .logo {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

header .logo img {
    width: 60px;
    aspect-ratio: auto 20/20;
}

.container_nav {
    position: relative;
    height: 100%;
}

nav {
    height: 100%;
}

nav ul {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

nav ul li {
    margin: 0px 20px;
}

nav ul li a {
    color: #fff;
    font-size: 14px;
}

.nav_mod {
    height: 70px;
    box-shadow: 1px 1px 10px 0px #00000010;
    background: #fff;
  
   
}

.nav_mod a {
    color: #373737;
}

.marcar a{
    color: #373737;
}

.nav_mod .select {
    color: white;
}

.select {
    background: #359EF9;
    padding: 10px 20px;
    color: white;
    border-radius: 20px;
    
}
/* button of responsive menu*/
.btn_menu {
    width: 50px;
    height: 50px;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    transition: background 300ms;
    display: none;
    background: #F5F5F5;
}

.btn_menu:hover {
    background: #F5F5F5;
    color:darkblue;
}
/*end button responsive menu*/


/* starting of cover*/

.cover {
    width: 100%;
    padding-bottom: 120px;
    font-family: sans-serif;
    padding-top: 100px;
    position: relative;
    overflow: hidden;
}

/*Starting wave*/

.bg_color {
    width: 100%;
    height: 72%;
    background: #2196f3;
    position: absolute;
    top: 0;
}

.wave {
    width: 6000px;
    height: 100%;
    position: absolute;
    top: 170px;
    left: 0;
    background-image: url(../images/wd1.svg);
    background-position: bottom;
 
}

.w1 {
    animation: w1 7s linear infinite;
}

.w2 {
    animation: w2 7s linear -.125s infinite, desplazamiento 7s ease -.125s infinite;
    opacity: 0.5;
}

@keyframes w1 {
    0% {
        margin-left: 0;
    }

    100% {
        margin-left: -1600px;
    }
}

@keyframes w2 {
    0% {
        margin-left: 0;
    }

    100% {
        margin-left: -1600px;
    }
}

@keyframes desplazamiento {

    0%,
    100% {
        transform: translateY(-25px);
    }

    50% {
        transform: translateY(10px);
    }
}


@media (max-width: 700px) {
  
    .wave {
        background-image:none;
    }

    .bg_color {
        height: 80%;
    }
        
    }

/*Starting content texto wave*/

.container_cover {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    position: relative;
    background-size: cover;
    background-position: bottom;
}

.cover .container_info {
    max-width: 400px;
    margin-top: 40px;
    z-index: 2;
}

.cover h1 {
    max-width: 400px;
    font-size: 50px;
    font-weight: 900;
    color: #fff;
    padding-bottom: 6px;
   
}



.cover h2 {
    font-size: 55px;
    font-weight: 900;
    color:#2196F3;
    -webkit-text-stroke: 2px #FFFF;
    margin-top: -30px;
}
@media (max-width: 435px) {
    .cover h1{
       font-size: 40px;
       font-weight: 600;
       margin-bottom: 1rem;
       }
       .cover h2{
        font-size: 40px;
        font-weight: 600;
        padding: 4px;
        }
}

.cover p {
    color: #fff;
    margin-top: 10px;
    text-align: justify;
    font-weight: 300;
    font-size: 19px;
}
/* end content banner /*



   /*mov img of banner*/
.container_vector {
    position: relative;
}


.container_vector img {
    position: absolute;
    right: 0px;
    width: 510px;
    animation: move_vector 6s ease-in-out infinite;
    transition: all 300ms;
}

@keyframes move_vector {
    0% {
        transform: translateY(10px);
    }

    25% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(10px);
    }
}
/* end mov of banner*/


/* starting button of home*/
.button__home a {
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    padding: 13px 35px;
    position: relative;
    text-transform: capitalize;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    color: #FFFF;
    border: 1px solid #FFFF;
    border-radius: 3px;

    max-width: 15rem;
    margin: auto;
    margin-top: 3rem;
    margin-bottom: 4rem;
        /* "to left" / "to right" - affects initial color */
        background: linear-gradient(to right, #6aa6fa 50%, rgba(255, 255, 255, 0) 0%);
        background-size: 200% 100%;
        background-position: bottom right;
        transition: all .7s ease-out; 
  }
 
  .button__home  a:hover{
    background-position: bottom left;

}

.button__home i{
padding-right: 8px;
}

/* end button of home*/



/*starting about of page all element*/

.about___contenido{
    max-width: 78rem;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(10rem,1fr));
    margin: 0 auto;
}


.about__one{
    grid-column: span 4 ;
    font-family: sans-serif;
   
}

.cards__right{
    float: right;
    margin-top: -15rem;
   
 
}

@media (max-width: 670px) {
        .cards__right{
            float:none;
            margin-top: 0px;
        }
    
        .about__cards{
            margin-left: 2rem; 
            }
    }


.cards__contenido{
    background:#FFFF;
    width:20rem;
    height: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    transition: .3s;   
    padding: 18px;
    border-radius: 10px;
    margin-right: 1rem; 
    margin-bottom: 1rem;

}
.cards__contenido h3{
    margin-top: 1.5rem;
    font-size: 25px;
    padding: 1rem;
    font-weight: 600;
    color:darkblue;
    text-transform: capitalize;
}

.cards__contenido p{
    font-size: 15px;
    font-weight: 500;
    color:#454545;
    }


.cards__contenido:hover a{
  background: #4591ff;
  color: #FFFF;
  transition: .3s;   
}

.cards__header {
   align-items: center;
   display: flex;        
   justify-content: center;
   width:18rem;
   position: relative;

}
.cards__header img{
    width: 100%;
    border-radius: 10px;
    aspect-ratio: auto 18/10;
}

.cards__icons{
    position: absolute;
    right: 21px;
    bottom: -46px;
    }

.cards__icons i{
    margin-bottom: 15px;
    display: inline-block;
    color: #1465d8;
    width: 70px;
    height: 70px;
    background: #fff;
    box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
    border-radius: 100%;
    text-align: center;
    font-size: 35px;
    line-height: 70px; 
}

.cards__icon a::before{
content: " ";
font-family: sans-serif;
width: 0;
height: 0;
border-width: 5px 0 5px 7px;
border-style: solid;
display: block;
right: 13px;
border-color: transparent transparent transparent #FFFF;
position: absolute;
top: 50%;
transform: translateY(-50%);
}


.cards__icon a{
border-radius: 0;
color: #202220;
display: block;
-webkit-transition: all .5s ease 0s;
-o-transition: all .5s ease 0s;
transition: .3s;
text-transform: capitalize;
font-weight: 500;
background: #F4F7FC;
padding: 16px 22px;
position: relative;
font-size: 16px;
z-index: 1;
overflow: hidden;
}

.cards__icon a i{
    margin-left: 5px;
    transition: .5s;

}

.cards__icon a::after {
    content: '';
    position: absolute;
    top: 0;
    right: -20px;
    width: 23%;
    height: 100%;
    z-index: -1;
    transform: skew(-29deg);
    padding-left: 20px;
    background: #000000;
    transition: .3s;
}

.cards__icon::after {
    content: " ";
    position: absolute;
    right: 20px;
    background: #fff;
    width: 29px;
    height: 2px;
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);

}
.cards__icon{
margin-top: 30px;
position: relative;
}


.about__two{
    grid-column: span 3 ;
    font-family:sans-serif;
   display: grid;
   align-content: center;
   justify-content: center;
}

.about__us h2{
color:darkblue;
font-size: 35px;
text-transform: capitalize;
margin-top: 1rem;
line-height: 1.2;
font-weight: 600;
padding-bottom: 1rem;
}

.about__us h4{
    color:#6A6A6B;
}
.about__us p{
    color:#454545;
    font-size: 20px;
    font-weight: 300;
  
    }
    
    @media (max-width: 1215px) {
        .about__us{
            margin: 1rem;
           }
       
    }
/*  end about of page all element*/







/*empieza el back cover of section two of page home*/

.back__fondo{
    background: url(../images/space.svg);
    
}

.backcover{
    max-width: 1200px;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(10rem,1fr));
    margin: 0 auto;
    margin-bottom: 5rem;
}
.back__one{
    grid-column: span 3;
    
}

.back__one img{
    margin-top: 3rem;
    width: 35rem;
    aspect-ratio: auto 35/10;



}

@media (max-width: 760px) {
  
    .back__one img{
        width: 26rem;
        aspect-ratio: auto 26/10;
    }
   
    }

.back__two{
    grid-column: span 3 ;
    font-family:sans-serif;
   
}

/*contendo del back__two*/
.back__contenido h2{
color:#FFFF;
font-size: 35px;
margin-bottom: 0px;
text-transform: capitalize;
margin-top: 3rem;
line-height: 1.2;
font-weight: 600;

}

.back__texto h3{
    color:#FFFF;
    font-size: 22px;
    text-transform: capitalize;
    margin-top: 1rem;
    line-height: 1.2;
    font-weight: 600;
    padding-bottom: 1rem;
}
.back__texto p{
    color: #FFFF;
    font-size: 20px;
    font-weight: 300;
    padding-bottom: 1rem;
}

.back__iconos{
display: flex;
justify-content: center;
padding: 2rem;
}

.back__icon_one{
    width: 6rem;
    height: 6rem;
   color: white;
   margin: 0.2rem;
   font-size: 4rem;
  /*ajuste de los iconos*/
   align-items: center;
   display: flex;        
   justify-content: center;
/*background de los iconos*/
  border: solid #FFFF;
}
.back__icon_one:hover{
color: #4591FF;
background: #FFFF;
}

.back__contenido{
    margin: 1rem;
}

/*end the cover of section two of page home*/

  
/*inicia barra de progreso*/

.bg__progeso{
    max-width: 1200px;
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fill, minmax(10rem,1fr));
    margin: 0 auto;
}

/*lado dercho*/
.bg__rigth{
    grid-column: span 3;
}


.bg__contenido_image img{
    width: 35rem;
    aspect-ratio: auto 35/15;
}

@media (max-width: 760px) {
  
.bg__contenido_image img{
    width: 25rem;
    aspect-ratio: auto 25/15;
   
}
    
    }

/*termina lado derecho*/

.bg__principal{
    grid-column: span 3;
 
}

.bg__contenido{
    width: 100%;
    padding: 30px 30px 50px;
    backdrop-filter:blur(10px);

}

.bg__contenido *{
    font-family: sans-serif;
    color:darkblue;
    font-weight: 400;
}

.bg__contenido h2{
    font-size: 35px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 600;
  }
  .bg__contenido p{
    color: #232323;
    font-size: 21px;
    font-weight: 300;
    padding-bottom: 2rem;
}

.skills:not(:last-child){
    margin-bottom: 2rem;

}

.bg__details{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
}

/*es una prueba*/
.bg{
position: absolute;
right: 2rem;
background: #4591ff;
border-radius: 5px;
padding: 1px 7px;
color: #FFFF;
}


.bg__menu{
    position: relative;
    border: 1px solid #4591ff;;
    border-radius: 1rem;

}

.bg__menu div{
    position: relative;
    width: 0;
    height: 8px;
    border-radius: 10px;
    background-color: #4591ff;
}

/*animacion del bg de lenguaje*/

#html-bg__menu{
    animation: html-barra 9s forwards; 


}
@keyframes html-barra{
    100%{
        width: 90%;

    }
}

#css-bg__menu{
    animation: css-barra 9s forwards;   

}
@keyframes css-barra{
    100%{
        width: 70%;

    }
}

#js-bg__menu{
    animation: js-barra 9s forwards;   

}
@keyframes js-barra{
    100%{
        width: 80%;

    }
}

#php-bg__menu{
    animation: php-barra 9s forwards;   

}
@keyframes php-barra{
    100%{
        width: 60%;

    }
}

/* end barra of progreso*/




/*starting about section page */

.section__about{
    background: url(../images/space.svg);
    background-repeat: no-repeat;
    background-size: cover;
    color:#FFFF;
    
    }
    .section__contenido{
        display: grid;
        max-width: 75rem;
        display: grid;
        gap: 1rem;
        grid-template-columns : repeat (auto-fill, minmax(min(100%, 10rem),1fr)); /*se acomod el texto 100%*/
        margin: 0 auto;
        font-family: sans-serif;
     
    }
    
    .section__contenido a {
        display: inline-block;
        font-size: 18px;
        font-weight: 400;
        padding: 13px 37px;
        position: relative;
        text-transform: capitalize;
        -webkit-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        color: #FFFF;
        border: 1px solid #FFFF;
        border-radius: 3px;
        max-width: 15rem;
        margin: auto;
        margin-top: 3rem;
        margin-bottom: 4rem;
            /* "to left" / "to right" - affects initial color */
        background: linear-gradient(to right, #4591ff 50%, rgba(255, 255, 255, 0) 0%);
        background-size: 200% 100%;
        background-position: bottom right;
        transition: all .7s ease-out;
       
      }
      .section__contenido a:hover {
        background-position: bottom left;
       
      }

      .about__contenido i{
        padding-right: 8px;
      }

      .about__contenido{
        max-width:75rem;
        display: grid;
        align-content: center;
        justify-content: center;
       
      }
    
      .about__contenido h2 {
        font-size: 35px;
        font-weight: 600;
        text-align: center;
        color:#FFFF;
        text-transform: capitalize;
        margin-top: 2rem;
        line-height: 1.2;
        padding-bottom: 1rem;
        max-width: 60rem;
      }
    /*end section  about*/
    
    


/*inicia marketing digital*/

.digital__contenido{
    display: grid;
    max-width: 75rem;
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fill, minmax(10rem,1fr));
    margin: 0 auto;
    font-family: sans-serif; 
    margin-top: 5rem;
}

.digital__one{
    grid-column: span 3;
}

.digital__servicios{
margin: 1rem;
}

.digital__one h2{
    font-size: 35px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 600;
    color: darkblue;
}

.digital__one p{
    font-size: 20px;
   font-weight: 500;
   color:#454545;
   margin-bottom: 2rem;
}

.digital__icon_contenido{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    
}

.digital__forma{
display: flex;
background: #fff;
border-radius: 5px;
position: relative;
padding: 14px 14px 14px 73px;
transition: .5s;
z-index: 1;
margin-bottom: 23px;
box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08);
width: 17rem;
}

.digital__forma {
    display: inline-block;
    color:#1e1666;
    /* "to left" / "to right" - affects initial color */
    background: linear-gradient(to left, #FFFF 50%, #4591FF 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}

.digital__forma:hover {
    background-position: left;
}

.digital__forma:hover{
    color: #FFFF;
}

.digital__forma::before{
background: #2513d1;
position: absolute;
content: "";
left: 0;
top: 0;
height: 100%;
width: 0;
z-index: -1;
border-radius: 5px;
transition: .5s;
}

.digital__iconos i{
position: absolute;
left: 0;
width: 55px;
height: 100%;
line-height: 50px;
background: #4591FF;
text-align: center;
top: 0;
border-radius: 5px 0 0 5px;
transition: .5s;
font-size: 23px;
color: #fff;
}

.digital__texto h3{
margin: 0;
font-size: 17px;
font-weight: 700;
transition: .5s;
}

.digital__two{
    grid-column: span 3;
}

.digita__imagen{
margin-left: 4rem;
}
/*esta es de la segunda sectio*/
.digita__imagen2 {
margin-right: 5rem;
}
/*end*/
.digita__imagen2 img{
    width: 100%;
    aspect-ratio: auto 20/10;
    }

    .digita__imagen img{
        width: 100%;
        aspect-ratio: auto 20/10;
       
     }
    
/*finaliza marketing digital*/




/* Play para button de video */

.play-btn {
    width: 100px;
    height: 100px;
    background: radial-gradient(rgba(25, 147, 247, 0.8) 60%, rgba(255, 255, 255, 1) 62%);
    border-radius: 50%;
    position: relative;
    display: block;
    margin: 100px auto;
    box-shadow: 0px 0px 25px 3px rgba(25, 147, 247, 0.8);
}

.play-btn::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-40%) translateY(-50%);
    transform: translateX(-40%) translateY(-50%);
    transform-origin: center center;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 25px solid #fff;
    z-index: 100;
    -webkit-transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

/* pulse wave */

.play-btn:before {
    content: "";
    position: absolute;
    width: 150%;
    height: 150%;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation: pulsate1 2s;
    animation: pulsate1 2s;
    -webkit-animation-direction: forwards;
    animation-direction: forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: steps;
    animation-timing-function: steps;
    opacity: 1;
    border-radius: 50%;
    border: 5px solid rgba(124, 172, 245, 0.75);
    top: -30%;
    left: -30%;
    background: rgba(47, 45, 148, 0);
}

@-webkit-keyframes pulsate1 {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        opacity: 1;
        box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75), 0px 0px 25px 10px rgba(255, 255, 255, 0.75);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0;
        box-shadow: none;
    }
}

@keyframes pulsate1 {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        opacity: 1;
        box-shadow: inset 0px 0px 25px 3px rgba(255, 255, 255, 0.75), 0px 0px 25px 10px rgba(255, 255, 255, 0.75);
    }

    100% {
        -webkit-transform: scale(1, 1);
        transform: scale(1);
        opacity: 0;
        box-shadow: none;
    }
}

/* end Play para button de video*/



/*AQUI COMIENZA EL Formulario*/

.formulario {
    margin-top: 5rem;
    color:#454545;
    line-height: 1.6;
    font-family: sans-serif;
    

}

.contenido_form {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 1.5em;
}

.texto_form {
    max-width: 900px;
    margin: auto;
    text-align: center;
    

    font-size: 20px;
    font-weight: 500;
    color: #454545;
    margin-bottom: 2rem;
    margin-top: 2rem;
}

.btn-send {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 1px;
    color: #FFFF !important;
   
}

.btn-send i{
 padding-right: 8px;
 color: #FFFF;
}

ul {
    list-style: none;
    padding: 0;
}

.logo__form {
    text-align: center;
    font-size: 35px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 600;
    color: darkblue;
    margin-bottom: 1rem;

}

.logo__form span {
    color: #454545;
}

.contact-wrapper {
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.3);
}

.contact-wrapper>* {
    padding: 1em;
}

.contact-form {
    background: #fffefe;
    color: #838181
}

.contact-form form {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.contact-form form label {
    display: block;
}

.contact-form form p {
    margin: 0;
    padding: 1em;
}

.contact-form form .block {
    grid-column: 1 / 3;
}

/*prbando para ver si funciona*/
.single-info {
    display: flex;


}

.info-icon {
    font-size: 50px;
    background: #2196F3;
    width: 70px;
    height: 75px;
    text-align: center;
    margin: auto;
    border-radius: 5px;

}

.contact-info hr {
    border: none;
    border-bottom: 1px solid #FFFFFF;

}

.info-content {
    padding: 10px;
}

.info-content p a {
    color:wheat;
}
/*finaliza prueba*/
.contact-form form button,
.contact-form form input,
.contact-form form textarea {
    width: 100%;
    padding: .7em;
    border: none;
    background: none;
    outline: 0;
    color: rgb(46, 45, 45);
    border-bottom: 1px solid #2196F3;
}
.contact-form form button {
    background:#2196F3;
    border: 0;
    padding: 1em;
    border-radius: 20px;
  
}
.contact-form form button:hover,
.contact-form form button:focus {
    background: #1a65a7;
    color: #fff;
    transition: background-color 1s ease-out;
    outline: 0;
    cursor: pointer;

}
/* CONTACT INFO */
.contact-info {
color: #fff;
background:linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(../images/form_01.webp);
}
.contact-info h4,
.contact-info ul,
.contact-info p {
    text-align: center;
    margin: 0 0 1rem 0;

}
.text_alert {
    font-family: sans-serif;
    color: red !important;
    font-weight: 400;
    font-size: 10px;
    z-index: 100;
}
/*Finaliza EL Formulario*/


/* redes sociales*/
.social {
	position: fixed; /* Hacemos que la posición en pantalla sea fija para que siempre se muestre en pantalla*/
	left: 0; /* Establecemos la barra en la izquierda */
	top: 200px; /* Bajamos la barra 200px de arriba a abajo */
	z-index: 2000; /* Utilizamos la propiedad z-index para que no se superponga algún otro elemento como sliders, galerías, etc */
}
	.social ul {
		list-style: none;
	}
	.social ul li a {
		display: inline-block;
		color:#fff;
		background: #000;
		padding: 10px 15px;
        width: 45px;
        height: 40px;
		text-decoration: none;
		-webkit-transition:all 500ms ease;
		-o-transition:all 500ms ease;
		transition:all 500ms ease; /* Establecemos una transición a todas las propiedades */
	}
	.social ul li .icon-facebook {background:#3b5998;} /* Establecemos los colores de cada red social, aprovechando su class */
	.social ul li .icon-twitter {background: #00abf0;}
	.social ul li .icon-instagram { background: #d6249f;}
	.social ul li .icon-youtube {background: #ae181f;}
	.social ul li .icon-whatsapp {background: #049e0c;}

    .social ul li .icon-facebook:hover {
		background: #3b5998; /* Cambiamos el fondo cuando el usuario pase el mouse */
		padding: 10px 30px; /* Hacemos mas grande el espacio cuando el usuario pase el mouse */
	}
    .social ul li .icon-twitter:hover {
		background: #00abf0; /* Cambiamos el fondo cuando el usuario pase el mouse */
		padding: 10px 30px; /* Hacemos mas grande el espacio cuando el usuario pase el mouse */
	}
    .social ul li .icon-instagram:hover {
		background: #d6249f; /* Cambiamos el fondo cuando el usuario pase el mouse */
		padding: 10px 30px; /* Hacemos mas grande el espacio cuando el usuario pase el mouse */
	}
    .social ul li .icon-youtube:hover {
		background: #ae181f; /* Cambiamos el fondo cuando el usuario pase el mouse */
		padding: 10px 30px; /* Hacemos mas grande el espacio cuando el usuario pase el mouse */
	}

    .social ul li .icon-whatsapp:hover {
		background:  #049e0c; /* Cambiamos el fondo cuando el usuario pase el mouse */
		padding: 10px 30px; /* Hacemos mas grande el espacio cuando el usuario pase el mouse */
	}
       
    @media (max-width: 760px) {
        .social {
            display: none;
        }
            
        }
/*finaliza redes sociales*/


/* starting wave of footer*/
.no__permitir{
    width: 100%;
    height: 15rem;
    position: relative;
    overflow: hidden;
    margin-top: 5rem;

}

.ocean { 
    width:100%;
    position:absolute;
    bottom:0;
    left:0;
    background: #2898F3;
  }
  
  .cwave {
    background: url(../images/f1.svg) repeat-x; 
    position: absolute;
    top: -198px;
    width: 6000px;
    height: 198px;
    animation: cwave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
    transform: translate3d(0, 0, 0); 
  }

  .cwave:nth-of-type(2) {
    top: -175px;
    animation: cwave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite, cswell 7s ease -1.25s infinite;
    opacity: 1;
 
  }
  
  @keyframes cwave {
    0% {
      margin-left: 0;

    }
    100% {
      margin-left: -1600px;
   
    }
  }
  
  @keyframes cswell {
    0%, 100% {
      transform: translate3d(0,-25px,0);
  
    }
    50% {
      transform: translate3d(0,5px,0);

    }
  }
/* end wave of footer*/

@media (max-width: 700px) {
    .cwave {
        background:#2898F3;
      }
}

/*AQUI COMIENZA EL FOOTER*/

footer {
    width: 100%;
    font-family:sans-serif;
    background:#2195f3f6;                
}

.container_footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 1200px;
    margin: auto;  
}

.box_footer {
    display: flex;
    flex-direction: column;
    padding: 40px;
}

.box_footer .logo img {
    width: 100px;
    aspect-ratio: auto 20/20;
}

.box_footer .terms {
    max-width: 350px;
    margin-top: 20px;
    font-weight: 400;
    color: #FFFF;
    font-size: 17px;
    text-align: justify;
}

.box_footer h2  {
    margin-bottom: 30px;
    color: #FFFF;
    font-weight: 500;

}

.box_footer a {
    margin-top: 10px;
    color:  #FFFF;
    font-weight: 600;
}

.box_footer a:hover {
    opacity: 0.8;
}

.box_footer a .fab {
    font-size: 20px;
}

/*redes sociales*/
.box_footer a .fa-facebook-square {
    color: #4267B2;
}

.box_footer a .fa-twitter-square {
    color: #1DA1F2;
}

.box_footer a .fa-youtube {
    color: #FF0000;
}

.box_footer a .fa-instagram {
 color:darkmagenta
}

/*Redes Sociales*/

.share {
width: 40px;
background: #fafbfc;
text-align: center;
border-radius: 5px;
transition: .5s;
padding: 4px;
}

.box_copyright {
    max-width: 1200px;
    margin: auto;
    text-align: center;
    padding: 0px 40px;
}

.box_copyright p {
    margin-top: 20px;
    color: #FFFF;
}

.box_copyright hr {
    border: none;
    height: 1px;
    background-color: #FFFF;
}
/*end footer */


@media screen and (max-width: 760px) {
    .container_nav {
        display: flex;
        justify-content: center;
        align-items: center;
       
    }

    .btn_menu {
        display: flex;
    }

    nav {
        height: 100%;
        background: #F1FAFF;
        position: fixed;
        top: 0;
        right: -300px;
        padding: 0 35px;
        transition: all 300ms;
    }

    .move_nav {
        right: 0px;
    }

    nav ul {
        flex-direction: column;
    }

    nav ul li {
        margin: 20px 0px;
    }

    .container_vector img {
        transform: scale(0);
        animation: none;
    }

    .cover h2{ 
        color: #FFF;
           }  

}

/*Ajute del formulario */
/* LARGE SIZE */

@media(min-width: 700px) {

    .contact-wrapper {
        display: grid;
        grid-template-columns: 2fr 1fr;
    }

    .contact-wrapper>* {
        padding: 2em;
    }

    .contact-info h4,
    .contact-info ul,
    .contact-info p {
        text-align: left;
    }
}

/*Finaliza los ajuste del formulaio*/



/*EMPIEZA LA PAGINA DE SERVICIOS*/
.services_content{
    margin-top: 7rem;
}
.services_text{
   font-family:sans-serif;
   font-size: 30px;
   font-weight: 200;
   text-align: center;
   max-width: 1024px;
   margin: auto;
   margin-bottom:  50px;
   color:#454545;
}

.services_text h1{
 
    color:  #075492;
    font-size: 45px;
    text-transform: capitalize;
    margin-top: 1rem;
    line-height: 1.2;
    font-weight: 600;
    padding-bottom: 1rem;
}

.services_text p{
    font-size: 20px;
    font-weight: 200;
    margin-top: 20px;
    
}

/* Start BG barra de progreso*/

.bg_bar{
    /*background: #9b50db no-repeat scroll 0 0;*/
    height: 2px;
    margin: 0 auto 5px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 5px;
    margin-left: auto;
    width: 22px;
}
.bg_bar_circulo{
    height: 5px;
    width: 90px;
    background: #cbbded;
    background-color: rgb(203, 189, 237);
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-attachment: scroll;
    background-image: none;
    background-size: auto;
    background-origin: padding-box;
    background-clip: border-box;
    margin: 5px auto;
    margin-top: 5px;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;
    position: relative;
    border-radius: 30px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;  
}

.bg_bar_circulo::before {
    content: '';
    position: absolute;
    left: 0;
    top: -2.7px;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    background: #0762f8;/*cambia el color del circulo*/
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: MOVE-BG;
    animation-name: MOVE-BG;
  }
  @keyframes  MOVE-BG {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0px);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(88px);
        transform: translateX(88px);
        transform: translateX(88px);
    }
}

/* end animatio de BG*/

/*servicios dos otro prueba empieza la pagina de servicios*/



.services_first{
    font-family:sans-serif;
    max-width: 1200px;
    margin: auto;
    display: grid;
    gap: 1rem;
    grid-auto-rows : 10rem;
    grid-template-columns: repeat(auto-fill, minmax(23rem,1fr));
   
    
}

.sfirst{
     float: left;
       
}
.sfirst img{
    width: 4rem;
    aspect-ratio: auto 4/4;
}
.scontent_two h2{
    color: #075492;
    font-size: 24px;
    margin-bottom: 1rem;
    font-weight: 500;
}

.scontent_two{
margin-left: 5rem;
max-width: 20rem;
color:#ABB5C1;
}
@media screen and (max-width: 1218px){
    .serv_content{
        margin-left: 1rem;
    }
}



/*start space*/
.space{
background: url(../images/space.svg);
background-repeat: no-repeat;
background-position: center; /* Center the image */
background-size: cover;


}
.spacie_contenedor{
    max-width: 1200px;
    margin: auto;
    display: grid;
    gap: 2rem;
    grid-auto-flow: dense;
    grid-template-columns : repeat (auto-fill, minmax(min(100%, 15rem),1fr)); 
    
   

}
.space_bone{
    max-width: 1000px;
    margin: auto;

    
}
.space_head{
    font-family:sans-serif;
    color:#FFFF;
    font-size: 24px;
    font-weight: 400;
    text-align: center;
    text-transform: capitalize;
    max-width: 900px;
    margin-top: 5rem;
}
.space_head p{
    color:#FFFF;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    margin: 2rem;
}
.space-btn a {
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    padding: 13px 37px;
    position: relative;
    text-transform: capitalize;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    color: #FFFF;
    border: 1px solid #FFFF;
    border-radius: 3px;
    background: #2196F3;
  }
  .space-btn{
    margin: auto;
    max-width: 11rem;
  }
  .space-btn a:hover{
    background: #FFFF;
    color: #2196F3;
  }

/* start num count*/


.space_btwo{  
max-width: 1200px;
margin: auto;
display: grid;
grid-template-columns : repeat (auto-fill, minmax(min(100%, 15rem),1fr));
margin-top: 4rem;

}
.space_contador{
background: #FFFF;
text-align: center;
padding: 2rem;
box-shadow: 11px 11px 38px rgba(0,0,0,0.2);
display: flex;
flex-direction: row;
flex-wrap: wrap;

}
.space_texto{
    font-family:sans-serif;
    margin: auto;
    width: 15rem;
    color: #075492;
    font-weight: 400;
   
    
}
.counter {
    font-size: 70px;
    font-weight: 700;

}


/*title of page service*/

.title_serv{
    font-family:sans-serif;
    max-width: 900px;
    margin: auto;
    margin-top: 5rem;
    margin-bottom: 5rem;
    text-align: center;
}
.title_serv h2{
    font-size: 50px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 500;
    color: #075492;


}
.title_serv p{
    color: #454545;
    font-size: 20px;
    font-weight: 200;
    margin-top: 20px;
    
 
}

/*end of page service*/
.pricing-top-bar {
    position: relative;
    background: #2196F3;
    padding-top: 42px;
  }
  
  .pricing-top-bar::before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    content: "";
    background: url(../images/bg-4.png);
      background-position-x: 0%;
      background-position-y: 0%;
      background-repeat: repeat;
      background-size: auto;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: auto;
  }

  .pricing-content{
   cursor: pointer;
   font-family:sans-serif;
  }
  .pricing-content:hover a{
    background: #2196F3;
    color: #FFFF;
  }

  .btn-active a{
    background: #2196F3;
    color: #FFFF !important;
  }


  .plan-title h2 {
    font-size: 45px;
    text-transform: capitalize;
    color: #fff;
    font-weight: 600;
    position: relative;
  }
  .plan-title h2::before {
    width: 25px;
    left: 0;
    right: 0;
    margin: auto;
  }

 

  .price-item {
    margin-bottom: 30px;

  }

  .price-item .currency {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    top: -28px;
  }
  .price-item span {
    display: inline-block;
    color: #fff;
  }

  .price-item .amount {
    font-size: 70px;
    font-weight: 700;
  }

  .price-item span {
    display: inline-block;
    color: #fff;
  }

  .price-item .duration {
    font-size: 20px;
    font-weight: 500;
  }
  .price-item span {
    display: inline-block;
    color: #fff;
}
      .pricing-img {
        background: #fff;
        display: inline-block;
        border: 1px solid #2196F3;
        border-radius: 100%;
        margin-bottom: -15px;
        position: relative;
        padding: 0.8rem; 
      }

      .pricing-img img{
       width: 100%;
       aspect-ratio: auto 5/5;
      }

      .pricing-body {
        padding: 40px 0 50px;
        background: #fff;
      }

      .pricing-feature ul li {
        font-size: 16px;
        padding: 7px 0;
          padding-top: 7px;
          padding-right: 0px;
          padding-bottom: 7px;
          padding-left: 0px;
        text-transform: capitalize;
        font-weight: 300;
      }
      .mt-35 {
        margin-top: 35px;
      }

      .purchase-btn a {
        display: inline-block;
        font-size: 18px;
        font-weight: 400;
        padding: 13px 37px;
        position: relative;
        text-transform: capitalize;
        -webkit-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        color: #2196F3;
        border: 1px solid #2196F3;
        border-radius: 3px;
       
      }
      .pricing-body {
        padding: 40px 0 50px;
        background: #fff;
      }

      .single-plan {
        -webkit-transition: all 0.3s ease 0s;
        -o-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        z-index: 1;
        overflow: hidden;
        text-align: center;
        box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2);
        margin-bottom: 30px;
        padding: 0;
        position: relative;
        border: inherit;
        text-align: center;
        border-radius: 8px;
        grid-column: span 1; /*espacio entre columnas del acho 100%*/
      }


      .precios_pages{
        display: grid;
        gap: 1rem;
        grid-template-columns: repeat(auto-fill, minmax(20rem,1fr));
        max-width: 1200px;
        margin:0 auto;
      }


      /*empieza la progrmacion*/
      .programacion{
        display: grid;
        gap: 1rem;
        grid-auto-rows : 50rem;
        grid-template-columns: repeat(auto-fill, minmax(12rem,1fr));
        max-width: 1200px;
        margin: 0 auto;
        font-family: sans-serif;
        margin-top: 7rem;
      
       

    }

    .item_prog1{
        grid-column: span 2; /*espacio entre columnas del acho 100%*/
        
    }

    .item_prog2{
        grid-column: span 3; /*espacio entre columnas del acho 100%*/
        justify-items:center
    

    }
    .item_prog2 h2{
        font-size: 39px;
        margin-bottom: 0px;
        text-transform: capitalize;
        margin-top: 0;
        line-height: 1.2;
        font-weight: 600;
        color: #075492;
      } 

      .bar {
        width: 52px;
        height: 4px;
        border: 4px solid transparent;
        border-top-color: transparent;
        border-top-color: #f8c304;
        margin: 10px 0 20px;
      }
    
      .progr2{
        font-size: 17px;
        font-style: normal;
        margin-bottom: 2rem;
        color:#838588;

      }


    .prog_item_texto{
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 2rem;
        margin-bottom: 1rem;
        transition: 0.5s;
       
          /* "to left" / "to right" - affects initial color */
        background: linear-gradient(to left, #F4F7FC 50%, #2196F3 50%) right;
        background-size: 200%;
        transition: .5s ease-out;
   

    }

    .prog_item_texto:hover{
        box-shadow: 1px 2px 56px -18px rgba(0,0,0,0.59);
        -webkit-box-shadow: 1px 2px 56px -18px rgba(0,0,0,0.59);
        -moz-box-shadow: 1px 2px 56px -18px rgba(0,0,0,0.59);
        cursor: pointer;
    }

        .prog_item_icon{
          width: 5rem;
          height: 5rem;
          background: #2196F3;
          border-radius: 50%;
          margin: 1rem;
          font-size: 3rem;
          text-align: center;
          color: #FFFF;

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

        .prog_item_icon i{
        padding: 1rem;
        }
 
    .progr_item_texto{
        width: 100%;
        height: auto;
        padding: 1rem;
      
    }
    
  
    .progr_item_texto h2{
        /*color: #075492;*/
        color: darkblue;
        font-size: 24px;
        margin-bottom: 5px;
        font-weight: 500;
        transition: .5s;

        
    }
.progr_item_texto p {
    font-size: 17px;
    font-style: normal;
    margin-bottom: 1rem;
    color:#838588;

}


@media screen and (max-width: 582px){
        .programacion{
           margin-bottom: 15rem;
    }
}

@media screen and (max-width: 460px){
    .prog_item_icon {
      display: none;
}
}
/*Finaliza la progrmacion*/



/*Startin page Proyect*/

.menu__img{
    display: flex;
    flex-wrap: wrap;
    max-width: 76rem;
    margin: auto;
    padding: 1rem;
    justify-content:center;
    align-items:center
}

.img__titulo h2{
    font-family: sans-serif;
    max-width: 50rem;
    font-size: 40px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 600;
    color: darkblue;
    text-align: center;
    padding: 1rem;
  
}
    .img__titulo p{ 
    max-width: 50rem;
    font-size: 20px;
    font-weight: 500;
    color:#454545;
    margin-bottom: 2rem;
    text-align: center;
    
    }
   
.menu__gallery ul li {
  background: transparent;
  border: 1px dashed #2513d1;
  font-size: 16px;
  line-height: 1;
  transition: all 0.3s ease 0s;
  text-transform: capitalize;
  padding: 10px 23px;
  font-weight: 500;
  position: relative;
  margin: 0 3px;
  margin-bottom: 0px;
  margin-bottom: 7px;
  display: inline-block;
  color: #2513d1;
  cursor: pointer;
  list-style: none;
}

.active__gallery {
    background: #2513d1 !important;
    color: #fff !important;
  }

 .filter-button-group :hover{
    background:#2513d1 !important;
    color: #fff !important;
  
  }


/*card starting*/
.gallery{
    display: flex;
    flex-wrap: wrap;
    max-width: 76rem;
    margin: auto;

}

  .conten__gallery{ 
    width: 263px;
    height: 362px;
    color: #FFF;
    text-align: center;
    margin: 1rem;
    position: relative;

   }

   .conten__gallery img{
    width: 100%;
    aspect-ratio: auto 20/30;
    }
  
    .img__one{
     position: relative; 

    }

    .gallery__texto{
        position: absolute;
        top:0;
        width: 263px;
        height: 362px;
        opacity: 0;
        /* "to left" / "to right" - affects initial color */
        background: linear-gradient(to top, rgb(36, 36, 36) 50%, rgba(255, 255, 255, 0) 50%)top;
        background-size: 200% 200%;
        background-position: top;
        transition: all .7s ease-out;
    }

    .gallery__texto p{
      margin-top: 10%;
        
    }


    .gallery__texto ul{
        display: flex;
        justify-content: center;
        margin-top: 30%;
          
      }

      .gallery__texto i{
       background: #fff;
       border-radius: 50%;
       color: #2513d1;
       display: inline-block;
       font-size: 16px;
       height: 40px;
       line-height: 40px;
       width: 40px;
       text-align: center;
       margin: 10px 5px 15px;
       transition: .5s;
          
      }

      
      .gallery__texto h2{
        font-family: sans-serif;
        max-width: 16rem;
        font-size: 15px;
        font-weight: 400;
        color:#FFFF;
        margin-bottom: 2rem;
        text-align: center;
      }


      .gallery__texto p{
        font-family: sans-serif;
        max-width: 16rem;
        font-size: 18px;
        font-weight: 400;
        color:#FFFF;
        margin-bottom: 2rem;
        text-align: center;
      }

      .gallery__texto a{
      cursor: pointer;
      color: #FFF !important;
      }

    .gallery__texto:hover{
        opacity: 1;
        background-position: bottom left;
        color: #fff;
       
    }


    /*Inicia la ventana del chat whatsApp */
    #whatsapp-floating-button {
        position: fixed;
        bottom: 20px;
        right: 20px;
        z-index: 9999;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        background-color: #25D366;
        color: #fff;
        font-size: 24px;
        cursor: pointer;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
        transition: all 0.3s ease-in-out;
        display: flex;
        justify-content: center;
        align-items: center;
      }
    
      #whatsapp-floating-button:hover {
        transform: scale(1.1);
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
      }
    
      #whatsapp-message-window {
        display: none;
        position: fixed;
        bottom: 100px;
        right: 20px;
        width: 320px;
        height: 400px;
        z-index: 9999;
        border-radius: 5px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
        background-color: #fff;
       

       
      }
    
      #whatsapp-message-header {
        background-color: #25D366;
        color: #fff;
        padding: 1rem;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        cursor: pointer;
      }
    
      #whatsapp-message-close {
        float: right;
        font-size: 30px;
        font-weight: bold;
        margin-right: 5px;
       
        

      }
    
      #whatsapp-message-iframe {
        width: 100%;
        height: calc(100% - 40px);
        border: none;

      }

      /*cuadro interno*/
      .chat-window {
     
        border: 1px solid #ccc;
        overflow: auto;
      }
  
      /* Estilos para los mensajes del chat */
    
      .text{
       justify-content: center;
       padding: 1rem;
     
      }
  
      .message {
          background-color: #f2f2f2;
          color: #000;
          padding: 15px;
          margin-bottom: 10px;
          border-radius: 10px;
          max-width: 17rem;
  
       }
  
       .perfil {
              width: 60px;
              height: 60px;
              border-radius: 50%;
              background:#FFF;
              display: flex;
              justify-content: center;
              align-items: center;
          }
          
          .content {
              width: 90%;
              height: 90%;
              border-radius: 50%;
              overflow: hidden;
          }
          
          .content img {
              width: 100%;
              height: 100%;
              object-fit: cover;
          }
  
           .centrar__texto{
             position: absolute;
             max-width: 10rem;
             margin-top: -3rem;
             margin-left: 5rem;
  
           }
  
           .centrar__texto p{ 
              margin: 0px !important;
              padding: 0px !important;
           } 
  
           .texto__negro{
              font-weight: 600;
           }
  
  
          .whatsapp-button {
              background-color: #1D1D1B !important;
              box-shadow: 4px 4px 0px #4dc247;
              border-radius: 8px;
              text-decoration: none;
              cursor: pointer;
              position: relative;
              display: flex;
              align-items: center;
              gap: 14px;
              padding: 16px 20px;
              border-width: initial;
              border-style: none;
              border-color: initial;
              border-image: initial;
              overflow: hidden;
              color:#FFF;
              
              }
  
              .send-btn-text {
              font-family: sans-serif;
              font-weight: 500;
              font-size: 16px;
              line-height: 20px;
              color: #FFFFFF !important;
              }
  
              .text a{
                 font-size: 2rem;   
                
              }
  
              .fa-chevron-right{
              position: relative;
               margin-left: 5rem;
              }
             
      /*finaliza el cuadro interno*/

    /*Finaliza la ventana del chat*/