a{
      color: white;
      text-decoration: none; 
    }
.oculto {
    display: none;
}

    .barra{
         background-color: rgb(209,37,33);
        }

    .header{
         background-color: #066253;
    }

    .icono-menu{
        color: white;        
    }

    a .fa-shopping-cart {
        display: none;
      color: white; 
    }

    .contenedor-iconos {
    display: flex; 
    justify-content: center; 
    align-items: center; 
    color: white;
    
    }

    .contenedor-iconos2 {
    display: flex;
    align-items: center;   
    }

    #carrito {
        display: none;
      background-color: #28a745; /* Color de fondo verde para el contador */
      color: white; /* Color del texto del contador */
      padding: 5px 10px; /* Espaciado interno del contador */
      border-radius: 50%; /* Hacer que el contador tenga forma circular */
    }






    /**----Estilos responsive---*/
/*===============Celular=====================*/
 @media(min-width:320px){
/*=============header===========*/
    .barra{ /*barra superior*/
        font-size: 10px;        
    }

    .header{
        height: 60px;/*60*/
    }

    .menu{
        margin-top: 6px;       
    }

    .logo{
        width: 120px;
        padding-top: 1em;
    }

    .contenedor-logo{
        height: 5vh;
    }

    .contenedor-iconos{
    height: 6.5vh; 
    }

    .contenedor-iconos2 {   
    font-size: 1.10em;
    gap: 2px;
    }

    .iconowhatsapp{
        width: 55%;
    }

    .fondomenu{
        background-color: red;  
    }
 }
 /*==============Tablet======================*/
 @media(min-width:520px){
/*====================================*/
    .barra{   /*barra superior*/
        font-size: 10px;                  
    }

    .header{
        height: 80px;
    }

    .icono-menu{        
        font-size: 30px;
    }

    .menu{
        margin-top: 10px;       
    }


    .logo{
        width: 12em;
        padding-top: 1.25em;
    }

    .contenedor-logo{
        height: 5vh;
    }

    .contenedor-iconos{
        height: 7vh; 
    }

    .contenedor-iconos2 {   
    font-size: 1.5em;
    gap: 15px;
    }

    .iconowhatsapp{
        width: 100%;
    }

}

/*==============IPAD PRO======================*/
 @media(min-width:768px){
/*====================================*/
    .barra{   /*barra superior*/
        font-size: 13px;
    }

    .header{
        height: 175px;/*90px*/
    }


    .logo{
        width: 15em;
        padding-top: 0px;        
    }

    .contenedor-logo{
        height: 6.5vh;        
    }

    .contenedor-menu{
        height: 6.5vh;
        padding-top: 70px;/*10px*/        
    }
    

    .contenedor-iconos{
    height: 6.5vh;    
    }

    .contenedor-iconos2 {   
    font-size: 1.5em;
    gap: 18px;
    }



} 

/*====================================*/
 @media(min-width:1025px){
/*====================================*/
    .barra{   /*barra superior*/
        font-size: 13px;
        
    }


    .header{
        height: 165px;/*160*/
    }

    .logo{
        width: 20em;
        padding-top: 1em;
    }

    .contenedor-logo{
        height: 12vh;
    }

    .contenedor-iconos{
    height: 12vh; 
    }

    .contenedor-iconos2 {   
    font-size: 1.5em;
    gap: 20px;
    }

}







/* INICIO MENU NAV*/
  @media (max-width: 991.98px) {/*991.98px1024px
    /* Por defecto, el contenedor responsive no flota */
    #contenedor-responsive {
      position: relative;
      z-index: 1;
    }

    /* Cuando el menú está expandido */
    #contenedor-responsive.activo {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 5000;
    }

    /* El contenido desplegable del navbar */
    .navbar-collapse.show {
      position: absolute;
      top: 100%;
      left: 0;
      width: 100%;
      z-index: 5001;
      background-color: #dc3545;
      padding: 1rem;
    }

  }

/* FIN MENU NAV*/



/*CODIGO YA ALMACENADO*/
.btn-flotante-carrito {
font-size: 16px; /* Cambiar el tamaño de la tipografia */
font-weight: bold; /* Fuente en negrita o bold */
color: #fff; /* Color del texto */
border-radius: 5px; /* Borde del boton */
letter-spacing: 2px; /* Espacio entre letras */
background-color: #6fe91e; /* Color de fondo */
padding: 13px 25px; /* 18px 30px Relleno del boton */
position: fixed;
top: 10px;
right: 40px;
transition: all 300ms ease 0ms;
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
z-index: 99;
text-decoration: none;

}


.btn-flotante {
font-size: 16px; /* Cambiar el tamaño de la tipografia */
font-weight: bold; /* Fuente en negrita o bold */
color: #ffffff; /* Color del texto */
border-radius: 5px; /* Borde del boton */
letter-spacing: 2px; /* Espacio entre letras */
padding: 18px 30px; /* Relleno del boton */
position: fixed;
bottom: 40px;
right: 40px;
transition: all 300ms ease 0ms;
/*box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);*/
z-index: 99;
text-decoration: none;

}


.btn-flotante:hover {
/*background-color: #f70743;*/
transform: translateY(-7px);
}


@media only screen and (max-width: 600px){

.btn-flotante{
font-size: 14px;
padding: 12px 20px;
bottom: 20px;
right: 20px;

}




}




/***DESDE AQUI ANIMATION WAHTSAPP**/
.iconowhatsapp {
    width: 5em;
    height: 5em;
    border-radius: 50%;
    cursor: pointer;
    animation-name: ripple;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;

}



@keyframes ripple {
    0% {
        box-shadow: 0 0 0 0 green, 0 0 0 0 #B5B2B2;
    }


    80% {
        box-shadow: 0 0 0 20px #fff0, 0 0 0 40px #fff0;
    }


    100% {
        box-shadow: 0 0 0 0 #fff0, 0 0 0 0 #fff0;
    }



}