/* 
    Document   : common
    Created on : 10/Nov/2011, 22:07:43
    Author     : VertexONE
    Description:
*/

/*@charset "utf-8"; */
/* CSS Document */

html, body {height: 95%; }
body{
    background-color:#FFF; margin: 0 auto; padding: 0px;
    margin-bottom: 10px; color: #555;
    font-family: Calibri,Helvetica,Sans-serif; font-size: 1em;
    background: url('images/bgtile.jpg');
}


.clr { clear: both; overflow:hidden; height: 0; }
a, img, form { padding: 0; margin: 0; border: none; }
img { border: none; text-align: center; vertical-align: middle; margin: 0 auto; padding: 0; }
a { color: #555; text-decoration: none; }

table { border-collapse: collapse; padding: 0px; margin: 0px; }
td  { padding: 0px; margin: 0px; border-collapse: collapse;}

img.list_icons { height: 22px; line-height: 30px; vertical-align: middle; text-align: center; padding-bottom: 5px; }
/* ------------------------------------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------------------------------------- */
.esp10px_Horizontal { width:10px;}
.esp30px_Horizontal { width:30px;}
.esp5px_Horizontal { width:5px;}
.esp10px_Vertical { height:10px; width:100%; }
.esp30px_Vertical   { height:30px; width:100%; }
.esp5px_Vertical  { height:5px; font-size: 1px; width:100%; }
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------ LOGIN ------------------------------------------------------------------------------------------------ */

    h1.login_title { text-align: center; color: #333333; font-size: 20px; font-weight: bold;}

    #div_main_login {
        width: 400px; margin: auto;
        margin-top: 5px; margin-bottom: 10px;
        border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border: #AAA solid 1px;
        padding: 5px 10px 20px 10px;
        background: #EEE;
        /*text-shadow: 0 1px 0 white;*/
        -moz-box-shadow: 1px 1px 2px #fff inset;
        -webkit-box-shadow: 1px 1px 2px #fff inset;
        box-shadow: 1px 1px 2px #fff inset;;
    }
    #div_login_icon { background: url('../images/icons/icon_login_150px.png') no-repeat; width: 160px; height: 160px; text-align: center; }
    #div_login_form { float: right; line-height: 30px; font-size: 12px; font-weight: bold; color: #555; text-align: right; margin-right: 20px;}

/* ------------------------------------------------------------------------------------------------------------------- */

/* ------------ AREA PRINCIPAL --------------------------------------------------------------------------------------- */
    #div_main_area, #div_main_top_menu {
                     border-left: 1px solid #CCC;
                     border-right: 1px solid #CCC;
                     padding: 10px;
    }
/* ------------------------------------------------------------------------------------------------------------------- */
    #div_main_top_menu { background: url('images/menu/bg_menu.png');  padding: 0; border-bottom: 1px solid #CCC; margin: 0; }
    #div_logout {display: block; float: right; width: 100px; text-align: right; height: 35px; margin-right: 15px; line-height: 35px; }
    #div_logout span {
        background: url('../images/icons/icon_logout_16px.png') no-repeat;
        padding-left: 20px; font-size: 0.9em; color: #555;
        font-weight: bold;
    }
    #div_logout span a:hover { color: #CC0000; }
/* ------------------------------------------------------------------------------------------------------------------- */



/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------ BANNER TOPO ------------------------------------------------------------------------------------------ */
    #div_banner_main {
        min-width: 980px; width: 100%; margin: 0 auto; padding: 0; height: 70px; line-height: 70px;
        background: url('images/banner/bg_banner.jpg') repeat-x;
    }

    #div_banner_left{
        width: 300px; height: 70px; line-height: 70px; margin: 0 auto; padding: 0; float: left; margin-left: 10px;
        background: url('images/banner/logotipo.png') no-repeat;
    }
    
    #div_banner_center {
        width: 400px; height: 70px; line-height: 70px; margin: 0 auto; padding: 0; float: left; text-align: center;
        margin-left: 10px; margin-right: 10px;
    }
    
    #div_banner_right {
        width: 250px; height: 70px; margin: 0 auto; padding: 0; float: right; margin-right: 10px; text-align: right;
    }

    .div_banner_right_user {
        width: 250px; height: 30px; line-height: 30px; margin: 0; padding: 0; text-align: right;
        color: #FFF; font-size: 0.9em; font-weight: bold;
    }
    
    .div_banner_right_logout, .div_banner_right_logout:hover {
        width: 120px; height: 26px; line-height: 26px; margin: 0; padding: 0; text-align: center; margin-top: 4px; color: #999;
        background: url('images/banner/bg_logout.png') no-repeat; font-size: 0.8em; font-weight: bold; float: right;
    }
    .div_banner_right_logout:hover { color: #FFF; cursor: pointer; background: url('images/banner/bg_logout_hover.png') no-repeat;  }
    
    #main_icons_wrapper {
        width: 100px; margin: 0px; padding: 0px; text-align: right;
        position: absolute; top: 30px; right: 150px;
    }
    #main_icons_wrapper img { width: 26px; margin-top: 3px;}

