//variables
@white: #f6f6f6;
@gray: #2e2e2e;
@black: #000000;
@brown: #623100;
@tan: #f5e3c5;
@red: #b92b2f;
@blue:#0088c3;





html {
	background:url(/images/bkgrnd-wood.jpg) 0 0 repeat;
	}

body {
	color:@gray;
	font:14px Arial;
	}
	
h1 {
    font-size: 55px;
    font-family: sans-serif;
    position: relative;
    color:#452200;
    text-shadow:0 2px 0 @tan;
	text-transform:uppercase;
}


h2 {
	font:italic 30px Georgia;
	margin-bottom:10px;
	text-shadow:0 2px 2px @tan;
	}


h3 {
	color:@black;
	font:bold 20px Arial;
	margin-bottom:4px;
	text-shadow:0 2px 2px #faecd5;
	
		span {
			font:italic 16px Georgia;
			}
			
		span.red {
			color:@red;
			font:bold 20px Arial;
			}
	}

h4 {
	color:@white;
	font:20px Arial;
	text-shadow:0 2px 2px #5a0e10;
	}
	h4 + em {
		color:#efe5a4;
		font:italic 14px Georgia;
		text-shadow:0 2px 2px #5a0e10;
		}
		.guide h4 + em {
			font-size:12px;
			margin-bottom:5px!important;
			width:120px!important;
			}
		
h5 {
	color:@black;
	font:bold 20px Arial;
	text-transform:uppercase;
	}

h6 {
	color:@brown;
	font:bold 14px Arial;
	text-shadow:0 2px 2px #faecd5;
	}
	.scrollable h6 {
		font:bold 16px Arial;
		margin:0 0 10px 15px;
		}
	#send .scrollable h6 {
		font:italic normal 16px Georgia;
		margin:0 0 10px 0;
		}
		
hr {
	background:url(/images/bkgrnd-hr.gif) 0 0 repeat-x;
	border:0 none;
	clear:both;
	height:2px;
	margin:20px 0;
	width:675px;
	}
	
p {
	color:@gray;
	font-size:16px;
	line-height:1.5em;
	margin:5px 0;
	text-shadow:0 2px 2px #f5e6ca;
	
		a {color:@blue;}
	}
	
.left {float:left;}

.right {float:right;}

.clearboth {clear:both;}

.video {
	margin-bottom:7px;
	}

.last,
.last a {background:none!important;}

.common {
	margin:0 auto;
	width:1024px;
	}

