/* XLsuite  CSS > typography

created: 2007-06-22 | by: imaxim@gmail.com 
updated: 2007-07-26 | by: james@xlsuite.com 
purpose: typography issues & classes
details: 

*/

/*
  > > > > > > elements - - - - - - -
*/

a, a:visited { color: #008eb0; }
a:hover      { color: #8dc63f; }
a:hover      { cursor:pointer;}
body         { min-width: 460px; background: #fff url() no-repeat 0 0; font: 11px Verdana, sans-serif; color: #000000; }
strong       { font-weight: bold; }
p            { line-height: 17px; }
h1           { font-size: 15px; }
h2           { font-size: 14px; }
h3           { font-size: 13px; }
h4           { font-size: 12px; }
h5           { font-size: 11px; }
h6           { font-size: 10px; }

abbr, acronym, .help {
  border-bottom: 1px dotted #333;
  cursor: help;
  }
  
/*
  > > > > > > superclasses - - - - - - -
*/

.normal { font-style: normal; }
.bold   { font-weight: bold;  }
.italic { font-style: italic; }

.clear  { clear: both;     }
.inline { display: inline; }
.block  { display: block;  }

.small {font-size: .9em}

.ta_center {text-align: center;}
.ta_right {text-align: right;}
.ta_left {text-align: left;}


.inlineLabel           { display:inline; float: left; padding: 2px 1px 3px 3px; margin-top: 1px; margin-bottom: 1px; }
	.inlineLabel:after { content: ':'; }
	
.left  { float: left;  } .fl {float: left;}
.right { float: right; } .fr {float: right;}

.il    {float: left; clear: left;   }
.ir    {float: right; clear: right; }

.fldi  {float: left; display: inline; }
.frdi  {float: right; display: inline;}

.row { clear:both; display: block; }
.section    { display: block; margin: 0; padding: 0; }
.section h2 { width: 140px; font-weight: bold; border-bottom: 1px solid #ccc; margin-bottom: 6px; padding-bottom: 2px; clear: both; }
.tags { background: #fff; }
.throb { background: #fff url(../img/loader.gif) no-repeat top left; }
.smallText { font-size: 10px; }
.inlineHeader { font-weight: bold; display: inline; float: left; }
.pad3 {padding-left: 3px}
.indent {margin-left: 1em;}

.red     {color: red;   }
.green   {color: green; }
.blue    {color: blue;  }

.w10     { width:10%;    }
.w15     { width:15%;    }
.w20     { width:20%;    }
.w25     { width:25%;    }
.w30     { width:30%;    }
.w33     { width:33.33%; }
.w50     { width:50%;    }
.w75     { width:75%;    }
.w100    { width:100%;   }

.p1      { padding: 1px 1px 1px 1px;     }
.p2      { padding: 2px 2px 2px 2px;     }
.p3      { padding: 3px 3px 3px 3px;     }
.p4      { padding: 4px 4px 4px 4px;     }
.p5      { padding: 5px 5px 5px 5px;     }
.p10     { padding: 10px 10px 10px 10px; }

.m1      { margin: 1px 1px 1px 1px;      }
.m2      { margin: 2px 2px 2px 2px;      }
.m3      { margin: 3px 3px 3px 3px;      }
.m4      { margin: 4px 4px 4px 4px;      }
.m5      { margin: 5px 5px 5px 5px;      }
.m10     { margin: 10px 10px 10px 10px;  }

th.60    {width: 60%                     }
th.40    {width: 40%                     }
th.30    {width: 30%                     } 
th.20    {width: 20%                     }
th.15    {width: 15%                     }
th.10    {width: 10%                     }

/*table type*/

td.label {font-weight: bold; text-align: right; padding-right: 4px;}
td.align_right {text-align: right;}
.warnings {padding: .6em; border: 1px solid #ddd;}
.warnings li.warning {color: red;}

/*standard page heading*/

h2.page_header { display: block; padding: 3px; text-align: left; color: #000000; background: #fff; border-bottom: 1px solid #ddd; font-size: 12px;}

/*ruled header*/
h2.ruled {font-size: small; font-weight: bold; display: block; border-bottom: 1px solid #ddd; margin-bottom: 10px; width: 100%; clear:both;}


/* typographic this and that */

div.text h2 {display: block; font-weight: bold; padding-bottom: 2px; border-bottom: 1px solid #ddd; margin-bottom: 1em;}

/* breadcrumbs */

#breadCrumbs ul li {display: inline;}
#breadCrumbs ul li a {text-decoration:none; margin-right: .6em; }
#breadCrumbs ul li a.alternate {color: #999;}
#breadCrumbs ul li a.alternate:hover {color:inherit;}
