/* the basic site layout wills tay in default.css, advanced or one-page or few-page style will be here 
this is instead of sorting based on layout and color, as I think the fragmentation is sketchy 
item refs are all in default.css
*/

/* unsorted/new “; margin-left: 18px; */
/*.item_brief {overflow: hidden; height: 1.1em}
.imdate {
  display: none; padding-left: 10px;
}
*/

.course_title {font-size: 1.1em; padding-bottom: 3px;}


#chat_notice {
  padding-top: 10px;
}


/* hmm, how should this work differently with richp? really want just the first one not to have padding.. */
.richp h1 {
  padding-top: 0px;
}

/* apparently moved this to 100% before, but I really want it to scroll/break word inside it? from 480-460.  ist hat bad for journal?  IM_DIV needs 460, anyways, hmm.... */
.im_div, .journal {
  word-wrap:break-word; overflow: auto;
  max-width: 460px;
  /* max-width vs. width? fine by me, then no iphone probs? */
  /* 528px width: 100%; word:break doesn't work except when this is a fixed width... but that sucks for phones/etc? */
}

/* shrinking soem */
.im_div {
  max-width: 445px;
}

.inline_opoem, .inline_oauthor {
	margin: 10px 0 10px 0;
	border: 1px solid #888;
	padding: 5px;
}

.poem_list, .spotlight_list, .column_list {
	list-style: none;
	padding-left: 15px;
	margin-bottom: -10px;
}

.oauthor_list li {
	margin-bottom: 7px;  
}

.opoem {
  border-bottom: 1px solid #7F98A7;
  margin-bottom: .8em;
  padding: 5px;
  padding-top: 3px;
}

.opoembody {
  padding-top: 16px;
}

.opoem_title {
  font-size: 18px;
  margin-bottom: 3px;
}

.opoem_info {
	margin-top: 3px;
}

.opoem_brief {
  padding-left: 25px;
  font-size: .92em;
  /*font-style: italic;*/
}

/*.poem_list li, .book_list li, .spotlight_list li {
	margin-bottom: 7px;
}*/

.addlinebody td {border-bottom: 1px dashed #aaa;}

.chat_invite, #chat_info {border: 1px dashed #333; padding: 5px;}

.account ul {padding-bottom: 25px !important;}
.account ul li {padding-bottom: 3px;}

#main ul {margin-bottom: 0; padding-bottom: 0;}

.mplan {position: relative; top: -5px; font-size: 0.30em; text-decoration: underline; padding-left: 3px;}

.bottom {font-size: .8em;}
.dot {color: #666; padding-left: 1px; padding-right: 1px;}
.bigdot {color: #000; padding-left: 7px; padding-right: 7px;}
.linenos {
  padding-left: 33px; /* had hoped to keep it as mimal as possible, but need2 fit into the hundreds... 23 - 33 not wokring!*/
}
.first_comment {margin-top: 8px;}

.author_h2 {margin-top: 25px;}

/* @top of page now... .broadcasts li, .chatims li {
  width: 180px;
  overflow: auto; word-wrap:break-word;  
}*/

/*.poem_title {
  font-size: 18px;
  margin-bottom: 3px;
} from SP */

.front_list {
  list-style: none;
  padding-left: 0px;
}

.front_list li, .spotlight_list li, .poem_list li, .column_list li {
	padding-bottom: 4px;
	margin-bottom: 4px;
  border-bottom: 1px solid #ddd;
}

/* what is this used for? */
.max {
  /*display: none;*/
  border: 1px solid black;
  background-color: #eee;
  color: #000;
  padding: 4px;
}

#fixedcomment {
  background-color: #eee; 
  text-align: left;
  color: #000;
    
  border: 1px solid #aaa; 
  padding: 6px;
  padding-bottom: 3px;
  
  position: absolute;
  top: 2000px; 
  left: 900px;
  
  /*position: fixed;
  bottom: 0px;*/
}

/*div #fixedcomment {
  position: fixed;
  bottom: 0px;
}*/

n, .n {margin-left: 1px; margin-bottom: 2px; color: #bbb; font-size: .6em;}
.tagitem {color: #555; font-size: .8em;}
.syns {font-size: 13px; line-height: 13px;}

/* REFS */
.item, .freewrite, .column, .group, .course, .opoem {
  /*margin-bottom: .8em;*/
  padding: 5px;
  padding-top: 0px;
  padding-bottom: 8px; /* padding bottom was 13 */
  margin-bottom: 8px;
  border-bottom: 1px dashed #999;/* why isn't this working == same color as default, lol
  border-bottom: 1px solid #7F98A7;  */
}

.body_list .item {
  border-bottom:  0px;
}

.column {border: 0;}
.spotlight {
  margin-bottom: 10px;
  border-bottom: 1px solid #ddd;
}

.itembody {
  padding-top: 16px;
  padding-bottom: 6px;
  border-bottom: 1px solid #888;
  word-wrap:break-word; overflow: auto;
  max-width: 600px;  
}

/* should show the same for p class='i' */
.richp p, .comment_main p {
  margin: 0; padding: 0;
}

/* try and add maxwidth for author pages too/etc.  complaints that it causes problems with IE7, stupid browser.  trying to increase 600 to 630 to try and affect it */
.richp {
  /* disabled b/c IE7 has problems with this.  Try re-enabling in the future? word-wrap:break-word; overflow: auto;
  max-width: 630px;*/
}

.itembody p.o {margin-bottom: 1em; margin-top:  1em;} /* old ones, no more being created.. */

.item_title {
  /*font-size: 18px;*/
  font-size: 1.21em;
  margin-bottom: 3px;
}

.item_info {
	margin-top: 3px;
}

.inline_story, .inline_user {
	margin: 10px 0 10px 0;
	border-bottom: 1px solid #888;
	padding: 5px;
}

/* constant width now */
.comment_by { 
  /* was 12px.  bit larger won't hurt.. */
	font-size: .85em;
	float: left;
  width: 114px;/* was 116 .  for reals, is it really this small?  93 was a bit too small, so was 105.  120 looks way too big */
  border-right: 1px solid #aaa;
  padding-right: 4px;
  
	margin: 5px;
	margin-right: 7px;
	margin-left: 0px;
	text-align: left;
	line-height: 1.1em; /* peekaboo bug fix? */
}

.comment_by span { /* author's name */
	font-size: 1em;
}

.comment_src {
  padding-bottom: 6px;
}

.comment h3 {
  font-size: 18px;
  margin: 0;padding: 0;
  padding-bottom: 7px;
}

.comment { 
	padding: 5px;
  border-bottom: 1px solid #888;  /* blue?3499D8 or use #888? #7F98A7; match color of image */

  /*overflow: hidden;  is this needed anymore? source of IE bug? */
  word-wrap:break-word; overflow: auto;
  max-width: 600px;
}

.newcomment { /* just make it a bit more obvious where our new comment is */
  border: 2px solid #888 !important; /* don't let the other border override us... */
}

.commentary {
  /*margin-left: 20px;*/
  padding: 5px;
  padding-left: 5px;
  margin-top: -4px;
  margin-bottom: 14px;
  border-bottom:  1px solid #888;
}

.testa, .otheritems li {  
	padding: 5px;
	margin-bottom: 0px;

  border-bottom: 1px solid #888; /* nice blue line 3499D8 */
}

/* have it scroll when images/etc are too big... was 520px */
.maxwidth {
	max-width: 590px;
	overflow: auto;
	word-wrap:break-word;
}

.testa_title {
  font-size: 1.02em;
  padding-bottom: 5px;
}

/* LISTS */
/* having trouble with .sl having right border... */
.sl, .contact_list, .message_list, .bg_list, .book_list, .group_list, .category_list, .comment_list, .recent_list, .topic_list, .col_list, .course_list li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/*.sl li {  padding: 0px; margin: 0px;  }*/

.contact_list li {
  padding: 0px; margin: 0px;
}
.message_list li, .col_list li, .course_list li {
  margin-bottom: 6px;
  padding-bottom: 2px;
  border-bottom: 1px solid #7F98A7;
}

/* will this work?  we need each comment in a div by itself, right? */
.message_list li {
  width: 265px;
  overflow: auto; word-wrap:break-word;
}

.recent_list {
  padding-left: 7px;
}

.topic_list {
	margin: 2px;
}

.category_list li {
  margin: 0; padding: 0;
  margin-right: 12px;
  float: left;
}

.item_list, .spotlight_list, .class_list, .addline_list {
	list-style: none;
	padding-left: 0px;
	margin-bottom: -10px;
}

.book_list li, .inline_list li {
  padding: 0; margin: 0;
}

.user_list li, .item_list li, .book_list li, .spotlight_list li, .group_list li {
	margin-bottom: 5px;
}
.class_list li {margin-bottom: 9px;}

/* was .bg_list li, but need to place non-heighted items in there too. width: 525px; */
.bg_id {
  height: 120px;
	margin-bottom: 10px;
}  


/* help */
.help_list ul, .help_list ol {  padding-top: 17px; }
.help_list ul li, .help_list ol li { margin-bottom: 6px;}


/* groups */
.group_title {font-size: 1.1em;}


/* forums */
h1 .bb_form_label { margin-bottom: -3px; }

ul .unread {
	border: 3px solid black;
}

.forum_list {
  list-style: none;
	margin: 0;
	padding: 0;
	clear: left;
}

.forum_list li {
  margin-top: 7px;
}

.forum_list div {
  margin-left: 14px;
  margin-top: 3px;
}

.topic_body {
  margin-bottom: 5px;
  margin-left: 10px;
}

.boardtopics tr td {
  padding-top: 5px;
  padding-bottom: 5px;
}

.reply { 
	list-style-type: none;
	padding: 0;
	padding-left: 25px;
}

/* home/index */
.logintable td {
   padding-right: 8px;
}

.fronttable h1 {
  font-size: 22px;
}

.fronttable {
	padding-top: 0px; 
}
.fronttable td {
	padding-right: 7px;
	font-size: .92em;	
}

/* store */

.cart td {
  border: 1px solid #BBB;
  margin: 0;
  padding: 5px;
}

#cc_form td {
  padding-right: 7px;
}

/* background/colors */
.dot {color: #666; padding-left: 1px; padding-right: 1px;}

.bg_button {
  position: relative; top: 51px; left: 25px;
}

.tab {
	border: 1px solid black; 
	border-right: 0;
	float: left;
	background-color: #ddd;
	padding: 2px; 
	padding-right: 8px; 
	padding-left: 8px;
	
	/* need color to be the same as the a-links, arg.  no visited links needed really */
	color: #1984c1;
	cursor: pointer;
  /* why is it using the wierd text-entry pointer?  arg! */
}
.activetab {
	border-bottom: 0;
	background-color: transparent;
	cursor: pointer;	
	/*background-color: #fff;background-color: #fff; border: 1px solid black; border-top: 0;*/
}  

#contest_awards label {
  width: 4em;
  padding-top: 5px;
	float: left;
	display: block;
	text-align: right;
	margin-right: 10px;

}

/* as soon as it has an id, it doesn't match?  wtf! */
#bg_colors label {
	width: 8em;
	float: left;
	display: block;	
	text-align: right;
	margin-right: 0em;

}

#bg_colors .submit {
	margin-left: 11.3em;
}

#bg_colors p {
	margin-bottom: 9px;
	margin-top: 9px;
}

