*{box-sizing:border-box;font-family:Helvetica Neue,Arial,sans-serif}aside{border-top:1px solid gray;padding-top:20px}dl{grid-gap:2px 15px;grid-template-columns:2fr 1fr;max-width:300px;display:grid}dt{text-align:right}dd{margin:0}#app{grid-gap:10px 20px;outline:3px dashed #ff4500;min-width:500px;margin:20px auto;padding:15px;display:grid}@media only screen and (max-width:999px){#app{grid-template-columns:4fr 3fr;grid-template-areas:"store basket""image name""image options""image buy""reco reco"}}@media only screen and (min-width:1000px){#app{grid-template-columns:4fr 3fr 200px;grid-template-areas:"store basket reco""image name reco""image options reco""image buy reco";width:1000px}}#store{grid-area:store;margin-top:5px;font-weight:400}#basket{grid-area:basket;align-self:baseline;justify-self:end;margin-top:11px}#basket .empty,#basket .filled{color:#fff;border-radius:5px;padding:5px 10px}#basket .empty{background-color:gray}#basket .filled{background-color:#2e8b57}#image{grid-area:image;width:100%}#image>div{padding-top:100%;position:relative}#image img{max-width:100%;position:absolute;top:0;bottom:0;left:0;right:0}#name{grid-area:name;height:3em;font-weight:400}#name small{font-size:1em;font-weight:200}#options{grid-area:options;align-self:center;display:flex}#options button{cursor:pointer;border:none;border-bottom:2px solid #fff;outline:none;margin:2px;padding:0;display:block}#options button.active,#options button:hover{border-bottom-color:#2e8b57}#options img{max-width:100%;display:block}#buy{grid-area:buy;align-self:center}#buy button{cursor:pointer;background:0 0;border:1px solid gray;border-radius:20px;outline:none;width:100%;padding:20px;font-size:20px;display:block}#buy button:hover{border-color:#000}#buy button:active{border-color:#2e8b57}#reco{grid-area:reco}@media only screen and (max-width:999px){#reco{flex-wrap:wrap;justify-content:space-around;align-items:center;margin-top:20px;padding-top:20px;display:flex}}@media only screen and (min-width:1000px){#reco{text-align:center;justify-content:stretch;width:100%}}#reco h3{font-weight:400}#reco img{width:180px;height:180px;display:inline-block}green-recos,#reco{outline:3px dashed #228b22;width:100%;display:block}blue-basket,#basket,blue-buy,#buy{outline:3px dashed #4169e1;padding:5px;display:block}