/* ****************************************************************************************************************
 *      Web:            Idea y Comunicación                                                                     *
 *      Autor:          Ruben Manzano ruben.manzano@gmail.com                                                     *
 *      Hoja:           principal.css                                                                         .....*
 *      Descripcion:    maquetacion qubeoil                                                           *
 *      Fecha:          20/12/2010                                                                                *
 *****************************************************************************************************************/


/*** NEUTRALIZANDO ESTILOS:
elementos que queremos limpiar completamente: ***/
* {margin: 0; padding: 0; /*border: none;* eliminado para darle el estilo por defecto a los botones de formulario*/ }
body{ font: 0.8125em/1  "Arial","Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif; padding: 0; margin: 0;}
/*** NEUTRALIZANDO ESTILOS:
elementos con margen vertical: ***/
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address { font-weight: normal; margin: 0; }

/*** Algunos ajustes basicos: ***/
sup { position: relative; bottom: 0.3em; vertical-align: baseline; }
sub { position: relative; bottom: -0.2em; vertical-align: baseline; }
li, dd, blockquote {  list-style: none; }

/*** LINKS: */

a, a:link, a:visited, a:hover, a:active {
outline: 0; /*Elimina la l�nea de puntos que aparece alrededor de los enlace al clicarlos*/ text-decoration: none;}
a img { border: none; text-decoration: none; }
img {border: none; text-decoration: none; /*Si a�ades un background aparecer� como fondo de la imagen, �til para im�genes de carga*/ }

/*** FORMULARIOS: ***/
/*label,*/ button { cursor:pointer; }
/*input, select, textarea { font-size: 100%;}*/
input:focus, select:focus, textarea:focus { background-color: #FFF;}
fieldset { border: none;}



.estirar{ height: 1%;}
.estirar:after {clear:both; content:".";display:block; height:0pt; visibility:hidden; }

.alt{ display: none;}

.flotarDerecha{
    float: right;
    margin: 0 0 15px 25px;
    }

.flotarIzquierda{
    float: left;
    }

.oculto{
   display: none;
}

/* ========== MAQUETACIÓN ========== */

body{
    text-align: center;
    position: relative;
    }

#contenedor{
    margin: 0 auto;
    width: 975px;
    padding: 0 25px;
    text-align: left;
    position: relative;
}

h2{
    font-size: 2em;
    color: #c20000;
    font-weight: bolder;
    margin: 0 0 25px 0;

}

h3{
    font-size: 1.2em;
    color: #c20000;
    font-weight: bolder;
    margin: 0 0 10px 0;

}

h2 a:link, h2 a:visited{
    color: #c20000;
    text-decoration: underline;
    }

h2 a:hover, h2 a:active{
    color: #a5a5a5;
    text-decoration: underline;
    }

.contacto h3{
     clear: both;
}

p{
    margin: 0 0 15px 0;
    line-height: 15px;
    text-align: left;
}

.contenidoInterior p{
    font-size: 1.1em;
    line-height: 1.4em;
}

.imagenInterior{
    border: 15px solid #F0F0F0;
    margin: 0 0 15px 15px;
    clear: right;
    }

    .bloqueContacto .imagenInterior{
        position: relative;
        left: -30px;
    }

.centrado{
    text-align: center;
    padding: 15px 0 0 0;
    }


ol{
    padding: 25px;
}
    ol li{
        margin: 0 0 10px 0;
        font-size: 1.1em;
        font-weight: bolder;
        list-style-type: decimal;
    }

ul.values{
    padding: 25px;
    width: 544px;
    }

    ul.values li{
        margin: 0 0 18px 0;
        font-size: 1.1em;
        list-style-type: disc;
        line-height: 15px;
       }

/* ============= CABECERA ===================== */

#cabecera{
    -moz-border-radius: 0 0 10px 10px;
    -webkit-border: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
    behavior: url(/PIE.htc);
    background: #000;
    padding: 0 25px;
    height: 59px;
    padding: 17px 0 0 23px;
}

    h1{
        margin: 5px 0 0 0;
        float: left;
        width: 50%;
    }

    h1 a span{
        display: block;
        text-indent:-9999px;
    }

#herramientas{
    float: right;
    width: 30%;
}

/* herramientas */

