/********************************************************/
/******************** LAYOUT DO SITE ********************/
/********************************************************/

.body   
{
    background: url(../imagem/fundo.jpg) bottom right no-repeat;
    font-size: .80em;
    font-family: "Calibri", "Cambria", "Arial", "Bookman Old Style", Helvetica, Verdana, sans-serif;
    margin: 0px;
    padding: 0px;
}
                
.page
{
    height: auto;
    min-height: 800px;
    width: 98%;
    min-width: 800px;
    max-width: 98%;
    background-color: transparent;
    margin: 10px  auto 0px auto;
}

.cabecalho
{
    position: relative;
    margin: 0px;
    padding: 0px;
    background: transparent;
    width: 100%;
    height: 70px;
}

.logo_cs_h75
{
    position: absolute;
    background: url('../imagem/logo_csw_branco_h75.png') no-repeat;
    width: 70%;
    height: 75px;
    top: 0px;
    left: 0px;
}

.logo_cs_h150
{
    position: absolute;
    background: url('../imagem/logo_csw_preto_h150.png') no-repeat;
    width: 70%;
    min-height: 150px;
    top: 0px;
    left: 0px;
}

.logo_shop
{
    position: absolute;
    width: 30%;
    height: 75px;
    top: 0px;
    right: 0px;
}

.titulo
{
    display: block;
    float: left;
    text-align: left;
    width: auto;
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #FFFFFF;
    border: none;
    line-height: 2em;
    font-size: 2em; 
}

.corpo
{
    background-color: #FFFFFF;
    padding: 0px 12px;
    min-height: 470px;
    height: auto;
    border: 2px;
    border-left-color: Black;
    border-right-color: Black;
    border-bottom-color: Black;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
}

.mensagem_erro
{ 
    /*position: relative;*/
	clear: both;
    min-height: 30px;
}

.formulario
{ 
    position: relative;
    min-width: 430px;
	text-align: center;
}
/*
.cadastro
{ 
    position: relative;
	clear: both;
    min-height: 430px;
}

.consulta
{ 
	clear: both;
    min-height: 430px;
}

.consulta_filtro
{ 
	clear: both;
    min-height: 55px;
}

.consulta_lista
{ 
	clear: both;
    min-height: 325px;
}
*/
.lancamento
{
    position: relative;
    width: 50%;
    height: auto; 
    top: 0px;
    left: 0px;
}

.lancamento_lista
{
    position: absolute;
    width: 50%;
    height: auto;
    top: 0px;
    right: 0px;
}

.relatorio
{
    background-color: White;
    margin: 10px;
}

.rodape
{
    padding: 5px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
}

/********************************************************/
/*************** LAYOUT DA TELA DE LOGIN ****************/
/********************************************************/

.login
{
    position: relative;
    background: url(../imagem/caixa_confirma.png) no-repeat;
	width: 400px;
	height: 205px;
	
	border-radius: 10px;
	box-shadow: #505050 -10px 10px 10px;
}

.login_icone
{
    position: absolute;
	padding: 10px 0 0 15px;
}

.login_titulo 
{
    position: relative;
    padding: 20px 0px 0px 30px;
	color: #000000;
	font: bold 20px "Arial";
}

.login_botao 
{
    position: relative;
    text-align: right;
	color: #000000;
	font: bold 20px "Arial";
}

.login_caixa
{
    position: relative;
    margin-top: 15px;
    margin-left: 7px;
	width: 384px;
	height: auto;
	/*border: #999999 1px solid;*/
}

/********************************************************/
/********************* MODAL POPUP **********************/
/********************************************************/

