/*    
Theme Name: Mecannical
Theme URI: http://www.mecannical.com/ 
Description: A portfolio theme for WordPress
Author: Juan Camilo Estela
Author URI: http://www.mecannical.com 
Version: 1.0
General comments/License Statement if any.
Theme with warning message
*/ 


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,

q:before, q:after {
	content: '';
	content: none;
}



/* remember to define focus styles! */
:focus {
	outline: 0;
}


/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}



/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*HTML*/
html {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
}

/*BODY*/
body {
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	border:none;
	font-family:Arial,Helvetica,Tahoma,sans-serif;
	font-size:10pt;
	text-align:center;
	}

#global-message{
	background-color:#202020;
	color:#e2e2e2;
	font-size:14px;
}

#body-wrapper{
	width:100%;
	margin:0px;
	padding:0px;
	border:none;
	background-repeat:no-repeat;
	background-position:top center;
}
	#body-wrapper{
		background-image:url('images/bg_new_white.jpg');
		background-color: #FFFFFF;
	}
	
	.body-header-portfolio #body-wrapper{
		background-image:url('images/bg_new_white.jpg');
		background-color: #FFFFFF;
	}

	.body-header-tutorials #body-wrapper{
		background-image:url('images/bg_new_gray.jpg');
		background-color: #131313;
	}

	.body-header-labs #body-wrapper{
		background-image:url('images/bg_new_orange.jpg');
		background-color: #ed4800;
	}

	.body-header-about #body-wrapper{
		background-image:url('images/bg_new_blue.jpg');
		background-color: #2b4f68;
	}

	.body-header-contact #body-wrapper{
		background-image:url('images/bg_new_blue.jpg');
		background-color: #2b4f68;
	}
	


#main-wrapper{
	width:100%;
	margin:0px;
	padding:0px;
	border:none;
	background-repeat:no-repeat;
	background-position:bottom center;
	}

	#main-wrapper{
		background-image:url('images/footer_new_white.jpg');
	}

	.body-header-portfolio #main-wrapper {
		background-image:url('images/footer_new_white.jpg');
	}

	.body-header-tutorials #main-wrapper {
		background-image:url('images/footer_new_gray.jpg');
	}

	.body-header-labs #main-wrapper {
		background-image:url('images/footer_new_orange.jpg');
	}

	.body-header-about #main-wrapper {
		background-image:url('images/footer_new_blue.jpg');
	}

	.body-header-contact #main-wrapper {
		background-image:url('images/footer_new_blue.jpg');
	}





#main {
	width:940px; /*total site width*/
	margin:0px auto; /*center horiz*/
	text-align:left;
		/*background-color:#C0C0C0;*/
}



/*GENERAL TAGS*/
a {
	color:#24445a;
}



/*ALT SPIDER*/
#spider {
	position:absolute;
	top:-100px;
	left:0px;
	width:101px;
	_display:none;
	}

	#spider-thread {
		background-image:url('images/spider-thread.png');
		background-repeat:repeat-y;
		_background-image:none;
	}

	#spider-text{
		position:absolute;
		background-image:url('images/spider-text.png');
		background-repeat:no-repeat;
		width:210px;
		height:72px;
		padding:10px 0px 0px 0px;
		top:-100px;
		_background-image:none;
	}



#form-error{
	top:30px;
	left:420px;
	color:#FFFFFF;
	font-weight:bold;
	background-color:#FF0000;
	padding:5px;
	display:none;
}

#form-success{
	color:#44AA44;
	text-align:center;
	width:250px;
	height:100px;
	top:50px;
	left:10px;
	font-size:14pt;
	font-weight:bold;
	display:none;
}



/*HEADER*/

#header {
	height:308px;
	width:940px; /*no margin nor padding*/
	margin:0px;
	padding:0px;
	position:relative;
		/*background-color:#B5B5B5;*/
}



