@import url("reset.css");
@import url("overlay.css");

#ja_rule { width: 960px; margin: 5px auto 0; text-align: left; padding: 20px; }

#subCol { width: 205px; position: fixed; top: 90px; }
#subCol ul li { border-top: 1px #ccc solid; padding-top: 10px; }
#subCol h2 { margin-bottom: 10px; }
#subCol h2 a { color:#6CF; }
#subCol h2 a:hover { color: #555; }

#mainCol { width: 715px; margin-left: 205px; }
#mainCol ul { width: 715px; }
#mainCol ul li { width: 238px; height: 320px; float: left; margin-bottom: 10px; }
/* USE THESE CLASSES FOR DISPLAYING JARS */
#mainCol ul li.jar1 { background: url(../images/jar1.gif) no-repeat top left; }
#mainCol ul li.jar2 { background: url(../images/jar2.gif) no-repeat top left; }
#mainCol ul li.jar3 { background: url(../images/jar3.gif) no-repeat top left; }
#mainCol ul li.jar4 { background: url(../images/jar4.gif) no-repeat top left; }
#mainCol ul li.jar5 { background: url(../images/jar5.gif) no-repeat top left; }
#mainCol ul li.jar6 { background: url(../images/jar6.gif) no-repeat top left; }
#mainCol ul li.jar7 { background: url(../images/jar7.gif) no-repeat top left; }
#mainCol ul li.jar8 { background: url(../images/jar8.gif) no-repeat top left; }
#mainCol ul li.jar9 { background: url(../images/jar9.gif) no-repeat top left; }

#mainCol ul li div.paper { background: url(../images/paper.gif) no-repeat top left; width: 196px; height: 204px; text-align: center; margin: 55px auto 0; padding: 20px 0; cursor: pointer; visibility: hidden; opacity: 0; -webkit-transition: opacity 0.7s linear; }
#mainCol ul li:hover div.paper { visibility: visible; opacity: 1; }
#mainCol ul li div.paper h3 { padding: 3px 0 0 0; } 
#mainCol ul li div.paper p { margin: 25px auto 0; font-size: 1.3em; line-height: 1.3em; font-style: italic; width: 135px; height: 130px; padding: 5px 10px; }
#mainCol ul li div.paper p span { clear: both; display: block; margin: 10px 0 0 0; font-style: normal; }

#mainCol a.return { font-size: 1.3em; text-align: right; float: right; padding: 10px 0 20px; }

div.hr {
	height: 1px;
	background: #ccc no-repeat scroll center;
	clear: both;
}

div.hr hr {
  	display: none;
}


/* HEADING REPLACEMENTS */
h1#logo { background: url(../images/logo.gif) no-repeat top left; width: 200px; height: 149px; text-indent: -9999px; margin-bottom: 50px; }
h2#about {/* background: url(../images/about.gif) no-repeat top left; width: 192px; height: 80px; text-indent: -9999px;*/ font: normal 1.4em/1.3em Georgia, "Times New Roman", Times, serif; margin-bottom: 15px; }

.ie6-upgradebar {
     display: none;
}