/* CSS Document */

* {
  margin: 0;
  padding: 0;
  outline: none;
}

body {
  width: 100%;
  height: 100%;
  font-family: Arial, Helvetica, clean,"新細明體","PMingLiU",sans-serif;
  font-size: 100%;
  text-align: center;
  overflow: hidden;
  background: #000;
}

a {
  color: #3399cc;
}

a:hover {
  color: #33ccff;
}

.btn {
  width: 10.3125em;
  height: 1.3125em;
  text-align: center;
  text-decoration: none; 
  background: url(../images/btn_off.png) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#5e5e5e, endColorstr=#252525);
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  display: block;
  cursor: pointer;
}

.btn span {
  font-size: 0.6875em;
  height: 1.9em;
  line-height: 1.9em;
  color: #fff;
  display: block;
}

.btn.on, .btn:hover {
  background-image: url(../images/btn_on.png);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#0ca7f9, endColorstr=#0072ae);
}

.btn.disable {
  background: #444;
  filter: none;
}

.btn.disable span {
  color: #666;
}

#video-layer {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  display: none;
  background: url(../thumb/bg-forest.jpg) center 0 no-repeat;
}


/* Bubble Layer */
#bubble {
  width: 57.375em;
  height: 2.1875em;
  background: url(../images/bg_msg.png) 0 0 repeat;
  -moz-border-radius: 0 0 0.3125em 0.3125em;
  -webkit-border-radius: 0 0 0.3125em 0.3125em;
  border-radius: 0 0 0.3125em 0.3125em;
  border: #555 1px solid;
  border-top: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 3.3125em;
  z-index: 40;
  display: none;
}

#bubble p {
  font-size: 0.875em;
  color: #fff;
  line-height: 2.5em;
}

/* FB bubble */

#fb-bubble {
  width: 100%;
  height: 4.1875em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 40;
  display: none;
}

#fb-holder {
  margin: 0 auto;
  width: 53.75em;
  height: 4.1875em;
  position: relative;
}

#fb-panel {
  padding: 0.3125em 1em 0 4em;
  width: 38.0625em;
  height: 3.875em;
  text-align: left;
  background: url(../images/bg_msg.png) 0 0 repeat;
  -moz-border-radius: 0 0 0.3125em 0.3125em;
  -webkit-border-radius: 0 0 0.3125em 0.3125em;
  border-radius: 0 0 0.3125em 0.3125em;
  border: #555 1px solid;
  border-top: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
}

#fb-bubble span {
  display: block;
}

#fb-picture {
  width: 2.25em;
  height: 2.25em;
  position: absolute;
  top: 0.625em;
  left: 1em;
}

#fb-name {
  height: 1.5em;
  font-size: 0.875em;
  font-weight: bold;
  line-height: 1.5em;
  color: #ff9900;
}

#fb-comment {
  width: 50em;
  height: 2.67em;
  font-size: 0.75em;
  line-height: 1.3125em;
  color: #fff;
  overflow: hidden;
}


/* Toast */
#toast {
  width: 13.4375em;
  height: 5.9375em;
  width: 10.75em;
  height: 4.75em;
  text-shadow: 0 0.0625em 0.0625em #666; 
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  -moz-box-shadow: 0 0.125em 0.3125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.3125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.3125em #000; /* Opera 10.5, IE 9.0 */
  position: absolute;
  bottom: 0.9375em;
  right: 0.9375em;
  z-index: 40;
  display: none;
}

#bg-toast {
  width: 13.4375em;
  height: 5.9375em;
  width: 10.75em;
  height: 4.75em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  bottom: 0;
  left: 0;
}

#toast-close {
  width: 1.25em;
  height: 1.25em;
  position: absolute;
  top: -0.375em;
  left: -0.5em;
  z-index: 42;
  cursor: pointer;
}

#toast-close img {
  width: 1.25em;
  height: 1.25em;
}

#toast-close-off {
  display: block;
}

#toast-close-on {
  display: none;
}

#toast-close:hover #toast-close-off {
  display: none;
}

#toast-close:hover #toast-close-on {
  display: block;
}

#toast-txt {
  padding: 0.875em 0.625em;
  width: 12.1875em;
/*  height: 10em;*/
  width: 9.5em;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 41;
}

#toast-txt span {
  font-size: 0.875em;
  font-weight: bold;
  color: #333;
}

#btn-holder {
  width: 13.4375em;
  height: 1.25em;
  width: 10.75em;
  position: absolute;
  bottom: 0.75em;
  left: 0;
  z-index: 41;
}

#btn-yes {
  margin: 0 auto;
  width: 4em;
  height: 1.25em;
  line-height: 1.25em;
  text-shadow: 0 0.0625em 0.0625em #333;
  -moz-box-shadow: 0 0.0625em 0.0625em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.0625em 0.0625em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.0625em 0.0625em #000; /* Opera 10.5, IE 9.0 */
}

#btn-yes span {
  font-size: 0.8125em;
}

/*#btn-subscribe {
  position: absolute;
  top: 1.1875em;
  right: 1em;
  z-index: 65;
  cursor: pointer;
  display: none;
}

#btn-subscribe img {
  width: 8.625em;
  height: 3.125em;
}

#btn-subscribe .on {
  display: none;
}

#btn-subscribe:hover .on {
  display: block;
}

#btn-subscribe:hover .off {
  display: none;
}
*/

#sg-bubble {
  width: 100%;
  height: 4.1875em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 65;
  display: none;
}

#sg-bubble-holder {
  margin: 0 auto;
  width: 53.75em;
  height: 4.1875em; 
  position: relative;
}

#sg-panel {
  padding: 0.75em 0 0 1.5em;
/*  width: 10.375em;
  height: 4.1875em;*/
  width: 8.875em;
  height: 3.4375em;
  text-align: left;
  text-shadow: 0 0.125em 0.125em #000;
  background: url(../images/bg_panel.png) 0 0 repeat;
  -moz-border-radius: 0 0 0.3125em 0.3125em;
  -webkit-border-radius: 0 0 0.3125em 0.3125em;
  border-radius: 0 0 0.3125em 0.3125em;
  border: #333 1px solid;
  border-top: none;
  position: absolute;
  top: 0;
  left: 0;
}

#sg-panel span {
  display: block;
}

#sg-bubble-user {
  font-size: 1.0625em;
  font-weight: bold;
  color: #ff9900;
}

#sg-panel span#btn-sg-bubble {
  width: 7.6875em;
  height: 1.25em;
  color: #fff;
  cursor: pointer;
}

#icon-sg-bubble {
  margin: 0.25em 0 0 0.3125em;
  width: 1em;
  height: 0.8125em;
  vertical-align: top;
  filter: alpha(Opacity=50); 
  opacity: 0.50;
}

#btn-sg-bubble:hover #icon-sg-bubble {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}



/* Episode Lyaer */

#ep-layer {
  margin: 0 0 0 -28.90625em;
  width: 57.8125em;
  height: 4.875em;
  position: absolute;
  left: 50%;
  bottom: 0;
  bottom: 1.75em;
  z-index: 30;
  display: none;
}

#ep-panel {
  width: 57.8125em;  
  height: 3.5625em;
  position: absolute;
  bottom: 0;
  left: 0;
}

#ep-tip {
  padding: 0 1.25em;
  width: 55.3125em;
  height: 1.3125em;
  text-align: center;
  overflow: hidden;
  position: absolute;
  top: 2.5em;
  left: 0;
  z-index: 35;
  display: none;
}

#ep-tip p {
  font-size: 1em;
  line-height: 1.3125em;
  color: #fff;
}

.ep-swish {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 31;
  display: none;
}

#ep-indicator {
  position: absolute;
  left: 1.875em;
  bottom: 0.625em;
  z-index: 34;
}

#ep-indicator span {
  font-size: 0.875em;
  font-weight: bold;
  color: #fff;
}

#ep-indicator span#epNum {
  font-size: 1.5em;
  color: #ff9900;
}

#arrow-left {
  width: 0.9375em;
  height: 1.375em;
  position: absolute;
  top: 0.9375em;
  left: 8.6875em;
  z-index: 34;
  cursor: pointer;
}

#arrow-right {
  width: 0.9375em;
  height: 1.375em;
  position: absolute;
  top: 0.9375em;
  right: 2.9375em;
  z-index: 34;
  cursor: pointer;
}

#arrow-left img, #arrow-right img {
  width: 0.9375em;
  height: 1.375em;
}

#arrow-left-on, #arrow-right-on {
  display: none;
}

#arrow-left:hover #arrow-left-off, #arrow-right:hover #arrow-right-off {
  display: none;
}

#arrow-left:hover #arrow-left-on, #arrow-right:hover #arrow-right-on {
  display: block;
}

.ep-list {
  width: 45em;
  height: 4.875em;
  text-align: center;
  list-style: none;
  position: absolute;
  top: 0;
  right: 3.55625em;
}

.ep-list li {
  width: 4.875em;
  height: 3.5625em;
  display: inline-block;
  position: relative;
}

*+html .ep-list li {
  display: inline;
}

.ep-list .icon-new {
  width: 1.8125em;
  height: 0.9375em;
  position: absolute;
  left: 0.1875em;
  top: -0.125em;
  z-index: 34;
  display: none;
}

.ep-list img.thumbnail {
  width: 4.0625em;
  height: 2.4375em;
  filter: alpha(Opacity=30); 
  opacity: 0.30;
  position: absolute;
  top: 0.25em;
  left: 0.4375em;
  z-index: 33;
}

.ep-list img.ep-off, .ep-list img.ep-on{
  width: 4.3125em;
  height: 3.5625em;
  position: absolute;
  top: 0;
  left: 0.3125em;
  z-index: 32;
}

.ep-list img.ep-on {
  display: none;
}

.ep-list li.on img.thumbnail {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

.ep-list li.on img.ep-on {
  display: block;
}

.ep-list li.on img.ep-off {
  display: none;
}

.ep-list .age {
  width: 4.3125em;
  height: 0.9375em;
  color: #ccc;
  text-align: center;
  position: absolute;
  top: 3em;
  left: 0.3125em;
  z-index: -1;
}

*+html .ep-list .age {
  top: 3.125em;
}

.ep-list .age span {
  font-size: 0.625em;
  line-height: 1.5em;
}

.ep-list li.on .age {
  color: #fff;
}

.ep-list .duration {
  width: 2em;
  height: 0.9375em;
  color: #666;
  line-height: 0.75em;
  text-align: center;
  background: url(../images/bg_layer.png) 0 0 repeat;
  -moz-border-radius: 0.3125em 0 0 0;
  -webkit-border-radius: 0.3125em 0 0 0;
  border-radius: 0.3125em 0 0 0;
  position: absolute;
  top: 1.75em;
  right: 0.375em;
  z-index: 34;
}

.ep-list span {
  font-size: 0.625em;
}

.ep-list li.on .duration {
  color: #fff;
}

.ep-list li.hover, .ep-list li:hover {
  cursor: pointer;
}

.ep-list li.hover img.ep-on, .ep-list li:hover img.ep-on {
  display: block;
}

.ep-list li.hover img.ep-off, .ep-list li:hover img.ep-off {
  display: none;
}

.ep-list li.hover .age, .ep-list li:hover .age {
  color: #fff;
}

.ep-list li.hover .duration, .ep-list li:hover .duration {
  color: #fff;
}

.ep-list li.hover img.thumbnail, .ep-list li:hover img.thumbnail {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}


#ep-meta {
  width: 43.875em;
  height: 1em;
  text-align: center;
  overflow: hidden;
  position: absolute;
  top: 3.45em;
  right: 4.0625em;
  z-index: 35;
  display: none;
}

#ep-meta p {
  font-size: 0.75em;
  color: #fff;
}

#ep-meta .ep-title {
  font-size: 1.17em;
  font-weight: bold;
  color: #ff9900;
}