.color_warning {
	margin-left: 22px; font-size: .9em;
}

.bg_cfield {
	margin-left:20px; width:12ex;
}

/* admin/stats */

ul.stat_list {list-style-type: none; padding: 0; margin: 0;}
ul.stat_list li { float: left; padding-right: 5px; padding-top: 10px;}
ul.stat_list li img { margin-bottom: 8px; border: 1px solid #999;}



/* scripts */

#dropmenudiv{
    position:absolute;
    border:1px solid black;
		font-size: 12px;
    line-height:20px;
    z-index: 100;
    text-align: left;
    padding-left: 2px;
    z-index: 100;
}

#dropmenudiv a {
  padding: 2px;
}

.linenum {
  float: left;
  clear: left;
  width: 22px;
  margin-right: 8px;
  text-align: right;
  border: 0;
}

/* unused but useful */
.dropcap {
 font: italic 34pt Arial bold;
 color: #000000;
 width: 15pt;
 float: left;
}

/* rails auto complete */
div.auto_complete {
  width: 350px;
  background: #fff;
}
div.auto_complete ul {
  border:1px solid #888;
  margin:0;
  padding:0;
  width:100%;
  list-style-type:none;
}
div.auto_complete ul li {
  margin:0;
  padding:3px;
}
div.auto_complete ul li.selected { 
  background-color: #ffb; 
}
div.auto_complete ul strong.highlight { 
  color: #800; 
  margin:0;
  padding:0;
}

