@charset "UTF-8";

body, html {
  margin: 0px auto;
  padding: 0px;
  font-family: Arial, Helvetica, sans-serif;
}

.tiledContentHolder {
  position: relative;
  width: 512px;
  height: 288px;
  background: black;
  overflow: hidden;
  border: 1px solid black;
  cursor: url("cursors/openhand.png") 10 10, move;
}

.spinnerOverlay {
  width: 32px ;
  position:absolute;
  display:none;
  margin-left: auto;
  margin-right: auto;
  z-index: 10;
}

.instructions {
  height:290px;
  background-color: rgba(0, 0, 0, 0.5);
  position:absolute;
  margin: auto;
  z-index:6;
  display:none;
}

.instructions span {
  font-size:13px;
  color:#fff;
  position:absolute;
  display:block;
  line-height:18px;
}

.instructions p{font-size:13px;}

.instructions span.loophelp {
  width:135px;
  background-color:#262626;
  border:1px solid #444;
  height:19px;
  overflow:visible;
  bottom: -2px;
  left:40px;
  padding:12px 16px 16px;
}

.instructions span.loophelp p {
  margin:0;
  padding:0;
  background-repeat:no-repeat;
  background-position:bottom left;
  background-image:url(../images/bubble_edge_horizontal.png);
  height:46px;
}

.instructions span.movehelp {
  top:60px;
  right:60px;
  width:100px;
  padding:68px 0px 0px 0px;
  background-repeat:no-repeat;
  background-position:center top;
  background-image:url(../images/drag_mouse.png);
}

.instructions span.zoomhelp {
  background-color:#262626;
  border:1px solid #444;
  top:20px;
  left:70px;
  overflow:visible;
}

.instructions span.zoomallhelp {
  background-color:#262626;
  border:1px solid #444;
  top:185px;
  left:70px;
  overflow:visible;
}

.instructions span.zoomhelp p, .instructions span.zoomallhelp p {
  margin:0px 0px 0px -11px;
  padding:12px 16px 12px 28px;
  background-repeat:no-repeat;
  background-position:center left;
  background-image:url(../images/bubble_edge_vertical.png);
  width:190px;
}

.instructions span.speedhelp {
  width:268px;
  background-color:#262626;
  border:1px solid #444;
  height:19px;
  overflow:visible;
  bottom: -10px;
  left:377px;
  padding:12px 16px 16px;
}

.instructions span.speedhelp p {
  margin:0;
  padding:0;
  background-repeat:no-repeat;
  background-position:bottom left;
  background-image:url(../images/bubble_edge_horizontal.png);
  height:46px;
}

ul.sidebuttons {
  margin:0px;
  padding:0px;
  display:block;
  position:absolute;
  top:8px;
  right:10px;
}

ul.sidebuttons li {
  padding:0px;
  display:inline;
}

ul.sidebuttons li a {
  text-decoration:none;
  color:#111;
  font-size:11px;
}

li.playbackSpeedOptions {
  display:block;
  width:153px;
  background:#fff;
  border:1px solid #666;
  position:absolute;
  bottom:0px;
  z-index:5;
  margin: 1px 0px 0px -380px !important;
}

li.playbackSpeedOptions ul {
  display:block;
  width:153px;
  margin:0px !important;
  padding:7px 0px 10px 7px !important;
}

li.playbackSpeedOptions ul li {
  font-size:11px;
  text-align:left;
  display:block;
  color:#999;
}

li.playbackSpeedOptions ul li a {
  padding:7px;
  display:block;
  height:5px;
  padding:6px 0px 7px 13px;
}

li.playbackSpeedOptions ul li a.current {
  background-repeat:no-repeat;
  background-position:bottom left;
  background-image:url(../images/check.gif);
}

li.playbackSpeedOptions ul li a:hover {text-decoration:underline;}

a.playbackspeed {
  display:inline-block;
  padding:8px 0px 0px 0px;
  position: absolute;
  margin: 6px 0px 0px -380px;
  width:143px;
  height:21px;
  text-align:center;
  text-indent:-20px;
  background-repeat:no-repeat;
  background-position:top left;
  background-image:url(../images/buttons/playbackspeed3.png);
}

a.playbackspeed:hover{background-image:url(../images/buttons/playbackspeed_hover3.png);}

a.playbackspeed:active{background-image:url(../images/buttons/playbackspeed_down3.png);}

li.sizeoptions {
  display:block;
  width:79px;
  background:#fff;
  border:1px solid #666;
  position:absolute;
  bottom:0px;
  z-index:5;
  margin: 1px 0px 0px -85px !important;
}

li.sizeoptions ul {
  display:block;
  width:79px;
  margin:0px !important;
  padding:7px 0px 10px 7px !important;
}

li.sizeoptions ul li {
  font-size:11px;
  text-align:left;
  display:block;
  color:#999;
}