/* Mask */
#mask {
  width: 100%;
  height: 100%;
  background: #000;
  filter: alpha(Opacity=70); 
  opacity: 0.70;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 36;
  display: none;
}

/* Loading Layer */
#waiting {
  width: 100%;
  height: 100%;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
  display: none;
}

#buffering {
  width: 100%;
  height: 100%;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  display: none;
}


.waiting-holder {
  margin: -2.1875em 0 0 -9.0625em;
  padding: 1em 2em;
  width: 14em;
  height: 2.25em;
  line-height: 2.25em;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#buffering .waiting-holder {
  margin: -2.1875em 0 0 -7.5625em;
  width: 11em;
}

.waiting-holder img {
  margin: 0 1em 0 0;
  width: 2.25em;
  height: 2.25em;
  vertical-align: top;
}

.waiting-holder p {
  font-size: 1.5em;
  color: #fff;
  display: inline-block;
}

*+html .waiting-holder p {
  display: inline;
}

/* Opening */
#opening {
  width: 100%;
  height: 100%;
  background: #000 url(../images/bg.jpg) center bottom no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
  display: none;
}

#splash {
  margin: -5.15625em 0 0 -6.25em;
  width: 12.5em;
  height: 10.3125em;
  position:absolute; 
  top:50%; 
  left: 50%;
}

/* About Us */
#about-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 40;
  display: none;
}

.about-holder {
  margin: -12.09375em 0 0 -21.46875em;
  width: 42.8125em;
  height: 24.0625em;
  color: #fff;
  text-align: left;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#about-logo {
  width: 6.875em;
  height: 5.4375em;
  position: absolute;
  top: 2.5em;
  left: 2.375em;
}

#btn-closeAbout {
  width: 0.875em;
  height: 0.875em;
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  z-index: 21;
  cursor: pointer;
}

#btn-closeAbout img {
  width: 0.875em;
  height: 0.875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5; 
}

#btn-closeAbout.on img, #btn-closeAbout:hover img {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#about-layer p {
  padding: 0 3.75em 0.9375em 11.25em;
  line-height: 1.0625em;
}

#about-layer p:first-child {
  margin: 2.5em 0 0 0;
}

#about-layer span {
  font-size: 0.875em;
}

/* Copyright */
#copy-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 40;
  display: none;
}

.copy-holder {
  margin: -12.09375em 0 0 -21.46875em;
  width: 42.8125em;
  height: 24.0625em;
  color: #fff;
  text-align: left;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#btn-closeCopy {
  width: 0.875em;
  height: 0.875em;
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  z-index: 21;
  cursor: pointer;
}

#btn-closeCopy img {
  width: 0.875em;
  height: 0.875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5; 
}

#btn-closeCopy.on img, #btn-closeCopy:hover img {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#copy-content {
  margin: 2.5em 3.75em 0 3.75em;
  padding: 0 1.25em 0 0;
  width: 34.0625em;
  height: 19.25em;
  overflow-x: hidden;
  overflow-y: auto;
}

#copy-content h2{
  padding: 0 0 0.9375em 0;
  font-weight: bold;
  color: #ff9900;
}

#copy-content h2 span {
  font-size: 1em;
}

#copy-layer p {
  padding: 0 0 0.9375em 0;
  line-height: 1.0625em;
}

#copy-content h3 {
  padding: 0.3125em 0;
  font-weight: bold;
  color: #ff9900;
}

#copy-content h3 span{
  font-size: 0.875em;
}

.copy-list {
  margin: 0.625em 1.5em 1.25em 1.5em;
}

.copy-list li {
  padding: 0 0 0.3125em 0;
}

#copy-layer span {
  font-size: 0.875em;
}

/* Hints */
#hint-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 60;
  display: none;
}

.hint-holder {
  margin: -12.09375em 0 0 -21.46875em;
  width: 42.8125em;
  height: 24.0625em;
  color: #fff;
  text-align: left;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#hint-title {
  margin: 0 1.625em;
  height: 3.25em;
  line-height: 3.25em;
  border-bottom: #555 1px solid;
}

#hint-title span {
  font-size: 1.5em;
}

#sg-hint {
  width: 19.75em;
  height: 14.3125em;
  border-right: #555 1px solid;
  position: absolute;
  top: 4.875em;
  left: 1.625em;
}

#ep-hint {
  width: 19.75em;
  height: 14.3125em;
  position: absolute;
  top: 4.875em;
  right: 1.625em;
}

.section-title {
  margin: 0 0 1.25em 0;
  height: 1.75em;
}

.section-title span {
  font-size: 1.125em;
  font-weight: bold;
  color: #ff9900;
}

.hints-list {
  list-style: none;
}

#sg-hint .section-title, #sg-hint .hints-list {
  padding: 0 1.875em 0 0.625em;
}

#ep-hint .section-title, #ep-hint .hints-list {
  padding: 0 0.625em 0 1.875em;
}

.hints-list li {
  margin: 0 0 1.875em 0;
  padding: 0 0 0 7.1875em;
  height: 4.0625em;
  line-height: 1em;
  position: relative;
}

#ep-hint .hints-list li {
  margin: 0 0 0 0;
}

.hints-list span {
  font-size: 0.875em;
}

.key-enter {
  width: 3.4375em;
  height: 1.8125em;
  position: absolute;
  left: 1.25em;
  top: 0;
}

.key-up {
  width: 1.8125em;
  height: 1.8125em;
  position: absolute;
  left: 2.0625em;
  top: 0;
}

.key-left {
  width: 1.8125em;
  height: 1.8125em;
  position: absolute;
  left: 1em;
  top: 0;
}

.key-right {
  width: 1.8125em;
  height: 1.8125em;
  position: absolute;
  left: 3.125em;
  top: 0;
}

.key-arrows {
  width: 5.875em;
  height: 3.9375em;
  position: absolute;
  left: 0;
  top: 0;
}

#hint-bottom {
  width: 39.5625em;
  height: 3.25em;
  line-height: 3.25em;
  border-top: #555 1px solid;
  position: absolute;
  left: 1.625em;
  bottom: 0;
}

#hint-remove {
  padding: 0.3125em 0.625em 0.3125em 0.3125em;
  height: 0.9375em;
  line-height: 0.9375em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 0.8125em;
  left: 0;
}

#hint-remove .checkbox {
  margin: 0 0.375em 0 0;
  width: 0.9375em;
  height: 0.9375em;
  vertical-align: top;
}

#hint-remove span {
  font-size: 0.75em;
}

#btn-closeHint {
  width: 8em;
  position: absolute;
  top: 1em;
  right: 0;
}

/* Error Layer */
#error-layer {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 40;
  display: none;
}

.error-holder {
  margin: -7.40625em 0 0 -10.0625em;
  padding: 2em 3em;
  width: 14em;
  height: 10.6875em;
  color: #fff;
  text-align: center;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#icon-error {
  width: 3.625em;
  height: 2.8125em;
}

.error-holder p {
  padding: 1.5em 0 2em 0;
  font-size: 0.875em;
  color: #fff;
  line-height: 1.5em;
}

.error-holder .btn {
  width: 6.25em;
  display: inline-block;
}

/* Confirm Layer */
#confirm-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 70;
  display: none;
}

.confirm-holder {
  margin: -6.25em 0 0 -14.0625em;
  width: 28em;
/*  height: 7.5em;*/
  color: #fff;
  text-align: center;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

.confirm-holder p {
  padding: 1.5em 2em;
  color: #fff;
  line-height: 1.5em;
}

.confirm-holder .btn {
  margin: 0 0 1.5em 0;
  width: 6.25em;
  display: inline-block;
}

*+html .confirm-holder .btn {
  display: inline;
}

/* Delete Layer */
#delete-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 40;
  display: none;
}

.delete-holder {
  margin: -6.25em 0 0 -14.0625em;
  width: 22em;
  height: 5em;
  padding: 0.5em 3em 2em 3em;
  color: #fff;
  text-align: center;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}

#step2 {
  display: none;
}

.delete-holder p {
  padding: 1em 0;
  color: #fff;
  line-height: 1.5em;
}

.delete-holder .actions {
  display: inline-block;
}

*+html .delete-holder .actions {
  display: inline;
}

.delete-holder .btn {
  margin: 0.3125em;
  padding: 0 1em;
  width: auto;
  min-width: 4.25em;
  float: left;
}

#btn-returnSG, #btn-delMore {
  display: none;
}

/* Tribtn Layer */
#tribtn-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 40;
  display: none;
}

.tribtn-holder {
  margin: -6.25em 0 0 -17.5em;
  width: 29em;
  height: 5em;
  padding: 0.5em 3em 2em 3em;
  color: #fff;
  text-align: center;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
}


.tribtn-holder p {
  padding: 1em 0;
  color: #fff;
  line-height: 1.5em;
}

.tribtn-holder .actions {
  display: inline-block;
}

*+html .tribtn-holder .actions {
  display: inline;
}

.tribtn-holder .btn {
  margin: 0.3125em;
  padding: 0 1em;
  width: auto;
  min-width: 4.25em;
  float: left;
}



/* SG Layer */
#sg-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg.jpg) center bottom no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  display: none;
}

#sg-holder {
  margin: -18em 0 0 -32em;
  width: 64em;
  height: 36em;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 11;
}

#sg-header {
  width: 64em;
  height: 3.25em;
  position: relative;
}

#sg-logo {
  width: 2.75em;
  height: 2.1875em;
  position: absolute;
  bottom: 0;
  left: 5.0625em;
}

#sg-beta {
  width: 1.5em;
  height: 0.625em;
  position: absolute;
  bottom: -0.35em;
  left: 6.5625em;
  z-index: 12;
}

#slogan {
  height: 1.33em;
  color: #fff;
  line-height: 1.33em;
  text-align: left;
  position: absolute;
  bottom: 0em;
  left: 8.4375em;
}

#slogan span {
 font-size: 0.75em;
}

#lang-setting {
  height: 0.6875em;
  line-height: 0.6875em; 
  list-style: none;
  position: absolute;
  top: 2.25em;
  right: 16.25em;
}

.icon-downarrow {
  margin: 0 0.625em 0 0.4375em;
  width: 0.675em;
  height: 0.50625em;
  vertical-align: middle;
  filter: alpha(Opacity=50); 
  opacity: 0.50;
}

#lang-setting li {
  padding: 0 0 0 0.625em;
  background: url(../images/bg_line.png) right 0 repeat-y;
  float: left;
  position: relative;
  cursor: pointer;
}

#lang-setting li .lang-selected {
  font-size: 0.6875em;
  color: #fff;
  filter: alpha(Opacity=50); 
  opacity: 0.50;
}

#lang-setting li:hover .lang-selected, #lang-setting li:hover .icon-downarrow {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#lang-setting .lang-options {
  padding: 0.3125em 0;
  background: #fff;
  list-style: none;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  -moz-box-shadow: 0 0.125em 0.125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.125em #000; /* Opera 10.5, IE 9.0 */
  background: -moz-linear-gradient(100% 100% 90deg, #e5e5e5, #fff);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#e5e5e5));
  background: -webkit-linear-gradient(#fff, #e5e5e5);  /* Safari 5.1+, Chrome 10+ */ 
  background: -o-linear-gradient(#e5e5e5, #fff);/* Opera 11.10+ */ 
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffffff, endColorstr=#e5e5e5);
  position: absolute;
  top: 0.9375em;
  left: 0.125em;
  left: -1.25em;
  z-index: 20;
  display: none;
}

#lang-setting .lang-options li {
  margin: 0 0.125em;
  width: 7em;
  padding: 0 0.625em 0 0.3125em;
  height: 1.25em;
  line-height: 1.125em;
  text-align: left;
  float: none;
}

#lang-setting .lang-options li:hover {
   background: #bfdfef;
}

#lang-setting .lang-options li span {
  font-size: 0.6875em;
  color: #333; 
}

#lang-setting .lang-options li:hover span {
  font-size: 0.6875em;
  color: #333; 
}