#btn-buy-book-large,
#btn-submit,
#btn-share-facebook,
#btn-share-twitter,
#btn-follow-twitter,
#btn-watch-youtube,
#btn-like-facebook,	
#btn-get-guide,
#btn-buy-book-small,
#btn-download-chapter,
.btn-download,
.prev,
.next,
#btn-share-story,
#icon-facebook,
#icon-twitter,
#icon-youtube {
	background-position:0 0;
	background-repeat:no-repeat;
	cursor:pointer;
	display:block;
	font-size:0;
	text-indent:-9999px;
	}
	#btn-get-guide {
		background-image:url(/images/btn-get-guide.png);
		height:30px;
		margin-left:60px;
		width:103px;
		&:hover {
			background-position:0 -31px;
			}
		}
		
	#btn-submit {
		background-image:url(/images/btn-submit.png);
		height:29px;
		width:120px;
		&:hover {
			background-position:0 -29px;
			}
		}
		
	#btn-buy-book-large {
		background-image:url(/images/btn-buy-book.png);
		height:57px;
		padding-right:0!important;
		width:303px;
		&:hover {
			background-position:0 -57px;
			}
		}
	ul.dropdown li.hover a#btn-buy-book-large,
	ul.dropdown li:hover {
			background-position:0 -57px;
			}
		
	#btn-follow-twitter {
		background-image:url(/images/btn-follow-twitter.png);
		height:43px;
		margin-bottom:10px;
		width:247px;
		&:hover {
			background-position:0 -43px;
			}
		}
		
	#btn-like-facebook {
		background-image:url(/images/btn-like-facebook.png);
		height:43px;
		margin-bottom:10px;
		width:247px;
		&:hover {
			background-position:0 -43px;
			}
		}
		
	#btn-watch-youtube {
		background-image:url(/images/btn-watch-youtube.png);
		height:43px;
		margin-bottom:10px;
		width:247px;
		&:hover {
			background-position:0 -43px;
			}
		}
		
	#btn-follow-twitter {
		background-image:url(/images/btn-follow-twitter.png);
		height:43px;
		margin-bottom:10px;
		width:247px;
		&:hover {
			background-position:0 -43px;
			}
		}
		
	#btn-share-facebook {
		background-image:url(/images/btn-share-facebook.png);
		height:34px;
		margin-bottom:10px;
		width:185px;
		&:hover {
			background-position:0 -34px;
			}
		}
		
	#btn-share-twitter {
		background-image:url(/images/btn-share-twitter.png);
		height:34px;
		margin-bottom:10px;
		width:185px;
		&:hover {
			background-position:0 -34px;
			}
		}

		
	#btn-share-story {
		background-image:url(/images/btn-share-story.png);
		background-color:transparent;
		border:0 none;
		box-shadow:none;
		float:right;
		height:30px;
		position:relative;
		top:0;
		width:120px;
		&:hover {
			background-position:0 -31px;
			}
		}
		
	#btn-buy-book-small {
		background-image:url(/images/btn-buy-book-small.png);
		height:42px;
		padding:0!important;
		width:175px;
		&:hover {
			background-position:0 -42px;
			}
		}
		ul.dropdown li.hover a#btn-buy-book-small,
		ul.dropdown li:hover {
			background-position:0 -42px;
			}
		
	#btn-download-chapter {
		background-image:url(/images/btn-download-chapter.png);
		height:35px;
		margin:7px auto;
		position:absolute;
		right:8px;
		top:-15px;
		width:288px;
		&:hover {
			background-position:0 -35px;
			}
		}
		
	.btn-download {
		background-image:url(/images/btn-download.png);
		bottom:14px;
		height:35px;
		position:absolute;
		right:0;
		width:124px;
		&:hover {
			background-position:0 -35px;
			}
		}
		
	.prev {
		background-image:url(/images/arrow-scroll-left.png);
		height:36px;
		margin-right:10px;
		margin-top:120px;
		width:33px;
		&:hover {
			background-position:0 -36px;
			}
		}
	.next {
		background-image:url(/images/arrow-scroll-right.png);
		height:36px!important;
		padding-top:0!important;
		position:absolute!important;
		right:50px;
		top:120px;
		width:33px!important;
		&:hover {
			background-position:0 -36px;
			}
		}
	#header .common ul li#icon-facebook {
		background-image:url(/images/icon-facebook.png);
		margin:6px 6px 0;
		height:20px;
		width:20px;
			
			a {background:none;padding:0;}
		}
	#header .common ul li#icon-twitter {
		background-image:url(/images/icon-twitter.png);
		margin:6px 6px 0;
		height:20px;
		width:20px;
		
			a {background:none;padding:0;}
			
		}
	#header .common ul li#icon-youtube {
		background-image:url(/images/icon-youtube.png);
		margin:6px 6px 0;
		height:20px;
		width:20px;
		
			a {background:none;padding:0;}
			
		}


		

#header {width:100%;}

#header {
	background:url(/images/bkgrnd-top-bar.png) 0 0 repeat-x;
	
	height:135px;
    letter-spacing: 0;
    padding: 0;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9900;
    
	    .common {
		    height:35px;
		    width:930px;
    
		    ul {
			    list-style:none;
			    
			    li {
				    float:left;
				    
				    a {
					    background:url(/images/top-bar-border-right.gif) right 8px no-repeat;
					    color:@white;
					    display:block;
					    font:14px Verdana;
					    padding:10px 12px 3px;
					    &:hover {color:#c6a270;}
					    }
			    
				  }
			}
			ul.left li:first-child a {padding-left:0;}
				  
			
		}
    
    #navigation {
	    background:url(/images/bkgrnd-nav.png) 0 bottom repeat-x;
	    clear:left;
	    height:73px;
	    padding-top:27px;
	    
	    
	    ul {
		    margin:0 auto;
		    width:944px;
		    
		    li {
			    background:url(/images/nav-border-right.png) right 8px no-repeat;
			    float:left;
			    padding:0 16px;
			    
			    a {
				    background-image:url(/images/btn-navigation.png);
				    background-repeat:no-repeat;
				    cursor:pointer;
				    display:block;
				    font-size:9;
				    height:37px;
				    line-height:0;
				    text-indent:-9999px;
				    
				    width:117px;
				    }
		    
			    }
			 #btn-home {
				 padding-left:0;
						a {
						background-position:0 0;
						}

					}
					
				#btn-wess a {
					background-position:-151px 0;
					}
					
				#btn-chapter a {
					background-position:-303px 0;
					width:159px;
					}
					
				#btn-guide a {
					background-position:-497px 0;
					width:206px;
					}
					
			#btn-story {
					background:none;
					padding-right:0;
						a {
						background-position:-738px 0;
						width:204px;
						}
					}
			    }
    
		    }
		    
		}



