@charset "utf-8"; /* Theme Name: Catalyst Studios v.3 Theme URI: http://catalyststudios.co.uk/ Description: Created by Mike Armstrong for Catalyst Studios. Version: 1.0 Author: Mike Armstrong Author URI: http://catalyststudios.co.uk/ Catalyst Studios V.3 This theme was designed and built by Mike Armstrong. It is for use only by authorised parties, so don't nick it! If you need help, you can contact me via the Catalyst Studios website. */ /* -------------------------------------------------- Standard Stylesheet for 'most' browsers! website: www.catalyststudios.co.uk version: 2008.06 author: Mike Armstrong @ catalyststudios.co.uk -------------------------------------------------- */ /* Remove default margins & paddings -------------------------------------------------- */ * {margin: 0; padding: 0;} /* Base styles, typography & alignments -------------------------------------------------- */ html,body {height: 100.1%;} body {background: #E4E29E url(images/header_bg.gif) no-repeat top; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 70%; line-height: 150%; color: #333;} h1, h2, h3, h4, h5, h6 {font-family: Arial, Helvetica, sans-serif; font-weight: bold; color: #FC4E06;} h1 {margin-bottom: 3px; padding: 10px 0 15px; font-size: 180%;} h2 {margin-bottom: 3px; padding: 10px 0 15px; font-size: 170%;} h3 {margin-bottom: 3px; padding: 10px 0 15px; font-size: 150%; font-weight: bold;} h2.pagetitle {margin: 0px 0px 0px 90px;} p {margin-bottom: 1em;} blockquote {margin: 1.5em; padding: 1em; background: #E5E5E5; border-left: 3px solid #6215C7; color: #666;} #primary ul {margin-bottom: 1em;} ul {list-style-type: none;} li {padding: 2px 0px 2px 15px; background: url(images/subnav_bullet.gif) no-repeat 0px 8px; line-height: 210%;} ol {list-style-position: inside;} ol li {clear: both; background: url(images/paged_comments_circle.gif) no-repeat 10px 6px;} ol li ul li {clear: none; margin: 0 0 10px 30px; padding: 0 0 0 5px; background: none; border-left: 1px dotted #FC4E06; color: #666;} img.left {float: left; margin: 0 10px 10px 0;} img.right {float: right; margin: 0 0 10px 10px;} .left {float: left;} .right {float: right;} .center {margin: 0 auto; text-align: center;} form {margin-bottom: 20px;} input, textarea, select {font-family: Verdana, Arial, sans-serif;} .attention {font-weight: bold; color: red;} .proviso {padding: 2em 0 0; font-style: italic; font-size: 80%; color: #666;} .error {padding-left: 20px; color: #f00;} .caption {font-style: italic; font-size: 90%;} .noShow {display: none;} #forcer {float: left; width: 0px; height: 250px;} hr.cleaner {visibility: hidden; clear: both; margin: -1px 0 0 0; padding: 0; height: 1px; border: none;} .clear:after {content: "."; display: block; clear:both; height: 0; visibility: hidden;} /* Structure and DIV specific styling -------------------------------------------------- */ #header {margin: 0 auto; width: 100%; height: 220px; background: url(images/header_bg.gif) no-repeat top;} #headerWrapper {margin: 0px auto; width: 980px;} #headerWrapper h1 {float: left; margin: 0px; padding: 0;} #headerWrapper h1 a {display: block; width: 280px; height: 130px; text-indent: -9000px; outline: none;} #headerWrapper h2 {display: none;} #menu {float: left; display: inline; clear: left; margin: 20px 0px 0px 135px; line-height: 100%;} #mainMenu {list-style-type: none;} #mainMenu li {float: left; display: inline; padding: 0; background: none;} #mainMenu li a {display: block; position: relative; margin: 0px 15px 0px 0px; padding: 0px; width: 125px; height: 60px; background-position: top left; text-indent: -9000px; font-weight: bold; color: #000; outline: none;} #mainMenu li a:hover {background-position: left;} #menu1 a {background: url(images/menu_1.jpg) no-repeat;} #menu2 a {background: url(images/menu_2.jpg) no-repeat;} #menu3 a {background: url(images/menu_3.jpg) no-repeat;} #menu4 a {background: url(images/menu_4.jpg) no-repeat;} .blog #menu1 a, .gallery #menu2 a, .about #menu3 a, .contact #menu4 a {background-position: bottom left;} .blog #menu1 a:hover, .gallery #menu2 a:hover, .about #menu3 a:hover, .contact #menu4 a:hover {background-position: bottom left; cursor: default;} #feeds {float: left; display: inline; position: relative; z-index: 10; margin: -210px 0px 0px 600px;} #feeds a {display: block; width: 215px; height: 90px; text-indent: -9000px; outline: none;} #container {margin: 0 auto; width: 980px; background: #FAFAFA url(images/container_bg.gif) repeat-y center;} #primary {display: inline; float: left; margin: 10px 0px 0px 63px; width: 650px;} #primary h2 {font-size: 240%; font-weight: normal; text-decoration: none;} #primary a img {padding: 0; background-image: none;} #primary p.hideLink a {background-image: none; border: none;} #primary .captionedImage {float: right; display: inline; margin: 0px 0px 5px 5px; width: 200px; text-align: center; font-style: italic; font-size: 90%; color: #666;} #primary .captionedImage a {background-image: none; border: none;} #primary .captionedImage img a {background-image: none; border: none;} #primary .captionedImage em {font-style: normal;} #primary li.captionedImage {background-image: none; border: none;} #secondary {display: inline; float: left; margin: -60px 0px 0px 20px; padding: 10px 0px 0px; width: 245px; background: url(images/secondary_bg.gif) repeat-y right; color: #666;} #secondary h2 {display: block; clear: both; margin: 10px 0px 5px; padding: 0px; line-height: 100%; text-align: center;} #secondary ul {margin: 0px 10px 0px 10px; list-style-type: none;} #secondary ul li {padding: 0px; background-image: none;} #secondary ul ul li {padding: 2px 0px 2px 15px; background: url(images/subnav_bullet.gif) no-repeat 0px 8px; line-height: 210%;} #secondary li a {text-decoration: none; color: #1E2F8F;} #secondary li a:hover {border-bottom: 1px solid #0F1746; color: #0F1746;} #secondary_bottom {clear: both; display: block; height: 33px; background: url(images/secondary_bottom.gif) no-repeat right;} #tertiary {margin: 0px auto; width: 980px; background: url(images/footer_bg.jpg) no-repeat top; color: #666;} #tertiary .bottomColumn {float: left; margin: 45px 0px 0px; padding: 0px 00px 0px 60px; width: 360px;} #tertiary .bottomColumn h3 {margin: 0px 0px 10px;} #tertiary .bottomColumn a {padding: 2px 0px; text-decoration: none; color: #666;} #tertiary .bottomColumn a:hover {border-bottom: 1px solid #000; color: #000;} #tertiary .recentComments h3 {display: block; padding: 0px; width: 300px; height: 22px; background: url(images/footer_comments_h3.gif) no-repeat top left; text-indent: -9000px;} #tertiary .recentComments li {display: block; clear: both; width: 300px; background-position: 0px 8px; border-bottom: 1px dotted #333;} #tertiary .recentComments a {display: block; float: left; margin: 0px 0px 15px; padding: 0px 25px 0px 5px; width: 300px;} #tertiary .recentComments a:hover {border-bottom: none;} #tertiary .blogRoll h3 {display: block; padding: 0px; width: 300px; height: 22px; background: url(images/footer_blogroll_h3.gif) no-repeat top left; text-indent: -9000px;} #tertiary .blogRoll li {display: block; float: left; margin: 0px 0px 0px 10px; width: 125px; background-position: 0px 8px;} #tertiary #wordpressLink {display: inline; float: right; position: relative; margin: 30px 10px 0px 0px;} #tertiary #wordpressLink a {display: block; width: 125px; height: 210px; text-indent: -9000px; outline: none;} #footer {clear: both; display: block; padding: 10px; text-align: center;} #footer p {display: inline; margin: 0px auto; padding: 5px; background: #F2F2F2; border: 1px solid #DFDFDF; line-height: 100%;} /* Post formatting -------------------------------------------------- */ .post {clear: both; display: block; margin: 0px 0px 15px; background: url(images/page_rule.gif) no-repeat 90px bottom;} .post .postInfo {float: left; margin: 20px 0px 0px; width: 64px; overflow: hidden; border: 1px solid black;} .post .postDate {margin: 0; padding: 2px 5px 65px; background: #FFF url(images/unknown_portrait.gif) no-repeat bottom; border-bottom: 1px solid black; text-align: center; color: #FC4E06;} .post .postDate .postMonth {display: block;} .post .postDate .postDay {display: block; line-height: 100%; font-size: 250%; font-weight: bold;} .post .postDate .postYear {display: block;} .post .postAuthor {margin: 0; background: #6214C7 url(images/poster_bg.jpg) no-repeat top left; border-bottom: 1px solid black; text-align: center; color: #FFF;} .post .postAuthor a {color: #FFF;} .post .postComments {margin: 0; padding: 3px 0px; background: #FFF url(images/comments_main.jpg) center no-repeat; text-align: center;} .post .postComments a {display: block; padding: 10px 5px; color: #666;} .post .postComments a:hover {color: #333;} .post .entry {display: inline; float: right; margin: 10px 0px 25px 0px; padding: 0px 0px 15px 0px; width: 560px;} .post .entry h2 a {background: none; border: none; font-weight: normal; text-decoration: none; color: #FC4E06;} .post .entry h2 a:hover {background: none; color: #6214C7;} .post .entry a {background: url(images/link_bg.gif) repeat-x bottom left; padding: 3px; border-bottom: 1px solid #666; text-decoration: none; color: #666;} .post .entry a:hover {background-image: url(images/link_over_bg.gif); border-color: #000; color: #000;} .post .entry a img {border: none;} .post .entry .postmetadata {color: #FEAD8B;} .post .entry .postmetadata span {font-weight: bold;} .post .entry .postmetadata a {background: none; border: none; text-decoration: none; color: #FEAD8B;} .post .entry .postmetadata a:hover{background: none; border: none; color: #D9C3F7;} .post .mike .postDate {background-image: url(images/mike_portrait.gif);} .post .jonathan .postDate {background-image: url(images/jonathan_portrait.gif);} .post .david .postDate {background-image: url(images/david_portrait.gif);} /* specialised styles for inner page posts */ .inner .post .postComments {background-image: url(images/comments_inner.jpg);} .inner .post .commentsRssLink {display: inline; float: left; margin: 5px 2px;} .inner .post .commentsRssLink a {display: block; padding: 3px 0px; width: 36px; height: 22px; background: #FFF url(images/comments_rss_icon.gif) no-repeat top left; text-indent: -9000px;} .inner .post .trackbackLink {display: inline; float: left; margin: 5px 2px;} .inner .post .trackbackLink a {display: block; padding: 3px 0px; width: 19px; height: 22px; background: #FFF url(images/trackback_icon.gif) no-repeat top left; text-indent: -9000px;} .inner .post .tags {font-size: 80%; font-style: italic; color: #999999;} .navigation {clear: both; display: block; margin: 0px 10px 10px 90px; padding: 5px 0px; height: 30px;} .navigation .alignleft {float: left; display: inline; text-align: left;} .navigation .alignleft span {padding: 5px 25px; background: url(images/back_arrow.png) no-repeat left;} .navigation .alignright {float: right; display: inline; text-align: right;} .navigation .alignright span {padding: 5px 25px; background: url(images/forward_arrow.png) no-repeat right;} .navigation a {background: url(images/link_bg.gif) repeat-x bottom left; padding: 3px; border-bottom: 1px solid #666; text-decoration: none; color: #666;} .navigation a:hover {background-image: url(images/link_over_bg.gif); border-color: #000; color: #000;} /* social bookmarks bit -------------------------------------------------- */ .post .entry .sociable ul li a {background: none; border: none;} .staticPage .sociable ul li a {background: none; border: none;} /* comments formatting -------------------------------------------------- */ #comments {display: block; clear: both; margin: 5px 0px 0px 90px; padding: 10px 0px 0px; background: url(images/page_rule.gif) no-repeat top;} #comments h3.commentsOn {display: block; padding: 0px; width: 274px; height: 37px; background: url(images/comments_on_header.gif) no-repeat top left; text-indent: -9000px;} #comments h3.commentsOff {display: block; padding: 0px; width: 280px; height: 38px; background: url(images/comments_off_header.gif) no-repeat top left; text-indent: -9000px;} #comments p.commentStatus {text-align: center; padding: 10px 0px; color: #666;} #comments p.commentStatus .numOfPosts{font-size: 200%; font-weight: bold;} #comments p.commentStatus a {background: url(images/link_bg.gif) repeat-x bottom left; padding: 3px; border-bottom: 1px solid #666; text-decoration: none; color: #666;} #comments p.commentStatus a:hover {background-image: url(images/link_over_bg.gif); border-color: #000; color: #000;} /* Styles for paged comments */ #comments .comment-page-numbers {text-align: center; font-style: italic;} #comments .comment-page-numbers strong{padding: 10px; background: url(images/paged_comments_circle.gif) no-repeat 5px 6px; font-style: normal; color: #666;} #comments .comment-page-numbers a {margin: 0px 1px; padding: 3px; background: url(images/link_bg.gif) repeat-x bottom left; border-bottom: 1px solid #666; text-decoration: none; color: #666;} #comments .comment-page-numbers a:hover{background-image: url(images/link_over_bg.gif); border-color: #000; color: #000;} #comments ol {padding: 0px 0px 20px; list-style-type: none;} #comments li {clear: both; margin: 0px 0px 10px; padding: 5px; background: #E8E8E8 none; border: 1px solid #D5D5D5;} #comments li .commentMeta {float: left; padding: 64px 0px 0px; width: 66px; background: #6214C7 url(images/unknown2_comment.gif) no-repeat center -10px; border: 1px solid black; overflow: hidden; color: #FFF;} #comments li .commentMeta cite, #comments li .commentMeta small {display: block; text-align: center; margin: 0px; padding: 0; line-height: 150%;} #comments li .commentMeta cite {background: url(images/comment_shine.gif) no-repeat top left; font-style: normal;} #comments li .commentMeta a {color: #FFF;} #comments li .commentMeta a:hover {color: #CCC;} #comments p.commentNumber {display: inline; float: right; margin: 5px; line-height: 100%; font-size: 200%; font-weight: bold; text-align: right; color: #D3D3D3;} #comments .commentText {display: inline; float: right; position: relative; z-index: 20; width: 470px; text-align: left;} #comments .editComment {clear: both; text-align: right; line-height: 100%; text-align: right; font-size: 80%;} /* 'odd' comments */ #comments .alt {background: #F2F2F2 none; border: 1px solid #DFDFDF;} #comments .alt .commentMeta {background-image: url(images/unknown1_comment.gif);} #comments .alt p.commentNumber {color: #DDDDDD;} /* author-specific comments */ #comments .mike .commentMeta {background-image: url(images/mike_comment.gif);} #comments .david .commentMeta {background-image: url(images/david_comment.gif);} #comments .jonathan .commentMeta {background-image: url(images/jonathan_comment.gif);} #comments .mike, #comments .david, #comments .jonathan {background: #FED8C8 url(images/admin_comment_bg.gif) no-repeat bottom right; border: 1px solid #FC4E06;} #comments .mike p.commentNumber, #comments .david p.commentNumber, #comments .jonathan p.commentNumber{color: #FEB496;} /* comments form */ #comments #commentFormArea {padding: 10px 0px 0px; background: url(images/page_rule.gif) no-repeat top;} #comments h3#respond {display: block; margin: 20px 0px 0px; padding: 0px; width: 193px; height: 35px; background: url(images/comments_leave_header.gif) no-repeat top left; text-indent: -9000px;} #comments form {display: block; margin: 10px 0px 0px; padding: 10px; background: #F2F2EC; border: 1px solid #D7D7C4;} #comments form #commentGuidelines {float: right; margin: 0px 0px 10px; width: 40%; padding: 5px 5px 5px 40px; background: #EEF1EC url(images/the_rules.gif) no-repeat 10px; border: 1px solid #DDD; font-size: 80%;} #comments form #commentGuidelines li{padding: 2px 0px 2px 15px; background: url(images/subnav_bullet.gif) no-repeat 0px 8px; border: none; line-height: 210%;} #comments form #author, #comments form #email, #comments form #url, #comments form textarea {float: left; clear: left; padding: 5px; width: 240px; background: #FFF url(images/formfield_bg.png) no-repeat top left; border: 1px solid #666; border-bottom-width: 2px; font-size: 110%; color: #666;} #comments form label {float: left; clear: left; width: 250px;} #comments form textarea {float: none; clear: both; display: block; width: 98%;} #comments form #submitButton {display: block; clear: both; text-align: right;} #comments form #submit {padding: 3px 5px; background: url(images/link_bg.gif) repeat-x bottom left; border: 1px solid #666; border-bottom-width: 2px; cursor: pointer;} /* formatting for static pages -------------------------------------------------- */ .staticPage {margin: 10px 0px 0px 90px;} .staticPage a {background: url(images/link_bg.gif) repeat-x bottom left; padding: 3px; border-bottom: 1px solid #666; text-decoration: none; color: #666;} .staticPage a:hover {background-image: url(images/link_over_bg.gif); border-color: #000; color: #000;} /* formatting for Gallery page -------------------------------------------------- */ .gallery h2, .gallery h3 {color: #6214C7;} .ngg-gallery-thumbnail-box .ngg-gallery-thumbnail a{padding: 0px; background-image: none;} /* formatting for About page -------------------------------------------------- */ .about h2, .about h3 {color: #0D9AAA;} /* formatting for Contact page -------------------------------------------------- */ .contact .staticPage {padding: 0px 0px 200px 0px; background: url(images/contact_bg.png) no-repeat bottom left;} .contact h2, .contact h3 {color: #D6C603;} .contact #usermessagea {width: 350px; margin: 15px;} .contact #usermessagea p {display: block; width: 300px; margin: 15px;} .contact .failure ol {margin: 0px auto; list-style-type: none;} .contact #cformsform {width: 300px; margin: 15px; padding: 0px 0px 30px; background: url(images/contact_form_bg.gif) no-repeat bottom; border-top: 1px solid black;} .contact #cformsform ol {list-style-type: none;} .contact #cformsform li {background-image: none; line-height: 140%;} .contact #cformsform .single, .contact #cformsform textarea {display: block; padding: 5px; width: 250px; background: #FFF url(images/formfield_bg.png) no-repeat top left; border: 1px solid #666; border-bottom-width: 2px; font-size: 110%; color: #666;} .contact #cformsform label {display: block; width: 250px;} .contact #cformsform textarea {clear: both; width: 250px;} .contact #cformsform .cf-sb {display: block; margin: 10px;} .contact #cformsform .cf_li_err {margin: 0px 1px; padding: 10px 15px; width: auto; background: url(images/li_err_bg.png);} .contact #cformsform .cf_li_text_err{margin: 0px; padding: 0px;} .contact #cformsform .cf_li_text_err li{margin: 0px; padding: 0px 0px 0px 15px; background: url(images/icon_alert.png) no-repeat left; line-height: 140%;} .contact #cformsform #sendbutton {margin: 3px 5px; width: 42px; height: 42px; background: url(images/searchbox_button_bg.gif) no-repeat top left; border: none; font-family: Arial, Helvetica, sans-serif; font-size: 130%; font-weight: bold; text-align: center; color: #1E2F8F; cursor: pointer;} .contact #cformsform .cf_hidden {display: none;} .contact p#ll {display: none;} /* formatting for 404 page -------------------------------------------------- */ .staticPage h2#fourOhFour {padding: 440px 0px 10px; background: url(images/404_bg.jpg) no-repeat top;} /* 'not found' illo -------------------------------------------------- */ .staticPage h2#notFound {padding: 440px 0px 10px; background: url(images/notfound_bg.jpg) no-repeat top;} /* Searchbox (for inner page use) -------------------------------------------------- */ #searchformInner #sInner {display: block; float: left; margin: 0; padding: 15px 10px 5px; width: 132px; height: 18px; background: url(images/searchbox_bg.gif) no-repeat top left; border: none; text-align: left; font-size: 110%; font-weight: bold; color: #666; cursor: default;} #searchformInner input {display: block; float: left; width: 42px; height: 42px; background: url(images/searchbox_button_bg.gif) no-repeat top left; border: none; font-family: Arial, Helvetica, sans-serif; font-size: 130%; font-weight: bold; text-align: center; color: #1E2F8F; cursor: pointer;} /* Search Button */ #searchformInner div {display: block;} /* Sidebar/widget formatting -------------------------------------------------- */ #secondary .widget {display: block; clear: both; margin: 10px 0px 20px;} /* Site Admin menu */ #secondary #sidebarAdmin h2 {display: block; padding: 0px; width: 216px; height: 32px; background: url(images/manage_site_h2.gif) no-repeat top left; text-indent: -9000px;} /* Search Box */ #secondary #search h2 {display: block; padding: 0px; width: 213px; height: 28px; background: url(images/search_h2.gif) no-repeat top left; text-indent: -9000px;} #secondary #search #searchform {display: block; margin: 0px 0px 40px;} #secondary #search #searchform label{display: none;} #secondary #search #searchform input{float: left;} #secondary #search #searchform #s{display: block; margin: 0; padding: 15px 10px 5px; width: 132px; height: 18px; background: url(images/searchbox_bg.gif) no-repeat top left; border: none; text-align: left; font-size: 110%; font-weight: bold; color: #666; cursor: default;} #secondary #search #searchform #sb{display: block; margin: -20px 0px 0px 5px; width: 41px; height: 38px; background: url(images/searchbox_button_bg.gif) no-repeat top left; border: none; font-family: Arial, Helvetica, sans-serif; font-size: 130%; font-weight: bold; text-align: center; color: #1E2F8F; cursor: pointer;} /* Search Button */ #secondary #search #searchform div{display: block;} /* NextGen Gallery */ .ngg_images h2 {display: block; padding: 0px; width: 217px; height: 30px; background: url(images/latest_gallery_h2.gif) no-repeat top left; text-indent: -9000px;} .ngg_images .ngg-widget a {margin: 0px 0px 5px 5px; padding: 0; background-image: none;} .ngg_images .ngg-widget a:hover{border-bottom: none;} .ngg_images .ngg-widget a img{padding: 10px; background: #CBCBB4; border: 1px solid #BBB9B8;} .ngg_images .ngg-widget a:hover img{background: #ADAD87; border: 1px solid #979291;} /* Tag Cloud */ #tag_cloud h2 {display: block; padding: 0px; width: 213px; height: 58px; background: url(images/tag_cloud_h2.gif) no-repeat top left; text-indent: -9000px; font-size: 90%;} /* Catalyst Elsewhere */ #php-code-1 h2 {display: block; padding: 0px; width: 216px; height: 32px; background: url(images/catalyst_elsewhere_h2.gif) no-repeat top left; text-indent: -9000px;} /* Post Categories */ #categories-1 h2 {display: block; padding: 0px; width: 213px; height: 28px; background: url(images/post_categories_h2.gif) no-repeat top left; text-indent: -9000px;} /* Archived Posts */ #archives h2 {display: block; padding: 0px; width: 213px; height: 29px; background: url(images/archived_posts_h2.gif) no-repeat top left; text-indent: -9000px;}