/* Theme Name: Little Photoshop Theme URI: http://www.thelittlephotoshop.co.uk/ Description: Theme for the Little Photoshop Website. Author: Greg McAusland Version: 2.0 */ .alignleft { float: left; margin-right: 5px; } .alignright { float: right; margin-left: 5px; } .clear { clear: both; } .aligncenter { margin: 0 auto; text-align: center; } .group:after { display: block; visibility: hidden; height: 0; font-size: 0; clear: both; content: " ";} * { margin: 0; padding: 0; } input { outline: 0; } img { border: 0; } li { list-style: none; } a { text-decoration: none; color:#4e6775; } /* a:active { position: relative; top: 1px; } */ /* Main */ body { background: #dedede url(images/bg.png) repeat-x; font-family: "Trebuchet MS", "Myriad Pro", Verdana, Arial; color: #000; } #page-wrap { margin: 0 auto; width: 960px; } #header { height: 130px; position: relative; } #header h2 { text-indent: -9999px; width: 475px; height: 123px; float: left; background: url(images/logo.png); margin-left: -70px; } #header h2 a { display: block; width: 475px; height: 123px; } /* Nav */ #header ul li a { display: block; text-indent: -9999px; } #header ul { float: right; height: 40px; margin: 50px 0px 0px 0px; margin-right: -15px; } #header ul li { float: left; height: 40px; background-image: url(images/sheet1.png); margin-left: 20px; } #homelink { background-position: 0px -395px; width: 80px; } #homelink a { width:80px; height:40px; } #shoplink { background-position: -110px -395px; width: 165px; } #shoplink a { width:165px; height:40px; } #traininglink { background-position: -295px -395px; width: 110px; } #traininglink a { width:110px; height:40px; } #contactlink { background-position: -425px -395px; width: 103px; } #contactlink a { width:103px; height:40px; } #highlight { position: absolute; font-size: 0px; width: 80px; height: 5px; top: 0px; left:460px; background: #e78221;} #store #highlight { left:555px; width:165px; } #training #highlight { left:740px; width:110px; } #contact #highlight { left:870px; width:103px; } /* Blog Column */ #blog { float: left; width: 690px; margin-top: -5px; background:url(images/blogbg.png) repeat-y; margin-bottom: 25px; } .post { padding: 25px; padding-left: 230px; min-height: 180px; border-bottom: 1px solid #dedede; position: relative; } .post h1 { font-size: 1.3em; margin-bottom: 10px; color: #4E6775; } .post h1 a { color: #4E6775; } .post .thumbimg { position: absolute; left: 25px; top:30px; border: none;} .post p a { color: #4E6775; background: #eee; padding: 4px; } .post p a:hover { color: black; background: #dde; } .extended { padding: 25px; padding-top: 40px; background: url(images/shadow_bottom.png) no-repeat 0px 0px; } .post h2, .extended h2 { font-size: 1.4em; margin-bottom: 10px; color: #1C2831; } .post h3 { font-weight: normal; } .post h3, .extended most-popuar { font-size: 1.1em; margin-bottom: 10px; color: #1C2831; } .post p, .extended p { font-size: 0.7em; color: #555; padding-bottom: 15px; line-height: 1.7em; font-family: verdana; } .extended p a { color: #449; } .extended p a:hover { color: black; border-bottom: 1px dotted #999; } #blog .single { padding-left: 25px; background: none; padding-top: 15px; border: none; } .noborder { border: none; } /* Related Posts */ .related-posts-list { } .related-posts-list li { padding: 5px 0px 5px 20px; font-size: 0.8em; background: url(images/arrow_state_grey_right.png) no-repeat 0px 6px; } .related-posts-list li a:hover { color: #000; } .related-posts-list li span { float: right; color: #aaa; font-size: 0.9em;} .related-posts-header { clear: both; padding: 40px 25px 10px 25px; background: url(images/shadow_bottom.png) no-repeat 0px 0px; margin-left: -25px; width: 640px; font-size: 1.4em; color: #1C2831; font-weight: normal; } /* Full Page Override */ #blog.blogfull { width: 950px; background: #fff; url(images/blogbg_full.png); } .full { padding: 25px; min-height: 580px; background: none; } #breadcrumb { padding: 10px 25px; background: #eee; width: 635px; height: 1.3em; } #breadcrumb p { font-size: 0.8em; color: #667; text-transform: uppercase; line-height: 1.6em; } #breadcrumb p a { font-size: 0.8em; color: #779; } #breadcrumb p a:hover { color: #000; } .mailicon { display: block; background: url(images/mail.png) no-repeat right 3px; padding-right: 25px; line-height:23px;} #blog-cap { height: 5px; background: url(images/shadow_bottom.png); font-size: 0px; } span.date { display: block; font-size: 12px; margin-bottom: 25px; color: #aaa; } span.date a { color: #4E6775; background: #eee; padding: 4px; } span.date a:hover { color: black; background: #dde; } #share { padding: 25px; padding-top: 40px; background: url(images/shadow_bottom.png) no-repeat 0px 0px; height: 65px; position: relative; } #share p { width: 235px; font-size: 0.7em; font-family: verdana; float: left; } #share p a { font-weight: bold; text-decoration: underline; } #share #icons { float: right; } #share #icons li { float: left; display: block; } #delicious, #digg, #fbook, #stumble { width: 61px; height: 59px; margin-right: 15px; text-indent: -9999px;} #delicious a, #digg a, #fbook a, #stumble a { width: 61px; height: 59px; display: block; background-image: url(images/sheet1.png); } #delicious a { background-position: -1px -317px; } #digg a { background-position: -62px -317px; } #fbook a { background-position: -123px -317px; } #stumble a { background-position: -184px -317px; } /* Comments */ #comments { padding: 25px; padding-top: 40px; background: url(images/shadow_bottom.png) no-repeat 0px 0px; } #comments h2 { font-size: 1.3em; font-weight: normal; color: #1c2831; margin-bottom: 25px; } .comment-content { float: right; width: 550px; position: relative; } .comment-content h4 { font-weight: normal; font-size: 1.1em; margin-bottom: 5px; } .comment-content p { font-size: 0.7em; font-family: verdana; color: #444; margin-bottom: 15px; line-height: 1.6em; } .comment-content p a { color: #4E6775; background: #eee; padding: 4px; } .comment-content p a:hover { color: black; background: #dde; } .avatar { float: left; width: 64px; } #comments ol li { margin-bottom: 25px; padding-bottom: 10px; border-bottom: 1px dotted #bbb; min-height: 79px; } #commentform textarea { width: 615px; height: 180px; border: 1px solid #ddd; background: #eee; margin-bottom: 25px; padding: 10px; } #commentform label { display: block; margin-bottom: -1.6em; color: #777; } #commentform p { margin-bottom: 30px; font-size: 0.7em; line-height: 1.6em; color: #777;} #commentform p.login { font-size: 0.8em; } #commentform p input { border: 1px solid #ddd; background: #eee; width: 355px; padding: 10px; display: block; } #commentform input.submit { display:block; height: 35px; width: 125px; background: #4e6775; color: #fff; border: #6e8795; } .editcomment { position: absolute; background: #eee; top: 0; right: 10%; padding: 10px 0px; border: 1px dotted #ccc; left: 10%; text-align: center; } .editcomment a { font-size: 0.7em; color: #e27e31; } /* Contact Form */ #loadingbar { font-size: 0em; height: 30px; background: url(images/38-0.gif) no-repeat; } #theform p { font-size: 0.7em; line-height: 1.6em; color: #777; } /* Sidebar */ #sidebar { width: 260px; float: right; margin-top: -7px; } #sidebar h3 { display: block; width: 260px; height: 27px; text-indent: -9999px; clear: both; background-image: url(images/sheet1.png); background-repeat: no-repeat; margin-bottom: 10px; } #sidebar h3.most-pop { background-position: 0 -118px; } #sidebar h3.tagcloud { background-position: 0 -147px; } #sidebar #flickr h3 { background-position: 0 -176px; } #sidebar #twitter h3 { background-position: 0 -203px; } #sidebar h3.lps-poll { background-position: 0 -230px; } #subscribe { width: 90px; height: 43px; background: url(images/sheet1.png) no-repeat 0px 0px; margin-bottom: 20px; padding-left: 160px; } #subscribe a { display: block; float: left; width: 45px; height: 30px; text-indent: -9999px; margin-top:10px; } #cartlogin { width: 242px; height: 59px; background: url(images/sheet1.png) no-repeat -301px -114px; margin-bottom: 8px; margin-top: -13px; padding-top: 20px; } #cartlogin a { text-indent: -9999px; display: block; height: 35px;} #adblock p { background: #eee; height: 123px; width: 123px; line-height: 125px; text-align: center; font-size: 0.7em; float: left; color: #999; border: 1px dashed #999; margin-bottom: 10px; } #adblock p.space { margin-right: 10px; } #adblock { padding-bottom: 5px; } #tags { text-align: justify; padding-bottom: 25px; } #tags a:hover { color: black; } /* Sidebar - Flickr */ #flickr { padding-bottom: 25px; } #flickr p { font-size: 0.7em; margin-top: -5px; } #flickrpool { padding-top: 5px; padding-bottom: 5px; } #flickrpool li { float: left; } /* Sidebar - Twitter */ #tweets { padding-top: 5px; padding-bottom: 7px; border-bottom: 1px dotted #999; margin-bottom: 7px; } .tweet { padding-left: 60px; padding-bottom: 10px; min-height: 45px; } .tweet h4 { font-size: 0.8em; color: #999; font-weight: normal; } .tweet p { font-size: 0.7em; } #twitter { padding-bottom: 25px; } #twitter p { font-size: 0.7em; } /* Sidebar - Search */ #search { padding-bottom: 15px; } #search:after { content: " "; clear: both; visibility: hidden; display: block; font-size: 0; height: 0; } #search input[type="text"] { width: 210px; border: 0px; background: url(images/searchbox_text.png) no-repeat; height: 20px; padding-top: 6px; padding-left: 12px; outline: none; font-size: 11px; color: #999; } #search input { float: left; } #flickrpool li { margin-right: 8px; margin-bottom: 10px; padding: 3px; background: #EEE;} #flickrpool li.endrow { margin-right: 0px; } /* Sidebar - Most Popular */ #most-popular li { font-size: 0.7em; padding: 5px 0px 5px 25px; background: url(images/arrow_state_grey_right.png) no-repeat 0px 5px; } #most-popular { margin-bottom: 25px; } #most-popular a:hover { color: #000; } /* Sidebar - a little poll */ #lps-poll { padding-bottom: 25px; overflow: hidden; } #lps-poll p { font-size: 0.9em; margin-bottom: 15px; font-style: italic; color: #556} #lps-poll ul li { font-size: 0.8em; padding-left: 20px; margin-bottom: 15px; color: #778; } #lps-poll ul li input { margin-left: -20px; } #lps-poll a { display: block; width: 164px; height: 34px; background: url(images/register-vote.png) no-repeat 0 0; text-indent: -9999px; float: right; } #lps-poll a:hover { background: url(images/register-vote.png) no-repeat 0 -34px; } #lps-poll a:active { background: url(images/register-vote.png) no-repeat 0 -68px; } #poll-loading { height: 16px; width: 16px; background: url(images/6-1.gif) no-repeat; float: right; margin-top: -30px; display: none; } /* Footer */ #link-bar { height: 80px; } #paging-new, #paging-old { width: 110px; height: 53px; text-indent: -9999px; float: left; margin-top: 15px; margin-right: 40px; } #paging-new a { display: block; background: url(images/sheet1.png) no-repeat -231px -263px; width: 110px; height: 53px; } #paging-old a { display: block; background: url(images/sheet1.png) no-repeat -120px -263px; width: 110px; height: 53px; } #back-to-top { display: block; width: 100px; height: 53px; text-indent: -9999px; margin-top: 13px; background-image: url(images/sheet1.png); float: right; } #footer { min-height: 91px; background: #2e4553 url(images/footerbg.png) repeat-x; } #footer-content { margin: 0 auto; width: 960px; } #footer ul { padding-top: 45px; padding-bottom: 35px; float: right; width: 160px; text-align: right; } #footer ul li { list-style: none; color: #fff; } #footer ul li a { font-size: 0.7em; color: #6eA5B3; text-transform: uppercase; } #footer ul li a:hover { color: #fff; } #footer ul li.list-header { font-size: 1.5em; padding-bottom: 25px; color: #fff; list-style: none; margin-left: 0px; font-weight: bold; } #about { float: left; width: 310px; padding-top: 45px; height: 350px; } #about p { color: #aeF5F3; font-size: 0.8em; line-height: 1.7em;} #about p a { color: #6eA5B3; } #about p a:hover { color: #fff; } #about h2 { font-size: 1.4em; padding-bottom: 25px; color: #fff; } #back-to-top { display: block; width: 100px; height: 53px; text-indent: -9999px; margin-top: 13px; background-image: url(images/sheet1.png); float: right; background-position: 0px -263px; } /* Products */ #product-intro { padding-left: 205px; min-height: 250px; padding-bottom: 20px; } #product-intro h1 { margin-bottom: 25px; } p.price { font-size: 1.4em; font-weight: bold; font-family: "Myriad Pro", "Lucida Grande", Helvetica; color: #384b55; } #buy-dollar, #buy-pound, #buy-euro { display: block; float: left; width: 120px; height: 40px; background-image: url(images/sheet1.png); text-indent: -9999px; } #buy-dollar { background-position: 0px -43px; margin-right: 25px;} #buy-pound { background-position: -123px -43px; margin-right: 25px;} #buy-euro { background-position: -246px -43px; } .testimonial { padding-left: 10px; border-left: 2px solid #ccc; margin-bottom: 25px; } .testimonial p { font-style: italic; } .testimonial h2 { color: #000; font-size: 1.2em; font-weight: bold; } #product-screenshots { padding-bottom: 15px; } #product-screenshots a { float: left; margin-right: 55px; margin-bottom: 25px; } #tabs { background: url(images/tabs_bg.png) repeat-x; height: 32px; padding: 9px 25px 0px 10px; margin: 0px -20px 25px -25px; } #tabs li { float: left; line-height: 32px; font-size: 0.8em; width: 120px; border-right: 1px solid #ddd; } #tabs li a { display: block; color: #777; padding: 0px 15px; height: 32px; text-align: center;} #tabs li a:hover { color: #000; } #tabs li.selected { height: 43px; line-height: 43px; margin-top: -11px; background: url(images/tab_selected.png) no-repeat 0px 0px; border-right: none; } #tabs li.selected a { height: 40px; padding-top: 3px; padding-left: 0px; margin-left: 15px; background: url(images/tab_selected.png) no-repeat right 0px; color: #000; } .tab-content { margin-bottom: -15px; } /* Product Index */ .product-short { float: left; margin: 0px 0px 15px 0px; padding: 10px 0px; width: 211px; text-align: center; padding-top: 260px; position: relative; } .product-short h2 { font-weight: normal; font-size: 1.0em;} .product-short p { font-size: 0.7em; } .product-short a.learn { position: absolute; font-weight: bold; font-size: 0.8em; top: 0px; left: 0px; display: block; width: 211px; padding-top: 310px; text-indent: -9999px; } /* Courses */ .course { width: 180px; float: left; margin-bottom: 15px; margin-right: 45px; } .course h2 { font-size: 1.2em; } .course a { display: block; padding-top: 190px; } .course p a { display: inline; padding-top: 0px; } /* Members */ #logincontainer { width: 483px; padding-top: 50px; margin: 0 auto;} #logincontainer h2 { background: url(images/members-logo.png) no-repeat; width: 483px; height: 69px; text-indent: -9999px; margin-bottom: 25px; } #logincontainer label[for="user_login"], #logincontainer label[for="user_pass"] { font-size: 1.8em; color: #000; } #logincontainer input[type="text"], #logincontainer input[type="password"] { width: 483px; padding: 9px; font-size: 1.0em; margin-top: 10px; color: #445; background: #e8eaeb; border: 1px solid #c0c4c7; } #logincontainer input[type="submit"] { padding: 10px 20px; background: #1f2e37; border: none; color: #fff; font-size: 1.2em; } #logincontainer ul li { font-size: 0.8em; float: left; padding-right: 15px;} #logincontainer ul { float: left; } #plus-download { min-height: 90px; padding-bottom: 25px; border-top: 1px dotted #ddd; padding-top: 25px; padding-right: 200px; position: relative; } #plus-download.thumbed { padding-left: 115px; position: relative; } #plus-download.thumbed img.postimg { position: absolute; left: 0px; top: 25px; } #plus-download.fullwidth { padding-right: 0px;} #plus-download h3 { margin-bottom: 0px; padding-bottom: 0px; } #plus-download span { position: absolute; right: 0px; top: 25px; display: block; } #member-menu { background: #eee; height: 60px; } #member-menu li { float: left; width: 33.3%; height: 60px; line-height: 60px; text-align: center; } #member-menu li a { display: block; height: 60px; line-height: 60px; text-align: center; font-size: 0.8em; border: 1px solid #ddd; margin: -1px; border-right-color: #eee; } #member-menu li a:hover { border: 1px solid #ccc; background: #ddd; border-right-color: #ddd; } #member-menu li a span { padding: 5px 0px 5px 40px; } #plus #member-menu li a.screencasts, #plus #member-menu li a.screencasts:hover, #training #member-menu li a.training, #training #member-menu li a.training:hover, #actions #member-menu li a.actions, #actions #member-menu li a.actions:hover, #screencasts #member-menu li a.screencasts, #screencasts #member-menu li a.screencasts:hover, #behind-the-scenes #member-menu li a.behindthescenes, #behind-the-scenes #member-menu li a.behindthescenes:hover { background: #fff; border: 1px solid #fff; } #member-menu li a span.training { background: url(images/sheet1.png) no-repeat -570px 3px; } #member-menu li a span.actions { background: url(images/sheet1.png) no-repeat -570px -30px; } #member-menu li a span.screencasts { background: url(images/sheet1.png) no-repeat -570px -61px; } #member-menu li a span.behind { background: url(images/sheet1.png) no-repeat -570px -119px; } #member-menu li a span.logout { background: url(images/sheet1.png) no-repeat -570px -89px; } .category-small { color: #aaa; font-size: 11px; position: absolute; top: 25px; right: 0px; } .dl-links { height: 48px; } .dl-links a { float: left; } #registerform { position: relative; } #loading, #username-not-available, #username-available { position: absolute; right: 0px; top: 37px; font-size: 0.7em; color: #666; line-height: 17px;} #username-available { padding-left: 20px; background: url(images/tick.png) no-repeat; } #username-not-available { padding-left: 20px; background: url(images/cross.png) no-repeat; } /* Buttons */ p a.members-read, p a.members-view, p a.members-download { display: block; width: 164px; height: 48px; text-indent: -9999px; background: url(images/plus-buttonsheet.png) no-repeat 0 0; padding: 0px; } p a.members-view { background: url(images/plus-buttonsheet.png) no-repeat -164px 0; padding: 0px; } p a.members-read { background: url(images/plus-buttonsheet.png) no-repeat -328px 0; padding: 0px; } p a.members-download:hover { background: url(images/plus-buttonsheet.png) no-repeat 0 -48px; } p a.members-view:hover { background: url(images/plus-buttonsheet.png) no-repeat -164px -48px; padding: 0px; } p a.members-read:hover { background: url(images/plus-buttonsheet.png) no-repeat -328px -48px; padding: 0px; } p a.members-download:active { background: url(images/plus-buttonsheet.png) no-repeat 0 -96px; } p a.members-view:active { background: url(images/plus-buttonsheet.png) no-repeat -164px -96px; padding: 0px; } p a.members-read:active { background: url(images/plus-buttonsheet.png) no-repeat -328px -96px; padding: 0px; } iframe { overflow: auto; overflow-x: hidden; overflow-y: hidden; }