/* 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/ */ /* --------- TWITTER CONFERENCE SITE ------------- */ .custom #header { border-bottom: 0px double #82A237; } /* adding header image */ .custom #header { background: url('images/140tc-la.jpg') no-repeat; height: 95px; padding-bottom: -10;} .custom #logo a {display:block; width:900px; height:95px; text-indent:-9999px;} /* mimicing the twitter look with a background image */ body.custom {background: #94e4e8 url('images/bg.gif');} .custom #page {background: white; margin-top: 20px; -moz-border-radius: 5px; } /****************************** Conference Schedule Page - split into columns for two-track event *******************************/ /* Building the two-column structure */ .custom #column1 {width: 48%;} .custom #column2 {width: 48%; float: right;} .custom h3.top {margin-top: 0; color: #88B9C1; font-size: 200%; font-weight: bold;} /* styling tables for the event schedule */ .custom .time {width: 6em;} .custom table {background: #eee; border: 1px solid #ddd; padding: .5em;} .custom hr {text-align: left;} .custom td {border: 1px solid #ddd; padding: .5em; background: #fff;} /* special styling so that the ticket pricing list doesn't look crappy */ .custom .ugh {line-height: 90%; padding-left: 1em; padding-top: .5em; padding-bottom: .5em;} /* making a the speakers list in the session grid look a little bit awesome */ .custom .speakers {font-size: 90%; color: #555; margin-bottom: .2em;} .custom .speakers a {color: #555;} /* putting some division into the expanded session list */ .custom .session {border-bottom: 1px dotted #ddd; margin-bottom: 1.5em;} .custom .speakers2 {font-size: 90%; color: #555; margin-bottom: 1em;} .custom .speakers2 a {color: #555;} /* adding an extra style so that things "pop"...don't fracking ask */ .custom h4 {font-family: Trebuchet MS; font-size: 110%} .custom h3 {font-size: 140%;} .custom .sch3 { background: #88B9C1; color: white; padding-left: 2px; padding-top: 1px; padding-bottom: 1px; text-align-center;} /* making a custom alertbox color */ .custom .alertbox {background: #9AE4E8; border: 1px solid #88B9C1; padding: .5em; padding-left: 1em;} /* positioning the hashtag image */ .custom .hashtag {margin-top: -12em; margin-left: 0em;} /************************ Custom work for the social media tweeting / twitturly mashup page *************************/ .custom .numtweets {float: left; width: 60px; height: 55px; margin-right: .8em; color: #1F607D; background: #DEEEF2; padding: .3em; border: 1px solid #c8e6ee;} /* eliminating the bullets */ .custom .cets_embedRSS { list-style-type: none; margin-left: 0;} /* hacking the format to make the items line up */ .custom .tweetbox {width: 69%; margin-top: 1.4em; padding-bottom: 1.7em;} /* adding a kind of sidebar-ish thing, which is easier than using the regular sidebars, mostly because I don't want to research how to set it up that way and I'm in a hurry. Long term, it's probably cleaner to use the built-in Thesis structure */ .custom .twitsidebar {width: 200px; float: right; margin-right: 3.5em; margin-top: -1px;} /* Setting font in text areas */ .custom .topic {font-family: Lucida Grande, Trebuchet MS, Sans-Serif; font-size: 1.1em; font-weight: bold; line-height: 85%;} .custom .numtweets {font-family: Lucida Grande, Trebuchet MS, Sans-Serif; font-size: 1.2em; text-align: center;} .custom .rssSummary {font-family: Lucida Grande, Trebuchet MS, Sans-Serif; font-size: .8em;} .custom .topic a {text-decoration: none; color: #1F607D;} .custom .topic a:hover {text-decoration: underline;} /************************ Styling the "who's coming" page so that we can show off how cool our guest list is ;) *************************/ .custom .attendee {float: left; width: 290px; height: 78px; margin: 0 10px 15px 0; padding: 5px 2px 4px 7px; overflow: hidden; font-size: 80%; line-height: 150%; -moz-border-radius: 6px; background: #efefef; border: 1px solid #ddd;} .custom .attendee img {float: left; margin-right: .5em; width: 73px; height: auto;} .custom .attendee .photowrapper {float: left;} /* .custom .attendee an {font-size: 130%; font-weight: bold; font-family: 'Trebuchet MS', Sans-Serif; padding-bottom: 3px; color: black;} */ /* Make sure that the web and org lines are limited to one */ .custom .atline {width: 200px; height: 19px; overflow:hidden; word-wrap: break-word;} .custom .twitwrapper {width: 70%; border: 1px solid black; float: left;} .custom .namewrapper {font-size: 130%; font-weight: bold; font-family: 'Trebuchet MS', Sans-Serif; padding-bottom: 3px; color: black;} /* And now, for Mountain View attendees */ .custom .mountainview {float: left; width: 290px; height: 78px; margin: 0 10px 15px 0; padding: 5px 2px 4px 7px; overflow: hidden; font-size: 80%; line-height: 150%; -moz-border-radius: 6px; background: #ddd;} .custom .mountainview img {float: left; margin-right: .5em; width: 73px; height: auto;} /* .custom .mountainview an {font-size: 130%; font-weight: bold; font-family: 'Trebuchet MS', Sans-Serif; padding-bottom: 3px; color: black;} */ /* Making sure the page is properly split by attendees */ .custom .mntvsplit {float: left; font-size: 1.1em; width: 900px; color: #555; border-bottom: 2px solid #aaa; padding-bottom: .2em; margin-bottom: 1.5em;} /********* Modifying the who's coming style for the test page so I can make a custom background for the Twitter 140tc page ***********/ .custom .attendee-twt {width: 180px; height: 45px; margin: 0 10px 15px 0; padding: 5px 2px 4px 7px; overflow: hidden; font-size: 80%; line-height: 150%; -moz-border-radius: 6px; background: #efefef; border: 1px solid #ddd;} .custom .attendee-twt img {float: left; margin-right: .5em; width: 43px; height: auto;} .custom .attendee-twt .photowrapper {float: left;} .custom .attendee-twt .atline {height: auto; width: auto;} /************ The speaker images on the home page *************/ .custom #speaking-rotator {height: 470px; width: 520px; padding-bottom: .2em;} .custom .spkr-promo {float: left; padding-right: 1.3em;}