.menuHerramientas{
    position: relative;
    top: 25px;
}
    .menuHerramientas li{
        float: left;
    }

       .menuHerramientas li a{
            display: block;
            margin: 0 0 0 25px;
            font-size: 0.9em;
            font-weight: bolder;
            padding: 0 0 0 15px;
        }

    /* herramientas home */
           .menuHerramientas li.herramientasHome a:link{
                background: url(/images/fnd-herramientasHome.png) no-repeat 0 -12px;
                width: 34px;
                height: 12px;
                overflow: hidden;
                color: #fff;
           }

           .menuHerramientas li.herramientasHome a:visited{
                background: url(/images/fnd-herramientasHome.png) no-repeat 0 -12px;
                width: 34px;
                height: 12px;
                overflow: hidden;
                color: #e5e5e5;
           }

           .menuHerramientas li.herramientasHome a:hover,
           .menuHerramientas li.herramientasHome a:active{
                background: url(/images/fnd-herramientasHome.png) no-repeat 0 0;
                width: 34px;
                height: 12px;
                overflow: hidden;
                color: #a5a5a5;
           }

    /* herramientas contacto */

           .menuHerramientas li.herramientasContactar a:link{
                    background: url(/images/fnd-herramientasContacto.png) no-repeat 0 -7px;
                    width: 57px;
                    height: 11px;
                    overflow: hidden;
                    color: #fff;
               }

               .menuHerramientas li.herramientasContactar a:visited{
                    background: url(/images/fnd-herramientasContacto.png) no-repeat 0 -7px;
                    width: 57px;
                    height: 11px;
                    overflow: hidden;
                    color: #e5e5e5;
               }

               .menuHerramientas li.herramientasContactar a:hover,
               .menuHerramientas li.herramientasContactar a:active{
                    background: url(/images/fnd-herramientasContacto.png) no-repeat 0 2px;
                    width: 57px;
                    height: 11px;
                    overflow: hidden;
                    color: #a5a5a5;
               }

/* ============== CONTENIDO ================= */

.banner{
    display: block;
    margin: 0 0 25px 0;
    clear: both;
}

/* columna izquierda */

#colIzquierda{
    float: left;
    width: 254px;
    padding: 0 0 0 14px;
    margin: 0 0 25px 0;
}

    /* menu navegacion */

#menuNavegacion{
    margin: 0 0 35px 0;
}

    #menuNavegacion li{
        display: block;
        width: 224px;
        background: url(/images/fnd-vinhetaMenu.png) no-repeat 3px 9px;
        border-bottom: 1px dashed #666;
        margin: 0 0 5px 0;
    }

       #menuNavegacion li a{
            display: block;
            padding: 5px 0 5px 15px;
            height: 17px;
            font-weight: bolder;
            font-size: 1em;
       }

           #menuNavegacion li a:link{
                  color: #000;
           }

           #menuNavegacion li a:visited{
                  color: #a5a5a5;
           }

           #menuNavegacion li a:hover,
           #menuNavegacion li a:active{
                  color: #c20000;
           }


/* columna izquierda extra */

    .colIzquierdaExtra{
        position: relative;
        left: 31px;
    }

    /* banner global */

    .bannerGlobal{
        display: block;
        background: url(/images/fnd-global.png) no-repeat;
        height: 51px;
        width: 161px;
        font-size: 1.2em;
        padding: 33px 0 0 0;
        text-align: center;
        margin: 0 0 25px 0;
        position: relative;
        top: 28px;
    }

           .bannerGlobal a:link,
           .bannerGlobal a:visited{
                display: block;
                background: #fff;
                width: 161px;
                font-size: 1em;
                font-weight: bolder;
                padding: 5px 0;
                text-align: center;
                color: #444d6f;
              }

            .bannerGlobal a:hover,
            .bannerGlobal a:active{
                display: block;
                background: #D6DDF6;
                width: 161px;
                font-size: 1em;
                font-weight: bolder;
                padding: 5px 0;
                text-align: center;
                color: #444d6f;
              }

    /* banner partners */

    .partners{
        position: relative;
        left: -15px;
    }




/* columna derecha */

#colDerecha{
    float: right;
    width: 700px;
    margin: 0 0 25px 0;
}

    /* extra home */
    .extraHome{
        border-top: 1px dashed #a5a5a5;
        padding: 15px 0 0 0;
        margin: 0 0 35px 0;
        }

        .extraHomeIzquierda{
            float: left;
            width: 325px;
            padding: 0 15px 0 0;
            border-right: 1px dashed #a5a5a5;
        }

          .extraHomeIzquierda img{
              margin: 0 15px 0 0;
          }

        .extraHomeDerecha{
            float: right;
            width: 336px;
            padding: 0 0 0 15px;
        }


    /* banner medio */

    .bannerMedio{
        clear: both;
        margin: 0 0 25px 0;
    }


    /* contenido destacado */

    .contenidoDestacado{
        background: #f0f0f0;
        padding: 15px 15px 0 15px;
        margin: 0 0 25px 0;
    }

     .contenidoDestacado img{
         margin: 0 15px 0 0 ;
     }



/* =============== CONTACTO =================== */

#fichaColIzquierdaContacto{
    background:url("/images/fnd-lineaPrincipal.png") repeat-y scroll 459px 0 transparent;
    float:left;
    padding:0 30px 0px 0;
    width:430px;
}

fieldset .encabezadoContenido{
    background:none repeat scroll 0 0 #c20000;
    color:#FFFFFF;
    font-family:Arial,Verdana,sans-serif;
    font-size:1.2em;
    font-weight:bolder;
    margin:0 0 15px;
    padding:6px 0;
    text-align:left;
    text-indent:10px;
    text-transform:uppercase;
    width: 100%;
    -moz-border-radius:3px 3px 3px 3px;
    -webkit-border-radius:3px 3px 3px 3px;
    border-radius:3px 3px 3px 3px;
    behavior: url(/PIE.htc);
}
/* FICHA COL DERECHA CONTACTO*/

