ul {
  list-style: none;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
td {
  font-size: 1em;
}
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
body,
html,
p,
blockquote,
fieldset,
input,
label,
div,
dd,
dt,
dl,
table,
tr,
td,
img,
hr {
  margin: 0px;
  padding: 0px;
}
a img,
:link img,
:visited img,
fieldset {
  border: none;
}
@font-face {
  font-family: 'DistrictThinRegular';
  src: url('/css/fonts/distth___-webfont.eot');
  src: url('/css/fonts/distth___-webfont.eot?#iefix') format('embedded-opentype'), url('/css/fonts/distth___-webfont.woff') format('woff'), url('/css/fonts/distth___-webfont.ttf') format('truetype'), url('/css/fonts/distth___-webfont.svg#DistrictThinRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'DroidSansRegular';
  src: url('/css/fonts/droidsans-webfont.eot');
  src: url('/css/fonts/droidsans-webfont.eot?#iefix') format('embedded-opentype'), url('/css/fonts/droidsans-webfont.woff') format('woff'), url('/css/fonts/droidsans-webfont.ttf') format('truetype'), url('/css/fonts/droidsans-webfont.svg#DroidSansRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
html,
body {
  background: #02255c;
  font-family: 'DroidSansRegular';
  font-size: 0;
  font-weight: 400;
  height: 100%;
}
html.admin,
body.admin {
  background: #fff;
  font-size: 16px;
  padding: 50px;
}
html.admin table,
html.admin tr,
html.admin td,
body.admin table,
body.admin tr,
body.admin td {
  background: #fff;
}
html.admin form div,
body.admin form div {
  padding-bottom: 10px;
}
html.admin form div span,
body.admin form div span {
  display: inline-block;
}
html.admin form div span:first-child,
body.admin form div span:first-child {
  padding-right: 10px;
  text-align: right;
  width: 150px;
}
html.admin form input[type=text],
body.admin form input[type=text] {
  padding: 3px 5px;
  width: 300px;
}
section#webphone {
  height: 100%;
  position: relative;
  overflow: hidden;
}
section#webphone div.enable-notifications {
  color: #fff;
  cursor: pointer;
  display: none;
  padding: 10px;
  text-decoration: underline;
}
section#webphone select[name=peer] {
  display: none;
}
section#webphone input[type=button],
section#webphone button {
  border: 0;
  color: #000;
  height: 40px;
}
section#webphone input[type=button].call-button,
section#webphone input[type=button].dtmf,
section#webphone input[type=button].control,
section#webphone input[type=button].mpk,
section#webphone button.call-button,
section#webphone button.dtmf,
section#webphone button.control,
section#webphone button.mpk {
  margin: 5px;
}
section#webphone input[type=button].call-button,
section#webphone button.call-button {
  background: #070;
  border: 0;
  padding: 0 10px;
}
section#webphone input[type=button].call-button.active,
section#webphone button.call-button.active {
  background: #0a0;
  border: 0;
}
section#webphone input[type=button].control,
section#webphone button.control {
  background: #eea;
  border: 0;
  width: 90px;
}
section#webphone input[type=button].control:disabled,
section#webphone button.control:disabled {
  background: #eee;
  border: 0;
  color: #888;
}
section#webphone input[type=button].dtmf,
section#webphone button.dtmf {
  background: #ee5;
  vertical-align: top;
  width: 60px;
}
section#webphone input[type=button].dtmf span.letters,
section#webphone button.dtmf span.letters {
  display: block;
  font-size: 10px;
}
section#webphone input[type=button].mpk,
section#webphone button.mpk {
  background: #ee5;
  height: 30px;
  width: 140px;
}
section#webphone input[type=text] {
  background: #fff;
  border: 0;
  color: #000;
  margin: 5px;
  padding: 5px;
  width: 190px;
}
section#webphone div.display,
section#webphone div.timer,
section#webphone div.call-history,
section#webphone div.callout {
  display: inline-block;
}
section#webphone div.call-history {
  position: relative;
}
section#webphone div.call-history span.missed-calls {
  background: #f00;
  border-radius: 10px;
  color: #fff;
  display: none;
  font-size: 14px;
  font-weight: bold;
  height: 20px;
  line-height: 20px;
  position: absolute;
  right: -5px;
  text-align: center;
  top: -5px;
  width: 20px;
}
section#webphone div.callout {
  width: 100px;
}
section#webphone div.callout select {
  width: 100%;
}
section#webphone div.timer {
  color: #fff;
  width: 50px;
}
section#webphone div.call-list,
section#webphone div.dtmf,
section#webphone div.controls,
section#webphone div.mpk {
  display: inline-block;
  vertical-align: top;
}
section#webphone div.call-list {
  height: 50px;
  width: 400px;
}
section#webphone div.dtmf {
  width: 220px;
}
section#webphone div.controls {
  width: 210px;
}
section#webphone div.controls span {
  position: relative;
}
section#webphone div.controls span ul {
  background: #fff;
  bottom: 0;
  cursor: pointer;
  position: absolute;
  width: 150px;
}
section#webphone div.controls span ul li {
  color: #000;
  line-height: 30px;
  margin: 0 20px;
}
section#webphone div.mpk {
  width: 150px;
}
section#webphone div.voicemail {
  right: 60px;
  position: absolute;
  top: 20px;
}
section#webphone div.voicemail span.icon {
  display: inline-block;
}
section#webphone div.voicemail span.count {
  background: #f00;
  border-radius: 10px;
  color: #fff;
  padding: 2px 5px 2px 5px;
  position: absolute;
  right: -10px;
  text-align: center;
  top: -10px;
}
section#webphone div.blacklist {
  right: 10px;
  position: absolute;
  top: 20px;
}
section#webphone div.voicemail button,
section#webphone div.blacklist button {
  background: transparent;
  border: 0;
  font-size: 0;
  margin: 0;
  padding: 0;
}
section#webphone div.voicemail button:disabled,
section#webphone div.blacklist button:disabled {
  opacity: 0.5;
}
section#webphone div.notice {
  bottom: 50px;
  position: absolute;
  right: 0;
  width: 200px;
}
section#webphone div.notice ul li {
  background: rgba(255,255,255,0.8);
  color: #000;
  margin: 10px;
  padding: 10px 20px;
}
section#webphone div.status {
  bottom: 0;
  color: #fff;
  height: 30px;
  line-height: 30px;
  padding: 0 10px;
  position: absolute;
  width: 580px;
}
section#webphone div.status.error {
  background: #a00;
}
section#webphone div.status.alert {
  background: #aa0;
}
section#webphone div.status.good {
  background: #0a0;
}
h1 {
  color: #000;
  font-size: 20px;
}
table {
  border-collapse: collapse;
  color: #000;
  font-size: 14px;
  width: 100%;
}
table thead tr th {
  background: #5f5f5f;
  border: 1px solid #02255c;
  font-weight: bold;
  padding: 2px;
}
table tbody tr td {
  border: 1px solid #02255c;
  padding: 4px;
}
table tbody tr:nth-child(odd) {
  background: #3f3f3f;
}
table tbody tr:nth-child(even) {
  background: #1f1f1f;
}
.blocklist input[type=button],
.blocklist button {
  background: #eea;
  border: 0;
  color: #000;
  height: 40px;
  width: 90px;
}
div.popup {
  background: #02255c;
  border: 1px solid #777;
  box-shadow: 0 0 5px 0 #fff;
  display: none;
  font-size: 16px;
  left: 250px;
  padding: 10px;
  position: absolute;
  top: 100px;
  width: 300px;
  z-index: 2;
}
div.popup div.line {
  margin-bottom: 20px;
}
div.popup div.line span.label {
  color: #fff;
  display: inline-block;
  padding-right: 5px;
  text-align: right;
  width: 60px;
}
div.popup div.line span.value {
  display: inline-block;
}
div.popup input[type=text] {
  background: #fff;
  border: 0;
  color: #000;
  padding: 5px;
  width: 190px;
}
div.popup-grayout {
  background: rgba(0,0,0,0.5);
  bottom: 0;
  display: none;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}
