/* Theme Name: BlogSite Cappuccino Theme URI: http://photographyblogsites.com Description: Cappucino BlogSite Version from PhotographyBlogSites.com. Version: 1.0 Author: PhotographyBlogSites Author URI: http://photographyblogsites.com Template: BlogSite */ /* 1) RESET some things for a good starting point - based on yahoo reset */ @import "style/css/reset.css"; /* 2) Bring in all basic style from default theme, but cleaned up and simplified */ @import "style/css/default.css"; img.related_photo {border:none} /* 3) Add our own style on top of it all */ .updated { display: none; } .fade { display: none; } /* BASIC FONTS */ body { color: #838486; text-align: left; font-size: 12px; font-family: Palatino,helvetica,arial,sans-serif; } h1, h2, h3, h4, h5, h6 { font-weight: normal; clear:both; margin:10px 0 6px; } h1, h2 { font-size:26px;text-transform:uppercase;} .entry h2 { font-size:20px; } h1 { text-transform:uppercase; font-family:CodeLightRegular,"Century Gothic", Helvetica, sans-serif;display: block;font-size: 62px; line-height: 1em; margin: 25px 0px 10px; overflow: hidden; text-align: left;} h1, h1 a, h1 a:visited, h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited { } h2.pagetitle { font-size:18px; margin: 38px 2px 0px; text-align:right; } #sidebar h2 { font-size:18px; text-transform: uppercase; border-bottom:1px solid #BABABA; } p { margin: 0 0 10px; } /* LINKS */ a { color: #000000; text-decoration: none; } a:hover { color: #000000; text-decoration: none; } /* PAGE WIDTH */ #page,#header, #banner { width: 1000px; margin: 0 auto; } /* BACKGROUND IMAGES ***********************************/ /* images commented out to prevent 404 errors */ body { background: transparent; } #bg-page-shadow { background: transparent; } #page-top { background: transparent; height:0;} #page-bottom { background: transparent; height:0;} #page { background: #ffffff; } #header { background: transparent; } #content { background: transparent; } #sidebar { background: transparent; } #footer { background: transparent; } #banner { background: #ffffff; } /* STRUCTURE ********************************************/ #content, #footer { overflow: hidden; } body { margin: 0; padding: 5px 0; } #page { margin: 0px auto 50px; padding: 0; text-align: left; z-index: 997; clear: both; overflow: hidden;} #header { padding: 0; z-index: 1003; display: block; position: relative; } #content { font-size: 1.2em; padding:0; margin: 15px; clear:both; min-height: 400px; clear: both; overflow: hidden; } #footer { clear: both; } .section { clear: both; overflow: hidden; } /* alternate page layouts */ /* HEADER AREA */ #logo-and-social { display: inline; float: right; position: relative; width: 280px; margin: 0 0 6px; } #just-logo { margin: 2px 0px 0px 0px;} #logo-wrapper { text-align: left; background: transparent; overflow:hidden; clear:both; } #just-logo img { margin: 0 auto; } #logo-wrapper .logo { } #logo-wrapper h1 { bottom:109px; font-size:32px; line-height: 1.2em; width:100%; text-align: left; margin: 0; } #logo-wrapper p { font-size:15px; width: 100%; text-align: left; margin: 2px 0px 0px;} #menu-and-intro { clear: both; overflow: hidden; } #wide-logo { clear:both; overflow:hidden; width:100%; text-align: center; } #wide-logo img { margin: 0 auto; display: block; padding: 0; border: 0px; } #title-background { margin: 0 0 10px 15px; } ul#social-wrapper.sf-menu li:hover ul, ul#social-wrapper.sf-menu li.sfHover ul { right: -10px; top: 1.9em; z-index: 99; font-size: 14px; letter-spacing: 1px; text-align: right; left: auto; } ul.sf-menu li:hover ul, ul.sf-menu li.sfHover ul { left: 1em; top: 1.9em; z-index: 99; font-size: 14px; letter-spacing: 1px; left: auto; } #latest-blog-wrapper { overflow: hidden; margin: 5px; } #latest-blog-intro { margin: 10px 0 0 14px; float: left; width: 310px; text-align: right; font-size: 16px;} #latest-blog { float: right; display: inline; font-size: 16px; margin: 0 0 0; padding: 8px 0; width: 645px; } #latest-blog div.latest-blog { float: right; display: inline; margin:0 0 0 20px; width:100%; } #latest-blog p { margin: 0; padding:0; text-align: left; } #latest-blog p a { font-size: .9em; float: right; margin: 0 15px; } #latest-blog h2 { font-size: 2em; color: #000000; margin: 0; padding: 0; text-transform: uppercase; } .top-menu { z-index: 999; } #latest-twitter ul.twitterList li a { font-weight:normal; text-decoration:none; } #banner { clear:both; margin: 0 auto 5px; } #banner img { width:100%; display: block; } #banner #slideshow-wrapper { border-bottom:1px solid #666666; border-top:1px solid #666666;padding:1px 0; } #home-panels { margin: 0 0 0 5px; } #home-welcome { margin: 0 5px; width: 385px; } .home-page-section { margin: 5px 0; } #home-slideshow.home-page-section { margin: 0; } /* */ /* END HEADER AREA */ .slideshow { display: block; height: 100%; } #slideshow-wrapper { display: block; clear: both; margin:0px auto; overflow: hidden; z-index:3; } #slideshow-wrapper img { width: 100%; display: block; z-index: 2; height: 100%; } #topMenu { z-index: 997; font-size:14px; letter-spacing:1.8px; display:block; margin: 4px 0; float: left; background: #fff; width: 100%; } /* Keep z-index high to prevent issues with drop down menu */ #topMenu ul { text-transform:uppercase; letter-spacing:-1px; float: left;} #topMenu ul li { float: left; display: inline; margin:0px;} #topMenu ul li a { padding:.5em 12px; letter-spacing: 1px; } #topMenu ul li.smaller a { padding-left: 0px; } #topMenu ul li.smaller { margin-left: 15px; } #topMenu ul ul { min-width: 100%; } #topMenu ul li li a { padding:.3em 11px; } #topMenu ul li li { min-width: 100%; } #topMenu ul li a:hover, #topMenu ul li.current_page_item a { color: #BBBDBF; text-decoration: none; } #topMenu ul li li a { white-space: pre; } /* EASY FANCY STYLES *************************************/ .right { float: right; display: inline; } .left { float: left; display: inline; } .clear { clear: both; overflow:hidden; } .round3 { -moz-border-radius:3px; -webkit-border-radius:3px; } .round5 { -moz-border-radius:5px; -webkit-border-radius:5px; } .round10 { -moz-border-radius:10px; -webkit-border-radius:10px; } /* SPECIFIC TO PHOTOBLOGSTARTER ********************************/ .titleBlock {} #searchBox { width: 188px; float: right; display: inline; margin:6px 0 0; } /* holds search form */ /* WORDPRESS STYLES ****************************************/ /* IMAGES - NEEDED FOR ALIGNMENTS TO WORK CORRECTLY */ img.alignright { float:right; margin:0 0 10px 10px; } img.alignleft { float:left; margin:0 10px 10px 0; } img.aligncenter { display: block; margin-left: auto; margin-right: auto; max-width:100%; clear:both; } a img.alignright { float:right; margin:0 0 10px 10px; } a img.alignleft { float:left; margin:0 10px 10px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; } p img { margin:0 auto; } p img.alignnone { margin: 0 auto; } /* SIDEBAR */ #sidebar ul { margin:15px 25px 10px 30px;text-align: right; } #sidebar ul ul { margin:0px 0 20px 10px; } #sidebar ul li { margin-bottom:2px; list-style-type: none;} #sidebar ul li li { font-size:14px; text-transform:uppercase; } #sidebar ul li li li {} #sidebar ul li a:hover { text-decoration: underline; } .sidebar ul ul, .sidebar ul ol { margin:5px 0 0 5px; } .sidebar ul ul ul.children { margin:0 0 10px 4px; padding:0 6px; } .sidebar ul ul li, .sidebar ul ol li { } .sidebar ul ul ul.children li { } .sidebar #searchform #s { } .sidebar #searchsubmit { } .sidebar h2 { } .sidebar h3 { } /* POSTS / The LOOP */ #topMenu ul#social-wrapper { float: right; } #topMenu ul#social-wrapper ul li { display: block; clear: both; } #topMenu ul#social-wrapper.sf-menu li li a { text-transform: uppercase; } div.post { overflow:hidden; } div.page { margin: 0 30px 0; } .content_left div.page { display:inline; float:left; overflow:hidden; margin: 0 30px 0; width: 538px;} .content_right div.page { display: inline; float: right; overflow: hidden; margin: 0 30px 0; width: 538px; } .post-thumbnail { display:inline; float:right; overflow:hidden; width:340px;margin:15px; } .content_right .post-thumbnail { display:inline; float:left; } body.page #content { } .entry { display:block; overflow:hidden; padding: 20px 0px; } #content div.entry { padding: 0 0 20px; } .thumbnail-bg { display: block; width: 100%; overflow: hidden; } .post-thumbnail img { border: none; display: block; margin: 0px auto 0; float: none; padding: 0px;width: 100%; } .page-blurb { float: right; clear: both; margin: 20px 0 10px; text-align: center; width: 100%;} .before-posts { display: block; margin: 36px 30px 20px 0; overflow: hidden; } .before-posts h2 { clear: none; display: inline; float: left; font-size: 36px; margin: 0px; line-height: 1.1em; } span.date { display: block; clear: both; font-size:14px; font-weight:normal;margin: 0px 15px 0px 0px;padding:0; text-transform:lowercase; line-height: 1em; } span.date a { margin:0 0 0 15px;} h2.pagetitle span.date { float: none; margin: 10px 0 0; clear: none; display: inline; font-size: .8em; text-transform: uppercase; } .postmetadata { width: 100%; float: left; clear: both; } .postmetadata { text-align: left; clear:both; margin:10px 10px 20px 0;font-size: .8em; } .navigation { clear:both; display:block; height:40px; margin:10px 0; width:100%; } .postmetadata a { } .wp-caption { } .post .wp-caption img {} .navigation { clear:both; height:40px; margin:10px 39px;} .entry ul { text-indent: 0; } a.post-edit-link { border:1px solid #BDBDBD; color:#7A7A7A; float:right; font-size:11px; padding:1px 4px; } .between_posts {margin: 10px auto; float: none; clear: both; display: block; } /* FORMS */ .entry form { text-align:left; } form#searchform { float: left; margin: 0px; padding: 2px 2px 2px 6px; text-align: left; width: 257px; } #blog-menu form#searchform { float:right; } input#searchsubmit { font-size:17px;background: transparent; border:0 none; cursor: pointer;float:right; padding: 8px 10px 0; } input#s { border: 1px solid #C5C5C5; padding: 3px 6px; width: 140px; margin: 3px 0 0; font-size: 13px; } #sidebar form#searchform { float:left; margin:2px 0 20px; padding:0; text-align:left; width:205px; } #sidebar #searchform input#s { font-size:12px; padding:2px; width: 175px; float: right; margin-left: 19px;} #sidebar input#searchsubmit { clear: both; padding:11px 0 0 0; text-align:left; font-size:16px; float: right; } #sidebar #searchform #s { font-size:12px; padding:2px; width:97px; } div.more-link { text-align: right; } .textwidget a img { margin: 4px 0; } .textwidget a:hover img { } .textwidget a { } .textwidget a:hover { } /* EXTRAS for Standard Plugins */ div.breadcrumb { margin: 10px 0 0 40px; } div.breadcrumb a { font-size:1.1em; letter-spacing:1.2px; } div.more-link { text-align: right; } div.sociable { clear:both; } /*** END WORDPRESS STYLES ***************************************/ /*** SUPERFISH STYLES ******************************************* / / Keep z-index of #topMenu high to prevent issues with drop down menu / If drop downs are getting stuck behind other elements on the page, the z-index needs to be higher / If you move dropdowns to another element, make sure that element has a high z-index value / */ /*** SUPERFISH - EDIT COLORS ***/ .sf-menu a { padding:11px 18px; text-decoration:none; } .sf-menu a, .sf-menu a:visited { } .sf-menu li { background: transparent; } .sf-menu li li { background: #fff; display:block; float:none;} .sf-menu li li li { background: #fff; } .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { background: transparent; outline: 0; } .sf-menu li.sfHover a { } .sf-menu a:hover { } .sf-menu a /*** SUPERFISH - SHOULDN'T NEED TO TOUCH ***/ .sf-menu { float: left; margin-bottom: 1em; z-index: 1001;} .sf-menu li { z-index: 1002; } .sf-menu li ul { z-index: 1003; } .sf-menu, .sf-menu * { margin: 0; padding: 0; list-style: none; } .sf-menu { line-height: 1.0; } #links.sf-menu { float:right; } .sf-menu ul { position: absolute; top: -999em; } /* left offset of submenus need to match (see below) */ .sf-menu ul li { width: auto; } .sf-menu li:hover { visibility: inherit; } /* fixes IE7 'sticky bug' */ .sf-menu li { float: left; position: relative; } .sf-menu a { display: block; position: relative; white-space:normal; } .sf-menu li ul li { } .sf-menu li a { text-transform: uppercase; } .sf-menu li li a { text-transform: capitalize; } .sf-menu li:hover ul, .sf-menu li.sfHover ul { left: 0; top: 1.8em; z-index: 99; font-size: 14px; letter-spacing: 1px; } /* top value used to match top ul list item height */ ul#links.sf-menu li:hover ul, ul#links.sf-menu li.sfHover ul { right: -10px; top: 36px; z-index: 99; font-size: 14px; letter-spacing: 1px; text-align: right; left: auto; } /* top value used to match top ul list item height */ #topMenu .sf-menu li.linkcat ul { right: 0; left: auto; } ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; } ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 10em; top: 0; } /* left value used to match ul width */ ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; } ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 10em; /* match ul width */ top: 0; } /*** SUPERFISH - arrows ***/ .sf-menu a.sf-with-ul { } /* trigger IE7 hasLayout so spans position accurately */ .sf-sub-indicator { display: none; } a > .sf-sub-indicator { /* give all except IE6 the correct values */ top: .8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ } /*** SUPERFISH - apply hovers to modern browsers ***/ a:focus > .sf-sub-indicator, a:hover > .sf-sub-indicator, a:active > .sf-sub-indicator, li:hover > a > .sf-sub-indicator, li.sfHover > a > .sf-sub-indicator { } /* arrow hovers for modern browsers*/ /*** SUPERFISH - point right for anchors in subs ***/ .sf-menu ul .sf-sub-indicator { } .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; } /*** SUPERFISH - apply hovers to modern browsers ***/ .sf-menu ul a:focus > .sf-sub-indicator, .sf-menu ul a:hover > .sf-sub-indicator, .sf-menu ul a:active > .sf-sub-indicator, .sf-menu ul li:hover > a > .sf-sub-indicator, .sf-menu ul li.sfHover > a > .sf-sub-indicator { /* arrow hovers for modern browsers*/ } /*** SUPERFISH - shadows for all but IE6 ***/ .sf-shadow ul { background:transparent; padding: 0; } .sf-shadow ul.sf-shadow-off { background: transparent; } /* Exrtas ******************************/ div.sociable { float:right; margin:16px 0 0; padding:1px 10px; } div.sociable ul { float: left; display: inline; } div.sociable li { float: left; display: inline; margin:3px 4px 0 0; opacity:0.6; width:20px; } .sociable_tagline { float: left; display: inline; } /* COMMENTS */ .commentsSection {} #respond { clear:both;} form#commentform {} ol.commentlist { margin: 8px 0 0; } ol.commentlist li { margin:8px 0; padding:6px 6px 6px 12px; font-size:1em; font-weight: normal; } .commentlist li, #commentform input, #commentform textarea { font-size: 1em; } #commentform textarea { padding:2px; width:100%; } #commentform input { } .commentlist li .avatar { float:left; padding:2px 10px 2px 0px; } .commentlist li div.avatar { width: 40px; height: 40px; } .commentlist li h5 { display: inline; } #commentform #submit { background:transparent none repeat scroll 0 0; border:1px solid #5A5A5A; width: auto; } /* Forms ******************************/ #content wpcf7 { display:block; overflow:hidden; padding:2px;} .entry .wpcf7 form { margin:0 auto 25px; overflow:hidden; text-align:center; width:332px;float:left; } .entry .wpcf7 form br { display: none; } .wpcf7 { float:left; margin:10px; padding:10px; width:100%; } .commentsWrapper { float:left; margin:10px; padding:10px; } .wpcf7 form {} .wpcf7 form p { text-align:left;clear:both; display:inline; float:left; line-height:1.8em; margin:0; padding:0; text-transform:uppercase; } .wpcf7 p.input { clear:right; display:inline; float:right; margin:21px 0 0; width:338px; } .wpcf7 p.submit { float: right; clear: both; } input { border: 1px solid #9a9a9a; font-size: 1em; } input[type="text"] { width: 322px; padding: 2px; font-size: 1em; } input[type="submit"] { padding: 4px 5px; text-transform: uppercase; font-size: 1em; font-family: "Century Gothic", Helvetica, Arial, Sans-Serif; background: transparent;} .wpcf7 img.ajax-loader { display: none;} .wpcf7 textarea { width: 325px; } /* CONTACT & COPYRIGHT *****************/ .copyright-line { clear: both; width: 980px; margin: 20px auto 0; text-align: center; color:#444444;} #vcard { clear:both; color:#333333; display:block; font-size:14px; margin:0 auto; overflow:hidden; width:980px; } #vcard .tel { float: left; display: inline; } #vcard .adr { float: right; display: inline; } #vcard .street-address {} #vcard .locality {} #vcard .region {} #vcard .postal-code {} #vcard .country-name {} ul.footerNav { width: 33%; float: left; display: inline; text-align: center;} p.design { font-size:11px; margin:10px auto 20px; padding:0; text-align:center; color: #8a8a8a; } p.design a { color: #5a5a5a; }