.icon-check {
  margin: 0 0.3125em 0 0;
  width: 1.0625em;
  height: 1em;
  vertical-align: middle;
  visibility: hidden;
}

#lang-setting .lang-options li.on .icon-check {
  visibility: visible;
}


#menu-list {
  height: 1.125em;
  list-style: none;
  position: absolute;
  bottom: 0;
  right: 5.0625em;
}

#menu-list li {
  float: left;
  cursor: pointer;
  position: relative;
}

#icon-signin, #icon-signout, #icon-about, #icon-help, #icon-resume, #icon-sgt, #icon-curate, #icon-biz {
  margin: 0 0.3125em 0 0.625em;
  width: 1.125em;
  height: 1.125em;
  filter: alpha(Opacity=50); 
  opacity: 0.50;
}

#menu-list li:hover #icon-signin, #menu-list li:hover #icon-about, #menu-list li:hover #icon-help, #menu-list li:hover #icon-resume, #menu-list li:hover #icon-sgt, #menu-list li.on #icon-signin, #menu-list li.on #icon-about, #menu-list li.on #icon-help, #menu-list li.on #icon-resume, #menu-list li.on #icon-sgt, #menu-list li.on #icon-curate, #menu-list li.on #icon-biz {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#menu-list li span {
  padding: 0 0.5em;
  height: 1.5em;
  font-size: 0.625em;
  line-height: 1.5em;
  white-space: nowrap;
  color: #fff;
  background: url(../images/bg_tooltip.png) 0 0 repeat;
  border: #999 1px solid;
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  border-radius: 0.25em;
  position: absolute;
  top: -2.375em;
  left: 0.81em;
  display: none;
}

#menu-list li:hover span {
  display: block;
}

#menu-list li span.arrow {
  padding: 0;
  width: 0;
  height: 0;
  background: none;
  border-color: #999 transparent transparent transparent;
  border-style: dashed;
  border-top-style: solid;
  border-width: 0.75em;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  position: absolute;
  top: 2.4em;
  left: center;
}

#sg-content {
  width: 53.75em;
  height: 26em;
  background: url(../images/bg_panel.png) 0 0 repeat;
  border: #333 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 4em;
  left: 5.0625em;
  display: none;
}

#landing {
  width: 31.75em;
  height: 22.6875em;
  position: absolute;
  left: 11em;
  top: 1.5625em;
  z-index: 12;
  display: none;
}

#landing #bg-folder {
  width: 31.75em;
  height: 22.6875em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 12;
}

#set-title {
  width: 16em;
  height: 1.6875em;
  font-weight: bold;
  line-height: 1.6875em;
  text-align: left; 
  position: absolute;
  left: 1.5em;
  top: 0.625em;
  z-index: 15;
}

#set-title span {
  font-size: 0.875em;
  font-weight: bold;
  color: #fff;
}

.tab {
  width: 9.9375em;
  height: 1.5em;
  position: absolute;
  top: 0.375em;
  right: 0.6875em;
  z-index: 13;
  cursor: pointer;
  display: none;
}

.tab img {
  width: 9.9375em;
  height: 1.5em;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 13;
}

.tab p {
  width: 8.125em;
  height: 1.5em;
  line-height: 1.5em;
  text-align: right;
  position: absolute;
  right: 0.625em;
  top: 0;
  z-index: 14;
}

.tab span {
  font-size: 0.8125em;
  font-weight: bold;
  color: #fff;
  filter: alpha(Opacity=80); 
  opacity: 0.80;
}

.tab img.on {
  display: none;
}

.tab:hover img.off {
  display: none;
}

.tab:hover img.on {
  display: block;
}

.tab:hover span {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#landing-grid {
  width: 30.125em;
  height: 18.25em;
  list-style: none;
  position: absolute;
  top: 3.1875em;
  left: 1.5em;
  z-index: 15; 
}

#landing-grid li {
  margin: 0 1.25em 1.25em 0;
  width: 8.75em;
  height: 5.25em;
  background: #666;
  opacity: 0.50;
  position: relative;
  float: left;
}

html>/**/body #landing-grid li {
  filter: alpha(Opacity=50); 
}

*+html #landing-grid li {
  background: url(../images/bg_ipglist.png) 0 0 repeat;
}

#landing-grid li.on {
  opacity: 1.0;
}

html>/**/body #landing-grid li.on {
  filter: alpha(Opacity=100); 
}

#landing-grid .thumbnail {
  width: 8.75em;
  height: 5.25em;
  filter: alpha(Opacity=50)\9; 
  position: absolute;
  top: -0.125em;
  left: -0.125em;
  border: transparent 0.125em solid;
}

#landing-grid li.on .thumbnail, #landing-grid li.on:hover .thumbnail {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
  border-color: #fff;
}

#landing-grid li:hover .thumbnail {
  border-color: #999;
}

#landing-grid .direct-add {
  width: 8.75em;
  height: 5.25em;
  filter: alpha(Opacity=50)\9; 
  position: absolute;
  top: -0.125em;
  left: -0.125em;
  border: transparent 0.125em solid;
}

#landing-grid li.on .direct-add, #landing-grid li.on:hover .direct-add {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
  border-color: #fff;
}

#landing-grid li:hover .direct-add {
  border-color: #999;
}

#landing-grid li.on:hover .btn-preview {
  display: block;
}

#branding-logo {
  width: 6.75em;
  height: 3.5em;
  position: absolute;
  left: 1.5625em;
  bottom: 3.1875em;
  z-index: 13;
}

#sg-elements, #branding-elements {
  display: none;
}

#set-view {
  display: none;
}

#ch-view {
  width: 31.75em;
  height: 22.125em;
  height: 22.6875em;
  background: url(../images/bg_layer.png) 0 0 repeat;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 12;
  display: none;
}

#win-preview {
  width: 30.625em;
  height: 18.375em;
  background: #111;
  overflow: hidden;
  position: absolute;
  top: 0.5625em;
  left: 0.5625em;
}

#win-preview .screenshot {
  width: 30.625em;
/*  height: 18.375em;*/
  position: absolute;
  top: -1.5em;
  left: 0;
}

#win-preview .btn-preview {
  width: 5em;
  height: 4.25em;
  position: absolute;
  top: 7.0625em;
  left: 12.8125em;
  z-index: 14;
  cursor: pointer;
  display: none;
}

#win-preview:hover .btn-preview {
  display: block;
}

#fb-insert {
  padding: 0 0 0 3.25em;
  width: 26.5em;
  height: 2.75em;
  text-align: left;
  position: absolute;
  top: 19.375em;
  left: 0.9375em;
  overflow: hidden;
  display: none;
}

#fb-insert span {
  display: block;
}

#fb-photo {
  width: 2.25em;
  height: 2.25em;
  position: absolute;
  top: 0.25em;
  left: 0.25em;
}

#fb-friend {
  height: 1.5em;
  font-size: 0.75em;
  font-weight: bold;
  line-height: 1.5em;
  color: #ff9900;
}

#fb-recommend {
  font-size: 0.6875em;
  color: #fff;
}

#ep-share {
  width: 26.5em;
  height: 2.75em;
  text-align: left;
  position: absolute;
  top: 19.375em;
  left: 0.9375em;
  overflow: hidden;
}

#ep-share span {
  display: block;
}

#ep-sharetitle {
  height: 1.5em;
  font-size: 0.75em;
  font-weight: bold;
  line-height: 1.5em;
  color: #ff9900;
}

#ep-sharedesc {
  font-size: 0.6875em;
  color: #fff;
}


#sg-title {
  width: 7.6875em;
  height: 3.125em;
  text-align: left;
  text-shadow: 0 0.125em 0.125em #000;
  position: absolute;
  top: 1.875em;
/*  top: 2em;*/
  left: 1.5625em;
  z-index: 13;
  overflow: hidden;
}

#sg-title span {
  display: block;
}

#sg-user {
  font-size: 1.0625em;
  font-weight: bold;
  color: #ff9900;
}

#sg-title span#greeting-text {
  color: #fff;
  display: none; 
}

#sg-title span#btn-smart-guide {
  width: 7.6875em;
  height: 1.25em;
  color: #fff;
  cursor: pointer;
  display: none;
}

#sg-title.landing-mode span#greeting-text {
  display: block;
}

#sg-title.sg-mode span#btn-smart-guide {
  display: block;
}

#icon-sg {
  margin: 0.25em 0 0 0.3125em;
  width: 1em;
  height: 0.8125em;
  vertical-align: top;
  filter: alpha(Opacity=50); 
  opacity: 0.50;
}

#btn-smart-guide:hover #icon-sg {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

.btn-big {
  width: 7.6875em;
  height: 3em;
  font-weight: bold;
  color: #fff;
  line-height: 1.125em;
  text-align: left;
  text-shadow: 0 0.125em 0.125em #333;
/*  border: #0474b0 1px solid;*/
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  background: url(../images/btn_big_off.gif) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#4aa8df, endColorstr=#0272ae);
  -moz-box-shadow: 0 0.125em 0.3125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.3125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.3125em #000; /* Opera 10.5, IE 9.0 */
  cursor: pointer;
}

.btn-big:hover {
  background: url(../images/btn_big_on.gif) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#71c6f7, endColorstr=#1188c9);
}

#btn-follow {
  position: absolute;
  left: 1.5625em;
  top: 6.375em;
  z-index: 13;
}

#btn-add-channels {
  position: absolute;
  left: 1.5625em;
  top: 6.375em;
  z-index: 13;
}

#btn-follow span {
  font-size: 0.875em;
  position: absolute;
  top: 0.5em;
  left: 1.875em;
  z-index: 13;
}

#btn-add-channels span {
  font-size: 0.9375em;
  position: absolute;
  top: 0.4375em;
  left: 2.4375em;
}

#icon-follow {
  width: 1.0625em;
  height: 1em;
  position: absolute;
  top: 0.625em;
  left: 0.3125em;
  z-index: 13;
}

#icon-add {
  width: 1.5625em;
  height: 1.5625em;
  position: absolute;
  top: 0.625em;
  left: 0.375em;
  z-index: 13;
}

#follow-hint {
  width: 7.6875em;
  text-align: left;
  line-height: 0.875em;
  position: absolute;
  left: 1.9375em;
  top: 10em;
  z-index: 13;
}

#follow-hint span {
  font-size: 0.75em;
  color: #fff;
}

#btn-edit {
  width: 4.25em;
  height: 1.3125em;
  position: absolute;
  top: 1.75em;
  right: 5.125em;
  z-index: 13;
  display: none;
}

#btn-edit:hover {
  cursor: pointer;
}

#btn-edit #bg-off, #btn-edit #bg-on {
  width: 4.25em;
  height: 1.3125em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 13;
}

#btn-edit #bg-on {
  display: none;
}

#btn-edit:hover #bg-off {
  display: none;
}

#btn-edit:hover #bg-on {
  display: block;
}

#icon-edit {
  width: 0.8125em;
  height: 0.8125em;
  filter: alpha(Opacity=60); 
  opacity: 0.6;
  position: absolute;
  top: 0.25em;
  left: 0.625em;
  z-index: 14;
}

#btn-edit:hover #icon-edit {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#btn-edit #edit-txt {
  width: 2em;
  height: 1.3125em;
  line-height: 1.125em;
  text-align: left;
  position: absolute;
  top: 0;
  left: 1.6875em;
  z-index: 15;
}

#btn-edit #edit-txt span {
  font-size: 0.75em;
  font-weight: bold;
  color: #fff;
  filter: alpha(Opacity=60); 
  opacity: 0.6;
}

#btn-edit:hover #edit-txt span {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#channel-info {
  width: 7.875em;
  height: 18.4375em;
  text-align: left;
  overflow: hidden;
  position: absolute;
  top: 4.4375em;
  right: 1.5625em;
  z-index: 13;
/*  display: none;*/
}

#channel-info p {
  margin: 0 0 0.75em 0;
  line-height: 0.875em;
}

