html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td {margin: 0; padding: 0;}

a{color:#63b5d9; text-decoration:none;}
a:link{text-decoration:none;outline:none;}
a:visited{color:#4c8cab;text-decoration:none;outline:none;}
a:hover{text-decoration:underline;}

html {overflow: -moz-scrollbars-vertical;}

html, body{
	background:#ededed;
	color:#000;
	font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
	font-size:13px;
	font-weight:300;
	line-height:20px;
}

h1, h2, h3, h4{ 
	color:#6e6e6e;	
	font-family: Helvetica, Arial, sans-serif;
}
h1{font-size:42px; font-weight:300; line-height:42px; margin-left:0px; margin-top:3px; margin-bottom:3px;}
h2{font-size:24px; font-weight:300; line-height:30px; margin-left:0px; margin-top:3px; margin-bottom:3px;}
h3{font-size:16px; font-weight:normal; line-height:22px; margin: 4px 0 -4px;}
h4{font-size:16px; font-weight:300; line-height:22px; margin: 3px 0 19px;}

img{border:none;}
img.left{margin:0 10px 10px 0;}
img.right{margin:0 0 10px 10px;}
	
p{margin: 0px 0 15px;}

.right{float:right;}
.left{float:left;}
.clear{clear:both;}
.alignleft{text-align: left;}
.alignright{text-align: right;}
.aligncenter{text-align: center;}

hr{
	background:#e4e4e4;
	border:0;
	height:2px;
	margin: 20px 0 -2px;
}

table{
	border-collapse: collapse;
	margin-bottom:22px;
}

ul{
	list-style:none;
	margin-bottom:22px;
}
ul.nostyle li{
	background:none transparent;
	padding: 4px 0 18px;
}

input[type="text"]{
	width:224px
}
input[type="password"]{
	width:224px
}
#header-container{
	height:180px;
	width:100%;
}
#header-container-1{
	height:115px;
	width:100%;
}
#header{
	margin:0 auto;
	padding-top: 12px;
	position:relative;
	text-align: center;
	/*width:836px;*/
}
#header img {
	margin-top: -5px;
}

#content{
	margin:0 auto;
	padding: 0;
	position:relative;
	/*width:836px;*/
	margin-top:4px;
	margin-bottom:14px;
}

#main {
	text-align: center;
}
#box1, #box2 {
	text-align: left;
	margin: 22px auto
}
#box2 {
	margin-top: 44px;
}
#pills1 {
	position: absolute;
	top: -10px;
	left: 130px;
}
#pills2 {
	position: absolute;
	top: -10px;
	left: 80px;
}
#settings-pills1 {
	position: absolute;
	top: -10px;
	left: 160px;
}
.push {
	background: rgb(255,255,255); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2YxZjFmMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2UxZTFlMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNmY2ZjYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(241,241,241,1) 50%, rgba(225,225,225,1) 51%, rgba(246,246,246,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(241,241,241,1)), color-stop(51%,rgba(225,225,225,1)), color-stop(100%,rgba(246,246,246,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-8 */
	font-size: 13px;
	line-height: 1.5;
}
:checked + .push {
	background: #989898;
}

.padded-div {
	padding:0 0 14px 0;
}

.depressed-box {
	background: #e6e6e6;
	-webkit-border-radius: 5px;    
    border-radius: 5px;
	-webkit-box-shadow: inset 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
    box-shadow: inset 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
	margin: 0 auto 44px;
	padding: 35px 15px 15px;
	position: relative;
	width: 416px;
}

.depressed-box img {
	vertical-align: bottom;
}
.dash-select {
	width: 160px;
}
#activity-table {
	width: 420px;
	table-layout: fixed;
	word-wrap: break-word;
}
#activity-table td {
	padding: 2px 0 0 2px;
	border: 1px solid #b8b8b8;
}

#files-table {
	margin: -1px 0px 0px 0px;
}
#files-table td {
	padding: 2px;
	border: 1px solid #888888;
}
#cameras-table td {
	padding: 0 10px 0 0;
}
#cameras-table td label {
	padding: 2px 0 0;
}
#settings-camera-table {
	width: 100%;
}
#general-table {
	margin: 4px;
}
#general-table td {
	padding: 3px;
}
#general-table-vp td { /*table with some vertical padding between cells */
	padding: 2px 0px 2px 0px;
}
#camera-image-table {
	margin: 0;
	padding: 0;
}
#camera-image-table tr {
	margin: 0;
	padding: 0;
}
#camera-image-table td {
	margin: 0;
	padding: 0;
	vertical-align: middle;
	text-align: center;
	background: #000000;
	border: 1px solid #ededed;
}
#pdbutton {
	vertical-align:middle;
	margin: 0px 2px 0px 1px;
}
#settings-camera-table td {
	border-bottom: 1px solid #b8b8b8;
	padding: 20px 0;
	width: 100%;
}
#settings-camera-table td td {
	border: 0;
	padding: 2px 0px;	
	width: 50%;
}
#settings-camera-table table {
	margin: 0;
	width: 100%;
}
#settings-camera-table input[type="text"] {
	width: 182px;
}
#settings-camera-table input[type="password"] {
	width: 182px;
}
input[type="text"].small-input {
	width: 45px;
}
#status-title {
	margin-bottom: 0px;
}
.belowSelectButton {
	font-size: 0.9em;
	width: 50px;
	height: 18px;
	margin: 0 1px 0 0;
	padding: 0;
}
.selectTitle {
	color: black;
	border-bottom: 1px solid gray;
}
.fs-overlay {
	position:fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	display:none;
}
.fs-box {
	width: 500px;
	height: auto;
	margin: 0;
	padding: 12px;
	border: 1px solid gray;
	background: #e6e6e6;
    position: absolute;
	left: 50%;
    top: 50%;
	transform: translate(-50%,-50%);
    -ms-transform: translateY(-50%,-50%);
	border-radius: 8px;
	box-shadow: 0 0 10px 0 #999;
}
.fs-box-table td {
	padding: 3px;
}
.meter { 
	background: #fff;
	height: 15px;  /* Can be anything */
	width: 390px;
}
.meter > span {
	background: #b2d2e1;
	display: block;
	height: 100%;
	overflow: hidden;
	position: relative;
}

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 18px;
  /*border-radius: 20px;*/
  /*background-color: #ccc;*/
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .2s;
  transition: .2s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 12px;
  width: 12px;
  left: 4px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .slider {
  background-color: #777;
}

input:checked + .slider:before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 20px;
}

.slider.round:before {
  border-radius: 50%;
}