@CHARSET "UTF-8";

#canvas-visible {
  background: #fff;
  border: 1px solid #afb0b0;
  padding: 20px;
  padding-right: 19px;
  /*height: 464px;*/
  width: 532px;
}

#canvas-visible-slide {
  background: #e3e3e3;
  border: 1px solid #afb0b0;
}

#canvas-visible-slide-control-content {
  background: #efefef url('../images/video-controller-bg.jpg') repeat-x;
  border: 1px solid #afb0b0;
  padding: 5px 6px;
}

#canvas-visible-slide-control-content-1, #canvas-visible-slide-control-content-2 {
  background: url('../images/player-control-bg.png') repeat-x;
  height: 18px;
}

#canvas-visible-slide-control-content-1 {
  float: left;
  width: 55px;
}

#canvas-visible-slide-control-content-2 {
  float: right;
  width: 457px;
}

#canvas-visible-slide-control-left, #canvas-visible-slide-control-right {
  background: url('../images/player-control-curve.png') no-repeat;
  height: 18px;
  width: 9px;
}

#canvas-visible-slide-control-left {
  background-position: left top;
  float: left;
}

#canvas-visible-slide-control-right {
  background-position: right top;
  float: right;
}

#canvas-visible-slide-control-play, #canvas-visible-slide-control-stop {
  float: left;
  height: 12px;
  margin: 2px 5px;
  width: 11px;
}

#canvas-visible-slide-control-play {
  margin-right: 2px; 
}

#canvas-visible-slide-control-play {
  margin-left: 2px;
}

span.play-content, span.stop-content {
  cursor: pointer;
  display: block;
  height: 12px;
  text-indent: -9999px;
  width: 11px;
}

span.play-content {
  background: url('../images/play-button.png') no-repeat;
}

span.stop-content {
  background: #6b6b6b;
}

#canvas-visible-slide-control-content-2_inner {
  float: left;
  padding: 5px 0 0;
  width: 438px;
}

#canvas-visible-slide-control-content-rewind, #canvas-visible-slide-count-stat {
  float: left;
}

#canvas-visible-slide-control-content-forward {
  float: right;
}

#canvas-visible-slide-control-first, #canvas-visible-slide-control-previous, #canvas-visible-slide-control-next, #canvas-visible-slide-control-last {
  cursor: pointer;
  display: block;
  float: left;
  height: 8px;
  text-indent: -9999px;
}

#canvas-visible-slide-control-first {
  background: url('../images/first.png') no-repeat;
  width: 12px;
}

#canvas-visible-slide-control-previous {
  background: url('../images/first.png') no-repeat;
  margin-left: 10px;
  width: 6px;
}

#canvas-visible-slide-count-stat {
  width: 378px;
  margin-top: -4px;
  text-align: center;
}

#canvas-visible-slide-control-next {
  background: url('../images/last.png') no-repeat;
  margin-right: 10px;
  width: 6px;
}

#canvas-visible-slide-control-last {
  background: url('../images/last.png') no-repeat;
  width: 12px;
}

#canvas-visible-description {
  margin-top: 18px;
}

.alert {
  padding:6px;
  border:solid 2px #000000;
  text-align:left;
  opacity: .5;
  filter: alpha(opacity=50);
  font-size:15px;
  color:#fff;
} 

.canvas {
  position: relative;
  width: 480px;
  height: 350px;
  overflow: hidden;
}

.slide-title {
  position: absolute;
}

.slide-actor {
  position: absolute;
  top: 20px;
}

.slide-actor img {
  height: 50px;
  width: 50px;
}

.hidden {
  display: none;
}

.visible {
  display: block;
}

.slide-background img {
  width: 480px;
  height: 350px
}

/*
.story-title {
  position: absolute;
}
*/

#story-description {
  position: absolute;
  width: 300px;
  color: #FFFFFF;
  font-size: 20px;
  top: 25px;
  left: 90px;
  background-color: #333333;
  text-align: center;
}
#story-click-info {
  position: absolute;
  color: #FFFFFF;
  font-size: 20px;
  top: 265px;
  left: 70px;
  background-color: #333333;
}

#slide-control, #slide-list{
	clear:both;
	padding-top:10px;
}
#slide-control a, #slide-list a{
	padding:5px 8px;
	margin-right:7px;
	background-color:#2b7264;
	color:#FFFFFF;
	
}
#slide-control a:hover,.config-link a:active{
	background-color:#64847e;
}
#slide-list a:hover,.config-link a:active{
	background-color:#64847e;
}

.slide-description  {
  background: url(../images/bg-box.png) repeat !important; background: #111;
  margin: 0 0 20px;
  padding: 20px 15px 20px 20px;
  overflow: hidden;
  border:none;
  height:100%;
  position: relative;
  color: #FFFFFF;
  font-size: 20px;
  background-color: #333333;
  text-align: center;
}

/*
  Embed Code
*/
#embed-story {
  margin-top: 25px;
}
  Dialog
*/

.canvas-slide-inner-content {
  position: relative;
}
.canvas-dialog {
  position: absolute;
}
.canvas-dialog-inner {
  position: relative;
}
.dialog {
  position:absolute;
}
.dialog-inner {
  background: #e3e3e3;
  padding: 3px;
  position: absolute;
  

}

.dialog-inner .arrow {
  width: 0;
  height: 0;
  line-height: 0;
  border-top: 13px solid #e3e3e3;
  border-left: 11px solid transparent;
  border-right: 6px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 30px;
}