#main {


	> article {
	
			background:url(/images/bkgrnd-shelf-divider.png) 0 bottom repeat-x;
			
			.common {
				background:url(/images/glow.png) center 0 no-repeat;
				height:724px;
				padding:126px 0 0;
				position:relative;
				
				
				.shelf {
					background:url(/images/bkgrnd-shelf.png) 0 bottom no-repeat;
					position:relative;
					padding-left:47px;
					padding-bottom:80px;
					}
				
				footer {
						bottom:8px;
						clear:both;
						
						position:absolute;
						text-align:right;
						text-transform:uppercase;
						width:100%;
				
							a {
								color:@brown;
								font:24px Arial;
								text-shadow: 0 2px 0 #e2c9a5;
								&:hover {color:@black;}
								
								span {
									color:@black;
									font:italic 14px Georgia;
									text-shadow: 0 2px 0 #d8b88a;
									}
								
								}
						
						}	
				}
		}
	

			
	#home {
	
			.common {
				height:665px;
				padding-top:185px;	
				
				width:1024px;
				
				
				.left {
					width:565px;
					
					h1 {margin-bottom:0;}
					
					h2 {margin-bottom:20px;}
					
						.left {
						
							width:256px;
							
							p {
								font-size:14px;
								font-weight:bold;
								float:left;

								a {

								    font-weight: normal;

								  }
								
								}
							
							ul {
								float:right;
								list-style:none;
								
									li {
										float:left;
										margin-left:10px;
										}
								}
							
							}
						
						.right {
							float:none;
							margin-left:285px;
							}
					
						}
						
					#buy-book {
						background:url(/images/img-jam-book.png) 0 0 no-repeat;
						float:right;
						height:478px;
						margin-right:28px;
						width:383px;
						}
					
				}
				
				
		
		}
		
	#wess,
	#story,
	#like,
	#about,
	#send {
	
		.common {
			height:735px;
			padding-top:126px;
			
			.shelf {
			
					.ribbon {
						background:url(/images/bkgrnd-red-ribbon.png) 700px 0 no-repeat;
						
						padding-bottom:24px;
						position:relative;
						
							#smoothmenu1 {
							
								
								}
			
							> .left {
									margin-top:59px;
									width:720px;
									
									h1 {
										
										img {
											float:none;
											margin-bottom:10px;
											}
										}
									
									img {
										float:left;
										margin-right:20px;
										}
										
									img.video {
										margin-left:15px;
										margin-right:7px;
										}
										
									.clearboth {
										margin-top:30px;
										}
										
									.clearboth + h3 {
										text-indent:17px;
										}
										
									img.video + p {
									     font-size: 14px;
									     font-weight: bold;
									     margin:0;
									     position:relative;
									     text-indent:15px;
									     text-shadow:0 2px 2px #F5E6CA;
									     top:-5px;
									     }
									     
									p {
										color:;
										}
										
									     	
									ul {
										list-style:none;
										
											li {
												
													a {
														img.video {
															margin-left:13px;
															margin-right:0;
															}
													}
												}
										}
								}
								
								
							.right {
									/*height:300px;*/
									padding-top:212px;
									position:relative;
									width:256px;
									
									.title {
										text-align:center;
										width:220px;
										}
										
									.guide {
										background:url(/images/img-study-guide.png) 10px 54px no-repeat;
										margin-top:65px;
										padding-left:30px;
										width:190px;
										
										
											em {
												display:block;
												margin:9px 0 9px 65px;
												width:103px;
												}
										}
										
									}
						
								}
			
							}
			
			
						}
	
	
					}
		
		
	#chapter,
	#guide {
	
		.common {
			height:720px;
			padding-top:126px;
			
			.shelf {
					padding-bottom:65px!important;
					
					.ribbon {
						background:url(/images/bkgrnd-red-ribbon.png) 700px 0 no-repeat;
						
						padding-bottom:0;
			
							> .left {
									margin-top:59px;
									position:relative;
									width:720px;
									
									h1 {
										
										img {
											float:none;
											margin-bottom:5px;
											}
										}
									
									img {
										float:left;
										margin-right:20px;
										}
										
									img.video {
										margin-left:15px;
										margin-right:7px;
										}
										
									.clearboth {
										margin-top:30px;
										}
										
									.clearboth + h3 {
										text-indent:17px;
										}
										
									img.video + p {
									     font-size: 14px;
									     font-weight: bold;
									     margin:0;
									     position:relative;
									     text-indent:15px;
									     text-shadow:0 2px 2px #F5E6CA;
									     top:-5px;
									     }
									     
									p {
										color:;
										}
									     	
									ul {
										list-style:none;
										
											li {
												
													a {
														img.video {
															margin-left:13px;
															margin-right:0;
															}
													}
												}
										}
								}
								
								
							.right {
									height:300px;
									padding-top:212px;
									width:256px;
									
									.title {
										text-align:center;
										width:220px;
										}
										
									.guide {
										
										margin-top:15px;
										padding-left:30px;
										width:190px;
										
										
											em {
												display:block;
												margin:9px 0 9px 65px;
												width:103px;
												}
										}
										
									}
						
								}
			
							}
			
			
						}
	
	
					}
		
		
				}			
			
			
