* {
  margin: 0;
  -ms-touch-action: pan-x pan-y;
      touch-action: pan-x pan-y;
}

a, a:visited {
  color: #00aff0;
  text-decoration: none;
}

body {
  font-size: 20px;
  line-height: 20px;
  color: #ffffff;
  font-family: Arial;
  background: #000000;
}

img {
  display: block;
  border-style: none;
}

table {
  width: 100%;
  empty-cells: show;
}

textarea {
  font-family: Arial;
}

/* Header elements */
#Header, #controlWindowTitleBar {
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#555555), to(#000000)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #555555, #000000); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #555555, #000000); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #555555, #000000); /* IE10 */
  background-image:      -o-linear-gradient(top, #555555, #000000); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #555555, #000000);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#555555', EndColorStr='#000000'); /* IE6–IE9 */
  table-layout: fixed;
}

#Header tr {
  height: 35px;
}

#PageTitle {
  text-align: center;
  overflow: hidden;
}

#AltTitle {
  text-align: center;
  overflow: hidden;
  line-height: 26px;
}

#Logo {
  width: 108px;
  text-align: center;
}

#RefreshIcon {
  width: 40px;
  text-align: center;
}

#TitleBarExtra {
  width: 0px;
  text-align: center;
}

#AlarmIcon {
  width: 40px;
  text-align: center;
}

/* Content elements */
#Status {
  text-align: center;
}

/* HDV */
#TimespanSelector{
  vertical-align: top;
}

#PauseBtn {
  width: 20px;
  height: 20px;
  background: transparent url('Resources/Pause.png') no-repeat center center;
  vertical-align: top;
  margin-left: 7px;
  border: none;
}

#LiveBtn {
  width: 20px;
  height: 20px;
  background: transparent url('Resources/Play.png') no-repeat center center;
  vertical-align: top;
  margin-left: 7px;
  border: none;
}

#ClearBtn {
  width: 20px;
  height: 20px;
  background: transparent url('Resources/Clear.png') no-repeat center center;
  vertical-align: top;
  margin-left: 6px;
  border: none;
}

#xButton {
  width: 20px;
  height: 20px;
  background: transparent url('Resources/Clear.png') no-repeat center center;
  border: none;
}

/*Tab elements */
.activeTab {
  background: #181818;
  height: 35px;
  color: #ffffff;
  font-size: 18px;
  line-height: 35px;
  border: 1px solid #282828;
}

.activeTab a, .activeTab a:visited {
  display: block;
  color: #00aff0;
}

.active_gradient {
  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#555555), to(#252525)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #555555, #252525); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #555555, #252525); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #555555, #252525); /* IE10 */
  background-image:      -o-linear-gradient(top, #555555, #252525); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #555555, #252525);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#555555', EndColorStr='#252525'); /* IE6–IE9 */
}

.inactiveTab {
  background: #000000;
  height: 35px;
  color: #ffffff;
  font-size: 18px;
  line-height: 35px;
  border: 1px solid #000000;
}

.inactiveTab a, .inactiveTab a:visited {
  display: block;
  color: #757575;
}

.inactive_gradient {
  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#101010), to(#353535)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #101010, #353535); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #101010, #353535); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #101010, #353535); /* IE10 */
  background-image:      -o-linear-gradient(top, #101010, #353535); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #101010, #353535);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#101010', EndColorStr='#353535'); /* IE6–IE9 */
}

/* niceTable elements */
.spacerRow td {
  border-bottom: 1px solid #454545;
  border-top: 1px solid #000000;
  background: #000000;
  height: 1px;
  padding: 0;
}

.generalRow{
  background: #282828;
}

.divider{
  background: #383838;
}

.alarmMessage, .regularText {
  color: #ffffff;
  font-family: verdana;
  font-size: 15px;
  line-height: 15px;
}

.alarmPriority {
  font-family: verdana;
  font-size: 12px;
  line-height: 12px;
}

.alarmDetails, .detailText {
  color: #ffffff;
  font-family: verdana;
  font-size: 12px;
  line-height: 12px;
}

.tagValueInAlarm {
            border: 1px solid #000000;
  background-color: #FF0000;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#FF0000), to(#B00000)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #FF0000, #B00000); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #FF0000, #B00000); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #FF0000, #B00000); /* IE10 */
  background-image:      -o-linear-gradient(top, #FF0000, #B00000); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #FF0000, #B00000);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#FF0000', EndColorStr='#B00000'); /* IE6–IE9 */
}

.tagValueNormal {
            border: 1px solid #000000;
  background-color: #00FF00;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#00FF00), to(#00B000)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #00FF00, #00B000); /* Chrome 10+, Saf5.1+ */
  background-image:    -moz-linear-gradient(top, #00FF00, #00B000); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #00FF00, #00B000); /* IE10 */
  background-image:      -o-linear-gradient(top, #00FF00, #00B000); /* Opera 11.10+ */
  background-image:         linear-gradient(top, #00FF00, #00B000);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#00FF00', EndColorStr='#00B000'); /* IE6–IE9 */
}

a.menuArrowImg {
  display: block;
  background: transparent url('Resources/RightArrow.png') no-repeat scroll center right;
  padding-left: 20px;
  padding-top: 8px;
  padding-bottom: 8px;
}

a.menuLeaf {
  display: block;
  background: transparent url('Resources/Transparent.png') no-repeat scroll top right;
  padding-left: 20px;
  padding-top: 6px;
  padding-bottom: 6px;
}

/* Map-related styles */
#mapdiv {
  width    : 100%;
  position : relative;
  height   : 200px;
  -ms-touch-action: none;
      touch-action: none;
}

div.olControlZoomPanel {
  height: 108px;
  width: 36px;
  position: absolute;
  top: 20px;
  left: 20px;
}

div.olControlZoomPanel div {
  width: 36px;
  height: 36px;
  left: 0;
}

div.olControlZoomPanel .olControlZoomInItemInactive {
  top: 0;
  background-position: 0 0;
}

div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
  top: 36px;
  background-position: 0 -36px;
}

div.olControlZoomPanel .olControlZoomOutItemInactive {
  top: 72px;
  background-position: 0 -72px;
}

.olTileImage {
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  -o-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
}

.olControlAttribution {
  position      : absolute;
  font-size     : 10px;
  bottom        : 0 !important;
  right         : 0 !important;
  background    : rgba(0,0,0,0.1);
  font-family   : Arial;
  padding       : 0px 8px;
  border-radius : 5px 0 0 0;
}

div.olControlZoomPanel .olControlZoomInItemInactive,
div.olControlZoomPanel .olControlZoomOutItemInactive {
  background: rgba(0,0,0,0.2);
  position: absolute;
}

div.olControlZoomPanel .olControlZoomInItemInactive {
  border-radius: 5px 5px 0 0;
}

div.olControlZoomPanel .olControlZoomOutItemInactive {
  border-radius: 0 0 5px 5px ;
  top: 37px;
}

div.olControlZoomPanel .olControlZoomOutItemInactive:after ,
div.olControlZoomPanel .olControlZoomInItemInactive:after{
  font-weight: bold;
  content   : '+';
  font-size : 36px;
  padding:  7px;
  z-index: 2000;
  color     : #fff;
  line-height: 1em;
}

div.olControlZoomPanel .olControlZoomOutItemInactive:after{
  content: '–';
  line-height: 0.9em;
  padding: 0 8px;
}

div.olControlZoomPanel .olControlZoomToMaxExtentItemInactive {
  display: none;
}