/*
Theme Name: Creative Grease
Version: 0.1
Author: hot glue media
Author URI: http://hotgluemedia.com

Many thanks to Mr. Elliot Jay Stocks (http://elliotjaystocks.com) for his work on Starkers (http://elliotjaystocks.com/starkers), and Kematzy's Blueprint CSS generator (http://kematzy.com/blueprint-generator/).
*/

/*

------INDEX-----

I. 	CSS Reset
II.	@Font-Face Styles
III. 	General Styles
	A. Overall Styles
	B. Headers
	C. Paragraphs
	D. Links
	E. CMS Elements
	F. Lists
	G. Images
	H. Forms
IV.	Menu Styles
V.	Content Styles

*/

/* I. CSS Reset  */
a, abbr, acronym, address, applet, b, big, blockquote, body, caption, center, cite, code, dd, del, dfn, dl, div, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, var { background: transparent; border: 0; font-size: 100%; margin: 0; outline: 0; padding: 0; vertical-align: baseline; }
:focus { outline: 0; }
blockquote, q { quotes: none; }
body { line-height: 1; }
del { text-decoration: line-through; }
ins { text-decoration: none; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }

/* II. @Font-Face Styles */

/* The fonts included are copyrighted by the vendor listed below.
 * @vendor:     GUST e-foundry
 * @vendorurl:  http://www.gust.org.pl/projects-1/e-foundry
 * @licenseurl: http://www.fontsquirrel.com/license/TeX-Gyre-Pagella
 */
@font-face { font-family: 'TeXGyrePagellaRegular'; src: url('texgyrepagella-regular.eot'); src: local('TeX Gyre Pagella Regular'), local('TeXGyrePagella-Regular'), url('texgyrepagella-regular.ttf') format('truetype'); }
@font-face { font-family: 'TeXGyrePagellaItalic'; src: url('texgyrepagella-italic.eot'); src: local('TeX Gyre Pagella Italic'), local('TeXGyrePagella-Italic'), url('texgyrepagella-italic.ttf') format('truetype'); }
@font-face { font-family: 'TeXGyrePagellaBold'; src: url('texgyrepagella-bold.eot'); src: local('TeX Gyre Pagella Bold'), local('TeXGyrePagella-Bold'), url('texgyrepagella-bold.ttf') format('truetype'); }
@font-face { font-family: 'TeXGyrePagellaBoldItalic'; src: url('texgyrepagella-bolditalic.eot'); src: local('TeX Gyre Pagella Bold Italic'), local('TeXGyrePagella-BoldItalic'), url('texgyrepagella-bolditalic.ttf') format('truetype'); }


