/* File: custom.css Description: Custom styles for Thesis. Marketers Delight styles by Kolakube.com 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/ */ /*-------------------------------------------------------------------------------------------------------- GLOBAL --------------------------------------------------------------------------------------------------------*/ .custom a { outline: none } .custom form input.name { background: #FFF url(images/name_icon.png) no-repeat left } .custom form input.email { background: #FFF url(images/mail_icon.png) no-repeat left } /*-------------------------------------------------------------------------------------------------------- HEADER --------------------------------------------------------------------------------------------------------*/ #header_wrap { background: #F6F6F6 url(images/header_wrap.png) repeat-x bottom } .custom #header { position: relative } .custom #logo a { letter-spacing: -2px } #header_banner { float: right; margin-right: 1.1em } /*--- NAV ---*/ .custom .menu { background: #2A2A2A url(images/menu.png) repeat-x bottom } .custom .menu a, .custom .menu a:hover { background: none; letter-spacing: normal } .custom .menu a:hover { text-decoration: underline } .custom .menu .current a, .custom .menu .current a:hover, .custom .menu .current-cat a, .custom .menu .current-cat a:hover { color: #878585; cursor: default } /*--- OPTIN ---*/ .optin { overflow: hidden } .optin h3 { color: #FDFDFD; font-size: 3em; letter-spacing: -1px; line-height: 1.267em; margin-bottom: .267em } .desc p { font-size: 1.6em; line-height: 1.438em; margin-bottom: .5em } .optin form { float: right; overflow: hidden; padding: 2.2em 1.1em 1.8em 1.1em; width: 27.5em } .optin form p { font-size: 1.5em; margin-bottom: .533em } .optin input { background: #FFF; box-shadow: 0 0 10px #CCC inset; margin-bottom: 0.1em; padding: .8em 0.714em .667em 2.467em; width: 15.067em; -moz-box-shadow: 10px #CCC inset 0 0; -webkit-box-shadow: 10px #CCC inset 0 0; -moz-border-radius: 5px; -webkit-border-radius: 5px } .optin .submit { border: 0; color: #FDFDFD; display: block; font-size: 1.533em; height: 45px; padding: 0; width: 11.96em; -moz-border-radius: 0; -moz-box-shadow: none; -webkit-border-radius: none; -webkit-box-shadow: none } .optin .submit:hover { background-position: 0 -45px; cursor: pointer } .desc { padding: 2.2em 1.1em } .ribbon { color: #FDFDFD; float: right; height: 14em; margin-left: 1.5em; padding: 2.2em 1.5em; text-align: center; width: 9em } .ribbon h5 { font-size: 1.8em; letter-spacing: normal; line-height: 1.1em; margin-bottom: .3em } .ribbon p { font-size: 1.3em; line-height: 1.2em } /*-- FEATURE BOX --*/ #feature_box { background: #E6E6E6 url(images/feature_box.png) repeat-x top; overflow: hidden; padding: 2em 1.1%; text-shadow: 1px 1px 1px #FFF } #feature_box h4 { color: #444; font-size: 1.8em; font-weight: normal; margin-bottom: 0.1em; text-transform: uppercase } #feature_box p { color: #777; font-size: 1.5em; line-height: 1.471em } /*-------------------------------------------------------------------------------------------------------- CONTENT --------------------------------------------------------------------------------------------------------*/ .custom #content_box { background: url(images/sidebar.png) repeat-y 61.4em 0 /* may need adjusting if you change overall site width. see instructions included in download */ } .custom #content { background: url(images/gray_shadow.png) repeat-x } /*-- HEADLINES --*/ .custom .headline_area h1, .custom .headline_area h2, .custom #archive_intro h1 { letter-spacing: -1.5px; line-height: 1.08em } .custom div.format_text h3 { font-size: 1.5em; letter-spacing: -1px; margin: 0 0 0.2em 0; text-transform: none } .custom div.format_text h4 { color: #333; font-size: 1.3em; font-weight: normal; letter-spacing: -1px; text-transform: none } .custom div.format_text h5 { color: #888; font-size: 1em; font-weight: normal } /*-- POST STYLES --*/ .custom .format_text blockquote { background: url(images/blockquote.png) no-repeat top left; border: 0 } .intro, .custom .format_text blockquote { color: #8D8D8D; font-size: 1.15em; line-height: 1.483em } .custom .format_text .note { background: #EBEBEB url(images/note.png) repeat-x bottom; color: #888 } .custom .format_text .alert { background: #FBF7D9 url(images/alert.png) repeat-x bottom; color: #918c67 } .custom .format_text .note, .custom .format_text .alert { border: 0; margin: 0 -1.533em 1.467em -.733em } .custom .format_text ul, .custom .format_text ol { margin: 0 0 1.571em 0.8em } .custom .format_text li { border-bottom: 1px dashed #CCC; list-style-position: inside; margin-bottom: 1em; padding-bottom: 1em } .custom .format_text ul li { list-style-image: url(images/bullet.png) } .custom .format_text li:last-child { border: 0; margin: 0; padding: 0 } /*-- TEASERS --*/ .custom a.more-link { background: #EEE; border-bottom: .2em solid #DDD; color: #666; padding: .1em .4em; text-decoration: none } .custom a.more-link:hover { background: #3C3B3B; color: #FFF } .custom .teasers_box { background: url(images/teasers_box.png) repeat-x; padding-bottom: 0 } .custom .teaser h2 { letter-spacing: -1px; line-height: normal } /*------------------------------------------------------------------------------------------------------- COMMENTS --------------------------------------------------------------------------------------------------------*/ .custom #comments { clear: both; margin: 0 } .custom #comments_intro p { background: #F1F1F1; border: 0.15em solid #DDD; border-width: 0 .15em .15em 0; color: #888; display: inline-block; font-size: 1.6em; margin-top: 1em; padding: 0.2em 0.4em; text-transform: uppercase; -moz-border-radius: 5px; -webkit-border-radius: 5px } .custom #comments_intro span { font-size: inherit } .custom #comments_intro span.bracket { display: none } .custom #comment_list { background: #333; border: 0; clear: both; margin: 0; padding: 1.1em } .custom #comment_list dt, .custom #respond { background: #FFF url(images/gray_shadow.png) repeat-x } .custom #comment_list dd { background: #FFF; border: 0; padding-bottom: 1.1em; margin-bottom: 1.1em } .custom #comment_list dd:last-child { margin-bottom: 0 } .custom #comment_list dl.children dt { background: #FFF } .custom #comment_list dl.children dd { padding: 0 } .custom .comment-reply-link { background: #EEE; padding: 0.4em; -moz-border-radius: 5px; -webkit-border-radius: 5px } .custom #respond { border-top: 1px solid #DDD } .custom #respond_intro { padding-top: 2em } .custom #commentform { border: 0 } .custom #archive_intro { border-bottom: 1px dashed #BBB } #singlenav, .custom .prev_next { background: url(images/gray_shadow.png) repeat-x; border-top: 1px solid #DDD; list-style: none; overflow: hidden; padding: 1.5em 1.1em } #singlenav #previous { float: left; text-align: left; width: 45% } #singlenav #next { float: right; text-align: right; width: 45% } #singlenav h5 { font-size: 1.3em; font-weight: normal; padding-bottom: 0.1em; text-transform: uppercase } #singlenav a { font-size: 1.1em; line-height: 1.4em; text-transform: uppercase } #singlenav a:hover { text-decoration: underline } /*------------------------------------------------------------------------------------------------------- SIDEBAR --------------------------------------------------------------------------------------------------------*/ .custom .sidebar li.widget { background: url(images/sidebar_divider.png) repeat-x bottom; margin-bottom: 1em; padding-bottom: 1em } .custom .sidebar li.widget:last-child { background: none; padding: 0 } .custom .sidebar h3 { font-variant: normal; letter-spacing: -0.5px; text-transform: none } /*-- FEATURED --*/ #feat ul { list-style: none } #feat li { background: url(images/products_divider.png) repeat-x top; margin-top: 1em; padding-top: 1em } #feat h3 { color: #FDFDFD; font-size: 2.3em; letter-spacing: -.5px; } #feat p { color: #C2C2C2; font-size: 1.5em; line-height: 1.333em } #feat p.title { color: #EEE; font-size: 1.7em; margin-bottom: .105em } #feat p.title a { color: #EEE } #feat p.title a:hover { color: #888 } #feat span { color: #222; font-size: 1.7em; text-shadow: 1px 1px 1px #787878 } #feat img { border: 0.3em solid #505050; float: right; margin-left: 0.5em } /*-- OPTIN --*/ #single_optin { background: url(images/sidebar_divider.png) repeat-x bottom; padding: 2.2em 1.1em } #single_optin h3 { color: #555; font-size: 2.2em; letter-spacing: -.5px } #single_optin p { color: #636363; font-size: 1.5em; line-height: 1.4em; text-shadow: 1px 1px 1px #FDFDFD } #single_optin form { margin-top: .4em } #single_optin input { border: 1px solid #C9C9C9; border-width: 1px 0 0 1px; font-size: .9em; margin-top: .8em; padding: 1em 1em 1em 3em; width: 82.5%; -moz-border-radius: 6px; -webkit-border-radius: 6px } #single_optin .submit { border: 0; color: #FDFDFD; cursor: pointer; font-size: 1.9em; margin-top: .4em; padding: 0.263em 0; width: 100% } #single_optin input.submit:hover { padding: .263em 0 } /*------------------------------------------------------------------------------------------------------- FOOTER --------------------------------------------------------------------------------------------------------*/ .custom #footer { background: #3D3D3D url(images/footer.png) repeat-x; padding: 2.2em 1.1%; text-align: left; text-shadow: 1px 1px 1px #222 } .custom #footer ul { overflow: hidden } .custom #footer li li { float: none; font-size: 1.5em; margin: 0 0 .4em 1.1em; list-style: square; width: auto } #footer h3 { color: #1E1E1E; font-size: 1.9em; margin-bottom: .1em; text-shadow: 1px 1px 1px #636363; text-transform: uppercase } #footer p { line-height: 1.3em } .custom #footer a { border: 0; color: #EEE } .custom #footer a:hover { color: #BBB } #copyright { background: url(images/copyright.png) repeat-x top; clear: both; margin-top: 2em; padding-top: 1.9em } /*------------------------------------------------------------------------------------------------------- SHARED --------------------------------------------------------------------------------------------------------*/ #feat, #single_optin .submit:hover { background: #616161; padding: 2.2em 1.1em; text-shadow: 1px 1px 1px #333; -moz-box-shadow: 0 0 20px #333 inset; -webkit-box-shadow: 0 0 30px #333 inset } #feature_box ul, #footer ul { list-style: none } #feature_box li, #footer li { float: left; margin-right: 2%; width: 32% } #feature_box .last, #footer .last { margin: 0 } .custom #logo a, .optin h3, .optin .submit, .ribbon h5, #feature_box h4, .custom .headline_area h1, .custom .headline_area h2, .custom .format_text h3, .custom .format_text h4, .custom .format_text h5, .custom #archive_intro h1, .custom .teaser h2, #single_optin .submit, #feat h3, #feat span, .custom .sidebar h3, #single_optin h3, #respond_intro p, .custom #comments_intro p, #footer h3 { font-family: "Arvo", Arial, serif }