/* ------------------------------------------------------------------------------------------------------------------- */

/* ------------ PAGE FOOTER ------------------------------------------------------------------------------------------ */
    #div_border_bottom.grey         {background: url('../images/border_bottom_middle.png') repeat-x; }
    #div_border_bottom.grey div     { background: url('../images/corner_bottom_right.png') 100% 0 no-repeat; }
    #div_border_bottom.grey div div { background: url('../images/corner_bottom_left.png') no-repeat; }

    #div_main_copyright {
        color:#555; font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:11px; font-style:italic; text-align:center;
        margin: 0 auto; height: 34px; line-height: 24px; padding-bottom: 10px;
    }
/* ------------------------------------------------------------------------------------------------------------------- */

#div_title_main {
    width: 98.5%;
    border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    border: #AAA solid 1px;
    padding: 5px; padding-left: 10px; padding-right: 10px;
    background: #D3DCE3;
    /*text-shadow: 0 1px 0 white;*/
    -moz-box-shadow: 1px 1px 2px #fff inset;
    -webkit-box-shadow: 1px 1px 2px #fff inset;
    box-shadow: 1px 1px 2px #fff inset;;
    float: left; clear: right;
    font-size: 1.4em; line-height: 40px;
    margin-bottom: -10px;
}
.div_title_title { float: left; clear: right; }
.div_title_toolbar { width: 200px; float: right; text-align: right; margin-right: 10px; }

.div_title_main_aux, .div_title_main_aux_full, .div_title_main_aux_full_v2 {
    margin: 0 auto;
    border-radius: 8px 8px 0 0;
    -moz-border-radius: 8px 8px 0 0;
    -webkit-border-radius: 8px 8px 0 0;
    border: #AAA solid 1px;
    padding: 5px;
    background: #D3DCE3;
    /*text-shadow: 0 1px 0 white;*/
    -moz-box-shadow: 1px 1px 2px #fff inset;
    -webkit-box-shadow: 1px 1px 2px #fff inset;
    box-shadow: 1px 1px 2px #fff inset;;
    font-size: 1.4em; line-height: 30px; height: 30px;
}

#div_main_contents {
    min-height: 50px; margin: 0 auto; width: 98.5%;
    border-radius: 0 0 8px 8px;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border: #AAA solid 1px; border-top: none;
    padding: 10px 10px 30px 10px;
    /*text-shadow: 0 1px 0 white;*/
    -moz-box-shadow: 1px 1px 2px #fff inset;
    -webkit-box-shadow: 1px 1px 2px #fff inset;
    box-shadow: 1px 1px 2px #fff inset;;
    background: #FFF;
}

.div_main_contents_aux, .div_main_contents_aux_full {
    min-height: 50px; margin: 0 auto;
    border-radius: 0 0 8px 8px;
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border: #AAA solid 1px; border-top: none;
    padding: 10px 0px 30px 10px;
    /*text-shadow: 0 1px 0 white;*/
    -moz-box-shadow: 1px 1px 2px #fff inset;
    -webkit-box-shadow: 1px 1px 2px #fff inset;
    box-shadow: 1px 1px 2px #fff inset;;
}
.div_title_main_aux, .div_main_contents_aux { width: 700px; }
.div_title_main_aux_full_v2 {line-height: 22px; height: 22px; padding: 5px 5px 10px 10px; }

