/* THEME NAME: Simple Beginnings DESCRIPTION: Matt Kreikemeier's personal, completely customized wordpress theme dedicated mainly to blogging, though also including 'About Me', 'Contact Me', 'Featured Work', and 'Tutorials' pages. AUTHOR: Matt Kreikemeier AUTHOR URI: Call Me Goon TAGS: custom, green, blue, simple theme, blog, developer */ body {background: #c0deed url(images/bg-body.png) repeat-x; color: #555;} #bodyWrap {background: url(images/bg-bodyWrap.png) repeat-x; height: 105px; position: relative; border-bottom: 1px solid #fff;} #wrap {width: 1024px; margin: 0 auto; padding: 0; position: relative; font-size: 1.1em;} #tooltip {color: #333; position: absolute; border: 1px solid #FFF; background: url(images/bg-tooltip.png); padding: 4px 7px; display: none; text-transform: uppercase; letter-spacing: .1em; z-index: 999999;} /************************************************************************ HEADER ************************************************************************/ #header {background: url(images/bg-header.png) no-repeat; height: 106px; position: relative; z-index: 9999;} #header h1 a {background: url(images/logo.png) no-repeat; width: 123px; height: 146px; display: block; position: absolute; top: 1px; left: 82px; text-indent: -9999px; outline: none;} #header h2 {height: 36px; position: absolute; left: 235px; top: 30px; text-indent: -9999px; } .aboutme #header h2 {background: url(images/aboutme/bg-header-section_title.png) no-repeat; width: 154px;} .contactme #header h2 {background: url(images/contactme/bg-header-section_title.png) no-repeat; width: 177px;} .blog #header h2 {background: url(images/blog/bg-header-section_title.png) no-repeat; width: 65px; height: 44px;} .featuredwork #header h2 {background: url(images/featuredwork/bg-header-section_title.png) no-repeat; width: 238px;} .tutorials #header h2,.jquery #header h2,.wordpress #header h2 {background: url(images/tutorials/bg-header-section_title.png) no-repeat; width: 238px;} /* Twitter Include */ #header #twitterWrap {color: #eee; background: url(images/bg-twitter.png) no-repeat; width: 376px; height: 87px; position: absolute; left: 560px;} #header #twitterWrap #twitterCallout {width: 220px; margin: 9px 0 0 120px;} #header #twitterWrap #twitterCallout a {color: #fff;} #header #twitterWrap p#twitterLink {background: #fff; padding: 2px 8px; position: absolute; top: 58px; left: 250px; font-size: 10px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;} #header #twitterWrap p#twitterLink a {color: #013A57;} #header #twitterWrap p#twitterLink a:hover {color: #589Ac1; text-decoration: none;} /************************************************************************ CONTENT ************************************************************************/ #contentWrap {background: url(images/bg-content.png) repeat-y; padding: 0 0 0 32px; } #content {overflow: hidden;/* This hides the excess padding in non-IE browsers */ position: relative;}/*see ie.css for fixes*/ #content:after {clear: both; content: ''; display: block; height: 0; visibility: hidden;} /************************************************************************ MAIN ***************************************************************************/ #main {background: #fff; width: 659px; min-height: 620px; position: relative; float: left;}/*see ie.css for fixes*/ #main #followMe {width: 250px; position: absolute; right: -27px; z-index: 999999;} #main #contentContainer {margin: 90px 20px 0 60px; padding: 0 0 20px 0; font-size: 1.1em;} #main img.left,#main img.alignleft {background: #eee; float: left; margin: 0 20px 10px 0; padding: 10px; border: 1px solid #ccc;} #main img.right,#main img.alignright {background: #eee; float: right; margin: 0 0 10px 20px; padding: 10px; border: 1px solid #ccc;} #main img.aligncenter {background: #eee; margin: 10px auto; padding: 10px; border: 1px solid #ccc;} #main img.alignnone {background: #eee; margin: 10px 10px 0 10px; padding: 10px; border: 1px solid #ccc;} #main h2 {color: #155ba3; margin: 80px 0 15px 0; text-align: right;} .jquery #main h3 {color: #fff; margin: 0 0 10px 0; text-transform: uppercase; font-weight: normal; clear: both;} #main h3 {color: #fff; background: #BBB; padding: 7px 5px 3px 10px; margin: 15px 0; clear: both; font-weight: normal; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main h4 {color: #333; margin: 0 0 10px 0; font-weight: normal; font-size: 1.2em; clear: both;} #main h5 {color: #333; margin: 0 0 10px 0; font-weight: normal; font-size: 1.1em;} #main p {margin: 0 0 20px 0;} #main p.source {margin: 50px 0 0 220px;} #main p.source a {background-image: url(images/bg-download_source.png); width: 125px; height: 36px; display: block; background-repeat: no-repeat; text-indent: -9999px; outline: none;} #main p.source a:hover {background-position: 0 -36px;} #main p.screencast {margin: 10px 30px 50px 220px;} #main p.screencast a {background-image: url(images/bg-screencast.png); width: 125px; height: 37px; display: block; background-repeat: no-repeat; text-indent: -9999px; outline: none;} #main p.screencast a:hover {background-position: 0 -37px;} #main .tutNav {margin: 0 0 30px 0; padding: 3px 12px; -moz-border-radius: 12px; position: relative; clear: both;} #main .tutNav p {margin: 0;} #main .tutNav p a {color: #FEDDEE; padding: 3px 12px;} #main .tutNav p a:hover {color: #FFF; text-decoration: none;} #main .tutNav p.back a {background: url(images/bg-previous.jpg) no-repeat; width: 244px; height: 40px; padding: 11px 12px 10px 15px; display: block;} #main .tutNav p.back {width: auto; float: left;} #main .tutNav p.next {float: right; text-align: right; padding: 0 20px 0 0;} #main .tutNav p.next a {background: url(images/bg-next.jpg) no-repeat 10px 0; width: 244px; height: 40px; padding: 12px 10px 10px 0px; display: block;}} #main ol {margin: 0 0 20px 30px;} #main ul {margin: 0 0 10px 30px;} #main ul li {margin: 0 0 10px 0;} #main ol li {margin: 0 0 10px 0;} #main ol li ul, #main ul li ul {margin: 10px 0 0 20px;} #main ol li ol, #main ul li ol {margin: 10px 0 0 30px;} #main ol li ol li, #main ul li ol li {list-style: decimal;} #main ol {margin: 0 0 20px 30px;} #main ul {margin: 0 0 10px 30px;} #main dl {margin: 0 0 20px 0;} #main dl dt {margin: 0 0 3px 0;} #main dl dd {margin: 0 0 15px 0;} #main table {width: 600px; margin: 0 0 20px 0; border: 1px solid #910000;} #main table thead tr th, #main table tfoot tr td {background: #910000; color: #fff; padding: 5px 10px; text-align: left; vertical-align: bottom;} #main table tbody tr td {padding: 5px 10px; border-bottom: 1px solid #910000; vertical-align: middle;} #main .failure {color: #b20; background: #fbad9c; margin: 10px 0 20px 0; padding: 15px; border: 1px dotted #B20;} /* Navigation Slider */ ul#nav {background: url(images/bg-nav_dock.png) no-repeat; width: 137px; height: 519px; padding: 30px 0 0 15px; position: absolute; top: 45px; left: -90px; z-index: 9999; display: none;} ul#nav li {width: 95px; height: 82px; margin: 5px 0 5px 0; display: block; position: relative; border: 1px solid #155ba2; list-style: none;} ul#nav li a {width: 95px; height: 82px; display: block; text-indent: -9999px; outline: none; border: none } ul#nav li a.readMore {background-image: url(images/bg-readMore.png); width: 84px; height: 82px; position: absolute; top: 0; left: 190px; text-indent: -9999px; outline: none; display: none;} ul#nav li a.readMore:hover {background-position: 0 -82px;} ul#nav li#lnkAboutMe {background: url(images/bg-nav-aboutMe.jpg) no-repeat;} ul#nav li#lnkContactMe {background: url(images/bg-nav-contactMe.jpg) no-repeat;} ul#nav li#lnkContactMe a.readMore {background-image: url(images/bg-readMore.png); width: 84px; height: 81px; position: absolute; top: 0px; left: 190px;} ul#nav li#lnkContactMe a.readMore:hover {background-position: 0 -82px;} ul#nav li#lnkBlog {background: url(images/bg-nav-blog.jpg) no-repeat;} ul#nav li#lnkBlog a.readMore {background-image: url(images/bg-readMore.png); width: 84px; height: 82px; position: absolute; top: 0; left: 190px;} ul#nav li#lnkBlog a.readMore:hover {background-position: 0 -82px;} ul#nav li#lnkFeaturedWork {background: url(images/bg-nav-featuredWork.jpg) no-repeat;} ul#nav li#lnkFeaturedWork a.readMore {background-image: url(images/bg-readMore.png); width: 84px; height: 82px; position: absolute; top: -1px; left: 240px;} ul#nav li#lnkFeaturedWork a.readMore:hover {background-position: 0 -82px;} ul#nav li#lnkTutorials {background: url(images/bg-nav-tutorials.jpg) no-repeat;} ul#nav li#lnkTutorials a.readMore {background-image: url(images/bg-readMore.png); width: 84px; height: 82px; position: absolute; top: 0; left: 190px;} ul#nav li#lnkTutorials a.readMore:hover {background-position: 0 -82px;} /* Log In/Out */ #main #loginOut {position: absolute; top: 21px; left: 345px; box-shadow: 0.2em 0.2em 1.2em #777; -moz-box-shadow: 0.2em 0.2em 1.2em #777; -webkit-box-shadow: 0.2em 0.2em 1.2em #777;} #main #loginOut a {color: #fff; background: #013A57; padding: 5px 12px 3px 12px; text-transform: uppercase; border: 1px solid #fff;} #main #loginOut a:hover {background: #5d97c0; text-decoration: none;} /* Follow Me */ #main #followMe p {background: url(images/bg-followMe.png) no-repeat; width: 236px; height: 57px; margin: 0; position: relative; right: 20px;} #main #followMe p a {width: 220px; height: 30px; display: block; margin: 0; position: relative; top: 10px; left: 10px; cursor: pointer; text-indent: -9999px; outline: none;} #main #followMe ul {background: url(images/bg-followMe-dropdown.png) no-repeat; width: 244px; height: 274px; margin: -28px 0 0 -23px; padding: 45px 0 3px 12px; opacity: .95; display: none;} #main #followMe ul li {margin: 0 20px 7px 20px; list-style: none;} #main #followMe ul li a {color: #1E6CB9; padding: 2px 0 2px 25px;} #main #followMe ul li a:hover {color: #4190E0; text-decoration: none;} #main #followMe ul li.subscribe a {background: url(images/bg-followMe-subscribe.png) no-repeat;} #main #followMe ul li.facebook a {background: url(images/bg-followMe-facebook.png) no-repeat;} #main #followMe ul li.myspace a {background: url(images/bg-followMe-myspace.png) no-repeat;} #main #followMe ul li.twitter a {background: url(images/bg-followMe-twitter.png) no-repeat;} #main #followMe ul li.delicious a {background: url(images/bg-followMe-delicious.png) no-repeat;} #main #followMe ul li.lastfm a {background: url(images/bg-followMe-lastfm.png) no-repeat;} #main #followMe ul li.digg a {background: url(images/bg-followMe-digg.png) no-repeat;} #main #followMe ul li.netflix a {background: url(images/bg-followMe-netflix.png) no-repeat;} #main #followMe ul li.bottles a {background: url(images/bg-followMe-97bottles.png) no-repeat;} /*Breadcrumbs*/ #main p#breadcrumbs {color: #ccc; width: 100%; position: absolute; top: 50px; right: 20px; text-align: right;} #main p#breadcrumbs a {color: #ccc; font-style: italic;} #main p#breadcrumbs a:hover {color: #777; text-decoration: none;} /*Form Elements*/ #main form#cformsform {margin-left: 50px;} #main form label {color: #999; margin: 0 0 10px 0; font-weight: bold; float: left; display: block;} #main form input {color: #999; margin: 0 0 10px 0; padding: 3px; font-size: 1em; border: 1px solid #999;} #main form div {margin: 0 0 15px 0; padding: 0 0 30px 0; position: relative;} #main form .text label {width: 125px; text-align: right;} #main form .text input {margin: 0 0 10px 15px;} #main form .checkbox label {width: 275px;} #main form .checkbox input {margin: 0 5px 20px 0; padding: 0; float: left; display: block; border: none;} #main form .radio label {width: 275px;} #main form .radio input {margin: 0 5px 20px 0; padding: 0; float: left; display: block; border: none;} #main form br {clear: both;} #main form input#btnNext, #main form input#btnEdit, #main form input#btnSubmit {margin: 0; padding: 0; border: none;} #main form p.required {color: #999; font-size: .9em; font-style: italic;} #main ul.formVerify {margin: 0 0 20px 0; position: relative;} #main ul.formVerify li {margin: 0 0 5px 0; list-style: none; display: block; clear: both; border-bottom: 1px dotted #666;} #main ul.formVerify li:after {clear: both; content: '[DO NOT LEAVE IT IS NOT REAL]'; display: block; height: 0; visibility: hidden;} #main ul.formVerify li strong {background: #fff; margin: 0; top: .6em; font-weight: normal; float: left; display: block; position: relative;} #main ul.formVerify li em {background: #fff; margin: 0; top: .6em; float: right; display: block; position: relative;} #main ul.formVerify li.textbox {margin: 15px 0 0 0; border: none;} #main ul.formVerify li.textbox strong {float: none;} #main ul.formVerify li.textbox em {float: none; overflow: auto;} #main form.cform legend {display: none;} #main form.cform ol li {list-style: none;} #main form.cform label {background: #EEE; width: 135px; margin: 0 10px 0 0; padding: 5px 8px; text-align: right; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main form.cform input {color: #fff; background: #035680; margin: 0 10px 0 0; padding: 5px 10px; border: none; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main form.cform input:hover,#main form.cform input:focus {background: #5d97c0;} #main form.cform input#sendbutton {color: #fff; background: #ed008c; position: relative; left: 192px; cursor: pointer; border: 1px solid #fff; box-shadow: 0.2em 0.2em 1.2em #aaa; -moz-box-shadow: 0.2em 0.2em 1.2em #aaa; -webkit-box-shadow: 0.2em 0.2em 1.2em #aaa; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; text-transform: uppercase;} #main form.cform input#sendbutton:focus {color: #fff;} #main form.cform textarea {color: #fff; background: #035680; border: none; font-family: Helvetica, Lucida Grande, Trebuchet MS, Verdana, Arial, sans-serif, Helvetica; font-size: 1em; padding: 10px; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main form.cform textarea:hover,#main form.cform textarea:focus {background: #5d97c0;} #main .linklove {display: none;} /* Post Styles */ #main .navigation a {color: #ed008c;} #main .navigation a:hover {color: #8e0355; text-decoration: none;} #main .post {padding: 0 0 65px 0; border-bottom: 1px solid #ccc;} #main .post h2 {margin: 30px 0 15px 0; text-align: left; font-size: 1.4em;} #main .post h3.entry-title {background: none; margin: 30px 0 20px 0; font-size: 1.4em; clear: both;} #main .post h3.entry-title a {color: #333;} #main .post .more-link {margin: 10px 0 0 0;} #main .post .more-link a {color: #fff; background: #ed008c; padding: 5px 7px 3px 7px; font-size: 0.75em; text-transform: uppercase; border: 1px solid #fff; box-shadow: 0.2em 0.2em 1.2em #aaa; -moz-box-shadow: 0.2em 0.2em 1.2em #aaa; -webkit-box-shadow: 0.2em 0.2em 1.2em #aaa;} #main .post .more-link a:hover {color: #fff; background: #333; text-decoration: none;} #main .entry-date {margin-bottom: 10px;} #main .entry-meta {margin-top: 65px;} #main .entry-content {margin-bottom: 40px;} .blogPost #main .entry-meta {background: #EEE; padding: 10px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; clear: left;} #main #comments {background: #eee; margin-top: 60px; padding-top: 10px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; clear: both;} #main #comments h3 {color: #333; background: none; margin: 10px 20px 10px 20px; padding: 10px 0 0 0; text-transform: uppercase;} #main #comments .comments .comment {color: #FFF; background: #5d97c0; margin: 15px 25px 15px 110px; padding: 8px 15px; position: relative; font-style: italic; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main #comments .comments .comment a {color: #155ba3;} #main #comments .comments .comment p {color: #eee; background: #5d97c0; margin: 0 0 8px 0; padding: 15px; font-weight: bold; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px;} #main #comments .comments .comment .comment-author {width: auto; position: absolute; left: -90px; top: 35px; float: left;} #main #comments .comments .comment .comment-author img {background: #fff; padding: 5px; border: 1px solid #999;} #main #comments .comments .comment .comment-author .fn {color: #444; width: 90px; margin-top: 5px; display: block; font-style: normal;} #main #comments .comments .comment .comment-meta {margin: 0 0 10px 0; font-style: normal;} #main #comments .comments .arrow {width: 0; height: 0; line-height: 0; position: absolute; top: 45px; left: -30px; border-top: 40px solid #5d97c0; border-right: none; border-left: 30px solid #EEE;} #main #comments form div {margin: 0;} #main #comments #commentform {margin: 0 0 40px 40px;} #main #comments #commentform .form-label {width: 100px; margin-right: 20px; padding-bottom: 0; float: left; clear: left;} #main #comments #commentform .form-label label {color: #888; background: #ddd; width: 100px; padding: 5px; font-weight: normal; text-align: right; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main #comments #commentform .form-input {padding-bottom: 0;} #main #comments #commentform .form-input input {color: #999; padding: 5px; font-weight: normal; border: 1px solid #fff;; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main #comments #commentform .form-input input:focus {border: 1px solid #ed008c;} #main #comments #commentform textarea {color: #999; padding: 5px; font-family: Helvetica, Arial, Verdana, sans-serif, Helvetica; font-size: 1.1em; border: none; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main #comments #commentform textarea:focus {border: 1px solid #ed008c;} #main #comments #commentform input#submit {color: #fff; background: #ed008c; margin-left: 120px; padding: 5px 11px; border: none ; text-transform: uppercase; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; cursor: pointer;} #main #comments #commentform input#submit:hover {color: #fff;} /*Syntax Highlighter Styles*/ .syntaxhighlighter.collapsed .toolbar .item.expandSource {padding-bottom: 10px;} .syntaxhighlighter {background: #eee !important; padding: 10px !important;} /*Sociable*/ .sociable img {width: 62px !important; height: 62px !important; margin: 0 0 0 5px !important;} /************************************************************************ SIDEBAR ************************************************************************/ #sidebarWrap {background: #fff url(images/bg-sidebarWrap.png) repeat-y; width: 301px; position: relative; float: left;} #sidebar {background: url(images/bg-sidebar.png) no-repeat; width: 301px;} #sidebar h2 {width: 220px; height: 48px; text-indent: -9999px; border: 1px solid #fff; border-radius: 15px 0 0 0; -moz-border-radius: 0px 0 0 0; -webkit-border-radius: 0px 0 0 0;} /* Google Search */ #sidebar form {margin: 0 0 0 39px; padding: 14px 0 0 0;} #sidebar form input#txtSearch {color: #5d97c0; background: #fff; width: 210px; height: 37px; padding: 13px 0 0 11px; border: 1px solid #5d97c0; font-size: 20px; font-weight: normal;} /* Callout Items */ #sidebar .callout ul {background: #fff url(images/bg-sidebar-callout.png) repeat-x; margin: 5px 0 0 0; padding: 20px 0 10px 0; border: 1px solid #fff; border-radius: 0 0 15px 0; -moz-border-radius: 0 0 15px 0; -webkit-border-radius: 0 0 15px 0;} #sidebar .callout ul li {background: url(images/bullet.png) no-repeat 0 4px; margin: 5px 20px 10px 15px; padding: 0 0 0 17px; list-style: none;} #sidebar ul.callout li {list-style: none;} #sidebar .callout ul li a {padding-bottom: 5px; display: block; border-bottom: 1px solid #949494;} #sidebar .callout ul li a:hover {text-decoration: none;} #sidebar .callout {margin: 15px 40px 25px 40px;} #sidebar #recentPosts h2 {background: url(images/bg-sidebar-recent_posts.png) no-repeat;} #sidebar h2.categories {background: url(images/bg-sidebar-categories.png) no-repeat;} #sidebar #blogroll h2 {background: url(images/bg-sidebar-favorite_sources.png) no-repeat;} #main, #sidebarWrap {margin-bottom: -32767px !important; padding-bottom: 32767px !important;} /* Pages styles (only when js is disabled) */ #sidebar .callout ul#navPages li {margin: 5px 10px 0 0; padding: 0 0 0 15px;} #sidebar .callout ul#navPages li.pagenav {background: none;} #sidebar .callout ul#navPages li ul,#sidebar .callout ul li ul li ul {background: none;} #sidebar .callout ul#navPages li ul {margin: 0; padding: 0;} #sidebar .callout ul#navPages li ul li {margin: 0; padding: 5px 0 0 15px;} #sidebar .callout ul#navPages li ul li ul li {background: none; margin: 0 0 0 10px; padding: 5px 0 0 0; list-style: circle;} #sidebar .callout ul#navPages li ul li ul li ul li {list-style: disc;} /************************************************************************ FOOTER ************************************************************************/ #footerWrap {color: #eee; background: #64b3da url(images/bg-footerWrap-internal.png) repeat-x; padding: 0 0 45px 0; position: relative; clear: both;} #footerWrap #footer {background: url(images/bg-footer-internal.png) no-repeat; width: 1024px; margin: 0 auto; padding: 45px 0 0 0;} #footerWrap #footer:after {clear: both; content: ''; display: block; height: 0; visibility: hidden;} #footerWrap #footer h3 {color: #FFF;} #footerWrap #footer ul.footerBucket,#footerWrap #footer .footerBucket {width: 292px; margin: 0 10px 0 30px; padding: 0 0 15px 0; position: relative; float: left;} #footerWrap #footer ul.footerBucket li {list-style: none; font-size: 11px;} #footerWrap #footer ul.footerBucket li h3,#footerWrap #footer .footerBucket h3 {margin: 0 0 10px 0; padding: 10px; text-align: left; font-weight: bold; font-size: 21px; font-weight: normal; border-bottom: 1px solid #85C3E2;} #footerWrap #footer ul.footerBucket li ul {margin-bottom: 5px; margin-left: 5px;} #footerWrap #footer ul.footerBucket li ul li {color: #155BA3; margin: 3px 5px; list-style: circle;} #footerWrap #footer ul.footerBucket li ul li a {color: #155BA3; font-weight: normal;} #footerWrap #footer ul.footerBucket li ul li a:hover {color: #FFF; text-decoration: none;} #footerWrap #footer ul.footerBucket li.widget_tag_cloud {margin: 0 10px;} #footerWrap #footer ul.footerBucket div a {color: #155BA3; font-weight: normal;} #footerWrap #footer ul.footerBucket div a:hover {color: #FFF; text-decoration: none;} #footerWrap #footer ul.footerBucket li.sociable ul li {margin: 0;} /************************************************************************ *************************************************************** ************************************************************************* *************************************************************** UNIQUE STYLES ************************************************************************* **************************************************************** ************************************************************************* ***************************************************************/ /* Featured Work */ .featuredwork #header {height: 105px;} .featuredwork #main {width: 960px;} .featuredwork #main #followMe {right: 15px;} .featuredwork #main #loginOut {left: 600px;} .featured #main img.right,#main img.alignright {background: transparent; border: none; padding: 0;} .featuredwork #main p#breadcrumbs {right: 55px;} #slider {position:relative;} #page ul.navigation li {list-style: none;} #page ul.navigation a:hover span,#page .navigation a.selected span{} #page ul.navigation a:focus {outline:none;} #page .scroll {height:590px; width:760px; margin:0 auto; overflow:auto; position:relative; clear:left;} #page .scrollContainer .panel {padding:20px; height:510px; width:720px; overflow:hidden;} #page .panel p {margin: 0 0 15px 0;} #page .panel h3 {background: url(images/bg-title-featuredWork.png) no-repeat 0 100%; font-size: 2em; margin: 0 0 40px 0; padding: 0; color: #777; font-weight: normal; text-align: center;} #page .scrollButtons {width: 84px; height:82px; position: absolute; top: 190px; cursor: pointer;} #page .scrollButtons a {display: block; height: 82px; width: 84px;} #page .scrollButtons span {display: none;} #page .scrollMeLeft {left: -20px;} #page .scrollMeLeft a {background: url(images/bg-arrow_previous.png) 0 0 no-repeat;} #page .scrollMeLeft a:hover {background: url(images/bg-arrow_previous.png) 0 -82px no-repeat;} #page .scrollMeRight {right: -10px;} #page .scrollMeRight a {background: url(images/bg-arrow_next.png) no-repeat;} #page .scrollMeRight a:hover {background: url(images/bg-arrow_next.png) 0 -82px no-repeat;} /* Tutorials */ #main .tutorialSection {color: #FFF; background: #5d97c0; margin: 0 0 10px 0; padding: 7px 12px 3px 12px; font-weight: bold; font-size: 1.3em; text-transform: uppercase; list-style: none; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px;} #main .tutorialSection p {margin: 10px 0; font-weight: normal; font-size: 12px; text-transform: none;} #main .tutorialSection p a {text-decoration: underline;} #main .tutorialSection p a:hover {color: #FFF;} #main .tutorialSection a {color: #c8e1fc; outline: none; font-weight: normal; font-size: 12px;} #main .tutorialSection h4 {color: #FFF; margin: 0; cursor: pointer;} #main .tutorialSection h4.inactive {background: url(images/expand.png) no-repeat 98% 3px;} #main .tutorialSection h4.active {background: url(images/collapse.png) no-repeat 98% 3px;} #main .tutorialSection ul {margin: 0 0 10px 0; padding-top: 10px;} #main .tutorialSection ul li {background: #035680; padding: 7px 12px; font-weight: normal; font-size: 11px; text-transform: none; list-style: none; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px;} #main .tutorialSection ul li a:hover {color: #FFF; text-decoration: none;} /* Wordpress Resources */ #main .plugin {color: #FFF; background: #5d97c0; margin: 0 0 10px 0; padding: 7px 12px; font-weight: bold; font-size: 1.3em; text-transform: uppercase; list-style: none; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px;} #main .plugin h4 {color: #FFF; margin: 0; font-size: 13px; cursor: pointer;} #main .plugin h4.inactive {background: url(images/expand.png) no-repeat 98% 0;} #main .plugin h4.active {background: url(images/collapse.png) no-repeat 98% 0;} #main .plugin p {margin: 10px 0; font-weight: normal; font-size: 11px; text-transform: none;} #main .plugin ul li {color: #daf862; margin-bottom: 0; list-style: circle;} #main .plugin a {color: #daf862; font-weight: normal; font-size: 11px; text-decoration: underline;} #main .plugin a:hover {color: #fff;} /* Search */ .search #main {width: 960px;}