#section-title span {
  font-size: 0.75em;
  font-weight: bold;
  color: #ff9900;
}

#channel-title span {
  font-size: 0.75em;
  font-weight: bold;
  color: #fff;
}

#channel-description span {
  font-size: 0.6875em;
  color: #fff;
  line-height: 0.75em;
}

#eps-number, #updates {
  font-size: 0.6875em;
  color: #ccc;
  filter: alpha(Opacity=70); 
  opacity: 0.7; 
}

#ch-set {
  filter: alpha(Opacity=70); 
  opacity: 0.7; 
  display: none;
}

#ch-set span {
  font-size: 0.6875em;
  color: #ccc;
  line-height: 0.75em;
}

/* Add Content */
#add-content {
  width: 53.75em;
  height: 30em;
  text-align: left;
  background: url(../images/bg_add.png) 0 0 repeat;
  border: #333 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 4em;
  left: 5.0625em;
  display: none;
}

#add-col {
  padding: 1.25em 0.9375em 0 0.9375em;
  width: 9.0625em;
  height: 28.75em;
  background: url(../images/bg_panel.png) 0 0 repeat;
  border-right: #333 1px solid;
  -moz-border-radius: 0 0.3125em 0.3125em 0;
  -webkit-border-radius: 0 0.3125em 0.3125em 0;
  border-radius: 0 0.3125em 0.3125em 0;
  position: absolute;
  top: 0;
  left: 0;
}

#add-content h2 {
  padding: 0 0 1.167em 0;
  font-size: 1.125em;
  font-weight: bold;
  color: #ff9900;
}

#add-content h3 {
  padding: 0 0 0.71em 0;
  font-size: 0.875em;
  font-weight: bold;
  color: #fff;
}

.option-list {
  padding: 0 0 0.9375em 0;
  list-style: none;
}

.option-list li {
  margin: 0 0 0.3125em 0;
  padding: 0 0 0 0.5em;
  height: 1.125em;
  line-height: 0.875em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  cursor: pointer;
}

.option-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat; 
}

.option-list li.on, .option-list li.on:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
  background: -moz-linear-gradient(top,  #fff,  #ccc);
  filter: alpha(Opacity=90); 
  opacity: 0.9; 
}

.option-list li span {
  font-size: 0.75em;
  color: #8997a0;
  line-height: 1.5em;
}

.option-list li:hover span {
  color: #fff;
}

.option-list li.on span, .option-list li.on:hover span {
  color: #333;
}

.option-list li.selected span, .option-list li.selected:hover span {
  color: #ff9900;
}

#search-box {
  width: 9.0625em;
  height: 1.25em;
  background: url(../images/bg_input.png) 0 0 repeat;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  bottom: 1.5625em;
  left: 0.9375em;
}

#search-box:hover, #search-box.on {
  background: #fff;
}

#search-field {
  font-size: 0.75em;
  color: #fff;
  border: none;
  background: none;
  filter: alpha(Opacity=50); 
  opacity: 0.5; 
  position: absolute;
  top: 0;
  right: 1px;
  z-index: 12;
}

#search-box:hover #search-field, #search-box.on #search-field {
  color: #000;
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#icon-search {
  width: 1.3125em;
  height: 0.8125em;
  position: absolute;
  left: 0;
  top: 0.25em;
  z-index: 10;
}

#icon-search-off, #icon-search-on {
  width: 0.8125em;
  height: 0.8125em;
  position: absolute;
  left: 0.25em;
  top: 0;
}

#icon-search-off {
  display: block;
}

#icon-search-on {
  display: none;
}

#search-box:hover #icon-search-off, #search-box.on #icon-search-off {
  display: none;
}

#search-box:hover #icon-search-on, #search-box.on #icon-search-on {
  display: block;
}

#search-filter {
  width: 9.0625em;
  background: #fff;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  -moz-box-shadow: 0 0.125em 0.125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.125em #000; /* Opera 10.5, IE 9.0 */
  background: -moz-linear-gradient(100% 100% 90deg, #e5e5e5, #fff);
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#e5e5e5));
  background: -webkit-linear-gradient(#fff, #e5e5e5);  /* Safari 5.1+, Chrome 10+ */ 
  background: -o-linear-gradient(#e5e5e5, #fff);/* Opera 11.10+ */ 
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffffff, endColorstr=#e5e5e5);
  position: absolute;
  bottom: 3em;
  left: 0.9375em;
  z-index: 13;
  display: none;
}

#add-col ul#filter-list {
  padding: 0.375em 0.375em 0.125em 0.375em;
  list-style: none;
}

#filter-list li {
  margin: 0 0 0.25em 0;
  padding: 0;
  height: 1.125em;
  line-height: 0.875em;
  color: #000;
  cursor: pointer;
}

#filter-list li:hover {
  background: #bfdfef;
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#filter-list li span {
  font-size: 0.75em;
  color: #000;
  line-height: 1.5em;
  display: inline-block;
}

.checkbox {
  margin: 0 0.5em;
  width: 0.9375em;
  height: 0.9375em;
  position: relative;
}

.checkbox img {
  width: 0.9375em;
  height: 0.9375em;
  position: absolute;
  top: 0.125em;
  left: 0;
}

.search-check-on {
  display: none;
}

#filter-list li.selected .search-check-off {
  display: none;
}

#filter-list li.selected .search-check-on {
  display: block;
}

.input-content {
  width: 39.625em;
  height: 27.5em;
  position: absolute;
  left: 12.5em;
  top: 1.25em;
  display: none;
}

.account-connector{
  width: 39.625em;
  height: 1.75em;
  overflow: hidden;
}

.account-connector p {
  color: #fff;
  line-height: 1.5em;
  float: left;
}

.account-connector span {
  font-size: 0.75em;
}

.input-content p.btn-blue {
  margin: 0 0 0 0.625em;
  height: 1.25em;
  line-height: 1.25em;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
}

.input-content p.btn-blue span {
  font-size: 0.75em;
  line-height: 1.67em;
  display: block;
}

.spliter {
  margin: 0.75em 0 1.25em 0;
  height: 1.125em;
  color: #fff;
  list-style: none;
}

.spliter li {
  float: left;
}

.spliter li.line {
  width: 40%;
  height: 1.125em;
  background: url(../images/bg_line.png) 0 center repeat-x;
}

.spliter li.word {
  width: 20%;
  height: 1.125em;
  text-align: center;
}

.spliter li.word span {
  font-size: 1.125em;
}

.url-input {
  width: 39.5em;
  height: 1.875em;
  background: url(../images/bg_input.png) 0 0 repeat;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: relative;
}

.url-input .url-field {
  padding: 0 0 0 0.41em;
  width: 97%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  color: #fff;
  filter: alpha(Opacity=80); 
  opacity: 0.8;
  background: none;
  border: none;
  position: absolute;
  top: 1px;
  left: 5px;
}

.url-input.on, .url-input:hover {
  background: #fff;
}

.url-input.on .url-field, .url-input:hover .url-field {
  color: #000;
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

.note {
  padding: 0.54em 0 0 0.9em;
  font-size: 0.6875em;
  color: #fff;
}

.cate-selector {
  margin: 1.5em 0 0 0;
  width: 41em;
  color: #fff;
  overflow: hidden;
}

.cate-list {
  padding: 0.625em 0.3125em;
  list-style: none;
}

.cate-selector p {
  font-size: 0.75em;
}

.cate-list li {
  margin: 0 0.625em 0 0;
  padding: 0.3125em 0 0.3125em 1.5625em;
  width: 7.5em;
  height: 0.9375em;
  line-height: 0.8125em;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  float: left;
  position: relative;
  cursor: pointer;
}

.cate-list li.on, .cate-list li.on:hover {
  color: #000;
  background: url(../images/bg_chdir.png) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  background: #fff\9;
}

.check-on, .check-off {
  width: 0.9375em;
  height: 0.9375em;
  position: absolute;
  top: 0.3125em;
  left: 0.3125em;
}

.check-on {
  display: none;
}

.cate-list li.selected .check-on {
  display: block;
}

.cate-list li.selected .check-off {
  display: none;
}

.cate-list li span {
  font-size: 0.75em;
}

.cate-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat;
}

.tag-input {
  margin: 1.25em 0 0 0;
  width: 19.375em;
  height: 3.5em;
  background: url(../images/bg_input.png) 0 0 repeat;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: relative;
}

.tag-input .tag-field {
  padding: 0 0 0 0.73em;
  width: 97%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  line-height: 1.5em;
  color: #fff;
  filter: alpha(Opacity=80); 
  opacity: 0.8;
  background: none;
  border: none;
  position: absolute;
  top: 1px;
  left: 1px;
}

.tag-input.on, .tag-input:hover {
  background: #fff;
}

.tag-input.on .tag-field, .tag-input:hover .tag-field {
  color: #000;
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

/* Submission */
#submission {
  width: 39.625em;
  height: 2.125em;
  background: url(../images/bg_line.png) 0 0 repeat-x;
  position: absolute;
  left: 12.5em;
  bottom: 1.375em;
  z-index: 12;
  display: none;
}

#submission ul {
  text-align: right;
  list-style: none;
}

#submission li {
  margin: 0.8125em 0 0 0.5em;
  display: inline-block;
}

#submission .btn {
  width: 8em;
}

#feedback {
  padding: 0.25em 0.625em 0.25em 0;
  width: 22em;
  color: #fff;
  overflow: hidden;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 13;
  display: none;
}

#add-feedback, #fch-feedback {
  margin: 0.9375em 0 0 0;
  padding: 0.25em 0.625em 0.25em 0;
  width: 15em;
  color: #fff;
  overflow: hidden;
  display: none;
}


#feedback img, #add-feedback img, #fch-feedback img {
  margin: 0 0.5em 0 0;
  width: 1.125em;
  height: 1.125em;
  display: block;
  float: left;
}

#feedback span, #add-feedback span, #fch-feedback span {
  height: 1.5em;
  font-size: 0.75em;
  line-height: 1.5em;
  float: left;
}

.success span  {
  color: #00cc00;
}

.fail span {
  color: #cc0000;
}

#feedback.success img, #feedback.fail img, #add-feedback.success img, #add-feedback.fail img, #fch-feedback.success img, #fch-feedback.fail img, #fset-feedback.success img, #fset-feedback.fail img {
  display: none;
}

/* Channel Directory */
#dir-waiting {
  margin: -3.1875em 0 0 -3.5em;
  padding: 1em 2em;
  width: 14em;
  height: 2.25em;
  line-height: 2.25em;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 50;
  display: none;
}

#dir-waiting img {
  margin: 0 1em 0 0;
  width: 2.25em;
  height: 2.25em;
  vertical-align: top;
}

#dir-waiting p {
  display: inline-block;
}

*+html #dir-waiting p {
  display: inline;
}

#dir-waiting span {
  font-size: 1.5em;
  color: #fff;
}

#ch-waiting, #fch-waiting, #fset-waiting {
  margin: -4.5em 0 0 7.5em;
  padding: 1em;
  width: 6em;
  height: 5em;
  text-align: center;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 50;
  display: none;
}

#fch-waiting {
  margin: -4.5em 0 0 -16.375em;
}

#fset-waiting {
  margin: -4.5em 0 0 -11.25em;
}

#ch-waiting img, #fch-waiting img, #fset-waiting img {
  width: 3em;
  height: 3em;
}

#ch-waiting p, #fch-waiting p, #fset-waiting p {
  margin: 0.875em 0 0 0;
  line-height: 0.875em;
}

#ch-waiting span, #fch-waiting span, #fset-waiting span {
  font-size: 0.875em;
  color: #fff;
}


#cat-col {
  padding: 0.25em 0 0 0;
  width: 10.5em;
  height: 24em;
  border-right: #6a8fa6 1px solid;
  position: absolute;
  top: 2.5em;
  left: 0;
}

