body,html {
    background-color:#111;
    }

.clear {
    clear:both;
    }

#pg {
    background-color:#000;
    color:#fff;
    left:0;
    margin:0;
    padding:0;
    position:absolute;
    top:0;
    width:100%;
    }

#hd {
    background-color:#000;
    color:#fff;
    height:35px;
    left:0;
    margin:0;
    overflow:hidden;
    padding:0; /* 3px 6px; */
    position:absolute;
    top:0;
    width:100%;
    }
    #hd h1 {
        background:transparent url(/images/mdd.gif) no-repeat 0 0;
        float:left;
        height:35px;
        margin:0;
        padding:0;
        text-align:left;
        width:368px;
        }
        #hd h1 em {
            display:none;
            x-font-size:138.5%;
            x-font-weight:bold;
            x-line-height:40px;
            }
    #hd h2 {
        clear:right;
        color:#999;
        display:none;
        float:right;
        font-size:85%;
        font-family:"Lucida Grande";
        font-weight:normal;
        margin:0;
        padding:0;
        x-margin:1em 3em 0 0;
        }
    
    /*
     * Progress bar
     */
    #hd #progress {
        x-moz-border-radius:1.33em;
        x-webkit-border-radius:1.33em;
        x-border:0.4em solid #fc0;
        background-color:#333;
        clear:right;
        float:right;
        x-height:2em;
        margin:5px 10px 0 0;
        padding:0; /* 0.3em; */
        position:relative;
        text-align:left;
        width:400px;
        }
        #hd #progress #sum_donations {
            background-color:#fc0;
            color:#000;
            display:block;
            font-weight:bold;
            height:20px;
            line-height:20px;
            padding:0; /* .2em 0.3em; */
            text-align:right;
            width:2em;
            z-index:9;
            }
        #hd #progress #livestrong {
            color:#fff;
            display:none;
            font-size:1.5em;
            height:1.5em;
            line-height:1.5em;
            x-margin:0.2em;
            padding:0; /* .2em 0.3em; */
            position:absolute;
            left:1em;
            text-align:center;
            top:0.2em;
            z-index:3;
            }
        
#bd {
    background-color:#111;
    margin:0; /* 70px auto 0 auto; */
    overflow:hidden;
    padding:0;
    position:relative;
    width:100%;
    }
    #bd h2 {
        font-size:123.1%;
        font-weight:bold;
        }
#followers {
    background-color:#fff;
    border:0;
    list-style:none;
    margin:0;
    padding:0;
    width:100%;
    }
    #followers .followerRow {
        border:0;
        display:block;
        clear:both;
        list-style:none;
        margin:0;
        padding:0;
        }
        #followers li.followerCol {
            background-color:#ccc;
            border:0;
            display:block;
            float:left;
            list-style:none;
            margin:0;
            padding:0;
            }
        #followers li a,
        #followers li a img {
            border:0;
            display:block;
            margin:0;
            padding:0;
            }
        #followers li a {
            x-border:2px solid transparent;
            x-border:1px solid transparent;
            }
            #followers li a:hover {
                x-border:2px solid #3cf;
                x-border:1px solid #3cf;
                }
        #followers li.lgAv a img {
            height:48px;
            width:48px;
            }
        #followers li.smAv a img {
            height:24px;
            width:24px;
            }
#followers .follower {
    background-color:#fff;
    border:0;
    height:48px;
    margin:0;
    padding:0;
    position:absolute;
    width:48px;
    z-index:4;
    }
    #followers .follower img {
        border:0;
        height:48px;
        margin:0;
        padding:0;
        width:48px;
        }
