/**
 * Layout:       modules.css
 * Project:      Project name
 * Version:      1.0
 * Last change:  19/05/09
 * Assigned to:  Diego Lago (dl)
 * Primary use:  Website
 *
 * 
 * MODULES are areas of functionality or content that are placed
 * inside REGIONS
 *
 * As a minimum, MODULES are made of a header and main sections
 * More complex MODULES extend by adding a footer and sidebar
 *
 * Every ELEMENT should be placed inside a MODULE
 * Whether the need is for a navigational menu, a login box or a piece of content
 * always use a MODULE as the building block
 * 
 * For accessibility, each region MODULE start with a heading (h2)
 * which, depending on visual designs, might be hidden or not
 *
 * If required, MODULES can also be nested
 *
 *
 * For production merge all styles sheets to a single one and optimise it
 */

/* module common */
.mod {
    clear: left;
    float: left;
    margin-bottom: 2em;
    position: relative;
    width: 100%;
}

.mod-side {
    overflow: hidden; /* investigate for better option */
}

.mod-footer {
    position: relative;
}

/* head on the right */
.mod-right .mod-head,
    .mod-right .mod-main,
    .mod-right .mod-footer {
    float: right;
    width: 70%;
}

.mod-right .mod-side {
    float: left;
    width: 29%;
    margin-top: -3.2em;
}

/* head on the left */
.mod-left .mod-head,
    .mod-left .mod-main,
    .mod-left .mod-footer {
    float: left;
    width: 70%;
}

.mod-left .mod-side {
    float: right;
    width: 29%;
    margin-top: -3.2em;
}

/* head on top */
.mod-top .mod-main {
    margin-top: 11em;
}

.mod-top .mod-side {
    position: absolute;
    top: 3.2em;
    width: 100%;
}

/* head inside */
.mod-inside .mod-head {
    margin-top: 10.8em;
}

.mod-inside .mod-side {
    position: absolute;
    top: 0;
    width: 100%;
}

/* head on top, main on the right */
.mod-top-right .mod-main,
    .mod-top-right .mod-footer {
    float: right;
    width: 70%;
}

.mod-top-right .mod-side {
    float: left;
    width: 29%;
    overflow: hidden;
}

/* head on top, main on the left */
.mod-top-left .mod-main,
    .mod-top-left .mod-footer {
    float: left;
    width: 70%;
}

.mod-top-left .mod-side {
    float: right;
    width: 29%;
    overflow: hidden;
}

/* navigational modules */
.nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
}

.nav a {
    display: block;
}

.list-block a {
    width: 100%;
}

.list-inline li,
    .list-inline a {
    float: left;
}