#main #story {
	
		.common {
			height:1100px;
			padding-top:126px;
			
				.shelf {
					background:none;
					}
			}
		}
		
		

		
#main #guide .common .shelf .ribbon > .left h1 {height:75px;}
#main #story .common .shelf .ribbon > .left {height:920px;}
#main #story .common .shelf .ribbon > .left h1 {height:85px;}
#main #guide .common .shelf .ribbon > .left p  {margin-bottom:10px;} 
#main #guide .common .shelf .ribbon > .left p + h3 {margin-bottom:25px;}
#main #story .common .shelf .ribbon > .left h3 + p {width:600px;}
#main #send .common .shelf .ribbon > .left h1 + p {width:690px;}

#main #guide .common .shelf {padding-bottom: 80px !important;}
#main #wess .common {height:1005px;}
#main #wess .common .shelf {padding-bottom: 60px !important;}

#main #guide .common {height:900px;}

#main #about .common .shelf {

	padding-bottom:100px!important;
	
		.ribbon {
		

				.left {
						
						h1 {
							
							
							img {
							
								margin-bottom:0;
								}
							}
						}
						
						
				.right {
				
						.guide {
								height:175px;
								}
						
						}
				}
	
	}


#main #like .common {

	height:755px;
	
	.shelf {
			padding-bottom:67px;
			}
	
}

#main #like .common .shelf .ribbon > .left {

	width:685px;
	
	.clearboth {margin-top:50px;}
	
	.left {width:270px;}
	
	h3 {margin-bottom:12px;}
	
	.right {padding-top:0;width:355px;margin-right:10px;}
	
	}
	
#main #like .common .shelf .ribbon > .left img {float:right;margin-right:0;}


#main #about .common .shelf .ribbon > .left {

	width:693px;
	
	img.right {
	float:right;
	height:auto;
	margin-left:20px;
	margin-right:0;
	padding-top:0;
	width:auto;
	}

	
}



/* Share story form */ 
form.pretty {

	margin-top:20px;
	width:638px;

	span {
				color:#623100;
				font:italic 12px Georgia;
				}
	label {
			color:@brown;
			display:block;
			font:bold 14px Arial;
			margin-bottom:3px;
			
			em {color:@red;}
			
			span {
				float:right;
				}
		}
	input,
	textarea {
		border:1px solid #bba688;
		-moz-box-shadow:0 1px 0 @white;
		-webkit-box-shadow:0 1px 0 @white;
		-moz-border-radius: 2px;
		border-radius: 2px;
		box-shadow:0 1px 0 @white;
		color:#959595;
		font:italic 16px Georgia;
		margin-bottom:13px;
		padding:6px 9px;
		width:620px;
		}
		
	textarea {height:68px;}



}			