/*MENU*/
	#header a {position:absolute;}

	#logo {width:430px;width:428px;height:150px;margin:0px;}

	#menu-portfolio {top:245px;left:37px;width:192px;height:72px;}

	#menu-tutorials {top:250px;left:250px;width:198px;height:70px;}

	#menu-labs {top:200px;left:450px;width:105px;height:120px;}

	#menu-about {top:180px;left:560px;width:92px;height:140px;}

	#menu-contact {top:230px;left:675px;width:135px;height:90px;}



	#menu-rss {top:210px;left:840px;width:80px;height:110px;}

	#menu-twitter {top:80px;left:722px;width:100px;height:100px;}



	.search-text {background-color:transparent;border:none;position:absolute;top:15px;left:715px;}
	.search-button {background-color:transparent;border:none;width:40px;height:40px;position:absolute;top:8px;left:875px;cursor:pointer;cursor:hand;}



/*SECTION BREAK*/

.section-break{
	width:940px;
	height:10px;
	margin:0px;
	padding:0px;
		/*background-color:#000000;*/
}



/*CONTENT*/

#content{
	/*width:898px;*/width:908px;
	/*padding:40px 12px 0px 30px;*/padding:10px 12px 0px 20px;
	background-color:#FFFFFF;
	}



#post-info{
	float:left;
	margin:0px 0px 22px 0px;
	width:219px;
		/*background-color:#FF0000;*/
	}

	* html #post-info{
		margin:0px 0px 22px 0px;
		width:211px;
	}

	#post-info h1{
		font-size:24pt;
		letter-spacing:-2px;
		margin:0px 0px 10px 0px;
			/*background-color:#EE0000;*/
	}

	#post-info p{
		line-height:12pt;
		text-align:justify;
			/*background-color:#DD0000;*/
	    }

            .post-tags{
                text-align:left;
            }

            .post-categories{
                text-align:left;
            }



	.post-date {
		padding:5px;
		background-color:#C0C0C0;
		font-size:14pt;
		font-weight:bold;
		color:#FFFFFF;
		text-align:right;
	}

	.share-header{
		font-weight:bold;
		color:#CACACA;
		font-size:12pt;
		margin:20px 0px 0px 0px;
		text-align:left;
	}

	.share-box{
		margin:0px 0px 15px 0px;
		}

		.share-box a{
			float:left;
			border:none;
		}

	.share-bar {


		}

		.share-bar a{
			float:left;
			border:none;
		}

	.related-header{
		font-weight:bold;
		color:#CACACA;
		font-size:12pt;
		margin:20px 0px 8px 0px;
		text-align:left;
	}	

	.related-column{



		}

		.related {
			/*background-color:#DFDFDF;*/
			padding:8px;
			border-top:1px solid #CCCCCC;
			margin:5px auto 20px auto;
			}

			.related a{
				font-weight:bold;
				text-decoration:none;
				margin:0px 0px 5px 0px;
			}

			.related p{
				margin:5px 0px 0px 0px;
				text-align:justify;
				line-height:12pt;
			}

#post-spacer{
	float:left;
	width:21px;
		/*background-color:#FF0000;*/
	}

	* html #post-spacer{width:3px;}

#post-content{
	float:left;
	margin:0px 0px 22px 0px;/*21*/
	width:657px;
	text-align:center;
		/*background-color:#CC0000;*/
	}

	* html #post-content{
		margin:0px 0px 22px 0px;
	}

	#post-content p{
		font-size:10pt;
		line-height:14pt;
		text-align:left;
		margin:10px 0px;
			/*background-color:#BB0000;*/
	}

	#post-content h1,h2,h3,h4,h5,h6 {
		text-align:left;
	}

	#post-content h1 {font-size:24pt;font-weight:bold;letter-spacing:-2px;margin:0px 0px 15px 0px;border-bottom:1px dotted #CACACA;}

	#post-content h2 {font-size:15pt;margin:35px 0px 10px 0px;border-bottom:1px dotted #CACACA;}

	#post-content h3 {font-size:10pt;margin:8px 0px 8px 0px;}

	#post-content img{
		margin:25px auto;
	}



	.imgcurl-body{margin:30px auto 20px auto;padding:0px;}

	.imgcurl-body img {margin:0px;padding:0px;float:left;}

	* html .imgcurl-body img {margin:-3px;}