#login {
  background: url('/images/bg-login.jpg') no-repeat 50% 0px;
  background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -webkit-background-size: 100% 100%;
}
section,
header {
  font-size: 13px;
}
section#login-form {
  color: #fff;
  padding-top: 200px;
}
section#login-form>div {
  background: rgba(0,0,0,0.3);
  margin: 0 auto;
  padding: 20px;
  width: 302px;
}
section#login-form span.error {
  color: #f00;
  display: block;
  font-weight: bold;
}
section#login-form img {
  padding-bottom: 10px;
}
section#login-form input {
  margin-bottom: 10px;
}
section#login-form .poweredby {
  color: #fff;
}
section#login-form input[type=email],
section#login-form input[type=password],
section#login-form input[type=text] {
  background: #fff;
  border: 1px solid #aaa;
  height: 25px;
  width: 300px;
}
section#login-form input[type=button],
section#login-form input[type=submit],
section#login-form a.button {
  background: #00a;
  border: 1px solid #07f;
  color: #fff;
  margin-left: 252px;
  padding: 2px 5px;
  text-decoration: none;
}
section#login-form div.input {
  padding-bottom: 10px;
}
section#login-form div.input span {
  display: inline-block;
}
section#login-form div.input span.label {
  font-weight: bold;
  padding-right: 5px;
  text-align: right;
  vertical-align: top;
  width: 150px;
}
