/* Theme Name: SOFA Piggy Theme URI: http://sofarider.com/ Description: Plain Blog WordPress Theme. Version: 1.0 Author: Dameer, sofarider.com Author URI: http://sofarider.com/ Tags: Blog, Whatever */ /* http://meyerweb.com/eric/tools/css/reset/ */ /* v1.0 | 20080212 */ 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, 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 { font: 62.5%/25px "Trebuchet MS", Helvetica, Arial, sans-serif; color: #888; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; } body { background: #FFFFFF url(images/bg_main_navig.jpg) repeat-x scroll left top; height: 100%; } pre { font-family: "Courier New", Courier, monospace; font-size: 12px; margin: 10px 0; padding: 0 10px; background: #f0f0f0; line-height: 15px; overflow: auto; overflow-Y: hidden; } code { font-size:1.2em; color: #008099; } blockquote { font-size: 15px; color: #666; padding: 10px 0 10px 50px; float: right; width: 330px; font-style: italic; margin: 10px 0 10px 20px; background: #fff url( images/quotes.gif ) top left no-repeat; } ol, ul { list-style-position: inside; padding-left: 20px; } ol li { list-style-type: decimal; } ol ul li, li { list-style: disc; } li li { font-size: 100%; } ol li { padding-left: 0; background: none; } /* ========== A ========== */ a:link, a:visited { color: #3682df; text-decoration: none; } a:hover, a:focus { color: #3682df; text-decoration: underline; } a:active { color: #3682df; text-decoration: none; } h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, { color: #303030; text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover, h1 a:focus, h2 a:focus, h3 a:focus { color: #3682df; text-decoration: none; } h1 a:active, h2 a:active, h3 a:active { color: #303030; text-decoration: none; } .spaced .relmeta h3 a:link, .spaced .relmeta h3 a:visited { color: #303030; text-decoration: none; } .spaced .relmeta h3 a:hover, .spaced .relmeta h3 a:focus { color: #3682df; text-decoration: none; } .spaced .relmeta h3 a:active { color: #303030; text-decoration: none; } /* ========== H ========== */ h1 { color: #303030; font-size: 28px; line-height: 40px; letter-spacing: -0.02em; } h2 { font-size: 17px; font-weight: normal; color: #303030; } h1, h2, h3, h4, h5, h6 { margin-top: 7px; padding-bottom: 10px; font-family: "Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif; } /* ========== Header ========== */ #header { width: 960px; overflow: visible; margin: 0 auto; height: 195px; } #header .logo { width: 660px; height: 105px; margin-top: 10px; position: absolute; zoom: 1; } /* main navig*/ #mainNavi { height: 72px; float: left; width: 960px; margin-top: 125px; position: absolute; } #mainNavi li a:link, #mainNavi li a:visited { color: #636363; text-decoration: none; } #mainNavi li a:active, #mainNavi li a:hover, #mainNavi li a:focus { color: #3682df; text-decoration: none; } #mainNavi ul { padding-top: 22px; list-style-position: outside; padding-left: 0; overflow: hidden; font-weight: bold; font-size: 14px; } #mainNavi li { float: left; line-height: 1; list-style-type: none; overflow: hidden; } #mainNavi li p { padding: 5px 0 0 0; font-size: 10px; text-transform: uppercase; font-weight: normal; } #mainNavi li a { padding: 0; } #mainNavi ul li { padding-left: 20px; padding-right: 20px; background: transparent url(images/main_nav_inset.gif) repeat-y scroll right top; zoom: 1; } #mainNavi ul li.first { padding-left: 0; } #mainNavi li.current a:link, #mainNavi li.current a:visited, #mainNavi li.current a:focus, #mainNavi li.current a:hover, #mainNavi li.current a:active, #mainNavi li.current-cat a:link, #mainNavi li.current-cat a:visited, #mainNavi li.current-cat a:focus, #mainNavi li.current-cat a:hover, #mainNavi li.current-cat a:active, #mainNavi li.current_page_item a:link, #mainNavi li.current_page_item a:visited, #mainNavi li.current_page_item a:focus, #mainNavi li.current_page_item a:hover, #mainNavi li.current_page_item a:active { color: #3682df; } #mainNavi li ul { display: none; float: left; width: auto; } #mainNavi li.current ul, #mainNavi li.current-cat ul, #mainNavi li.current_page_item ul { display: block; } /* ========== Login ========== */ #searchwrap { float: right; font-size: 12px; width: 350px; position: relative; z-index: 999; } #searchpanel { left: 0; position: absolute; text-align: center; top: 1px; width: 350px; z-index: 998; } #panel { height: 0; overflow: hidden; position: relative; padding: 0 20px; text-align: left; top: 1px; width: 310px; z-index: 997; background-color: black; } #panel h1.user { color: #3682df; padding-right: 75px; background: transparent url(images/login48x48.png) no-repeat scroll right top; zoom: 1; } .panelBtn { width: 140px; height: 20px; position: relative; float: right; text-transform: uppercase; clear: both; background-color: black; text-align: center; padding: 10px 0; } #openbutt { display: block; } #closebutt { display: none; } #searchwrap #searchpanel #panel #searchform p label { padding: 15px 0 0 0; display: block; } #searchwrap #searchpanel #panel #searchform p .input { padding: 5px; width: 245px; margin-top: 20px; } #searchwrap #searchpanel #panel #searchform p #searchsubmit { width: 39px; height: 39px; border: none; padding: 0; margin-top: 14px; } #searchwrap #searchpanel #panel #searchform .block { float: left; display: inline; margin-right: 10px; } /* ========== Wrapper, Sidebar ========== */ #wrap { width: 960px; overflow: hidden; margin: 0 auto; clear: both; padding: 20px 0; } #breadpitcrumbz { width: 960px; overflow: hidden; margin: 0 auto; clear: both; padding: 0 0 20px 20px; background: transparent url(images/home14x14.png) no-repeat scroll left top; zoom: 1; } #breadpitcrumbz ul { font-size: 10px; text-transform: uppercase; padding-left: 0; list-style-position: outside; } #breadpitcrumbz ul li { list-style: none; list-style-type: none; float: left; line-height: 1; padding-right: 5px; padding-top: 2px; } #main { float: left; overflow: hidden; width: 640px; } #side { float: left; overflow: hidden; width: 300px; margin-left: 20px; font-size: 12px; } #side h1, #footer h1 { font-size: 24px; line-height: 30px; margin-top: 0; } #side h2, #side h3, #side h4, #footer h2, #footer h3, #footer h4 { padding-bottom: 0; } #side .box, #footertop .box { width: 260px; padding: 20px; overflow: hidden; background: #FFF url(images/narrow_bg_header300x156.jpg) no-repeat scroll left top; margin-bottom: 20px; } #side img.advert, #footertop img.advert { margin: 0 5px 5px 0; padding: 0; } #side img.advertlast, #footertop img.advertlast { margin: 0 0 5px 0; } #side img, #footertop img { float: left; margin: 8px 15px 5px 0; border: 1px solid #F1F1F1; } /* subnavig */ #side .subnavigation { font-size: 17px; text-decoration: none; padding-left: 0; list-style-position: outside; } #side .subnavigation li { list-style-type: none; border-bottom: 1px solid #F1F1F1; padding: 5px 0 7px 32px; background: transparent url(images/subnav_bullet17x14.gif) no-repeat scroll left center; zoom: 1; } #side .subnavigation li a { text-decoration: none; } #side .subnavigation li a:link, #side .subnavigation li a:visited, #side .subnavigation li a:active { color: #303030; } #side .subnavigation li a:hover, #side .subnavigation li a:focus, #side .subnavigation li.current a:link, #side .subnavigation li.current a:visited, #side .subnavigation li.current a:focus, #side .subnavigation li.current a:hover, #side .subnavigation li.current a:active, #side .subnavigation li.current-cat a:link, #side .subnavigation li.current-cat a:visited, #side .subnavigation li.current-cat a:focus, #side .subnavigation li.current-cat a:hover, #side .subnavigation li.current-cat a:active, #side .subnavigation li.current_page_item a:link, #side .subnavigation li.current_page_item a:visited, #side .subnavigation li.current_page_item a:focus, #side .subnavigation li.current_page_item a:hover, #side .subnavigation li.current_page_item a:active { color: #3682df; } #side h1.twitter, #footertop h1.twitter { padding-right: 75px; background: transparent url(images/twitter_logo38x38.png) no-repeat scroll right top; zoom: 1; } #side .plist, #footertop .plist { padding: 10px 0; border-bottom: 1px solid #F1F1F1; overflow: hidden; } #side .plist img, #footertop .plist img { padding: 0 15px 0 0; border: none; margin: 0; } #side .plist .title, #footertop .plist .title { font-size: 17px; font-weight: bold; display: block; width: 205px; float: right; } #side .plist .note, #footertop .plist .note { font-style: normal; display: block; font-size: 10px; text-transform: uppercase; line-height: 1; font-weight: normal; position: relative; } /* ========== Big Banner ========== */ #bigbanner { width: 960px; overflow: visible; margin: 20px auto; height: 230px; clear: both; background: #FFF url(user-images/big_banner960x230.png) no-repeat scroll left top; } #bigbanner .buttonholder { padding: 155px 0 0 330px; height: 100px; } #bigbanner .buttonholder img { border: none; padding: 0; margin: 0 20px 0 0; } /* ========== Article Box ========== */ .uppercase { text-transform: uppercase; } .smallspaced { font-size: 10px; letter-spacing: 1px; line-height: 1; margin-top: 10px; } .article, .bloglist, .worklist { padding: 20px; width: 600px; overflow: hidden; background: #FFF url(images/wide_bg_header640x156.jpg) no-repeat scroll left top; } html[xmlns] .clearfix { display: block; } .article img { float: left; border: 1px solid #F1F1F1; margin: 5px 10px 5px 0; /* max width 588px! */} .articleimage { float: left; height: 200px; margin: 0 30px 30px 0; width: 200px; } .articlemeta { float: left; font-size: 11px; position: relative; width: 370px; } .articlemeta h1 { padding-right: 50px; } .fullwidth { width: 600px; padding-bottom: 10px; } .fullwidth h1 { padding-right: 0; } .articlemeta h1 a:link,.articlemeta h1 a:visited { color: #303030; text-decoration: none; } .articlemeta h1 a:hover, .articlemeta h1 a:focus { color: #3682df; text-decoration: none; } .articlemeta h1 a:active { color: #303030; text-decoration: none; } .articleimage .thumbnail { border: 1px solid #F1F1F1; width: 200px; height: 200px; } .articlemeta .author { background: #F8F8F8 none repeat scroll 0 0; padding: 3px 5px; } .articlemeta .iconized { background: #FFF url(images/client16x16.png) no-repeat scroll left center; padding: 2px 0 0 25px; } .articlecomment { background: #FFF url( images/comments.jpg ) no-repeat scroll 0 0; font-size: 18px; height: 48px; line-height: 35px; position: absolute; right: 0; text-align: center; top: 0; width: 48px; letter-spacing: -0.02em; } .article ul.tags { background: #FFF url( images/tags.gif ) no-repeat scroll 0 center; border-top: 1px solid #F1F1F1; margin: 15px 0 20px; padding-left: 24px; padding-top: 9px; list-style-position: outside; } .article ul.tags li { list-style: none; list-style-type: none; } #main .article .frontpost { padding-bottom: 20px; clear: both; font-size: 14px; } .article .sharebox { float: left; clear: both; overflow: hidden; margin: 20px 0 40px 0; padding-bottom: 20px; width: 600px; border-bottom: 1px solid #F1F1F1; } .article .sharebox img { float: left; margin-right: 20px; width: 20px; height: 20px; } /* comments, related articles, search & archive, portfolio */ .comment { width: 100%; } .comment, .respond { font-size: 13px; } .comment .author { background: none; padding: 0; margin: 0; } .related, .comment, .respond { clear: both; overflow: hidden; margin: 20px 0; } .tab { background-color: #F8F8F8; padding: 3px 20px; float: right; clear: both; font-size: 17px; height: 30px; margin-right: 20px; color: #303030; } .con { padding: 20px; clear: both; width: 560px; background: transparent url(images/top_shaded_bg.jpg) top left repeat-x; } .con h3, .relmeta h3 { font-size: 22px; font-weight: normal; margin: 0; } .con p.pingtrack { font-style: italic; margin-bottom: 20px; } .comment img { float: left; height: 60px; margin: 0 20px 0 0; width: 60px; border: 1px solid #F1F1F1; padding: 10px; background-color: #FFF; } .related .relmeta { float: left; width: 560px; } .relmeta p { padding-left: 102px; } .relmeta .author { font-size: 17px; font-weight: bold; } .con ul, .bloglist ul, .worklist ul { padding-left: 0; margin-left: 0; list-style-position: outside; } .related ul li, .comment ul li, .bloglist ul li { border-bottom: 1px solid #F1F1F1; display: block; overflow: hidden; list-style: none; list-style-type: none; zoom: 1; } .comment ul li { padding-bottom: 20px; margin-bottom: 20px; } .related ul li, .bloglist ul li { padding-bottom: 5px; margin-bottom: 5px; } .related ul li.last, .comment ul li.last, .bloglist ul li.last { margin-bottom: 0; } #main .article .frontpost .folioimgwide { width: 588px; height: 180px; border: 1px solid #F1F1F1; overflow: hidden; margin-bottom: 10px; position: relative; } #main .article .frontpost .folioimgwide img { padding: 0; margin: 0; border: none; width: 588px; } * html #main .article .frontpost .folioimgwide img { height: 100%; zoom: 1; } .bordered { border-bottom: 1px solid #F1F1F1; margin-bottom: 20px; } object, * html embed { width: 425px; height: 344px; float: left; border: 1px solid #F1F1F1; margin: 10px 15px 10px 0; } object embed { width: 425px; height: 344px; float: left; } /* comment form */ .respond p { padding-bottom: 30px; } .respond .lowcut { padding-bottom: 0; } .input, .textarea, .mtextarea { border: 1px solid #F1F1F1; padding: 10px; background: url(images/top_shaded_bg.jpg) top left repeat-x; } .input { width: 300px; } #side .box .input { width: 188px; float: left; display: inline; margin: 0 10px 10px 0; } #side .box #searchsubmit { width: 39px; height: 39px; float: left; display: inline; margin: 0 0 10px 0; border: none; zoom: 1; cursor: hand; } .textarea { width: 448px; } .mtextarea { width: 485px; } * html .textarea { width: 428px; } .respond label { display: block; float: left; line-height: 35px; padding-right: 10px; text-align: right; text-transform: uppercase; width: 80px; } #submit { background: #666 url( images/submit_button.gif ) no-repeat scroll 0 2px; border: medium none; color: #FFF; cursor: pointer; font-family: "Myriad Pro", Helvetica, Arial, sans-serif; font-size: 12px; margin-left: 90px; padding: 10px; } /* ========== Blog list Home ========== */ .bloglist ul, .worklist ul { padding-bottom: 20px; } .bloglist h1 { background: transparent url(images/blog_title_icon47x48.png) no-repeat scroll 8px top; padding-left: 77px; padding-bottom: 20px; zoom: 1; } .bloglist h1.archivetitle { background: none; padding-left: 0; padding-bottom: 10px; } .bloglist .relmeta { width: 518px !important; float: left; display: inline; padding: 0; margin: 0; } .bloglist .commnum { width: 60px; float: left; margin: 5px 20px 0 0; text-align: center; display: inline; overflow: hidden; } .bloglist .commnum .commbro { font-size: 24px; font-weight: bold; letter-spacing: -0.02em; margin-bottom: 1px; } .bloglist .commnum .commstr { font-style: normal; display: block; font-size: 10px; text-transform: uppercase; line-height: 1; font-weight: normal; width: 60px; } .spaced ul li { padding: 10px 0 20px 0; } .spaced .relmeta h3 { padding-bottom: 5px; } .spaced .relmeta p { font-size: 14px; padding-left: 0; line-height: 24px; } .bloglist img { border: 1px solid #F1F1F1; padding: 0; margin: 0; width: 58px; } /* ========== Product list Home ========== */ .worklist { font-size: 12px; } .worklist h1 { background: transparent url(images/work_title_icon48x48.png) no-repeat scroll 3px top; padding-left: 72px; padding-bottom: 20px; zoom: 1; } .worklist ul li { overflow: hidden; list-style: none; list-style-type: none; display: inline; float: left; width: 135px; margin: 20px 20px 0 0; } .worklist ul li.last { margin-right: 0; } .worklist ul li p, .worklist ul li a:link { line-height: 0; } #main .worklist .imgdiv { border: 1px solid #F1F1F1; margin-bottom: 5px; overflow: hidden; width: 133px; height: 90px; position: relative; } #main .worklist .imgdiv img { border: none; margin: 0; padding: 0; width: 200px; } * html #main .worklist .imgdiv img { height: 100%; zoom: 1; } /* tooltips */ #main .worklist .tooltip { display: none; position: absolute; background: transparent url(images/tool_tip_tit960x6.gif) no-repeat scroll center bottom; padding-bottom: 6px; overflow: hidden; zoom: 1; z-index: 990; } * html #main .worklist .tooltip { width: 200px; } #main .worklist .tooltip .ttcontent { padding: 0 20px 20px 20px; border-top: 1px solid #CCC; border-left: 1px solid #CCC; border-right: 1px solid #CCC; background-color: #FFF; } /* ========== Footer elements ========== */ #footer { width: 100%; overflow: hidden; clear: both; margin: 0 auto; padding: 0; } #footertop { width: 960px; margin: 0 auto; clear: both; overflow: hidden; font-size: 14px; } #footertop .box { margin-right: 30px; float: left; display: inline; } #footertop .box ul { list-style-position: outside; } #footertop .last { margin-right: 0; } #footernavig { height: 69px; background: transparent url(images/foot_navig_bg10x69.gif) repeat-x scroll left top; width: 100%; clear: both; overflow: hidden; } /* footer navig*/ #footNavi { height: 69px; width: 960px; margin: 0 auto; } #footNavi li a:link, #footNavi li a:visited { color: #636363; text-decoration: none; } #footNavi li a:active, #footNavi li a:hover, #footNavi li a:focus { color: #3682df; text-decoration: none; } #footNavi ul { padding-top: 24px; list-style-position: outside; padding-left: 0; overflow: hidden; font-weight: bold; font-size: 14px; height: 45px; } #footNavi li { float: left; list-style-type: none; } #footNavi li a { padding: 0 40px 0 0; } #footNavi li li { } #footNavi li.current, #footNavi li.current-cat, #footNavi li.current_page_item { } #footNavi li ul { display: none; float: left; width: auto; } #footNavi li.current ul, #footNavi li.current-cat ul, #footNavi li.current_page_item ul { display: block; } #footerblack { width: 100%; float: left; clear: both; height: 70px; background-color: #000; } #footerblack .container { width: 960px; margin: 0 auto; } #footerblack .copy { margin-top: 25px; font-size: 10px; text-transform: uppercase; overflow: hidden; width: 680px; float: left; display: inline; } #footerblack .logo { float: left; display: inline; margin-top: 20px; width: 280px; height: 30px; overflow: hidden; } * html #footerblack .logo img { width: 100%; height: 100%; zoom: 1; } /* ========== Pagination ========== */ .wp-pagenavi { list-style-position: outside; width: 600px; padding: 0 20px; float: left; clear: both; overflow: hidden; } .wp-pagenavi { } .main .wp-pagenavi { width: 600px; } .wp-pagenavi ul { width: auto; float: right; padding: 6px 10px; /*background: #ffe9c5;*/ } .wp-pagenavi li { width: auto; float: left; font-size: 12px; margin: 0 4px; list-style-type: none; } .wp-pagenavi li a:link, .wp-pagenavi li a:visited, .wp-pagenavi li a:active { display: block; color: #3682df; } .wp-pagenavi li a:hover, .wp-pagenavi li a:focus, .wp-pagenavi li.current-cat a:link, .wp-pagenavi li.current-cat a:hover, .wp-pagenavi li.current-cat a:visited, .wp-pagenavi li.current-cat a:active { color: #3682df; } .wp-pagenavi li span { padding: 0 5px; color: #636363; }