#post-nav{
	clear:both;
	height:20px;
	width:898px;
	margin:0px 0px 0px 0px;
	padding:0px 0px 5px 0px;
	border-bottom:1px dashed #C0C0C0;
		/*background-color:#990000;*/
	}

	#previous-post {
		float:left;
		width:115px;
	}

	#disclaimer {
		padding:3px 0px 0px 0px;
		float:left;
		font-size:8pt;
		color:#A0A0A0;
		font-style:italic;
		text-align:center;
		width:668px;
	}

	#next-post {
		float:left;
		width:115px;
		text-align:right;
	}



/*COMMENTS*/

#comments{
	width:940px;
	padding:10px 0px 10px 0px;
	background-color:#FFFFFF;
	}

	#comments h3{
		margin:10px 12px 5px 30px;
		/*border-bottom:1px dashed #C0C0C0;*/
		font-size:16pt;
		color:#353535;
	}

	.children{margin:0px 0px 0px 6%;}

	.children .comment-body {width:82%;}

	#comments #comment-list{
		width:898px;
		margin:0px 12px 5px 30px;
			/*background-color:#00FF00;*/
		}

		.comment-author-admin .comment-body{
			background-color:#d7d7d7;
		}

		.comment {
			margin:8px 0px 25px 0px;
				/*background-color:#00CC00;*/
			}

			.clearer{
				clear:both;
			}

			.gravatar{
				width:117px;
				height:90px;
				float:left;
				background-repeat:no-repeat;
			}

			.g-1{
				background-image:url('images/comment_bg_1.gif');
					/*background-color:#00AA00;*/
				}

				.g-1 img{
					margin:27px 0px 0px 67px;
				}

			.g-2{
				background-image:url('images/comment_bg_2.gif');
					/*background-color:#00AA00;*/
				}

				.g-2 img{
					margin:33px 0px 0px 29px;
				}

			.g-3{
				background-image:url('images/comment_bg_3.gif');
					/*background-color:#00AA00;*/
				}

				.g-3 img{
					margin:23px 0px 0px 36px;
				}

			.g-4{
				background-image:url('images/comment_bg_4.gif');
					/*background-color:#00AA00;*/
				}

				.g-4 img{
					margin:47px 0px 0px 3px;
				}

			.g-5{
				background-image:url('images/comment_bg_5.gif');
					/*background-color:#00AA00;*/
				}

				.g-5 img{
					margin:38px 0px 0px 35px;
				}

			.g-6{
				background-image:url('images/comment_bg_6.gif');
					/*background-color:#00AA00;*/
				}

				.g-6 img{
					margin:27px 0px 0px 32px;
				}

			.g-7{
				background-image:url('images/comment_bg_7.gif');
					/*background-color:#00AA00;*/
				}

				.g-7 img{
					margin:33px 0px 0px 25px;
				}

			.g-8{
				background-image:url('images/comment_bg_8.gif');
					/*background-color:#00AA00;*/
				}

				.g-8 img{
					margin:18px 0px 0px 42px;
				}

			.comment-body{
				float:left;
				width:772px;
				line-height:13pt;
				border-bottom:1px dotted #CACACA;
				padding:4px;
					/*background-color:#008800;*/
				}

				.comment-author{
					font-size:11pt;
					color:#353535;
					font-weight:bold;
					margin:0px 0px 3px 0px;
						/*background-color:#007700;*/
				}

				.comment-content{
					min-height:55px;
						/*background-color:#007100;*/
				}

				* html .comment-content{
					height:55px;
				}

				.comment-meta{
					font-size:9pt;
					color:#207399;
					font-style:italic;
					text-align:right;
					margin:5px 0px 0px 0px;
						/*background-color:#006400;*/
				}

				.comment-meta a{
					text-decoration:none;
				}

		#respond{
			/*border:1px dashed #C7C7C7;*/
			/*width:900px;*/
			padding:10px 0px 10px 0px;
			margin:0px 20px;
			}

			#respond form{
				margin:0px 0px 0px 30px;
				padding:0px 0px 10px 0px;
				}

				#respond form input{
					margin:5px 0px 5px 0px;
				}





