hmtl, body{
    margin:0;
    padding:0;
    background-color: #DDD;
    height:100%;
    width:100%;
    color:#323232;
    font-family: Roboto, Arial;
    font-size:14px;
}

.card{
    margin:40px auto;
    background-color:#FFF;
    max-width: 600px;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
    border-radius: 5px;
    overflow: hidden;
}

/* Mobile */
@media (max-width: 600px) {
    .card{
        margin:0;
        max-width: 100%;
        border-radius: 0px;
    }
}

.card-header{
    padding:20px;
    border-bottom:1px solid #CCC;
    background-color: #0075c9;
    color:#FFF;
    font-size:20px;
}

.card-description{
    padding:15px 20px;
    background-color:#F4F4F4;
    border-bottom:1px solid #CCC;
    line-height: 140%;
}

.riders{
    padding:10px 10px 5px 10px;
}

ul.rider-list{
    list-style: none;
    margin:0;
    padding:0;
}

li.rider {
    display:block;
    border:1px solid #CCC;
    padding:15px 10px;
    margin-bottom:5px;
    background-color:#FAFAFA;    
    text-decoration: none;
    border-radius: 3px;
    overflow: hidden;
    -webkit-transition: all 1.0s ease;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
    transition: all 1.0s ease;    
}

li.rider.donate{
    background-color: #fc3;
    cursor:pointer;
    border-left:5px solid #0075c9;
}

li.rider .top{
    display:flex;
}

li.rider .bottom{
    padding-top:10px;
    font-weight:bold;
    display:none;
}

.donate-spacer{
    padding:0 5px;
    color:#545454;
    font-size:12px;
}
.donate-prompt{
    color:#545454;
    font-size:12px;
}

.rider-name{
    flex:1;
}

.rider-raised-wrap{
    width:120px;
    margin-left:auto;
    display:flex;
}

.rider-raised{
    padding-left:10px;
}

.rider-raised.loading{
    padding-left:80px;
    width:20px;
    height:16px;
    background-image:url('/static/img/loading.gif');
    background-position: center center;
    background-repeat: no-repeat;
}