/* 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/ */ @font-face { font-family: 'Mentone'; src: url('type/mentone-reg-webfont.eot'); src: local('Mentone'), url('type/mentone-reg-webfont.woff') format('woff'), url('type/mentone-reg-webfont.ttf') format('truetype'), url('type/mentone-reg-webfont.svg#webfont3m1Mdk0Y') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Mentone'; src: url('type/mentone-bol-webfont.eot'); src: local('Mentone'), url('type/mentone-bol-webfont.woff') format('woff'), url('type/mentone-bol-webfont.ttf') format('truetype'), url('type/mentone-bol-webfont.svg#webfontOmdy7sMK') format('svg'); font-weight: bold; font-style: normal; } .custom #header #tagline, .custom #header h1#tagline { float: right; margin-top: -126px; color: #181001; text-transform: uppercase; font-size: 1.7em; font-weight: bold; font-family: "Mentone", Verdana, Arial, sans-serif; letter-spacing: 1px; } body.custom {background: #bda579 url('images/bg-body.png') repeat; font-family: Verdana, Arial, sans-serif;} h1, h2, h3, h4, h5, h6 {font-family: "Mentone", Verdana, Arial, sans-serif; letter-spacing: 1px} /*-- This is a temporary font set up. Should use either Typekit or @font-face --*/ .custom a {font-weight: bold; outline: none;} .custom a:focus { outline: 1px dotted; } .custom h1 {font-weight: bold;} .custom .page h2 {} .custom .page h4 {color: #601c07;} .custom .wp-caption {padding: 0;padding-bottom: 5px;background: #dbcfb4; border: 1px solid #cec2a6;} .custom img {border: 1px solid #e0dfd4;} .custom .wp-caption img {border: none;} .pageBlog img {border: none;} /*------ Header and Nav ------*/ .custom #header_area .page #header {padding: 0; width: 980px; } .custom .menu {width: 640px; text-align: right; float: right; border: none; margin: 0; margin-top: 59px;} .custom .menu li {width: 128px; text-align: center; border-top: 8px solid #181001;} .custom .menu li a {height: 67px; line-height: 67px; padding: 0; font-weight: bold; font-size: 13px; font-family: "Mentone", Verdana, Arial; } .custom .menu li.portfolio-nav {border-top: 8px solid #1f3c55; border-image: url(images/bg-nav-bluebar.jpg)} .custom .menu li.services-nav {border-top: 8px solid #34530a;} .custom .menu li.about-nav {border-top: 8px solid #a76b14;} .custom .menu li.contact-nav {border-top: 8px solid #a0400a;} .custom .menu li.blog-nav {border-top: 8px solid #9b1a1c;} .custom #yoastbreadcrumb {padding:2em 0 0 20px; margin: 0; margin-bottom: 0px; text-transform: lowercase; color: #6b5a35} .pagePortfolio #yoastbreadcrumb, .pageAbout #yoastbreadcrumb, .pageTeam #yoastbreadcrumb, .pageServices #yoastbreadcrumb, .pageContact #yoastbreadcrumb {margin-bottom: -10px} .pageHome #yoastbreadcrumb, .pageBlog #yoastbreadcrumb {display: none;} .pageServices .headline_area, .pageAbout .headline_area, .pageTeam .headline_area, .pageContact .headline_area {border-bottom: 3px solid #181001;} .pageBlog .headline_area {} .custom .headline_area h1 {text-transform: uppercase;} .custom .page {background: none;} .custom #content_area div.page {background: #f5f3ea; padding-bottom: 20px;} .custom #content_area #content_box {padding: 0; width: 980px} .custom #logo a { background-image: url('images/img-logo.png'); /*replace logo.png with the name of your image*/ width: 320px; /*change this to the width of your image*/ height: 134px; /*change this to the height of your image*/ background-repeat: no-repeat; display: block; text-indent: -9999px; } .custom .full_width .page {padding: 0; width: 980px;} .custom #header_area {margin-bottom: 20px;} /*------ Custom Banners ------*/ .banner {height: auto; background: #f5f3ea; width: 980px; margin: 0 auto; border-top: 10px solid #9b1a1c; padding: 0; } .custom .banner img {margin: 0; padding: 0; border: none; bottom: 0;} .pageHome .banner {border: none;} .pagePortfolio .banner {height: 196px; border-top: 10px solid #1f3c55;background: #181001 url('images/banner-portfolio.jpg') no-repeat top left;} .pageServices .banner {height: 196px; border-top: 10px solid #34530a;background: #181001 url('images/banner-services.jpg') no-repeat top left;} .pageAbout .banner {height: 196px; border-top: 10px solid #a76b14; background: #181001 url('images/banner-about.jpg') no-repeat top left;} .pageTeam .banner {height: 196px; border-top: 10px solid #a76b14; background: #181001 url('images/banner-team.jpg') no-repeat top left;} .pageContact .banner {height: 196px; border-top: 10px solid #a0400a; background: #181001 url('images/banner-contact.jpg') no-repeat top left;} .pageBlog .banner {height: 196px; background: #181001 url('images/banner-blog.jpg') no-repeat top left;} .portfolio .banner {border-top: 10px solid #1f3c55;} /* .custom #content_box {border-top: 10px solid #9b1a1c; padding-bottom: 20px;} .pageHome #content_box {border: none;} .pagePortfolio #content_box {border-top: 10px solid #1f3c55;} .pageServices #content_box {border-top: 10px solid #34530a;} .pageAbout #content_box {border-top: 10px solid #a76b14;} .pageContact #content_box {border-top: 10px solid #a0400a;} */ /*------ Content ------*/ .custom #content_box {padding-bottom: 20px;} .custom .post_box, .custom .teasers_box {padding:0; margin: 0;} .custom .post_box, .custom .teasers_box {margin-left: 20px; margin-top:20px;} .custom .post_box {margin-top: 15px;} .custom #respond_intro p {margin-left: 20px;} .custom #respond #commentform p, .custom #respond #respond_intro {margin-left: 0;} .custom #comments div#respond form#commentform {padding-left:20px} .custom .sidebar ul {padding: 20px 20px 0 0; } /*------ Blog Styles ------*/ .pageBlog .post_box {border-bottom: 1px dotted #dbcfb4;} .date {background: #181001; color: #f5f3ea; float: left; width: 63px; text-align: center;font-weight: bold;} .month {font-size: 1.8em; text-transform: uppercase; line-height: 1em; display:block; margin: 10px 0 0 0 ;} .day {font-size: 3.3em;line-height: 0em; } /* Had to add IE specific item */ .year {font-size: 1.5em; line-height: 1em;} .date {margin: 0 1em 0 0} .pageBlog .date {padding: 0; margin: 0; float: left;} .custom .post .entry-title {margin-top: -5px; line-height: 1.3em;} .custom .post .headline_area {clear: both; min-height: 83px;} .custom .headline_meta {display: inline;} /*------ Teaser Styles/Blog Excerpts ------*/ /*.custom .teaser { width: 100%; margin-top: 2em; padding-top: 0; padding-bottom: 2em; border-bottom: 1px dotted #bbb; text-align: left; float: none; } .custom .teaser_right {float: none;} .custom .teasers_box { padding-top: 0; padding-bottom:0; border-top: 0; } */ .teaser-img {width: 540px; float: right; display: block; background: #181001;} .teaser .teaser-img {width: 220px;} .pageBlog .post_box {width: 620px; margin-top: 2em;} .date, .teaser-img {height: 82px; border: 3px double #f5f3ea; }/* Had to add IE specific item */ .teaser-head {margin-bottom: .5em;} .custom .teaser h2.entry-title, .pageBlog .post h2.entry-title {float: left; margin-top: .5em;margin-bottom: .7em; display: block; width: 100%; } .pageBlog .post h2.entry-title {margin-bottom: .1em;} .pageBlog .post_box {background: url('images/bg-post-excerpt.png') bottom left no-repeat;} /* .custom .teaser {position: relative;} .custom img.thumb {margin: 0; position: absolute; right: 3px;top: 3px;} */ /* .custom .teaser {position: relative;} .custom .teaser h2.entry-title {position: absolute; left: 94px; top: 20px; z-index: 20; width: 65%; line-height: 1.2em; } .custom .teaser h2.entry-title a:link, .custom .teaser h2.entry-title a:visited {color: #f5f3ea;text-shadow: 0px 2px 0px #181001} .custom .teaser h2.entry-title a:hover, .custom .teaser h2.entry-title a:active {color: #e6e4d9;text-shadow: 0px 0px 0px #181001; } .custom .teaser .entry-content {padding-top: 105px;} */ /*.custom span.teaser_author {color: white ;display: block; position: absolute; left: 95px; top: 55px; z-index: 20; } .custom span.teaser_author .author a, .custom a.teaser_category {text-decoration: none; border: none;}*/ .custom span.teaser_author {padding-right: 5px; margin-right: 5px; border-right: 1px solid #bbb;} .custom .teasers_box .entry-title {font-size: 2em; } /*------- Twitter related -------*/ .custom .twitter_box {width: 620px; height: 84px; background: url('images/bg-twitter.png') top left no-repeat; margin: 20px 0 0 20px;} .custom .twitter_box p {padding: 10px 10px 10px 85px; font-size: 13px; line-height: 1.5em;} .custom .twitter_box ul li {list-style: none; margin: 0; padding: 0; padding: 8px 10px 10px 0px; font-size: 13px; line-height: 1.5em;} .custom .twitter_box ul {float: right;width: 535px} .custom .twitter_box a.linkbox {width: 80px; height: 84px; display: block; float: left;} /*-------- Template Specific --------*/ .custom .no_sidebars .post_box {padding-right: 20px;} .custom .aside {width: 300px; float: right; margin: -20px 0 0 20px;} .custom .sidebox {background: #181001;padding: 20px; color: #f5f3ea} .custom .sidebox h2 {font-weight: normal; color: #f5f3ea; font-size: 1.58em; margin: 0; margin-bottom: .5em;} .custom .sidebox h3 {color: #dbcfb4; margin: 0; margin-bottom: .7em; font-size: 1.1em; line-height: 1.5em; text-transform: none;} .custom .sidebox p {margin-bottom: .5em;} .custom .sidebox ul {margin-bottom: .9em;} .pageTeam .page h3 {margin: 0;} .pageTeam .page h4 {margin-bottom: .6em;} .profile {border: 1px solid #ac9b77; width: 456px; float: left; background: #dbcfb4;} .profile div {border: 1px solid #f5f3ea;padding: 10px; height: 270 !important; min-height: 270px;} .profile p.thumb {display:inline;} .profile.top {margin-bottom: 20px;} .profile.right {float: right;} .pageTeam img.alignleft, .pageTeam img.alignright {margin-bottom: .5em;} /*-------- Footer (and Links of Sidebox) --------*/ .custom #footer {height: 63px; padding:0; background: #181001 url('images/img-footer-logo.png') top right no-repeat; text-align: left; margin-top: 20px; } .custom #footer p {font-size: 13px; padding: 10px 0 0 20px} .custom #footer a, .custom .sidebox a {text-decoration: none; border: none; font-weight: normal;} .custom #footer a:link, .custom #footer a:visited, .custom .sidebox a:link, .custom .sidebox a:visited, .blogFooter a:link, .blogFooter a:visited {color: #4780ae} .custom #footer a:hover, .custom #footer a:active, .custom .sidebox a:hover, .custom .sidebox a:active, .blogFooter a:hover, .blogFooter a:active {color: #67a0ce} .blogFooter {background: #181001; color: #f5f3ea; padding: 0px;} /* footer widget area setup */ #footer_setup { background: none; padding:1.5em; margin-bottom: 0px; overflow: hidden; } #footer_setup a {font-weight: normal;} #footer_setup .footer_items { text-align: left; width: 300px; padding-right:20px; display: inline-block; float: left; height: 100%;} #footer_setup .last {padding-right: 0;} #footer_setup .footer_items h3 { font-size: 1.5em; font-weight: bold; text-transform: uppercase; letter-spacing: 0px; padding-bottom: 3px; border-bottom: 8px solid #f5f3ea; margin-bottom: 5px; } #footer_setup .footer_items ul li { list-style:none; margin: 0; padding: 0; font-size:1.3em; line-height:1.5em;} #footer_setup .footer_items ul { margin: 0em; padding: 0px; } /*------ Misc. Styles ------*/ a.btn-quote {display: block;width: 300px; height: 58px; background-image: url('images/btn-quote.png');} .clear:after { content:"."; display: block; height: 0; font-size: 0; clear: both; visibility: hidden; } .clear {min-height: 1px;} br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */ .articleLink {display: block; margin-bottom: 1em; font-size: 1.2em;text-align: right;} /*------ Contact form ------*/ .custom .cform {float:left; width: 600px;color: #181001; font-family: Verdana, sans-serif; } .custom .cform label, .custom .cform .sendbutton {font-family: Verdana; background: #181001; border: 1px solid #cec1a3; color: #f5f3ea;width: 148px;} .custom .cform input, .custom .cform textarea, .custom .cform .area, .custom .cform .single, .custom .cform select {color: #181001; background: #dbcfb4; border-top: 1px solid #968f80;border-left: 1px solid #968f80; } .custom .cform .area {width: 410px; } .custom .cform ol li {padding-bottom: 20px;} .custom .linklove, .custom .linklove a, .custom .linklove a:visited {display: none;} .custom .success {float: left; background: #a0400a; color: white; font-weight: bold;} /*--------------- Home -------------*/ #home-sidebar-1, #home-sidebar-1 .widget {width:300px;float:left;} #home-sidebar-2, #home-sidebar-2 .widget {width:300px; float:left;} #home-sidebar-3, #home-sidebar-3 .widget {width: 300px;float: left; margin: 0; } #home-sidebar-1, #home-sidebar-2, #home-sidebar-3 {margin-left: 20px; position: relative;} .custom #home-sidebar-1 h3, .custom #home-sidebar-2 h3, .custom #home-sidebar-3 h3 {text-transform: uppercase; font-size: 1.3em; padding-bottom: .2em; font-weight: bold; font-family: "Mentone", Verdana, Arial, sans-serif;} #home-sidebar-1 h3 {border-bottom: 8px solid #1f3c55;} #home-sidebar-2 h3 {border-bottom: 8px solid #a76b14;} #home-sidebar-3 h3 {border-bottom: 8px solid #9b1a1c;} .pageHome .sidebar h4 {font-size: 1.3em; margin-bottom: 1em; line-height: 1.4em;} .pageHome .sidebar_list {width: 300px; margin: 0; padding: 0;} .pageHome .sidebar_list li, .pageHome .sidebar_list li ul {margin: 0; padding: 0;} .pageHome .sidebar_list li ul li {margin-bottom: 1em; border-bottom: 1px dotted #dbcfb4; padding-bottom: 1em;} .pageHome #content {width: 100%; padding: 0; clear: both; margin: 0;} .pageHome .post_box {padding: 0; clear: both; width: 100%; margin: 0 0 0 20px;} .pageHome #content p {margin: 0;} .pageHome .headline_area {display: none;} .homeslider {height: 351px; background-color: #181001; background-image: url('images/banner-home-bg.jpg'); border-bottom: 3px solid #181001; color: #f5f3ea;} .pageHome .big-button {width: 300px; float: left; margin-right: 20px; margin-top: 0;} img.big-button {border: none;} .custom #sidebars {padding: 20px 20px 0 0;} .custom #sidebars h3, .custom .sidebar h3, .custom .widget h3 {text-transform: uppercase; color: #181001; font-weight: bold; font-size:1.1em; padding-bottom: .2em; font-family: "Mentone", Verdana, Arial, sans-serif; font-variant: normal } .custom #sidebars ul {margin: 0; padding: 0;} .custom #sidebars #categories-3 ul li {margin-bottom: 1em; border-bottom: 1px dotted #dbcfb4; padding-bottom: 1em;} .custom #sidebars #categories-3 h3 {border-bottom: 8px solid #9b1a1c } .custom #sidebars #text-3 h3 {border-bottom: 8px solid #a76b14;} .custom #sidebars h4 {font-size: 1.1em; margin-bottom: .9em; line-height: 1.1em;} .custom #sidebars #text-4 h3 {border-bottom: 8px solid #1f3c55;} .custom #search {background: #dbcfb4; height: 30px; margin-bottom: 2em; padding: 0;} .custom #search p {border: 1px solid #ac9b77} .custom #search input {background: #dbcfb4; color: #181001; border: 1px solid #f5f3ea; width: 253px; height: 20px;} /*------------ Search -------------*/ .search_form {margin-bottom: 2em; clear: both; display: block; border: 1px solid #ac9b77; } .search_form .text_input {background: #dbcfb4; width: 255px; height: 22px;float: left; border: 1px solid #f5f3ea; color: #181001} input#searchsubmit {width: 35px; height: 30px; position: absolute; background: #181001 url('images/bg-search.png') top left no-repeat; } /*----------- Comments ------------*/ .custom #comments {margin: 0; width: 620px; margin-left: 20px;} .custom #respond {padding: 0; margin: 0;} .custom #respond_intro p {color: #181001; font-weight: bold; font-family: "Mentone", Verdana, Arial, sans-serif;} #commentform textarea, #commentform input {background: #dbcfb4; border-top: 1px solid #ac9b77; border-left: 1px solid #ac9b77} .prev_nav, .post_nav {padding-left: 20px;} /*------------ Portfolio --------------*/ #tabs {min-height: 600px; margin-top: 1.5em;} #tabs ul {padding: 0; margin: 0; list-style-type: none;} #tabs .ui-tabs {padding: 0;} #tabs .thumb {width: 634px; margin-right: 20px; float: left; } #tabs .panel ul li {clear: both; margin-top: 1em; padding-bottom: 1em; border-bottom: 1px dotted #dbcfb4;} .pagePortfolio .headline_area {margin-bottom: 0;} .pagePortfolio .post-meta span {margin-bottom: .5em;} .pagePortfolio .panel a {font-weight: normal} .pagePortfolio .panel .read-more {margin-top: 0; } .pagePortfolio .panel .read-more img {border: none;} .pagePortfolio .backtotop {display: block; width: 22px; height: 22px; background: url(images/up-arrow.png); float: right; text-align: right;} .pagePortfolio .backtotop span {text-indent: -9999px;} .meta-client-name, .meta-services, .meta-url, .meta-summary, .meta-main-focus {display: block; margin-bottom: .5em;} .pagePortfolio .panel {font-size: .85em;}