/*
Theme Name: LUburbia
Author URI: http://www.wpshower.com
Description: Suburbia is a clean and flexible WordPress grid-based magazine theme designed in a modern and minimalist style. This theme is also suitable for blogs and misc. projects. Suburbia supports all WordPress 3.0 features and gives you an extra flexibility in every single step you make.
Author: WPSHOWER & MOODYGUY Co: Author: Gene Lu
Version: 1.1
License: GNU/GPL Version 2 or later. http://www.gnu.org/licenses/gpl.html
Tags: grids, magazine, modern, stylish, minimalist
Copyright: (c) 2011 WPSHOWER & GeneLu
*/

/* RESET */

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,
,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;text-align:left;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
:focus {outline:0;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse;border-spacing:0;}

body { background-color: #333336; font: normal 12px "museo-sans-1","museo-sans-2", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif; color: #333; padding-bottom: 30px; }
p {margin: 12px 0;}
ol, ul {padding-left: 40px; margin: 12px 0;}
ul {list-style: circle;}  
fieldset { width: 545px; margin: 0; padding: 0; border: none; }
.nocomments { clear:both; }
/* CLEAR */

.clear:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* LINKS */

a { color: #D45935; text-decoration: none; }
a:hover { text-decoration: underline; }
a img { border: 0; }

/* WRAPPER */

#wrapper { margin: 30px auto 0; width: 980px; }

/* HEADER */

.header { padding: 0; margin-top: 10px; float: left; width: 980px; }

/* MIDDLE */

.middle { background-color: #333336;  float: left; margin-bottom: 20px; width: 980px; }
#middle-right { float: right; width: 784px; }

/* FOOTER */

.footer { color: #87888E; display: block; font-size: 10px; height: 30px; padding: 10px 20px 0 20px; position: relative; text-transform: uppercase; }
.footer p { float: right; }
input { width: 97px; margin: 0 auto 10px auto; padding: 10px; border: 1px solid #E0E0E0; }

/* LOGO */
h1.logo a { float: left; margin-bottom: 20px; color: #9D9EA6; display: block; font-family: "museo-slab-1", Georgia, serif; font-size: 20px;  font-weight: 500; text-align: left; margin-left: 0px; width: 980px; }
h1.logo a:hover {color: #DDDEE6; text-decoration: none;}

/* ARTICLE - Home page and Category Page listings */

.post { border-bottom: 1px solid #181819; margin-bottom: 0px !important;  margin-top: 0; overflow: hidden; width: 195px; height: 500px; background-color: #434447; color: #9D9EA6; display: block; float: left; margin: 0 1px 1px 0; position: relative;  }
.post h2 { clear: both; color: #000; font: normal 14px/20px "museo-slab-1", Georgia, serif; font-weight: 500; margin: 0;  padding: 0 15px; }
.post h2 a { color: #FF8B00; }
.post h3 {  background: #000; color: #FFF; font: normal 10px/22px "museo-sans-1", Arial; opacity: 0.5; margin: 0; padding: 0 10px 0 10px; position: absolute; top: 278px; text-transform: uppercase; } 
.post .time { background-color: #545458; text-transform: uppercase; font-size: 9px; position: absolute; bottom: 10px; right: 0px; padding: 5px; }
.post { word-wrap: break-word; }

#wrapper .post p { padding: 0 15px; margin-top: 5px;  font: normal 12px/18px "museo-sans-1","museo-sans-2"; }

/* ARTICLE SINGLE */

#single { width: 546px; margin-right: -1px; padding: 0 20px 25px; border-right: 1px solid #181819; border-left: 1px solid #e0e0e0; float: left; background-color: #FFF;}
#single h1 { font: normal 30px/38px "museo-slab-1", Georgia, "Times New Roman", Times, serif; font-weight: 500; color: #000; padding: 10px 0 0 0; margin: 20px 0; }
#single h2 { clear: both; font: normal 19px/27px "museo-slab-1", Georgia, "Times New Roman", Times, serif; font-weight: 500;  color: #000; padding: 5px 0; /*padding: 5px 20px;*/  border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; }
#single h3 { color: #000; border-top: 5px solid #e0e0e0; margin-top: 20px; padding: 10px 0 0 0; }
#single h4, #single h5, #single h6 { color: #000; border-top: 5px solid #e0e0e0; margin: 20px 0 0; padding: 10px 0 0 0; }
#single p { font: normal 14px/22px "museo-sans-1", Georgia, "Times New Roman", Times, serif; font-weight: 300; color: #000; margin-bottom: 20px;   }
#single img { max-width: 546px; }
#single strong { font-weight: heavy; color: #000; }
#single blockquote { margin: 10px; padding: 0px 15px; }
#single ul { list-style: disc; margin-bottom: 30px; }
#single ol { list-style: decimal; margin-bottom: 30px;  }
#single li { font: normal 14px/22px "museo-sans-1", Lucida Grande, sans-serif; color: #000; margin-bottom: 15px; margin: 0; font-weight: 100; } 
#single .wp-caption p.wp-caption-text { text-align: center; font-size: 12px; font-weight: 500;  margin-bottom:25px; margin-top: 0; padding: 0; max-width: 545px; }
 
.recent span {display: block; font-size: 10px;}
.recent li {margin-bottom: 12px;}

.err404 {font-size: 30px; margin: 0;}

/* ARTICLE ASIDE */

.aside { width: 155px; height: 460px; overflow: hidden; float: left; border-right:1px solid #E0E0E0; padding: 20px;}
.aside h3 { font: bold 13px/21px "Helvetica Neue",Helvetica,Verdana,"Lucida Sans Unicode","Lucida Grande","Lucida Sans",Arial,sans-serif; color: #000; margin: 0; padding: 0 0 0 0; }
.aside ul, .meta ul, .aside ol, .meta ol { margin: 20px 0; list-style: none; padding: 0;}

/* ARTICLE META */

.meta { color: #87888E; width: 155px; float: left; margin-left: 1px; padding: 0 20px 20px; }
.meta img.dem {position: relative; margin: -80px 0 20px; width: 155px; height: 155px;}
.meta h3 {  font: 13px/21px "museo-slab-1", Georgia, serif; color: #9D9EA6; font-weight: 500; margin: 30px 0 4px 0; }
.meta ul { margin: 0; }
.meta span { margin-bottom: 9px; }

.meta p { color: #DDDEE6; } 
.meta a { color: #DDDEE6; } 
.meta a:hover { text-decoration: underline; }

.meta li {padding: 0px !important; margin: 0 !important;}

/* ARTICLE BOTTOM */

/* #bottom-right { margin-left: 195px; border: 1px solid white; } */
.bottom { width: 165px; margin-bottom: 15px; float: left; border-right:1px solid #212122; padding: 0 15px 15px 15px; overflow: hidden; }
.bottom.last { border-right: none; } 
.bottom h3 { font: 13px/21px "museo-slab-1", Georgia, serif; color: #9D9EA6; font-weight: 500; padding: 5px 0 0 0;  }
.bottom ul.children { margin-bottom: 15px; }
.bottom ul { margin: 15px 0; padding: 0; }
.bottom li { margin: 0; padding: 0; list-style-type: none; }
.bottom { color: #87888E; }
.bottom a { color: #DDDEE6; }
.bottom a:hover { text-decoration: underline; }
.bottom ul#tweets li { margin-bottom: 15px; }

#wp-calendar {width: 100%;}

.navigation h3 {margin-bottom: 15px;}


a.previouspostslink { margin-top: 120px; display: block; background: url(http://genelu.com/wp-content/themes/suburbia/images/prev-arrow.png) -1px -45px  no-repeat; 
                      float: left; height: 65px;  width: 40px;  }
a.previouspostslink:hover { background: url(http://genelu.com/wp-content/themes/suburbia/images/prev-arrow.png) -1px 10px no-repeat; }


a.nextpostslink { margin-top: 120px;  display: block; background: url(http://genelu.com/wp-content/themes/suburbia/images/next-arrow.png) 9px -45px no-repeat; 
                  float: right; height: 65px;  width: 40px;  }
a.nextpostslink:hover { background: url(http://genelu.com/wp-content/themes/suburbia/images/next-arrow.png) 9px 10px no-repeat; }

#prev { float: left; height: 501px;  margin-left: -40px; width: 40px;  }
#next {  float: right; height: 501px;  margin-right: -40px; width: 40px;  }


/* HOVER */

.one:hover, .two:hover { background-color: #4C4C51; color: #DDDEE6; }

/* SEPIA */
.post .sepia { margin:  0 0 15px; }
.two .sepia { width: 350px; height: 246px; }
.one .sepia { width: 155; height: 300px; }
#single .sepia { width: 546px; height: 384px; }

/* WP image classes */

.entry-content img { margin: 0 0 1.5em 0; }

img { margin: 0; height: auto; max-width: 785px; width: auto; }
.attachment img { max-width: 785px; }
.alignnone, img.alignnone {display: block; clear: both; margin-bottom: 12px;}
.alignleft, img.alignleft { margin: 0px; display: inline; float: left; padding: 0; }
.alignright, img.alignright { margin-left: 12px; display: inline; float: right; margin-right: 0; }
.aligncenter, img.aligncenter { margin-right: auto; margin-left: auto; display: block; clear: both; }
img.alignleft, img.alignright, img.aligncenter { margin-bottom: 12px; }
.wp-caption { margin-bottom: 12px; padding:0;  }
.wp-caption img { border: 0 none; padding: 0; margin: 0; }
.wp-smiley { margin: 0 !important; max-height: 1em; }
.gallery { margin: 0 auto 18px; }
.gallery .gallery-item { float: left; margin-top: 0; text-align: center; width: 33%; }
.gallery .gallery-caption { color: #888; font-size: 12px; margin: 0 0 15px; }
.gallery dl { margin: 0; }
.gallery br+br { display: none; }
.attachment img { /* single attachment images should be centered */ display: block; margin: 0 auto; }

blockquote.left { margin-right: 20px; text-align: right; margin-left: 0; width: 33%; float: left; }
blockquote.right { margin-left: 20px; text-align: left; margin-right: 0; width: 33%; float: right; }
.post-edit-link { margin:20px 0 0; padding:10px 0 0; font-weight: normal;}

/* ss */

#comments { width: 545px; }
#respond h3 { font-weight: 500; font-family: "museo-slab-1";  }
#commentform { clear: both; }
#commentform p {margin: 0; }
#comment { width: 350px; clear: both; }
.login {float: right; font-weight: normal; font-style: normal;}
.comment-meta {float: left; width: 125px;}
.comment-date {font-size: 10px; color: #aaaab4; margin-bottom: 15px;}
.comment { margin-top:35px; border-top: 1px solid #e0e0e0; list-style: none; zoom: 1;}
.comment p, .comment ul, .comment ol {margin-left: 125px; list-style: none;}
.comment ul.children {margin-left: 55px;}
#cancel-comment-reply { padding:5px 0; }
.commentlist, .commentlist ul { padding-left: 0;}
.comment-count { font-size: 8px; color: #FFF; text-align: center;
                 position: absolute;  left: 15px; top: 0; background-color: yellow; }
.comment-count a { padding: 15px 8px 8px 8px; display: block; text-decoration: none; color: #333; font-weight: bold; }
.comment-count a:hover { text-decoration: underline; }
#comments li { list-style: none; }

.reply { margin-left: 125px;}
.reply a {color:#835504;}
textarea#comment { width: 523px; border: 1px solid #E0E0E0; padding: 10px; margin-bottom: 10px; overflow: auto; font-size: 24px;  font-family: "museo-sans-1";}
#author, #email, #url {width: 523px; font: normal 12px "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;}
.avatar { float:left; height:55px; padding-right:10px; width:55px; }
.submit { margin-top: 10px; }
#submit {border: none; background: #D45935; color: #fff; cursor: pointer;}
.comment-reply-link { color: black; }

/* NAVBAR LEFT */
#navbar-left h3{ margin: 0; padding: 30px 0 0 0;  } 
#navbar-left.bottom { padding: 0; margin: 0; width: 195px; }
#navbar-left.bottom h3 { padding: 20px 20px 0 20px; }
#navbar-left.bottom a { color: #DDDEE6; padding: 2px 20px; display: block;  }
#navbar-left.bottom ul.children { padding: 0px; }


#navbar-left.bottom .current-cat a { color: #fff; background-color: #666;}
#navbar-left.bottom ul.children li.cat-item.current-cat a { background-color: #666; color: #fff;}
#navbar-left.bottom ul.children li.cat-item a { background-color: #666; color: #333;}

/* Category Parent */
#navbar-left.bottom .cat-item a{ font: 13px/21px "museo-slab-1", Georgia, serif; color: #9D9EA6; font-weight: 500; }

/* Children Categories */
#navbar-left.bottom ul ul.children li.cat-item a { font-family: "museo-sans-1"; font-weight: 300; background-color: #333336; color: #DDDEE6;}  

ul ul.children { margin: 0px; margin-bottom: 10px;  }

/* CATEGORY AND ARCHIVE */
#cat-bottom { float: right; width: 784px; border-left: 0px solid #212122; }

li.recentcomments { margin-bottom: 10px; }

code { float: left; margin: 0 40px 20px 40px; color: #999; }