#ch-col {
  padding: 0.25em 0 0 0;
  width: 12.5em;
  height: 24em;
  border-right: #6a8fa6 1px solid;
  position: absolute;
  top: 2.5em;
  left: 10.625em;
  display: none;
}

#preview-col {
  padding: 0.25em 0 0 0;
  width: 16em;
  height: 24em;
  position: absolute;
  top: 2.5em;
  left: 23.25em;
  display: none;
}

#cat-list {
  margin: 0 0.25em 0 0;
  list-style: none;
}

#cat-list li {
  margin: 0 0.375em 0.125em 0;
  padding: 0 0 0 0.3125em;
  height: 1.25em;
  line-height: 1.125em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  cursor: pointer;
  position: relative;
}

#cat-list li.on, #cat-list li.on:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
  background: -moz-linear-gradient(top,  #fff,  #ccc);
}

#cat-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat;
}

#cat-list li span {
  font-size: 0.6875em;
  color: #fff;
}

#cat-list li.on span, #cat-list li.on:hover span {
  /*color: #d85600;*/
  color: #333;
}

#cat-list li.selected, #cat-list li.selected:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#cat-list li.selected span, #cat-list li.selected:hover span {
  color: #ff9900;
}

#cat-list span.arrow {
  width: 0.71em;
  height: 0.86em;
  line-height: 0.71em;
  font-size: 1.3125em;
  position: absolute;
  top: 0.0625em;
  right: 0;
  display: none;
}

#cat-list li.selected span.arrow, #cat-list li.on span.arrow {
  display: block;
}

#ch-constrain {
  width: 12.5em;
  height: 23.5625em;
  overflow: hidden;
}

#arrow-up {
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  top: -0.875em;
  left: 5.375em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#arrow-down {
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  bottom: -0.625em;
  left: 5.375em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#arrow-up:hover, #arrow-down:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#ch-list {
  margin: 0 0.875em 0 0.8125em;
  list-style: none;
}

#ch-list li {
  margin: 0 0 0.285em 0;
  width: 10.8125em;
  height: 3.125em;
  line-height: 0.8125em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  cursor: pointer;
  position: relative;
}

#ch-list li.on, #ch-list li.on:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
  background: -moz-linear-gradient(top,  #fff,  #ccc);
}

#ch-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat;
}

#ch-list .thumb {
  width: 3.75em;
  height: 2.25em;
  border: #333 0.1875em solid;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  position: absolute;
  top: 0.3125em;
  left: 0.25em;
}

#ch-list li.selected .thumb {
  border-color: #fff;
}

#ch-list li p {
  width: 5.625em;
  height: 2em;
  position: absolute;
  top: 0.5em;
  left: 4.75em;
  overflow: hidden;
}

#ch-list li span {
  font-size: 0.6875em;
  color: #fff;
}

#ch-list li.on span, #ch-list li.on:hover span {
  color: #000;
}

#ch-list li:hover span {
  color: #fff;
}

#ch-list li.selected span, #ch-list li.selected:hover span {
  color: #ff9900;
}

#preview-box {
  width: 14.0625em;
  height: 8.4375em;
  border: #333 0.3125em solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 0.25em;
  left: 0.75em;
}

#preview-box .thumb {
  width: 14.0625em;
  height: 8.4375em;
}

#preview-box .btn-preview {
  width: 2.875em;
  height: 2.5em;
  position: absolute;
  left: 5.6em;
  top: 2.97em;
  z-index: 45;
  display: none;
  cursor: pointer;
}

#preview-box:hover .btn-preview {
  display: block;
}

#preview-info {
  width: 14.0625em;
  position: absolute;
  top: 9.875em;
  left: 1.3125em;
}

#preview-info #ch-title {
  margin: 0 0 0.5em 0;
}

#preview-info #ch-title span {
  font-size: 0.875em;
  font-weight: bold;
  color: #ff9900;
  color: #fff;
}

#preview-info #ch-meta {
  margin: 0 0 1.25em 0;
  filter: alpha(Opacity=70); 
  opacity: 0.7;
}

#preview-info #ch-meta span {
  font-size: 0.6875em;
  color: #fff;
  line-height: 1.5em;
  display: block;
}

#preview-info .btn {
  width: 10em;
}

#preview-info .btn-blue {
  margin: 0 0 0.75em 0;
  padding: 0;
  width: 10em;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  position: relative;
}

.icon-follow {
  width: 0.65em;
  height: 0.65em;
  position: absolute;
  top: 0.3125em;
  left: 0.65em;
  z-index: 13;
}

/* Featured Channels */
#preview-col-fch {
  padding: 0.25em 0 0 0;
  width: 15.75em;
  height: 24em;
  position: absolute;
  top: 2.5em;
  left: 0;
}

#preview-box-fch {
  width: 14.0625em;
  height: 8.4375em;
  border: #333 0.3125em solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 0.25em;
  left: 0;
}

#preview-box-fch .thumb {
  width: 14.0625em;
  height: 8.4375em;
}

#preview-box-fch .btn-preview {
  width: 2.875em;
  height: 2.5em;
  position: absolute;
  left: 5.6em;
  top: 2.97em;
  z-index: 45;
  display: none;
  cursor: pointer;
}

#preview-box-fch:hover .btn-preview {
  display: block;
}

#preview-info-fch {
  width: 14.0625em;
  position: absolute;
  top: 9.875em;
  left: 0.5625em;
}

#preview-info-fch #fch-title {
  margin: 0 0 0.5em 0;
}

#preview-info-fch #fch-title span {
  font-size: 0.875em;
  font-weight: bold;
  color: #ff9900;
  color: #fff;
}

#preview-info-fch #fch-meta {
  margin: 0 0 1.25em 0;
  filter: alpha(Opacity=70); 
  opacity: 0.7;
}

#preview-info-fch #fch-meta span {
  font-size: 0.6875em;
  color: #fff;
  line-height: 1.5em;
  display: block;
}

#preview-info-fch .btn {
  width: 10em;
}

#preview-info-fch .btn-blue {
  margin: 0 0 0.75em 0;
  padding: 0;
  width: 10em;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  position: relative;
}

#fch-col {
  padding: 0.25em 0 0 0.375em;
  width: 24em;
  height: 24em;
  border-left: #6a8fa6 1px solid;
  position: absolute;
  top: 2.5em;
  left: 15.875em;
}

#fch-arrow-up {
  width: 1.75em;
  height: 1.125em;
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  top: -0.875em;
  left: 11.5em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#fch-arrow-down {
  width: 1.75em;
  height: 1.125em;
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  bottom: -0.625em;
  left: 11.5em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#fch-arrow-up:hover, #fch-arrow-down:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#fch-constrain {
  width: 12.5em;
  width: 24em;
  height: 23.5625em;
  overflow: hidden;
}

#fch-list {
  margin: 0 0 0 0.8125em;
  width: 24em;
  list-style: none;
}

#fch-list li {
  margin: 0 0.9375em 0.28em 0;
  width: 10.8125em;
  height: 3.125em;
  line-height: 0.8125em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  float: left;
  cursor: pointer;
  position: relative;
}

#fch-list li.on, #fch-list li.on:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
  background: -moz-linear-gradient(top,  #fff,  #ccc);
}

#fch-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat;
}

#fch-list .thumb {
  width: 3.75em;
  height: 2.25em;
  border: #333 0.1875em solid;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  position: absolute;
  top: 0.25em;
  left: 0.25em;
}

#fch-list li.selected .thumb {
  border-color: #fff;
}

#fch-list li p {
  width: 5.25em;
  height: 2em;
  position: absolute;
  top: 0.5em;
  left: 4.75em;
  overflow: hidden;
}

#fch-list li span {
  font-size: 0.6875em;
  color: #fff;
}

#fch-list li.on span, #fch-list li.on:hover span {
  color: #000;
}

#fch-list li:hover span {
  color: #fff;
}

#fch-list li.selected span, #fch-list li.selected:hover span {
  color: #ff9900;
}

/* Featured Sets */
#preview-col-fset {
  width: 26em;
  height: 24.25em;
  position: absolute;
  top: 2.5em;
  left: 0;
}

#preview-box-fset {
  width: 28.8em;
  height: 18.15em;
  position: relative;
}

#preview-box-fset .bg-set {
  width: 25.4em;
  height: 18.15em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 42;
}

#preview-box-fset .set-title {
  width: 14.5em;
  height: 1.5em;
  line-height: 1.5em;  
  position: absolute;
  left: 1.2em;
  top: 0.5em;
  z-index: 43;
  overflow: hidden;
}

#preview-box-fset .set-title span {
  font-size: 0.875em;
  font-weight: bold;
  color: #fff;
}

#preview-box-fset ul {
  width: 24.1em;
  height: 14.6em;
  list-style: none;
  position: absolute; 
  top: 3.1875em;
  left: 1.5em;
  top: 2.55em;
  left: 1.2em;
  z-index: 44;  
}

#preview-box-fset li {
  margin: 0 1em 1em 0;
  width: 7em;
  height: 4.2em;
  background: #666;
  opacity: 0.50;
  position: relative;
  float: left;
}

html>/**/body #preview-box-fset li {
  filter: alpha(Opacity=50); 
}

*+html #preview-box-fset li {
  background: url(../images/bg_ipglist.png) 0 0 repeat;
}

#preview-box-fset li.on {
  opacity: 1.0;
}

html>/**/body #preview-box-fset li.on {
  filter: alpha(Opacity=100); 
}

#preview-box-fset .thumbnail {
  width: 7em;
  height: 4.2em;
  filter: alpha(Opacity=50)\9; 
  position: absolute;
  top: -0.125em;
  left: -0.125em;
  border: transparent 0.125em solid;
}

#preview-box-fset li.on .thumbnail {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
  border-color: #fff;
}

#preview-box-fset li:hover img.thumbnail {
  border-color: #999;
}

#preview-box-fset li.on:hover img.thumbnail {
  border-color: #fff;
}

#preview-box-fset .btn-preview {
  width: 2.25em;
  height: 1.9em;
  position: absolute;
  top: 1.15em;
  left: 2.35em;
  z-index: 45;
  cursor: pointer;
  display: none;
}

#preview-box-fset li.on:hover .btn-preview {
  display: block;
}

#preview-info-fset {
  width: 13em;
  height: 6em;
  position: absolute;
  top: 18.75em;
  left: 1.3125em;
  overflow: hidden;
}

#ch-title-on {
  margin: 0 0 0.5em 0;
}

#ch-title-on span {
  font-size: 0.875em;
  font-weight: bold;
  color: #ff9900;
  color: #fff;
}

#fset-meta {
  filter: alpha(Opacity=70); 
  opacity: 0.7;
}

#fset-meta span {
  font-size: 0.6875em;
  color: #fff;
  line-height: 1.5em;
  display: block;
}

#preview-action-fset {
  width: 9.5em;
  position: absolute;
  left: 15.25em;
  top: 19em;
}

#preview-action-fset .btn {
  width: 9em;
}

#preview-action-fset .btn-blue {
  margin: 0 0 0.75em 0;
  padding: 0;
  width: 9em;
  -moz-border-radius: 0.1875em;
  -webkit-border-radius: 0.1875em;
  border-radius: 0.1875em;
  position: relative;
}

#preview-action-fset .icon-follow {
  width: 0.65em;
  height: 0.65em;
  position: absolute;
  top: 0.3125em;
  left: 1em;
  z-index: 43;
}

#fset-feedback {
  padding: 0.25em 0;
  width: 10em;
  color: #fff;
  line-height: 0.9375em;
  position: absolute;
  left: 15.25em;
  top: 22.5em;
  display: none;
}

#fset-feedback img {
  width: 1.125em;
  height: 1.125em;
  position: absolute;
  top: 0.125em;
  left: 0;
  z-index: 45;
}

#fset-feedback span {
  padding: 0 0 0 2.15em;
  font-size: 0.75em; 
  display: block;
}

#fset-feedback.success span, #fset-feedback.fail span {
  padding: 0;
}

