/* Processed by Shaun Inman's CSS-SSC :: http://www.shauninman.com/plete/css-ssc/ */ @import url("reset.css"); /* HTML5 tags */ header, section, footer, aside, nav, article, figure { display:block; } /* Body */ body { background:#000 url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/bg-space.jpg') top center repeat-x fixed; font-family:Avenir,"Helvetica Neue","HelveticaNeue",helvetica,sans-serif; font-size:87.5%; /* Base font size:14px */ color:#000305; line-height:1.429; margin:0; padding:0; text-align:left; } /* Headings */ h2 { font-size:2.285em } /* 32px */ h3 { font-size:1.286em } /* 18px */ h4 { font-size:1.143em } /* 16px */ h5 { font-size:1em } /* 14px */ h6 { font-size:1em } /* 14px */ h2, h3, h4, h5, h6 { font-weight:600; } p h2, p h3, p h4, p h5, p h6 { line-height:1.1; margin-bottom:0.8em; } /* Links */ a { outline:0; } a img { border:0px; text-decoration:none; } a:link, a:visited { color:#005168; padding:0 1px; text-decoration:underline; } a:hover { background-color:#C74350; color:#fff; text-decoration:none; text-shadow:1px 1px 1px #000; } a:active { text-shadow:-1px -1px -1px #000; } /* Paragraphs */ p { font-size:0.9em; margin-bottom:1.143em; } article p:first-child:first-line { font-size:1.1em; font-weight:bold; } * p:last-child { margin-bottom:0; } strong, b { font-weight:bold; } em, i { font-style:italic; } ::-moz-selection { background:#F6CF74; color:#fff; } ::selection { background:#F6CF74; color:#fff; } /* Lists */ ul { list-style:outside disc; margin:1em 0 1.5em 1.5em; } ol { list-style:outside decimal; margin:1em 0 1.5em 1.5em; } dl { margin:0 0 1.5em 0; } dt { font-weight:bold; } dd { margin-left:1.5em; } /* Quotes */ blockquote { font-style:italic; padding-left:20px; margin-bottom:15px; border-left:solid 6px #ddd; } cite { } q { } /* Tables */ table { margin:.5em auto 1.5em auto; width:98%; } thead th { padding:.5em .4em; text-align:left; } tbody td { padding:.5em .4em; } /***** Classes and junk *****/ /* Clearfix */ .clearfix:after { content:"."; display:block; height:0;clear:both; visibility:hidden; } .clearfix { display:inline-block; } /* Hides from IE-mac \*/ * html .clearfix { height:1%; } .clearfix { display:block; } /* Stuff */ .clear { clear:both; } /***** Layout *****/ .body { clear:both; margin:0 auto; width:900px; } #wrapper { min-height:700px; } /* Masthead *****************/ #masthead { margin:0 auto; padding:55px 0 0 0; } /* Logo */ #masthead h1 a:link, #masthead h1 a:visited { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/logo.png') no-repeat; display:block; float:left; height:55px; margin:0 0 .6em .2em; text-indent:-2000em; width:263px; } #masthead h1 a:link, #masthead h1 a:visited { } #masthead h1 a:hover { background-position:0px -60px; } /* Main Nav */ #masthead nav { float:right; font-size:0.9em; font-size:1em; margin:25px 0 0; padding:0; text-shadow:0px -1px 2px #000; width:320px; } #masthead nav ul { list-style:none; margin:0; } #masthead nav li { float:left; display:inline; margin:0; } #masthead nav a, #masthead nav a:visited { background:url(http://haslayout.com/wp-content/themes/hasLayout-v2/images/nav1-active.gif) 50% 40px no-repeat; color:#fff; display:block; height:30px; padding:5px 1.3em; text-decoration:none; } masthead nav a:hover { background:url(http://haslayout.com/wp-content/themes/hasLayout-v2/images/nav1-active.gif) bottom no-repeat; color:#fff; } #masthead nav a.active, #masthead nav a.active:hover { background:url(http://haslayout.com/wp-content/themes/hasLayout-v2/images/nav1-active.gif) bottom no-repeat; font-weight:bold; text-shadow:0px -1px 2px #000; } #masthead nav a.active { cursor:default; } /* Featured *****************/ #featured { background:#fff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; margin-bottom:2em; overflow:hidden; padding:20px; width:860px; } #featured figure { border:2px solid #eee; float:right; margin:0.786em 2em 0 5em; width:248px; } #featured figure img { display:block; float:right; } #featured h2 { color:#C74451; font-size:1.714em; margin-bottom:0.333em; } #featured h3 { font-size:1.429em; margin-bottom:.5em; } #featured h3 a:link, #featured h3 a:visited { color:#000305; text-decoration:none; } #featured h3 a:hover, #featured h3 a:active { color:#fff; } /* Content *****************/ #content { background:rgba(255,255,255,1); margin-bottom:2em; padding:40px 15px 40px 40px; width:840px; border-radius:12px; -moz-border-radius:12px; -webkit-border-radius:12px; } #articles { float:left; width:500px; } #sidebar { float:right; width:300px; } /* Sidebar *****************/ .sb-module { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/sidebar-grey-bg.png'); color:#fff; margin-bottom:15px; } .sb-module ul { list-style:none; } #sidebar h3 { margin-bottom:0; padding:12px 0 0 15px; } #sidebar h4 { font-size:1.1em; padding:0 20px 0 0; } #sb-about { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/sidebar-about-bg.png'); height:113px; text-shadow:0 -1px 1px #000; } #sb-about p { padding:0; margin:0; } #sb-about img { float:left; padding:15px; } #sb-about ul { float:left; padding:5px 0 0 0; margin:0; } #sb-about li { float:left; padding:0; } #sb-about li a { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/about-linkedin.png') 0 4px no-repeat; display:block; height:36px; text-indent:-2000em; width:32px; } #sb-about a.twitter { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/about-twitter.png') 0 4px no-repeat; } #sb-about a.vcard { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/about-vcard.png') no-repeat; width:40px; } #sb-recent h3 { border-bottom:dotted 1px #555; font-family:normal Georgia,serif; font-style:italic; padding-bottom:5px; } #sb-recent ul { background:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/sidebar-grey-bg.png') bottom; color:#ccc; line-height:1.3em; margin:15px 0; padding:0 0 15px 0; } #sb-recent li { margin:1em; text-shadow:1px 1px 1px #000; } #sb-recent li a { color:#fff; text-decoration:none; } #sb-recent li a { color:#de3041; } #sb-recent li a:hover { color:#fff; } #sb-recent li p { color:#999; font-family:Georgia,serif; font-style:italic; } /* Extras *****************/ #extras { margin:0 auto 3em auto; overflow:hidden; } #extras ul { list-style:none; margin:0; } #extras li { border-bottom:1px solid #fff; } #extras h2 { color:#C74350; font-size:1.429em; margin-bottom:.25em; padding:0 3px; } #extras a:link, #extras a:visited { border-bottom:1px solid #F4E3E3; color:#444; display:block; padding:.3em .25em; text-decoration:none; } #extras li:last-child, #extras li:last-child a { border:0; } #extras a:hover, #extras a:active { color:#fff; } /* Blogroll */ #extras .blogroll { float:left; width:615px; } #extras .blogroll li { float:left; margin:0 20px 0 0; width:185px; } #extras .blogroll li:nth-last-child(2), #extras .blogroll li:nth-last-child(3), #extras .blogroll li:nth-last-child(2) a, #extras .blogroll li:nth-last-child(3) a { border:0; } /* Social */ #extras .social { float:right; width:175px; } #extras div[class='social'] a { background-repeat:no-repeat; background-position:3px 6px; padding-left:25px; } /* Icons */ .social a[href*='delicious.com'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/delicious.png'); } .social a[href*='digg.com'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/digg.png'); } .social a[href*='facebook.com'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/facebook.png'); } .social a[href*='last.fm'], .social a[href*='lastfm.'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/lastfm.png'); } .social a[href*='/feed/'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/rss.png'); } .social a[href*='twitter.com'] { background-image:url('http://haslayout.com/wp-content/themes/hasLayout-v2/images/icons/twitter.png'); } /* About *****************/ #about { background:#fff; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; font-style:normal; margin-bottom:2em; overflow:hidden; padding:20px; text-align:left; width:860px; } #about .primary { float:left; width:165px; } #about .primary strong { color:#C64350; display:block; font-size:1.286em; } #about .photo { float:left; margin:5px 20px; } #about .url:link, #about .url:visited { text-decoration:none; } #about .bio { float:right; width:500px; } /* Footer *****************/ #contentinfo { padding-bottom:2em; text-align:right; } /***** Articles *****/ /* Blog */ .hentry { border-bottom:1px solid #eee; padding:1.5em 0; position:relative; } li:last-child .hentry, #content > .hentry { border:0; margin:0; } #content > .hentry { padding:1em 0; } .entry-title { font-family:Avenir,Helvetica,sans-serif; font-size:2.285em; margin-bottom:6px; line-height:1em; letter-spacing:-1px; } .entry-title a:link, .entry-title a:visited { color:#000; text-transform:uppercase; text-decoration:none; } .entry-title a:hover { color:#fff; } .hentry .post-info { font-size:0.75em; } .hentry .post-info * { font-style:normal; } .hentry time { background:url(http://haslayout.com/wp-content/themes/hasLayout-v2/images/date-box.png) right no-repeat; color:#fff; display:block; font-weight:bold; float:left; height:51px; margin-left:-82px; position:absolute; text-align:center; text-shadow:0px -1px 1px #000; top:2em; width:65px; } .hentry time * { display:block; line-height:1em; } .hentry time .day { font-size:2em; padding-top:9px; } .hentry time .month { font-size:1em; padding:0; } .hentry time .year { -webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); font-weight:normal; position:absolute; letter-spacing:0.18em; text-shadow:1px 0px 1px #000; top:20px; right:-1px; } /* Content */ .hentry footer { margin-bottom:2em; } .hentry footer address { display:inline; } #posts-list footer address { display:block; } /* Images */ article img { border:1px solid #ccc; padding:5px; } article img a { display:block; margin:0; padding:0; } .alignright, figure.right { float:right; margin:0 0 2em 2em; } .alignleft, figure.left { float:left; margin:0 2em 2em -1em; } /* Blog Index */ #posts-list { list-style:none; margin:0; } #posts-list .hentry { padding-left:200px; position:relative; } #posts-list .hentry:hover { background:#C64350; color:#fff; } #posts-list .hentry:hover a:link, #posts-list .hentry:hover a:visited { color:#F6CF74; text-shadow:1px 1px 1px #333; } #posts-list footer { left:10px; position:absolute; top:1.5em; width:190px; } /* About the Author */ #about-author { background:#f9f9f9; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; clear:both; font-style:normal; margin:2em 0; padding:10px 20px 15px 20px; } #about-author strong { color:#C64350; clear:both; display:block; font-size:1.429em; } #about-author .photo { border:1px solid #ddd; float:left; margin:5px 1em 0 0; } /* Comments */ #comments-list { list-style:none; margin:0 1em; } #comments-list blockquote { background:#f8f8f8; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; clear:both; font-style:normal; margin:0; padding:15px 20px; } #comments-list footer { color:#888; padding:.5em 1em 0 0; text-align:right; } #comments-list li:nth-child(2n) blockquote { background:#F5f5f5; } /* Add a Comment */ #add-comment label { clear:left; float:left; text-align:left; width:150px; } #add-comment input[type='text'], #add-comment input[type='email'], #add-comment input[type='url'] { float:left; width:200px; } #add-comment textarea { float:left; height:150px; width:495px; } #add-comment p.req { clear:both; margin:0 .5em 1em 0; text-align:right; } #add-comment input[type='submit'] { float:right; margin:0 .5em; } #add-comment * { margin-bottom:.5em; } /* Wordpress gallery */ .gallery { border-top:1px solid #ddd; padding-top:20px; } .gallery-caption { display:none; } .gallery-item { margin-bottom:0; } .gallery-item img, .gallery-item a { margin:0; padding:0; } .gallery-item img { width:500px; height:187px; } /* Gallery detail page */ .gallerydetail h2 a { font-size:36px; font-weight:normal; text-decoration:none; } .gallerydetail .caption { color:#666; font-size:18px; background-color:#C74350; color:#fff; text-decoration:none; text-shadow:1px 1px 1px #000; } .gallerydetail .post { width:650px; margin:auto; } .gallerydetail .post img { margin-bottom:20px; } @media only screen and (max-device-width:480px) {body{-webkit-text-stroke:0 black !important;}} /* SCROLLBARS - Thanks to Drew Wilson! */ @media screen and (-webkit-min-device-pixel-ratio:0) { html { overflow:hidden; } body { position:absolute; top:0; left:0; bottom:0; right:0; overflow-y:auto; overflow-x:auto; } } @media only screen and (max-device-width:480px) { html { overflow:auto; } body { position:relative; top:auto; right:auto; bottom:auto; left:auto; overflow:auto; } } ::-webkit-scrollbar { width:10px; height:10px; } ::-webkit-scrollbar-button:start:decrement { display:block; height:0; width:5px; background-color:transparent; } ::-webkit-scrollbar-button:end:increment { display:block; height:0; width:5px; background-color:transparent; } ::-webkit-scrollbar-track:enabled { background-color:transparent;} ::-webkit-scrollbar-thumb:vertical { height:50px; background-color:rgba(255, 255, 255, .9); -webkit-border-radius:5px; } ::-webkit-scrollbar-thumb:horizontal { width:50px; background-color:rgba(255, 255, 255, .9); -webkit-border-radius:5px; }