/* -------------------------------
   =multiple fancy first letters
   ------------------------------- */

#drop-caps {
  border: 1px solid #ccc;
  padding: .5em;
}

/* -------------------------------
   =fancy first letter
   ------------------------------- */

img.fancy-letter {
  border: 0;
  float: left;
  display: inline;
  margin: 2px 2px 2px 0;
}

/* -------------------------------
   =scroll-up headline reader
   ------------------------------- */

#scrollup {
  position: relative;
  overflow: hidden;
  border: 1px solid #000;
  height: 200px;
  width: 200px
}
.headline {
  position: absolute;
  top: 210px;
  left: 5px;
  height: 195px;
  width:190px;
}

/* -------------------------------
   =how to get anything you want ...
   ------------------------------- */

#jqdt, #jqdt2 {
  width: 350px; 
  border: 1px solid #e3e3e3; 
  padding: 5px;
}  
.dom-traversal-toggles ul { 
  list-style-type: none;
  margin-left: 0;
  padding-left: 0;
}
.dom-traversal-toggles ul li {
  margin-left: 75px; 
  text-indent: -75px;
}
.dom-traversal-toggles input {
  width: 60px;
}
.dom-traversal-toggles code {
  color: #090;
}

/* -----------------------------------
   =delay
-------------------------------------- */
.quick-alert {
  width: 50%;
  margin: 1em 0;
  padding: .5em;
  background: #ffa;
  border: 1px solid #a00;
  color: #a00;
  font-weight: bold;
  display: none;
}

/* -----------------------------------
   =page contents
-------------------------------------- */
#page-contents {
  position: fixed;
  text-align: left;
  top: 0;
  right: 5px;
  width: 12em;
  border: 1px solid #ccc;
  border-top-width: 0;
  border-left-color: #fff;
  background-color: #e3e3e3;
}
* html #page-contents {
  position: absolute;
}  
#page-contents h3 {
  margin: 0;
  padding: .25em .5em .25em 15px;
  background: url(/images/arrow-right.gif) no-repeat 0 2px;
  font-size: 1.1em;
  cursor: pointer;
}
#page-contents h2 {
  font-size: 1em;
  margin: .25em 0;
  font-weight: normal;
}
#page-contents div {
  padding: .25em .5em .5em;  
  display: none;
  background-color: #efefef;
}
.hover {
  cursor: pointer;
}

div#page-contents h3.arrow-down {
  background: url(/images/arrow-down.gif) no-repeat 0 2px;
}

/***************************************
   =slicker show and hide.
-------------------------------------- */
#slickbox {
 background: #fff; 
 border: none; 
 height: auto; 
}
#slickbox2 {
background: #fff; 
border: none;
height: auto; 
}


/* -----------------------------------
   =more show, more hide
-------------------------------------- */
.demo-show,
.demo-show2 {
  width: 350px;
  margin: 1em .5em;
}
.demo-show h3,
.demo-show2 h3 {
  margin: 0;
  padding: 5px;
  width: 338px;
  background: #bfcd93;
  border-top: 1px solid #386785;
  border-bottom: 1px solid #386785;
  cursor: pointer;
}
.demo-show div,
.demo-show2 div {
  padding: 1em .25em .5em;
}
.demo-show p, .demo-show2 p {
  margin-top: 0;
}
.hover {
  cursor: pointer;
  background: #ffc;
}
/* -----------------------------------
   =quick tip - set hover class for anything
-------------------------------------- */
#hover-demo1, #hover-demo2 {
  border: 1px solid #090;
  padding: 0 1em;
}
.pretty-hover, #hover-demo1 p:hover {
  background: #ff0;
}

/***************************************
   =half star rating
-------------------------------------- */

.rating {
	cursor: pointer;
	margin: 1em;
	clear: both;
	display: block;
}
.rating:after {
	content: '.';
	display: block;
	height: 0;
	width: 0;
	clear: both;
	visibility: hidden;
}
.cancel,
.star {
	float: left;
	width: 17px;
	height: 15px;
	overflow: hidden;
	text-indent: -999em;
	cursor: pointer;
}
.star-left,
.star-right {
  width: 8px
}
/*.cancel,
.cancel a {background: url(http://examples.learningjquery.com/rating/delete.gif) no-repeat 0 -16px;}

.star,
.star a {background: url(http://examples.learningjquery.com/rating/star.gif) no-repeat 0 0px;}
.star-left,
.star-left a {background: url(http://examples.learningjquery.com/rating/star-left.gif) no-repeat 0 0px;}
.star-right,
.star-right a {background: url(http://examples.learningjquery.com/rating/star-right.gif) no-repeat 0 0px;}*/
	
.cancel a,
.star a {
	display: block;
	width: 100%;
	height: 100%;
	background-position: 0 0px;
}

div.rating div.on a {
	background-position: 0 -16px;
}
div.rating div.hover a,
div.rating div a:hover {
	background-position: 0 -32px;
}

#content div.rating p {
  margin: 0;
}


/***************************************
   =clueTip plugin
-------------------------------------- */

.highlighter {
  background: #ff3;
  cursor: pointer;
}
a.local {
  text-decoration: underline;
}
#cluetip ul {
  margin-left: 1.5em;
  padding-left: 0;
}
#cluetip {
  z-index: 1001;
  text-align: left;
}
#cluetip-outer {
  position: relative;
  margin: 0;
  background: #d9d9c2;
}
h3#cluetip-title {
  margin: 0 0 5px;
  padding: 8px 10px 4px;
  font-size: 1.1em;
  font-weight: normal;
  background-color: #87876a;
  color: #fff;
}
#cluetip-inner {
  padding: 10px;
}
span#cluetip-close { 
  text-align: right;
  margin: 0 5px 5px;
  color: #900;
}
#cluetip-close img {
  border: 0;
}