div.info_hover_box {
  position: absolute;
  z-index: 500;
}

div.info_hover_box div.gra-top-left,
div.info_hover_box div.gra-top-right,
div.info_hover_box div.gra-bottom-left,
div.info_hover_box div.gra-bottom-right {
  background-image: url(../images/shw-corners.png);
  _background-image: none;
  background-repeat: no-repeat;
  background-position: -1px -1px;
  position: absolute;
  top: 0;
  left: 0;
  height: 12px;
  width: 12px;
}

div.info_hover_box div.gra-top-right    { background-position: -14px -1px;  }
div.info_hover_box div.gra-bottom-left  { background-position: -1px  -14px; }
div.info_hover_box div.gra-bottom-right { background-position: -14px -14px; }

div.info_hover_box div.content {
  padding: 16px;
  overflow: hidden;
  border: solid 1px #666;
  background: #f4f4f4 repeat-x scroll left top;
  position: relative;
  top: 0;
  left: 21px;
}
div.info_hover_box.type_show div.content,
div.info_hover_box.type_video div.content {
  width: 340px;
}
div.info_hover_box.type_user div.content {
  width: 180px;
}

div.info_hover_box div.content hr{
  background-color: #DDD;
  color: #DDD;
  height: 1px;
  margin: 5px 0px 10px 0px;
}

div.info_hover_box div.pointer {
  background-image: url(../images/pointer.png?2);
  _background-image: url(../images/pointer.gif?2);
  background-repeat: no-repeat;
  background-position: -1px -1px;
  position: absolute;
  height: 21px;
  width: 21px;
  z-index: 300;
}

div.info_hover_box div.gra-v-right,
div.info_hover_box div.gra-v-left {
  background-image: url(../images/shw-1px-left.png);
  _background-image: none;
  background-repeat: repeat-y;
  position: absolute;
  top: 0;
  left: 0;
  height: auto;
  width: 12px;
}

div.info_hover_box div.gra-v-right {
  background-image: url(../images/shw-1px-right.png);
  _background-image: none;
}

div.info_hover_box div.gra-h {
  background-image: url(../images/shw-1px-bottom.png);
  _background-image: none;
  background-repeat: repeat-x;
  position: absolute;
  bottom: -12px;
  left: 0;
  height: 12px;
}
div.info_hover_box.type_show div.gra-h,
div.info_hover_box.type_video div.gra-h {
  width: 358px;
}
div.info_hover_box.type_user div.gra-h {
  width: 198px;
}
div.synopsis-container div.gra-h {
  width: 460px;
}

/* middle left */
div.info_hover_box.mid-left div.pointer          { background-position: -23px -23px; top: 50%;
                                                   left: auto; right: -20px; }

ul.t-preview div.mid-left div.pointer            { background-position: -68px -23px; }

div.info_hover_box.mid-left div.content          { top: 21px; left: 0px; }

div.info_hover_box.mid-left div.gra-top-left     { top: 21px; left: -12px; }

/* "hide" by making it small and stick it in the middle,
 * `display: none` does not work in IE7.
 */
div.info_hover_box.mid-left div.gra-top-right    { /* hide */ top: 50px; left: 50px; height: 0px; width: 0px; }

div.info_hover_box.mid-left div.gra-bottom-right { top: auto; left: auto; bottom: -32px; right: 0px; }
div.info_hover_box.mid-left div.gra-bottom-left  { top: auto; left: -12px; bottom: -32px; }
div.info_hover_box.mid-left div.gra-h            { left: 0px; bottom: -32px; }
div.info_hover_box.mid-left div.gra-v-right      { /* hide */ top: 50px; left: 50px; width: 0px; height: 0px; }
div.info_hover_box.mid-left div.gra-v-left       { top: 32px; left: -12px; bottom: -20px; }

/* middle right */
div.info_hover_box.mid-right div.pointer          { background-position: -1px -23px; top: 50%; }

ul.t-preview div.mid-right div.pointer            { background-position: -45px -23px; }

ul.t-preview div.mid-right div.synopsis,
div.info_hover_box.mid-right div.content          { top: 21px; left: 20px; }

div.info_hover_box.mid-right div.gra-top-left     { top: 50px; left: 50px; width: 0px; height: 0px; }
div.info_hover_box.mid-right div.gra-top-right    { top: 21px; left: auto; right: -32px; }
div.info_hover_box.mid-right div.gra-bottom-right { top: auto; left: auto; bottom: -32px; right: -32px; }
div.info_hover_box.mid-right div.gra-bottom-left  { top: auto; left: 20px; bottom: -32px; }
div.info_hover_box.mid-right div.gra-h            { left: 32px; bottom: -32px; }
div.info_hover_box.mid-right div.gra-v-right      { top: 32px; left: auto; bottom: -20px; right: -32px; }
div.info_hover_box.mid-right div.gra-v-left       { top: 50px; left: 50px; width: 0px; height: 0px; }

/* bottom left */
div.info_hover_box.bottom-left div.pointer         { background-position: -23px -45px; top: auto;
                                                     left: auto; bottom: 0px;  right: -20px; }