/* corners
new version, no borders: http://www.html.it/articoli/niftycube/index.html */

.rtop,.artop{display:block}
.rtop *,.artop *{display:block;height:1px;overflow:hidden;font-size:1px}
.artop *{border-style: solid;border-width:0 1px}
.r1,.rl1,.re1,.rel1{margin-left:5px}
.r1,.rr1,.re1,.rer1{margin-right:5px}
.r2,.rl2,.re2,.rel2,.ra1,.ral1{margin-left:3px}
.r2,.rr2,.re2,.rer2,.ra1,.rar1{margin-right:3px}
.r3,.rl3,.re3,.rel3,.ra2,.ral2,.rs1,.rsl1,.res1,.resl1{margin-left:2px}
.r3,.rr3,.re3,.rer3,.ra2,.rar2,.rs1,.rsr1,.res1,.resr1{margin-right:2px}
.r4,.rl4,.rs2,.rsl2,.re4,.rel4,.ra3,.ral3,.ras1,.rasl1,.res2,.resl2{margin-left:1px}
.r4,.rr4,.rs2,.rsr2,.re4,.rer4,.ra3,.rar3,.ras1,.rasr1,.res2,.resr2{margin-right:1px}
.rx1,.rxl1{border-left-width:5px}
.rx1,.rxr1{border-right-width:5px}
.rx2,.rxl2{border-left-width:3px}
.rx2,.rxr2{border-right-width:3px}
.re2,.rel2,.ra1,.ral1,.rx3,.rxl3,.rxs1,.rxsl1{border-left-width:2px}
.re2,.rer2,.ra1,.rar1,.rx3,.rxr3,.rxs1,.rxsr1{border-right-width:2px}
.rxl1,.rxl2,.rxl3,.rxl4,.rxsl1,.rxsl2,.ral1,.ral2,.ral3,.ral4,.rasl1,.rasl2{border-right-width:0}
.rxr1,.rxr2,.rxr3,.rxr4,.rxsr1,.rxsr2,.rar1,.rar2,.rar3,.rar4,.rasr1,.rasr2{border-left-width:0}
.r4,.rl4,.rr4,.re4,.rel4,.rer4,.ra4,.rar4,.ral4,.rx4,.rxl4,.rxr4{height:2px}
.rer1,.rel1,.re1,.res1,.resl1,.resr1{border-width:1px 0 0;height:0px !important;height /**/:1px}


/* store */

.cart {
  border: 1px solid #888;  
}

.cart td {
  border-right: 1px solid #888;  
  border-bottom: 1px solid #888;  
  
  margin: 0;
  padding: 5px;
}

.lastrow td  {
  border-top: 1px solid #000;  
}

#cc_form td {
  padding-right: 7px;
}

.fronttable td {
  padding-left: 11px; padding-right: 5px;
}

div.tableholder p {
  margin: 0 0 15px 0;
}

table.signup {
  margin: 5px 0;
  padding: 0px;
  border: 2px solid #444;
}

table.signup tr {
	/*padding-top: 15px;*/
	margin: 10px;
}

table.signup th img {
	margin-top: 3px;
	background-color: #fff;
	border: none;
}

table.signup small {
	color: #999;
}

table.signup th, table.signup th.personal {
	font-size: 16px;
	padding: 3px 7px 3px 7px;
	text-align: center;
	vertical-align: bottom;
	border-bottom: 1px solid #999;
	border-right: 1px solid #E3DFDF;
	border-left: 1px solid #E3DFDF;
}

table.signup th.biz {
	background-image: url(/s/images/topfadepurple.gif);
	background-repeat: repeat-x;
	font-size: 22px;
}

table.signup th.personal {
	font-size: 12px;
}

table.signup th.details {
	font-size: 10px;
	color: #666;
	text-align: right;
	font-weight: normal;
}

table.signup th.details strong {
	color: #000;
}

table.signup th.personal span {
	font-weight: normal;
}