form#share-form-form.pretty {
	margin-top:0;
	width:720px;
	}	
			
form.pretty .choice {
		font-weight:normal;
		clear:both;
		color:#000;		
		margin-left:110px;
		padding-top:20px;
		
			input {
				margin-bottom:5px;
				width:20px!important;
				}
		}	
						
								
#book {
	background:url(/images/bkgrnd-book.png) right center no-repeat;
	height:410px;
	padding:40px 0 0 90px;
	position:relative;
	width:547px;
	
		p {
			margin-bottom:20px;
			text-shadow: 0 1px 2px #ededed;
			}
	
		.left {
			width:210px;
			}
			
		.right {
			float:none;
			margin-left:262px;
			padding-top:0!important;
			width:210px!important;
			}
	}			
			
	
.arrow-down {
	background:url(/images/arrow-down.png) right center no-repeat;
	padding:3px 40px 3px 0;
	}
	
.arrow-up {
	background:url(/images/arrow-up.png) left center no-repeat;
	padding:3px 0 3px 40px;
	}
	
.arrow-dbl-up {
	background:url(/images/arrow-dbl-up.png) right center no-repeat;
	padding:3px 40px 3px 0;
	}
	
#previous,
#next {
	background-repeat:no-repeat;
	bottom:50px;
	color:#787878;
	display:block;
	font:italic 14px Georgia;
	height:14px;
	position:absolute;
	text-transform:uppercase;
	
	}
	
#previous {
	background-image:url(/images/arrow-left.png);
	background-position:0 0;
	left:90px;
	padding-left:20px;
	&:hover {
		background-position:0 -14px;
		color:@black;
		}
	}	
	
#next {
	background-image:url(/images/arrow-right.png);
	background-position:right 0;
	padding-right:20px;
	right:90px;
	&:hover {
		background-position:right -14px;
		color:@black;
		}
	}	





/* Scroll styles */

#guide .items {
	float:left;
	height:257px;
	margin-bottom:15px;
	position:relative;
	width: 196px;
	
		h6 {
			margin-bottom:5px;
			text-indent:10px;
			}
	}
	
	

#send .scroll {
	position:relative;
	height:405px;
	width:378px;
	
		.prev {
			top:300px!important;
			left:0;
			margin-right:1px;
			margin-top:0;
			position:absolute;
			}
		
		.next {
			top:300px!important;
			margin-left:2px;
			right:0;
			}
		
		.scrollable {
			position:relative;
			overflow:hidden;
			width:378px;
			height:405px;
			
				.items {
						/* this cannot be too large */
						width:20000em;
						position:absolute;
			
					div {
						float:left;
						height:382px;
						position:relative;
						width:378px;
						}
			
				}
		
		}


}



#story .scroll {
	position:relative;
	height:480px;
	margin-top:20px;
	width:720px;
	
		.prev {
			margin-right:18px;
			}
	
	
		.scrollable {
			position:relative;
			overflow:hidden;
			width: 588px;
			height:480px;
			
				.items {
						/* this cannot be too large */
						width:20000em;
						position:absolute;
			
					div.quote {
						display:block!important;
						float:left;
						height:480px;
						margin-right:22px;
						position:relative;
						width: 273px;
						
						blockquote {
							background:url(/images/bkgrnd-comment.png) 0 0 no-repeat;
							height:320px;
							padding:12px;
							width: 249px;
							
								p {
									color:@gray;
									font:italic 12px Arial;
									margin:0;
									}
									
                .video {
                  margin: 10px;
                  font: italic 12px/1.5em Georgia;
                  
                  a {
                    color: #000;
                    }
                  }
							}
							
						cite {
							background:url(/images/bkgrnd-cite.png) 0 0 no-repeat;
							color:@black;
							display:block;
							font:bold 13px Arial;
							padding-top:20px;
							text-shadow:0 2px 2px #FAECD5;
							width: 273px;
							
								a {
									color:@blue;
									font-weight:normal;
									float:right;
									text-shadow:0 2px 2px #FAECD5;
									}
							}
						time {
							color:@black;
							font:italic 12px/1.5em Georgia;
							text-shadow:0 2px 2px #FAECD5;
							}
							
						}
						
						.abuse {
						  float: right;
						  margin-right: 10px;
							padding-top:20px;
							color:@black;
							font:italic 12px/1.5em Georgia;
							text-shadow:0 2px 2px #FAECD5;						
						}
			
				}
		
		}


}



