/* global */
div.ui-cluetip {
/*  font-size: 1em;*/
}
.ui-cluetip-header,
.ui-cluetip-content {
/*  padding: 12px;*/
}
.ui-cluetip-header {
  font-size: 1em;
  margin: 0;
  overflow: hidden;
  border: none; background: none;
}

.cluetip-title .cluetip-close {
  float: right;
  position: relative;
}
.cluetip-close img {
  border: 0;
}

#cluetip-waitimage {
  width: 43px;
  height: 11px;
  position: absolute;
  background-image: url(images/wait.gif);
}
.cluetip-arrows {
  display: none;
  position: absolute;
  top: 0;
  left: -11px;
  width: 11px;
  height: 22px;
  background-repeat: no-repeat;
  background-position: 0 0;
  border-width: 0;
}
.cluetip-extra {
  display: none;
}

/***************************************
   =cluetipClass: 'mee'
-------------------------------------- */

.cluetip-mee { background: none; }
.cluetip-mee .cluetip-outer { position: relative; margin: 0; background: #eeeff0; border:1px solid #bababa; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 1px 2px #222222; -webkit-box-shadow: 1px 1px 2px #222222; box-shadow: 1px 1px 2px #222222; }
.cluetip-mee h3.cluetip-title { padding:0 0 0 15px; margin:0; float:none; width:auto; color:#555; font-size:12px; font-weight:bold; height:30px; line-height:30px; border-bottom: 1px solid #bababa; display:block; background:#eeeff0; text-shadow: 1px 1px 2px #c3c3c3; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; }
.cluetip-mee .cluetip-title a { color: #d9d9c2; }
.cluetip-mee .cluetip-inner { padding: 20px 15px; overflow:hidden; height:1%; background: #fff url(images/bg.gif) repeat-x left top; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; }
.cluetip-mee div.cluetip-close { text-align: right; position:absolute; top:0; right:20px; height:30px; line-height:30px; float: none; }
.cluetip-mee div.cluetip-close a { text-decoration:none; background:url(images/close.gif) no-repeat 0 11px; display: block; width: 15px; height:30px; line-height:30px; text-indent: 30px; overflow: hidden; }
.cluetip-mee div.cluetip-close a:hover { }
/* arrows */
.cluetip-mee .cluetip-arrows,.cluetip-mee .cluetip-arrows.ui-state-default { border-width: 0; background-color: transparent; }
.clue-right-mee { margin-top:-30px; }
.clue-right-mee .cluetip-arrows { background-image: url(images/arrowleft.gif); margin:30px 0; }
.clue-left-mee .cluetip-arrows { background-image: url(images/arrowright.gif); left: 100%; margin-right: -11px; margin-left: 2px; margin-top: 4px; }
.clue-top-mee .cluetip-arrows { background-image: url(images/arrowdown.gif); top: 100%; left: 50%; margin-left: -11px; height: 11px; width: 22px; }
.clue-bottom-mee .cluetip-arrows { background-image: url(images/arrowup.gif); top: -11px; left: 50%; margin-left: -11px; height: 11px; width: 22px; }

/***************************************
   =cluetipClass: 'light'
-------------------------------------- */

.cluetip-light { background: none; }
.cluetip-light .cluetip-outer { position: relative; margin: 0; background: #eeeff0; border:1px solid #bababa; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 1px 2px #222222; -webkit-box-shadow: 1px 1px 2px #222222; box-shadow: 1px 1px 2px #222222; }
.cluetip-light h3.cluetip-title { padding:0 0 0 15px; margin:0; float:none; width:auto; color:#555; font-size:12px; font-weight:bold; height:30px; line-height:30px; border-bottom: 1px solid #bababa; display:block; background:#fff; text-shadow: 1px 1px 2px #c3c3c3; -moz-border-radius-topleft: 3px; -webkit-border-top-left-radius: 3px; border-top-left-radius: 3px; -moz-border-radius-topright: 3px; -webkit-border-top-right-radius: 3px; border-top-right-radius: 3px; }
.cluetip-light .cluetip-title a { color: #d9d9c2; }
.cluetip-light .cluetip-inner { padding: 20px 15px; overflow:hidden; height:1%; background: #fff; -moz-border-radius-bottomleft: 3px; -webkit-border-bottom-left-radius: 3px; border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -webkit-border-bottom-right-radius: 3px; border-bottom-right-radius: 3px; }
.cluetip-light div.cluetip-close { text-align: right; position:absolute; top:0; right:20px; height:30px; line-height:30px; float: none; }
.cluetip-light div.cluetip-close a { text-decoration:none; background:url(images/close.gif) no-repeat 0 11px; display: block; width: 15px; height:30px; line-height:30px; text-indent: 30px; overflow: hidden; }
.cluetip-light div.cluetip-close a:hover { }
/* arrows */
.cluetip-light .cluetip-arrows,.cluetip-light .cluetip-arrows.ui-state-default { border-width: 0; background-color: transparent; }
.clue-right-light { margin-top:-30px; }
.clue-right-light .cluetip-arrows { background-image: url(images/arrowleft.gif); margin:30px 0; }
.clue-left-light .cluetip-arrows { background-image: url(images/arrowright.gif); left: 100%; margin-right: -11px; margin-left: 2px; margin-top: 4px; }
.clue-top-light .cluetip-arrows { background-image: url(images/arrowdown.gif); top: 100%; left: 50%; margin-left: -11px; height: 11px; width: 22px; }
.clue-bottom-light .cluetip-arrows { background-image: url(images/arrowup.gif); top: -11px; left: 50%; margin-left: -11px; height: 11px; width: 22px; }
 
/***************************************
   =cluetipClass: 'jtip'
-------------------------------------- */
.cluetip-jtip {
  background-color: #fff; 
}
.cluetip-jtip .cluetip-outer {
  border: 2px solid #ccc;
  position: relative;
}

.cluetip-jtip .cluetip-inner {
  padding: 5px;
  display: inline-block;
}
.cluetip-jtip div.cluetip-close {
  text-align: right;
  margin: 0 5px 0;
  color: #900;
}

.cluetip-jtip .ui-cluetip-header {
  background-color: #ccc;
  padding: 6px;
/*  margin-bottom: 1em;*/
}

/* jtip arrows */
div.cluetip-jtip .cluetip-arrows {
  border-width: 0;
  background: transparent none;
}
div.clue-right-jtip .cluetip-arrows {
  background-image: url(images/arrowleft.gif);
}
div.clue-left-jtip .cluetip-arrows {
  background-image: url(images/arrowright.gif);
  left: 100%;
  margin-right: -11px;
}
div.clue-top-jtip .cluetip-arrows {
  background-image: url(images/arrowdown.gif);
  top: 100%;
  left: 50%;
  width: 22px;
  height: 11px;
  margin-left: -11px;
}
div.clue-bottom-jtip .cluetip-arrows {
  background-image: url(images/arrowup.gif);
  top: -11px;
  left: 50%;
  width: 22px;
  height: 11px;
  margin-left: -11px;
}