/*CONTENT*/

#top-bar{
	margin:0px 0px 8px 0px;
	padding:0px 0px 8px 0px;
	position:relative;
	border-bottom:1px dashed #C0C0C0;
	}
	#top-bar a{
		position:absolute;
		top:0px;
		left:690px;
	}

h1 {
	font-size:24pt;
	color:#404040;
	margin:0px 0px 10px 0px;
	font-weight:bold;
	letter-spacing:-1px;
}

h1#home-header{
	width: 880px; height: 146px;
	background: url("images/home_header.png");
	text-indent: -9999px;
}

h1#search-header{
	width: 378px; height: 38px;
	background: url("images/search_header.png");
	text-indent: -9999px;
}

h1#not-found-header{
	width: 208px; height: 38px;
	background: url("images/not_found_header.png");
	text-indent: -9999px;
}

div#search-terms{
	text-align:center;
	font-size:24pt;
	color:#404040;
	padding:5px 5px;
	background-color:#fff6c7;
	border:1px solid #ffdc7e;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
	border-radius: 10px;
}#search-terms a{
	position:static;
}

div#subcategories{
	text-align:center;
	font-size:14pt;
	letter-spacing:-1px;
	font-weight:bold;
	color:#404040;
	padding:5px 5px;
	background-color:#fff6c7;
	border:1px solid #ffdc7e;
	-moz-border-radius: 10px;
    -webkit-border-radius: 10px;
	border-radius: 10px;
}#subcategories a{
	position:static;
}#subcategories ul{
	list-style-type: none;
}#subcategories li{
	float:left;
	margin:0px 10px;
}


h1#category-header-portfolio{
	width: 166px; height: 38px;
	background: url("images/portfolio_header.png");
	text-indent: -9999px;
}

h1#category-header-tutorials{
	width: 163px; height: 38px;
	background: url("images/tutorials_header.png");
	text-indent: -9999px;
}

h1#category-header-labs{
	width: 90px; height: 38px;
	background: url("images/labs_header.png");
	text-indent: -9999px;
}

h1#whoops-header{
	width: 900px; height: 133px;
	background: url("images/whoops_header.png");
	background-position:center;
	background-repeat:no-repeat;
	text-indent: -9999px;
}

h1#about-me-header{
	width: 625px; height: 38px;
	background: url("images/about_me_header.png");
	text-indent: -9999px;
}

h1#contact-me-header{
	width: 222px; height: 35px;
	background: url("images/contact_me_header.png");
	text-indent: -9999px;
}

h2#currently-header{
	width: 126px; height: 33px;
	background: url("images/currently_header.png");
	text-indent: -9999px;
}

h2#knowledge-header{
	width: 157px; height: 33px;
	background: url("images/knowledge_header.png");
	text-indent: -9999px;
}

div#about-me p{
	line-height:18px;
	text-align:justify;
	margin:20px 0px;
}





