/* Theme Name: Breathe Theme URI: http://www.paulcracknell.net/ Description: Breathe Wordpress Theme has an Extensive Options Page to allow customisation of the header image, text size, font family, heading colours, read more buttons, and much more. The theme also supports Google Advertising, Nivo Slider, two Wordpress Custom Menus and a welcome message box. There are four widget areas, Gravitar are supported as are automatic thumbnails generated for the front page with get that image plugin. The clean sleek design includes an Author box and unique comments boxes at the end of posts. A working version, set up instructions and version update information can be located on the theme homepage www.paulcracknell.net. Version: 3.0.1 Author: Paul Cracknell Author URI: For set up information of this Theme please visit http://www.paulcracknell.net/ Tags: black, white, red, two-columns, fixed-width, theme-options, custom-menu, custom-header The CSS, XHTML and design is released under GPL: License: GNU General Public License v3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html */ @import "css/reset.css"; @import "css/typography.css"; @import "css/layout.css"; @import "css/menu.css"; @import "style.php"; @import "ie.css"; /* ----------[ DEFAULT ]------------- */ html { margin:0; padding:0; } body { margin: 0; padding: 0; color:#333; } h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-weight:500; } p { margin: 0 0 15px 0; padding: 10px; line-height:20px; text-align: justify; } ul, ol { margin: 0; padding: 0; list-style: none; font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:12px; } img { border: none; overflow: hidden; max-width: 550px; } table, td { border-collapse:collapse; } table, td, img { border:0; } td, tr { vertical-align:top; text-align:left; } #respond {} li.depth-1 {} /* ----------[ LINKS ]------------- */ a:link {color: #ff0000; text-decoration: none; } a:visited { color: #ff0000; text-decoration: none; } a:hover { color: #ff9933; text-decoration: underline; } a:active { color: #ff9933; text-decoration: none; } /* ----------[ BASIC STUFF ]------------- */ .additional-meta { font-size: 11px; padding: 0 0 0 15px; } blockquote { font-style:oblique } .float-left { float:left; } .float-right { float: right; } .entry-meta { margin:10px; padding:5px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; clear:both; } /* ----------[ LISTS ]------------- */ ul { margin:0; padding:0; font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:12px; } ul li { padding:0; font-family:Helvetica,Tahoma,Arial,sans-serif; font-size:12px; } li { list-style-type:none; } .disc { list-style-type:disc } /* ----------[ LISTS INSIDE OF POSTS ]------------- */ .entry-content ul ol { margin-left:0; } .entry-content ul li { margin-left:10px; list-style:disc; list-style-position:inside } .entry-content ul li ol { margin-left:10px; } .entry-content ol li { margin-left:5px; list-style: decimal; list-style-position:inside; padding:10px; } .entry-content ol li li { margin-left:5px; } /* ----------[ HEADINGS ]------------- */ h2.entry-title { background: url(images/title-bg.jpg) no-repeat; height:40px; color: #fff; padding: 7px 0 0 20px; } h2.entry-title a:link { color:#fff; } h2.entry-title a:visited { color:#fff; } h2.entry-title a:hover { color:#fff; text-decoration: underline; } h2#comments{ margin:20px auto 10px; font-size:140%; } /* ----------[ HEADINGS INSIDE POSTS ]------------- */ .entry-content h3 {font-size:140%;} .entry-content h4 {font-size:120%;} .entry-content h5 {font-size:100%;} .entry-content h6 {font-size:90%;} /* ----------[ MAIN DIVS ]------------- */ /* ----------[ CONTAINERS ]------------- */ #wrapper { margin: 10px auto 0 auto; display:block; padding: 0 15px; width: 950px; background: #fff url( images/top.gif) center top no-repeat; position: relative; } #header { margin: 0; padding: 0; width: 950px; clear: both; } /* ----------[ POSTS ]------------- */ .post-index {margin:0 0 10px;} #post-single {margin:0 0 20px;} .posts-wrap { float:left; clear:none; margin: 0 10px 10px 0; padding: 10px 20px 10px 10px; width: 600px; } /* ----------[ READ MORE AT THE END OF EACH EXCERPT ON FRONT PAGE ]------------- */ .more { float:left; padding:12px 0 0 14px; margin:0; height:40px; width:150px; clear:both; font-size:11px; font-weight:700; } .more a:link { color:#fff; font-size:11px; } .more a:visited { color:#fff; font-size:11px; } .more a:hover { color:#fff; font-size:11px; text-decoration: underline; } /* ----------[ THIS IS THE LINE UNDER EACH STORY ON THE FRONT PAGE ]------------- */ .lastline { margin: 10px 0px 20px 0; padding: 0px; height:5px; width: 600px; clear:both; } /* ----------[ SIDEBARS ]------------- */ .sidebar-wrap { margin:10px auto; overflow:hidden; float:left; clear:none; width:300px; } .sidebar { width:99%; clear:none; } .block-1 { float:right; } /* ----------[ 404 PAGE ]------------- */ .error404 { margin:0; width:100%; text-align:center; } .error404 h1,.error404 h2 { margin: 10px auto; } /* ----------[ COMMENTS ON POST PAGES ]------------- */ .avatar { clear:both; margin:0px 10px 10px 40px; padding:5px; border:1px solid #000; } .commentlist li { padding: 5px 18px 22px 18px; margin-top:15px; border :#454545 solid 1px /*url(images/bg_commentlist.jpg) bottom no-repeat*/; background:#EFEFEF; border:1px solid #CECFD0; color:#000; } #comments { clear: both; } #comments .navigation { padding: 0 0 18px 0; } h3#comments-title, h3#reply-title { color: #000; font-size: 20px; font-weight: bold; margin-bottom: 0; } h3#comments-title { padding: 24px 0; } .commentlist { list-style: none; margin: 0; } .commentlist li.comment { border-bottom: 1px solid #e7e7e7; line-height: 24px; margin: 0 0 24px 0; padding: 0 0 0 56px; position: relative; background:#EFEFEF; border:1px solid #CECFD0; } .commentlist li:last-child { border-bottom: none; margin-bottom: 0; } #comments .comment-body ul, #comments .comment-body ol { margin-bottom: 18px; } #comments .comment-body p:last-child { margin-bottom: 6px; } #comments .comment-body blockquote p:last-child { margin-bottom: 44px; } .commentlist ol { list-style: decimal; } .commentlist .avatar { position: absolute; top: 4px; left: 0; } .comment-author { margin: 0 0 0 65px; } .comment-author cite { color: #000; font-style: normal; font-weight: bold; } .comment-author .says { font-style: italic; } .comment-meta { font-size: 12px; margin: 0 0 12px 65px; } .comment-meta a:link, .comment-meta a:visited { color: #888; text-decoration: none; } .comment-meta a:active, .comment-meta a:hover { color: #ff4b33; } .commentlist .even { } .commentlist .bypostauthor { } .reply { font-size: 12px; padding: 0 0 24px 0; } .reply a, a.comment-edit-link { color: #888; } .reply a:hover, a.comment-edit-link:hover { color: #ff4b33; } .commentlist .children { list-style: none; margin: 0; } .commentlist .children li { border: none; margin: 0; } .nopassword, .nocomments { display: none; } #comments .pingback { border-bottom: 1px solid #e7e7e7; margin-bottom: 18px; padding-bottom: 18px; } .commentlist li.comment+li.pingback { margin-top: -6px; } #comments .pingback p { color: #888; display: block; font-size: 12px; line-height: 18px; margin: 0; } #comments .pingback .url { font-size: 13px; font-style: italic; } /* Comments form */ input[type=submit] { color: #333; } #respond { border-top: 1px solid #e7e7e7; margin: 24px 0; overflow: hidden; position: relative; } #respond p { margin: 0; } #respond .comment-notes { margin-bottom: 1em; } .form-allowed-tags { line-height: 1em; } .children #respond { margin: 0 48px 0 0; } h3#reply-title { margin: 18px 0; } #comments-list #respond { margin: 0 0 18px 0; } #comments-list ul #respond { margin: 0; } #cancel-comment-reply-link { font-size: 12px; font-weight: normal; line-height: 18px; } #respond .required { color: #ff4b33; font-weight: bold; } #respond label { color: #888; font-size: 12px; } #respond input { margin: 0 0 9px; width: 98%; } #respond textarea { width: 98%; } #respond .form-allowed-tags { color: #888; font-size: 12px; line-height: 18px; } #respond .form-allowed-tags code { font-size: 11px; } #respond .form-submit { margin: 12px 0; } #respond .form-submit input { font-size: 14px; width: auto; } /* ----------[ ALIGNMENTS ]------------- */ img.alignright { float:right; clear:none; margin:0 0 1em 1em; overflow: hidden; } img.alignleft { float:left; clear:none; margin:0 1em 1em 0; overflow: hidden; } img.aligncenter { display: block; margin:1em auto; text-align:center; overflow: hidden; } img.alignnone { margin:0 0.5em 0 0; overflow: hidden; } /* ----------[ HEADER ]------------- */ /* ----------[ HEAD ]------------- */ #top { margin: 0 auto 10px auto; padding: 10px 0 0 0; width: 950px; background-color: #fff; } /* ----------[ SEARCH BAR LOCATED IN THE TOP NAVIGATION BAR ]------------- */ #searchform { position:absolute; left:700px; top:107px; margin: 0 0 0px 0; padding:0px 24px 0px 45px; overflow:hidden; } /* ----------- [SEARCH BAR TOP RIGHT ] -----------*/ #searchbar { float:right; margin: 6px 0 0 0; padding: 0; } #search { float:right; margin: 6px 0 0 0; padding: 0; } #submit { float:right; margin: 0px 0 0 0; padding: 0; } .fieldset { border:none; } /* ----------[ INPUT FOR SEARCH ]------------- */ .input { border: 1px solid #006; } h2.search-nothing{ font-size:17px; font-weight:900; } /* =self clearing ----------------- */ /*** see http://www.positioniseverything.net/easyclearing.html for explanation of Tony Aslett's elegant hack ***/ .clearfloat:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfloat { display: inline-block; } /* Hides from IE-mac */ * html .clearfloat { height: 1%; } .clearfloat { display: block; } /* End hide from IE-mac */ /*** end clearing hack ***/ /* ----------[ NAVIGATION TOP ABOVE THE IMAGE BLACK BAR SET FOR PAGES ]------------- */ #nav { padding: 2px 10px 10px 10px; margin: 0; width: 950px; height: 28px; background: url( images/topbar.jpg) left top no-repeat; font-size:90%; } /* ----------[ BREADCRUMB - THIS IS THE BOTTOM NAVIGATION UNDER THE PICTURE IN THE HEADER ]------------- */ .breadcrumb { position:relative; z-index:9999; background:url(images/bottombar.jpg) no-repeat; margin: 5px 0px 10px 0px; padding: 2px 10px 10px 10px; height:40px; width:auto; font-size:90%; } .breadcrumb li { margin: 0; padding: 0; display: inline; } /* ----------[ NAVIGATION - NEXT POST OR PREVIOUS POST ]------------- */ .navigation-index {} .nav-next { float:right; clear:none; width:48%; text-align:right; padding-bottom:10px; } .nav-prev { float:left; clear:none; width:48%; text-align:left; padding-bottom:10px; } /* ----------[ FOOTER ]------------- */ #footer { border-top:#888 solid 1px; background-color: #fff; clear: both; margin: 0 auto 0 auto; padding: 10px 10px 40px 15px; width: 930px; font-size: 0.9em; } #footer p { margin: 0; padding: 0; font-family: tahoma; } #footer p.footlinx { margin: 0; padding: 0; float: right; } #footer p a { color: #666; text-decoration: none; } #footer p a:hover { color: #666; text-decoration: underline; } .footerLeft { float:left; width:300px; margin:0; } .footerMiddle { float:left; width:300px; margin:0; } .footerRight { float:right; width:300px; margin:0; } #footcont { width:900px; margin: 0 auto; } .byline{ clear:both; font-size:75%; } /* ----------[ TOP HEADING - YOUR SITE NAME USUALLY ]------------- */ #top h1 { margin: 0; padding: 5px 20px 5px 10px; font-size: 48px; word-spacing: -4px; text-transform: uppercase; font-family: "Arial Black"; line-height: 0.7em; float: left; } #top h1 a { color:#000; font-weight: 600; text-decoration: none; } #top h1 span.black { color:#df1104; font-size: 30px; margin: 0; padding: 0; display: block; text-transform: lowercase; font-family: Arial, Helvetica, sans-serif; } /* ----------[ WIDGET SIDEBAR RIGHT BORDERS ]------------- */ .widget-top { margin: 10px 0 0 0; padding: 0; height: 16px; background: url(images/widget-top2.gif) left bottom no-repeat; } .widget-bot { margin: 0 0 20px 0; padding: 0; height: 16px; background: url(images/widget-bottom2.gif) left top no-repeat; clear: both; } .widget li { margin: 0; padding: 5px 0 5px 15px; font-size: 0.9em; border-bottom: #ccc dashed 1px; background: url(images/widget-bullet.png) no-repeat left 7px; } .widget li a { color:#333; text-decoration:none; } .widget li a:hover { color:#333; text-decoration: underline; } .widget { margin: 0; padding: 0 5px; list-style: none; width: 268px; border-left: #888 solid 1px; border-right: #888 solid 1px; } h3.widgettitle { margin: 0 0 15px 0; padding: 7px 10px; color: #fff; font-size: 1em; width:270px; font-weight:700; } /*-----------[FOOTER WIDGET---------------------------------------------------*/ .footer-widget { margin: 0; padding: 0 5px; list-style: none; width: 268px; } .footer-widget-top { margin: 10px 0 0 0; padding: 0; height: 16px; } .footer-widget-bot { margin: 0 0 20px 0; padding: 0; height: 16px; clear: both; } .footer-widget li { margin: 0; padding: 5px 0 5px 15px; font-size: 0.9em; border-bottom: #ccc dashed 1px; background: url(images/widget-bullet.png) no-repeat left 7px; } .footer-widget li a { color:#333; text-decoration:none; } .footer-widget li a:hover { color:#333; text-decoration: underline; } h3.footer-widgettitle { margin: 0 0 15px 0; padding: 7px 10px; color: #fff; font-size: 1em; width:270px; font-weight:700; } /* ----------[ GET IMAGE - ARTICLE IMAGES ON FRONT PAGE OF BLOG ]------------- */ img.custom-image { background: url(images/thumbnail.jpg) no-repeat; } img.thumbnail { float: left; border: 1px solid black; margin: 15px; padding: 5px;height:100px; width:100px; } /* ----------[ EXCEERPT FOR THE FRONT PAGE 70 CHARACTERS RECOMMENDED ]------------- */ .excerpt { padding:0 10px 30px 0; } /* ----------[ COMMENTS FRONT PAGE LINK ]------------- */ .comments { float:right; font-size:12px; font-weight:normal; text-transform:none; line-height:1.01em; overflow:hidden; margin:0 20px 0 0; padding-left:20px; clear:both; background: url(images/comment-grey-bubble.png) no-repeat; } /* ----------[ AUTHOR BOX ABOVE THE COMMENTS ]------------- */ #authorbox{ background:#EFEFEF; border:1px solid #CECFD0; width:600px; margin:0 auto; margin-top:10px; margin-bottom:10px; overflow:hidden; } #authorbox h4{ font-size:16px; color:#191919; margin:0; padding:10px 10px 5px 10px; } .authortext{ padding-left:100px; } #authorbox img{ margin:10px; padding:10px; float:left; } #authorbox p{ color:#191919; margin:0; padding:0px 10px 10px 10px; } #authorbox h4 > a{ text-decoration:none; } #authorbox p{ color:#191919; } /* ----------[ ARCHIVE PAGE ]------------- */ h2.archive-title { padding:10px; } /* ----------[ WELCOME BOX ]------------- */ .welcome { background:#EFEFEF; border:1px solid #CECFD0; width:580px; margin:0 auto; margin-top:10px; margin-bottom:10px; padding:10px; overflow:hidden; } /* ----------[ TOP ADS ]------------- */ .top-ads { background:#EFEFEF; border:1px solid #CECFD0; width:580px; margin:0 auto; margin-top:10px; margin-bottom:10px; padding:10px; overflow:hidden; } /* ----------[ BOTTOM ADS ]------------- */ .bottom-ads { background:#EFEFEF; border:1px solid #CECFD0; width:580px; margin:0 auto; margin-top:10px; margin-bottom:10px; padding:10px; overflow:hidden; min-height:40px; } /* ----------[ TOP NAVIGATION BAR CONTAINER ]----------*/ #top-nav-bar { width: 100%; color: #fff; /* padding: 10px; */ /* margin: 10px 0px 0px 0px;*/ background-color:#2c2b2b; /* background: url( images/top-bar-bg.png) ;*/ height:100px; font-size:15px; } /* ----------[ STYLE THE TOP NAVIGATION BAR LINKS ] ----------*/ .top-nav { height: 50px; width:1000px; /* background: url( images/top-nav-bg-grad.png) no-repeat ;*/ margin: 0 auto; padding:15px; font-size:15px; text-transform: uppercase; } .top-nav ul { } .top-nav li { float:left; padding:0 10px 0 10px; } .top-nav a:link { color: #fff; text-decoration: none; font-weight: 500; } .top-nav a:visited { color: #fff; text-decoration: none; font-weight: 500; } .top-nav a:hover { color: #fff; text-decoration: underline; font-weight: 500; } .top-nav a:active { color: #fff; text-decoration: none; font-weight: 500; } /*----------[LOGIN IN FOOTER]-----------*/ #login{ float:right; margin:0 30px 10px 0px; padding:8px 0 10px 0px; height:30px; width:94px; background:url('images/login.jpg') no-repeat; font-size:12px; font-weight:900; } #login a:link { color:#fff; padding:0 0 0 35px; } #login a:visited { color:#fff; padding:0 0 0 35px; } #login a:hover { color:#fff; padding:0 0 0 35px; } #login a:active { color:#fff; padding:0 0 0 35px; } /*----------[NIVO SLIDER]----------*/ .slider { margin:0 0 40px 0; } * html .slider{ border: 1px solid #000; } /*---------[REQUIRED]-------------*/ .wp-caption-text{} .wp-caption{max-width:550px;} .sticky {} .gallery-caption {} .bypostauthor{} .entry-content{max-width: 550px;}