ianheggie/cruisecontrol.rb

body {
    background-color: #d3cdca;
    /* because of gradient and body image used for #bd.thick */
    /* background-image: url("../images/background.gif"); */
    background-position: top left;
    background-repeat: repeat-x;
    padding-top: 8px;
    color: #626b72;
    font-family: verdana, helvetica;  
}
em {
    /*color: #e65414;*/
    color: #F28218;
}
strong {
    font-weight: bold;
}

a {
    color: #687176;
}

a:hover {
    color: #000000;
}

/* disabled for now
a:visited {
    color: #b48f79;
} */

p {
    padding: 10px 8px;
    line-height: 1.5em;
}

input, select, textarea {
    border: 1px solid #bdbbb4;
    background-color: #f1f0ec;
    padding: 2px;
}

label {
    /*color: #e65414;*/
    color: #f28218;
    text-transform: uppercase;
    padding-right: 8px;
}

.button {
        background: url("../images/arrow_right.gif") no-repeat;
        background-position: 5px 50%;
        padding-left: 12px;
        text-transform: lowercase;
        border: none;
        color: #687176;
        font-weight: bold;
        text-align: left;
}

.image-button {
    border:none;
    background:none;
    padding: 0;
    vertical-align: bottom;
}

/* clearfix */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.inner {
    padding: 0 7px;
}

.box {
    clear: both;
    margin: 0px 0 0 0;
}
.first .box {
    margin: 0;
}
.box li, .list li {
    background: url("../images/arrow_right.gif") no-repeat;
        background-position: 5px 50%;
        padding-left: 12px;
    padding-bottom: 2px;
    border-bottom: 1px dotted #C0C0C0;
    margin-bottom: 2px;
    line-height: 1.5em;
}
.box h2 {
    margin-bottom: 0px;
}

.section {
    border: 1px solid #C0C0C0;
    padding: 7px;
    /* background: url("../images/curve.gif") top left no-repeat; */
}
    
    
/* major page elements - mainly derived from yui grids */

#doc {
    width: 907px;
}
/* main column*/    
.yui-t2 #yui-main .yui-b, .yui-t4 #yui-main .yui-b {
    width: 680px;
}
.yui-t2 .border #yui-main .yui-b, .yui-t4 .border #yui-main .yui-b {
    width: 651px;
}
/* side column */
.yui-t2 .yui-b, .yui-t4 .yui-b {
    width: 221px;
}


/* header */

#hd {
    padding: 7px;
    background: white;
    margin-bottom: 5px;
}

#hd #home-image-link {
    float: left;
  margin: 10px 0 7px 0;
}

#hd #top-nav-wrapper {
    height: 66px;
    position: relative;
    margin-left: 194px;
}

#hd #top-nav {
    position: absolute;
    text-align: right;
    bottom: 0;
    right: 0;
}

#hd #top-nav a {
    font-size: 120%;
  text-decoration: none;
  color: #626b72;
}

#hd #top-nav a.selected {
        /*color: #e65414;*/
        color: #f28218;
}

#hd #top-nav a:hover {
    text-decoration: underline;
    color: #000000
}

#hd hr {
        clear: both;
        border: none;
    width: 100%;
    height: 4px;
    background-color: black;
    color: black;
    margin: 7px 0;
}
    
#hd #thoughtworks-logo {
        background: url("../images/arrow_left.gif") no-repeat;
        background-position: 0% 70%;
        padding-left: 8px;
    float: left;
}

#hd #search {
    float: right;
    text-align: right;
}


/* body */

#bd {
    background-color: white;
    padding-top: 8px;
    padding-bottom: 19px;
}
#bd.thick {
    background-image: url("../images/body_bg_thick.gif");
    background-repeat: repeat-y;
    background-position: top left;
}
.border {
    border: 1px solid #C0C0C0;
    margin: 0 10px;
    padding: 10px 5px;
    background: url("../images/body_bg.gif") repeat-y;
    background-position: top left;
}


/* footer */

#ft div.copyright {
    float: right;
        padding-right: 10px;
}
#ft div.links {
        padding-left: 10px;
    float: left;
}
#ft a {
    text-decoration: none;
    color: #626b72;
}
#ft a:hover {
    text-decoration: underline;
}


/* home page */

#mingle-links {
    margin: 3px 0 6px 0;
}
    
p#panel-intro {
  display:none;
}


/* blog */

.blog {
    margin: 0px 0 14px 0;
    position: relative;
    clear: both;
}
/*
.blog.summary .body {
    border-bottom: 1px solid #C0C0C0;
}
*/
.blog img.author {
    padding: 2px;
    position: absolute;
    left: 0;
    top: 0;
}
.blog .content {
    margin-left: 0px;
}    
.blog h3.title {
    font-size: 130%;
    padding-bottom: 2px;
    margin-top: 7px;
    margin-bottom: 2px;
    border-bottom: 1px solid #C0C0C0;
    font-weight: normal;
    clear: both;
    /*color: #687176; */
    /*color: #E65414;*/
    color: #f28218;
}
.metadata .whowhen {
    float: left;
}

.metadata .where {
    float: right;
}

.metadata dt {
    color: ;
    display: inline;
}

.metadata dd {
    display: inline;
}

.metadata {
    padding-bottom: 7px;
    border-bottom: 1px dotted #C0C0C0;
}
.blog .body {
    clear: both;
    padding: 7px 0;
}
.blog ul.links {
    border-top: 1px dotted #C0C0C0;
    border-bottom: 1px dotted #C0C0C0;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 2em;
    float: left;
    width: 100%;
}
.blog .standalone {
    margin-bottom: 10px;
}
.blog .tags {
    border-bottom: 1px dotted #C0C0C0;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 2em;
}

