﻿/*

    Estilo para: Portal de Abogado
    Autor: Juan Carlos Saavedra
    Modificado: Joan Manuel Toro
    Creado: 04/02/2011
    Último cambio: 04/02/2011

Área A) Posicionamientos
    =Formulario
    =Cabecera
    =Logo
    =Modulos
    =Contenido
    =Login
    =Píe

Área B) Formatos
    =Boton
    =
    =
*/

html, body
{
    width: 100%;
    height: 100%;
    margin: 0 0 0 0;
}

body
{
    background-image: url(img/bg.gif);
    background-repeat: repeat-x;
    background-color: #6086B7;
    text-align: center;
}

h1, h2, h3, h4, h5
{
    font-family: Tahoma;
}

/* Contiene centrada la forma completa de página */
#sitio
{
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    width:1024px;
}

/* Contiene la forma completa de la pagina */
#formulario
{
    margin: 10px auto 10px auto;
    width: 100%;
    border: 1px solid #6893cf;
    background-color: #fff;
}

/* Cabecera del Sistema */
#formulario #cabecera
{
    background-color: #fff;
    color: #000;
    background-image: url(img/bgCabecera.png);
    width: 100%;
    height: 70px;
}

/* Logo de Tecnolex */
#logoEmpresa
{
    float: right;
    width: 170px;
    height: 30px;
    background-image: url(img/tecnolex.png);
    background-repeat: no-repeat;
    background-position: bottom;
}

#logoCliente
{
    float: left;
    width: auto;
    height: 49px;
    margin: 20px 0 10px 10px;
    /*
    background-image: url(img/alessandri.png);
    background-repeat: no-repeat;
    background-position: bottom;
    */
}

#logoCliente span
{
    font-family: Tahoma;
    font-size: 20px;
    font-weight: bold;
    color: #333333;
}

/* =Modulos */
#modulos{width: 990px; margin: 0 auto 0 auto; height: 64px;}
#modulos #modulo{font-size: 11px; font-family: Tahoma; text-align: center; float: left; height: 24px; width: 131px; padding: 8px 0 0 0; background-image: url(img/bgModulo.png); background-repeat: repeat-x; border-right: 2px solid #fff;}
#modulos #modulo a{text-decoration: none;font-weight: bold;color: #15428b;}
#modulos #modulo a:hover{color: #fff;}

/* =Modulos Silides */
#modulos .slide{list-style:none; position:relative;margin: 0; padding: 0;font-family: Verdana;font-size: 12px;}
#modulos .slide li{width: 125px;height: 64px;display: block;overflow: hidden;padding: 0;}
#modulos .slide.horizontal li{margin-right: 5px;float: left;}
#modulos #item1{background-color: #FFF;border: 1px solid #6893CF;background-image: url(css/img/bgkwick.png);}
#modulos #item2{background-color: #FFF;border: 1px solid #6893CF;background-image: url(css/img/bgkwick.png);}
#modulos #item3{background-color: #FFF;border: 1px solid #6893CF;background-image: url(css/img/bgkwick.png);}
#modulos #item4{background-color: #FFF;border: 1px solid #6893CF;background-image: url(css/img/bgkwick.png);}
#modulos #item5{background-color: #FFF;border: 1px solid #6893CF;background-image: url(css/img/bgkwick.png);}
#modulos .slide.horizontal #item5{margin-right: none;}


/* =SubModulos */
#modulos #submodulo
{
    font-size: 10px;
    font-family: Tahoma;
    text-align: center;
    float: left;
    height: 16px;
    width: 114px;
    padding: 8px 0 0 0;
    background-image: url(img/bgSubModulo.png);
    background-repeat: repeat-x;
    border-right: 2px solid #fff;
}

#modulos #submodulo a
{
    text-decoration: none;
    font-weight: bold;
    color: #15428b;
}
#modulos #submodulo a:hover{color: #fff;}

/* =Perfil */
#perfil
{
    float: left;
    font-family: Tahoma;
    font-size: 12px;
    margin: 10px 0 0 8px;
}

#perfil .Select
{
    color: #000;
    background-color: #d9e6f6;
    border: solid 1px #6699cc;
    font-family: Tahoma;
    font-size: 11px;
}
#perfil .Select:hover{border: solid 1px #ffb74c;}
#perfil a{text-decoration: none;color: Blue;}

/* Contenido del Sistema (páginas) */
#formulario #contenido
{
    clear: both;
    margin: 5px 5px 5px 5px;
    min-height: 640px;
    height: auto !important;
    border: 1px solid #6893cf;
    background-color: #d9e6f6;
    padding: 5px 5px 5px 5px;
}