#share {
	background:url(/images/bkgrnd-share-stretcher.png) 0 0 repeat-y;
	width:353px;
	
	hr {
			background:url(/images/bkgrnd-share-hr.gif) 0 0 repeat-x;
			margin:10px 0;
			width:auto;
			}
			
		p {
			color:@gray;
			font:italic 12px/1.5em Arial;
			margin:0;
			overflow:auto;
			padding:0 12px;
			
				a {
					float:right;
					margin-top:10px;
					}
			}
		}

	
	#share-header {
		background:url(/images/bkgrnd-share-header.png) 0 0 no-repeat;
		padding:12px 1px 0;
		}
		
				
	#share-footer {
		background:url(/images/bkgrnd-share-footer.png) 0 0 no-repeat;
		height:37px;
		}


#main #send .common {
	height:920px;
	
	.shelf {
		padding-bottom:75px;
		}

	}
	
#main #send .common .shelf .ribbon > .left .clearboth + h3 {text-indent:0;}
#main #send .common .shelf .ribbon .left .right {
	padding-top:0;
	width:350px;
	
		form.pretty {
		
			width:350px;
			
			label {
				margin-bottom:5px;
				}
				
			hr {
				clear:both;
				margin:10px 0;
				width:335px;
				}
		
			.col {
				float:left;
				margin-right:6px;
				width:157px;
				}

			input {
				padding-right:0;
				width:148px;
				}
				
			#btn-submit {
				background-color:transparent;
				border:0 none;
				box-shadow:none;
				float:right;
				}
				
			.signup {
					color:@brown;
					
					font:italic 11px Georgia;
					
					input {
						margin:0 3px 0 0;
						width:auto;
				}
			}
				
						
			textarea {
				height:70px;
				width:305px;
				}

	}
}


#ecard-form {
	width:327px!important;
			
					label {
						margin-bottom:5px;
						}
					
					hr {
						clear:both;
						margin:10px 0;
						width:319px;
						}
				
					.col {
						float:left;
						margin-right:6px;
						width:157px;
						}
		
					input {
						font-size:14px;
						padding-right:0;
						width:143px;
						}
						
					#btn-submit {
						background-color:transparent;
						border:0 none;
						box-shadow:none;
						float:right;
						}
						
					
						
					.signup {
							color:@brown;
							
							font:italic 11px Georgia;
							
							input {
								border:0 none;
								margin:0 3px 0 0;
								width:auto;
						}
					
					}
					
				textarea {
					font-size:14px;
					height:70px;
					width:295px;
					}
				
			}


/* Book dropdown */

.ddsmoothmenu {
	position:absolute;
	top:15px;
	right:115px;
	}
	
ul.dropdown { 
	position: relative; 
	}
	
ul.dropdown li {
	list-style:none;
	zoom: 1;
	}
	
	
.sub_menu {
	background-color:#fff;
	box-shadow:none!important;
	border-radius: 0 0 20px 20px;
	-moz-border-radius: 0 0 20px 20px;
	-webkit-border-radius: 0 0 20px 20px;
	padding-bottom:10px;
	position: absolute;
	top: 100%;
	left: 0;
	visibility: hidden;
	width:303px;
	behavior: url(/js/PIE.htc);
	
	li {
	
		a {
			color:@blue;
			display: inline-block;
			padding:5px 26px;
			font-size:16px;
			
			span {
				color:#000;
				}
			}
		
		}
	}
	

.ribbon .title .ddsmoothmenu {
	margin:7px auto;
	right:58px;
	top:255px;
	
	.sub_menu {
		border-radius: 0 0 10px 10px;
		-moz-border-radius: 0 0 10px 10px;
		-webkit-border-radius: 0 0 10px 10px;
		width:175px;
		behavior: url(/js/PIE.htc);
		}
		
		li { 
		
			text-align:left;
			
			a {
				font-size:12px;
				padding:5px 0 5px 15px;
				}
	}	
	
}
	
	
	
	

/**
 * Markup free clearing.
 *
 * @see http://perishablepress.com/press/2009/12/06/new-clearfix-hack
 */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
/* IE6 */
* html .clearfix {
  height: 1%;
}
/* IE7 */
*:first-child + html .clearfix {
  min-height: 1%;
}