/**
 * CSS: Frontend 1.2 (typography)
 * - Replaces frontend.css
 * - Uses blueprint framework
 * @author Mark Fullbrook
 * @copyright Brickhunter Ltd, 2009
 */

/* Colours:
Blue: 					#3366cc
Grey Text				#5A6470
Grey Boxes & Borders	#B7C1CA
Grey Text (dark)        #3e444d;
Grey  Page Background	#e9e9e9
Red (discount)			#E00000
*/

/* Font Sizes:
100% = 16px
px to ems:
9   0.5625
10  0.625
11  0.6875
12  0.75
13  0.8125
14  0.875
15  0.9375
16  1
18  1.125
20  1.25
24  1.5
25  1.5625
26  1.625
30  1.875
*/

body { 
  font-size: 100%;
  color: #5A6470; 
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
}

/* @group Headings */
h1,h2,h3,h4,h5,h6 {
  font-weight: normal;
  line-height: 1;
  margin-bottom: 0.75em;
  font-family: "Trebuchet MS", Trebuchet, "Helvetica Neue", Arial, Helvetica, sans-serif;
}
h1 { font-size: 1.625em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.25em; }
h4 { font-size: 1.125em; }
h5 { font-size: 0.875em; font-weight: bold; }
h6 { font-size: 0.75em; font-weight: bold; }

h1.half-margin, h2.half-margin, h3.half-margin, h4.half-margin, h5.half-margin, h6.half-margin {
  margin-bottom: 0.5em;
}

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img {
  margin: 0;
}
/* @end */