#followers #dialog {
    background-color:#3cf;
    border:0;
    color:#111;
    height:288px; /* 240, 288 */
    left:240px;
    margin:0;
    padding:0;
    position:absolute;
    top:96px;
    width:528px; /* 480, 528 */
    z-index:9;
    }
    #followers #dialog #info_dialog {
        background-color:#cef;
        height:272px; /* 224 = 48 * 5 - 16, 272 = 48 * 6 - 16 */
        left:8px;
        margin:0;
        padding:0;
        position:absolute;
        top:8px;
        width:512px; /* 464 = 48 * 10 - 16, 512 = 48 * 11 - 16 */
        z-index:11;
        }
        #followers #dialog #info_dialog h1 {
            font-size:138.5%;
            font-weight:bold;
            padding:0.5em;
            }
        #followers #dialog #info_dialog h2 {
            font-size:116%;
            font-weight:bold;
            padding:0.8em 0.5em;
            }
        #followers #dialog #info_dialog h3 {
            font-size:108%;
            font-weight:bold;
            padding:0.8em 0.5em;
            }
        #followers #dialog #info_dialog img.drew {
            border:1px solid #acd;
            float:left;
            margin:0 1em 1em;
            }
        #followers #dialog #info_dialog img.monkey {
            border:1px solid #acd;
            float:right;
            margin:0 1em 1em;
            }
        #followers #dialog #info_dialog p {
            font-size:92%;
            padding:0 0.5em;
            }
        #followers #dialog #info_dialog table {
            width:100%;
            }
        #followers #dialog #info_dialog table td {
            text-align:center;
            width:50%;
            }
            #followers #dialog #info_dialog table td button {
                margin-left:auto;
                margin-right:auto;
                }
            #followers #dialog #info_dialog #follow_drew_thanks {
                color:#000;
                -moz-border-radius:5px;
                -webkit-border-radius:5px;
                background-color:#e6e6e6;
                border:1px solid #ccc;
                padding-top:1px solid #fff;
                float:left;
                font-size:x-small;
                margin-left:30px;
                padding:4px 8px;
                vertical-align:top;
                x-cursor:pointer;
                }
                #followers #dialog #info_dialog #follow_drew_thanks img {
                    float:left;
                    padding-top:4px;
                    }
                #followers #dialog #info_dialog #follow_drew_thanks span {
                    float:left;
                    padding-left:4px;
                    text-align:left;
                    }
    #followers #dialog #tweet_dialog {
        background-color:#cef;
        display:none;
        height:272px; /* 224 = 48 * 5 - 16, 272 = 48 * 6 - 16 */
        left:8px;
        margin:0;
        padding:0;
        position:absolute;
        top:8px;
        width:512px; /* 464 = 48 * 10 - 16, 512 = 48 * 11 - 16 */
        z-index:22;
        }
        #followers #dialog #tweet_dialog h1 {
            font-size:138.5%;
            font-weight:bold;
            padding:0.5em;
            }
        #followers #dialog #tweet_dialog p {
            font-size:92%;
            padding:0 0.5em;
            }
        #followers #dialog #tweet_dialog h2 {
            font-size:116%;
            font-weight:bold;
            padding:0.5em;
            }
        #followers #dialog #tweet_dialog textarea {
            height:4em;
            margin:0 28px;
            padding:2px;
            width:448px;
            }
        #followers #dialog #tweet_dialog .buttons {
            margin-bottom:1.2em;
            }
    
#ft {
    background-color:#000;
    x-border-top:1px solid #222;
    bottom:0;
    color:#fff;
    height:20px;
    left:0;
    margin:0;
    overflow:hidden;
    padding:0;
    position:absolute;
    width:100%;
    }
    #ft table {
        margin-top:2px;
        width:100%;
        }
        #ft table td {
            color:#999;
            font-size:77%;
            font-weight:normal;
            line-height:85%;
            text-align:left;
            }
            #ft table td div {
                text-align:left;
                padding:0 0 0 5px;
                width:100%;
                }
                #ft table td #ftcred {
                    padding:0 5px 0 0;
                    text-align:right;
                    }
            #ft table td a {
                color:#79b;
                }


/* tooltip styling. uses a background image (a black box with an arrow) */ 
div.tooltip { 
    background-color:#fff;
    /* background:transparent url(../img/tooltip/black_arrow_big.png) no-repeat scroll 0 0; */
    border:8px solid #ccc;
    height:70px; 
    padding:10px; 
    position:relative;
    width:300px;
    display:none;
    color:#000;
    }
    /* tooltip title element (h3) */ 
    div.tooltip h5 {
        color:#000;
        font-size:138.5%;
        font-weight:bold;
        margin:0;
        position:absolute;
        top:10px;
        left:70px;
        }
    div.tooltip img {
        margin:0;
        position:absolute;
        top:10px;
        left:11px;
        }