/* Píe de página del sistema */
#formulario #pie
{
    border-top: 1px solid #6893cf;
    text-align: center;
    width: 100%;
    background-image: url(img/bgPie.gif);
    background-repeat: repeat-x;
    height: 30px;
}

#formulario #pie p
{
    margin: 7px 0 0 0;
    color: #000;
    font-family: Tahoma;
    font-size: 10px;
}

/* Controles del Formulario */
.TextBox{color: #000;background-color: #fff;border: solid 1px #6699cc;font-family: Tahoma;font-size: 11px;}
.TextBox:hover{border: solid 1px #ffb74c;}
.Select{color: #000;background-color: #fff;border: solid 1px #6699cc;font-family: Tahoma;font-size: 11px;height: 20px;}
.Select:hover{border: solid 1px #ffb74c;}
.obligatorio{color: #f00;font-family: Tahoma;font-size: 11px;}
.boton{background-image: url('img/bgboton.gif');background-repeat: repeat-x;border: solid 1px #5887c5;background-color: transparent;font-family: Tahoma;font-size: 11px;color: #000000;text-decoration: none;width: 85px;height: 19px;}
.boton:hover{background-image: url(img/bgbotonHover.gif);background-repeat: repeat-x;border: solid 1px #ffb74c;}
.Calendario
{
    border: solid 1px #6699cc;
    background-color: #fff;
    background-position: right;
    background-image: url(img/icoCalendario.gif);
    background-repeat: no-repeat;
    font-size: 11px;
    color: #15428b;
    font-family: Tahoma;
    text-decoration: underline;
    height: 17px;
    cursor: hand;
    width: 80px;
}
.Calendario:hover{border: solid 1px #ffb74c;cursor: hand;}
.botonCerrar{background-image: url('img/icoCerrar.gif');background-repeat: no-repeat;background-color: transparent;border: solid 0px #5887c5;width: 21px;margin-right: 5px;height: 20px;}
.botonCerrar:hover{background-image: url(img/icoCerrarHover.gif);background-repeat: no-repeat;background-color: transparent;}
.botonCerrar:active{background-image: url(img/icoCerrarActive.gif);background-repeat: no-repeat;background-color: transparent;}
.invisible{display: none !important;}
.valida
{
    color: #BB4637;
    font-family: Tahoma;
    font-size: 11px;
    font-weight: bold;
}
.template{width: 100%;}
.template tr, .template td{padding: 0 0 0 0;border-bottom: solid 1px #fff !important;}
.template tr td div{border-bottom: solid 1px #BBD9EE;}

/* PopUp Opacidad */
.popUpOpacidad{background-color: #414141;filter: alpha(opacity=30); opacity: 0.3;}

.formulario{background-color: #d9e6f6; border: solid 1px #6893cf;}
.formulario .titulo
{
    font-family: Tahoma;
    vertical-align: middle;
    padding: 4px 0px 4px 0px;
    font-size: 14px;
    color: #15428B;
    font-weight: bold;
    text-align: left;
    border-bottom: solid 1px #6893cf;
    vertical-align: middle;
    background-image: url(img/BarraTitulo.png);
    background-repeat: repeat-x;
    background-position-y: bottom;
    margin-bottom: 5px;
    height: 20px;
}

.formulario .titulo span{padding-left: 5px;}
.formulario .controles{font-family: Tahoma;font-size: 11px;width: 100%;}
.formulario .controles tr td{padding: 0 5px 5px 5px;text-align:left;}
.formulario .controles tr td hr{border: 1px solid #6893cf;}
.formulario h4
{
    font-size: 12px;
    font-weight: bold;
    background-color: #0C4BB0;
    color: White;
    margin: 10px 8px 4px 0;
    padding: 4px;
    border: 1px Solid White;
}

.contenedorControles
{
    background-color: #F3F8FC;
    border: solid 1px #6893cf;
    margin: 0 5px 5px 5px;
    padding: 5px 0 0 0;
}

.barraHerramienta, .barraHerramientaDOS
{
    height: 24px;
    background-image: url(img/bgBarraHerramientas.gif);
    background-repeat: repeat-x;
    border-top: solid 1px #6893cf;
    border-left: solid 1px #6893cf;
    border-right: solid 1px #6893cf;
    padding: 2px 5px 0 5px;
    vertical-align: middle;
    background-color: #D7E9FF;
}

.barraHerramientaDOS{margin: 5px 5px 0 5px;height: 32px;text-align:left;}
.barraHerramientaDOS span{font-family:Tahoma;font-size:11px;font-weight:bold;}


/* =Boton: Agregar, Cronometro, Consultar */
.Agregar, .Cronometro, .Consultar, .Guardar
{
    height: 22px !important;
    width: 85px !important;
    float: right;
    background-position: top;
    text-decoration: none;
    color: #000;
    font-size: 11px;
    font-family: Tahoma;
    font-weight: bold;
    padding-left: 31px;
    padding-top: 7px;
}

.Inicio
{
    height: 22px !important;
    width: 85px !important;
    background-position: top;
    text-decoration: none;
    color: #000;
    font-size: 11px;
    font-family: Tahoma;
    font-weight: bold;
    padding-left: 31px;
    padding-top: 7px;
}


.CompartirHrs, .Corrector, .Glosas
{
    height: 18px !important;
    width: 69px !important; /*float: left;*/
    background-position: top;
    text-decoration: none;
    padding-left: 31px;
    padding-top: 7px;
}

.Agregar:hover, .Cronometro:hover, .Consultar:hover, .Guardar:hover, .CompartirHrs:hover, .Corrector:hover, .Glosas:hover, .Inicio:hover
{
    background-position: bottom;
    text-decoration: none;
    color: #06C;
    font-weight: bold;
}

.Agregar{background-image: url(img/btnIngresarHora.png);}
.Cronometro{background-image: url(img/btnCronometro.png);}
.Consultar{background-image: url(img/btnConsultarHora.png);}
.Guardar{background-image: url(img/btnGuardarHora.png);}
.CompartirHrs{background-image: url(img/btnCompartirHrs.png);}
.Corrector{background-image: url(img/btnCorrector.png);}
.Glosas{background-image: url(img/btnGlosas.png);}
.Inicio{background-image: url(img/btnInicio.png);}


/* CSS Ajax Control Tool Kit */
/* =GridView Table */
.GridViewTable
{
    font-family: Tahoma;
    color: #333333;
    border: solid 1px #5887c5;
    width: 100%;
    margin-right: 1px;
    background-color: White;
}
.GridViewTable tr th
{
    font-size: 10px;
}
.GridViewTable tr td
{
    font-size: 9px;
    text-transform: capitalize;
}
.GridViewTable th
{
    background: url(img/bgHeadGridView.png) repeat-x 0px 0px;
    border: solid 1px #5887c5;
    color: #000;
    padding: 4px 5px 4px 10px;
    vertical-align: middle;
    text-align: left;
}
.GridViewTable th a
{
    color: #333333;
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding-right: 10px;
}
.GridViewTable td
{
    color: #333333;
    padding: 4px 10px 4px 10px;
    border-bottom: solid 1px #BBD9EE;
}
.GridViewTable .altrow
{
    background-color: #EBF4FA;
}
.GridViewTable .row
{
    background-color: #fff;
}
.GridViewTable .rownum
{
    text-align: center;
    font-weight: bold;
    color: #333333;
}


/* =CalendarExtender */
.CalendarExtender .ajax__calendar_container
{
    width: 240px;
    background-color: White;
    border: solid 1px #5887c5;
}
.CalendarExtender .ajax__calendar_body{width: 240px;}
.CalendarExtender .ajax__calendar_header{}
.CalendarExtender .ajax__calendar_title{}
.CalendarExtender .ajax__calendar_dayname{font-weight: bold;}
.CalendarExtender .ajax__calendar_day{}
.CalendarExtender .ajax__calendar_hover .ajax__calendar_day{}
.CalendarExtender .ajax__calendar_hover .ajax__calendar_month{}
.CalendarExtender .ajax__calendar_hover .ajax__calendar_year{}
.CalendarExtender .ajax__calendar_active{}
.CalendarExtender .ajax__calendar_today{font-weight: bold;}
.CalendarExtender .ajax__calendar_other .ajax__calendar_day{color: White;}
.CalendarExtender .ajax__calendar_hover .ajax__calendar_today{}
.CalendarExtender .ajax__calendar_hover .ajax__calendar_title{}

/* Accordion */
.accordMenuAccesos
{
    font-family: Tahoma;
    font-size: 12px;
}

.accordMenuAccesos .accordHeader
{
    font-weight: bold;
    margin: 0 4px 4px 4px;
    padding: 8px 0 0 6px;
    border: 1px solid #6893cf;
    height: 22px;
    background-image: url('img/bgAccordionLink.jpg');
    background-repeat: repeat;
}

.accordMenuAccesos .accordHeader:hover
{
    background-image: url('img/bgAccordionActive.jpg');
    background-repeat: repeat;
    border: 1px solid #ffb74c;
}

.accordMenuAccesos .headerSelected
{
    font-weight: bold;
    color: #0C4BB0;
    margin: 0 4px 4px 4px;
    padding: 8px 0 0 6px;
    border: 1px solid #6893cf;
    height: 22px;
    background-image: url('img/bgAccordionLink.jpg');
    background-repeat: repeat;
}

.accordMenuAccesos .accordContent
{
    font-size: 11px;
    margin: 0 4px 6px 4px;
    padding: 6px 0 8px 6px;
    border-left: 1px Dashed #6893cf;
    border-right: 1px Dashed #6893cf;
    border-bottom: 1px Dashed #6893cf;
}

/* asp:Calendario Pro */
.CalendarioPro
{
    font-family: Tahoma;
    font-size: 12px;
    font-weight: bold;
    color: #15428B;
    border: 1px solid #6699cc;
    width: 252px;
    height: 252px;
    padding: 10px;
    text-align: center;
}

.CalendarioPro .Cabecera{border: 1px solid #99BBE8;background-color: White;width: 226px;height: 22px;}
.CalendarioPro .Cabecera .TituloMes{float: left; margin: 4px 0 0 20px;}
.CalendarioPro .Cabecera .TituloAno{float: left;margin: 4px 0 0 4px;}
.CalendarioPro .Cabecera .NextMes{float: right; margin: 0 10px 0 0;}
.CalendarioPro .Cabecera .NextAno{float: right;}
.CalendarioPro .Cabecera .BackMes{float: left;margin: 0 0 0 10px;}
.CalendarioPro .Cabecera .BackAno{float: left;}
.CalendarioPro .TextoDias{font-weight: bold;}
.CalendarioPro .Dias{border: 1px solid #99BBE8;width: 27px;height: 27px;}
.CalendarioPro .DiasMarcado
{
    border: 1px solid #999999;
    color: #666666;
    background-color: #F0F0F0;
    text-decoration: underline;
}
.CalendarioPro .DiasRojo
{
    border: 1px solid Red;
    color: White;
    width: 27px;
    height: 27px;
    background-image: url('img/indicadorRojo.png');
    background-repeat: repeat-x;
    background-color: #CC0000;
}
.CalendarioPro .DiasNaranja
{
    border: 1px solid Orange;
    color: White;
    width: 27px;
    height: 27px;
    background-image: url('img/indicadorNaranjo.png');
    background-repeat: repeat-x;
    background-color: #FF9933;
}
.CalendarioPro .DiasVerde
{
    border: 1px solid Green;
    color: White;
    width: 27px;
    height: 27px;
    background-image: url('img/indicadorVerde.png');
    background-repeat: repeat-x;
    background-color: #2FBD2F;
}
.CalendarioPro .DiaHoy
{
    border: 1px solid #ffb74c;
    color: #15428B;
    width: 27px;
    height: 27px;
    background-color: #FCE381;
}
.CalendarioPro .Invisible{display: none;}

/* =Botones Cronómetro */
.boton,.btnAgregar,.btnIniciar,.btnGrabar,.btnDetener,.btnPausar,.btnCerrar{font-family:Tahoma;font-size:11px;Transparent;background-position-x: right; height:26px; cursor:hand; margin:2px}
.btnAgregar,.btnIniciar,.btnGrabar,.btnDetener,.btnPausar,.btnCerrar{width:26px; background-repeat:no-repeat; border:none 0 Transparent;}
.boton{background-image:url(img/boton.png);background-repeat:repeat-x;border:solid 1px #d3d3d3;}
.btnAgregar{background-image:url(img/botonAgregar.png);}
.btnIniciar{background-image:url(img/botonIniciar.png);}
.btnGrabar{background-image:url(img/botonGrabar.png);}
.btnDetener{background-image:url(img/botonDetener.png);}
.btnPausar{background-image:url(img/botonPausar.png);}
.btnCerrar{background-image:url(img/botonCerrar.png);}
.boton:hover{background-image:url(img/botonHover.png);background-repeat:repeat-x;border:solid 1px #999;}
.btnAgregar:hover,.btnIniciar:hover,.btnGrabar:hover,.btnDetener:hover,.btnPausar:hover,.btnCerrar:hover{background-position-x:left;}
.txtTiempo {font-family: Tahoma;font-size: 11px;font-weight: bold; border: 0 solid transparent; width:52px; background-color:transparent; vertical-align:middle;}
.tablaCronometro{font-family: Tahoma;font-size: 11px;width: 100%;}
.tablaCronometro tr td{padding:0;text-align:left;}








