/* -------------------------------------------------------------- ----------------------------------------------------------------- DEFINITIONS: Typography AUTHOR: Elliot Jay Stocks VERSION: 18.02.2010 CONTENTS: 1 Basics 2 Specifics: h2 3 Specifics: h3 4 Specifics: h4 5 Specifics: a 6 Specifics: lists 7 Specifics: p 8 Specifics: other 9 Image replacement ----------------------------------------------------------------- -------------------------------------------------------------- */ /* 1 Basics */ @font-face { font-family:GraublauWeb; src:url(http://elliotjaystocks.com/wp-content/themes/elliotjaystocks/fonts/GraublauWeb.otf) format("opentype") } @font-face { font-family:GraublauWeb; src:url(http://elliotjaystocks.com/wp-content/themes/elliotjaystocks/fonts/GraublauWebBold.otf) format("opentype"); font-weight:bold } body { font:12px/20px 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif; color:#000 } body {background-image: url(images/bg_main2.jpg);} .tear {background-image: url(images/tear.jpg);} h1 { /* See 'image replacement' below */ } h2, input { font:25px/35px GraublauWeb, Georgia, Times, 'Times New Roman', serif; margin:40px 0 0 70px } h3, h1 a:hover span, ul.nav li, div#more_info a { font:19px/25px GraublauWeb, Georgia, Times, 'Times New Roman', serif; margin:40px 0 30px 0 } h4, ul.delicious li a { font-weight:bold; text-transform:uppercase; letter-spacing:1px; margin:40px 0 0 0 } p, cite { margin:20px 0 } /* The total top + bottom margin height should ideally equal the standard line-height (20px) */ a { color:#900 } a:hover { color:#000; border-bottom:2px solid #900 } a:active { border-bottom:4px solid #900 } a:focus { outline:none } blockquote { font:19px/25px GraublauWeb, Georgia, Times, 'Times New Roman', serif; background:url(http://cdn.images.elliotjaystocks.com/presentation/quote-open.png) 0 20px no-repeat; padding:0 0 20px 0; border-top:1px solid #999; border-bottom:1px solid #999 } blockquote p { padding:0 60px; background:url(http://cdn.images.elliotjaystocks.com/presentation/quote-close.png) bottom right no-repeat; color:#369 } cite { font:12px/20px 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif; color:#369; padding:0 0 0 60px } input { margin:0 } abbr { border:none; outline:none } code { color:#000; background:#ccc } /* X Specifics: h2 */ body.home h2 em { font-size:18px; line-height:40px; color:#999 } h2.recently { margin:-40px 0 0 70px } div.search h2 { margin:0 } h2 span { color:#999; font-style:italic } h2#respond { margin:40px 0 0 180px } div.browse_by_client h2 { margin:40px 0 0 10px } h2.final { margin:40px 0 40px 70px } div.archives_link h2 { width:300px; margin:40px 0 0 0 } div.speaking h2 { margin:40px 0 -10px 0 } div.speaking h2.speaking_past { background:url(http://cdn.images.elliotjaystocks.com/presentation/hr_short_2.png) top left no-repeat; margin:0 0 -10px 0; padding:20px 0 0 0 } /* X Specifics: h3 */ h3 cite { font:19px/25px GraublauWeb, Georgia, Times, 'Times New Roman', serif; padding:0 } h3.sub { margin:0; position:absolute; top:12px; left:490px } h3.prev { width:340px } h3.standout { margin:20px 20px 30px -60px } div.browse_all h3 { margin:40px 0 0 70px } ol.comment_list h3 { margin:0 } div.footer h3 { margin:20px 0 20px 0 } div.flickr h3 { margin:50px 0 10px 0 } div.client_list h3 { margin:0 0 30px 0 } div.selected_posts h3 { margin:0 0 30px 10px } div.portfolio_intro h3 { margin:0 570px 0 70px } ol.mini_events li h3, ol.past_events li h3 { margin:0 } div.archives_link h3 { width:300px } div.help h3 { margin:40px 0 -20px 0 } ul.faqs h3 { margin:60px 0 0 10px } div.full_archives h3 span { position:relative } div.full_archives h3 span { color:#999; font-style:italic; position:absolute; top:0; left:730px } div#more_info h3 { margin:0 0 20px 0 } ul.magazines li h3 { margin:0 0 10px 0 } ul.magazines li h3 span { color:#999; font-style:italic } div.other_books h3 { margin:40px 0 30px 10px } /* X Specifics: h4 */ div.post.archive_listing h4 { margin:-20px 0 20px 0 } h4.meta { margin:10px 0 20px 0 } ol.comment_list h4 { margin:0 0 20px 0 } div.credits h4 { margin:0 } ul.downloads li h4 { margin:0 } ul.downloads li p { margin:4px 0 } div.other_books ul li h4 { position:absolute; top:-20px; left:150px } div.other_books ul li h4 span { color:#666; font-style:italic; font-weight:normal; text-transform:capitalize; letter-spacing:0; display:block } ul.magazines li h4 { margin:0 0 10px 0 } ul.interviews li h4 { margin:0; position:absolute; top:0; left:0; width:400px; padding:0 10px 0 0; text-align:right } /* X Specifics: a */ div.footer a { color:#cf9 } div.footer a:hover { color:#fff; border-bottom:2px solid #cf9 } div.footer a.has_image:hover { border:none } div.twitter p.message a { color:#900 } div.twitter p.message a:hover { color:#000; border-bottom:2px solid #900 } div.copyright p { position:relative } div.footer div.wrapper span.mt { text-align:right; position:absolute; top:-6px; right:0 } div.footer div.wrapper span.mt a img { background:none; border-bottom:7px solid #0a0d10; padding:0; vertical-align:middle } div.footer div.wrapper span.mt a:hover { border:none } ul.nav li a:hover, h2 a:hover, h3 a:hover { border-bottom:4px solid #900 } ul.nav li a:active, h2 a:active, h3 a:active { border-bottom:6px solid #900 } body.home h2 em a { color:#666 } body.home h2 em a:hover { border-bottom:2px solid #666 } body.home h2 em a:active { border-bottom:4px solid #666 } blockquote a { color:#000 } blockquote a:hover { border-bottom:2px solid #000 } blockquote a:active { border-bottom:4px solid #000 } body.blog ul.nav li.blog a, body.portfolio ul.nav li.portfolio a, body.speaking ul.nav li.speaking a, body.publication ul.nav li.publication a, body.about ul.nav li.about a, body.contact ul.nav li.contact a { color:#000; border-bottom:4px solid #900; font-weight:bold } a.has_image:hover, div.full_archives div.article_illustration_mini a:hover, div.recent_comments ul li a:hover, div.flickr ul li a:hover { border:none } a.has_image:active, div.full_archives div.article_illustration_mini a:active, div.recent_comments ul li a:active, div.flickr ul li a:hover { border:none } div.recent_comments ul li a { color:#000 } div.recent_comments ul li a strong { color:#900 } div#more_info a { margin:0 } /* X Specifics: lists */ div.post ul li, ol.comment_list li div.text ul li { list-style:disc; margin:10px 0 } div.post ol li, ol.comment_list li div.text ol li { list-style:decimal-leading-zero; margin:10px 0 } li.combined_feed { margin:0 0 15px 0; text-transform:uppercase; } /* X Specifics: p */ div.twitter p { background:url(http://cdn.images.elliotjaystocks.com/presentation/twitter_stem.gif) 44px 0 no-repeat; padding:20px 0 0 80px; margin:0 } div.twitter p.message { background:#fff url(http://cdn.images.elliotjaystocks.com/presentation/twitter.gif) repeat-x; color:#000; padding:20px; margin:0 } ol.mini_events li p, ol.past_events li p { margin:4px 0 } div.flickr p { margin:-10px 0 10px 0 } ul.faqs p { padding:0 70px } ul.magazines li p { position:absolute; top:0; left:540px } p.back { width:340px } /* X Specifics: other */ div.footer h2, div.footer h3, div.footer h4, div.footer p, div.footer li, div.footer label { color:#fff } div.testimonial blockquote { width:400px; margin:0 0 0 -60px } div.post blockquote { padding:0 0 40px 0 } div.post p cite { margin:-60px 0 40px 0; display:block } /* WP forces 'cite' to sit outside a blockquote. What can you do? */ /* 3 Image replacement */ h1 a { background:url(http://cdn.images.elliotjaystocks.com/presentation/h1.png); display:block; text-indent:-9999px; width:280px; height:104px; position:absolute; top:70px; left:70px } h1 a:hover span { display:block; text-indent:0; margin:0; color:#666; position:absolute; bottom:-6px; left:0 } h1 a:active span { color:#000 }