ul{
  list-style: none;
  padding-left: 0em;
  margin: 0em;
}

*{
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
}

.button-3{
  text-align: center;
}

.button-3 li{
  display: inline-block;
  width: 200px;
  max-width: 200px;
  height:2em;
  padding-top:1em;
  padding-bottom:2em;
  margin-bottom:1%;
}

.button-tt{
  text-align: center;
}
.button-tt li{
  display: inline-block;
  width: 32%;
  max-width: 32%;
  height:2em;
  padding-top:1em;
  padding-bottom:2em;
  margin-bottom:1%;
}
.button-hook{
  text-align: center;
}
.button-hook li{
  display: inline-block;
  width: 100%;
  max-width: 100%;
  height:3.5em;
  padding-top:1em;
  padding-bottom:2em;
  margin-bottom:1%;
  vertical-align: middle;
}
.button-4{
  text-align: center;
}
.button-4 li{
  display: inline-block;
  width: 250px;
  max-width: 250px;
  height:2em;
  padding-top:1em;
  padding-bottom:2em;
  margin-bottom:1%;
}
.last{
  clear: left;
}
.first{
  clear: right;
}
#numberDisplay input{
  height: 3em;
  text-align: center;
  background: #f5f5f5;
  padding: .5em 0em;
  margin-top: 1em;
  margin-bottom: 1%;
  font-size: 20px;
  font-family: "Roboto";
  font-weight: 100;
  width: 100%;
  border: 1px;
}

#actions .call.ready{
  background: rgba(0, 255, 0, 0.2);
}
#actions .call.ready:hover{
  background: rgba(0, 255, 0, 0.4);
}
#actions .skip.ready{
  background: rgba(0, 255, 0, 0.2);
}
#actions .skip.ready:hover{
  background: rgba(0, 255, 0, 0.4);
}
#actions .clear.ready{
  background: rgba(255, 0, 0, 0.2);
}
#actions .clear.ready:hover{
  background: rgba(255, 0, 0, 0.4);
}
#actions .deactive{
  opacity: .2;
}

#dialpad,
#actions,
#numberDisplay{
  max-width: 610px;
  margin: 0 auto;
}
#dialpad.deactive{
  opacity: .2;
}
#dialpad.deactive li:hover,
#actions li.deactive:hover{
  background: #eee;
}
#dialpad li{
  font-weight: bold;
  background: #eee;
  width: 100%;
}
#dialpad li:hover{
  background: #ccc;
}
#actions li{
  background: #efefef;
  opacity: .8;
}
#actions li.call.active{
  background: rgba(0, 255, 0, 0.2);
}
#actions li.hangup{
  background: rgba(255, 125, 0, 0.2);
}
#actions li.hangup:hover{
  background: rgba(255, 125, 0, 0.4);
}
#actions li:hover{
  background: #ccc;
}