.b-content { width: 100%; }
.b-title { height: 55px; margin-bottom: 15px; }
.b-title .hrefs { top: 8px; bottom: auto; }

#menu .tweaker { position: absolute; top: 35px; font-size: 12px; -moz-user-select: none; -webkit-user-select: none; user-select: none; }

#menu #group-by { left: 0; }
#menu #sort-by { left: 235px; }
#menu #draw-by { left: 580px; }

#menu .tweaker .head,
#menu .tweaker .body,
#menu .tweaker .list,
#menu .tweaker .list .item { display: inline; display: inline-block; }

#menu .tweaker .head { color: #888; }

#menu .tweaker .list .item { cursor: pointer; padding: 1px 6px 2px; margin: 0 2px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#menu .tweaker .list .item.selected { cursor: default; }

#output .loading { margin: 25px 0; text-align: center; font-size: 20px; }
#output .group { margin: 0 0 25px; }
#output .group .head { font-size: 24px; margin: 0 0 15px 0; }
#output .group .list { overflow: hidden; zoom: 1; }
#output .group .list .item { float: left; position: relative; margin: 0 15px 15px 0; width: 100px; height: 140px; }
#output .group .list .item .ingredient { display: block; }
#output .group .list .item .ingredient,
#output .group .list .item .ingredient .image { display: block; width: 100px; height: 100px; }
#output .group .list .item.lazy .ingredient .image { color: #eee; background-color: #eee; -webkit-border-radius: 10px; -moz-border-radius: 10px;  border-radius: 10px; }
#output .group .list .item .ingredient .name { display: block; margin: 5px 0 0 0; text-align: center; font-size: 12px;}

.images#output .group .list .item { width: 100px; height: 100px; }
.images#output .group .list .item .ingredient .name { display: none; }
.images#output .group .list .item .ingredient { text-decoration: none; }
.images#output .group .list .item:hover .ingredient .name { display: block; position: absolute; z-index: 1; width: 100%; padding: 3px 0 5px; left: 0; bottom: 0; color: #000; background-color: #fff; background-color: rgba(255,255,255,0.8); text-shadow: #fff 1px 1px 1px, #fff 1px -1px 1px, #fff -1px 1px 1px, #fff -1px -1px 1px, #fff 0 0 5px, #fff 0 0 5px; }

.ingredient-window { position: relative; min-height: 200px; padding: 30px 0 10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; background-color: #fff; }
.ingredient-window .description { overflow: hidden; }
.ingredient-window .photo { float: left; position: relative; width: 290px; padding: 5px 10px 0 20px; text-align: center; }
.ingredient-window .about { margin: 0 45px 0 0; width: 320px; overflow: hidden; font-size: 12px; }
.ingredient-window .about .mark,
.ingredient-window .about .name { font-size: 20px; }
.ingredient-window .about .mark,
.ingredient-window .about .brand { display: none; }
.ingredient-window .about .name { margin-bottom: 10px; }
.ingredient-window.branded .about .mark,
.ingredient-window.branded .about .brand { display: block; }
.ingredient-window.branded .about .name { font-size: 12px; margin: 10px 0 0 0; }
.ingredient-window.branded .about .brand { margin: 0 0 10px 0; }
.ingredient-window .about .text { font-size: 12px; }
.ingredient-window .about .text p { margin: 0px 0px 15px 0px; }
.ingredient-window .about .all-cocktails { margin-top: 1em; font-size: 12px; }
.ingredient-window .about .where-to-buy { display: none; margin-top: 1em; font-size: 12px; }
.ingredient-window.can-buy .about .where-to-buy { display: block; }

.ingredient-window .cocktail-list { position: relative; margin-top: 30px; padding: 25px 20px 5px; border-top: 1px solid #ccc; }
.ingredient-window .cocktail-list .prev,
.ingredient-window .cocktail-list .next { top: 70px; -moz-user-select: none; -webkit-user-select: none; user-select: none; }
.ingredient-window .cocktail-list.single .prev,
.ingredient-window .cocktail-list.single .next { display: none; }
.ingredient-window .cocktail-list .prev { left: 15px; }
.ingredient-window .cocktail-list .next { right: 15px; }
.ingredient-window .cocktail-list .viewport { width: 625px; height: 117px; margin: 0 auto;  position: relative; overflow: hidden; }
.ingredient-window .cocktail-list .viewport .surface { width: 100000px; }
.ingredient-window .cocktail-list .point { float: left; width: 625px;  }

.cocktail-preview { width: 125px; float: left; text-align: center; font-size: 12px;  }
.cocktail-preview .image { display: block; margin: 0 auto 5px; width: 60px; height: 80px; }
.cocktail-preview.lazy .image { background-color: #f4f4f4; }

.popup { position: absolute; z-index: 100; }
.popup .popup-back { position: absolute; background-color: #000; opacity: 0.75; position: absolute; left: 0; top: 0; bottom: 0; right: 0; }
.popup,
.popup .popup-back { left: 0; top: 0; bottom: 0; right: 0; }

.popup .popup-front { position: absolute; width: 100%;  }
.popup .popup-controls,
.popup .popup-window { margin: 0 auto; position: relative; }
.popup .popup-controls { height: 10px; top: 80px; }
.popup .popup-window { top: 95px; }

.popup .popup-controls .cross,
.popup .popup-controls .text { color: #fff; text-decoration: none; }
.popup .popup-controls .text { border-bottom: 1px dashed; line-height: 12px; }
.popup .popup-controls .text:hover { border-bottom: none; }
.popup .popup-controls .cross { font-size: 18px; line-height: 20px; width: 25px; height: 25px; text-align: center; }
.popup .popup-controls .cross:hover { color: #ec118f; }

.wide-popup .popup-controls,
.wide-popup .popup-window { width: 958px; }
.wide-popup .popup-controls .cross { position: absolute; right: -6px; top: -1px; }
.wide-popup .popup-controls .text { position: absolute; left: 4px; top: 3px; }





.popup .popup-controls,
.popup .popup-window { width: 700px; margin: 0 auto; top: 40px; position: relative; }
.popup .popup-controls { height: 10px; }
.popup .popup-controls .cross { position: absolute; z-index: 100; right: -18px; top: -5px; }




.hidden { visibility: hidden; position: absolute; top: -20000px; }