li.sizeoptions ul li a {
  padding:7px;
  display:block;
  height:5px;
  padding:6px 0px 7px 13px;
}

li.sizeoptions ul li a.current {
  background-repeat:no-repeat;
  background-position:bottom left;
  background-image:url(../images/check.gif);
}

li.sizeoptions ul li a:hover {text-decoration:underline;}

a.size {
  display:inline-block;
  padding:8px 0px 0px 0px;
  position: absolute;
  margin: 6px 0px 0px -85px;
  width:81px;
  height:21px;
  text-align:center;
  text-indent:-20px;
  background-repeat:no-repeat;
  background-position:top left;
  background-image:url(../images/buttons/size2.png);
}

a.size:hover{background-image:url(../images/buttons/size_hover2.png);}

a.size:active{background-image:url(../images/buttons/size_down2.png);}

a.help.enabled, .help.disabled {
  display:inline-block;
  padding:8px 0px 0px 0px;
  margin:6px 0px 0px 0px;
  width:50px;
  height:21px;
  text-align:center;
  background-repeat:no-repeat;
  background-position:top left;
  background-image:url(../images/buttons/help2.png);
}

a.help.enabled:hover{background-image:url(../images/buttons/help_hover2.png);}

a.help.enabled:active{background-image:url(../images/buttons/help_down2.png);}

a.help.on {
  background:#333 !important;
  color:#fff !important;
}

.videoTime {
  margin:0px;
  padding:0px;
  position:absolute;
  right:155px;
  bottom:12px;
  font-size:13px;
  color:#222;
}

.captureTime {
  margin:0px;
  padding:0px;
  position:absolute;
  right:155px;
  bottom:28px;
  font-size:13px;
  color:#222;
}

.controls {
  display:block;
  width:512px;
  height:56px;
  background:url(../images/bar_background_stretch_noborder.png) repeat-x left;
  border:1px #838383 solid;
  position:relative;
}

a.playbackButton {
  margin:0px;
  padding:0px;
  display:block;
  width:53px;
  height:56px;
  border-right:1px #838383 solid;
  background-repeat:no-repeat;
  background-position:top left;
}

a.stopTimeWarp {
  margin:0px;
  padding:0px;
  display:block;
  width:53px;
  height:56px;
  border-right:1px #838383 solid;
  background-repeat:no-repeat;
  background-position:top left;
}

a.play, .play_disabled{background-image:url(../images/buttons/play.png);}
a.play:hover{background-image:url(../images/buttons/play_hover.png);}
a.play:active{background-image:url(../images/buttons/play_down.png);}

a.pause, .pause_disabled{background-image:url(../images/buttons/pause.png);}
a.pause:hover{background-image:url(../images/buttons/pause_hover.png);}
a.pause:active{background-image:url(../images/buttons/pause_down.png);}

a.stopTimeWarp{background-image:url(../images/buttons/stop_snaplapse.png);}
a.stopTimeWarp:hover{background-image:url(../images/buttons/stop_snaplapse_hover.png);}
a.stopTimeWarp:active{background-image:url(../images/buttons/stop_snaplapse_down.png);}

a.pausesnap{background-image:url(../images/buttons/pause_snaplapse.png);}
a.pausesnap:hover{background-image:url(../images/buttons/pause_snaplapse_hover.png);}
a.pausesnap:active{background-image:url(../images/buttons/pause_snaplapse_down.png);}

.zoom {
  display:block;
  width:40px;
  height:212px;
  position:absolute;
  margin: 15px 0px 0px 20px;
  z-index:4;
}

a.zoomin {
  display:block;
  height:29px;
  width:28px;
  background-repeat:no-repeat;
  background-position:center;
  background-image:url(../images/zoom/zoom_in.png);
  position:absolute;
  top:0px;
  left:0px;
  z-index:4;
}

a.zoomin:hover{background-image:url(../images/zoom/zoom_in_hover.png);}
a.zoomin:active{background-image:url(../images/zoom/zoom_in_down.png);}

a.zoomout {
  display:block;
  height:29px;
  width:28px;
  background-repeat:no-repeat;
  background-position:center;
  background-image:url(../images/zoom/zoom_out.png);
  z-index:4;
  position:absolute;
  top:137px;
  left:0px;
  z-index:4;
}

a.zoomout:hover{background-image:url(../images/zoom/zoom_out_hover.png);}
a.zoomout:active{background-image:url(../images/zoom/zoom_out_down.png);}

a.zoomall {
  display:block;
  height:40px;
  width:39px;
  background-repeat:no-repeat;
  background-position:center;
  background-image:url(../images/zoom/zoom_viewall.png);
  z-index:4;
  position:absolute;
  bottom:0px;
  left:-5px;
  z-index:4;
}

a.zoomall:hover{background-image:url(../images/zoom/zoom_viewall_hover.png);}
a.zoomall:active{background-image:url(../images/zoom/zoom_viewall_down.png);}

