.collapsed {
    overflow:hidden;
    height:8.05em;
}

#content .collapsed .trigger {
    margin-top:0;
}
.collapsed {
    margin-top:1.4em;
}


.collapsable:hover {
    background:transparent url('img/less.png') 100% 100% no-repeat;
}
.collapsed {
    background:transparent url('img/more.png') 100% 100% no-repeat;
}
.collapsed:hover {
    background:transparent url('img/moreover.png') 100% 100% no-repeat;
}
.collapsed, .collapsed:hover {
    background:transparent;
}

.trigger:after {
    font-weight:normal;
    font-family:Georgia, sans-serif;
    color:#bbb;
    margin-left:1em;
    letter-spacing:0;
    line-height:1em;
    font-size:.8em;
    padding:.2em;
}
.trigger:hover:after {
    color:#1E8EDC;
}
.trigger:hover {
    cursor:pointer;
}

.collapsable .trigger:after {
    content:'';
}
.collapsable:hover .trigger:after {
    content:'«';
}
.collapsable:hover .trigger:hover:after {
    content:'« collapse';
}

.collapsed .trigger:after {
    content:'»';
}
.collapsed:hover .trigger:after,
.collapsed:hover .trigger:hover:after {
    content:'expand »';
}

.collapsable .footer {
    display:none;
}

.collapsed {
    position:relative;top:0;left:0;
}
.collapsed .footer {
    display:block;
    position:absolute;
    bottom:0;
    right:0;
    background:white;
    z-index:1;
    color:#bbb;
    padding-left:.5em;
    text-decoration:none;
    border-bottom:0;
}
.collapsed:hover .footer {
    color:#1E8EDC;
}
.collapsed:hover .footer:hover {
    text-decoration:underline;
}