/* ------------------------------------------------------------------------------------------------------------- */
div.div_msg_success, div.div_msg_notice, div.div_msg_error, div.div_msg_footnotes {
    margin: 0 auto; margin-top: 5px; margin-bottom: 5px;
    background-repeat: no-repeat;
    background-position: 10px 50%;
    padding: 10px 10px 10px 30px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 1px 1px #fff inset;
    -webkit-box-shadow: 0 1px 1px #fff inset;
    box-shadow: 0 1px 1px #fff inset;
    font-size: 12px; font-weight: bold;
}
.div_msg_success { color: #006600; background-color: #EBF8A4; border: 1px solid #A2D246; background-image: url('../images/icons/s_success.png'); }
.div_msg_error   { color: #990000; background-color: #FFC0CB; border: 1px solid #990000; background-image: url('../images/icons/s_error.png'); }

/* ------------------------------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------------------------------- */
#menu, #menu ul {
    margin: 0px; padding: 0px; border: 0px; font-weight: bold; font-size: 0.8em;
    list-style: none; display: block; height: 35px; vertical-align: middle; line-height: 35px;
}
#menu ul    { border: 1px solid #CCC; background: #f6f6f6;}

#menu li, #menu li a, #menu li a:hover  { display: block; float: left; padding-left: 10px; padding-right: 10px; height: 35px; line-height: 35px; text-align: center; vertical-align: middle; }
#menu li:hover { cursor:  pointer; background: url('../images/tab_hover_bg.png'); }
#menu li a:hover { color: #339900; }
/* ---- Menu layout -------------------------- */

#menu li {
	border-left: 1px solid #fff;
	border-right: 1px solid #d8d8d8;
}

#menu li ul {
    width: 150px; position: absolute; height: auto;
    visibility:hidden; display: block;
    border: 1px solid #CCC; background: #f6f6f6;
    margin:0; padding:0; margin-left: -10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0 1px 1px #fff inset;
    -webkit-box-shadow: 0 1px 1px #fff inset;
}

#menu li ul li {
    display:block; float:none;  width:130px; text-align: left; background: #f6f6f6;
}

#menu li ul li a, #menu li ul li a:hover {
    width:130px; background: #f6f6f6; text-align: left; margin-left: -10px;
}

#menu li ul li a:hover {
    cursor:  pointer; background: url('../images/tab_hover_bg2.png') no-repeat #f6f6f6;
}

/* TOOLTIPS CSS ---------------------------------------------------------------------------------------------------- */
.tooltip {
    cursor: help; text-decoration: none;
    position: absolute;
}
.tooltip span {
    margin-left: -999em;
    position: absolute;
}
.tooltip:hover span {
    border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
    font-family: Calibri, Tahoma, Geneva, sans-serif;
    position: relative; left: 1em; top: 2em; z-index: 99;
    margin-left: 0; width: 250px;
}
.tooltip:hover img {
    border: none; background: #FFF;
}
.tooltip:hover em {
    font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold;
    display: block; padding: 0.2em 0 0.6em 0;
}
.classic { padding: 0.8em 1em; }
.custom { padding: 0.5em 0.8em 0.8em 2em; }
* html a:hover { background: transparent; }
.classic {background: #FFFFAA; border: 1px solid #FFAD33; }
/* -------------------------------------------------------------------------------------------------------------------- */

#div_center_tables_v2 {
    text-align: center; margin: 0 auto; width: 540px;
}

.div_homepage_links, .div_homepage_links:hover{
    width: 100px; height: 60px; margin: 10px; padding: 5px;
    text-align: center; float: left;
    font-weight: bold; color: #333; font-size: 12px;
    background: url('../images/homepage_buttons.png') no-repeat;
}

.div_homepage_links:hover{
    background: url('../images/homepage_buttons_hover.png') no-repeat;
    cursor: pointer; color: #FFF;
}


#list_fotos_v, #list_fotos_v ul {
    margin: 0px; padding: 0px; border: 0px;
    font-weight: bold;
    list-style: none;
    display: block;
    vertical-align: middle;
}
#list_fotos_v ul { border: 1px solid #CCC; background: #f6f6f6; height: 150px; width: 150px;  text-align: center;}

#list_fotos_v li, #list_fotos_v li a, #list_fotos_v li a:hover  {
    display: block; float: left; padding-left: 10px; padding-right: 10px;
    vertical-align: middle; text-align: center;
}
#list_fotos_v li:hover { cursor:  pointer; background: #CCC; }
#list_fotos_v li a:hover { color: #339900; }
#list_fotos_v ul img { margin: 0 auto; text-align: center; }

/* -------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------- */