/* @group Text elements */
p           { margin: 0 0 0.8em; }
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover     { color: #d01411; text-decoration: underline; }
a           { color: #3366cc; text-decoration: underline; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 				{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }

/* Text Inputs */
.text { font-size: 0.75em; font-family: Arial, Helvetica, sans-serif; }
/* @end */


/* @group Lists */
li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }
ol.alpha    { list-style-type: lower-alpha; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}
/* @end */


/* @group Tables */
table       { width:100%; }
th          { font-weight: bold; }
th,td,caption { padding: 4px 5px 4px 5px; }
tfoot       { font-style: italic; }
/* @end */


/* @group Other Elements */
img         { vertical-align: bottom; }
/* @end */


/* @group Misc classes */
.hide       { display: none; }

.first      { margin-left:0 !important; padding-left:0 !important; }
.last       { margin-right:0 !important; padding-right:0 !important; }
.last-with-pad { margin-right:0 !important; }
.top        { margin-top:0 !important; }
.bottom     { margin-bottom:0 !important; }

.half-margin { margin-bottom: 0.375em; }

img.middle  { vertical-align: middle; }

.ta-left    { text-align: left; }
.ta-right   { text-align: right; }
.ta-center  { text-align: center; }
.va-top     { vertical-align: top; }
.va-middle  { vertical-align: middle; }
.va-bottom  { vertical-align: bottom; }
.va-baseline { vertical-align: baseline; }

.fl-none    { float: none; }
.fl-left    { float: left !important; }
.fl-right   { float: right !important; }
.cl-left    { clear: left !important; }
.cl-right   { clear: right !important; }

.fw-normal  { font-weight: normal; }
.fw-bold    { font-weight: bold; }

.green      { color: green; }
.red        { color: #f11f1f; }
.dark-red   { color: #9c1312; }
.claret     { color: #A61418; }
.white      { color: white; }
.invalid    { color: #f11f1f; text-decoration: line-through; }

.no-underline { text-decoration: none; }
.underline    { text-decoration: underline; }

.lh-16px { line-height:16px; }
.lh-1x   { line-height: 1; }
/* @end */


/* @group Font Sizes */
.f10, .f10b, .f10n { font-size: 0.625em; }
.f11, .f11b, .f11n { font-size: 0.6875em; }
.f12, .f12b, .f12n { font-size: 0.75em; }
.f13, .f13b, .f13n { font-size: 0.8125em; }
.f14, .f14b, .f14n { font-size: 0.875em; }
.f15, .f15b, .f15n { font-size: 0.9375em; }
.f16, .f16b, .f16n { font-size: 1em; }
.f17, .f17b, .f17n { font-size: 1.0625em; }
.f18, .f18b, .f18n { font-size: 1.125em; }
.f20, .f20b, .f20n { font-size: 1.25em; }
.f22, .f22b, .f22n { font-size: 1.375em; }
.f25, .f25b, .f25n { font-size: 1.5625em; }
.f30, .f30b, .f30n { font-size: 1.875em; }
.f10b, .f11b, .f12b, .f13b, .f14b, .f15b, .f16b, .f18b, .f20b, .f22b, .f25b, .f30b { 
  font-weight: bold;
}
.f10n, .f11n, .f12n, .f13n, .f14n, .f15n, .f16n, .f18n, .f20n, .f22n, .f25n, .f30n { 
  font-weight: normal;
}
/* @end */


/* @group Color, Size, Weight
-------------------------------------------------------------- */
/* Blue */
.fBlu, .fBlub, .fBlu10n, .fBlu10b, .fBlu11n, .fBlu11b, .fBlu12n, .fBlu12b,  .fBlu13n, .fBlu13b,
.fBlu14n, fBlu14b, .fBlu16n, .fBlu16b { 
	color: #3366cc;
}
.fBlu10n, .fBlu11n, .fBlu12n, .fBlu13n, .fBlu14n, .fBlu16n { 
	font-weight: normal;
}
.fBlub, .fBlu10b, .fBlu11b, .fBlu12b, .fBlu13b, .fBlu14b, .fBlu16b { 
	font-weight: bold;
}
.fBlu10n, .fBlu10b { font-size: 0.625em; }
.fBlu11n, .fBlu11b { font-size: 0.6875em; }
.fBlu12n, .fBlu12b { font-size: 0.75em; }
.fBlu13n, .fBlu13b { font-size: 0.8125em; }
.fBlu14n, .fBlu14b { font-size: 0.875em; }
.fBlu16n, .fBlu16b { font-size: 1em; }

/* Grey Medium */
.fGrm, .fGrmb, .fGrm10n, .fGrm10b, .fGrm11n, .fGrm11b, .fGrm12n, .fGrm12b, .fGrm13n, .fGrm13b, .fGrm14n, fGrm14b, .fGrm16n, .fGrm16b { 
	color: #5f6670;
}
.fGrm10n, .fGrm11n, .fGrm12n, .fGrm13n, .fGrm14n, .fGrm16n { 
	font-weight: normal;
}
.fGrmb, .fGrm10b, .fGrm11b, .fGrm12b, .fGrm13b, .fGrm14b, .fGrm16b { 
	font-weight: bold;
}
.fGrm10n, .fGrm10b { font-size: 0.625em; }
.fGrm11n, .fGrm11b { font-size: 0.6875em; }
.fGrm12n, .fGrm12b { font-size: 0.75em; }
.fGrm13n, .fGrm13b { font-size: 0.8125em; }
.fGrm14n, .fGrm14b { font-size: 0.875em; }
.fGrm16n, .fGrm16b { font-size: 1em; }

/* Grey Dark */
.fGrd, .fGrdb, .fGrd10n, .fGrd10b, .fGrd11n, .fGrd11b, .fGrd12n, .fGrd12b,  .fGrd13n, .fGrd13b,
.fGrd14n, fGrd14b, .fGrd15n, .fGrd15b, .fGrd16n, .fGrd16b, .fGrd18n, .fGrd18b, .fGrd20n, .fGrd20b { 
	color: #3e444d;
}
.fGrd10n, .fGrd11n, .fGrd12n, .fGrd13n, .fGrd14n, .fGrd15n, .fGrd16n, .fGrd18n, .fGrd20n { 
	font-weight: normal;
}
.fGrdb, .fGrd10b, .fGrd11b, .fGrd12b, .fGrd13b, .fGrd14b, .fGrd15b, .fGrd16b, .fGrd18b, .fGrd20b { 
	font-weight: bold;
}
.fGrd10n, .fGrd10b { font-size: 0.625em; }
.fGrd11n, .fGrd11b { font-size: 0.6875em; }
.fGrd12n, .fGrd12b { font-size: 0.75em; }
.fGrd13n, .fGrd13b { font-size: 0.8125em; }
.fGrd14n, .fGrd14b { font-size: 0.875em; }
.fGrd15n, .fGrd15b { font-size: 0.9375em; }
.fGrd16n, .fGrd16b { font-size: 1em; }
.fGrd18n, .fGrd18b { font-size: 1.125em; }
.fGrd20n, .fGrd20b { font-size: 1.25em; }

/* White */
.fWhi, .fWhi10n, .fWhi10b, .fWhi11n, .fWhi11b, .fWhi12n, .fWhi12b, .fWhi14n, fWhi14b, .fWhi16n, .fWhi16b, .fWhi18b, .fWhi20b { 
	color: #fff;
}
.fWhi10n, .fWhi11n, .fWhi12n, .fWhi14n, .fWhi16n { 
	font-weight: normal;
}
.fWhi10b, .fWhi11b, .fWhi12b, .fWhi14b, .fWhi16b, .fWhi18b, .fWhi20b { 
	font-weight: bold;
}
.fWhi10n, .fWhi10b { font-size: 0.625em; }
.fWhi11n, .fWhi11b { font-size: 0.6875em; }
.fWhi12n, .fWhi12b { font-size: 0.75em; }
.fWhi14n, .fWhi14b { font-size: 0.875em; }
.fWhi16n, .fWhi16b { font-size: 1em; }
.fWhi18b { font-size: 1.125em; }
.fWhi20b { font-size: 1.25em; }


/* @end */