/* Customized by TNM 9/29/2009
 * Added the following classes:
 * 	.d		Base div - default to float left (TODO: is this needed?)
 * 	.dl		Div left - float this div to left
 * 	.dr		Div right - float this div to right
 * 	.df		Div fluid - fluid div with auto width
 * 	.de		Div end - last div in a row, do clearfix
 * 	.d1		Div 1em - this div is 1em wide
 * 	.d2		Div 2em - this div is 2em wide
 * 	...
 * 	.d70	Div 70em - this div is 70em wide
 * 	.d75	Div 75em - this div is 75em wide
 * 		(added .dl3, .dr3, .dl4, dr4, .dl48, .dr48 as well -- weren't in original emastic)
 * Use these to make CSS usage more object oriented:
 * 		<div class="dl d15">Column</div>
 * 
 * Can change float positions from outside:
 * 	<div class="panel">
 * 		<div class="d15 column">Column</div>
 * 		<div class="fluid de">Body</div>
 *  </div>
 *  
 *  By default, above has column on left. But apply these styles, and it will be on the right:
 *  	.panel .column {
 *  		float: right;
 *  	}
 */

.main { 
width:70em;margin:0 auto;text-align:left;  }

.clear {clear:both;}

.d,
.dl,
.dl1,
.dl2,
.dl3,
.dl4,
.dl5,
.dl10,
.dl15,
.dl20,
.dl25,
.dl30,
.dl35,
.dl40,
.dl45,
.dl48,
.dl50,
.dl55,
.dl60,
.dl65,
.dl70,
.dl75{float:left; display: inline; }

.dr,
.dr1,
.dr2,
.dr3,
.dr4,
.dr5,
.dr10,
.dr15,
.dr20,
.dr25,
.dr30,
.dr35,
.dr40,
.dr45,
.dr48,
.dr50,
.dr55,
.dr60,
.dr65,
.dr70,
.dr75
{float:right; display: inline; }

.d1, .dl1, .dr1 {width:1em;}
.d2, .dl2, .dr2 {width:2em;}
.d3, .dl3, .dr3 {width:3em;}
.d4, .dl4, .dr4 {width:4em;}
.d5, .dl5, .dr5{width:5em;}
.d10, .dl10, .dr10{width:10em;}
.d15, .dl15, .dr15{width:15em;}
.d20, .dl20, .dr20{width:20em;}
.d25, .dl25, .dr25{width:25em;}
.d30, .dl30, .dr30{width:30em;}
.d35, .dl35, .dr35{width:35em;}
.d40, .dl40, .dr40{width:40em;}
.d45, .dl45, .dr45{width:45em;}
.d48, .dl48, .dr48{width:48em;}
.d50, .dl50, .dr50{width:50em;}
.d55, .dl55, .dr55{width:55em;}
.d60, .dl60, .dr60{width:60em;}
.d65, .dl65, .dr65{width:65em;}
.d70, .dl70, .dr70{width:70em;}
.d75, .dl75, .dr75{width:75em;}


.ml5{margin-left:5em;}
.ml10{margin-left:10em;}
.ml15{margin-left:15em;}
.ml20{margin-left:20em;}
.ml25{margin-left:25em;}
.ml30{margin-left:30em;}
.ml35{margin-left:35em;}
.ml40{margin-left:40em;}
.ml45{margin-left:45em;}
.ml50{margin-left:50em;}
.ml55{margin-left:55em;}
.ml60{margin-left:60em;}
.ml65{margin-left:65em;}
.ml70{margin-left:70em;}
.ml75{margin-left:75em;}

.mr5{margin-right:5em;}
.mr10{margin-right:10em;}
.mr15{margin-right:15em;}
.mr20{margin-right:20em;}
.mr25{margin-right:25em;}
.mr30{margin-right:30em;}
.mr35{margin-right:35em;}
.mr40{margin-right:40em;}
.mr45{margin-right:45em;}
.mr50{margin-right:50em;}
.mr55{margin-right:55em;}
.mr60{margin-right:60em;}
.mr65{margin-right:65em;}
.mr70{margin-right:70em;}
.mr75{margin-right:75em;}

.mt1{margin-top:1em;}
.mt5{margin-top:5em;}
.mt10{margin-top:10em;}
.mt20{margin-top:20em;}
.mt30{margin-top:30em;}
.mt40{margin-top:40em;}
.mt50{margin-top:50em;}

.df, .fluid {width:auto;    float:none;}
div .df, div .fluid {padding:0em 0em 0em 0.1em;}

.hp{width:100%;  float:left; }

.de, .clearfix, .main{ display:block;} 

.de:after, .clearfix:after, .main:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
	 
     }

/* IE5/MAC hack \*/
* html .clearfix{ display: inline;  height: 1px;}
/* close */
 