.ui-slider-range { background: #6f879c; z-index:3;}

.timelineSliderFiller {
  height:8px;
  z-index:5;
  background:#FFF;
  position:relative;
}

.timelineSlider {
  cursor:pointer;
  display:block;
  width:513px;
  height:8px;
  border:0px #838383 solid;
  border-bottom:0px !important;
  position:relative;
  bottom:0px;
  margin: 0px 0px 0px 0px;
  background:#FFF;
  z-index:5;
}

.timelineSlider .ui-slider-handle {
  width:11px;
  margin-left:-4px !important;
  height:19px;
  background:url(../images/handle.png) no-repeat; overflow: hidden;
  top: -6px;
  border-style:none;
  border:none;
  margin: 0px 0px 0px 0px;
}

.zoomSlider {
  width:8px;
  height:110px;
  background:#969DA1;
  border:1px solid #555555;
  position:absolute;
  top:27px;
  left:9px;
}

.zoomSlider .ui-slider-handle {
  width:28px;
  height:11px;
  background:url(../images/zoom/zoom_handle.png) no-repeat; overflow: hidden;
  border-style:none;
  border:none;
  left:-10px;
  z-index: 10;
}

.zoomSlider .ui-slider-handle:hover{background-image:url(../images/zoom/zoom_handle_hover.png);}
.zoomSlider .ui-slider-handle:active{background-image:url(../images/zoom/zoom_handle_down.png);}

.timelineSlider .ui-slider-handle:hover{background-image:url(../images/handle_hover.png);}
.timelineSlider .ui-slider-handle:active{background-image:url(../images/handle_down.png);}

.snaplapse-annotation-description {
  padding:0px;
  color:#fff;
  background-color:#262626;
  border:1px solid #444;
  display:none;
  max-width:500px;
  min-width:300px;
  position:absolute;
  top:50px;
  z-index:6;
  overflow:visible;
}

.snaplapse-annotation-description p {
  padding:30px 34px 30px 44px;
  background-position:top left;
  background-image:url("../images/bubble_edge_vertical.png");
  background-repeat:no-repeat;
  width:190px;
  margin-left:-10px;
}

.carousel {
  margin: 0 0 20px 10px;
  /*position: relative;*/
}

.layerSlider {
  /*margin-left: 260px;
  position: absolute;
  top: 340px;*/
  margin-left: auto;
}

.carousel a.prev, .carousel a.next {
  display: block;
  float: left;
  width: 30px;
  height: 40px;
  text-decoration: none;
  background: url("../images/prev.jpg") left 15px no-repeat;
}

.carousel a.next {
  height: 50px;
  */float: right;
  right: -25px;*/
  position: absolute;
  margin: -78px 0px 0px 218px;
  /*top: -8px;*/
  background: url("../images/next.jpg") right 23px no-repeat;
}

.carousel a.next:hover {background-image: url("../images/next.jpg");}

.carousel a.prev:hover {background-image: url("../images/prev.jpg");}

.carousel a:hover, .carousel a:active {
  border: none;
  outline: none;
}

.carousel ul {margin: 0;}

.carousel li img, .carousel li p {
  background-color: #fff;
  margin: 5px;
  width: 45px;
}

.jCarouselLite img {cursor: pointer;}

.repeat {
  width: 27px;
  height: 24px;
  display: block;
  position: relative;
  right: -53px;
  bottom: 60px;
  z-index: 2;
}

.repeat.active {
  background-image: url("../images/repeat_active2.png");
  background-repeat:no-repeat;
}

.repeat.inactive {
  background-image: url("../images/repeat_inactive2.png");
  background-repeat:no-repeat;
}

.repeat:hover{
  background-image: url("../images/repeat_hover2.png");
  background-repeat:no-repeat;
}

.play_mouseover {
  width: 20px;
  height: 23px;
  background-image: url("../images/play_mouseover.png");
  cursor: pointer;
  float: left;
}

.play_mouseout {
  width: 20px;
  height: 23px;
  background-image: url("../images/play_mouseout.png");
  cursor: pointer;
  float: left;
}

.pause_mouseover {
  width: 20px;
  height: 23px;
  background-image: url("../images/pause_mouseover.png");
  cursor: pointer;
  float: left;
}

.pause_mouseout {
  width: 20px;
  height: 23px;
  background-image: url("../images/pause_mouseout.png");
  cursor: pointer;
  float: left;
}

.shareurl {
  width:600px;
  height: 32px;
}

a.share {
  padding:8px 0px 0px 0px;
  position: absolute;
  margin: 6px 0px 0px -510px;
  width:120px;
  height:21px;
  text-align:center;
  text-indent:0px;
  background-repeat:no-repeat;
  background-position:top left;
  background-image:url("../images/buttons/share.png");
}

a.share:hover{background-image:url("../images/buttons/share_hover.png");}

a.share:active{background-image:url("../images/buttons/share_down.png");}