/**
 * donationthermometer.css - Styles for displaying a donation thermometer.
 */

.donation-meter, .donation-results {
  margin-left: 30px;
  width: 100px;
  display: none;
}

.donation-meter .glass {
  background: #e5e5e5;
  border-radius: 50px 50px 0 0;
  display: block;
  height: 200px;
  margin: 0 35px 10px;
  padding: 5px;
  position: relative;
  width: 20px;
}

.donation-meter .amount {
  background: #f34e54;
  border-radius: 50px;
  display: block;
  width: 20px;
  position: absolute;
  bottom: 5px;
}

.donation-meter strong {
  display: block;
  text-align: center;
}

.donation-meter .title, .donation-results .title {
    font-size: 12px;
}

.donation-meter .goal, .donation-results .goal {
    font-size: 14px;
    margin-bottom: 6px;
}

.donation-meter .total {
  font-size: 10px;
  position: absolute;
  right: 32px;
}

.bulb {
  background: #e5e5e5;
  border-radius: 50px;
  display: block;
  height: 50px;
  margin: 0 35px 10px;
  padding: 5px;
  position: relative;
  top: -20px;
  right: 15px;
  width: 50px;
}

.bulb .red-circle {
  background: #f34e54;
  border-radius: 50px;
  display: block;
  height: 50px;
  width: 50px;
}

.bulb .filler {
  background: #f34e54;
  border-radius: 50px 50px 0 0;
  display: block;
  height: 30px;
  width: 20px;
  position: relative;
  top: -65px;
  right: -15px;
  z-index: 30;
}

.donation-results {
    display: none;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
}

.donation-results div {
    display: block;
}

.donation-results .title {
    font-size: 14px;
}

.donation-results .total, .donation-results .goal {
    font-size: 12px;
    margin-top: 2px;
}