body{margin:0;
background-color: #E9FCD6;
text-align: center;}

.menu{height: 90px;
width:100%;
background-image: url('../images/bm2.jpg');
background-size: contain;
background-repeat: repeat-x;
position: fixed;
top:0;
z-index:4;
}

.menu div, .menu a{background-size: contain;}

.menu .logo{position: absolute;
top:17px;
left: 8.6px;
display: block;
width: 139px;
height: 41px;
background-image: url('../images/logo.webp');}

.menu .mari{position: absolute;
top:54px;
left:90.6px;
width: 25px;
height: 25.6px;
background-image: url('../images/blb2.webp');}

.menu .buho{position: absolute;
top:5px;
left:125.3px;
width: 25.3px;
height: 26px;
background-image: url('../images/blbu2.webp');}

.menu .mrp{position: absolute;
top:54px;
left:160px;
width: 95px;
height: 15px;
background-image: url('../images/mrp2.webp');}
.prod{
    width:93%;
    vertical-align: middle !important;
    clear: none !important;
    float: none !important;
    display: inline-block;
    zoom: 1 !important;
    box-sizing: border-box !important;
    font-family: "Times new roman";

}
@media screen and (min-width:600px) {
 .prod{width:49%;}
}
@media screen and (min-width:1200px) {
 .prod{width:30%;}
}


<style>
  .prod.medi{
    width:48%;
  }

@media screen and (min-width:600px) {
 .prod.medi{width:32%;}
}



@media screen and (min-width:800px) {
 .prod.medi{width:23%;}
}



@media screen and (min-width:1200px) {
 .prod.medi{width:19%;}
}




.prod .d1{border:1px solid #88EE88;
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    background-color: #EBFFDF;
}

.prod .d1 img{width: 100%}

.prod .d1 .info{
    text-align: left;
    font-size:18px;
    font-weight: bold;
    color:#45932F;
    padding: 8px;
    position: relative;
}
.prod .d1 .info h1{
	display:none;
}
.prod .d1 .cod{
    font-size: 0.7em;
    position: absolute;
    bottom:8px;
    left: 8px;
}

.prod .d1 .wsp{
position: absolute;
    
height: 25px;
bottom: 0px;
left: calc(50% - 68px);
background-color: rgba(50,50,50,0.05);
background-image: url('../images/wsp.png');
background-size: 28px;
background-position: 4px 3px;
background-repeat: no-repeat;
padding: 8px 8px 0 35px;
font-style: italic;
font-size:0.8em;
border-radius: 12px 12px 0 0;
z-index: 3;
text-decoration: none;
color:#45932F;
}
.prod .d1 .wsp:focus{
background-color: rgba(50,50,50,0.1);
}

.prod .d1 .wsp:hover{
background-color: rgba(50,50,50,0.2);
}


.prod .d1 .info b{
    display: block;
    position: absolute;
	top:-17px;
	left: 4px;
	font-style: italic;
	font-size: 0.6em;
	text-shadow: 0 0 2px #fff;
	color:#335F21;
}




.prod .d1 .info .precio{
    text-align: right;
    font-size: 1.3em;
	padding:0 6px 0px 0;
}


.prod .d1 .info .talle{
    position:absolute;
    top:-20px;
    right:0px;
    background-color:#EBFFDF;
    border:4px 0 0 4px solid rgba(235,255,223,0.4);
    border-radius: 10px 0 0 0;
    height: 15px;
    padding:2px 7px 0 9px;
}

.prod .d1 .info .talle span{
font-size: 0.7em;

}



.prod .d1 .info.med {
    text-align: left;
    font-size:18px;
    font-weight: bold;
    color:#45932F;
    padding: 8px;
    position: relative;
   
}
.prod .d1 .info.med .txt{
   font-size: 0.8em;
}





.prod .d2{
display: block;
position: absolute;
width: 100%;
height: 100%;
box-shadow: inset 0 0 10px rgba(200,230,200,1);
z-index: 1;
border-radius:9px;
}


