﻿/* this declares a better box model */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.list-wrap label {
  float:left;
  color:#ffffff;
  font-size:1.5em;
}
.search-box {
  float:left;
  clear:left;
  width:70%;
  padding:0.4em;
  font-size:1em;
  color:#555;
}

.list-count {
  float:left;
  text-align:center;
  width:30%;
  padding:0.5em;
  color:#ddd;
}

ul.search li {
  transition-property: margin, background-color, border-color;
  transition-duration: .4s, .2s, .2s;
  transition-timing-function: ease-in-out, ease, ease;
}

.empty-item {
  transition-property: opacity;
  transition-duration: 0s;
  transition-delay: 0s;
  transition-timing-function: ease;
}

.empty .empty-item {
  transition-property: opacity;
  transition-duration: .2s;
  transition-delay: .3s;
  transition-timing-function: ease;
}

.hiding {
  margin-left:-100%;
  opacity:0.5;
}

.hidden {
  display:none;
}

ul.search {
  float:left;
  width:100%;
  margin:2em 0;
  padding:0;
  position:relative;
}

ul.search:before {
  /*content:'desserts';*/
  position:absolute;
  left:-2.8em;
  font-size:3em;
  text-align:right;
  top:1.5em;
  color:#ededed;
  font-weight:bold;
  font-family: 'Maven Pro', sans-serif;
  transform:rotate(-90deg);
}

ul.search li {
  float:left;
  clear:left;
  width:100%;
  margin:0.1em 0;
  padding:0.5em 0.8em;
  list-style:none;
  background-color:#f4f4f4;
  border-left:5px solid #5fa841;
  cursor:default;
  color:#333;
  position:relative;
  z-index:2;
}

ul.search li:hover {
  background-color:#ffffff;
  border-color:#a9132a;
  color:#000000;
}

.empty-item {
  background:#fff;
  color:#000;
  margin:0.2em 0;
  padding:0.5em 0.8em;
  font-style:italic;
  border:none;
  text-align:center;
  visibility:hidden;
  opacity:0;
  float:left;
  clear:left;
  width:100%;
}

.empty .empty-item {
  opacity:1;
  visibility:visible;
}