.modal_background 
{
	background-color: Black;
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.modal_popup 
{
    background-color: White;
    /*background-image: url(../imagem/design/caixa_popup.png);*/
	width: 470px;
	height: auto; /*180px;*/
	border: solid 2px black;
    border-radius: 20px;
	box-shadow: black 0px 0px 50px;
}

.modal_popup_selecionar_imagem
{
    background-color: White;
    /*background-image: url(../imagem/design/caixa_popup.png);*/
	width: 600px;
	height: 100px;
	border: solid 2px black;
    border-radius: 20px;
	box-shadow: black 0px 0px 50px;
}

.modal_botao_fechar
{
    position: absolute;
	padding: 0px 0px 0px 460px;
}

.modal_titulo_mensagem
{
    position: relative;
    text-align: center;
    padding: 20px;
	color: Red;
	font: bold 20px "Arial";
}

.modal_mensagem
{
    position: relative;
    text-align: center;
    padding: 5px 20px 20px 20px;
	color: #4c4c4c; 
	font: bold 12px "Arial";
}

/************************************************************/
/****************** POPUP DE PROCESSAMENTO ******************/
/************************************************************/

#divProcessando
{
	background: url(../imagem/icone/aguarde.gif) no-repeat center;
	position: fixed;
	z-index: 99;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

/********************************************************/
/************************* GRID *************************/
/********************************************************/

.BlueExploreBar /*Titulo da Grid*/
{
	background-color:#f2f2f2;
    background-image: url(../imagem/grid/titulo-grid.gif);
    background-repeat: repeat;
    height: 20px;
    color:#000040;
}

/********************************************************/
/****************** DESIGN FORMULARIO *******************/
/********************************************************/

.checkbox
{
  	font-family: arial;
	cursor: pointer; 
	font-weight: bold;
	font-size: 12px;
	color: #444499
}

.radiobutton
{
	font-family: arial;
	/*cursor: pointer;
	font-weight: bold;*/
	font-size: 12px;
	color: #000000;
}

.label
{
	font-family: arial;
	color: #4c4c4c; 
	font-size: 12px; 
	font-weight: bold;
}

.label_erro
{
	font-family: arial;
	color: #b50000; 
	font-size: 14px; 
	font-weight: bold;
}

.label_mensagem
{
	font-family: arial;
	color: #2a00b5; 
	font-size: 14px; 
	font-weight: bold;
}

.label
{
	font-family: arial;
	color: #000000; 
	font-size: 12px; 
	font-weight: bold;
}

.label_titulo_formulario
{
	font-family: arial;
	color: #4c4c4c;
	font-size: 14px; 
	font-weight: bold;
}

.textbox_obrigatorio
{
	border: #CC0000 1px solid; 
	font-family: arial;
	font-size: 12px; 
	padding: 2px 5px;

    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.textbox
{
	border: #999999 1px solid; 
	font-family: arial;
	font-size: 12px;
	padding: 2px 5px;
	
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.datagrid_titulo
{
    background-image: url(../imagem/design/barra_titulo.png);
	font-family: arial;
	color: #ffffff;
	font-size: 12px;
	font-weight: bold;
}

/********************************************************/
/************************ TEXTOS ************************/
/********************************************************/

h1, h2, h3, h4, h5
{
    color: #666666;
    /*font-variant: small-caps;*/
    text-transform: none;
    margin-bottom: 0px;
}

h1
{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2
{
    font-size: 1.5em;
    font-weight: 600;
}

h3
{
    font-size: 1.2em;
}

h4 /*Textos */
{
    font-size: 1.1em;
    font-weight: bold;
}

h5
{
    font-size: 1em;
    font-weight: bold;
}

.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
    margin-top: 0px; 
}

/********************************************************/
/***************** LAYOUTO DO CALENDÁRIO ****************/
/********************************************************/

.Calendario
{
    background-color: #E5E5E5;
    border: solid 1px #000000;
    width: 230px;
}

.Calendario .ajax__calendar_header  
{
    background-color: #FFFFFF;
    margin-bottom: 4px;
    border: solid 1px #000000;
    width: 220px;     
}

/*STILO DO MÊS E ANO NO TITULO DO CALENDÁRIO*/
.Calendario .ajax__calendar_title,
.Calendario .ajax__calendar_next,
.Calendario .ajax__calendar_prev    
{
    color: #000000; /*#004080;*/
    padding-top: 3px;   
}

/*QUADRO DO CALENDÁRIO*/
.Calendario .ajax__calendar_body    
{
    background-color: #FFFFFF;
    border: solid 1px #000000;
    width: 220px;
}

.Calendario .ajax__calendar_dayname 
{
    text-align: center;
    font-weight: bold;
    margin-bottom: 4px;
    margin-top: 2px;
    font-size: 12px;
    height: 17px;
    width: 27px;
    padding: 0 1px;
    margin-left: 2px;  
}

.Calendario .ajax__calendar_day 
{
    text-align: center;
    font-size: 12px;
    width:25px;
}

.Calendario .ajax__calendar_hover .ajax__calendar_day,
.Calendario .ajax__calendar_hover .ajax__calendar_month,
.Calendario .ajax__calendar_hover .ajax__calendar_year,
.Calendario .ajax__calendar_active  
{
    color: #FFFFFF; /*#004080;*/
    font-weight: bold;
    background-color: #007DBE; /*#B2C9FF;*/
}

.Calendario .ajax__calendar_today   
{
    font-weight: bold;
    text-align: center;
    width: 220px;
}

.Calendario .ajax__calendar_other
{
    color: #D8D8D8; /*este campo deve conter a mesma cor do calendário, para não ser visualizado na tela*/
}

/********************************************************/
/******************** TAB CONTAINER *********************/
/********************************************************/

.fancy-green .ajax__tab_header
{
	background: url("../imagem/design/green_bg_Tab.gif") repeat-x;
	cursor:pointer;
}
.fancy-green .ajax__tab_hover .ajax__tab_outer, .fancy-green .ajax__tab_active .ajax__tab_outer
{
	background: url("../imagem/design/green_left_Tab.gif") no-repeat left top;
}
.fancy-green .ajax__tab_hover .ajax__tab_inner, .fancy-green .ajax__tab_active .ajax__tab_inner
{
	background: url("../imagem/design/green_right_Tab.gif") no-repeat right top;
}
.tabcontainer .ajax__tab_header
{
	font-size: 13px;
	font-weight: bold;
	color: #000000;
	font-family: sans-serif;

	text-align: left;
	padding: 0px 10px;
}
.tabcontainer .ajax__tab_active .ajax__tab_outer, .tabcontainer .ajax__tab_header .ajax__tab_outer, .tabcontainer .ajax__tab_hover .ajax__tab_outer
{
	height: 46px;
}
.tabcontainer .ajax__tab_active .ajax__tab_inner, .tabcontainer .ajax__tab_header .ajax__tab_inner, .tabcontainer .ajax__tab_hover .ajax__tab_inner
{
	height: 46px;
	margin-left: 16px; /* offset the width of the left image */
}
.tabcontainer .ajax__tab_active .ajax__tab_tab, .tabcontainer .ajax__tab_hover .ajax__tab_tab, .tabcontainer .ajax__tab_header .ajax__tab_tab
{
	margin: 16px 16px 0px 0px;
}
.tabcontainer .ajax__tab_hover .ajax__tab_tab, .tabcontainer .ajax__tab_active .ajax__tab_tab
{
	color: #fff;
}
.tabcontainer .ajax__tab_body
{
	font-family: Arial;
	font-size: 10pt;
	border-top: 0;
	/*border:1px solid #4582C4;
	padding: 8px;*/
	background-color: #ffffff;
}

/************************************************************/
/******************** DESIGN DOS BOTÕES *********************/
/************************************************************/

.botao 
{
    border: 2px solid #5E8DBC;
    /*background: #4A9ED6;*/
    background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#BFBFFF));
    background: -webkit-linear-gradient(top, #FFFFFF, #BFBFFF);
    background: -moz-linear-gradient(top, #FFFFFF, #BFBFFF);
    background: -ms-linear-gradient(top, #FFFFFF, #BFBFFF);
    background: -o-linear-gradient(top, #FFFFFF, #BFBFFF);
    padding: 6px 20px; /*Espaçamento do texto com a borda do botão*/
    /*-webkit-border-radius: 6px;*/
    border-radius: 5px;
    /*-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;*/
    /*box-shadow: rgba(0,0,0,1) 0 1px 0;*/
    /*text-shadow: rgba(0,0,0,.4) 0 1px 0;*/
    cursor: pointer;
    /*Texto*/
    color: #4C4C4C;
    font-size: 13px;
    font-weight: bold;
    font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
    text-decoration: none;
    vertical-align: middle;
}

.botao:hover 
{ /*Definição de cores ao passar o mouse pelo botão*/
    border: 2px solid #5E8DBC; /*Borda*/
    /*background: #000084; /*Fundo*/
    background: -webkit-gradient(linear, left top, left bottom, from(#D8D8D8), to(#BFBFFF));
    background: -webkit-linear-gradient(top, #D8D8D8, #BFBFFF);
    background: -moz-linear-gradient(top, #D8D8D8, #BFBFFF);
    background: -ms-linear-gradient(top, #D8D8D8, #BFBFFF);
    background: -o-linear-gradient(top, #D8D8D8, #BFBFFF);
    color: #5E8DBC; /*Texto*/
}

.botao:active 
{ /*Definição de cores ao precionar o botão*/
    border: 2px solid #000000; /*Borda*/
    background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#7F7F7F));
    background: -webkit-linear-gradient(top, #000000, #7F7F7F);
    background: -moz-linear-gradient(top, #000000, #7F7F7F);
    background: -ms-linear-gradient(top, #000000, #7F7F7F);
    background: -o-linear-gradient(top, #000000, #7F7F7F);
    color: #FFFFFF; /*Texto*/  
}

.botao_alerta 
{
    border: 2px solid #BA5D5D;
    background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#FFBFBF));
    background: -webkit-linear-gradient(top, #FFFFFF, #FFBFBF);
    background: -moz-linear-gradient(top, #FFFFFF, #FFBFBF);
    background: -ms-linear-gradient(top, #FFFFFF, #FFBFBF);
    background: -o-linear-gradient(top, #FFFFFF, #FFBFBF);
    padding: 6px 20px; /*Espaçamento do texto com a borda do botão*/
    border-radius: 5px;
    /*box-shadow: rgba(0,0,0,1) 0 1px 0;*/
    cursor: pointer;  
    /*Texto*/
    color: #4C4C4C;
    font-size: 13px;
    font-weight: bold;
    font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
    text-decoration: none;
    vertical-align: middle;
}

.botao_alerta:hover 
{ /*Definição de cores ao passar o mouse pelo botão*/
    border: 2px solid #BA5D5D; /*Borda*/
    /*background: #000084; /*Fundo*/
    background: -webkit-gradient(linear, left top, left bottom, from(#D8D8D8), to(#FFBFBF));
    background: -webkit-linear-gradient(top, #D8D8D8, #FFBFBF);
    background: -moz-linear-gradient(top, #D8D8D8, #FFBFBF);
    background: -ms-linear-gradient(top, #D8D8D8, #FFBFBF);
    background: -o-linear-gradient(top, #D8D8D8, #FFBFBF);
    color: #BA5D5D; /*Texto*/
}

.botao_alerta:active 
{ /*Definição de cores ao precionar o botão*/
    border: 2px solid #000000; /*Borda*/
    background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#7F7F7F));
    background: -webkit-linear-gradient(top, #000000, #7F7F7F);
    background: -moz-linear-gradient(top, #000000, #7F7F7F);
    background: -ms-linear-gradient(top, #000000, #7F7F7F);
    background: -o-linear-gradient(top, #000000, #7F7F7F);
    color: #FFFFFF; /*Texto*/
}

.botao_titulo
{
    border: 0px;
    background-color: transparent;
    /*Texto*/
    color: #FFFFFF;
    font-family: Arial;
    font-size: 12px;
    font-weight: bold;   
    text-decoration: none;
    text-align: left;
    vertical-align: middle;
    cursor: pointer;
}