/* File: custom.css Description: Custom styles for Thesis BASIC USAGE: If you have enabled the custom stylesheet in the Thesis options panel, the tag will be appended with the "custom" class, like so: . You can use the "custom" class to override *any* CSS declarations contained in the style.css file. For example, if you wish to change the default link color to green, you would add the following declarations to this file: .custom a, .custom a:visited { color: #090; } <--- This makes links green .custom a:hover { color: #00f; } <--- This makes links blue when you mouse over them WHY THIS WORKS: By using the "custom" class, you are creating more specific CSS declarations for HTML elements. CSS styling is applied through rules of specificity, and because declarations prepended with .custom are more specific, they get applied when the page is rendered! More information about styling your Thesis installation using this file can be found in the User's Guide: http://diythemes.com/thesis/rtfm/customizing-thesis-with-customcss/ */ /*BACKGROUND*/ body.custom { background:#fff url(images/bg.jpg) repeat-y scroll 50% 0; min-width: 1000px; } /* This line gets rid of the site title & tagline by casting them out to far left field */ .custom #header #logo, .custom #header #tagline { text-indent: -9999px; } /*Header*/ .custom #header, .custom .post, .custom .teasers_box, .custom #footer, .custom #footer a, .custom #footer a:active, .custom #archive_info, .custom .prev_next, .custom #comment_list, .custom #comment_list dd, .custom #commentform, .custom #sidebar_1, .custom #sidebar_2, .custom #comment_list dt.comment, .custom #comment_list dd.comment, .custom #comment_list dl .bypostauthor .format_text, .custom #trackback_list { border-bottom: 0px; border-top: 0px; border-right: 0px; border-left: 0px; } .custom #content_box, .custom #column_wrap { background: none; } .custom #content { width:60 em; } .custom .full_width > .page { background: none !important; } .custom ul.sidebar_list { padding-top:0em; } .full_width .page { padding: 0em !important; } /* [-- Removes Padding Left Side of Content --]*/ .custom .post_box, .teasers_box, .full_width #content_box .page { margin:0 1em 0 0.5em; } .custom #header_area { background: transparent url(images/headerbg.png); height: 75px; } /*Custom Navigation*/ #customNav { float: center; list-style: none; height: 50px; padding: 1em; width: 1046px; margin-top: 1em; position: relative; left: -2em; } #customNav li { float: left; height: 50px; text-indent: -5000px; } #customNav li a { display: block; background: url('images/nav.png'); outline: none; width: 280px; height: 50px;} #customNav li#home a { background-position: 0 0; } #customNav li#home a:hover { background-position: 0 -50px; } #customNav li#home a.active { background-position: 0 -100px; } #customNav li#about a { background-position: -280px 0; } #customNav li#about a:hover { background-position: -280px -50px; } #customNav li#about a.active { background-position: -280px -100px; } #customNav li#contact a { background-position: -560px 0; } #customNav li#contact a:hover { background-position: -560px -50px; } #customNav li#contact a.active { background-position: -560px -100px;} #customNav li#archives a { background-position: -840px 0; width: 206px !important; } #customNav li#archives a:hover { background-position: -840px -50px; } #customNav li#archives a.active { background-position: -840px -100px; } /*Twitter Widget*/ .custom #twitter_div { background:transparent url(images/tweetbubble.png) no-repeat scroll 0 0; display:block; height:22em; width:36em; } li.widget_twitter { list-style-type: none; } .custom li.widget_twitter ul { position: relative; top: 8em; left: 9em; } .custom li.widget_twitter ul li { margin:0em 9em 0.692em 0em; list-style-type: none; font-size: 1.3em; color: #2a84ff; } .custom li.widget_twitter ul li a { color: #727272; } .custom li.widget_twitter ul li a:hover { color: #8f8e8e; text-decoration: none; } div#tweet_button { left:0em; position:relative; top:0em; } div#tweet_button a { display: block; height: 48.5px; width: 349px; background: url('images/followtwitter.png') no-repeat; } div#tweet_button a:hover { background-position: 0 -49px; } /*Comments Closed Text*/ .custom .comments_closed p { display: none; } /*Main LINKS*/ .custom a { color: #2a84ff; text-decoration: none; } .custom a:hover { color: #505151; text-decoration: none !important; } .custom a:visited { color: #2a84ff; font-weight: normal; } .custom .format_text h2, .format_text h3 { font-size:1.286em; font-weight: 600; color: #2a84ff; text-shadow: 2px 2px 5px #ccc; } /*Subscribe Widget*/ #subscribe_stuff { background: transparent url('images/subscribe.png') no-repeat; width: 330px; height: 128px; margin-top: 6em; } #rss_sub { position: relative; width: 108px; left: .4em; top: .8em; } #rss_sub a { display: block; background: transparent url('images/rss_sub.png') no-repeat; width: 108px; height: 75px; outline: none; } #rss_sub a:hover { background-position: 0 -76px; } #email_sub { position: relative; width: 129px; top: -5.5em; left: 16em; } #email_sub a { display: block; background: transparent url('images/email_sub.png') no-repeat; width: 129px; height: 76px; position: relative; outline: none; } #email_sub a:hover { background-position: 0 -76px; } /*Post Headlines*/ .custom h2 a { color: #2a84ff; } .custom h2 a:hover { color: #505151; text-decoration: none; } /*After click � headline*/ .custom h1 { color: #2a84ff; } /*This makes the teasers be one across, instead of two*/ .custom .teaser { width: 100%; margin-top: 2em; padding-top: 2em; padding-bottom: 4em; border-top: none !important; border-bottom: 1px solid #505151; text-align: justify; } .custom .teasers_box { padding: 0 !important; border-top: 0; } .custom .teaser .format_teaser .post_image_link img.frame { padding: 1.2em; background: #fff; border: 1px solid #000; } /*Comments*/ .custom .format_text .to_comments { background: transparent url(images/comment.png) no-repeat; height: 79px; width: 132px; position: relative; left: 20.5em; } .custom .comments_intro p { color: #2a84ff; } .custom .comments_intro a { text-decoration: #2a84ff; } .custom .comments_intro a:hover { color: #e0e0e0; text-decoration: none; } .custom .comments_intro span { color: #2a84ff; } .custom .comments_intro span.bracket { display: none; } /*After Click on Post Comments*/ .custom .format_text .to_comments { color: #fff; clear: both; } .custom .format_text .to_comments span { color: #fff; } .custom .format_text .to_comments span.bracket { display: none; } .custom .format_text .to_comments a { color:#FFFFFF; left:1.5em; position:relative; text-decoration:none; top:1.6em; } .custom .format_text .to_comments a:hover { color: #e0e0e0; text-decoration: none; } .custom dl#comment_list dl .bypostauthor { background:#f3f3f3; padding: .5em; -moz-border-radius: 1em; -webkit-border-radius: 1em; } /* Comments Link at top of post*/ div#comment_container { position: absolute; width: 0em; } /* Comment Bubble*/ p.comments_link { background:transparent url('images/comments_link.png') no-repeat scroll 0 0; display:block; height:58px; width:56px; left:514px; position:relative; top:-20px; text-align: center; } p.comments_link span { width: 56px; } p.comments_link span a { color:#FFFFFF; font-size:2em; line-height:1.7em; } p.comments_link span a:visited { color: #fff; } p.comments_link span a:hover { color: #000; text-decoration: none; } .custom .headline_area { width: 534px; padding-bottom: 12px; background: transparent url(images/headlinearrow.png) no-repeat 0 77%; } .custom .headline_meta { position:relative; top:2.3em; } .custom .headline_meta a { border-bottom: none; } .date_meta { color: #727272; width: 165px; background: transparent url(images/date.png) no-repeat; height:27px; left:-3px; padding-bottom:0; position:relative; } .date_meta span { font-size:1.1em; left:28px; letter-spacing:1px; position:relative; text-transform:uppercase; top:5px; } .flickr a { display: block; background: transparent url(images/flickr.png) no-repeat; width:250px; height: 80px; } .flickr a:hover { background-position: 0 -80px; } .custom #footer a { text-decoration: underline; } .custom #footer { margin-top: 3em; } .custom #sidebars { width:39.2em; margin-top:3em; } /* Teasers */ .custom .teaser h2 { font-size:2.4em; text-align:left; width:500px; text-shadow: 1px 1px 3px #ccc; } .custom .teaser .format_teaser a { text-decoration:none; } .custom .teaser .teaser_link { letter-spacing: 1px; background: #2a84ff; padding: .5em; text-transform: uppercase; color: #fff; } .custom .teaser a.teaser_link:hover { color: #000; } /* Footer */ .custom #footer_area { background: #fff url(images/footerbg2.png) no-repeat top; height: 56em; } #faq a { display: block; background: transparent url(images/faq.png) no-repeat; width: 600px; height: 265px; outline: none; float: left; } #faq a:hover { background-position: 0 -265px; } #jealousies a { display: block; background: transparent url(images/jealousies.png) no-repeat; width: 623px; height: 235px; outline: none; float: right; } #jealousies a:hover { background-position: 0 -238px; } #datelist a { display: block; background: transparent url(images/datelist.png) no-repeat; width: 900px; height: 235px; outline: none; float: left; margin-bottom: 8em; } #datelist a:hover { background-position: 0 -233px; } #write a { display: block; background: transparent url(images/write.png) no-repeat; width: 757px; height: 215px; outline: none; float: right; } #write a:hover { background-position: 0 -217px; } #dude a { display: block; background: transparent url(images/dude.png) no-repeat; width: 900px; height: 360px; outline: none; float: left; margin-top: 3em; } #dude a:hover { background-position: 0 -355px; } #feeling { background: transparent url(images/feeling.png) no-repeat; width: 688px; height: 44px; float: right; margin-top: 11em; } /* CUSTOM HEADERS FOR SIDEBAR Widgets */ .custom li.widget_killer_recent_entries h3 { height: 106px; background: url('images/recent.png') no-repeat; text-indent: -9999px; } .custom li.thesis_widget_search h3 { height: 106px; background: url('images/search.png') no-repeat; text-indent: -9999px; } .custom .sidebar a, a:visited { color: #fff; } .custom .sidebar a:hover { color: #000; } .custom .sidebar input[type="text"], .sidebar input[type="submit"] { font-family: "Calibri", "Arial"; background: #fff; color: #fff; font-weight: 600; font-size: 1.2em; } .custom li.widget ul li { margin-bottom:1.667em; }