/*~	layout module	
	 Module for controlling alignment, layout and width of page.
	 Limitations:
	 - no support for any order columns
*/

/*~	page alignment	*/
			body.center { text-align : center ; }
			body.center #container { margin : 0 auto ; text-align : left ; }
			body.center #container2 { margin : 0 auto ; text-align : left ; }
			body.center #container3 { margin : 0 auto ; text-align : left ; }
			body.center #container4 { margin : 0 auto ; text-align : left ; }
			body.center #container5 { margin : 0 auto ; text-align : left ; }
			body.center #container6 { margin : 0 auto ; text-align : left ; }
			body.center #container7 { margin : 0 auto ; text-align : left ; }
			body.center .container { margin : 0 auto ; text-align : left ; }
			
/*~	generic page widths	*/
	/*	fixed width will not scale horizontally	*/
			body .fixed-sm { width : 640px ; }
			body .fixed-md { width : 760px ; }
			body .fixed-lg { width : 920px ; }
			body .fixed-xlg { width : 1000px ; }
			
	/*	em width will scale both horizontally & vertically	*/
			body .zoom-sm { width : 64em ; }
			body .zoom-md { width : 76em ; }
			body .zoom-lg { width : 90em ; }
			body .zoom-xlg { width : 100em ; }
			
	/*	will fill the whole page	*/
			body .fluid { width : 100% ; }
			
/*~	common stuffs	*/
			.section, .standard, .classic, .layout { clear : both ; width : 100% ; }
			.section, .gr { position : relative ; _position : static ; *position : static ; }
			
			.layout .gr { float : left ; }
			
			/*	makes good with the source order	*/
			.a-b .b, 
			.a-c .c, 
			.b-c .c { float : right ; }
			
			/*	fix nesting for above	*/
			.a-b .gr .b, 
			.b-c .gr .c , 
			.a-c .gr .c { float : left ; }
			
/*~	column widths */
	/*~	.classic	*/
			.classic .a-b-c .gr, 
			.classic .a-b .gr, 
			.classic .b-c .gr,  
			.standard .classic .a-b-c .gr, 
			.standard .classic .a-b .gr, 
			.standard .classic .b-c .gr { width : 25% ; } 
			
			.classic .a-b-c .b, 
			.standard .classic .a-b-c .b { width : 50% ; }
			
			.classic .a-b .b,  
			.classic .b-c .b, 
			.standard .classic .a-b .b,  
			.standard .classic .b-c .b { width : 75% ; }
			
	/*~	.standard - doesn't require the standard class to work though it helps readability	*/
			.a-b-c-d .gr, 
			.standard .a-b-c-d .gr, 
			.standard .layout .a-b-c-d .gr { width : 25% ; _width : 24.9% ; *width : 24.9% ; }
			
			.a-b-c .gr, 
			.standard .a-b-c .gr, 
			.standard .layout .a-b-c .gr { width : 33.3% ; }
			
			.a-c .gr, 
			.standard .a-c .g, 
			.classic .a-c .gr { width : 50% ; _width : 49.9% ; *width : 49.9% ; } 
			
			.a-b .b, 
			.b-c .b, 
			.standard .a-b .b, 
			.standard .b-c .b , 
			.standard .layout .a-b .b, 
			.standard .layout .b-c .b  { width : 67% ; }
			
			.a-b .a, 
			.b-c .a, 
			.standard .a-b .a, 
			.standard .b-c .c, 
			.standard .layout .a-b .a, 
			.standard .layout .b-c .c { width : 33% ; }

/*~	.tidy - handles equal column heights. It will recurse down into nested layouts so if you don't want 
		equal column heights in child layouts then add a class of .untidy to them	\*/
			.tidy .layout { overflow : hidden ; }
			.tidy .gr { margin-bottom : -1000em ! important ; padding-bottom : 1000em ! important ; }
			@media all and (min-width: 0px) {
				.tidy .gr { margin-bottom : 0 ; padding :  0 ; }
				.tidy gr:after { 
					background : inherit ; 
					content : ' ' ; 
					display : block ; 
					margin-bottom : -1000px ; 
					padding-bottom : 1000px ; 
				}
			}
		/*	end equal column height fix	*/
		
/*~	.untidy	over-write equal column heights for child layouts \*/
			.untidy .layout { overflow : visible ; }
			.untidy .gr { margin-bottom : 0 ! important ; padding-bottom : 0 ! important ;  }
			@media all and (min-width: 0px) {
				.tidy gr:after { 
					display : inline ; 
					margin-bottom : 0 ; 
					padding-bottom : 0 ; 
				}
			}
			
.relative {
  position: relative;
}
		

.commentlist .comment-author-admin {
    padding: 5px;
    background-color: #eef4ef;
    background-image: -webkit-gradient(linear, left center, right center, from(rgb(238, 244, 239)), to(rgb(201, 199, 195)));
    background-image: -webkit-linear-gradient(left, rgb(238, 244, 239), rgb(201, 199, 195));
    background-image: -moz-linear-gradient(left, rgb(238, 244, 239), rgb(201, 199, 195));
    background-image: -o-linear-gradient(left, rgb(238, 244, 239), rgb(201, 199, 195));
    background-image: -ms-linear-gradient(left, rgb(238, 244, 239), rgb(201, 199, 195));
    background-image: linear-gradient(left, rgb(238, 244, 239), rgb(201, 199, 195));
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#eef4ef', EndColorStr='#c9c7c3');
}

.page-width {
	width: 946px;
  margin: 0 auto;
}

div#footer {
  position: relative;
  margin: 0 auto;
  padding: 0;
  height: 50px;
  margin-top: -50px;
  background: #dddddd;
  color: #aaaaaa;
  clear: both;
  font-size: 13px;
  font-family: Helvetica,Arial,Verdana,sans-serif;
  line-height: 1.7em;
  font-weight: normal;
  text-align: start;
}

div#footer .footer-font {
  color: #888888;
  font-size: 12px;
}

div#footer a.footer-font {
  font-weight: normal;
}

div#footer a.footer-font:hover {
  color: #66AA33;
}

div#footer div.shadow {
  position: relative;
}

div#footer div.shadow:after {
  display: block;
  position: absolute;
  content: '';
  left: 0;
  bottom: -10px;
  background: red;
  width: 100%;
  height: 10px;
  background: url('http://www.hulu.com/images/new/box-shadow-bottom.png') no-repeat 50% 0;
}

div#footer div.page-width {
  padding-top: 17px;
}

div#footer div.page-width div.left {
  float: left;
}

div#footer div.page-width div.right {
  float: right;
}

div#footer div.page-width a {
  padding: 0px 7px;
}

div#footer div.page-width a:first-child {
  padding-left: 0px;
}

div#footer div.page-width span {
  padding-left: 7px;
}

div#footer div.page-width div.footer-clear {
  clear: both;
}
