/****** login and error page ******/

.form-login {
  width: 350px;
  border: 1px solid #a6a6a6;
  border-radius: 10px;
  background-color: #ffffff;
  margin: 0 auto;
  padding: 30px; 
}

.jumbotron {
  text-align: center;
  color: #999;
}

.jumbotron h1 {
  color: #5BC0DE;
  letter-spacing: -5px;
}

/****** main css ******/

body {
    padding-bottom: 20px;
}

#streamTable, .table td {
  text-align: center;
}

#cameraResolutionTbl td, #cameraSetupTbl td, #recordStatusTbl td{
  padding: 10px;
}

dt, dd {
  padding: 8px;
}

th {
  text-align: center;
}

.form-upgrade {
  width: 500px;
  border: 1px solid #a6a6a6;
  border-radius: 10px;
  background-color: #ffffff;
  margin: 0 auto;
  padding: 30px; }
  

.alert-set {
  width: 400px;
  margin: 40px auto;
}

.brand-set {
  font-size: 1.8em;
  font-weight: bold;
  color: #5BC0DE !important;
  letter-spacing: -2px;
  padding-left: 120px;
}

#tabs li.ui-tabs-active {
  color: #555555;
  text-decoration: none;
  background-color: #e5e5e5;
  -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
  -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
}

#loadingBar, #ocxLoadingCircle, #settings, #firmwareupgrade, #language,
#rebootCheck {
  display: none;
}

#settings-nav {
  border-right:2px solid #eeeeee;
  border-bottom: 0px;
}

#cameraColorContent,
#msg_cameraColor,
#cameraSetupContent,
#msg_cameraSetup,
#cameraResolutionContent,
#msg_cameraResolution {
  display: none;
}

/****** camera setup ******/
div > .glyphicon,
.js-camera-reboot > .js-camera-name { 
  display: none
}

div > .js-camera-name,
.js-camera-reboot > .glyphicon {
  display: block;
}

/****** record schedule table ******/

.rec_continous { background: green; }
.rec_motion    { background: red; }
.rec_no_record { background: #e6e6e6; }

#recordTbl, #hours { 
  margin: 0;
  padding: 0;
  width:630px; 
}

#recordTbl li, #hours li { 
  list-style-type: none;
  margin: 3px; 
  padding: 0px; 
  float: left; 
  width: 20px; 
  height: 20px; 
  text-align: center; 
}

#day {
  margin: 0;
  padding: 0
}

#day li {
  list-style-type: none;
  margin: 3px; 
  padding: 0px; 
  height: 23px;
  text-align: center;
}

.camera-list li {
  margin: 0px; 
  padding: 8px 8px 8px 5px; 
  border-left: 5px solid #fff;
  list-style-type: none;
}

.camera-list li.active ,
.camera-list li.active:hover { 
  border-left: 5px solid #eee;
  background-color: #428bca; 
}
.camera-list li:hover { 
  border-left: 5px solid #428bca;
  background-color: #eee; 
}
.camera-list li a { display: block; }
.camera-list li a:hover { text-decoration: none; }
.camera-list li.active a { 
  text-decoration: none;
  color: #ffffff; 
}

#recordTypeApplyAll {
  border: 1px solid #d3d3d3;
  padding: 6px;
  color: #333;
}

/****** camera motion ******/

#motion-tbl { 
  margin: 0 0 10px 0;
  padding: 0;
  list-style-type: none;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
  -ms-behavior: url(../js/backgroundsize.min.htc);
}

#motion-tbl li { 
  float: left;
  margin: 0;
  padding: 0;
  list-style-type: none;
  border-width: 1px;
  border-color: #e6e6e6;
  border-style: solid;
  background: transparent;
}

#motion-tbl li.ui-selected,
#motion-tbl li.ui-selecting {
  background-color: rgb(0, 255, 0);
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  opacity: 0.3;
}

.motion-tbl-defult { width: 528px; height: 396px; }
.motion-tbl-XM     { width: 528px; height: 360px; }

.motion-cell-default { width: 33px; height: 33px; }
.motion-cell-DTV     { width: 132px; height: 132px; }
.motion-cell-XM      { width: 24px; height: 24px; }