table.signup td.select {
	font-size: 10px;
	font-weight: bold;
	background-color: #ffc;
}

table.signup td.shaded {
	background-color: #ffc;
}

table.signup td.projectnumber {
	font-size: 14px;
}

table.signup td.bigend, table.signup th.bigend {
	border-right: 2px solid #0c0;
}

/* this is for the samll numbers */
table.signup td {
	border-bottom: 1px solid #E3DFDF;
	padding: 7px;
	padding-top: 7px;
	padding-bottom: 7px;
	font-size: 14px;
	
	border-right: 1px solid #E3DFDF;
	border-left: 1px solid #E3DFDF;
	text-align: center;
}

table.costmatrix td {
	margin: 0; padding: 0;
	border: 0;
	text-align: left;
}

table.signup td.smallnumber {
  font-size: 9px;
}

table.signup td.banner {
	background-color: #333;
	color: #fff;
	font-size: 9px;
	font-weight: bold;
}

table.signup td.plancatper, table.signup td.plancatbiz {
	background-color: #fff;
	font-size: 12px;
	font-weight: bold;
}

table.signup td.plancatbiz {
	background-color: #cfc;
	border-bottom: 1px solid #0c0;
}

table.signup td.item {
	text-align: right;
	vertical-align: top;
	font-size: 13px; /* used to be 11. border-right: 1px solid #ccc;*/
	
	white-space: nowrap;
	margin-right: 12px;
	padding-right: 8px;
	
}

table.signup span.price {
	font-size: 12px;
	color: #f60;
	letter-spacing: -0.5px;
	margin-bottom: 2px;
}

table.signup .topstoreline {
	border-top: 1px solid #999;
	padding-top: 10px;
}

.payment_option {
	font-size: 16px;
}

/* ap menu */

#apmenu {
	clear: right;
}

#apmenu p {
	clear:both;
	line-height:20px;
	padding:0 10px 0 15px;
	margin:0;
	}

#apmenu li, .menuli {
	float:left;
	width:80px;
	min-width:10%;
	max-width:200px;
	height:20px;
	border-left:1px solid #eee;
	border-right:1px solid #aaa;
	line-height:20px;
	text-align:center;
	
	background:url(/images/selected.gif) #eee;
	color:#000;
	
	font-size:16px;
	}

/* visited should be same as non-visited, hmm */
#apmenu li a:link, #apmenu li a:visited, .menuli a:link, .menuli a:visited {
	display:block;
	height:20px;
	width:100%;
	color:#000;
	text-decoration:none;
	}

#apmenu .selected, .menuselected {
background:url(/images/hover.gif) #5d5d5d;
color:#FFF !important;
	}

#apmenu li a:hover, #apmenu a.jsHover, .menuli a:hover {
	background:url(/images/hover.gif) #5d5d5d;
	color:#fff !important;
	}
	
#apmenu ul, #apmenu li, form {
	margin:0;
	padding:0;
	}

#apmenu ul li {
	list-style-type:none;
}

/* popup header menu */
.jsMenu {
	position:absolute;
	display:none;
	background-color:#fff;
	border:1px solid #000;
	font: 15px arial, sans-serif;
	margin:0;
	z-index: 11;
}
.jsMenu ul {
	list-style-type:none;
	margin:0;
	padding:0;
}

.jsMenu li { list-style-type: none; z-index: 11; text-align: left;}
.jsMenu li a {
	padding:1px 1px 1px 4px;
	border-bottom:1px solid #000;
	margin:0px;
}

.jsMenu li a {
	/*display:block;*/
	width:100%;
	text-decoration:none;
	color:#000;
	/*border-right:1px inset #e2e2e3;
	border-bottom:1px inset #e2e2e3;*/
}

.jsMenu li a:hover {
	background-color:#cdcdcd; /*#efefef; */
	color:#000;
}

.jsMenu li.separator {
	line-height:1px;
	height:1px;
	background-color:#333;
	padding:0px;
	margin:0px;
}
.jsMenu li.heading {
	background:url(/images/hover.gif) #5d5d5d;
	font-weight:bold;
	color:#fff;
}

.arrow {
	float:right;
	margin:-7px 1px 0px 0px;
	background:transparent url(/images/arrow.gif) no-repeat bottom right;
	height:6px;
	width:10px;
}