#fset-col {
  padding: 0.25em 0 0 1.375em;
  width: 11em;
  height: 24em;
  border-left: #6a8fa6 1px solid;
  position: absolute;
  top: 2.5em;
  left: 26.625em; 
}

#fset-arrow-up {
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  top: 0;
  left: 6.1875em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#fset-arrow-down {
  width: 1.375em;
  height: 0.875em;
  position: absolute;
  bottom: 0;
  left: 6.1875em;
  filter: alpha(Opacity=20); 
  opacity: 0.2;
  cursor: pointer;
}

#fset-arrow-up:hover, #fset-arrow-down:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#fest-constrain {
  margin: 0.875em 0 0 0;
  width: 11em;
  height: 22em;
  overflow: hidden;
}

#fset-list {
  width: 11em;
  list-style: none;
}

#fset-list li {
  margin: 0 0 0.5em 0;
  width: 11em;
  height: 7em;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  cursor: pointer;
  filter: alpha(Opacity=90); 
  opacity: 0.9; 
  position: relative;
}

#fset-list li.on, #fset-list li.on:hover {
  background: #fff;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc');
  background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc));
  background: -moz-linear-gradient(top,  #fff,  #ccc);
}

#fset-list li:hover {
  background: url(../images/bg_hover.png) 0 0 repeat;
}

.fset {
  width: 6.5em;
  height: 4.8125em;
  position: absolute;
  top: 0.625em;
  left: 2.25em;
}

.bg-fset {
  width: 6.5em;
  height: 4.8125em;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 40;
}

.fset-grid {
  width: 6.125em;
  list-style: none;
  position: absolute;
  left: 0.4375em;
  top: 0.8125em;
  z-index: 41;
}

#fset-list .fset-grid li {
  margin: 0 0.25em 0.25em 0;
  padding: 0;
  width: 1.75em;
  height: 1.0625em;
  background: #666;
  position: relative;
  float: left;
}

#fset-list .fset-grid li:hover {
  background: none;
}

.fset-grid img {
  width: 1.75em;
  height: 1.0625em;
  position: absolute;
  opacity: 1.0;
  top: 0;
  left: 0;
}

.fset-title {
  padding: 0 0.5em;
  width: 10em;
  height: 1.125em;
  line-height: 0.9375em;
  text-align: center;
  overflow: hidden;
  position: absolute;
  top: 5.5625em;
  left: 0;
}

.fset-title span {
  font-size: 0.75em;
  color: #fff;
}
#fset-list li.on .fset-title span, #fset-list li.on:hover .fset-title span {
  color: #000;
}


/* Signin Layer */

#signin-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 40;
  display: none;
}

#btn-winclose {
  width: 0.875em;
  height: 0.875em;
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  z-index: 21;
  cursor: pointer;
}

#btn-winclose img {
  width: 0.875em;
  height: 0.875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5; 
}

#btn-winclose.on img, #btn-winclose:hover img {
  filter: alpha(Opacity=100); 
  opacity: 1.0; 
}

#signin-holder {
  margin: -11.25em 0 0 -15.6875em;
  width: 31.25em;
  height: 22.5em;
  color: #fff;
  text-align: left;
  background: #222;
  border: #555 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
}

#tab-list {
  padding: 1em 1.75em 0 0;
  width: 31.25em;
  height: 2em;
  list-style: none;
  border: none;
  overflow: hidden;
  border-bottom: #444 1px solid;
}

#tab-list li {
  padding: 0 1.75em;
  border-right: #444 1px solid;
  cursor: pointer;
  float: left;
}

#tab-list h2 {
  font-size: 1.125em;
  font-weight: bold;
  color: #555;
}

#tab-list li:hover h2 {
  color: #999;
}

#tab-list li.on h2, #tab-list li.on:hover h2 {
  color: #ff9900;
}

.input-panel {
  padding: 0 0 0 1.75em;
  border: none;
  position: relative;
}

#signup-panel {
  display: none;
}

.input-list {
  margin: 1.25em 0;
  width: 13.5em;
  list-style: none;
}

.input-list li {
  padding: 0 0 0.5em 0;
}

.input-list span {
  font-size: 0.75em;
}

.signin-input {
  margin: 0.1875em 0.3125em 0 0;
  width: 12.25em;
  height: 1.3125em;
  background: #444;
  border: #666 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: relative;
}

.signin-field {
  width: 97%;
  font-size: 0.75em;
  color: #999;
  background: #444;
  border: none;
  position: absolute;
  top: 1px;
  left: 4px;
}

.signin-input.on, .signin-input:hover {
  background: #fff;
}

.signin-input.on .signin-field, .signin-input:hover .signin-field {
  color: #000;
  background: #fff;
}

#signin-layer .btn {
  margin: 0.9375em 0 0.3125em 0;
  width: 6em;
}

#encouragement {
  padding: 0.125em 0 0 1.5em;
  width: 12.25em;
  height: 16.5em;
  border-left: #444 1px dotted;
  position: absolute;
  top: 0;
  left: 16em;
}

#encouragement span {
  font-size: 0.75em;
}

#signup-triger {
  padding: 0.625em 0 0 0;
  cursor: pointer;
  display: inline-block;
  position: relative;
}

#triger-txt {
  padding: 0 0 0 0.375em;
  color: #3c708f;
}

#signup-triger:hover #triger-txt {
  color: #47a6de;
}

#triger-icon {
  width: 1.75em;
  height: 1.75em;
  vertical-align: middle;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#signup-triger:hover #triger-icon {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#signup-tip {
  padding: 0.5em 0.75em 0.75em 0.75em;
  width: 10.75em;
  line-height: 0.9375em;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  background: #444;
  -moz-box-shadow: 0 0.125em 0.125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.125em #000; /* Opera 10.5, IE 9.0 */
  position: absolute;
  top: 3.125em;
  left: -0.625em;
  z-index: 45;
  display: none;
}

#signup-triger:hover #signup-tip {
  display: block;
}

#signup-tip span {
  font-size: 0.6875em;
  color: #fff;
}

#signup-tip span.arrow {
  padding: 0;
  width: 0;
  height: 0;
  background: none;
  border-color: transparent transparent #999  transparent;
  border-style: dashed;
  border-bottom-style: solid;
  border-width: 0.625em;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  position: absolute;
  top: -1.25em;
  left: 1.4375em;
}

/* Video Control */

#control-layer {
  width: 100%;
  height: 1.75em;
  background: #000;
  position: absolute;
  bottom: 9.5em;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: none;
}

*+html #control-layer {
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#4d4d4d, endColorstr=#000);
}

#controler-bg {
  width: 100%;
  height: 1.75em;
  left: 0;
  top: 0;
  z-index: 21;
}

*+html #controler-bg {
  display: none;
}

#control-bar {
  width: 100%;
  height: 1.75em;
  list-style: none;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 23;
  overflow: hidden;
}

#control-bar li {
  float: left;
}

#control-bar li#btn-replay {
  margin: 0.4375em 0 0 1em;
  float: right;
}

#btn-replay img {
  width: 0.9375em;
  height: 0.9375em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-replay.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-rewind {
  margin: 0.4375em 0 0 1em ;
  float: right;
}

#btn-rewind img {
  width: 1.3125em;
  height: 0.9375em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-rewind.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-play {
  margin: 0.25em 0 0 1em;
  float: right;
}

#btn-play img {
  width: 1em;
  height: 1.1875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-play.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-pause {
  margin: 0.25em 0 0 1em;
  float: right;
  display: none;
}

#btn-pause img {
  width: 1em;
  height: 1.1875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-pause.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-forward {
  margin: 0.4375em 0 0 1em;
  float: right;
}

#btn-forward img {
  width: 1.3125em;
  height: 0.9375em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-forward.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#instruction {
  margin: 0 0 0 1em;
  line-height: 1.5em;
}

#instruction span {
  font-size: 0.75em;
  color: #fff;
}

.divider {
  margin: 0.25em 0 0 0;
  width: 1px;
  height: 1.3125em;
  background: #555;
}

#control-bar li.divider-r {
  margin: 0.25em 0 0 1em;
  width: 1px;
  height: 1.3125em;
  background: #555;
  float: right;
}

#control-bar li#btn-volume-down {
  margin: 0.4375em 0 0 1em;
  float: right;
}

#btn-volume-down img {
  width: 1.3125em;
  height: 0.935em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-volume-down.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-volume-up {
  margin: 0.4375em 1em 0 0;
  float: right;
}

#btn-volume-up img {
  width: 1.3125em;
  height: 0.935em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-volume-up.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#volume-constrain {
  margin: 0.3125em 0 0 0.5625em;
  width: 3em;
  height: 1.625em;
  float: right;
  position: relative;
}

#volume-bars {
  list-style: none;
  position: absolute;
  top: 0.125em;
  left: 0;
}

#control-bar #volume-bars li {
  margin: 0 0.1875em 0 0;
  width: 0.1875em;
  height: 0.875em;
  background: #666;
  float: left;
}

#control-bar #volume-bars li.on {
  background: #0ca7f9;
}


#control-bar li#btn-sg {
  margin: 0.4375em 0 0 1em;
  float: right;
  position: relative;
}

#btn-sg img {
  width: 1.25em;
  height: 0.9375em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-sg.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li#btn-facebook {
  margin: 0.3125em 0 0 1em;
  float: right;
}

#btn-facebook img {
  width: 1.1875em;
  height: 1.1875em;
  filter: alpha(Opacity=50); 
  opacity: 0.5;
}

#btn-facebook.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#control-bar li.right {
  float: right;
}

#play-time {
  margin: 1.05em 0 0 1.8em;
  width: 7em;
  font-size: 0.625em;
  color: #fff;
  line-height: 0.83em;
  text-align: left;
}

#progress-bar {
  margin: 0.8125em 1em 0 0;
  width: 16em;
  height: 0.25em;
  background: #444;
  position: relative;
  float: right;
}

#loaded {
  width: 50%;
  height: 0.25em;
  background: #666;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 24;
}

#played {
  width: 30%;
  height: 0.25em;
  background: #0ca7f9;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 25;
}

.enlarge {
  font-size: 1.5em;
  line-height: 1em;
}

/* MSG layer */
#msg-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 40;
  display: none;
}


.msg-holder {
  margin: -4.625em 0 0 -12.5625em;
  width: 25em;
/*  height: 4.25em;*/
  background: #222;
  border: #444 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
}

#msg-layer p {
  padding: 0.83em;
  font-size: 1.5em;
  color: #fff;
  text-align: center;
}

/* Yes No layer */
#yesno-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 70;
  display: none;
}

.yesno-holder {
  margin: -6.9625em 0 0 -12.5625em;
  width: 25em;
/*  height: 8.875em;*/
  background: #222;
  border: #444 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
}

#yesno-layer p {
  padding: 1.25em;
  font-size: 1em;
  color: #fff;
  line-height: 1.5em;
  text-align: center;
}

.action-list {
  margin: 0 1em 1.25em 1em;
  padding: 0.9375em 0 0 0;
  border-top: #666 1px solid;
  list-style: none;
  text-align: center;
}

.action-list li {
  margin: 0 0.4375em 0 0;
  display: inline-block;
}

*+html .action-list li {
  display: inline;
}

.action-list li:last-child {
  margin: 0;
}

#yesno-layer .btn {
  width: 6em;
}

/* Rename layer */
#rename-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 70;
  display: none;
}

.rename-holder {
  margin: -6.9625em 0 0 -12.5625em;
  width: 25em;
/*  height: 8.875em;*/
  background: #222;
  border: #444 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
}


#rename-input {
  margin: 1.5em 1.25em 1.5em 1.25em;
  width: 22.5em;
  height: 2em;
  background: url(../images/bg_input.png) 0 0 repeat;
  border: #999 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: relative;
}

