/* 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/ */ /* BLACK */ /* .custom #content_area {background: #000000; border-left: 0px solid #464690; } */ /* WHITE */ /* .custom .page {background: #ffffff;} */ /* BLACK */ /* .custom # {background:#000000;} */ /* BLACK */ /* .custom _area {background:#000000;} */ /* SIDEBARS */ /* THIS IS USED TO CHANGE THE SIDEBAR COLORS BY INDIVIDUAL SIDEBAR */ .custom #sidebar_1 { background: #F7F7FA; border-left: 0px solid #464690; border-bottom: 1px solid #ffffff; margin-right: 0px; border-right: 1px solid #464690; } .custom #sidebar_2 { background: #F7F7FA; border-left: 1px solid #464690; border-bottom: 1px solid #ffffff; margin-left: 0px; border-right: 0px solid #464690; } /* THIS CODE CHANGES THE TITLE BAR COLOR ON THE WIDGETS IN THE SIDEBARS */ .custom .sidebar h3 { color:#FFFFFF; font-weight:bold; background:#800000; font-family:verdana; text-align:center; border-top: 1px solid #182C0A; border-bottom: 1px solid #182C0A; border-left: 1px solid #182C0A; border-right: 1px solid #182C0A; } /* THIS CHANGES THE FONT COLOR OF AN ACTIVE LINK WITHIN A HEADER IN THE SIDEBAR. EX: RSS WIDGET */ .custom .sidebar h3 a:link { color:#ffffff } /* THIS CHANGES THE FONT COLOR OF AN ACTIVE LINK WITHIN A HEADER IN THE SIDEBAR WHILE HOVERING OVER IT */ .custom .sidebar h3 a:hover { color:#0000FF } /* SIDEBAR WIDGET TEXT THAT IS NOT A LINK IS NOW BLACK */ .custom .sidebar { color: #000000;} /* SIDEBAR WIDGET LINK is DARK BLUE and mouseover is BLUE with no underline */ .custom .sidebar a, a:active { color: #00005D; } .custom .sidebar a:visited { color: #7A957A; } .custom .sidebar a:hover { color: #0000FF; text-decoration: underline;} .custom .sidebar { font-family:verdana; background:#F7F7FA; } /* HEADER */ /* THIS CHANGES THE TAGLINE FONT COLOR LOCATED BELOW THE HEADER */ /* .custom #tagline {color:#00005D} */ /* BACKGROUND HEADER */ /* THIS IS USED TO INSERT AN IMAGE INTO THE BACKGROUND HEADER AREA */ /* .custom #header_area {background:url(http://www.hortonbrothers.com/wp-content/themes/thesis_16/custom/images/DkRedBlackGradient1600.pg) repeat;} */ /* BACKGROUND */ /* THIS IS USED TO INSERT AN IMAGE INTO THE BACKGROUND FOOTER AREA */ .custom #footer {background:url(http://www.hortonbrothers.com/wp-content/themes/thesis_16/custom/images/DkRedBlackGradient1600.jpg) repeat;} /* BACKGROUND BODY & CONTENT AREA */ /* THIS IS USED TO INSERT AN IMAGE INTO THE BODY BACKGROUND & CONTENT AREA CSS */ .custom #content_area {background:url(http://www.hortonbrothers.com/wp-content/themes/thesis_16/custom/images/DkRedBlackGradient1600.jpg) repeat;} .custom #content_area .page {background:#fff; margin-top: 0em;} /* THIS CHANGES SPACING BETWEEN THE CONTENT AREA AND THE EMPTY BACKGROUND BORDERS. IT ALSO CREATES A FULL-WIDTH HEADER */ .custom { background:#000000; } .custom .page { padding:0.5em; } .custom #header_area .page { margin-top:2.0em; } .custom #footer_area { margin-bottom:1.0em; } /* This line sets up our clickable background image based on the site title's link */ /* DIY: Adjust the height & width attributes to reflect the actual size of your image */ /* DIY: Change the filename of your image to reflect the actual header's file name */ .custom #header #logo a { display: block; height: 53px; width: 960px; background: url('images/Horton.jpg') no-repeat; outline: none; } /* This line gets rid of the site title by casting it out to far left field */ .custom #header #logo { text-indent: -9999px; } /* This line collapses the vertical space of the tagline so that there isn't unnecessary white space after the header image */ /* This line removes the padding from the header so that the background image sits close to the nav menu, the bottom border of the header, and the sides of the content */ .custom #header { padding: 0; margin: 0; } /* This code extends the background color of the nav menu across the page */ .custom .menu { background: #000066; } /* This code changes the background content color to black, behind the logo */ #header_area .page { background: #000000; }