/**********************************************************************************************

	CSS on Sails
	Title: Klayz
	Author: Klayz.com (http://www.klayz.com/)
	Date: February 2010

***********************************************************************************************

	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles

	2. LAYOUT
			2.1 Structure
			2.2 Header
			2.3 Navigation
			2.4 Content
			2.5 Sidebar
			2.6 Footer

***********************************************************************************************/


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/



/* 1.3 Clearfix 
-----------------------------------------------------------------------------------------------*/

.clearfix:after, #wrapper:after, .entries-list li:after, .metadata:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }


/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/

body { background: #fff url(http://imgs.klayz.com/body-bg-new.jpg) no-repeat center top; color: #555555; font-family: "Verdana", "Tahoma", "Arial", "Helvetica", sans-serif; font-size: 13px; }
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; }
a, a:visited { color: #00f; text-decoration: none; }
a:hover, a:active { color: #f00; text-decoration: underline; }



/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/



/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/

.container { width: 925px; position: relative; margin: 0 auto; }
#wrapper { width: 925px; margin: 0 auto;}
#header { height: 15px; position: relative; padding: 0 15px;}
.home #header { height: 15px; }
#footer { background: #737373 url(http://imgs.klayz.com/bg-footer.png) top left repeat-x; line-height: 55px; height: 55px; }
#sidebar { float: left; width: 200px !important; display: inline; min-height: 100px; height: auto !important; height: 100px; }
#content { float: left; width: 559px; display: inline; }
#content_page { float: right; width: 700px; display: inline; margin-top: 140px; }
#content-single { float: left; width: 759px; display: inline; }
.ad-vertical { background: #fff; float: right; display: inline; width: 138px; border: 1px solid #d4d4d4; text-align: center; color: #999; margin-right: 10px; }



/* 2.2 Header
-----------------------------------------------------------------------------------------------*/
#header h2.logo a { display: block; position: absolute; top: 30px; left: 10px; background: url(http://imgs.klayz.com/logo.png) top left no-repeat; text-indent: -9999px; width: 259px; height: 79px; }
.search-form { position: absolute; right: 10px; top: 20px; }
.search-form fieldset { display: inline; }
.search-form .search-input { background: url(http://imgs.klayz.com/input-search.png) top left no-repeat; width: 218px; height: 26px; float: left; }
.search-form .search-input input { border: 0; width: 208px; margin: 0 5px; padding: 6px 0; background: transparent; font-size: 12px; }
.structural { position:absolute; left:-9999px; }



/* 2.3 Navigation
-----------------------------------------------------------------------------------------------*/
#nav { font-size: 12px; padding-top: 5px; width: 60%; float: left; }
#nav li { float: left; padding-right: 10px; border-right: 2px solid #ffffff; margin-right: 10px; }
#nav li a { color: #ffffff; font-weight: bold; text-decoration: underline; }
#nav li.last-link { border: 0; }
span.welcome { border: 0; color: #ffffff; font-weight: bold; float: right; margin-right: 0; width: 25%; text-align: right; font-size: 12px; line-height: 26px; }
span.welcome a { color: #ffffff; text-decoration: underline; }



/* 2.4 Content
-----------------------------------------------------------------------------------------------*/

.bubble {  background: #fff; border: 2px solid #6a6a6a; padding: 20px; position: relative; }
.bubble p { padding: 0 0 15px; }
.bubble .arrow-left { position: absolute; left: -10px; top: 60px; background: url(http://imgs.klayz.com/misc-arrow-left.png) top left no-repeat; display: block; width: 10px; height: 20px; }
.bubble .arrow-bottom { position: absolute; left: 60px; bottom: -10px; background: url(http://imgs.klayz.com/misc-arrow-bottom.png) top left no-repeat; display: block; width: 20px; height: 10px; }
.bubble ol { margin-bottom: 15px; }
.bubble ul { margin-bottom: 15px; }
.bubble ol li { list-style: decimal; margin-left: 25px; }
.bubble ul li { list-style: disc; margin-left: 25px; }
.bubble h2 { font-size: 1.2em; margin: .75em 0; }
.bubble .entries-list li { list-style: none; margin-left: 0px;}
.bubble h1 { color: #000; font-weight: bold; font-size: 23px; line-height: 33px; }
.entries-list { margin-top: 0px; font-size: 13px; }
.archive .entries-list { margin-top: 0; }
.entries-list h2 { font-weight: normal; font-size: 1em; margin: 0;}
.entries-list li { line-height: 23px; }
.entries-list li a { color: #0066cc !important; float: left; }
.entries-list li .post-categories a { background: #E4E4E4; padding: 2px 8px; font-size: 11px; line-height: 1; float: left; margin-top: 4px; margin-left: 5px; color: #626262; }
.entries-list li .post-categories a:hover { text-decoration: none; }


.tags { margin-top: 20px; }
.tags h3 { font-weight: bold; color: #9B9B9B; margin-left: 10px; margin-bottom: -3px; }
.tags .cloud { border: 2px solid #9B9B9B; background: #E9E9E9; padding: 20px; color: #4E4E4E; }
.tags .cloud a { color: #0066cc; text-shadow: 1px 1px 1px #F6F6F6; }

.ad-vertical { padding: 5px; float: right; margin-top: 60px; display: inline; width: 130px; border: 1px solid #d4d4d4; text-align: center; color: #999; margin-right: 10px; }
.home .ad-vertical { margin-top: 0; } 
.page .ad-vertical { margin-top: 40px; } 

.ad-horizontal { padding: 5px; background: #fff; border: 1px solid #d4d4d4; text-align: center; width: 750px; margin: 20px auto; height: 94px; }

.head-title { height: 150px; }
.page .head-title { height: 70px; }
.head-title h1 { color: #000; background: #fff; border: 2px solid #6a6a6a; padding: 15px; font-weight: bold; font-size: 23px; line-height: 33px; }
.head-title h1 a { color: #000 !important; font-weight: bold; font-size: 23px; line-height: 33px; }
.head-title .categories { font-size: 12px; font-weight: bold; color: #000; margin-bottom: 6px; margin-top: 6px; }
.head-title .categories a { color: #000; font-weight: bold; text-decoration: underline; }



.avatar-bottom { width: 30%; float: left; display: inline; margin-top: 15px;}
a { color: #0066cc; }
.tag-list { width: 60%; float: right; display: inline; text-align: right; font-size: 11px; color: #676767; margin-top: 15px; }
.tag-list span { background: #fff; border: 1px solid #909090; float: right; padding: 5px 10px;}
.tag-list a { color: #414141; }

.post-categories li { float: left; }

/* 2.5 Sidebar
-----------------------------------------------------------------------------------------------*/
#sidebar .avatar { width: 158px; margin: 0 auto; }


/* 2.6 Footer
-----------------------------------------------------------------------------------------------*/
#footer ul { position: absolute; left: 0; top: 23px; }
#footer ul li { float: left; padding-right: 10px; text-shadow: 1px 1px 1px #0073b9; border-right: 1px solid #6cbff0; font-size: 11px; margin-right: 10px; line-height: 1; }
#footer ul li.last { border: 0; }
#footer ul li a { color: #6cbff0; }
#footer p { position: absolute; right: 0; right: 0; font-size: 11px; color: #58abdb; }
