/* Theme Name: SOFA iBloggr Theme URI: http://rider.sofarider.com/ Description: iPhone Blog WordPress Theme. Version: 1.0 Author: Dameer, sofarider.com Author URI: http://rider.sofarider.com/ Tags: Blog, iPhone, mobile blogging */ /* -------------------------------------------------------------- SITE STYLES by Hrvoje Created: 28.11.2009. Modified: 26.12.2009. -------------------------------------------------------------- */ /* 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%/1.5 "Trebuchet MS", Arial, Helvetica, sans-serif; color: #363636; } 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; } /* =defaults -------------------------------------------------------------- */ a { text-decoration: none; } a:link { color: #0263ed; } a:visited { color: #0263ed; } a:hover { color: #949494; } a:active { color: #ececec; } a:focus { color: #949494; } /*=fonts -------------------------------------------------------------- */ .comment-info, .cinfo, .approval, .comment, .twitterring li, .post-list p, textarea { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; } h1, h2, h3, h4, h5, h6, caption, th, #intro p, #navigation a, .pages li { font-family: "Myriad Pro", "Trebuchet MS", "Arial Rounded", Arial, Helvetica, sans-serif; } /* =layout -------------------------------------------------------------- */ #wrap, #navigate { width: 100%; } .portrait #wrap, .portrait #navigate { width: 320px; margin: 0 auto; } #header { } #branding { height: 48px; } #intro { height: 124px; overflow: hidden; } #navigation { height: 22px; padding: 10px; } #content { } #article { padding-top: 15px; overflow: hidden; } #feedback { margin: 20px 0 0 0; padding-left: 10px; padding-right: 10px; } /* =backgrounds -------------------------------------------------------------- */ /*body { background: #000 url(images/html.gif) repeat 0 0; }*/ body { background: #000 url(images/body_bg.jpg) repeat-y 50% 0; } #branding { background: #45484c url(images/backgrounds.png) repeat-x 0 0; } /*#intro { background: #f94 url(images/intro.jpg) repeat-x 50% 0; }*/ #navigation a { background: #e2e2e2 url(images/navigation-icon.png) no-repeat 0 0; } .section { background: #fff url(images/backgrounds.png) repeat-x 0 -60px; } .post-list .comments-count { background: transparent url(images/baloon.png) no-repeat 50% 50%; } #twitter .sectionheader { background: transparent url(images/twitter-bird.png) no-repeat 0 0; } .twitterring { background: transparent url(images/twitter-bubble-spike.png) no-repeat 17px 0; } .totop { background: #000 url(images/totop.png) no-repeat 50% 50%; } #article ul li, .widget li { background: transparent url(images/bullet.png) no-repeat 0 .75em; } #globalnav li { background: transparent url(images/nav-bullet.gif) no-repeat 0 .92em; } .pageslide-close { background: transparent url(images/close.gif) no-repeat 100% 0; } /* =borders -------------------------------------------------------------- */ #branding { border: 1px solid #000; } #content input, input, search, #content textarea, textarea { border: 1px solid #ececec; } #navigation { border-top: 1px solid #fff; } .section { border-top: 1px solid #fff; } .post-list li, .comment-list li { border-top: 1px solid #e2e2e2; } /*#navigate h1, #breadcrumbs,*/ #navigate .nav, #search, #article h1, .section { border-bottom: 1px solid #e2e2e2; } thead, tbody { border-bottom: 1px solid #ececec; } #social-media.section { border-bottom: none; } #article blockquote, .twitterring ol { border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } /* =header -------------------------------------------------------------- */ /*=branding -------------------------------------------------------------- */ #branding { text-align: left; } #branding .logo { margin: 10px 0 0 10px; } #branding .tagline { margin: 0 0 0 10px; color: #949494; font-size: 1em; line-height: 1; text-shadow: 0 0 1px #0c0c0d; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight: normal; } /*=intro -------------------------------------------------------------- */ #intro h1 { font-size: 2em; line-height: 1.2; margin-bottom: .2em; } #intro p { font-size: 1.6em; line-height: 1.38; } #intro h1, #intro p { text-shadow: 0 0 2px #000; text-shadow: 0 0 2px rgba(0,0,0,.75); } /*=navigation -------------------------------------------------------------- */ #navigation { text-align: right; background-color: #e2e2e2; } #navigation a { padding: 3px 0 0 37px; float: right; font-size: 1.4em; line-height: 21px; font-weight: bold; text-transform: uppercase; } #navigation a:link, #navigation a:visited, #navigation a:active { color: #363636; } #navigation a:hover, #navigation a:focus { color: #949494; } /* =content -------------------------------------------------------------- */ #content label { display: block; font-size: 1.2em; line-height: 2.2222; text-transform: uppercase; } #content input, input, search, #content button, button { line-height: 1; /*font-size: 12px;*/ } #content input, input, search, #content textarea { font-size: 14px; margin: 0; } #content textarea { width: 282px; line-height: 1.8; } #content input, input, search { width: 278px; padding: 5px 2px; } #content .submitMe { padding: 10px 0 0 0; text-align: center; } #content button, button { text-transform: uppercase; } #content form div { margin-bottom: .25em; } /*=article -------------------------------------------------------------- */ #article { } #article h1, #article h2, #article h3, #article h4, #article h5, #article h6, #article p, #article ol, #article ul, #article dl, #article pre, #article code { padding-left: 10px; padding-right: 10px; margin-bottom: 1em; } #article h1 { font-size: 1.8em; line-height: 1.3333; /*color: #534741;*/ margin-bottom: 10px; padding-bottom: 13px; } #article h2, #article h3, #article h4, #article h5, #article h6, #article dt { font-size: 1.8em; line-height: 1.4286; font-weight: normal; margin-bottom: 0; color: #363636; } #article p, #article blockquote, #article li, #article dd, #article pre, #article code { font-size: 1.35em; line-height: 1.8181; overflow: hidden; clear: both; } #article blockquote { font-size: 1.35em; line-height: 1.45; margin: 0 10px 10px 10px; padding: 10px; background: #ececec; } #article blockquote p { padding: 0; margin: 0; } #article li li, #article blockquote p { font-size: 100%; } #article ul { margin-left: 12px; } #article ol { margin-left: 24px; } #article ol { list-style: decimal; } #article ol ol { list-style: lower-alpha; } #article li, #article ol ul li { padding-left: 13px; } #article ol li { padding-left: 0; } #article ul ul { margin-left: 0; padding: 0; } #article ul ol, #article ol ol { margin-left: 10px; } #article ol ul { margin-left: 0; padding-left: 0; } #article li ol, #article li ul { margin-bottom: 0; } #article ul ol li { background: none; } #article dt { font-weight: bold; } #article img { margin-top: 5px; } #article object, #article embed, #article video { width: 300px; height: 185px; margin-top: 5px; } #article object embed { margin-top: 0; float: none; } #article .postinfo { margin: 5px 0; padding: 3px 10px 10px 10px; clear: both; } #article form { padding: 0 10px; } #article .submitMe { margin-top: 10px; } /*=WP image & caption styles -------------------------------------------------------------- */ .alignleft { float: left; margin: 0 10px 0 0; } .alignnone { float: left; margin: 0; } .alignright { float: right; margin: 0 0 0 10px; } .aligncenter, .portrait .alignright.size-medium, .portrait .alignleft.size-medium, .portrait .alignnone.size-medium { float: none; margin: 0 auto 10px auto; display: block; clear: both;} /*=wp-caption -------------------------------------------------------------- */ .wp-caption { text-align: center; margin: 0 10px; } .wp-caption img { float: none; margin: 0; } #article .wp-caption-text { margin-bottom: 0; } /*=feedback -------------------------------------------------------------- */ #feedback h3 { font-size: 1.4em; line-height: 1.4286; } #feedback h3 { font-weight: normal; padding: 4px 0 8px 0; } #feedback p { font-size: 1.1em; line-height: 1.8181; margin-bottom: 20px; } #commentform { margin-bottom: 20px; } #commentform .short { margin: 10px 0; } #commentform .short label { display: inline; margin-right: 1em; } #commentform .short input { width: 25px; } /*=section -------------------------------------------------------------- */ .section { padding: 12px 0 0 0; } .widget { padding: 15px 10px 11px; } .sectionheader { padding: 0 10px; font-size: 1.95em; margin-bottom: 11px; font-weight: bold; /*color: #534741;*/ } .widget .sectionheader { padding: 0;} .post-list li, .comment-list li { position: relative; padding: 15px 0 11px 0; } .postinfo, .comment-info { line-height: 1; margin: 0 0 12px 0; } .date, .category, .user { font-size: 1.12em; line-height: 1; text-transform: uppercase; } .comments-count { font-size: 1.12em; } .category a:hover, .category a:focus, .user a:hover, .user a:focus { /*color: #534741;*/ } /*=widget styles -------------------------------------------------------------- */ .widget ul, .widget ol { margin-left: 1px; } .widget li { font-size: 1.35em; line-height: 1.8181; padding-left: 14px; } .widget ul { } .widget ol { } .widget li li { font-size: 100%; } .textwidget { font-size: 1.35em; line-height: 1.8181; } .textwidget *, .textwidget li { font-size: 100%; } .textwidget p, .textwidget ul, .textwidget ol { margin-bottom: 1em; } .textwidget img, .textwidget .alignleft, .textwidget .alignnone { margin: 5px 10px 0 0; } .textwidget .alignright { margin: 5px 0 0 10px; } .textwidget img.size-medium, .textwidget img.size-large { margin: 5px 0 0 0; } .textwidget blockquote { line-height: 1.45; margin: 0 0 10px 0; padding: 10px; background: #ececec; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; } .textwidget blockquote p { padding: 0; margin: 0; } /*=articles -------------------------------------------------------------- */ .post-list li { min-height: 32px; padding-left: 66px; padding-right: 10px; overflow: hidden; } .post-list .comments-count { width: 45px; height: 32px; display: block; overflow: hidden; position: absolute; left: 10px; top: 15px; font-size: 1.2em; line-height: 2.25em; text-align: center; text-shadow: 0 0 1px #fff; } .post-list .comments-count a { display: block; } .comments-count a:link, .comments-count a:visited, .comments-count a:active { /*color: #534741;*/ } .comments-count a:hover, .comments-count a:focus { color: #949494; } .post-list h3 { font-size: 1.74em; line-height: 1.4286; font-weight: normal; text-shadow: 0 0 1px #fff; } .post-list h3 a:link, .post-list h3 a:visited, .post-list h3 a:active { color: #363636; } .post-list h3 a:hover, .post-list h3 a:focus { color: #949494; } .post-list p { font-size: 1.35em; line-height: 1.8181; } .post-list img { width: 45px; height: 45px; margin: 5px 10px 0 -55px; float: left; } .post-list object, .post-list embed, .post-list video { width: 244px; height: 148px; margin-top: 5px; } .post-list object embed { margin-top: 0; float: none; } /*=coments -------------------------------------------------------------- */ .comment-list li { min-height: 75px; padding-left: 10px; padding-right: 10px; } .comment-info { position: relative; } .gravatar { width: 45px; height: 45px; position: absolute; left: 0; top: 30px; } .comment { padding-left: 55px; font-size: 1.35em; line-height: 1.8181; } .cinfo, .approval { padding-left: 10px; padding-right: 10px; margin-bottom: 15px; font-size: 1.35em; line-height: 1.8181 } .approval { color: #FF6600; } /*=twitter -------------------------------------------------------------- */ #twitter .sectionheader { padding-left: 55px; padding-bottom: 1px; margin-left: 10px; } #twitter.section { padding-top: 18px; } .twitterring { margin: 0 10px 15px 10px; padding-top: 9px; } .twitterring ol { padding: 10px 14px 1px 14px; background-color: #ececec; } .twitterring li { margin-bottom: 1em; font-size: 1.35em; line-height: 1.8181; } /*=social-media -------------------------------------------------------------- */ #social-media.section { padding: 9px 10px; overflow: hidden; } #social-media .sectionheader { padding: 0; } #social-media a { width: 30px; height: 30px; overflow: hidden; float: left; display: inline; margin: 0 10px 5px 0; padding-bottom: 1px; } /*=pagination -------------------------------------------------------------- */ #pagination { padding: 15px 0; background: #e2e2e2; text-align: center; } .wp-pagenavi { padding-top: 3px; } .wp-pagenavi li { margin: 0 8px; /* fine tune distances of pagination links */ } .wp-pagenavi li { display: inline; font-size: 1.4em; line-height: 1; font-weight: bold; text-transform: uppercase; text-align: center; color: #949494; } .wp-pagenavi li.index { font-weight: normal; font-size: 1em; } .wp-pagenavi a:link, .wp-pagenavi a:visited, .wp-pagenavi a:active { color: #000; } .wp-pagenavi a:hover, .wp-pagenavi a:focus { color: #949494; } .first-page { } .last-page { } /* =footer -------------------------------------------------------------- */ #footer { min-height: 32px; padding: 10px; background-color: #000; color: #fff; } .copyright { width: 50%; line-height: 3.3; float: left; } .totop { width: 31px; height: 31px; float: right; } .totop a { width: 31px; height: 31px; display: block; overflow: hidden; text-indent: -99999em; } /* =navigate -------------------------------------------------------------- */ #navigate { font-size: 1.4em; display: none; /*font-weight: bold; color: #e1e1e1;*/ } #navigate h1 { text-transform: uppercase; position: relative; padding: 4px 10px 5px 10px; } .pageslide-close { display: block; position: absolute; top: 5px; right: 10px; padding-right: 30px; font-size: .7857em; line-height: 22px; font-weight: normal; } /*=search -------------------------------------------------------------- */ #search { margin-bottom: 15px; } #search label { display: none; } #searchform { overflow: hidden; padding: 15px 10px; } #searchform div { float: left; display: inline; } #searchform div.submitMe { float: right; display: inline; } #searchform button { /* text-transform: uppercase; padding: 0; margin: 0; font-size: 12px; padding: 0 5px;*/ margin: 5px 0; position: relative; } #searchform #s { width: 208px; border: 1px solid #ECECEC; font-size: 16px; } /*=nav -------------------------------------------------------------- */ .nav { padding: 0 18px 15px 18px; margin-bottom: 15px; } .nav li { line-height: 2.2; font-size: 16px; } .nav li a, .nav li ul { padding-left: 12px; } .nav li a:link, .nav li a:visited, .nav li a:active { color: #0263ED; } .nav li a:hover, .nav li a:focus { color: #949494; } .nav .current-cat a:link, .nav .current-cat a:visited, .nav .current-cat a:hover, .nav .current-cat a:active, .nav .current_page_item a:link, .nav .current_page_item a:visited, .nav .current_page_item a:hover, .nav .current_page_item a:active { color: #949494; } /*=breadcrumbs -------------------------------------------------------------- */ .path { padding: 15px 10px; line-height: 2.2; overflow: hidden; } .path a, .path span { /*white-space: nowrap;*/ } .path span { /*display: block;*/ } /*=widgets -------------------------------------------------------------- */ /*=flickr -------------------------------------------------------------- */ #flickr { padding-bottom: 12px; overflow: hidden; } #flickr a { width: 75px; height: 75px; margin: 0 10px 10px 10px; float: left; display: inline; } /*=tagcloud -------------------------------------------------------------- */ #tagcloud p { padding-left: 10px; padding-right: 10px; } /*=wp-calendar -------------------------------------------------------------- */ #wp-calendar { width: 300px; } #wp-calendar a { display: block; } #wp-calendar th, #wp-calendar td { text-align: center; valign: center; font-size: 1.35em; line-height: 2.4; } #wp-calendar caption { font-size: 1.12em; text-transform: uppercase; padding-bottom: 5px; text-align: left; }