article .cesta{padding:0;}
article .cesta h4{margin-top:0;}
article .cesta .peso{padding:.3rem;line-height: 1rem;}
div.categorias{display:-ms-grid;display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,auto));justify-content:center;}
div.espacios{display:-ms-grid;display:grid;-ms-grid-columns:300px 2% auto;grid-template-columns:300px auto;grid-gap:2%;margin:1rem auto;}
div.linear img{max-width:30px;}
div.productos{display:-ms-grid;display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:3px;min-height:80vh;overflow:auto;scrollbar-color:#e8e9f7 #397b1d;align-content:first baseline;}
div.producto {border:1px solid;border-radius:4px;cursor:pointer;font-size:.8rem;text-align:center;}
div.producto img{max-width:50px; max-height:50px;}
div.producto figcaption{max-width:100px;margin:auto;}
div.producto h3{font-size: 1rem;padding: 0;}
div.header.trops .peso{color:red;}
div.header.trops .peso::before{content:"Peso sobrepasado";font-size:.7rem;margin-right:.7rem;}
div.header .peso::after{content:"Kgs.";}
.cestas p.describe{position:relative;}
article .cestas.abierta{margin:auto}
.aZero{background-color:rgb(78,200,124);cursor:pointer;padding: .2rem;width: 80%;margin: .3rem auto 0.3rem;}
/*.cestas p.descripcion{-webkit-animation:cambio 3s ease-in-out;animation:cambio 3s ease-in-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;position:relative;}*/
.cestas p.descripcion{position:relative;}
.cesta p.descripcion .despliega{-webkit-animation:aparece 2s ease-in-out;animation:aparece 2s ease-in-out;-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;opacity:0;cursor:pointer;width: 10px;border-bottom:3px solid black;height:10px;position:absolute;border-right:3px solid;right:5px;top:0;transform:rotate(40deg);content: " ";}
.cesta p.describe .desplegado{cursor:pointer;width: 10px;border-bottom:3px solid black;height:10px;position:absolute;border-right:3px solid;right:5px;top:0;transform:rotate(226deg);content: " ";}
.latente {background-color:rgba(100,100,100,.1);opacity:.6;transition: all .4s ease-in-out;color:grey;}
.activo {background-color:rgb(78,200,124);opacity:1;}
.cantidad::after {content:" Kgs.";}		
.cestas{margin:0;}
.detalle .prod{display:-ms-grid;display:grid;-ms-grid-rows:auto;grid-template-rows:auto;-ms-grid-columns:30px auto 30px;grid-template-columns:30px auto 30px;grid-template-areas:"imagen nombre nada" "mas peso menos";grid-row-gap:.3rem;border-bottom:1px solid rgba(0,0,0,.1);text-align:center;margin-bottom:.3rem;}
.detalle .prod img{max-width: 30px;}
span.mas{-ms-grid-row:3;-ms-grid-column:1;grid-area:mas;}
span.menos{-ms-grid-row:3;-ms-grid-column:3;grid-area:menos;}
span.nada{-ms-grid-row:1;-ms-grid-column:3;grid-area:nada;}
.prod img{-ms-grid-row:1;-ms-grid-column:1;grid-area:imagen;}
span.nomProd{-ms-grid-row:1;-ms-grid-column:2;font-style:oblique;font-weight:bold;grid-area:nombre;}
span.cantidad{-ms-grid-row:3;-ms-grid-column:2;grid-area:peso;}
span.bck{border-radius: 0;}
@-webkit-keyframes cambio{from{height: auto;}to{height:20px;overflow:hidden;-webkit-overflow:hidden;}}
@keyframes cambio{from{height: auto;}to{height:20px;overflow:hidden;-webkit-overflow:hidden;}}
@-webkit-keyframes aparece{from{opacity:0;}to{opacity:1;}}
@keyframes aparece{from{opacity:0;}to{opacity:1;}}

@media all and (max-width:40em){
	div.productos{height:auto;align-content:baseline;margin-bottom:2rem;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));}
	div.espacios{display:flex;flex-flow:column;flex-direction:column-reverse;margin:2rem auto;}
	.cestas{display:block;margin:0;}
	.detalle .prod{-ms-grid-columns:50px auto 50px;grid-template-columns:50px auto 50px;}
}