/* Theme Name: MyDesignerGuy Theme Theme URI: http://www.mydesignerguy.com Version: 1.7 Author: Andrew Rogers Author URI: http://www.mydesignerguy.com */ /************************************************************************/ /******************* MyDesignerGuy StyleSheet *****************************/ /************************************************************************/ /* 00. General Settings 01. Headings & Colours 02. Header 03. Home Blog Posts Settings 04. Content, Home Sidebar 05. Footer 06. General Sidebar 07. Post General Settings Additional: Common Classes --------------------------------------------- Author: Andrew Rogers - www.MyDesignerGuy.com */ /************************************************************************/ /************************************************************************/ /*** 00. General Settings ***/ /** Change bg color here after bg image**/ body {font: 82.5% "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial; background:url('http://mydesignerguy.com/wp-content/themes/MyDesignerGuy/images/backgrounds/bg-15.jpg') #d6d6d6 top center no-repeat;} body, html {height:100%} a {cursor: pointer;} /** common classes **/ .clearfix {width: 100%; height: 0px; clear: both; display: block;}/* clearfix for floated elements */ .hidden {display: none;} .right {float: right;} .left {float: left;} .alignright {float: right;} .alignleft {float: left;} .morespace {padding: 3px 0 !important;} .full-width {width: 100% !important;} a.bt, a.bt span, a.more-link, a.more-link span {display: inline-block; height:22px; border:none !important;} a.bt, a.more-link {padding-left: 15px; background: url(images/bt-casual-left.png) no-repeat; color:#333 !important; margin-top: 5px; text-decoration: none;} a.bt:hover {color: #666 !important;} a.bt span, a.more-link span { background: url(images/bt-casual-right.png) no-repeat right; padding-right: 15px; line-height:20px} a.arrowedbt {background: url(images/bt-casual-left-arrowed.png) no-repeat; padding-left: 26px; font-size:1em !important; margin-top: 0px !important; } a.arrowedbt:hover {background: url(images/bt-casual-left-arrowed-hover.png) no-repeat;} a.left-button {background-image: url(images/bt-casual-left-arrowed-left.png) !important} a.left-button:hover {background-image: url(images/bt-casual-left-arrowed-left-hover.png) !important} div.leftbutton, div.rightbutton {margin:0px 0px 20px 0px!important; } div.leftbutton a, div.leftbutton a span, div.rightbutton a, div.rightbutton a span {display: inline-block; height:22px} div.leftbutton a span, div.rightbutton a span {display: inline-block; height:22px; background: url(images/bt-casual-right.png) no-repeat right; padding-right: 15px; line-height:20px} div.leftbutton a, div.rightbutton a {padding-left: 26px; color:#333 !important; margin-top: 5px; text-decoration: none; } div.leftbutton a {background: url(images/bt-casual-left-arrowed-left.png) no-repeat;} div.rightbutton a {background: url(images/bt-casual-left-arrowed.png) no-repeat;} div.leftbutton a:hover, div.rightbutton a:hover {color: #666 !important;} /*** 01.a - Headings change #header h1 for menu adjustment**/ /** logo **/ #header h1 { float: left; margin-right: 0px;} #header h1 a {width: 0px; height: 0px; display:block; text-indent:-9999px} /** home featured section headings **/ #featured-info h3 {font-size: 2em; margin-bottom: 25px;} #featured-info h3 a {color: #fff; text-decoration: none;} /** #content general headings **/ #content h3 {font-size: 1.75em; font-family: "Lucida Grande", Verdana, Helvetica, Arial; } #content h4 {font-size: 1.35em;} #content h5 {font-size: 1.15em;} div.postcontent h4 {font-size:1.25em !important;} /** sidebar headings **/ #sidebar-home h3, h3#blog-title {border-bottom: 1px solid #999; margin-bottom:1px; padding-bottom:5px} #sidebar-home h3 {color: #333;} #sidebar h3 {font-size: 1.3em; border-bottom: 1px solid #999; margin-bottom:1px; padding-bottom:5px; color: #333;} div.home ul li h3 {font-size: 1.3em !important;} /** flickr heading **/ li.flickr h3 {background: url(images/icon-flickr.png) no-repeat 2px 0; padding-left: 38px;} /** post listing general headings **/ #posts h4 {margin-bottom: 8px;} #posts h4 a {color:#333; text-decoration: none; text-transform: uppercase;} #posts h4 a:hover {text-decoration: underline;} .portfolio h4 {font-size: 1.3em !important; line-height:1.4em;} /** twitter heading **/ li#MyDesignerGuy-twitter h3 {padding-left: 28px; background: url(images/icon-twitter.png) no-repeat ;} /** right side wide column headings **/ #wide-column h2 {font-size:1.7em; border-bottom: 1px solid #999; margin-bottom:1px; padding-bottom:5px;} div.the-post h2, div.the-post h3, div.the-post h4, div.the-post h5 {margin-bottom:15px; padding-top:5px; color:#111 !important;} div.the-post h3 {font-size: 1.3em !important;} div.the-post h4 {font-size: 1.15em !important;} div.the-post h5 {font-size: 1em !important;} div#info h3 { border-bottom: 1px solid #aaa; font-size: 1.3em; padding-bottom: 2px; padding-top: 10px; color: #333; } /** Container Settings **/ #container-wrap {width: 100%; height:100%; margin: 0 auto -65px; position:relative; min-height: 100%; height: auto !important; height: 100%;} #container {width: 960px; padding: 20px 5px; margin: 0 auto;} .sub {background:url(images/bg2-container-sub.png) repeat-x 0px 50px} #container .sub {padding-top: 50px;} .push {height:61px;} /*** 02. Header ***/ /** main and footer navigation **/ #header ul, ul#nav-footer {min-width: 400px; max-width: 940px; float:left; padding-top:10px} #header ul li, ul#nav-footer li {float:left; margin-right:10px;} #header ul li a, ul#nav-footer li a {display:block; color: #ccc; text-decoration: none; text-transform: uppercase;padding: 6px 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;} #header ul li a:hover, #header ul li.current-cat a, #header ul li.current_page_item a {color: #fff; background: #111; } #header ul li.current_page_item ul li a {color: #666 !important; background: none !important;} #header ul li {position: relative; } #header ul li ul {position: absolute; margin-top: 0px; background: #fff; -moz-border-radius: 10px;-webkit-border-radius: 10px; -khtml-border-radius: 10px; min-width: 150px; max-width:200px !important; padding: 5px; display:none; z-index:10; } #header ul li ul li {margin: 0; float: none;} #header ul li ul li a {color: #666 !important; text-transform: none; font-size: 0.9em;} #header ul li ul li a, #header ul li ul li a:hover {background-image: none; padding: 5px !important; } #header ul li ul li a:hover, #header ul li ul li.current-cat a:hover { -moz-border-radius: 5px !important;-webkit-border-radius: 5px !important; -khtml-border-radius: 5px !important; background: #333 !important; color: #BAD665 !important; } #header ul li.current-cat ul li a {background: none} #header ul.children li a {background:none !important;} /*#header ul li.current-cat ul li.current-cat a:link {background: none !important;}*/ ul#nav-footer li {margin-right: 5px;} ul#nav-footer li a {color: #666; -moz-border-radius: 10px;-webkit-border-radius: 10px; -khtml-border-radius: 10px; background-image:none;font-size:0.9em} ul#nav-footer li a span {background-image: none !important; line-height:25px} ul#nav-footer li a:hover, ul#nav-footer li.selected a { background: #666; color: #fff;} /** search **/ #header fieldset {float: right; width:207px; padding-top: 10px;} #header fieldset legend {display: none;} #header fieldset label {background: url(images/bg-search.png); padding-left: 38px; height: 27px; display:block} #header fieldset label input {border: none; background: none; padding-top:6px; color:#666; line-height:17px /** <- be careful **/} /*** 03. Home Featured Section ***/ #featured {padding-top: 30px; color:#FFF} #featured-info, #home-featured-nav {float: left;} #featured-images {float: right;} #featured-info { width: 455px; margin-top: 72px;} #featured-info ul li {height: 200px; overflow: hidden;} #featured-info p {margin: 10px 0; color:#ddd} #featured-info p strong {color:#FFF;} a.home-read-more-button {background: url(images/bt-home-readmore.png) no-repeat; width:103px; height: 42px; margin-top: 25px; display:block; text-indent: -9999px; } /** featured images**/ #featured-images {width: 440px; height: 416px; background:url(images/computer.png) no-repeat top center; margin-right:-10px; position:relative; z-index:2;} #images {margin: 42px 0 0 50px;} #images ul li {width: 354px; height: 214px; overflow:hidden;} span.glare {background: url(images/computer-glare.png) no-repeat; display:block; position: absolute; right: 25px; top: 30px; width: 219px; height: 239px; z-index: 9; } /** featured slider navigation **/ ul#home-featured-nav { background: url(images/bg-homeslider.png) no-repeat; width: 33px; height: 48px; margin-left: 35px; margin-top: 127px; padding-top: 12px;} ul#home-featured-nav li {margin-bottom: 5px;} ul#home-featured-nav a {width: 16px; height: 18px; display: block; text-indent: -9999px; margin: auto; filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;} ul#home-featured-nav a:hover {filter:alpha(opacity=0); -moz-opacity:0; -khtml-opacity: 0; opacity: 0;} ul#home-featured-nav li.next a {background: url(images/homeslider-arrow-down.png) no-repeat; margin-left: 10px;} ul#home-featured-nav li.prev a {background: url(images/homeslider-arrow-up.png) no-repeat;} /*** 04. Content ***/ #content {font-size: 0.95em;} #content p {margin: 15px 0; color: #555;} /** 04.a - Home Sidebar and Sidebar General **/ #sidebar-home {width: 435px; float: left;} #sidebar-home img.shade, #home-blogposts img.shade, #sidebar img.shade {display: block; height: 0px;} #sidebar-home img.shade{width: 0px;} #sidebar-home p strong {color: #333;} #sidebar-home ul li p:first-child {margin-top: 0px;} #sidebar-home ul li, #sidebar ul li { border-bottom: 1px solid #ccc; margin-bottom: 35px; padding-bottom: 3px; } #sidebar-home ul li ul li, #sidebar ul li ul li {border-bottom: none; margin-bottom:0px;} /** flickr **/ li.flickr {position: relative;} li.flickr ul li img {border: 1px solid #999; margin: 0 10px 0px 0; } a.bt-flickr {width: 38px; height: 85px; position: absolute; right:10px; top:50px; background: url(images/bt-flickr.png) no-repeat;} a.bt-flickr span { display: none;} li.sideflickr ul li img {margin-right: 0px;} div.flickr_badge_image {border: 1px solid #999; margin: 0 9px 10px 0; width:75px; height:75px; float:left;} /** 04.b - Home Blog Posts **/ #home-blogposts { width: 475px; height:1530px; float: right; border-bottom:1px solid #ccc; position: relative; padding-bottom: 15px; overflow:hidden;} #home-blogposts img.shade {width: 475px;} #home-blogposts ul li.no-slide-list {margin-bottom:25px; border-bottom:1px solid #ccc;} #home-blogposts #posts {padding-top:0 !important;} span.date {color: #999; padding-left: 22px; display: block; background: url(images/icon-date.png) no-repeat; font-size: 0.9em; line-height:18px; margin-bottom: 10px;} img.post-thumb {border: 1px solid #666;float: left; margin: 0 12px 12px 0;} .portfolio_crop {height:155px; overflow:hidden; border: 1px solid #666;float: left; margin: 0 12px 12px 0; margin: 0 20px 20px 0;} .portfolio img.post-thumb { margin: 0 20px 10px 0;} /** homepage blog posts, testimonials and twitter slider navigation **/ ul#home-blogposts-nav, ul.testimonials-nav, ul.twitter-nav {width: 43px !important; height: 20px !important; padding: 4px 0 0 5px !important; background: #dfdfdf !important; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; position: absolute; right: 0; bottom: -12px; } ul#home-blogposts-nav li, ul.testimonials-nav li, ul.twitter-nav li {float: left !important;} ul#home-blogposts-nav a, ul.testimonials-nav a, ul.twitter-nav a {display: block !important; width: 16px !important; height: 16px !important; margin-right: 5px !important; filter:alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity: 0.6; opacity: 0.6; padding:0px !important;} ul#home-blogposts-nav a:hover, ul.testimonials-nav a:hover, ul.twitter-nav a:hover {filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1;} ul#home-blogposts-nav a span, ul.testimonials-nav a span, ul.twitter-nav a span {display: none;} ul#home-blogposts-nav li.prev a, ul.twitter-nav li.prev a {background: url(images/arrow-low-prev.gif) no-repeat !important;} ul#home-blogposts-nav li.next a, ul.twitter-nav li.next a {background: url(images/arrow-low-next.gif) no-repeat !important;} ul.testimonials-nav li.next a {background: url(images/arrow-low-down.gif) no-repeat;} ul.testimonials-nav li.prev a {background: url(images/arrow-low-up.gif) no-repeat;} /*** 05. Footer ***/ #footer-wrap {background: url(images/bg-footer.gif) #d9dada repeat-x; padding-bottom: 10px; position: relative; } #footer {width: 960px; padding: 10px; margin: 0 auto;} a#MyDesignerGuy {display: block; width:180px; float: right; color:#999; text-decoration: none; line-height:22px; font-size:0.9em; padding-top: 12px;} a#MyDesignerGuy span {display: inline-block; background: url(images/logo.png) no-repeat; width: 75px; height: 22px; text-indent:-9999px} /*** 06. General Sidebar ***/ #sidebar {width: 260px; float: left; padding-top: 6px; } #sidebar img.shade{width: 250px; height: 20px !important; } #sidebar p:first-child {margin-top: 0px;} #sidebar ul li {padding-bottom: 8px;} #sidebar ul li ul {font-size:0.95em;} #sidebar ul li a {color: #333; text-decoration: none;} #sidebar ul li a:hover {color: #666} /** sidebar categories **/ ul.cats li {width: 120px ; margin-right: 10px; margin-bottom:10px; float:left;} ul.cats li a {display:block; padding:5px; padding-left:18px; background:url(images/arrow-mini.png) no-repeat 10px 8px; -moz-border-radius: 10px;-webkit-border-radius: 10px; -khtml-border-radius: 10px; border:1px solid #d1d1d1;} /** sidebar alternate link lists **/ li.alternate-lists ul li {padding: 0 !important;} li.alternate-lists ul li a {display: block; background: url(images/dot.gif) no-repeat 5px 11px; padding: 5px; padding-left: 15px; } li.alternate-lists ul li a:hover {background-image:url(images/dot-hover.gif); background-color: #f1f1f1; } /** testimonials and twitter widget **/ li.testimonials, li#MyDesignerGuy-twitter {position: relative; font-size: 0.9em; padding-bottom: 10px !important;} li.testimonials blockquote p, li#MyDesignerGuy-twitter p {color: #777 !important;} li.testimonials blockquote {font-style: italic; background: url(images/quote.png) no-repeat; padding: 0px 10px 0 20px; } ul.testimonials-nav li {padding: 0px !important; background: none !important;} li#MyDesignerGuy-twitter p {margin: 5px 0 !important;} li#MyDesignerGuy-twitter p.timeago {color: #333 !important;} /*** 07. Post General Settings **/ /** wide column **/ #wide-column {width: 650px; float: right; } .clearfix {width: 100%; height: 50px; clear: both; display: block;} div.full-width p {margin-top: 15px !important;} #info a {text-decoration: none; border-bottom: 1px solid #999; } #info a:hover {color:#666; text-decoration: none;} #info h4 {text-transform: uppercase;} #posts {padding-top:0px;} /** 07.a posts general settings **/ .each-post {border-bottom: 1px solid #ccc; padding-bottom: 15px; margin-bottom: 30px;} .each-post {color: #444;} .each-post p {margin-top: 0px !important;line-height:1.4em; } .each-post a.bt {margin-top:10px !important;} div.blog p:first-child {margin-top: 0px !important;} div.the-post ul { padding: 5px 10px 20px 25px; } #info ul {padding: 5px 10px 10px 15px;} div.the-post ul li, #info ul li {line-height: 1.5em; color: #666; list-style-type: disc; list-style-position: inside; } div.the-post ul li strong, #info ul li strong {color: #333;} div.the-post blockquote {font-style: italic; background: url(images/quote.png) no-repeat; padding: 10px 10px 10px 20px; padding-bottom: 15px; color: #777; } /** 07.b post meta **/ .postmeta {clear: both; line-height:3em; font-size: 0.9em; color: #999; background: #f7f7f7; margin-top: 10px;} .postmeta a:hover {text-decoration: none;} .postmeta div {float: left;} .author {display: block; color: #666; float: left; padding: 0 15px 0 30px; background: url(images/icon-author.gif) no-repeat 10px 8px;} .categories, .tags {padding: 0 15px;} .categories {background: #f1f1f1;} .tags a {color: #927b57;} #info {float: right; width: 550px;} /** 07.c comments **/ /** 07.d comment form **/ /** widget styles **/ #sidebar ul li.widget ul { padding-top:15px !important; background:url(images/heading-shade.png) no-repeat;} li.widget_recent_entries ul li ul {background:none; padding-top:0px !important; padding-left:15px;} li.widget_recent_entries ul li {padding-bottom: 3px !important;} li.widget_recent_entries ul li a {display: block; background: url(images/dot.gif) no-repeat 5px 11px; padding: 5px; padding-left: 17px;} li.widget_recent_entries ul li a:hover {background-image:url(images/dot-hover.gif); background-color: #f1f1f1;} ul#twitter_update_list li {padding: 0 !important; height: 90px !important; margin-top: -15px;} ul#twitter_update_list li span {display: block; margin: 5px 0; color: #666 !important;} ul#twitter_update_list li a {background: none !important; padding: 0px !important; display: inline !important;} /** a few more overrides **/