#tooltip {
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    background-color:#fff;
    border:8px solid #cef;
    color:#000;
    display:none;
    x-height:70px; 
    padding:10px; 
    position:absolute;
    width:300px;
    z-index:999;
    }
    #tooltip table {
        width:100%;
        }
    #tooltip td {
        text-align:left;
        }
    #tooltip .tt_hd {
        x-color:#000;
        x-left:8px;
        margin:0;
        x-position:absolute;
        x-top:8px;
        padding:0 0 0.8em;
        }
        #tooltip .donation_amount {
            font-size:138.5%;
            font-weight:bold;
            line-height:100%;
            }
        #tooltip .screen_name {
            color:#369;
            font-size:123.1%;
            font-weight:bold;
            x-left:70px;
            line-height:100%;
            margin:0;
            x-position:absolute;
            x-top:25px;
            text-decoration:none;
            }
            #tooltip .screen_name:hover {
                text-decoration:underline;
                }
    #tooltip .bio {
        color:#000;
        font-size:85%;
        x-left:70px;
        line-height:100%;
        margin:0;
        x-position:absolute;
        x-top:40px;
        padding:0 0.5em;
        }
    #tooltip .image_cell {
        text-align:left;
        width:50px;
        }
    #tooltip .profile_image {
        x-left:11px;
        margin:0;
        x-position:absolute;
        x-top:30px;
        }
    #tooltip .tt_ft {
        padding-top:0.5em;
        }
    #tooltip .followers_count {
        float:right;
        font-size:92%;
        x-display:none;
        }
    #tooltip .follow_action {
        }
        #tooltip .follow_action a {
            color:#000;
            text-decoration:none;
            }

#left_stem,
#right_stem {
    border-top:8px solid transparent;
    border-bottom:8px solid transparent;
    display:block;
    height:1px;
    position:absolute;
    width:1px;
    z-index:1111;
    }
    #left_stem {
        border-right:8px solid #cef;
        }
    #right_stem {
        border-left:8px solid #cef;
        }

/* tooltip outline */
#tooltip_outline {
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    background-color:#289;
    display:block;
    height:1px;
    position:absolute;
    width:1px;
    z-index:7;
    }
#left_stem_outline,
#right_stem_outline {
    border-top:9px solid transparent;
    border-bottom:9px solid transparent;
    display:block;
    height:1px;
    position:absolute;
    width:1px;
    z-index:7;
    }
    #left_stem_outline {
        border-right:9px solid #289;
        }
    #right_stem_outline {
        border-left:9px solid #289;
        }


/* tooltip shadow */
#tooltip_shadow {
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    background-color:#000;
    display:block;
    height:1px;
    opacity:0.33;
    position:absolute;
    width:1px;
    z-index:4;
    }
#left_stem_shadow,
#right_stem_shadow {
    border-top:4px solid transparent;
    border-bottom:4px solid transparent;
    display:block;
    height:11px;
    opacity:0.33;
    position:absolute;
    width:1px;
    z-index:4;
    }
    #left_stem_shadow {
        border-right:4px solid #000;
        }
    #right_stem_shadow {
        border-left:4px solid #000;
        }

/*
<div id="tooltip">
    <div class="donation_amount"><em>$0</em> Donation from:</div>
    <div class="screen_name"><a target="_blank" href="http://twitter.com/name">@name</a></div>
    <img src="http://static.twitter.com/images/default_profile_normal.png" width="48" height="48" class="profile_image" />
    <div class="bio"></div>
    <div class="followers_count"><em>0</em> Followers</div>
    <div class="follow_action"><input type="button" value="Follow"/></div>
</div>
*/


/*
    button styling from twitter
*/
.buttons {
        padding-top:12px;
        text-align:center;
        }
.buttons input,
.buttons button {
        margin:0 3px;
        }
.buttons a button {
        margin:0;
        }
input.submit,
button,
input[type=submit],
input[type=button],
input[type="file"] > input[type="button"] {
        color:#000;
        -moz-border-radius:5px;
        -webkit-border-radius:5px;
        background-color:#e6e6e6;
        border:1px solid #ccc;
        padding-top:1px solid #fff;
        font-size:x-small;
        padding:4px 8px;
        vertical-align:top;
        cursor:pointer;
        }
input.submit:hover,
button:hover,
input[type=submit]:hover,
input[type="file"] > input[type="button"]:hover {
        background-color:#d5d5d5;
        }
#follow_drew_button,
#post_tweet_button,
#tweet_button.active {
    background-color:#090;
    border-color:#050;
    color:#fff;
    font-size:100%;
    }
    #follow_drew_button:hover,
    #post_tweet_button:hover,
    #tweet_button.active:hover {
        background-color:#1a1;
        }