/* ================ general, preparatory ================ */

* { font-family: Trebuchet MS; font-size: 14px; color: #161616; }
strong { color: #444; }
	strong span { font-weight: normal; }
body { margin: 0; padding: 0; background: #e6e6e6; }
.fl, .fl_withBumper, .fl_withBumper2 { float: left; }
.fr, .fr_withBumper { float: right; }
.fl_withBumper { margin: 6px 15px 25px 0; }
.fl_withBumper2 { margin-right: 25px; }
.fr_withBumper { margin: 6px 0 25px 15px; }
.clear, .clear_withBumper, .clear_withBumper2 { clear: both; display: block; }
.clear_withBumper { padding-bottom: 30px; }
.clear_withBumper2 { padding-bottom: 22px; }
.disabled { color: #aaa; text-decoration: none !important; cursor: default; }
	.bold, .bold * { font-weight: bold; }
.important { color: #dd5555; font-weight: bold; }


/* links */

a { color: #00659d; text-decoration: none; }
a:hover { text-decoration: underline; }
.readMore { font-weight: bold; font-style: italic; }
.toTop { border-bottom: solid 1px #a7ca63; margin: 25px 0 10px 0; }
	.toTop a { float: right; margin-top: 8px; }


/* inputs */

input.smaller { width: 80px; }
.textfield1, .textfield2, .select1, .select2 { border: solid 1px #999; }
.textfield1, .select1 { width: 100px; }
.textfield2, .select2 { width: 180px; }


/* headings */

h1, h2, h3, h4, h5, h6 { margin: 0; }
h2 { font-size: 28px; font-family: Georgia; font-weight: normal; margin: 10px 0; color: #333; }
h3 { font-size: 22px; }
h4 { font-size: 17px; color: #444; padding-top: 10px; }
h4.first { border: none; margin-top: 25px; }
h5 { font-size: 15px; color: #95b557; }
	h5 span { font-weight: normal; }


/* lists */

ul { padding: 0; margin: 0; }
	li { list-style: none; }
	ul li { list-style: square inside; padding: 2px 0; }
	ul li:last-child { border: none; }
		ul li p { margin: 0; }
		
ul.pageNav { margin: 0 0 20px 0 !important; padding: 4px 8px; border: solid 1px #ccc; background: #f4f4f4; }
	.pageNav li { font-weight: bold; display: inline; margin-right: 20px; font-size: 13px; color: #666; font-size: 12px; }
	.pageNav li:last-child { margin: 0; }
		.pageNav li a { font-size: 12px; }


/* lists - tabs */

ul.tabs { float: right; position: relative; top: 10px; margin: 0 8px 0 0 !important; }
	ul.tabs li {
		list-style: none;
		float: left;
		background: #eee !important;
		padding: 2px 6px !important;
		margin-left: 4px;
		font-weight: bold;
		color: #555;
		border: none;
	}
		ul.tabs li, ul.tabs li a { color: inherit; text-decoration: none; font-size: 13px !important; color: #444; }
		
		
/* forms */

.field { color: #777; height: 22px; line-height: 22px; border: solid 1px #999; padding: 2px; font-weight: bold; text-indent: 4px; }
button, .but {
	border: none !important; height: 28px !important; float: right; color: #fff !important; font-weight: bold; background: #26a1ce; cursor: pointer;
}
	

/* ================ specific - top area ================ */

/* general, montage */

#top { background: #131313 url('top_bg00.png') repeat-x; height: 180px; width: 100%; position: relative; overflow: hidden; }
	#top div { width: 1000px; height: 100%; margin: 0 auto; position: relative; }
		#top div div { background: url('logo0000.png') no-repeat 40px 20px; position: absolute; z-index: 3; }
			#top div div div {
				background: url('top_text.png') no-repeat left top; width: 717px; height: 96px; position: absolute; left: 250px; top: 18px;
			}
			#top div div span {
				position: absolute; right: -40px; width: 319px; height: 214px; background: url('big_zebr.png') no-repeat transparent;
			}
		#top div span {
			width: 1000px;
			z-index: 1;
			position: absolute;
			display: block;
			bottom: 0;
			height: 93px;
		}
			
			/* top tabs nav */
			
			#top div ul {
					position: absolute;
					right: 35px;
					bottom: 17px;
					width: 355px;
					height: 58px;
					overflow: hidden;
					padding: 0 7px;
					z-index: 3;
					background-repeat: no-repeat;
				}
		#topNav_home { background: url('topNav_h.png'); }
		#topNav_scripts { background: url('topNav_s.png'); }
		#topNav_tutorials { background: url('topNav_t.png'); }
		#topNav_me { background: url('topNav_m.png'); }
				#top div ul li { float: left; list-style: none; }
				#tab_hb { width: 28%; }
				#tab_s { width: 21%; }
				#tab_t { width: 25%; }
				#tab_m { width: 22%; }
					#top div ul li a { display: block; width: 100%; height: 37px; position: relative; top: 7px; text-indent: -999px; }


/* ================ specific - main area, breadcrumb, search ================ */

#main, #main_noRight { width: 930px; margin: 0 auto; height: 100%; background: #f9f9f9; padding-top: 10px; padding: 15px 30px 0 30px; }

	#main_topArea { margin-bottom: 14px; border-bottom: solid 1px #dadada; padding-bottom: 4px; height: 30px; }
	
		#main_topArea .fl { width: 600px; position: relative; padding-top: 6px; }
			#rss {
				position: absolute;
				top: 3px;
				right: 0;
				background: url('rss00000.png') no-repeat;
				display: block;
				width: 59px;
				text-indent: -9999px;
				height: 20px;
			}
			#breadcrumb { color: #888; font-size: 12px; font-weight: bold; display: block; }
				#breadcrumb a { font-size: 12px; }
				
		#main_topArea .fr { width: 264px; }
			#main_topArea .fr input { width: 76%; float: left; margin-top: -2px; }
			#main_topArea .fr input.but { width: 17%; margin-left: 3%; }
			

	/* ================ specific - content ================ */
	
	#content { float: left; width: 600px; position: relative; }
	#main_noRight #content { width: 100%; }
		#content .panel { padding-bottom: 15px; }
		#content .panel:last-child { border: none; }
		#content h3, #content h3 a {
			font-weight: normal; margin: -3px 0 10px 0; padding: 6px 6px 6px 0; font-family: Times New Roman; font-size: 28px; color: #333;
		}
		#content h5 { margin-top: 20px; }
		#content h3.smaller, #content h3.smaller a { font-size: 17px; font-weight: bold; font-family: default; }
		#content h3.smaller a { color: #026ca6; }
			div.info { background: #eaeaea; padding: 5px 7px; margin: -8px 0 20px 0; }
			div.info * { font-size: 13px; }
			div.info strong, div.info span { display: block; float: left; }
				div.info strong { color: #759537; background: no-repeat left center; padding-left: 24px; }
				div.info strong.posted { background-image: url('date0000.gif'); }
				div.info strong.tags { background-image: url('tagIcon_.gif'); margin-left: 20px; padding-left: 30px; }
				div.info span { margin-left: 6px; }
				div.info span.tags { float: right; width: 325px; }
		#content p { text-align: justify; line-height: 22px; }
		#content .blogPic { float: left; margin: 6px 18px 7px 0; border: solid 1px #1075ad; }
			#content ul { margin-left: 30px; }
		span.code, span.arg { font-family: courier new; color: #b00; font-size: 14px; }
		p.arg { padding-left: 30px; color: #555; }
		span.arg { color: #00659d; font-weight: bold; }
		span.arg span { color: #888; font-weight: normal; }
		
		
		/* --- comments --- */
		
		#comments { width: 557px; }
			#comments h4 { margin-bottom: 20px; }
				#comments h4 span { color: #d55; font-size: 17px; font-weight: normal; }
			#comments .postButton {
				position: absolute;
				right: 0;
				margin-top: 5px;
				font-weight: normal;
				border: solid 1px #ccc;
				background: #f6f6f6;
				padding: 4px 7px;
				border-radius: 8px;
				-moz-border-radius: 8px;
				-webkit-border-radius: 8px;	
			}
			
			
			/* --- individual comments --- */
			
			#comments div { padding: 14px 18px 11px 85px; background-image: url('comment_.gif'); background-repeat: no-repeat; min-height: 44px; position: relative; margin-bottom: 17px; }
			#comments div.alt { background-image: url('comment0.gif'); }
				span.commentWrapper_bottom { height: 1px; width: 484px; background: #ccc; position: absolute; left: 73px; bottom: 0; }
				#comments div h5 {
					margin: 0 0 10px 0;
					font-size: 13px;
					font-weight: normal;
					color: #4a4a4a;
					border-bottom: solid 1px #ccc;
					padding-bottom: 4px;
				}
					#comments div h5 * { font-size: 13px; font-weight: bold; }
					#comments div h5 span { float: right; width: 50px; }
						#comments div h5 span a { height: 12px; float: left; }
						#comments div h5 span a.site {
							background: url('comments.gif');
							width: 12px;
							display: block;
							margin-left: 6px;
						}
						#comments div h5 span a.reply { background: url('commentt.gif'); display: block; width: 16px; }
				#comments div p { margin: 0; color: #4a4a4a; line-height: 19px; font-size: 13px; }
				
				
			/* --- form --- */
			
			#comments_form {
				display: none;
				background: #f6f6f6;
				width: 350px;
				border-radius: 6px;
				border: solid 4px #26a1ce;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
				padding: 37px 30px 30px 30px;
				height: 350px;
				box-shadow: 0 0 32px #26a1ce;
			}
				#comments_form a { position: absolute; right: 10px; top: 10px; font-size: 12px; letter-spacing: 1px; }
				#comments_form label { float: left; width: 80px; display: block; margin-top: 2px; font-size: 13px; color: #666; }
				#comments_form label[for=antiSpam] { width: 150px; }
				#comments_form input { float: left; width: 210px; }
				#comments_form #antiSpam { width: 30px; }
				#comments_form .clear { padding-bottom: 10px; }
				#comments_form textarea { margin-top: 6px; width: 343px; height: 148px; }
			
	
	
	/* ================ specific - right ================ */
	
	#right { float: right; width: 290px; padding-top: 10px; }
		#right h4 { font-weight: bold; color: #759537; margin: 5px 0 12px 0; padding-top: 0; }
		#right h4:before, div#refine h4:before { content: "|> "; color: #95b557; }
		#right h5 { margin: 18px 0 10px 0; }
	
		/* panels */
			#right > div {
				background: url('rightPan.jpg') repeat-x #fff; padding: 8px 14px; border: solid 1px #ccc; margin-bottom: 20px;
			}
			#right div div { width: 48%; }
			
		/* lists */
				#right div ul li { padding: 4px 0; border-bottom: solid 1px #dadada; #75acc0; color: #888; }
				#right div ul li:last-child { border: none; }
					#right li, #right a, #right p, #right span { font-size: 13px; }
				#right div ul li:first-child { padding-top: 0 !important; }
				
		/* changelog */
		#changelog { bordesr: solid 1px #c5e597; background: #f5ffc5; margin-top: 10px; padding: 1px 8px; width: auto !important; }
			#changelog p { color: #888; font-size: 13px; border-bottom: solid 1px #c5e597; padding-bottom: 10px; }
			#changelog p:last-child { border: none; padding-bottom: 0; }
				#changelog p strong { color: #777; font-size: 12px; }
				
				
				
	/* ================ specific - footer ================ */
	
	#footer {  background: #3a3a3a; border-right: solid 2px #444; margin: 15px 0 0 -1px; padding: 16px 20px 10px 20px; }
		#footer a, #footer p {
			font-size: 13px; color: #ccc; margin: 0 30px 0 0; background-position: left middle; background-repeat: no-repeat; height: 17px;
		}
		#contact { background-image: url('contact_.png'); padding-left: 26px; float: left; }
		#copyright { background: url('copyrigh.png'); padding-left: 22px; float: left; }
		#rss2 { background-image: url('rss_foot.png'); padding: 1px 0 0 22px; float: right; }
		#poweredBy { font-size: 12px; color: #aaa; float: right; position: relative; top: 1px; }