#rename-input #rename-field {
  padding: 0 0 0 0.41em;
  width: 97%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
  color: #fff;
  filter: alpha(Opacity=80); 
  opacity: 0.8;
  background: none;
  border: none;
  position: absolute;
  top: 1px;
  left: 5px;
}

#rename-input.on, #rename-input:hover {
  background: #fff;
}

#rename-input.on #rename-field, #rename-input:hover #rename-field {
  color: #000;
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}


#rename-layer .action-list {
  margin: 0 1em 1.25em 1em;
  padding: 0.9375em 0 0 0;
  border-top: #666 1px solid;
  list-style: none;
  text-align: center;
}

#rename-layer .action-list li {
  margin: 0 0.4375em 0 0;
  display: inline-block;
}

*+html #rename-layer .action-list li {
  display: inline;
}

#rename-layer .action-list li:last-child {
  margin: 0;
}

#rename-layer .btn {
  width: 6em;
}

/* Success layer */
#success-layer {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 70;
  display: none;
}

.success-holder {
  margin: -6.5625em 0 0 -16.0625em;
  width: 32em;
/*  height: 13em;*/
  text-align: left;
  background: #222;
  border: #444 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
}

#success-layer p {
  padding: 1.25em;
  color: #fff;
  line-height: 1.125em;
}

#success-layer p span {
  font-size: 0.875em;
}

#success-layer p.greeting {
  padding: 1.5em 1.25em 0 1.25em;
}

#success-layer p.greeting span {
  font-size: 1.5em;
  font-weight: bold;
  color: #ff9900;
}

#success-layer .action-list {
  margin: 0.5em 1em 1.5em 1em;
  padding: 0.9375em 0 0 0;
  border-top: #666 1px solid;
  list-style: none;
  text-align: left;
}

.action-list li {
  margin: 0 0.4375em 0 0;
  display: inline-block;
}

*+html .action-list li {
  display: inline;
}

.action-list li:last-child {
  margin: 0;
}

#success-layer .btn {
  width: 8em;
}

/* Ad Lyaer */

#ad-layer {
  margin: 0 0 0 -28.90625em;
  width: 57.8125em;
  height: 4.875em;
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 30;
  display: none;
}

#ad-panel {
  width: 57.8125em;  
  height: 3.5625em;
  position: absolute;
  bottom: 0;
  left: 0;
}

#ad-title {
  position: absolute;
  left: 5.625em;
  bottom: 1.25em;
}

#ad-title span {
  font-size: 1em;
  font-weight: bold;
  color: #ff9900;
  text-shadow: 0 0.125em 0.125em #333;
}

#featured-set {
  width: 6.5em;
  height: 5.4375em;
  position: absolute;
  left: 15.625em;
  bottom: 0;
}

#bg-featured-set {
  width: 6.5em;
  height: 5.4375em;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 30;
}

#featured-list {
  width: 6.125em;
  list-style: none;
  position: absolute;
  left: 0.4375em;
  top: 0.8125em;
  z-index: 31;
}

#featured-list li {
  margin: 0 0.25em 0.25em 0;
  width: 1.75em;
  height: 1.0625em;
/*  background: #666;
  opacity: 0.50;*/
  position: relative;
  float: left;
}

#featured-list img {
  width: 1.75em;
  height: 1.0625em;
  position: absolute;
  opacity: 1.0;
  top: 0;
  left: 0;
}

#featured-meta {
  width: 18.75em;
  color: #fff;
  line-height: 0.75em;
  text-align: left;
  text-shadow: 0 0.125em 0.125em #333;
  position: absolute;
  left: 23.125em;
  bottom: 0.6875em;
  z-index: 31;
}

#featured-title {
  margin: 0 0 0.3125em 0;
  font-size: 0.75em;
  font-weight: bold;
  display: inline-block;
}

#featured-brief {
  font-size: 0.6875em;
}

#btn-add-featured {
  width: 7em;
  height: 1.9375em;
  text-align: center;
  position: absolute;
  left: 42.5em;
  bottom: 0.625em;
  z-index: 31;
  cursor: pointer;
}

#btn-add-featured img {
  width: 7em;
  height: 1.9375em;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 31;
}

#btn-add-featured img.on {
  display: none;
}

#btn-add-featured:hover img.off {
  display: none;
}

#btn-add-featured:hover img.on {
  display: block;
}

#btn-add-featured p {
  width: 7em;
  height: 1.4375em;
  line-height: 1.25em;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 32;
}

#btn-add-featured  span {
  font-size: 0.6875em;
  font-weight: bold;
}


/* Branding Temp */
#branding-temp {
  width: 100%;
  height: 100%;
  background: url(../images/bg_msg.png) 0 0 repeat;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
  display: none;
}

#branding-holder {
  margin: -12.4375em 0 0 -15.9375em;
  width: 31.75em;
  height: 22.6875em;
  text-align: left;
  background: #f5f5f5;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  overflow: hidden;
  position: absolute;
  top: 50%;
  left: 50%;
  filter: alpha(Opacity=9); 
  opacity: 0.9;
}

#date {
  width: 31.75em;
  height: 1.25em;
  line-height: 1.25em;
  text-align: left;
  background: #fff;
  -moz-border-radius: 0.3125em 0.3125em 0 0;
  -webkit-border-radius: 0.3125em 0.3125em 0 0;
  border-radius: 0.3125em 0.3125em 0 0;
  position: absolute;
  top: 0;
  left: 0;
}

#date span {
  padding: 0 1em;
  font-size: 0.75em;
  color: #666;
}

.announcing {
  width: 31.75em;
  height: 3.75em;
  position: absolute;
  top: 1.25em;
  left: 11em;
  overflow: hidden;
}

.announcing span {
  margin: 0.8em 0 0 0;
  font-size: 1.75em;
  font-weight: bold;
  color: #000;
  float: left;
}

.announcing img {
  margin: 0.625em 0 0 0.5625em;
  width: 3.375em;
  height: 2.6875em;
  float: left;
}

.wording {
  position: absolute;
  top: 5em;
  left: 11em;
}

.wording span {
  font-size: 0.75em;
  color: #000;
}

.pushing {
  line-height: 0.8125em;
  position: absolute;
  bottom: 4.5em;
  left: 11em;
}

.pushing span {
  font-size: 0.75em;
}

#logo-tzuchi {
  width: 9.375em;
  height: 5em;
  position: absolute;
  top: 6.625em;
  left: 0.625em;
  z-index: 51;
}

#branding-msg {
  width: 9.375em;
  text-align: center;
  position: absolute;
  left: 0.625em;
  top: 12.125em;
}

#branding-msg span {
  font-size: 0.75em;
  font-weight: bold;
  color: #000;
}

#temp-channels {
  list-style: none;
  position: absolute;
  top: 6.5em;
  left: 11em;
  z-index: 51;
}

#temp-channels li {
  margin: 0 0 0.25em 0;
  padding: 0 0 0 4.25em;
  height: 2em;
  width: 19em;
  line-height: 1.75em;
  position: relative;
  overflow: hidden;
}

#temp-channels img {
  width: 2.75em;
  height: 1.625em;
  border: #999 3px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  left: 0.75em;
  top: 0.0625em;
}

#temp-channels span {
  font-size: 0.75em;
}

#temp-channels span.divider {
  padding: 0 0.3125em;
  background: none;
}

#temp-channels span.chName {
  font-weight: bold;
}

#temp-channels span.epNum {
  padding: 0 0.25em 0 0;
}

.btn-blue {
  padding: 0 1em;
  height: 2.25em;
  font-weight: bold;
  line-height: 2.25em;
  color: #fff;
  text-align: center;
  text-shadow: 0 0.0625em 0.0625em #000;
/*  border: #0474b0 1px solid;*/
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  background: url(../images/btn_blue_off.gif) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#4aa8df, endColorstr=#0272ae);
  -moz-box-shadow: 0 0.125em 0.125em #000; /* FF3.5+ */
  -webkit-box-shadow: 0 0.125em 0.125em #000; /* Saf3.0+, Chrome */
  box-shadow: 0 0.125em 0.125em #000; /* Opera 10.5, IE 9.0 */
  cursor: pointer;
}

.btn-blue:hover {
  background: url(../images/btn_blue_on.gif) 0 0 repeat-x;
  background-size: auto 100%;
  -moz-background-size: auto 100%;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#71c6f7, endColorstr=#1188c9);
}

.btn-blue span {
  font-size: 1.125em;
}

#btn-watch {
  position: absolute;
  left: 11em;
  bottom: 1.4375em;
  z-index: 52;
}

/* Direct Temp */

#direct-temp {
  margin: -14.0625em 0 0 -26.9375em;
  width: 53.75em;
  height: 26em;
  background: url(../images/bg_layer.png) 0 0 repeat;
  border: transparent 1px solid;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 11;
  display: none;
}

#bg-direct {
  width: 31.75em;
  height: 22.6875em;
  position: absolute;
  left: 11em;
  top: 1.625em;
  z-index: 11;
}

#direct-content {
  padding: 1.5625em 1.25em 0 11.375em;
  width: 19.125em;
  height: 21.125em;
  text-align: left;
  -moz-border-radius: 0.3125em;
  -webkit-border-radius: 0.3125em;
  border-radius: 0.3125em;
  position: absolute;
  left: 11em;
/*  top: 1.3125em;*/
  top: 1.625em;
  z-index: 12;
}

#direct-logo {
  width: 7.9375em;
  height: 6.3125em;
  position: absolute;
  top: 3.4375em;
  left: 2em;
}

#direct-temp h1 {
  padding: 0 0 0.1875em 0;
  font-size: 1em;
  line-height: 1.875em;
}

#direct-temp h1 span {
  font-size: 2em;
  font-weight: normal;
  color: #000;
}

#direct-temp p.description {
  margin: 0 0 0.625em 0;
  line-height: 0.875em;
}

#direct-temp p.description span {
  font-size: 0.75em;
}

#direct-temp p.promotion {
  margin: 0 0 0.5em 0;
  line-height: 1.125em;
}

#direct-temp p.promotion span {
  font-size: 0.9375em;
}

#direct-temp p.btn-blue {
  margin: 0 0 1.25em 0;
  width: 9em;
}


/* Smart Guide Grid */
#sg-grid {
  width: 32.125em;
  height: 26.0625em;
  position: absolute;
  left: 10.8125em;
  top: 0;
  z-index: 12;
  display: none;
}

#sg-grid #sg-constrain {
  position: absolute;
  z-index: 12;
  overflow: hidden;
}

#sg-grid.x9 #sg-constrain {
  width: 32.6375em;
  height: 24.1825em;
  left: 0;
  top: 1.375em;
}

#sg-grid.x3 #sg-constrain {
  width: 31.75em;
  height: 22.6875em;
  left: 0.1875em;
  top: 1.3125em;
}

#sg-grid.x9 #slider {
  width: 32.6375em;
}

#sg-grid.x3 #slider {
  width: 400em;
}

#sg-grid div {
  text-align: left;
  position: relative;
  float: left;
}

#sg-grid.x9 div {
  margin: 0 0.3125em 0.3125em 0;
  width: 10.5em;
  height: 7.5625em;
}

#sg-grid.x3 div {
  width: 36em;
  height: 22.6875em;
}

.bg-set {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 12;
}

.x9 .bg-set {
  width: 10.5em;
  height: 7.5625em; 
}

.x3 .bg-set {
  width: 31.75em;
  height: 22.6875em;
}

.x3 .icon-move, .x3 .btn-del-ch {
  display: none;
}

.set-title {
  position: absolute;
  z-index: 13;
  overflow: hidden;
}

.x3 .zoom {
  position:absolute;
  left: 19.125em;
  top: 0.9375em;
  z-index: 14;
}

.x9 .zoom {
  position:absolute;
  left: 6em;
  top: 0.1625em;
  z-index: 14;
}

.icon-zoomin {
  width: 0.625em;
  height: 0.625em;
  filter: alpha(Opacity=30); 
  opacity: 0.3;
  display: none;
}