ul.t-preview div.bottom-left div.pointer           { background-position: -68px -45px; }

ul.t-preview div.bottom-left div.synopsis,
div.info_hover_box.bottom-left div.content         { top: 0px; left: 0px; }

div.info_hover_box.bottom-left div.gra-top-left,
div.info_hover_box.top-left div.gra-top-left     { top: 0px; left: -12px; }
div.info_hover_box.bottom-left div.gra-top-right,
div.info_hover_box.top-left div.gra-top-right    { /* hide */ top: 50px; left: 50px; width: 0px; height: 0px;  }
div.info_hover_box.bottom-left div.gra-bottom-right,
div.info_hover_box.top-left div.gra-bottom-right { top: auto; left: auto; bottom: -12px; right: 0px; }
div.info_hover_box.bottom-left div.gra-bottom-left,
div.info_hover_box.top-left div.gra-bottom-left  { top: auto; left: -12px; bottom: -12px; }
div.info_hover_box.bottom-left div.gra-h,
div.info_hover_box.top-left div.gra-h            { left: 0px; bottom: -12px; }
div.info_hover_box.bottom-left div.gra-v-right,
div.info_hover_box.top-left div.gra-v-right      { /* hide */ top: 50px; left: 50px; width: 0px; height: 0px;  }
div.info_hover_box.bottom-left div.gra-v-left,
div.info_hover_box.top-left div.gra-v-left       { top: 12px; left: -12px; bottom: 0px; height: auto; }

/* bottom right */
div.info_hover_box.bottom-right div.pointer      { background-position: -1px -45px;
                                                   top: auto; bottom: 0px; left: 0; }

ul.t-preview div.bottom-right div.pointer        { background-position: -45px -45px; }

ul.t-preview div.bottom-right div.synopsis,
div.info_hover_box.bottom-right div.content           { top: 0px; left: 20px; }

div.info_hover_box.bottom-right div.gra-top-left,
div.info_hover_box.top-right div.gra-top-left     { /* hide */ top: 50px; left: 50px; width: 0px; height: 0px;  }
div.info_hover_box.bottom-right div.gra-top-right,
div.info_hover_box.top-right div.gra-top-right    { top: 0; left: auto; right: -32px; }
div.info_hover_box.bottom-right div.gra-bottom-right,
div.info_hover_box.top-right div.gra-bottom-right { top: auto; left: auto; bottom: -12px; right: -32px; }
div.info_hover_box.bottom-right div.gra-bottom-left,
div.info_hover_box.top-right div.gra-bottom-left  { top: auto; left: 20px; bottom: -12px; }
div.info_hover_box.bottom-right div.gra-h,
div.info_hover_box.top-right div.gra-h            { left: 32px; bottom: -12px; }
div.info_hover_box.bottom-right div.gra-v-right,
div.info_hover_box.top-right div.gra-v-right      { top: 12px; left: auto; bottom: 0px; right: -32px; }
div.info_hover_box.bottom-right div.gra-v-left,
div.info_hover_box.top-right div.gra-v-left       { /* hide */ top: 50px; left: 50px; width: 0px; height: 0px;  }

/* top left */
div.info_hover_box.top-left div.pointer           { background-position: -23px -1px;
                                                    top: 0; left: auto; right: -20px; }
ul.t-preview div.top-left div.pointer             { background-position: -67px -1px; }

ul.t-preview div.top-left div.synopsis,
div.info_hover_box.top-left div.content           { top: 0px; left: 0px; }

/* top right */
div.info_hover_box.top-right div.pointer           { background-position: -1px -1px; top: 0; left: 0; }
ul.t-preview div.top-right div.pointer             { background-position: -45px -1px; }

ul.t-preview div.top-right div.synopsis,
div.info_hover_box.top-right div.content           { top: 0px; left: 20px; }

/***********
 * Content *
 ***********/

div.info_hover_box div.content {
  text-align: left;
  padding: 10px 14px;
  font-size: 12px;
}

div.info_hover_box div.content p {
  margin: 5px 0 0 0;
  padding: 0;
  font-size: 12px;
}

div.info_hover_box div.content div.line {
  width: 100%;
  height: 1px;
  border-top: solid 1px #cfcfcf;
  background-color: #fff;
  margin: 5px 0 0 0;
  padding: 0;
  line-height: 1px;
  clear:both;
}

div.info_hover_box div.content img.thumb {
  float: right;
  margin: 0 0 5px 8px;
  border:1px solid #eee;
}

div.info_hover_box div.content img.cc {
  vertical-align: middle;
  *vertical-align: bottom;
}

div.info_hover_box.type_user img.avatar {
  width: 54px; 
  height: 48px; 
  padding-right: 8px;
}

div.info_hover_box div.content table.demographics {
  width: 80%;
  border: none;
  margin: 5px auto;
}
div.info_hover_box div.content table.demographics td { padding: 0px; }
div.info_hover_box div.content table.demographics td.centered { text-align: center; }
div.info_hover_box div.content table.demographics td.indent { padding-left: 30px; }