/* Theme Name: Justin Cline v4 Theme URI: http://www.justincline.com/ Description: This is the brand new, fancy Justin Cline personal site theme. Version: 1 Author: Justin Cline Author URI: http://www.justincline.com/ */ /*-------------------------------------------------- B A S E ---------------------------------------------------*/ 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,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-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } :focus {outline: 0;} body {font-family:Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; font-size:100%;line-height: 1; background:#242424; opacity:99.9%;} ol, ul {list-style: none;} table {border-collapse: separate;border-spacing: 0; } caption, th, td {text-align: left;font-weight: normal; } blockquote:before, blockquote:after,q:before, q:after {content: ""; } blockquote, q {quotes: "" "";} /* HTML 5 love */ header, footer, section, nav, article, aside, hgroup { margin: 0px; padding: 0px; display: block;} /* Global reset-RESET - The below restores some sensible defaults */ strong { font-weight: bold } em { font-style: italic } ol, ul, li { list-style:none } * a { position:relative } /* Gets links displaying over a PNG background */ a { outline:none; text-decoration:none; } a img { border:none } /* Gets rid of IE's blue borders */ /*-------------------------------------------------- G L O B A L S ---------------------------------------------------*/ html { overflow-y: scroll;-webkit-font-smoothing: antialiased; } strong, em, b, i { font-family: "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Tahoma, Verdana, sans-serif;} acronym, abbr { cursor:help;} acronym:hover, abbr:hover { border-style:solid;} input, textarea { font-family:Geneva, "Lucida Sans"," Lucida Grande", "Lucida Sans Unicode", Candara, Verdana, sans-serif; font-size:1.3em; } hr { display:none;} .ie7 hr, .ie6 hr { display:none !important;} button { cursor:pointer;} button::-moz-focus-inner { border: 0px solid transparent;} .btn { font-size:11px; line-height:1em; color:#121413; cursor:pointer; border:1px solid #a2aba2; border-top-color:#fff; font-weight:bold; padding:6px 10px 7px; background: #cecfce; background: -webkit-gradient(linear, left top, left bottom, from(#f6f7f6), to(#cecfce)); background: -moz-linear-gradient(top, #f6f7f6, #cecfce);-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; box-shadow:0px 1px 3px rgba(0,0,0,0.2);-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.2);-moz-box-shadow:0px 1px 3px rgba(0,0,0,0.2);} .btn:hover { color:#2c98d5; background: #ededed; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed)); background: -moz-linear-gradient(top, #fff, #ededed);} .btn:active { top:1px;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;} .btn.right { float:right;} /* GLOBAL STRUCTURE ------------------------------- */ .wrapper { width:940px; margin-left: auto; margin-right:auto;} #main-content { background:#ebedea URL("img/page-bg.jpg") no-repeat top center fixed; padding:20px 0;} #content { float:left; position:relative; width:620px;} #sidebar { float:right; position:relative; width:300px; padding-top:20px;} .hr { background:transparent URL("img/hr-01.png") no-repeat 0 0; height:10px; display:block; border:0; margin:0 0 20px; clear:both;} .hr.alt { background-image: URL("img/hr-02.png");} .hr.sm { background:transparent URL("img/hr-sm-01.png") no-repeat 0 0;} .push1col { margin-left:79px;} .push2col { margin-left:160px;} .push1top { margin-top:20px;} .push2top { margin-top:40px;} .clearfix:after {content: "."; display: block; height: 0px; clear: both; visibility: hidden;}.clearfix {display: inline-block;} /* Hides from IE-mac \*/* html .clearfix {height: 1%;}.clearfix {display: block;}/* End hide from IE-mac */ /* GLOBAL IMAGES ------------------------------- */ #content .alignleft, #content img.alignleft { float:left; display: inline; margin:-4px 20px -4px 0px;} #content .alignright, #content img.alignright { float:right; display: inline; margin:-4px 0px -4px 20px;} #content .wp-caption.alignright { margin-right:4px;} #content .alignnone, #content img.alignnone {float:none; display:block; margin:-4px 0;} #content .wp-caption p { margin:0; font-size:10px !important;} #content .alignleft img, /* Lose 14px on img width to fit to columns */ #content .alignright img, #content .alignnone img, .avatar, .portfolio .wp-post-image { padding:6px; border:1px solid #dddeda; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; background:rgb(244,244,241); background:rgba(255,255,255,0.5);} .portfolio .wp-post-image { margin-bottom: 10px;} #content .alignleft a:hover img, #content .alignright a:hover img, #content .alignnone a:hover img { box-shadow:0px 1px 3px rgba(0,0,0,0.1);-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.1);-moz-box-shadow:0px 1px 3px rgba(0,0,0,0.1); } #content section div .wp-caption.alignleft {margin-right:0;} #content section div.push1col .wp-caption.alignleft {margin-right:20px;} .ie7 img { -ms-interpolation-mode: bicubic; } /* GLOBAL TYPOGRAPHY ------------------------------- */ input, textarea, select { font-family:Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; font-size:18px; line-height:20px; color:#77776d; padding:4px;} h1, h2, h3, h4, h5, h6 { text-rendering: optimizeLegibility; } /*-------------------------------------------------- H E A D E R ---------------------------------------------------*/ header { border-bottom:1px solid #d2d8ce;} /* =MASTHEAD ------------------------------- */ #masthead-wrapper { background:#242424 URL("img/masthead-bg.jpg") no-repeat top center; position:relative;} #masthead { padding:16px 30px 0 40px; width:900px;} #masthead-logo { display:block; position:relative; float:left; width:113px; height:22px; text-indent:-9999em; overflow:hidden; background:transparent URL("img/masthead-logo.gif") no-repeat 0 0;} #masthead-logo:hover { background-position:0 -22px;} #nav-main { float:left; text-align:right; display:inline; width:496px;margin-top:4px;} #nav-main li { display:inline;} #nav-main a { color:#6e785e; padding:10px 20px;} #nav-main a:hover { color:#adb3a4;} #nav-social { float:right; width:190px; margin-bottom: 12px; position:relative; z-index:30; } #nav-social li { width:20px; height:20px; float:left;margin-left:10px; position:relative;} #nav-social li a { display:block; width:20px; height:20px; text-indent:-9999em; overflow:hidden; position:relative; background-image: URL("img/social-sprites.gif"); background-repeat:no-repeat; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} #social-twitter a { background-position: 0 -20px;} #social-twitter a:hover { background-position: 0 0px;} #social-flickr a { background-position: -20px -20px;} #social-flickr a:hover { background-position: -20px 0px;} #social-facebook a { background-position: -40px -20px;} #social-facebook a:hover { background-position: -40px 0px;} #social-linkedin a { background-position: -60px -20px;} #social-linkedin a:hover { background-position: -60px 0px;} #social-deviant a { background-position: -80px -20px;} #social-deviant a:hover { background-position: -80px 0px;} #social-dribbble a { background-position: -100px -20px;} #social-dribbble a:hover { background-position: -100px 0px;} .social-bar { position:absolute; top:0; left:0; height:100px; visibility:hidden;} .tooltip {width:300px; display: none; background-color:rgba(0,0,0,0.7); padding:10px;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; box-shadow:0px 2px 10px rgba(0,0,0,0.5);-webkit-box-shadow:0px 2px 10px rgba(0,0,0,0.5);-moz-box-shadow:0px 2px 10px rgba(0,0,0,0.5); z-index:500;} /* =BANNER ------------------------------- */ #main-banner { background:#f5f7f6 URL("img/banner-bg.jpg") no-repeat top center fixed; padding:20px 0;} #banner-box { background: #81c0e2 URL("img/banner-box-bg.jpg") no-repeat top center fixed; float:left; position:relative; width:620px; height:150px;-webkit-border-top-left-radius: 4px;-webkit-border-bottom-left-radius: 4px;-moz-border-radius-topleft: 4px;-moz-border-radius-bottomleft: 4px;border-top-left-radius: 4px;border-bottom-left-radius: 4px;} #banner-box h1, #banner-box div { display:block; text-indent:-9999em; overflow:hidden; width:535px; height:99px; margin:20px 0 20px 30px; background: transparent URL("img/banner-text-home.png") no-repeat 0 0;} /* Justin banner images*/ #banner-image { position:relative; float:right; width:300px; height:150px; background:#333 URL("img/jc-bg-01.jpg") no-repeat 0 -50px;-webkit-border-top-right-radius: 4px;-webkit-border-bottom-right-radius: 4px;-moz-border-radius-topright: 4px;-moz-border-radius-bottomright: 4px;border-top-right-radius: 4px;border-bottom-right-radius: 4px; } #banner-image span { display:block; width:232px; height: 214px; position:absolute; top:-64px; left:-55px; z-index:10;background:transparent URL("img/banner-justin-1.png") no-repeat 0 0;} /* Portfolio */ .page-template-portfolio-php #banner-image span, .single-portfolio #banner-image span { width:231px; height: 214px; top:-64px; left:-80px; background-image: URL("img/banner-justin-2.png") !important;} /* 404 */ .error404 #banner-image span { width:263px; height:233px; top:-83px; left:-40px; background-image: URL("img/banner-justin-3.png") !important; } /*-------------------------------------------------- S I D E B A R ---------------------------------------------------*/ #sidebar h3 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; padding-left:28px;} #sidebar li { display: inline;} #sidebar li a { color:#8d9789; font-size:11px; line-height:1em; letter-spacing:0.1em; text-transform:uppercase; padding:5px 30px; display:block;} #sidebar li a:hover { color:#317aa3;} #availability { background-color:#c0c4be; background-color:rgba(62,66,59,0.2); padding:20px 30px 10px 0; margin-bottom:40px;box-shadow:0px 1px 1px rgba(255, 255, 255, 1), inset 0px 1px 1px rgba(0,0,0,0.15);-webkit-box-shadow:0px 1px 1px rgba(255, 255, 255, 1), inset 0px 1px 1px rgba(0,0,0,0.15);-moz-box-shadow:0px 1px 1px rgba(255, 255, 255, 1), inset 0px 1px 1px rgba(0,0,0,0.15); -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} .ie7 #availability { background-color:#c0c4be;} #availability p { color:#fff; font-size:12px; line-height:16px; letter-spacing:0.04em; text-shadow:0px 0 18px rgba(0,0,0,0.4);padding-left:67px; margin:0 0 10px 13px;} #availability p strong { color:#6a7063; display:block; text-transform:uppercase; letter-spacing:0.04em; text-shadow:none;} #availability p#work-open { background:transparent URL("img/cal-icon-free.png") no-repeat 0 0;} #availability p#work-busy { background:transparent URL("img/cal-icon-busy.png") no-repeat 0 0;} #availability p#work-uber { background:transparent URL("img/cal-icon-uber.png") no-repeat 0 0;} #blog-categories { margin-bottom:80px;} #blog-categories ul { background:transparent URL("img/hr-sm-01.png") no-repeat 0 0; padding-top:10px;} #sidebar-work { margin-bottom:40px;} #sidebar-work ul { background:transparent URL("img/hr-sm-01.png") no-repeat 0 0; padding-top:20px; padding-left:0;} #sidebar-work .portfolio-list li { } #sidebar-work .portfolio-list li:last-child {margin-right:0;} #sidebar-work .portfolio-list li a { padding:0; cursor:pointer; } #sidebar-work .more-link { font-size:12px; float:right;} .ie7 .portfolio-list li a { display: inline-block} #dexter-prints { display:block; width:300px; height:164px; background: transparent URL("img/sidebar-ad-dexter.png") no-repeat 0 0; clear:both;} /*-------------------------------------------------- B L O G ---------------------------------------------------*/ /* =BLOG STRUCTURE ------------------------------- */ .post { margin-bottom:40px; } .post section { } .archive-list { margin-bottom:0;} .post section p, .post section li, .post h1, h2.entry-title, h2.entry-title-sm, .post h2, .post h3, .post h5, .archive-title { margin-left:80px;} .post section li p { margin-left:0;} #nav-below { display:block; margin:0 0 20px 79px;} #nav-below a { padding:8px 16px; font-size:13px; line-height:1em; color:#818172; border:1px solid #c1c1bd; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; } #nav-below a:hover { background-color:#dedfdc; background-color:rgba(187,189,185,0.3); border-color:#bebeba; color:#505045; box-shadow:0 0 4px rgba(255, 255, 255, 1), inset 0px 1px 6px rgba(0,0,0,0.1);-webkit-box-shadow:0 0 4px rgba(255, 255, 255, 1), inset 0px 1px 6px rgba(0,0,0,0.1);-moz-box-shadow:0 0 4px rgba(255, 255, 255, 1),inset 0px 1px 6px rgba(0,0,0,0.1);} #nav-below .nav-previous { float:left; position:relative;} #nav-below .nav-next { float:right; position:relative;} /* =BLOG TYPOGRAPHY ------------------------------- */ .post section a, .more-link { color:#317aa3;} .post section a:hover, .more-link:hover { color:#2c98d5; text-shadow: 0px 0px 5px rgba(255, 255, 255, .5);} .post h1, h2.entry-title, h2.entry-title-sm { font: normal 60px/54px "League Gothic", Impact, Haettenschweiler, "Franklin Gothic Medium", "Arial Narrow Bold", Arial, sans-serif; color:#aaaa9b; letter-spacing:-0.04em; text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); margin-bottom:14px; position:relative; } h2.entry-title-sm { font-size:30px; line-height:30px; letter-spacing:0;} h2.entry-title a { color:#aaaa9b;} h2.entry-title-sm a { color:#818172;} h2.entry-title a:hover { color:#c1c1b3;} h2.entry-title-sm a:hover { color:#aaaa9b;} .archive-title, h1.page-title, h3#comments-title, h3#reply-title { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin-bottom:20px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5);} .archive-title span, h1.page-title span, h3#comments-title em { font-family:"Museo 700", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#a1a59b; font-style:normal;} .post section h2, .post section h3 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin-bottom:20px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); } .post h5 { color:#adb3a4; font-weight:normal; font-size:13px; line-height:20px; text-transform:uppercase; letter-spacing:0.1em;} .post h5 a { color:#adb3a4;} .post h5 a:hover { color:#c8cdbf;} .post h5 a span { padding:0 10px;} .archive-list h5 { font-size:11px;} .archive-list h5 a { color:#8a8a79;} .archive-list h5 a:hover { color:#aaaa9b;} .post section p, .post section li { font-size:13px; line-height:20px; color:#89907e; margin-bottom:20px;} .post section ul,.post section ol { list-style-position:outside;} .post section ul li { list-style-type:disc;} .post section ol li { list-style-type: decimal;} .post section strong { color:#747a6b; font-size:1.1em;} .post section blockquote { border-top:1px solid #ced1ca; border-bottom:1px solid #ced1ca; padding:20px 0 0; margin-bottom:20px;} .post section blockquote p { margin-left:15px; margin-right:15px; font-size:12px; font-style:italic; text-align:justify; color:#6c6f66;} .post section p small { font-size:10px;} #content .wp-caption { margin-bottom:20px;} .wp-caption p { margin:0px 7px !important; font-size:9px; font-style:italic; letter-spacing:.1em; color:#a6ad9a;} /* META ------------------------------- */ .post-thumbnail { position:absolute; width:58px; height:58px; z-index:10; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;border:1px solid #c1c1bd;background-repeat:no-repeat; background-position:-1px -1px;} .ie6 .post-thumbnail, .ie7 .post-thumbnail { left:-60px; z-index:300;} .entry-date { border:1px solid #c1c1bd; float:left; position:relative; display:block; width:58px; height:58px;top:4PX; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} .entry-date span { display:block; padding-top:12px; text-align:center; font-size:9px; text-transform:uppercase; color:#bcc1b4; letter-spacing:0.4em; } .entry-date span strong { display:block; font-size:30px; font-weight:normal; letter-spacing:-.06em;} .archive-list .entry-date { top:0;} .post footer { display:block;margin-bottom:20px;} .post footer h4 { width:60px;margin:4px 10px 0 0; text-align:right; display:block; float:left;text-transform:uppercase;font-size:10px; letter-spacing:0.06em; line-height:15px;} .post footer p { font-size:11px; color:#818172;} .post .post-tags a { color:#818172; text-transform:lowercase;} .post .post-tags a:hover { color:#aaaa9b;} .vvqbox:hover { box-shadow:0px 2px 10px rgba(0,0,0,0.5);-webkit-box-shadow:0px 2px 10px rgba(0,0,0,0.5);-moz-box-shadow:0px 2px 10px rgba(0,0,0,0.5);} .twitter-share-button { float:left; position:relative; cursor:pointer;clear: both; text-align: left; margin-left:80px;} /* COMMENTS ------------------------------- */ h3#comments-title, h3#reply-title { font-size:20px;} .comment { margin-bottom:20px; clear:both;} .comment.depth-2 { margin-left:80px;} .avatar { float:left; margin-right:18px;} .comment-body { float:left; width:540px;} .depth-2 .comment-body { width: 460px;} .comment-body p { font-size:13px; line-height:20px; color:#0f1110; margin-bottom:20px;} p.comment-author, .comment-meta { font-size:11px; color:#89907e; margin-bottom:10px; } .comment-author a, .comment-meta a, #respond a { color:#89907e;} .comment-author a:hover, .comment-meta a:hover, #respond a:hover { text-decoration:underline;} .reply { display:block; } .comment-reply-link { float:right; font-size:10px;color:#317aa3;} .comment-reply-link:hover { color:#2c98d5; text-shadow: 0px 0px 5px rgba(255, 255, 255, .5);} #respond { margin-bottom:30px;} #respond p { font-size:12px; color:#89907e; margin-bottom:20px; position:relative;} #respond p label { font-size:14px; line-height:20px; color:#0f1110; float:left; width:140px; margin-right:18px;} .comment-form-author .required, .comment-form-email .required { position:absolute; left:140px; font-size:15px;} #commentform input { box-shadow:inset 0px 1px 1px rgba(0,0,0,0.15);-webkit-box-shadow:inset 0px 1px 1px rgba(0,0,0,0.15);-moz-box-shadow:inset 0px 1px 1px rgba(0,0,0,0.15); -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} #commentform input { width:288px;} #commentform textarea { width:452px; } #commentform #submit { width:220px !important; margin-left:160px;color:#121413; cursor:pointer; border:1px solid #a2aba2; border-top-color:#fff; font-weight:bold; padding:6px 10px 7px; background: #cecfce; background: -webkit-gradient(linear, left top, left bottom, from(#f6f7f6), to(#cecfce)); background: -moz-linear-gradient(top, #f6f7f6, #cecfce);-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; box-shadow:0px 1px 3px rgba(0,0,0,0.2);-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.2);-moz-box-shadow:0px 1px 3px rgba(0,0,0,0.2);} #commentform #submit:hover { color:#2c98d5; background: #ededed; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed)); background: -moz-linear-gradient(top, #fff, #ededed);} #commentform #submit:active { top:1px;box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;} /*-------------------------------------------------- P O R T F O L I O ---------------------------------------------------*/ /* =ARCHIVE ------------------------------- */ #portfolio-archive { clear:both; } #portfolio-archive h1 { display:none;} #portfolio-archive h2 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin: 0 0 20px 80px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); clear:left; position:relative; } .portfolio-list { margin:0 0 20px 0;} .portfolio-list li { float:left; margin:0 20px 20px 0; width:60px; height:60px; display:block;} .portfolio-list a { display:block;} .portfolio-list a:hover { /*box-shadow:0px 1px 3px rgba(0,0,0,0.1);-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.1);-moz-box-shadow:0px 1px 3px rgba(0,0,0,0.1);*/} /* =SINGLE ------------------------------- */ .single-portfolio #content { width:940px; float:none;} .portfolio { margin-bottom:40px;} .portfolio section { } .portfolio hgroup { } /*.portfolio .wp-post-image { float:right; margin-left:20px;}*/ .portfolio h1 { font: normal 30px/30px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#aaaa9b; text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); margin-bottom:0; margin-left:80px; position:relative;} .portfolio h2 { font: normal 60px/54px "League Gothic", Impact, Haettenschweiler, "Franklin Gothic Medium", "Arial Narrow Bold", Arial, sans-serif; color:#aaaa9b; text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); margin-bottom:14px;margin-left:80px; letter-spacing:-.04em;} #project-info { margin-bottom:20px;} #project-info p { font-size: 16px; line-height:20px; color:#5a5f52; margin-bottom:0; letter-spacing:-.06em; font-style:italic; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5);} #project-info p strong { font-weight:normal;color:#5a5f52;} .portfolio section h2, .portfolio section h3 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin-bottom:20px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); margin-left:80px;} .portfolio section p, .portfolio section li { margin-left:80px; margin-right:320px; } .portfolio section li p { margin-left:0;} .portfolio section a, #project-info a { color:#317aa3;} .portfolio section a:hover, #project-info a:hover { color:#2c98d5; text-shadow: 0px 0px 5px rgba(255, 255, 255, .5);} h1.archive-title span, h1.page-title span, h3#comments-title em { font-family:"Museo 700", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#a1a59b; font-style:normal;} .post section h2, .post section h3 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin-bottom:20px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); } .portfolio section p, .portfolio section li { font-size:13px; line-height:20px; color:#89907e; margin-bottom:20px;} .portfolio section ul,.portfolio section ol { list-style-position:outside;} .portfolio section ul li { list-style-type:disc;} .portfolio section ol li { list-style-type: decimal;} .portfolio section p strong, .portfolio section li strong { color:#747a6b; font-size:1.1em;} .single-portfolio aside { float:right; width: 300px; position:relative; padding-top:100px; font-size:13px; font-weight:normal;} .single-portfolio aside h4 { font-size:13px; font-weight:bold; text-transform:uppercase; line-height:20px; color:#aaaa9b; margin-bottom:4px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); letter-spacing:0.06em;} .single-portfolio aside p { font-size:13px; line-height:20px; color:#aaaa9b !important;} .single-portfolio aside ul { margin:0 0 20px 10px;} .single-portfolio aside ul a { display:block; padding:4px 0; color:#aaaa9b;} .single-portfolio aside ul a:hover { color:#c1c1b3;} .single-portfolio aside .site-link { color:#317aa3; margin-left:10px;} .single-portfolio aside .site-link:hover { color:#2c98d5; text-shadow: 0px 0px 5px rgba(255, 255, 255, .5);} #nav-above { display:block; margin-bottom:80px;} #nav-above div { width:460px;} #nav-above a { padding:3px 15px; font-size:11px; line-height:1em; text-transform:uppercase; color:#b5b5a5; letter-spacing:0.1em; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); } #nav-above a:hover { color:#818172;} #nav-above .nav-previous { float:left; position:relative;} #nav-above .nav-next { float:right; position:relative; text-align:right;} .portfolio footer { display:block;margin:20px 0; } .portfolio footer ul { margin-left:80px; background:transparent URL("img/hr-sm-01.png") no-repeat 0 0; padding-top:20px;} .portfolio footer ul ul { margin-left:0; background:none; padding-top:0;} .portfolio footer h4 { width:140px;margin-right:20px; text-align:left; display:block; float:left; font-size:12px; letter-spacing:0.06em; line-height:15px; } .portfolio footer li { font-size:12px; color:#818172; clear:left; margin-bottom:10px;} .portfolio footer li li { display:inline;margin-right:10px;} .portfolio li a { color:#818172; text-transform:lowercase;} .portfolio li a:hover { color:#aaaa9b;} /*-------------------------------------------------- P A G E ---------------------------------------------------*/ .type-page { padding-top:23px;} .type-page p, .type-page li { font-size:13px; line-height:20px; color:#89907e; margin:0 80px 20px;} .type-page .page-intro h1 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; letter-spacing:-.04em; margin-left:80px; margin-bottom:15px;} .type-page .page-intro h2 { font: normal 60px/54px "League Gothic", Impact, Haettenschweiler, "Franklin Gothic Medium", "Arial Narrow Bold", Arial, sans-serif; color:#aaaa9b; text-shadow: 0px 1px 1px rgba(255, 255, 255, 1); margin-bottom:14px; margin-left:0; letter-spacing:-.04em;} .type-page h2 { font:normal 24px/20px "Museo 100", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; color:#0f1110; margin:0 80px 20px; text-shadow: 0px 1px 1px rgba(255, 255, 255, .5); } .type-page a { color:#317aa3;} .type-page a:hover { color:#2c98d5; text-shadow: 0px 0px 5px rgba(255, 255, 255, .5);} /*-------------------------------------------------- F O O T E R ---------------------------------------------------*/ footer section { padding-top:20px; padding-bottom:80px;} footer section p { margin:40px 30px; color:#73776d; font-size:12px; line-height:1em; float:left;} footer section a { color:#73776d; text-decoration:underline;} #flickr-list { float:right; position:relative; width:480px; padding:0 0 20px 0; } #flickr-list h3 { font:normal 24px/20px "Museo 700", Geneva, "Lucida Grande", "Lucida Sans Unicode", Candara, Tahoma, Verdana, sans-serif; margin-left:18px; color:#46463e; margin-bottom:20px; } #flickr-list li { float:left; width:60px; margin:0 0 0 20px;} #flickr-list li a { display:block; width:60px; height:60px; -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;box-shadow:0px 1px 3px rgba(0,0,0,0.4);-webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.4);-moz-box-shadow:0px 1px 3px rgba(0,0,0,0.4); opacity:0.4;} #flickr-list li a:hover { opacity:1; box-shadow:0px 1px 10px rgba(0,0,0,0.6);-webkit-box-shadow:0px 1px 10px rgba(0,0,0,0.6);-moz-box-shadow:0px 1px 10px rgba(0,0,0,0.6);} #flickr-list li img { width:60px; height:60px;} /*-------------------------------------------------- G R I D ---------------------------------------------------*/ /* Kids! You too can play at home! TOGGLE Grid = Alt+G | STICKY Grid = Alt+G+Enter | FRONT/BACK Grid = Alt+B */ #grid { background: url("img/bg-grid-980.gif") repeat-y 0 0; width:980px; position:absolute; top:0; left:50%; margin-left:-490px; opacity:0.4;filter:alpha(opacity=40); } #grid .horiz { height:19px;border-bottom:1px dotted #aaa;}/* From http://hashgrid.com */ /*-------------------------------------------------- F O N T L I S T ---------------------------------------------------*/ /* League Gothic: condensed sans serif */ @font-face {font-family: "League Gothic"; src: URL("fonts/LeagueGothic.eot"); src: local("LeagueGothic"), URL("fonts/LeagueGothic.otf") format('opentype');} /* Museo: wide slab serif (using until H&J decides to let Archer free.... ha! */ @font-face {font-family: "Museo 100"; src: URL("fonts/Museo-100.eot"); src: local("Museo 100"), URL("fonts/Museo100-Regular.otf") format('opentype');} @font-face {font-family: "Museo 700"; src: URL("fonts/Museo-700.eot"); src: local("Museo 700"), URL("fonts/Museo700-Regular.otf") format('opentype');}