#fichaColDerechaContacto{
    float: right;
    width: 211px;
    padding: 0 88px 0 10px;
}

/* formulario de contacto */



form.contacto{
    float: left;
    width: 526px;
    margin: 50px 0px 40px 0px;
    clear: both;
    }

form.contacto label{
    font-weight: bolder;
    font-size: 1.4em;
    display: block;
    color: #c20000;
    font-family: Arial, sans-serif; margin: 0 0 5px 0;
    text-align: left;
    clear: both;
    }

form.contacto input, textarea{
    border: 1px solid #ccc;
    background: #fff url(/images/input_bg.png) repeat-x top;
    width: 526px;
    margin: 0 0 15px 0;
    padding: 4px;
    color: #666;
    font-family: Arial, sans-serif;
    }

form.contacto input{
    font-size: 1.3em;
    color: #000;
    }
form.contacto textarea{
    font-size: 1.3em;
    height: 150px;
    color: #333;
    }

form.contacto input:focus{
    background: #eee url(/images/input_bg.png) repeat-x top;
    }
form.contacto textarea:focus{
    background: #eee url(/images/input_bg.png) repeat-x top; overflow: auto;
    }


/* enviar */


form.contacto fieldset.contactoEnviar input{
    text-align: center;
    width: 140px;
    height: 30px;
    cursor: pointer;
    float: right;
    position: relative;
    left: 13px;
    background: url(/images/fnd_enviar.png) no-repeat 0 -32px;
    cursor: pointer;
    border: none;
    color: #fff;
    padding: 0 0 2px 0;
    font-size: 1.4em;
    }

form.contacto fieldset.contactoEnviar input:hover{
    text-align: center;
    width: 140px;
    height: 30px;
    cursor: pointer;
    float: right;
    position: relative;
    left: 13px;
    background: url(/images/fnd_enviar.png) no-repeat top;
    cursor: pointer;
    border: none;
    color: #fff;
    text-shadow: 1px 1px #cfcfcf;
    padding: 0 0 2px 0;
    font-size: 1.4em;
    behavior: url(/PIE.htc);
    }

/* ============ STAFF =============== */

.staff{
      position: relative;
      }

.staff ul{
    margin: 0 auto;
    width: 100%;
    clear: both;
    text-align: center;
    margin: 0 0 35px 0;
        }

    .staff ul li{
        display: inline-block;
        text-align: center;
        font-size: 0.9em;
        font-weight: bolder;
        margin: 0 25px 0 0;
        }

        .staff ul li br{
            margin: 0 0 5px 0;
          }

    /* chieftains */
    .chieftains{
        width: 218px;
        margin: 0 0 15px 0;
        }

       .barrero{
               float: left;
            }

            .barrero>li{
                margin: 0 0 15px 0;
                }

        .presidenteCV{}

        .abollado{
               float: left;
               position: relative;
               top: -4px;
            }

            .abollado>li{
                margin: 0 0 15px 0;
                }



/* ============= PIE ================= */

#pie{
    -moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
    background: none repeat scroll 0 0 #A5A5A5;
    clear: both;
    color: #FFFFFF;
    height: 34px;
    margin: 25px 0 0;
    padding: 20px 20px 0 0;
    position: fixed;
    text-align: right;
    bottom: -15px;
    width: 957px;
    left: 20.6%;
    behavior: url(/PIE.htc);
}

#pie p{
        font-weight: bolder;
    }

        #pie p a:link{
            font-weight: bolder;
            color: #fff;
            text-decoration: underline;
            }

        #pie p a:visited{
            font-weight: bolder;
            color: #ccc;
            }

        #pie p a:hover, #pie p a:active {
            font-weight: bolder;
            color: #c20000;
            text-decoration: underline;
            }

        #pie .cambiarIdioma:link,
        #pie .cambiarIdioma:visited,
        #herramientas .cambiarIdioma:link,
        #herramientas .cambiarIdioma:visited {
            color: #c20000;
            text-decoration: underline;
        }
        #pie .cambiarIdioma:hover,
        #pie .cambiarIdioma:active,
        #herramientas .cambiarIdioma:hover,
        #herramientas .cambiarIdioma:active {
            color: #fff;
            text-decoration: underline;
        }


/* bola extra */

.txtPartners{
        clear: both;
        margin: 0 10px 0 0;
    }

    .txtPartners img{
        margin: 0 15px 15px 0;
    }

.encabezadoClear{ clear: both;}

.txtChino{
    font-size: 1.5em;
    line-height: 34px;
    }

.rojoq{
    color: #C20000;
    }

.grisq{
    color: #a5a5a5;
    }

.contenidoDestacado p{
    padding: 0 15px 0 0px;
    }

.bominflot{
    position: relative;
    top: -11px;
    padding: 0 25px 0 0;
    }

    .bominflotAjuste{
        padding: 0 82px 0 0;
    }

.urales{
    position: relative;
    top: -20px;
    padding: 0 25px 0 0;
    }

.txtPartners .flotarDerecha{
    float: right;
    margin: 0 0 15px 25px;
    }

.txtPartners .flotarIzquierda{
    float: left;
    margin: 0 25px 15px 0;
    }
