.button-wrap {
  margin-right: 25px;
}
.rad-button {
  white-space: nowrap;
  top: 0px;
  border-radius: 4px;
  position: relative;
  border: none;
  background: none;
  font-family: 'Roboto', sans-serif;
  width: 200px;
  height: 50px;
  cursor: pointer;
  transition: 0.1s all ease;
  font-size: 16px;
  font-weight: 300;
  color: #777;
  border-bottom: 1px solid #ccc;
  box-shadow: 0px 0px 0px 0px #B8B8B8;
}
.rad-button.flat {
  background: #f0f0f0;
}
.rad-button.small {
  width: 150px;
  height: 35px;
}
.rad-button.small:hover {
  top: -1px !important;
  height: 36px !important;
}
.rad-button.small:active {
  top: 0px !important;
  height: 35px !important;
}
.rad-button.xsmall {
  width: 100px;
  height: 25px;
  font-size: 10px;
}
.rad-button.xsmall:hover {
  border-bottom: 3px solid #ccc;
  top: 0px;
  height: 25px;
}
.rad-button.xsmall:active {
  height: 25px !important;
  border-bottom: 0px !important;
}
.rad-button.gradient {
  background: #f0f0f0;
  /* Old browsers */
  background: -moz-linear-gradient(top, #f0f0f0 0%, #e0e0e0 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f0f0f0), color-stop(100%, #e0e0e0));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f0f0f0 0%, #e0e0e0 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f0f0f0 0%, #e0e0e0 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f0f0f0 0%, #e0e0e0 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #f0f0f0 0%, #e0e0e0 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f0f0f0', endColorstr='#e0e0e0', GradientType=0);
  /* IE6-9 */
}
.rad-button.dark {
  border-bottom: 1px solid #5e5e5e;
  color: #f5f5f5;
}
.rad-button.dark.flat {
  background: #a1a1a1;
}
.rad-button.dark.gradient {
  background: #a1a1a1;
  /* Old browsers */
  background: -moz-linear-gradient(top, #a1a1a1 0%, #848484 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a1a1a1), color-stop(100%, #848484));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #a1a1a1 0%, #848484 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #a1a1a1 0%, #848484 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #a1a1a1 0%, #848484 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #a1a1a1 0%, #848484 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a1a1a1', endColorstr='#848484', GradientType=0);
  /* IE6-9 */
}
.rad-button.dark:hover {
  background-color: #ababab;
  top: -2px;
  border-bottom: 4px solid #727272;
  height: 52px;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.rad-button.dark:hover.xsmall {
  border-bottom: 3px solid #727272;
  top: 0px;
  height: 25px;
}
.rad-button.dark:active {
  top: 0px;
  height: 50px;
  border: 1px solid #727272;
  background-color: #8e8e8e;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.15);
}
.rad-button:focus {
  outline: 0;
}
.rad-button:hover {
  background-color: #f5f5f5;
  top: -2px;
  height: 52px;
  border-bottom: 4px solid #ccc;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
}
.rad-button:hover.static {
  top: 0px;
  height: 50px;
}
.rad-button:active {
  top: 0px;
  height: 50px;
  border: 1px solid #ccc;
  background-color: #ededed;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.15);
}
.rad-button.warning {
  background-color: #f3eac5;
  color: #bd8d32;
  border-bottom: 1px solid #bcb496;
}
.rad-button.warning:hover {
  background-color: #faf5df;
  top: -2px;
  border-bottom: 4px solid #bcb496;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.rad-button.warning:active {
  top: 0px;
  border: 1px solid #bcb496;
  background-color: #e6dcb5;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
}
.rad-button.danger {
  background-color: #e7a796;
  color: #7b5348;
  border-bottom: 1px solid #7b5348;
}
.rad-button.danger:hover {
  background-color: #f2beb1;
  top: -2px;
  border-bottom: 4px solid #7b5348;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.rad-button.danger:active {
  top: 0px;
  border: 1px solid #7b5348;
  background-color: #d69280;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
}
.rad-button.good {
  background-color: #b9e9ce;
  color: #759f87;
  border-bottom: 1px solid #759f87;
}
.rad-button.good:hover {
  background-color: #caf3db;
  top: -2px;
  border-bottom: 4px solid #759f87;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.rad-button.good:active {
  top: 0px;
  border: 1px solid #759f87;
  background-color: #a5dabc;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
}
.rad-button.wwt {
  background-color: #32699b;
  color: #DBE9F5;
  border-bottom: 1px solid #1A4164;
}
.rad-button.wwt:hover {
  background-color: #427BAE ;
  top: -2px;
  border-bottom: 4px solid #1A4164;
  box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.rad-button.wwt:active {
  top: 0px;
  border: 1px solid #1A4164;
  background-color: #255988;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
}