/* III. General Styles */

	/* A. Overall Styles */
	body { background: url(img/bkgc.jpg) repeat; color: #383127; font-family: "TeXGyrePagellaRegular", serif; font-size: 62.5%; height: 100%; line-height: 1.2; }
	.bar { background: #383127; color: #ebebe9; font-size: 1.2em; height: 35px; text-align: center; width: 100%; }
	.bar a:hover, a:active, a:focus { color: #f6b622; }
	#container { display: block; margin: 0 auto; height: auto; min-height: 600px; text-transform: lowercase; width: 925px; }
	span { display: none; }

	/* B. Headers */
	h1, h2, h3, h4, h5, h6 { font-family: "TeXGyrePagellaBold"; padding-top: 10px; }
	h1 { font-size: 2.2em; }
	h2 { font-size: 2.0em; }
	h3 { font-size: 1.8em; }
	h4 { font-size: 1.6em; }
	h5 { font-size: 1.4em; }
	h6 { font-size: 1.4em; }

	/* C. Paragraphs */
	p { font-size: 1.4em; padding: 10px 0; text-align: justify;}

	/* D. Links */
	a:link, a:visited { color: #257dab; text-decoration: none; }
	a:hover, a:active, a:focus { color: #257dab; }

	/* E. CMS Elements */
	blockquote { background: #f6b622; padding: 5px 25px; }
	cite, cite a, cite p { font-family: "TeXGyrePagellaItalic"; font-style: italic; margin-left: 15px; }
	strong { font-family: "TeXGyrePagellaBold"; font-weight: bold; }
	em { font-family: "TeXGyrePagellaItalic"; font-style: italic; }
	.alignright { float: right; }
	.alignleft { float: left; }
	img#wpstats { display:none; }
	code { font-size: 1.8em; }

	/* F. Lists */
	li ul, li ol { padding: 5px; }
	ul, ol { font-size: 1.4em; margin: 10px 0 0 35px; }
	ul { list-style-type: disc; }
	ol { list-style-type: decimal; }

	/* G. Images */	
	img.alignleft { float: left; padding-right: 15px; }
	img.alignright { float: right; padding-left: 15px; }
	img.centered, img.aligncenter { display: block; margin-left: auto; margin-right: auto; }

	/* H1. Forms - HGM */
	#hgmform { display: block; float: left; margin-left: 0; width: 300px; }
	#hgmform input { border: 1px solid #ccc; margin: 10px 10px 0 0; width: 200px; }
	#hgmform textarea { border: 1px solid #ccc; height: 90px; margin: 10px 10px 0 0; width: 200px; }
	#hgmform textarea:focus, #hgmform input:focus { border: 1px solid #213f94; }
	#hgmform input.submit-button { float: right; margin-left: 10px; position: relative; right: 25px; width: 100px; }
	label { float: left; font-size: 1.4em; margin-right: 25px; padding-top: 5px; position: relative; top: 10px; text-align: left; width: 125px; }

	/* H2. Forms - cForms */
	.cform { margin:10px auto 0 auto; width: 390px; }
	.cform .cf_hidden { background: none; border: none; display: none; margin: 0; padding: 0; }
	.cform input.checkbox { float: left; width: auto; }
	.cform legend { color: #666; margin-left: 10px; padding: 0 2px; }
	ol.cf-ol { margin: 0; padding: 0; }
	ol.cf-ol li { background: none; line-height: 1.3em; list-style-type: none; margin: 5px 0; padding: 0; text-align: left; }
	ol.cf-ol li.textonly { background: #f0f0f0; letter-spacing: 1px; margin: 10px 0; padding: 5px 0; text-align: center; }
	.cform label { display: inline-block; font-size: 1em; line-height: 1.3; margin: -10px 10px 0 0; text-align: right; vertical-align: top; width: 100px; }
	.cform label span { display: block; width:100px; /* must be the same as above!*/ }
	.cform label.rightfix { text-align: left; }
	.cform label.checkfix { text-align: left; margin-bottom: 15px; width: 300px; }
	label.cf-before { margin:4px 10px 0 0; }
	label.cf-after { margin:4px 15px 0pt 6px; text-align:left; width:115px; }
	label.cf-after span { display: block; width:115px; }
	label.cf-group-after { margin:3px 4px 0 2px; text-align:left; width:72px; }
	label.cf-group-after span { display: block; width:72px; }                                            
	.cform input, .cform textarea, .cform select { padding: 3px; background: #f9f9f9; border: 1px solid #888; vertical-align: top; }
	.cform input:hover, .cform textarea:hover, .cform select:hover { background: #cedddf; }
	.cform input:focus, .cform textarea:focus, .cform select:focus { background:#f3f8f8; }
	.cform textarea, .cform input { width:180px; }
	.cform select { padding:2px 0; width:188px; /* attempt to have equal length */ }  
	.cform select.cfselectmulti { height:7.5em; }
	.cform textarea { font-size: 1em; overflow:auto; }
	ol.cf-ol li.cf-box-title { font-weight:bold; letter-spacing:1px; padding:8px 0 0 100px; /* check with label 'width' incl. */ }
	.cform input.cf-box-a, .cform input.cf-box-b 	{ background: none; border: none; height: 22px; margin:2px 0 0 0; width:14px; }
	.cform input.cf-box-a 	{  margin-left:100px; /* check with label 'width' incl. */ } 
	ol.cf-ol li.cf-box-group { margin:10px 0pt 0px; padding-left: 100px; }
	span.reqtxt, span.emailreqtxt { font-size: 1em; margin: 3px 0 0 3px; vertical-align: top; }
	p.cf-sb { margin-right: 105px; padding: 0; text-align: left; }
	.cform input.backbutton, .cform input.resetbutton, .cform input.sendbutton { background: #ccc; border: 1px solid #adadad; border-left-color: #ececec; border-top-color: #ececec; font-size: 0.8em; margin: 10px 0 0 110px; padding: 5px; width: 100px; }
	.cform input.resetbutton, .cform input.backbutton  { padding: 5px 1em; width: auto; }
	ol.cf-ol li.cf_li_err { background: #ffffdf; border-color:#df7d7d; border-style:solid; border-width:1px 0pt; margin:5px 0; padding:5px 0; }
	ol.cf-ol li ul.cf_li_text_err { color: #333; height:1%; margin-left: 100px; min-height:1%; padding: 0; }
	ol.cf-ol ul.cf_li_text_err li { background:#ffdfdf; font-weight:bold; list-style:none; margin:0 0 2px; padding-left:15px; text-indent:0; }
	ol.cf-ol ul.cf_li_text_err li:before { content:''; }
	label.secq, label.seccap { margin-bottom: 4px; vertical-align:text-bottom; }
	input.secinput { vertical-align:text-bottom; }
	div.cf_info { color: #000; font-size: 1.3em; line-height: 1.3em; margin: 10px auto; padding: 10px 15px; width: 380px; }
	div.cf_info ol { margin: 0; padding: 5px 15px 0 30px; }
	div.cf_info ol li { margin: 2px 0; padding: 1px 0; }
	div.cf_info a { color: #ad2929; text-decoration: underline; }
	div.success { background: #f7f7f7; color: #444; display: block; }
	div.success { background: #ffdfdf; border-color: #dfd7d7; border-style: solid; border-width: 1px 0pt; display: block; }
	div.waiting { background: #f9f9f9; color: #aaa; display: block; }
	.cform .cf_error { color:#ad2929;  border:1px solid #ad2929; }
	div.mailerr { display:block; }
	.mailerr, .cform .cf_errortxt { color:#ad2929; }
	.cform input.cf_upload  { background: #f9f9f9; border:1px solid #888888; width:220px;  }
	* html .cform fieldset { position: relative; margin-top:15px; padding-top:25px;  }
	* html .cform legend { position:absolute; top: -10px; left: 10px; margin-left:0; }
	*+html .cform fieldset { position: relative; margin-top:15px; padding-top:25px;  }
	*+html .cform legend { position:absolute; top: -10px; left: 10px; margin-left:0; }
	* html ol.cf-ol, * html ol.cf-ol li, * html span.reqtxt, * html span.emailreqtxt { display: inline-block;  /*for ie6*/ }
	*+html .cform label, *+html ol.cf-ol, *+html ol.cf-ol li, *+html span.reqtxt, *+html span.emailreqtxt { display: inline-block; /*for ie7*/ }
	* html img.captcha { margin-bottom:1px; }
	*+html img.captcha { margin-bottom:1px; }

/* IV. Menu Styles */
#menu { display: block; float: left; margin-left: 25px; min-height: 200px; width: 300px; }
.nav { display: block; font-family: "TeXGyrePagellaRegular", serif; font-size: 1.8em; margin: 20px 0 20px 32px; }
.nav li { list-style: none; }
.nav li li { font-size: 0.7em; }
.nav li a { display: block; }
.nav li a.home { background: url(img/menu_home.png) no-repeat; height: 30px; width: 300px; }
.nav li a.about { background: url(img/menu_about.png) no-repeat; height: 30px; width: 300px; }
.nav li a.portfolio { background: url(img/menu_portfolio.png) no-repeat; height: 30px; width: 300px; }
.nav li a.links { background: url(img/menu_links.png) no-repeat; height: 30px; width: 300px; }
.nav li a.contact { background: url(img/menu_contact.png) no-repeat; height: 30px; width: 300px; }
.nav li a.recent { background: url(img/menu_recent.png) no-repeat; height: 30px; width: 300px; }
.nav li a.articles { background: url(img/menu_articles.png) no-repeat; height: 30px; width: 300px; }
.nav li a.projects { background: url(img/menu_projects.png) no-repeat; height: 30px; width: 300px; }
.nav li a.subscribe { background: url(img/menu_subscribe.png) no-repeat; height: 30px; width: 300px; }
.subnav { display: inline-block; font-size: 1.2em; margin: -5px 0 0 0; padding-left: 25px; }
.rss { display: block; float: left; margin: 0; padding: 0; width: 100px; }

/* V. Content Styles */
#content { display: block; float: left; margin: 25px 0 25px 50px; min-height: 200px; padding-left: 25px; width: 525px; }
.posttitle { margin-top: 15px; line-height: 25px; }
#footer { clear: both; }
.commentlist { margin: 0 0 25px 0; }
.commentlist li { list-style: none; padding-top: 15px; }
.comment-body p { font-size: 14px; }
.post { margin-bottom: 15px; }
.post img { padding-top: 10px; }

#commentform { display: block; float: left; margin-left: 0; width: 525px; }
#commentform input { width: 200px; }
#commentform textarea { width: 400px; }
label { font-size: 1.2em; margin-top: -12px; width: 75px; }
#commentform input.submitbutton { float: left; margin-left: 100px; position: relative; width: 60px; }

.projectcat { float: left; width: 160px; }
.projectcat img { height: 150px; padding-bottom: 10px; width: 150px; }