.cinemas {
    border-bottom: 0.05em #000 solid; 
    margin-bottom: 1.5em;
    width: 60em;
}

.cinema {
    border-top: 0.05em #000 solid;
    padding: 1.5em 0;
    width: 60em;
}

.cinema h2 {
    font-size: 1.18em;
    line-height: 1.27em;
    padding: 0 0.51em;
}

.cinema p {
    padding-bottom: 0;
}

.cinema .info, .cinema .name, .cinema .travel {
    float: left;
}

.cinema .name, .cinema .travel {
    width: 20em; 
}

.cinema .travel img {
    height: 1em;
    line-height: 1.5em;
    vertical-align: middle;
}

.map {
    /* TODO the point on the map should show name and addres when clicked 
     * possibly with link to cinema own page. */
    /* TODO think about persistence of cinema and film data over runs of the
     * parser */
    border: 0.1em #000 solid; 
    height: 8.8em; 
    /* TODO everywhere we 2 x 2 entries reduced to 2 link 0 0.4em */
    text-align: right;
    width: 20em;
    /* TODO think about better urls */
}

.overlay {
    background-color: #000; 
    color: #fff; 
    text-align: center;
}

.overlay p {
    margin-bottom: 0; 
    padding: 0 0.6em; 
}

.overlay a {
    color: #ccc;
}

/* CLEARFIX from http://www.positioniseverything.net/easyclearing.html */

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

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */