body * {font-family: "Helvetica Neue", "American Typewriter",  Arial; color:  #333;}

h1.story_title {
  color:#3AA4B0;
  font-size:400%;
  letter-spacing: -3px;
  font-weight: bold;
  border-bottom:  1px solid #ddd;
  margin-bottom:  3px;
}
h2.story_title {padding-bottom:  10px; margin-bottom:  10px; font-size:  170%;}
h2.story_title a {line-height:  1em}
h3.story_title {
  color:#3AA4B0;
  font-size:200%;
  letter-spacing: -1px;
  font-weight: bold;
  border-bottom:  1px solid #ccc;
}

h1.thanks {
  color:#333;
  font-size:300%;
  letter-spacing: -2px;
  font-weight: bold;
  border-bottom:  0px solid #ddd;
  margin-bottom:  0;
}

h1.thanks p {
  font-size:70%;
  letter-spacing: -2px;
  font-weight: bold;
  background: #DFF9F5;
  padding: 10px;  
  margin: 10px 0 20px 0;
}

h2 strong {font-size:  60%;}

.home h2 {border-bottom:  1px solid #eee; font-size:  200%;}

p.url {
  font-size:170%;
  letter-spacing: -2px;
  font-weight: bold;
  background: #DFF9F5;
  padding: 10px;  
  margin: 10px 0;
  height:  30px;
}


.story h1.story_title {
  margin-bottom:  10px;
  color:  #333;
  font-size:  425%;
  padding:  10px 0;
  line-height:  .9em;
  border-top:  1px solid #ddd;
}

.story h1.story_title span{
 color:  #999;
 font-size:  20%;
 font-weight:  normal;
 display:  block;
 letter-spacing:  0;
 text-transform: uppercase;
 text-align:  justify;
}

.story h1.story_title span strong{
 color:  #777;}


.action_option { padding: 30px 0; border-bottom: 1px solid #ddd;}

.action_option .invitation {float:  left; width:  62%;}
.action_option .action {float:left;}

.action_option .invitation h2 {margin:0; padding: 0;}
.action_option .invitation p {color:  #999; font-size:  140%; margin:  0; padding:  0;}
.action_option .invitation input {font-size:120%  ;}

span.suggestion { font-weight:  700; color:  #444;}
.home h1.story_title {margin-bottom: 0; border-bottom:  0;}
.home h3.story_title {margin-bottom: 10px;}

h2 { letter-spacing: -1px; font-weight: bold; font-size:  180%;}

.home .description {font-size:  225%; letter-spacing: -1px; color:  #aaa; line-height:  1em; font-weight:  bold; width:  70%; float:  left;} 

.sentences {
  word-spacing: -1px;
  font-size:  150%;
  clear:  both;
  color:  #555;
  line-height:  1.3em;
  font-family: "Baskerville", Helvetica;
  font-weight: normal;
}

.story .sentences {
  letter-spacing: -1px;
  word-spacing: -1px;
  font-size:  230%;
  clear:  both;
  color:  #555;
  line-height:  1.5em;
  font-family: Baskerville;
  font-weight: normal;
  text-align: justify;
}

.preview {width:  29%; float:  left; margin-right: 4%; margin-bottom:  3em; height:  19em;}
.preview h2 {margin-bottom:  0;}
.preview .sentences {font-size: 140%; letter-spacing: -1px;  padding-bottom:  10px;}
.preview .sentences strong a {color:  #444; font-size:  90%; }

.home-preview {width:  99%; margin-bottom:  1em; border-bottom:  1px solid #eee;}
.home-preview .sentences {font-size: 140%; letter-spacing: -1px;}
.home-preview h3 {margin-bottom:  0; font-size: 170%; font-weight:  bold; letter-spacing:  -1px;}
.sentences {font-size: 145%; letter-spacing: -1px;  padding-bottom:  10px;}
.home-preview .sentences strong a {color:  #444; font-size:  90%; }
.home-preview .meta {font-size:  65%; border:  none; letter-spacing:  0; }


p.sentence {line-height:  1.1em; margin-bottom:  8px;}

.sample p.intro {margin-bottom:  10px; }

.intro p.sentence span.dropcap{
  font-size:  250%;
  font-weight:  bold;
  color:  #3AA4B0;
  color:  #333;
  float:  left;
  margin: .4em .150em .3em 0;
  padding:  0;
  line-height:  0.01em;
  text-transform:  uppercase;
}

.intro p.sentence{
  text-indent: 0;
  text-align:  left;
}

.intro p.sentence:first-line{
  text-transform:  uppercase;
  font-size:  90%;
}

.firstword {
  
}

p.meta {color:  #777; border-top:  1px solid #eee; padding:  3px 0; margin-bottom:  5px;}
.meta strong {color:  #3aa4b0; color:  #666; font-size:  105%;}
.home p.sentence {margin-bottom:  0;}
.home p.description {margin-bottom:  10px;}
p.description {margin-bottom:  0;}
.contribute { display:  block; font-weight:  bold;  text-align:left; margin:  7px 0 20px 0; clear:  both; font-size:  90%;  }
.contribute a {color: #333;}
.turns_left {font-weight:  normal; font-size:  70%; color: #777; display:  block; letter-spacing: 0px;}

.sentences .clear {position:  relative; margin: 0; padding: 0;}

.sentences .credit {
 position:  absolute; right:  -100px; width:  90px; top: 10px; font-size:  70%; letter-spacing: 0;
}

.viewable .credit {position: static; right: auto; width:  auto; clear: both;}

.sentences .credit .author, .sentences .credit .sentence_position {color:  #bbb; font-size:  60%;}

#navbar {float:  right;}
#hd { padding:  15px 0 0 0; margin-bottom:  0;}

.start_new { float:  right; margin-top:  10px;}

.content {padding-top: 25px; clear: both;}

h3.title {padding: 5px 0 10px; border-bottom:  1px solid #eee;}
h3.title span {display:  block; color:  #999; font-size:  70%;}

.suggestions {float:  left; width:  13em; text-align:  right; margin: 0 15px 0 0 ; height:  100em;}
.suggestions span {font-size:  90%; color:  #888; display:  block;}
.suggestions strong em {font-size:  140%; color: #3AA4B0; font-style:  normal; font-weight:  bold;}
.suggestions_list {font-size:  140%; list-style-type: none; margin-bottom:  0; padding: 0px 5px; }
.suggestions_list li {color: #2993A8; margin:  12px 0; line-height: .8em;}

.finish {color:  #390; font-size:  200%;}
.continue {color:  #888; font-size:  140%;}
.ending {color:  #E9AB17; font-size:  180%;}

li.used {text-decoration: line-through; color: #ccc;}

.errorExplanation { background: #F9DED8 url(../images/icon-alert-error.gif) no-repeat 8px 15px; border: 1px solid #E33030; border-top: 2px solid #E33030; color: #A3120C; margin-bottom: 15px; padding: 10px 15px 5px 33px; } 
.errorExplanation p { margin-bottom: 7px; padding: 0; } 
.errorExplanation a { text-decoration: underline; } 
.errorExplanation ul { margin: 0 0 7px 0; padding: 0 15px; } 

.alert-warning h2  {color:  #C06703; font-weight:  normal;}

.viewable {padding: 10px; background: #f5f5f5; margin-bottom:  20px; border:  1px solid #ddd; border-width:  1px 0;}

#custimize_story{background:  #f5f5f5; padding: 10px; border:  1px solid #ddd;}

.home .sentence .author {color: #999; font-size:  90%;}

.home .completed {width: 50%;}
.home .completed .yui-u {width: 46%;}
.sample {margin-bottom:  5px;}
.sample .sentence {padding-left:  20px; background:  url(../images/quote.gif) no-repeat top left; position:  relative; left: -20px;}
.sample .sentences .sentence {line-height:  1.3em;}
.sample .sentences .read_more {line-height:  2.5em;}

input, textarea {padding:  3px; font-size:  180%;}
input.button {background:  #333; color: #fff; padding:  .2em .3em; border: 2px solid #555; border-right: 2px solid #111; border-bottom: 2px solid #111;}
input.button:active{background: #BD518D;;}
input.small-button {background:  #333; color: #fff; padding:  .1em .1em; border: 2px solid #555; border-right: 2px solid #111; border-bottom: 2px solid #111; font-size:  140%;}

.buttons {margin: 15px 0;}

.squarrow_submit {border:  none;  background:  transparent; padding:  0; font-size: 100%; color:  #fff; margin: 0;}
a.squarrow, a.squarrow:link, a.squarrow:hover, a.squarrow:visited {color: #fff;}

p.headline {text-align:  justify;}

/* rating stars stuff
-------------------------------------------------------------------*/
/*             styles for the star rater                */	
.star-rating{
	list-style:none;
	margin: 0px;
	padding:0px;
	width: 150px;
	height: 30px;
	position: relative;
	background: url(../images/star_rating.gif) top left repeat-x;		
	float:  left;
}
.star-rating li{
	padding:0px;
	margin:0px;
	height:30px;
	width: 30px;		
	/*\*/
	float: left;
	/* */
}
.star-rating li a{
	display:block;
	width:30px;
	height: 30px;
	line-height:30px;
	text-decoration: none;
	text-indent: -9000px;
	z-index: 20;
	position: absolute;
	padding: 0px;
	overflow:hidden;
}
.star-rating li a:hover{
	background: url(../images/star_rating.gif) left center;
	z-index: 2;
	left: 0px;
	border:none;
}
.star-rating a.one-star { left: 0px; }
.star-rating a.one-star:hover{ width:30px; }
.star-rating a.two-stars{ left:30px; }
.star-rating a.two-stars:hover{ width: 60px; }
.star-rating a.three-stars{ left: 60px; }
.star-rating a.three-stars:hover{ width: 90px; }
.star-rating a.four-stars{ left: 90px; }	
.star-rating a.four-stars:hover{ width: 120px; }
.star-rating a.five-stars{ left: 120px; }
.star-rating a.five-stars:hover{ width: 150px; }
.star-rating li.current-rating{
	background: url(../images/star_rating.gif) left bottom;
	position: absolute;
	height: 30px;
	display: block;
	text-indent: -9000px;
	z-index: 1;
}
.current-rating-num {font-weight:normal; display:block;}

.rating {
    font-size:170%;
    letter-spacing: -2px;
    font-weight: bold;
    background: #DFF9F5;
    padding: 10px;  
    margin: 10px 0;  
}
.rate-label{float: left; margin-right: 20px}
.inappropriate {float:  right; margin-right: 20px}
