html>body {
  font-family: Arial Rounded, Arial Unicode MS, Arial, Helvetica, sans-serif;
  font-size: small;
  font-weight: normal;
    background-image: url("imgs/grey.png");
    background-repeat: repeat;
    background-color: transparent;  
}

.background {
    background-color: white;
    margin-left: auto;
    margin-right: auto;
    padding: 0px;
    border-radius: 20px 20px 0px 0px;
}
    
.background td {
	padding: 0px;
}


h1 {
	color: #009B3E;
	border-bottom: 1px solid black;
}

h2 {
	color: #009B3E;
}

img {
    display: block;
}

.mainHeader {
	box-shadow: 0 0px 10px dimgrey;
	border-spacing: 0px;
    padding: 0px 0px 0px 0px;
    width: 100%;
    height: 70px;
}

.headerBar {
    padding: 0px;
    margin: 0px;
    width:auto;
    background-image:url('imgs/toprightBG.png');
    background-size: auto 70px;
    position: relative;
    height: 70px;
}

.headerBar td{
    padding: 0px;
}

.pendingRequest {
	color: #f4a100;
}

.defaultTextBox {
	background: white;
	padding: 4px;
	border: 1px solid #A0A0A0;
	border-radius: 4px;
	-moz-border-radius: 4px;
	outline: none;
}
.defaultListBox {
	background: white;
	padding: 3px 4px;
	border: 1px solid #A0A0A0;
	border-radius: 4px;
	-moz-border-radius: 4px;
	outline: none;
}
.defaultButton {
	background: #ffffff;
	background: -moz-linear-gradient(top, #FFFFFF 25%, #EFEFEF 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#FFFFFF), color-stop(100%,#EFEFEF)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#EFEFEF',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* W3C */	
		
	border: 1px outset #a0a0a0;
	border-radius: 4px;
	-moz-border-radius: 4px;
	
	cursor: pointer;
	font-size: small;
	margin: 0;
	padding: 3px 4px;
	text-decoration: none;
	text-align: center;
	
	min-width: 80px;
	outline:none;
}
.defaultButton:disabled {
	border-style: solid;
	background: #EFEFEF;
}
.defaultButton:disabled:HOVER {
	border-color: #a0a0a0;
}
.defaultButton:HOVER {
	border-color: #87D201;
}
.buttonDown {
	background: #ffffff;
	background: -moz-linear-gradient(top, #EFEFEF 25%, #ffffff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#EFEFEF), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFEFEF', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* W3C */	
	border-style: inset;	
}

.defaultTextArea {
	background: white;
	padding: 4px;
	border: 1px solid #A0A0A0;
	border-radius: 4px;
	-moz-border-radius: 4px;
	height: auto;
	overflow: visible;
	outline: none;
}

.sensorControlButton {
	font-weight: bold;
	font-size: medium;
	cursor: pointer;
	padding: 6px 4px;
	text-align: center; 
	outline: none;
}
.sensorControlButtonLeft {
	border-radius: 16px 0 0 16px;
	-moz-border-radius: 16px 0 0 16px;
}
.sensorControlButtonRight {
	border-radius: 0 16px 16px 0;
	-moz-border-radius: 0 16px 16px 0;
}
.sensorControlButton-up, .sensorControlButton-up-hovering {
	background: #CACFCB;
	background: -moz-linear-gradient(top, #FFFFFF 25%, #CACFCB 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#FFFFFF), color-stop(100%,#CACFCB)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #FFFFFF 25%,#CACFCB 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #FFFFFF 25%,#CACFCB 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #FFFFFF 25%,#CACFCB 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#CACFCB',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #FFFFFF 25%,#CACFCB 100%); /* W3C */	
	border: 1px outset #a0a0a0;
	color: black;
	text-shadow: 1px 1px 0 #EFEFEF;
}
.sensorControlButton-up-disabled {
	border: 1px outset #CACFCB;
	background: #EFEFEF;
	cursor: default;
	color: #CACFCB;
	text-shadow: none;
}
.sensorControlButton-down, .sensorControlButton-down-hovering {
	background: #FFFFFF;
	background: -moz-linear-gradient(top, #CACFCB 25%, #ffffff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#CACFCB), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #CACFCB 25%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #CACFCB 25%,#ffffff 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #CACFCB 25%,#ffffff 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CACFCB', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #CACFCB 25%,#ffffff 100%); /* W3C */	
	border: 1px inset #A0A0A0;
	color: #A0A0A0;
	text-shadow: 1px -1px 0 #EFEFEF;	
}
.sensorControlButton-down-disabled {
	border: 1px outset #CACFCB;
	background: #EFEFEF;
	cursor: default;
	color: #CACFCB;
	text-shadow: none;
}

.header {
  border-spacing: 0px;
  padding: 0px;
  width: 100%;
}
.header table {
  padding: 0px;
  margin: 0px;
  width:auto;
}
.header td {
  padding: 0px;
}

#contentPanel {
	background-image: url("imgs/grey.png");
    background-repeat: repeat;
    background-color: transparent;
    margin-top: 10px;
    padding-top: 5px;
}

.contentPanelTable {
	overflow: auto;
	height: 100%;
	width: 100%;
	padding-top: 2px;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 0px;
	position: center;
}

.navigationLink, .navigationLink:VISITED {
  	color: #009B3E; 
  	text-decoration: none;
}

.navigationLink:HOVER {
	cursor: pointer;
  	color: #009B3E; 
}
.navigationLabel {
	cursor: default;
  	color: #009B3E;  	  	
}

.titledFrame {
  margin: 2px;
  border-spacing: 0px;
  border-style: solid;
  border-width: 4px;
  border-color: #9FA0A4;
  border-radius: 8px;
  -moz-border-radius: 8px;
  width: auto;
  padding: 4px;
}

.titledFrame td {
  border-style: none;
}

.roundedFrame {
  border-style: solid;
  border-width: 1px;
  border-color: #A0A0A0;
  padding: 4px;
  border-radius: 8px;
  -moz-border-radius: 8px;
  outline: none;
}

.controlPanelFrame {
	background: #efefef;
	border: solid 8px #efefef;
	padding: 4px;
	border-radius: 8px;
	-moz-border-radius: 8px;
	width: 260px;
}

.popupDialog {
	background: white;
	border: 2px solid #A0A0A0;
	padding: 4px;
	border-radius: 8px;
	-moz-border-radius: 8px;
}

.cameraFrame {
	border: 1px solid #2FB4E9;
  	border-radius: 8px;
  	-moz-border-radius: 8px;
	padding: 4px;
	background-color: #2FB4E9;
	color: white;
	font-size: 14px;		
	display: inline-table;
	table-layout: fixed;
}
.cameraFrame .cameraLabel {
	font-size: 14px;
	padding: 0 0 4px;
}
.cameraFrame .contentFrame {
	border: 4px solid #ffffff;
  	border-radius: 8px;
  	-moz-border-radius: 8px;
	background-color: #ffffff;
	padding: 0px;
	vertical-align: middle;
	width: 100%;
}
.cameraFrame .cameraImage {
  border-radius: 8px;
  -moz-border-radius: 8px;
}

.tabFrame {
  border-radius: 8px 8px 0px 0px;	
  -moz-border-radius: 8px 8px 0px 0px;
  padding: 2px 0px 0px 2px;
}

.productDataField {
	display: inline-table;
	table-layout: fixed;
	width: 150px;
	vertical-align: top;
}

.deviceTile {
	cursor: default;
	display: inline-table;
	table-layout: fixed;
	height: 80px;
	width: 170px;
}

.deviceSelectionTile {
	height: 80px;
	width: 220px;
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	-moz-border-radius: 8px;
	cursor: pointer;
	display: inline-table;
	table-layout: fixed;
	margin: 4px;
	outline: none;
}
.deviceSelectionTile:HOVER {
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top, #efefef 50%, #ffffff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#efefef), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #efefef 50%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #efefef 50%,#ffffff 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #efefef 50%,#ffffff 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #efefef 50%,#ffffff 100%); /* W3C */	
}
.deviceSelectionTile .deviceLabel {
	white-space: normal;
}
.deviceSelectionTile .deviceLabel:HOVER {
	cursor: text;
	color: #F4A100; 
}

.deviceSelectionLabel {
	cursor: default;
	font-weight: bold;
	font-size: medium;		
}
.deviceSelectionLabel:HOVER {
	color: #4fa600;
}
.deviceSelectionSeparator {
	cursor: default;
	padding: 0px 4px 0px 4px;
	font-weight: bold;
	font-size: medium;		
}

.resolvedAlert {
  font-style: italic;
}

.alertDisclosure .header {
	color: transparent;
	text-decoration: none;
}
.alertDisclosure .content {
	padding-left: 20px;
}

.settingsDisclosure .header {
	color: transparent;
}
.settingsDisclosure .header a, .settingsDisclosure .header td {
	font-size: medium;
	font-weight: bold;
	text-decoration: none;
	color: #F4A100;
	cursor: pointer;
}
.settingsDisclosure .content {
	border-top: 2px solid #A0A0A0;
	margin: 0px 18px;
}

.detailsDisclosure .header {
	color: transparent;
}
.detailsDisclosure .header a, .detailsDisclosure .header td {
	font-size: medium;
	text-decoration: none;
	cursor: pointer;
	color: black;
}
.detailsDisclosure .content {
	border-top: 2px solid #A0A0A0;
	margin: 0px 18px;
}

.summaryPanel {
	border: solid 1px #9fa0a4;
	border-radius: 8px;
	-moz-border-radius: 8px;
		
	background: white; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 50%, #efefef 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(50%,#ffffff), color-stop(100%,#efefef)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 50%,#efefef 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 50%,#efefef 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #ffffff 50%,#efefef 100%); /* IE10+ */
	background: linear-gradient(top, #ffffff 50%,#efefef 100%); /* W3C */
}
.summaryPanel .header {
	padding: 6px 4px;
	font-size: medium;
	text-decoration: none;
	height: auto;
}
.summaryPanel .content {
	padding: 4px 20px;
	height: 100%;
}

.summaryPanel td {
	padding: 4px;
}

.summaryPanelClickable {
	color: #7798BF;
	cursor: pointer;
}

.summaryPanelClickable:hover {
    text-decoration: underline;
    cursor: pointer;
}


.fieldTitle {
	font-weight: bold;
	font-size: 14px;
	text-decoration: underline;
}

.cameraPlaybackButton {
	border-radius: 16px;
	-moz-border-radius: 16px;
	background-color: rgba(255, 255, 255, 0.2);
	border: 2px solid #9FA0A4;
	color: black;
	cursor: pointer;
	font-size: 50px;
	padding: 0px 24px 0px 24px;
	vertical-align: middle;	
}

.primaryTabPanel {	
}
.primaryTabPanelBottom {
	background: white;
	padding: 6px 0px 0px 10px;
}
.primaryTabBar {
	height: 40px;
	background: #009B3E; /* Old browsers */
	background: -moz-linear-gradient(top, #008234 0%, #009B3E 28%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#008234), color-stop(28%,#009B3E)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #008234 0%,#009B3E 28%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #008234 0%,#009B3E 28%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #008234 0%,#009B3E 28%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008234', endColorstr='#009B3E',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #008234 0%,#009B3E 28%); /* W3C */	
	border-radius: 10px 10px 0px 0px;
}
.primaryTabBar .gwt-TabBarItem {
	border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	background: #4FA600;
	background-color: rgba(255,255,255,0.25);
	border: 0;
	color: white;
	font-size: medium;
	margin: 0;
	padding: 6px;
	text-align: left;
	vertical-align: bottom;
	cursor: pointer;
	outline: none;
}
.primaryTabBar .gwt-TabBarItem:HOVER {
	font-weight:bold;
}
.primaryTabBar .gwt-TabBarItem-selected {
	background: white;
	font-weight: bold;
	border: none;
	color: #009B3E;
}
.primaryTabBar .gwt-TabBarFirst-wrapper {
	width: 10px;
}
.primaryTabBar .gwt-TabBarItem-wrapper {
	padding: 8px 6px 0 0;
}
.primaryTabBar .gwt-TabBarFirst {
	width: 10px;
}
.primaryTabBar .gwt-TabBarRest {
}

.cameraPTZButton {
	background: -moz-linear-gradient(top, #FFFFFF 25%, #EFEFEF 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#FFFFFF), color-stop(100%,#EFEFEF)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#EFEFEF',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #FFFFFF 25%,#EFEFEF 100%); /* W3C */	
		
	border: 1px outset #a0a0a0;
	border-radius: 4px;
	-moz-border-radius: 4px;
	
	cursor: pointer;
	padding: 4px;
}
.cameraPTZButton:HOVER {
	border-color: #87D201;
}
.buttonDown {
	background: -moz-linear-gradient(top, #EFEFEF 25%, #ffffff 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,#EFEFEF), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFEFEF', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #EFEFEF 25%,#ffffff 100%); /* W3C */	
	border-style: inset;	
}
.disabled {
	cursor: auto;
	border-style: solid;
	background: #EFEFEF;
}
.disabled:HOVER {
	border-color: #a0a0a0;
}