/********************************************************************************/
:root {
    /* Vertical scrollbar para todos los navegadores */
    overflow-y: scroll !important;
}
body {
    /*
        ANCHO DEL DOCUMENTO.
        La barra de desplazamiento vertical ocupa cierto espacio. 40px son
        suficientes para compensar este espacio. En caso de que se desee asignar
        el ancho de manera universal, el 95% del ancho de la pantalla es una
        dimensión adecuada.
            Pantalla    -40px    95%
                 800     760     760
                1024     984     972
                1280    1240    1216

        CENTRADO DEL CONTENIDO.
        Utilizar el valor auto para el atributo margin.

        TAMAÑO DE LA FUENTE.
        Para que ambos navegadores (ie y ff) escalen el texto del contenido con sus
        opciones correspondientes, es necesario utilizar la unidad em para el tamaño
        de la fuente; la unidad pt no escala en el ie.
            pt    em
             8  0.70<---
             9  0.75
            10  0.80<---
            11  0.95
            12  1.00<---
            13  1.05
            14  1.20
            15  1.25
            16  1.30
            17  1.45
            18  1.50
            19  1.55
            20  1.70
            21  1.75
            22  1.80
            23  1.95
            24  2.00
        La idea de asignar un valor para el tamaño de la fuente en body es para que
        el tamaño de la fuente de los demás elementos pueda ser asignado en base a
        porcentajes.
    */
    width: 760px;
    margin: auto;
    background-color: #f0f1fb;
    font-family: verdana,
                 arial,
                 helvetica,
                 san-serif;
    font-size: .7em;
    overflow: -moz-scrollbars-vertical;     \\ ie la muestra por default
}
* {
    font-size: 100%;
}
/********************************************************************************/

/********************************************************************************/
#header {
    /*
    Para hacer que las columnas de un contenedor tengan la misma altura:

        The basic method works like this:
        1. Blocks which will act as columns must be wrapped in a container element
        2. Apply overflow: hidden to the container element
        3. Apply padding-bottom: $big_value [2] to the column blocks, where $big_value is a large enough value to guarantee that it's equal to or larger than the tallest column
        4. Apply margin-bottom: -$big_value to the column blocks
    */
    height: 60px;
    color: #2d3194;
    background-color: transparent;
    border: 0px solid blue;
    margin-bottom: 10px;        /* Separador entre este id y el siguiente */
    float: left;                /* Hace que este id se extienda verticalmente tanto como sea necesario */
    overflow: hidden;           /* Misma altura para sus columnas */
}
    #logoEnterprise {
        width: 200px;               /* Asignarlo en función a la imagen */
    	float: left;
        border: 0;
        padding-bottom: 32767px;    /* Misma altura */
        margin-bottom: -32767px;    /* idem */
    }
    #razónSocial {
        width: 338px;               /* Asignarlo en función a las imágenes */
        text-align: center;
    	float: left;
        border: 0px dashed black;
        padding-bottom: 32767px;    /* Misma altura */
        margin-bottom: -32767px;    /* idem */
    }
    #logoCorporative {
    	float: left;
        width: 222px;               /* Asignarlo en función a la imagen */
        text-align: right;
        border: 0px dashed yellow;
        padding-bottom: 32767px;    /* Misma altura */
        margin-bottom: -32767px;    /* idem */
    }
    #header h1 {
        font-size: 200%;
    }
/********************************************************************************/

/********************************************************************************/
#intNavBar {
    /* Horizontal lists
        Step 1 - Make a basic list
        Step 2 - Remove the bullets
        Step 3 - Remove padding and margins
        Step 4 - Display inline
        Step 5 - Removing text decoration
        Step 6 - Padding around list items
        Step 7 - Adding background color
        Step 8 - Add a rollover color
        Step 9 - Center the list (or left it -jeje-)
    */
    clear: left;                /* Para que comience a la izquierda (Ff) */
    padding: 5px 0;             /* El mismo top&bottom que para el ul */
    background-color: #2d3194;
    border: 0;
    margin-bottom: 10px;        /* Separador entre este id y el siguiente */

}
#intNavBar ul {
    margin: 0;                  /* Step 3 */
    margin-left: 4px;           /* Compensación (ver li) */
    padding: 0;                 /* Ste3 */
    list-style-type: none;      /* Step 2 */
    text-align: left;           /* Step 9 */
}
#intNavBar ul li {
    display: inline;            /* Step 4 */
}
#intNavBar ul li a {
    text-decoration: none;      /* Step 5 */
    padding: 5px 10px;          /* Step 6 */
    margin-left: -4px;          /* Coopensación (ver ul) */
    color: #ffffff;             /* Step 7 */
    background-color: #2d3194;  /* Step 7 */
    border-right: 1px solid white;
}
#intNavBar ul li a:hover {
    color: #ffffff;             /* Step 8 */
    background-color: #948F2D;  /* Step 8 */
}
#intNavBar li a#activeIntNavBar {
    background-color: #948F2D;
}
#intNavBar img {
    border: 0;
}
/********************************************************************************/

/********************************************************************************/
#footer {
    clear: both;
    float: left;
    font-style: italic;
    background-color: transparent;
    border-top: 0px solid #2d3194;
    margin-top: 10px;
    margin-bottom: 10px;
}
/********************************************************************************/

/********************************************************************************/
.foo {
    position: relative;
}
/********************************************************************************/

/********************************************************************************/
#contents {
    clear: both;
    width: 100%;
    background-color: transparent;
    border: 0px solid #2d3194;
    margin-bottom: 10px;            /* Separador entre este id y el siguiente */
    float: left;                    /* Hace que este id se extienda tanto como sea necesario */
    overflow: hidden;               /* Misma altura */
}
    #contents h1 {
        padding: 0;
        margin-top: 0;
        font-size: 120%;
    }
    #topBlock {
        clear both;
        width: 100%;
        background-color: #fffff;
        overflow: hidden;
        margin-bottom: 10px;
    }
    #topBlock h1 {
        color: #ffffff;
        background-color: #f0f1fb;
    }
    #topBlock p {
        text-align: justify;
    }
        #enterprise {
            float: left;
            width: 49%;
            padding-bottom: 32767px;
            margin-bottom: -32767px;
        }
        #enterprise p {
            text-indent: 2ex;
        }
        #address {
            float: right;
            width: 49%;
            padding-bottom: 32767px;
            margin-bottom: -32767px;
        }
        #address h1.workshop {
            text-align: right;
        }
        #address p.workshop, p.office {
            text-align: right;
        }
    #address a:link {
        color: #666666;
        text-decoration: underline;
    }
    #address a:visited {
        color: #666666;
        text-decoration: underline;
    }
    #address a:hover {
        color: #000000;
        text-decoration: underline;
    }
    #address a:active {
        color: #666666;
        text-decoration: underline;
    }
    #bottomBlock {
        clear both;
        width: 100%;
        background-color: transparent;
        overflow: hidden;
    }
    #bottomBlock h1 {
        color: #ffffff;
        background-color: #f0f1fb;
    }
    #bottomBlock p {
        text-align: left;
        text-indent: 0em;
    }
    #bottomBlock img {
        width: 50%;
        float: left;
        margin-right: 1ex;
    }
        #mision {
            float: left;
            width: 49%;
            padding-bottom: 32767px;
            margin-bottom: -32767px;
        }
        #vision {
            float: right;
            width: 49%;
            padding-bottom: 32767px;
            margin-bottom: -32767px;
        }
/********************************************************************************/