.icon-zoomout {
  width: 0.9375em;
  height: 0.9375em;
  filter: alpha(Opacity=30); 
  opacity: 0.3;
  display: none;
}

.x3 .icon-zoomin {
  display: none;
}

.x3 .icon-zoomout {
  display: block;
}

.x9 .icon-zoomin {
  display: block;
}

.x9 .icon-zoomout {
  display: none;
}

.zoom:hover {
  cursor: pointer;
}

.zoom:hover .icon-zoomin, .zoom:hover .icon-zoomout {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#sg-grid.x9 .set-title {
  width: 5.125em;
  height: 1em;
  line-height: 0.6875em;
  top: 0;
  left: 0.5em;
}

#sg-grid.x3 .set-title {
  width: 16em;
  height: 1.6875em;
  font-weight: bold;
  line-height: 1.6875em;  
  left: 1.5em;
  top: 0.625em;
}

.set-title span {
  color: #fff;
}

#sg-grid.x9 .set-title span {
  font-size: 0.5625em;
}

#sg-grid.x3 .set-title span {
  font-size: 0.9375em;
}

.set-title span.default {
  color: #666;
}

#sg-grid.editable .on .set-title {
  cursor: pointer;
}

#sg-grid.editable .on .set-title span {
  color: #66ccff;
}

#sg-grid.editable .on .set-title:hover span {
  color: #66ffff;
}

#sg-grid ul {
  list-style: none;
  position: absolute;  
  z-index: 14;  
}

#sg-grid.x9 ul {
  top: 1.0625em;
  left: 0.5em;
}

#sg-grid.x3 ul {
  width: 30.125em;
  height: 18.25em;
  top: 3.1875em;
  left: 1.5em;
}

#sg-grid li {
  background: #666;
  opacity: 0.50;
  position: relative;
  float: left;
}

#sg-grid.x9 li {
  margin: 0 0.4375em 0.4375em 0;
  width: 2.875em;
  height: 1.75em;
}

#sg-grid.x3 li {
  margin: 0 1.25em 1.25em 0;
  width: 8.75em;
  height: 5.25em;
}

html>/**/body #sg-grid li {
  filter: alpha(Opacity=50); 
}

*+html #sg-grid li {
  background: url(../images/bg_ipglist.png) 0 0 repeat;
}

#sg-grid li.on, #sg-grid.editable li.on {
  opacity: 1.0;
}

html>/**/body #sg-grid li.on {
  filter: alpha(Opacity=100); 
}

#sg-grid .thumbnail {
  filter: alpha(Opacity=50)\9; 
  position: absolute;
  top: -0.125em;
  left: -0.125em;
  border: transparent 0.125em solid;
}

#sg-grid.x9 .thumbnail {
  width: 2.875em;
  height: 1.75em;
}

#sg-grid.x3 .thumbnail {
  width: 8.75em;
  height: 5.25em;
}

#sg-grid li.on .thumbnail {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
  border-color: #fff;
}

#sg-grid li:hover img.thumbnail {
  border-color: #999;
}

#sg-grid.editable li:hover img.thumbnail {
  border-color: #555;
}

#sg-grid li.on:hover img.thumbnail {
  border-color: #fff;
}

#sg-grid.editable li.on img.thumbnail, #sg-grid.editable li.on:hover img.thumbnail {
  border-color: #cc3300;
}

#sg-grid img.add-ch {
  filter: alpha(Opacity=50)\9; 
  position: absolute;
  top: -0.125em;
  left: -0.125em;
  border: transparent 0.125em solid;
  display: none;
}

#sg-grid.x9 img.add-ch {
  width: 2.875em;
  height: 1.75em;
}

#sg-grid.x3 img.add-ch {
  width: 8.75em;
  height: 5.25em;
}

#sg-grid li:hover img.add-ch {
  display: block;
  cursor: pointer;
}

#sg-grid li.on img.add-ch {
  display: block;
}

#sg-grid li:hover img.add-ch {
  border-color: #999;
}

#sg-grid.editable li:hover img.add-ch {
  display: none;
}

#sg-grid li.on img.add-ch, #sg-grid li.on:hover img.add-ch {
  border-color: #fff;
}

.icon-move {
  width: 1.4375em;
  height: 1.25em;
  position: absolute;
  left: 0.6875em;
  top: 0.25em;
  z-index: 15;
  display: none;
}

#sg-grid.editable li.on:hover .icon-move {
  display: block;
}

#sg-grid.editable li.on:hover .btn-del-ch {
  display: block;
}

.btn-del-ch {
  width: 1em;
  height: 1.031em;
  position: absolute;
  top: -0.25em;
  left: -0.375em;
  z-index: 15;
  display: none;
  cursor: pointer;
}

.btn-del-ch img {
  width: 1em;
  height: 1.031em;
}

.btn-del-ch img.on {
  display: none;
}

.btn-del-ch:hover img.off {
  display: none;
}

.btn-del-ch:hover img.on {
  display: block;
}

.btn-del-set {
  width: 0.625em;
  height: 0.625em;
  position: absolute;
  left: 6em;
  top: 0.125em;
  z-index: 15;
  display: none;
  cursor: pointer;
}

#sg-grid.editable .on .btn-del-set {
  filter: alpha(Opacity=70); 
  opacity: 0.7;
  display: block;
}

#sg-grid.editable .on .btn-del-set:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#sg-grid.editable .on .zoom {
  display: none;
}

/*#sg-grid.x3 li.on:hover .btn-preview {
  display: block;
}*/

#sg-grid li.on:hover .btn-preview {
  display: block;
}

#sg-grid.x3 .btn-preview {
  width: 2.8125em;
  height: 2.375em;
  position: absolute;
  top: 1.4375em;
  left: 2.9375em;
  z-index: 15;
  cursor: pointer;
  display: none;
}

#sg-grid.x9 .btn-preview {
  width: 1.4375em;
  height: 1.25em;
  position: absolute;
  left: 0.6875em;
  top: 0.25em;
  z-index: 15;
  cursor: pointer;
  display: none;
}

#sg-grid.editable li.on:hover .btn-preview {
  display: none;
}

#next-set {
  width: 1.4375em;
  height: 2.0625em;
  filter: alpha(Opacity=15); 
  opacity: 0.15;
  position: absolute;
  right: -1.4375em;
  top: 14.125em;
  top: 15.75em;
  z-index: 15;
  cursor: pointer;
  display: none;
}

#next-set:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#prev-set {
  width: 1.4375em;
  height: 2.0625em;
  position: absolute;
  filter: alpha(Opacity=15); 
  opacity: 0.15;
  left: -1.4375em;
  top: 14.125em;
  top: 15.75em;
  z-index: 15;
  cursor: pointer;
  display: none;
}

#prev-set:hover {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

#sg-grid.x3/*:hover*/ #next-set, #sg-grid.x3/*:hover*/ #prev-set{
  display: block;
}

#sg-grid ul#pagination {
  width: 31.75em;
  height: 1em;
  line-height: 0.5em;
  text-align: center;
  list-style: none;
  position: absolute;
  top: 24.6875em;
  left: 0;
  z-index: 15;
  display: none;
}

#sg-grid.x3 ul#pagination {
  display: block;
}

#sg-grid ul#pagination li {
  margin: 0 0 0 0.5em;
  width: 0.5em;
  height: 0.5em;
  line-height: 0;
  background: none;
  filter: alpha(Opacity=100); 
  opacity: 1.0;
  display: inline-block;
  float: none;
}

#sg-grid ul#pagination li:first-child {
  margin: 0;
}

*+html #sg-grid ul#pagination li {
  display: inline;
}

#sg-grid ul#pagination img {
  width: 0.5em;
  height: 0.5em;
  filter: alpha(Opacity=30); 
  opacity: 0.3;
}

#sg-grid ul#pagination li.on img {
  filter: alpha(Opacity=100); 
  opacity: 1.0;
}

/* Ears */

#ear-right {
  width: 6.1875em;
  height: 2.6875em;
  position: absolute;
  top: 40%;
  right: 0;
  z-index: 60;
  display: none;
}

#ear-right:hover {
  width: 17em;
  height: 4.875em;
  top: 37%;
}

#right-off {
  width: 6.1875em;
  height: 2.6875em;
  line-height: 2.75em;
  text-align: center;
  background: url(../images/bg_layer.png) 0 0 repeat;
  border: #555 1px solid;
  border-right: none;
  -moz-border-radius: 0.3125em 0 0 0.3125em;
  -webkit-border-radius: 0.3125em 0 0 0.3125em;
  border-radius: 0.3125em 0 0 0.3125em;
  cursor: pointer;
}

#ear-right:hover #right-off {
  display: none;
}

#ear-right:hover #right-on {
  display: block;
}

#ear-left {
  width: 6.1875em;
  height: 2.6875em;
  position: absolute;
  top: 40%;
  left: 0;
  z-index: 60;
  display: none;
}

#ear-left:hover {
  width: 17em;
  height: 4.875em;
  top: 37%;
}

#ear-left:hover #left-off {
  display: none;
}

#ear-left:hover #left-on {
  display: block;
}

#left-off {
  width: 6.1875em;
  height: 2.6875em;
  line-height: 2.75em;
  text-align: center;
  background: url(../images/bg_layer.png) 0 0 repeat;
  border: #555 1px solid;
  border-left: none;
  -moz-border-radius: 0 0.3125em 0.3125em 0;
  -webkit-border-radius: 0 0.3125em 0.3125em 0;
  border-radius: 0 0.3125em 0.3125em 0;
  cursor: pointer;
}

#right-off span, #left-off span {
  font-size: 1.125em;
  font-weight: bold;
  color: #fff;
  filter: alpha(Opacity=70); 
  opacity: 0.70;
}

#right-on {
  width: 17em;
  height: 4.875em;
  text-align: left;
  background: #000;
  border: #666 1px solid;
  border-right: none;
  -moz-border-radius: 0.3125em 0 0 0.3125em;
  -webkit-border-radius: 0.3125em 0 0 0.3125em;
  border-radius: 0.3125em 0 0 0.3125em;
  cursor: pointer;
  display: none;
}

#left-on {
  width: 17em;
  height: 4.875em;
  text-align: left;
  background: #000;
  border: #666 1px solid;
  border-left: none;
  -moz-border-radius: 0 0.3125em 0.3125em 0;
  -webkit-border-radius: 0 0.3125em 0.3125em 0;
  border-radius: 0 0.3125em 0.3125em 0;
  cursor: pointer;
  display: none;
}

.preview {
  width: 5.5em;
  height: 3.25em;
  border: #444 1px solid;
}

#right-on .preview {
  position: absolute;
  right: 3.5em;
  top: 0.8125em;
}

#left-on .preview {
  position: absolute;
  left: 3.5em;
  top: 0.8125em;
}

#right-on .range {
  width: 6.25em;
  height: 3.25em;
  line-height: 1.125em;
  position: absolute;
  left: 0.875em;
  top: 0.875em;
  overflow: hidden;
  text-align: right;
}

#left-on .range {
  width: 6.25em;
  height: 3.25em;
  line-height: 1.25em;
  position: absolute;
  right: 0.875em;
  top: 0.875em;
  overflow: hidden;
}

#right-on .align, #left-on .align {
  width: 7.1875em;
  height: 3.25em;
  display: table-cell;
  vertical-align: middle;
}

#right-on .txt, #left-on .txt { 
  font-size: 0.875em;
  font-weight: bold;
  color: #fff;
  display: block;
}

#right-on .ch {
  width: 3em;
  line-height: 3.5em;
  text-align: center;
  position: absolute;
  top: 0.75em;
  right: 0.125em;
}

#left-on .ch {
  width: 3em;
  line-height: 3.5em;
  text-align: center;
  position: absolute;
  top: 0.75em;
  left: 0.125em;
}

#right-on .ch span, #left-on .ch span {
  font-size: 1em;
  font-weight: bold;
  color: #777;
}