@charset "utf-8";
/* style.css */

/* SNIPPETS

BOX WITH CORNERS (10x10 corners with 20x20 image)
	.box { position: relative; background: background; border: none; }
	* html .box { height: 1px; }
	
	without border:
		.tl, .tr, .bl, .br { width: 10px; height: 10px; overflow: hidden; background-image: url('url'); background-repeat: no-repeat; background-position: 0 0; position: absolute; }
		.tl { top: 0; left: 0; background-position: 0 0; } .tr { top: 0; right: 0; background-position: -10px 0; }
		.bl { bottom: 0; left: 0; background-position: 0 -10px; } .br { bottom: 0; right: 0; background-position: -10px -10px; }

	with border:
		.tl { top: -1px; left: -1px; background-position: 0 0; } .tr { top: -1px; right: -1px; background-position: -10px 0; }
		.bl { bottom: -1px; left: -1px; background-position: 0 -10px; } .br { bottom: -1px; right: -1px; background-position: -10px -10px; }

ANCHOR BACKGROUND POSITION
	a { width: 0; height: 0; overflow: hidden; background-image: url('url'); background-repeat: no-repeat; background-position: 0 0; color: color; text-decoration: none; }
	a:hover { background-position: 0 0; color: color; }

STANDARD FONTS
	font-family: Arial, Helvetica, sans-serif; 
	font-family: Georgia, "Times New Roman", Times, serif; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
*/	

/* reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, img, small, strong, sub, sup, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-weight: normal; }
body { line-height: 1; } ol, ul { list-style: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; }

/* BASIC TAG STYLES

a { color: #069; text-decoration: underline; }
a:hover { color: #069; text-decoration: none; }
input, textarea, select { color: #666; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }

*/

/* layout customization */
div#container{width:786px;margin:0 auto}
div#content{float:right;width:530px; padding: 20px; padding-top: 0; }
div#navigation{float:left;width:176px; padding: 20px;}
div#extra{float:left;clear:left;width:176px; padding: 20px; }
div#footer{clear:both;width:100%; padding: 15px 0; }

/* style */
body { background: url('design/pattern.jpg'); color: #fff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; margin: 20px; }
a { color: #f90; text-decoration: underline; }
a:hover { color: #fff; text-decoration: underline; }
input, textarea, select { color: #666; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
h1, h2 { font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; }
h1 { font-size: 26px; }
h2 { font-size: 20px; color: #999; }

#container { border: 7px solid #f90; background: #444; }
#header { background: url('design/bg.head.jpg') no-repeat 0 0; height: 300px; position: relative; }

#menu { position: absolute; top: 232px; left: 430px; }
#menu li { display: block; float: left; width: 80px; height: 22px; text-align: center; padding-top: 8px; }
#menu li a { font-family: Georgia, "Times New Roman", Times, serif; font-style: italic; text-decoration: none; font-size: 16px; }
#menu li.spacer { width: 10px; background: url('design/bg.li-spacer.jpg') no-repeat center center; }

#content, #navigation, #extra { line-height: 1.3; }
#content p { text-align: justify; margin-bottom: 10px; }
#content p >img { margin-top: 20px; }
#content ul { list-style-type: circle; margin: 20px; } 
#content h2 { margin-top: 20px; }
#content .column { width: 245px; float: left; text-align: center; margin: 10px; padding: 0; }
#content .column img { margin-bottom: 10px; overflow: hidden; }
#content p.clear { clear: both; margin: top: 10px; }
#content b { font-weight: bold; }

#navigation, #extra { font-size: 11px; }
#navigation ul { list-style: square; margin-left: 20px; }
#navigation ul li { color: #f90; margin-bottom: 5px; }

#extra p { margin-bottom: 5px; }

#footer { background: #333; font-size: 11px; }
#footer p { margin-left: 236px; }