.prod .d2 .zoq{
display: block;
position: absolute;
width: 20%;
height: 20%;
box-shadow: inset 0 0 10px rgba(200,230,200,1);
z-index: 1;
border-radius:9px;
}


.prod .d3{border:1px solid #88EE88;
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    background-color: #EBFFDF;
}

.prod .d3 img{width: 100%}



.prod.acc{
    width: 50%;
}


.esp1{width:1px; height:110px;}

.nadaquever{
    font-size: 1.4em;
     font-style: italic;
    background-image: url('../images/cartelito.jpg');
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 300px;
    padding-top: 380px;
}

.buhito{
    margin:auto;
    width: 250px;
}

.cartel{
    margin:auto;
    
}

.solCat{
display: inline-block;
margin:auto;
background-color: rgba(50,50,50,0.05);
background-image: url('../images/wsp.png');
background-size: 28px;
background-position: 14px 14px;
background-repeat: no-repeat;
padding: 20px 20px 20px 48px;
font-style: italic;
font-size:1em;
border-radius: 15px;
text-decoration: none;
color:#45932F;
border: 1px solid rgba(50,50,50,0.2);;
}
.solCat:focus{
background-color: rgba(50,50,50,0.1);
}

.solCat:hover{
background-color: rgba(50,50,50,0.2);
}



.tired{
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    background-color: #E0F9D0;
    display: inline-block;
    padding: 9px;
    font-size: 1.6em;
    font-family: 'Akaya Telivigala';
    color: #127CDB;
    /*background: linear-gradient(#16E610,#0BBEEE);
   -webkit-background-clip: text;
     color: transparent;
*/
}

.tifbi{
    /*border-radius:9px;*/
   /* margin:5px;*/
    overflow:hidden;
    position: relative;
    /*background-color: #E0F9D0;*/
    display: inline-block;
    /*padding: 9px;*/
    font-size: 1.68em;
    font-family: 'Akaya Telivigala';
    color: #127CDB;
}

.tifbi:visited{
    color: #16A3F3;

}


.tit{
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    /*background-color: #EBFFDF;*/
    display: inline-block;
    padding: 9px;
    font-size: 2.2em;
    font-family: 'Akaya Telivigala', cursive;
    color: #16E610;
    /*background: linear-gradient(#16E610,#0BBEEE);
   -webkit-background-clip: text;
     color: transparent;
*/
}


.tit b,.tde b{
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url('../images_pr/IMG/EstrellaVerde.svg');
    /*background-image: url('https://fonts.gstatic.com/s/i/materialiconsoutlined/grade/v11/24px.svg');*/
    background-size: 25px 25px;
    margin: 0px 5px 0px 5px;
}






.tde{
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    background-color: #EBFFDF;
    color:#00B285;
    /*color: #00D96D;  #008C00;*/
    display: inline-block;
    padding: 9px;
    font-size: 1.4em;
    font-family: 'Akaya Telivigala';

}

.tde b{
 
    background-image: url('../images_pr/IMG/EstrellasVerde3.svg');
    margin: 0px 7px 0px 0px;
}

.tde:visited{
    color: #97CABB;

}



.tit b,.tde4 b{
    display: inline-block;
    width: 24px;
    height: 24px;
    background-size: 25px 25px;
    margin: 0px 5px 0px 5px;
}






.tde4{
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    background-color: #EBFFDF;
    color:#00B285;
    /*color: #00D96D;  #008C00;*/
    display: inline-block;
    padding: 9px;
    font-size: 1.4em;
    font-family: 'Akaya Telivigala';

}

.tde4 b{
    margin: 0px 7px 0px 0px;
}

.tde4:visited{
    color: #97CABB;

}



.reds img{width: 80%}

.reds{
    margin:auto;
    width: 45px;
    /*width: 170px;*/
    display: inline-block;
    text-align: left;
}


.desta img{width: 100%}





.desta{
    margin:auto;
    width: 350px;
    display: inline-block;
}



.desta4 img{width: 100%}