.blog .links li {
    float: left;
}
.blog .links a {
    display: block;
    padding: 5px 0 0 20px;
    color: #687176;
    margin-right: 1em;
    background-repeat: no-repeat;
    background-position: center left;
}
.blog .links a.permalink {
    background-image: url("../images/permlink.gif");
}
.blog .links a.sendfriend {
    background-image: url("../images/sendfriend.gif");
}
.blog .links a.trackback {
    background-image: url("../images/trackback.gif");
}
.blog .links a.rss {
    background-image: url("../images/rss.gif");
}
.blog .commentator {
        background: #f1f0ec;
        float: left;
        width: 100%;
}
.blog .commentator cite {
        float: left;
        padding: 4px;
        /*color: #e65414;*/
        color: #f28218;
}
.blog .commentator .when {
        float: right;
        padding: 4px;
}
.blog label {
    float: left;
    width:    28%;
}
.blog .fields input, .blog .fields textarea, .blog .fields select {
    margin-left: 30%;
    display: block;
    width: 60%;
    margin-right: 2%;
}
.blog input.button {
    margin-left: 30%;
}
.blog form p {
    clear: both;
}
.blog cite a {
    /*color: #e65414;*/
    color: #f28218;
}
#comment-errors {
    /*color: #e65414;*/
    color: #f28218;
    font-weight: bold;
    /*border: 1px solid #e65414;*/
    border: 1px solid #f28218;
    margin: 5px;
    padding: 5px;
    list-style-type: disc;
    list-style-position: inside;
}
#comment-errors li {
    margin: 2px 0;
}


/* headings */

h3 {
    /*color: #E65414;*/
    color: #f28218;
    padding: 0px 0;
    margin-bottom: 7px;
}
/* used in blog summary heading */
h3 a {
    text-decoration: none;
}
h3 a:hover {
    text-decoration: underline;
    color: black;
}
h2 {
        clear: both;
        font-size: 110%;
        /*color: #E65414;*/
        color: #f28218;
        font-weight: bold;
        background: url("../images/hdbg.gif") top left repeat;
        padding: 4px;
        margin-bottom: 10px;
}
h2.with-links {
    float: left;
    width: 100%;
    padding: 0;
}
h2 strong {
    float: left;
    margin: 4px;
}
h2.with-links a {
    display: block;
    padding: 7px 20px 0 0;
    margin-right: 4px;
    color: #687176;
    background-repeat: no-repeat;
    background-position: center right;
    float: right;        
    font-size: 85%;
}
h2.with-links a.rss {
    background-image: url("../images/rss.gif");
}
h1 {
    clear: both;
    font-size: 130%;
    color: white;
    background: #a2c8ff url("../images/hdbg_grad.gif") top left repeat-y;
    padding: 4px;
    margin-bottom: 10px;
    font-weight: normal;
    border-top: 1px solid #507ec0;
    border-left: 1px solid #507ec0;
    border-right: 1px solid #a2c8ff;
}
h1 strong {
    color: black;
    font-weight: bold;
}
.header-image {
    display: block;
    margin-bottom: 6px;
}

/* special links */

a.read-more,
a.strong-link {
    background: url("../images/arrow_right.gif") no-repeat;
    background-position: 5px 50%;
    padding-left: 12px;
    text-transform: lowercase;
    text-decoration: none;
    border: none;
    font-weight: bold;
    color: #687176;
    font-size: 90%;
}
a.read-more:hover, a.strong-link:hover {
    color: black;
    text-decoration: underline;
}


/* reset some styles for blog entries */
.body {
    line-height: 1.5em;
}
.body ul {
    margin: 7px 0;
    list-style: disc outside;
    padding-left: 20px;
}
.body li {
    margin: 7px 0;
  line-height: 1.5em;    
}
.body p {
    padding: 7px 0;
}

/* email me box */

#email-blog {
    text-align: center;
}
#email-blog form {
    border-bottom: 1px dotted #C0C0C0; 
    padding-bottom: 7px;
    margin-bottom: 7px;
}
#email-blog.box p {
    background-color: none; 
}
#email-blog input {
    /* this shouldn't be hard coded but 100% is causing problems */
    width: 186px;
}
#email-blog input.image-button {
    padding:8px 0 4px;
    border: none;
    width: auto;    
}
#email-blog .links {
    text-align: right;
    padding: 0 0 4px 0;
}


/* thoughtworks studios box */

#tws {
    margin-top: 7px;
    background: url("../images/twos_bg_top.gif") top left no-repeat;
}
#tws p {
    background: url("../images/tws_bg_bottom.gif") bottom left no-repeat;
}
#tws img {
    margin: 14px 0 3px 30px;
}


/* keep in touch */

#kit input {
    /* this shouldn't be hard coded but 100% is causing problems */
    width: 186px;
}
#kit input.image-button {
    padding:8px 0 4px;
    width: auto;
    border: none;
}
#kit {
    padding-top: 94px;
    background: url("../images/kit_bg_top.gif") top left no-repeat;
    text-align: center;
}
/* not currently used because image doesn't overlay well */
#kit img {
    margin: 14px 0 3px 30px;
}
#kit .inside {
    background: url("../images/kit_bg_bottom.gif") bottom left no-repeat;
    padding-bottom: 6px;
}
#kit form {
    text-align: center;
}