/* Theme Name: Bullet Creative Theme URI: http://www.bulletcreative.com Description: Default theme for Bullet Creative's website Version: 1.0 Author: Mike Hatcher (Based on them by MTS von webdesign-in.de und texto.de) Author URI: http://www.texto.de */ /* ****************************************************************** GLOBAL RESET - ALL MEDIA TYPES Removes default styling on all elements in all browsers, thus making initial layout and styling consistent across all browsers ****************************************************************** */ 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, sub, sup, samp, small, strike, strong, tt, var, b, u, i, center, 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-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } address, cite { font-style: normal; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } a { text-decoration: none; } @media screen, projection, tv { /* ****************************************************************** MAIN STRUCTURE & STYLING - screen, projection, tv CSS below creates structure & styling of entire website ****************************************************************** */ /* ~~~~~~~~~~~~ BODY ~~~~~~~~~~~~ */ body { color: #222; background: #ddd; font: 62.5%/1.6 Arial, Helvetica, sans-serif; margin: 0 auto 20px; text-align: center; } /* ~~~~~~~~~~~~ IE 6 WARNING MESSAGE ~~~~~~~~~~~~ */ #ie6-msg { background: #000; color: #fff; font-size: 1.1em; padding: 5px; position: relative; z-index: 2; } /* ~~~~~~~~~~~~ HIDDEN ELEMENTS ~~~~~~~~~~~~ */ #skip-links, /* Skip Links (Accessibility) */ #nav-main h2, /* Nav Main Structure Heading */ #footer h2, /* Footer Structure Heading */ #content-related h2 /* Realted Content Sidebar */ { position: absolute; margin-left: -9000em; top: -9000em; } /* ~~~~~~~~~~~~ WRAPPERS ~~~~~~~~~~~~ */ #wrapper { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; } #wrapper2 { margin: 15px auto; text-align: left; width: 960px; } /* ~~~~~~~~~~~~ LINKS ~~~~~~~~~~~~ */ a { color: #666; } a:hover { color: #000; } h2 a, h3 a { color: #222; } h2 a:hover, h3 a:hover { color: #444; } /* ~~~~~~~~~~~~ PARAGRAPHS & ADDRESSES ~~~~~~~~~~~~ */ p, address { font-size: 1.4em; margin: 0 0 1.5em; } /* ~~~~~~~~~~~~ HEADER ~~~~~~~~~~~~ */ #header { float: left; width: 100%; margin: 0 0 20px; } /* ~~~~~~~~~~~~ LOGO ~~~~~~~~~~~~ */ #logo { float: left; width: 200px; height: 79px; } #logo a { width: 200px; height: 79px; display: block; background: url(images/logo-bullet.gif) no-repeat 0 bottom; } #logo a:hover { background: url(images/logo-bullet.gif) no-repeat 0 0; } #logo span, #logo em { position: absolute; left: -9000em; top: -9000em; } /* ~~~~~~~~~~~~ NAVIGATION MAIN ~~~~~~~~~~~~ */ #nav-main { float: left; width: 745px; margin: 5.6em 10px 0 0; } #nav-main ol { float: right; font: 1.2em Arial, Helvetica, sans-serif; } #nav-main li { float: left; } #nav-main li a { float: left; display: block; border-left: solid 1px #c0c0c0; padding: 0 8px; } #nav-main li:first-child a { border-left: none; } #nav-main .current_page_item a, #nav-main .current_page_parent a, .category-news #nav-main .page-item-2 a, .category-blog #nav-main .page-item-5 a { color: #000; } /* ~~~~~~~~~~~~ WRAPPER CONTENT ~~~~~~~~~~~~ */ #content-wrapper { margin: 20px 10px 20px 20px; float: left; width: 730px; min-height: 620px; } /* ~~~~~~~~~~~~ Content Blocks ~~~~~~~~~~~~ */ .block-side { background: #fff; padding: 15px; margin: 0 0 10px; } .block-side h3 { font-size: 1.6em; margin: 0 0 1em; font-weight: normal; color: #000; } .block-side ol, .block-side ul, .block-side p { font-size: 1.4em; margin: 0; } .block-side li { line-height: 1.3; margin: 0 0 0.5em; background: url(images/bullet-off.gif) no-repeat 0 0.3em; padding: 0 0 0 13px; width: 140px; overflow: hidden; } .block-side li:hover { background: url(images/bullet-on.gif) no-repeat 0 0.3em; } /* ~~~~~~~~~~~~ TWITTER ~~~~~~~~~~~~ */ #twitter li { margin-bottom: 1em; } .twitter-timestamp { display: block; color: #aaa; font-size: 0.9em; } .twitter-link[href^="http://twitter.com/bulletcreate"] { display: block; margin-top: 0.5em; } /* ~~~~~~~~~~~~ QUOTES ~~~~~~~~~~~~ */ .quote-block, .quote-inline { font-style: italic; color: #777; font-size: 1.2em; line-height: 1.3; padding: 3px 35px; margin: 0 20px 1.5em; background: url(images/quote-left.gif) no-repeat 0 0; } .quote-block cite, .quote-inline cite { font-style: normal; font-size: 0.7em; margin: -3.5em 0 0; display: block; color: #999; min-height: 18px; background: url(images/quote-right.gif) no-repeat right top; padding: 2.5em 0 0;} .quote-inline { float: right; width: 200px; margin: 0.5em 0 0 10px; padding: 3px 25px; font-size: 1.1em; } /* ~~~~~~~~~~~~ CONTENT MAIN ~~~~~~~~~~~~ */ #content-main { background: #fff; width: 500px; float: right; margin: 0 0 0 10px; padding: 25px 20px 20px; } /* ~~~~~~~~~~~~ HEADINGS ~~~~~~~~~~~~ */ #content-main h2 { font-size: 2.6em; margin: 0 0 1em; font-weight: normal; line-height: 1.2; } #content-main h3 { font-size: 1.8em; margin: 0 0 1.5em; font-weight: normal; } /* ~~~~~~~~~~~~ LISTS ~~~~~~~~~~~~ */ #content-main ol, #content-main ul { font-size: 1.2em; margin: 0 0 1.5em; } #content-main ol p, #content-main ul p { font-size: 1em; } /* ~~~~~~~~~~~~ IFRAMES ~~~~~~~~~~~~ */ iframe { margin: 0 0 1.5em; } /* ~~~~~~~~~~~~ PAGES ~~~~~~~~~~~~ */ .page { } /* Headings */ #content-main .page h3 { margin: 1.5em 0 0; } /* ~~~~~~~~~~~~ POSTS ~~~~~~~~~~~~ */ .post { margin: 0 0 0; float: left; } /* Post Metadata */ #content-main .post-meta { font-size: 1em; float: left; width: 480px; margin: 0.5em 0 6em; color: #666; background: #f4f4f4; padding: 10px; } #content-main .post-meta li { float: left; margin: 0 5px 0.3em 0; border-left: solid 1px #ccc; padding: 0 0 0 5px; line-height: 1.3; } #content-main .post-meta li:first-child { border: none; padding: 0; } /* Comments */ #comments { } #comments h3 { margin-bottom: 0; } /* Comment List */ #content-main .commentlist { margin: 0; font-size: 1.1em; } #content-main .commentlist li { } #content-main .comment-body { background: #f4f4f4; margin: 0 0 2em; padding: 20px; } .comment-author { float: left; width: 80px; font-size: 1em; color: #666; } .comment-author img { display: block; border: solid 1px #ddd; padding: 1px; margin: 0 0 0.5em; } .comment-copy { margin: 0 30px 0 80px; } .commentmetadata { font-size: 1em; margin: 0 0 1em; } #content-main .commentlist ul { background: #fff; margin: 0 0 0 15px; font-size: 1em; } /* Comments Form */ #respond { } #respond h3 { margin-bottom: 0; } /* Pagination */ .pagination { float: left; width: 100%; } .pagination li { float: right; width: 50%; text-align: right; } /* ~~~~~~~~~~~~ CONTENT RELATED ~~~~~~~~~~~~ */ #content-related { float: right; width: 180px; } /* ~~~~~~~~~~~~ CONTENT ADDITIONAL ~~~~~~~~~~~~ */ #content-additional { width: 180px; float: right; margin: 20px 20px 0 0; } #content-additional ol p, #content-additional ul p { font-size: 1em; } /* ~~~~~~~~~~~~ FOOTER ~~~~~~~~~~~~ */ #footer { clear: both; padding: 10px; background: #ddd url(images/logo-footer.gif) no-repeat -10px center; border: solid 1px #ccc; } #footer p { margin: 0; color: #aaa; font-size: 1em; } /* ~~~~~~~~~~~~ BACKGROUNDS ~~~~~~~~~~~~ */ #background { margin: 11em auto 0; width: 960px; min-height: 640px; overflow: hidden; text-align: center; } /* ****************************************************************** TEMPLATES - screen, projection, tv CSS below creates structure & styling of templates ****************************************************************** */ /* ~~~~~~~~~~~~ HOME ~~~~~~~~~~~~ */ /* Nav Main */ .home #nav-main .current_page_parent a { color: #666; } .home #nav-main .page-item-231 a { color: #000; } /* Content Areas */ .home #content-main, .home #content-related, .home #content-additional { position: absolute; left: -9000em; top: -9000em; } /* ~~~~~~~~~~~~ CLIENTS ~~~~~~~~~~~~ */ .page-template-clients-php #content-main { width: 685px; } h2, h3 { font-size: 20px; } strong { font-size: 12px; } /* end of styles for screen, projection & tv media types */ }