.desta4{
    margin:auto;
    width: 350px;
    display: inline-block;
}





.tit b,.cabeza b{
    display: inline-block;
    width: 24px;
    height: 24px;
    
}







.cabeza{
    border-radius:9px;
    margin:5px;
    overflow:hidden;
    position: relative;
    /*background-color: #EBFFDF;*/
    
    background-color: #d2f7bb;
    color:#2c826c;
    /*color: #00B285; #00D96D;  #008C00;*/
    display: inline-block;
    padding: 9px;
    font-size: 1.05em;
    font-family: 'Stint Ultra Condensed', cursive;
    font-family: 'Akaya Telivigala';
    /*font-family: 'Akaya Telivigala';*/
   
    width: 50%;
    min-width: 320px;
    max-width: 430px;


}



/*agragado el 1/08/21 para el menu desplegable ___________________________________*/

    .menu .btnMenu{

     position: fixed; z-index: 2;
     width: 53px; 
     height: 48px;
     padding: 7px 0 0 2px;
     background-color:#EeffDA88;
     left: 15px;
     top: 13px;
     border: 1px solid #33000022;
     border-radius: 25%;
     box-shadow: inset 3px 3px 3px rgb(255 255 255 / 30%), inset -2px -2px 3px rgb(0 0 0 / 13%), 2px 2px 10px rgb(0 0 0 / 7%);
   text-shadow: 1px 1px 1px rgb(255 255 255 / 90%);

  }
        

        .menu .btnMenu c,.menu .btnMenu d,.menu .btnMenu e{
            display: block;
            width: 35px;
            height: 4px;
            background-color: #13270688;
            position: absolute;
            border-radius: 2.5px;
            left: 9px;
        }

        .menu .btnMenu c{
            top: 14px;
            
        }
   .menu.open .btnMenu c{
            transform: rotate(45deg);
    top: 24.5px
   }
    .menu .btnMenu d{
        top: 25px;
    }
    .menu.open .btnMenu d{
        opacity: 0;
    }

        .menu .btnMenu e{
            top: 36px;          
        }
.menu.open .btnMenu e{
    transform: rotate(-45deg);
      top: 24.5px;

}


        .menu .logo{
            left: 89.6px!important;
            z-index: 2!important;

        }
  .menu .buho{
            left: 206.3px!important;
            z-index: 2!important;
        }
        .menu .mari{
            left: 171.6px!important;
            z-index: 2!important;
        }
        .menu .mrp{
            left: 241px!important;
            z-index: 1!important;
        }
        .menu .panelMenu{
            position: fixed;
            width: 75%;
            max-width: 300px;
            height: 420px;
            z-index: 1;
            background-color: #EeffDAF5;
            border: solid #00220055;
            border-width: 0 1.5px 0 0;
            box-shadow: 2px 2px 15px rgb(0 0 0 / 29%);
            overflow-x: hidden;
            color: #1E402C;
            display: none;
        }
    .menu.open .panelMenu{
        display: block;
        font-family: 'Andada Pro', serif;
        font-size: 14px;
    }

        .menu .panelMenu .d1{
            text-align: left;           
            overflow-y: scroll;
            position: absolute;
            top: 95px;
            left: 8px;
            width: calc(100% - 20px);
            padding-right: 33px;
        }
   .menu .panelMenu .d1 .gr{
    border: 1px solid #00000022;
    border-radius: 15px;
    margin: 4px 0;
    padding: 10px;
   }
        .menu .panelMenu .d1 h1{
            font-weight: normal;
            margin: 0;
            padding: 0 0 7px 0;
        }

        .menu .panelMenu .d1 a{
        font-family: 'Andada Pro', serif;
            display: block;
            color: #1E402C;
            font-size: 19px;
            padding: 5px;
            text-decoration: none;
        }
        .menu .panelMenu .d1 a span{
            font-size: 0.7em;
            opacity: 0.8;
        }


        /* fin de lo agragado el 1/08/21 para el menu desplegable ___________________________________*/