#content-body{
		background-color:#FFFFFF;
		padding:0px;
		margin:0px;
	}

	* html #content-body{width:898px;}

	#content-body ul{
			/*background-color:#DD0000;*/
			margin:0px;
			padding:0px;
                        overflow:hidden;
                        line-height:1.3em;
	}

	*html #content-body li img{
		margin:0px;
		padding:0px;
	}



	#content-body li{
			/*background-color:#0000ff;*/
		/*margin:0px 12px 0px 0px;*/
		/*padding:0px;*/
	}

	#content-body a{
		text-decoration:none;
	}

	#content-body h2{
		margin:8px 0px 14px 0px;
	}

	#content-body p{
		text-align:justify;
		line-height:14pt;
	}

	.grid{
		float:left;
		/*width:215px;*/width:215px;
		height:270px;
		margin:5px 0px 20px 0px;/*12*/
		padding:0px 6px 0px 6px;
		overflow:hidden;
		background-image:url('images/grid_background.png');
		background-repeat:no-repeat;
		background-position:top center;
	}

	*html .grid {margin:0px 0px 20px 0px;}
	
	.list {
		width:878px;
		margin:0px 0px 25px 0px;
			background-color:#EEEEEE;
			padding:10px;
			border:1px solid #E7E7E7;
		}

		.list img{
			float:left;
			padding:8px;
		}

		.list .summary{
			float:left;
			width:631px;
			padding:8px 8px 8px 8px;
				/*background-color:#770000;*/
		}



/*CONTACT*/

#main-contact{
	margin:0px auto;
	position:relative;
	width:705px;
	height:991px;
	background-image:url('images/contact_form_bg.jpg');
}

#main-contact-form{
	
}

#main-contact-form input[type="text"]{
	border:none;
	border-bottom:1px dashed #1f5360;
	color:#1f5360;
	width:250px;
	margin:0px 0px 5px 0px;
	background-color:transparent;
	position:absolute;
	font-size:22pt;
}
#mname{top:310px;left:230px;}
#memail{top:345px;left:265px;}
#mmessage{top:445px;left:110px;width:460px;height:235px;}

#main-contact-form textarea{
	border:none;
	font-family:inherit;
	color:#1f5360;
	background-color:transparent;
	overflow:hidden;
	position:absolute;
	font-size:22pt;
	border:1px dashed #1f5360;
}

#main-form-button{
	position:absolute;
	top:685px;
	left:440px;
	height:35px;
	width:90px;
	border:none;
	/*margin:0px 0px 0px 10px;*/
	background-color:transparent;
	cursor:pointer;
	cursor:hand;
}

#main-form-success{
	display:none;
	position:absolute;
	top:650px;
	left:480px;
}

#main-form-error{
	display:none;
	position:absolute;
	top:725px;
	left:170px;
	width:330px;
	font-weight:bold;
	font-size:12pt;
	color:#FF0000;
}

#sending-main-form{
	display:none;
	position:absolute;
	top:688px;
	left:445px;
}


.social-btn{
	width:50px;
	height:70px;
	padding:5px;
	margin:5px;
	float:left;
}

/*FOOTER*/

#footer{
	height:450px;
	/*border-top:1px dashed #C0C0C0;*/
	position:relative;
	}

	#footer div{
		position:absolute;
	}

	#footer h3{
		font-size:14pt;
		color:#404040;
		margin:0px 0px 8px 0px;
	}

		#footer-contact{
			top:25px;
			left:20px;
		}

		#footer-contact-form{

		}

		#footer-contact input[type="text"]{
			border:none;
			border-bottom:1px dashed #542910;
			color:#542910;
			width:250px;
			margin:0px 0px 5px 0px;
			background-color:transparent;
		}

		#footer-contact textarea{
			border:none;
			font-family:inherit;
			width:250px;
			color:#542910;
			background-color:transparent;
			overflow:hidden;
		}

		#footer-form-button{
			position:absolute;
			top:120px;
			left:320px;
			height:60px;
			width:60px;
			border:none;
			/*margin:0px 0px 0px 10px;*/
			background-color:transparent;
			cursor:pointer;
			cursor:hand;
		}

		#footer-copyright{
			font-size:9pt;
			color:#505050;
			top:375px;
			left:20px;
		}
		
		#footer-copyright img{
			margin:0px 0px -2px 0px;
		}

		#footer-usage{
			top:225px;
			left:20px;
			width:400px;
			}

			#footer-usage p{
				line-height:12pt;
				margin:10px 0px 0px 0px;
			}



		#footer-sitemap{
			top:25px;
			left:820px;
			text-align:right;
			}

			#footer-sitemap li{
				margin:8px 0px 0px 0px;
			}