/*	
	
	PROCEMPA -  Empresa de Tecnologia da Informacao e Comunicacao de Porto Alegre
	T/IGE - Internet e Governo Eletronico
	data de criacao:	12/03/2004
	data de versao:	08/2010
	versao 3.0
	normal			Basicão - hot sites
	
*/

/* ESTRUTURAS GERAIS (SELETORES HTML) ___________________________________ */

html, body {												
	height:100%;							/* altura do corpo fica em 100% para ocupar toda tela */
	text-align: left; 					/* ajusta tudo ao centro (só funciona no IE) */
	padding:0;								/* margem interna */
	margin: auto;							/* margem externa */
	background-color:#FFFFFF;		/* cor defundo */
	font-family:verdana,arial,helvetica,sans-serif;			/* familia tipografica que será aplicada a tudo */
	color: #000000;						/* cor padrão da tipografia */	
	font-size: 0.8em;						/* tamanho do texto (tem de ser em .em para acessibilidade */
	}

a:link, a:visited, a:active 
	{text-decoration:none;}			/* link normal, visitado, ativo decoração dos links (sem decoração, sem underline) */
a:visited 
	{color:navy;}							/* cor do link visitado */
a:hover 
	{text-decoration:underline;}		/* decoração do link passa ter underline (quando mouse está em cima do link)  */
	

/* ESTRUTURA INTERNA GERAL(DIVS) _____________________________________________ */


#container {								/* div que serve de "container", as divs estão dentro dela */
	margin: 0 auto;						/* faz a div ficar centralizada na página (não funciona no IE) */
	margin-bottom: -100px;
	width: 1000px;
	height: 100%;
	/*border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;*/
	}

#cabecalho {
	position: relative;
	padding:10px;
	height: 150px;
	border: 0px solid #ccc;
	background: url('../images/cabecalho_comui.jpg') no-repeat;
	}

#col_esquerda {
	position:relative;
	float:left;
	width:180px;
	margin: 30px 0 0 0; 
	padding:0 0 1px 0;
	z-index:3;
	background:#ae6228; 
	}

#conteudo {
	position:relative;
	float:left;
	width:550px;
	margin: 0;
	padding: 10px;
	left:12px;
	/*border:1px solid #00FF22;*/
	font-size: 1.3em;
	}
	
#texto {width:500px;}	

#col_direita {
	position:relative;	
	width:230px;
	float:right;	
	top: 0;	
	margin: 0;
	font-size: 1em;
	/*border:1px solid blue;*/
	z-index:3001;
	border-top:0px solid #ae6228; 
	}

#col_direita .barra_eventos {position:relative; left:2px; height:27px;}

#col_direita img {border:0px none;}	


#cont_col_dir a:link, #cont_col_dir a:visited, #cont_col_dir a:active{color:#000;}
	
#rodape { 
	position:relative;
	width:1000px;
	height: 100px;								/* faz a div ficar centralizada na página (não funciona no IE) */
	margin: 0 auto;							/* faz a div ficar centralizada na página (não funciona no IE) */
	background-color: white;
	color: #000000;
	border: 0px solid red;
	font-size: 1em;
	clear:both;
	z-index:0;
	}
	
/* CABEÇALHO - ESTRUTURA INTERNA _______________________________ */

#brasao_cor {
	position:relative;
	float:left;
	top:10px;
	}
		
#brasao_pb {
	position:absolute;
	visibility:hidden;
	width:0;
	height:0;
	}			

/* Menu horizontal e vertical __________________________________________ */

ul.cssMenu, ul.cssMenu li, ul.cssMenu ul {
 width: 180px; /* Menu Width */
 margin: 0;
 padding:0;
 list-style: none;
}

ul.cssMenu li { float: left; position: relative;  width: 100%; }
ul.cssMenu li.iehover { z-index: 1000; /* IE z-index bugfix */ }

ul.cssMenu ul {
 display: none;
 position: absolute;
 top: 0;
 left: 100%;
 z-index: 9999;
 background:#ae6228; 
 left:179px;
 padding:0 0 1px 0;
}



/* Root Menu */
ul.cssMenu a {

margin:1px 1px 0 1px;
 padding: 8px;
 display: block;
 background: #f3e782;
 color: #000;
 font: normal 14px Arial, sans-serif;
 text-decoration: none;
 height: 1%;
 
}

/* Root Menu Hover Persistence */
ul.cssMenu a:hover, ul.cssMenu li:hover a, ul.cssMenu li.iehover a {
 background:#f08100;
 color: #FFF;
	}

/* 2nd Menu */
ul.cssMenu li:hover li a, ul.cssMenu li.iehover li a {
 float: none;
background: #f3e782;
 color:#000;

}

/* 2nd Menu Hover Persistence */
ul.cssMenu li:hover li a:hover, ul.cssMenu li:hover li:hover a, ul.cssMenu li.iehover li a:hover, ul.cssMenu li.iehover li.iehover a {
 background:#f08100;
  color:#fff;
}

/* 3rd Menu */
ul.cssMenu li:hover li:hover li a, ul.cssMenu li.iehover li.iehover li a {
 background: #999;
}

/* 3rd Menu Hover Persistence */
ul.cssMenu li:hover li:hover li a:hover, ul.cssMenu li:hover li:hover li:hover a, ul.cssMenu li.iehover li.iehover li a:hover, ul.cssMenu li.iehover li.iehover li.iehover a {
 background: #666;
}

/* 4th Menu */
ul.cssMenu li:hover li:hover li:hover li a, ul.cssMenu li.iehover li.iehover li.iehover li a {
 background: #666;
}

/* 4th Menu Hover */
ul.cssMenu li:hover li:hover li:hover li a:hover, ul.cssMenu li.iehover li.iehover li.iehover li a:hover {
 background: #333;
}

/* Hover Function - Do Not Move */
ul.cssMenu li:hover ul ul, ul.cssMenu li:hover ul ul ul, ul.cssMenu li.iehover ul ul, ul.cssMenu li.iehover ul ul ul { display: none; }
ul.cssMenu li:hover ul, ul.cssMenu ul li:hover ul, ul.cssMenu ul ul li:hover ul, ul.cssMenu li.iehover ul, ul.cssMenu ul li.iehover ul, ul.cssMenu ul ul li.iehover ul { display: block; }
View the JavaScript (for IE)
* Internet Explorer

/* COL ESQUERDA - ESTRUTURA INTERNA ____________________________ */


/* COL DIREITA - ESTRUTURA INTERNA ______________________________ */

#procura {
	position:relative;
	margin: 0;
	padding: 2px 0 0 0;
	}

#campo { 
	height:34px; 
	width: 100px; 
	border: 0px solid #4C6781; 
	}

#busca { 
	margin: 1px 0 0 10px; 
	}

#busca_direita {height:40px; width:300px}

.btn_buscad {position:relative; top:5px;}	
	

/* acessibilidade ______________________________________________ */ 
    
/* acessibilidade - menu invisível para cegos */
span.accesskey {                /*  escondendo o menu para cegos  */
    text-decoration:none;
    }
.accessibility {                        /*  escondendo o menu para cegos  */
    position: absolute;
    top: -999em;
    left: -999em;
    }   
    
/* acessibilidade - caixa geral */  
#acessibilidade {
    position:relative;
    width:210px;
    /*float:right;               quando flutuar ao lado direito do caminho */
    text-align:center;
    background-color:#6aa4d7;                                  
    margin: 11px 0 0 0;
    padding: 2px 0 8px 0;
    z-index:24;
    border:1px solid #333;
    clear:both;
    }
    
    html>body #acessibilidade {  }                  /* ajuste firefox - chrome */   

/* acessibilidade - link a1 */
.a1:active, .a1:link, .a1:visited, .a1:hover { 
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;
    }

/* acessibilidade - link a2 */
.a2:active, .a2:link, .a2:visited, .a2:hover { 
    text-decoration: none; 
    color: #000; 
    font-size:2em; 
    font-weight:bold; 
    }

/* acessibilidade - link a3 */
.a3:active, .a3:link, .a3:visited, .a3:hover { 
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;
    }
    
/* acessibilidade - link a4  */
.a4:active, .a4:link, .a4:visited, .a4:hover { 
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;
    }   

/* acessibilidade - link preto */
.preto:active, .preto:link, .preto:visited { 
    text-decoration: none; 
    color: #fff; 
    font-weight:bold; 
    }
.preto:hover { text-decoration : underline; font-weight:bold; }

/* acessibilidade - caixa preto */
.preto_acessivel  {
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;
    }
    
/* acessibilidade - caixa preto */
.preto_acessivel_m {
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;
    }   

/* acessibilidade - caixa preto */
.preto_m {
    position:absolute;
    visibility:hidden;
    width:0;
    height:0;   
    }   

/* acessibilidade - caixa preto */
.preto {
    position:relative;
    text-align:center;
    width:22px; 
    height:22px;
    margin: 0;
    padding: 0 0 2px 0;
    background-color: #000;
    color:#fff;
    font-size:2em;
    }       
    
    html>body .preto {  padding: 0 6px 0 6px; word-spacing: 0; }

/* acessibilidade - link ajuda  */
.ajuda:active, .ajuda:link, .ajuda:visited, .ajuda:hover { 
    text-decoration: none; 
    color: #000; 
    font-size:2.5em; 
    font-weight:bold;
    display:none; 
    }
.ajuda:hover { text-decoration : underline; }



/*  redes sociais __________________________________________________ */

#caixa_redes_sociais {
position:relative;
clear:both;
display:block;
left:0;
}

#slider_redes_sociais {
position:relative;
display:block;
clear:both;
width:220px;
height:228px;
background-color:#fff;
padding:0;
text-align:center;
}

#slider_redes_sociais ul, #slider_redes_sociais li {
list-style:none;
margin:0;
padding:0;
}

#slider_redes_sociais li {
width:220px;
height:228px;
overflow:hidden;
}

#caixa_redes_sociais h1 {
font-size:1.5em;
font-weight:700;
font-family:arial, helvetica, sans-serif;
text-align:center;
}


.graphic {
display:block;
}

#prevBtn a, #sliderprev a {
position:absolute;
display:block;
left:0;
top:110px;
width:18px;
height:18px;
background:url('../../proweb3_generico/images/botoes/btn_prev.gif') no-repeat 0 0;
z-index:5
}

#nextBtn a, #slidernext a {
position:absolute;
display:block;
top:110px;
left:205px;
width:18px;
height:18px;
background:url('../../proweb3_generico/images/botoes/btn_next.gif') no-repeat 0 0;
z-index:5
}

/*APLICAÇÃO METROCLIMA ______________________________________________________________ */

#app_metroclima
{
background-color:#eeeeee;
border:1px solid #bababa;
height:30px;
margin:15px 0 13px 0;
}

#app_metroclima img
{
border:0px none;
}

#app_metroclima a:link, #app_metroclima a:visited, #app_metroclima a:active
{
height:30px;
text-decoration:none;
color: #000;
z-index:0;
cursor:pointer;
}

#app_metroclima a:hover
{
background:url('../../proweb3_generico/images/fundos/bg_itens_uteis.png') repeat-x;
text-decoration:none;
float:left;
width:188px
}

#app_metroclima .ico_metroclima
{
position:absolute;
left:-1px;
width:45px;
height:35px;
z-index:0;
}

#app_metroclima ul
{
position:relative;
margin:2px 20px 0 0;
padding:0;
list-style:none;
float:right;
*left:-25px;
}

#app_metroclima li
{
display:inline;
vertical-align:middle;
text-align:center;
margin:0;
padding:0;
line-height:0;
}

#app_metroclima .max_min
{
float:left;
line-height:12px;
font-weight:bold;
font-size:0.85em;
margin-left:35px;
top:1px;
}

#app_metroclima .data_metroclima
{
position:relative;
float:right;
line-height:10px;
font-size:0.8em;
z-index:999999;
}

#app_metroclima .max_min .temp_max
{
color:#ff0000;
}
#app_metroclima .temp_min
{
color:#0066cc;
}

/*BANNERS RANDÔMICOS _________________________________________ */

#banner1
{
position:relative;
width:190px;
height:70px;
margin:0 0 10px 0;
z-index:-1;
}

#banner2
{
position:relative;
width:190px;
height:70px;
margin: 0;
z-index:-1;
}

.banner3
{
position:relative;
width:190px;
height:70px;
margin:0 0 20px 0;
z-index:-1;
}

/*NEWSLETTER*/

#formnews
{
border:1px solid #bababa;
background-color:#E1E6E0;
display:none;
margin:8px 0 0 0;	
z-index:10;
}

#formnews label
{float:left; margin: 10px 0 0 12px;}

#formnews form {margin:0;}

#campo_news {
	margin: 3px 0 0 3px;
	width: 190px;
	height: 21px;
	padding: 0 0 0 5px;
	border-style: none;
	font-size: 1.2em;
	font-weight:bold;
	outline:none;
	border:1px solid #bababa;
	background-color:#fff;
	}

#campo_news_email {
	margin: 3px 0 0 3px;
	width: 190px;
	height: 21px;
	padding: 0 0 0 5px;
	border-style: none;
	font-size: 1.2em;
	font-weight:bold;
	outline:none;
	border:1px solid #bababa;
	background-color:#fff;
	}
#news_assinar
       {
       position:relative;
       margin: 10px 0 10px 0;
       width: 124px;
       height: 39px;
       clear:both;
       color:#000;
       font-weight:bold;
       border: 1px solid #A6B5A2;
       background: -moz-linear-gradient(top, #BDFE6E, #ABE26B);
	   background: -webkit-gradient(linear, left top, left bottom, from(#BDFE6E), to(#ABE26B));
	   filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#BDFE6E', EndColorStr='#ABE26B');
 	   text-shadow: 0 1px 0 #DDD;
       }

/* Assinatura PROCEMPA __________________________________________ */


#gallery {
position:relative;
float:right;
top:0;
height:70px;
width:220px;
overflow:hidden;
margin:10px 0;
}

#gallery a {
float:right;
position:absolute;
}

#gallery a img {
border:none;
top:0;
left:0;
}

#gallery a.show {
top:0;
left:0;
z-index:5;
}

/* estilos PAINEL DESTAQUE    _______________________________________________________________ */

#destaques {
	position:relative;
	float:right;
	border: 0px solid blue;
	z-index:1
	}
	
#destaques ul {
	width:auto;
	margin:20px;
	border:0px solid red;
	}

#destaques li {  

            display:none;
            font-family:Arial, Verdana, Helvetica, sans-serif;
            font-size: 0.9em;
            font-weight:bold;
            text-align:center;
            } 

#destaques li a {

            display:none;
            padding:5px 10px 5px 10px;
            text-decoration:none;
            background:#000;
            color:#FFF;
} 

#destaques li a:hover {
	

  background:#FFF;
  color: #808080;
}

#destaques li a.selected {

  background: #808080;
  color:#FFF;
}

.a1_tag_turista {
            position: relative;
            background-color:#7f0f57;
            padding:9px;
            margin:0;
            color: #fff;
            top:30px;
            }

.a1_tag_turista a:link, .a1_tag_turista a:visited, .a1_tag_turista a:active, .a1_tag_turista a:hover {
            color: #fff;
            }
            
         

/* estilo dos links dos titulos e das tags do painel de imagens do cabeçalho */

.titulo_cabecalho {
			visibility:hidden;		
  			}

.titulo_cabecalho h1 a:link, .titulo_cabecalho h1 a:visited, .titulo_cabecalho h1 a:active 
			{
            text-decoration: none;
            color: #fff;
            z-index:99999;
            text-align:left;
            float:left;
			background-image: url('../../proweb3_sites/images/fundos/bg_painel_perfil_home2.png');
			background-repeat: repeat-x;
            /*line-height: 47px;*/
            width:auto; margin-left:0; margin-right:0; margin-top:16px; margin-bottom:0; padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px
            
            }
            
.titulo_cabecalho h1 a:hover 
			{
            text-decoration: underline;
            color: #fff;
			background-image: url('../../proweb3_sites/images/fundos/bg_painel_perfil_home2.png');
			background-repeat: repeat-x;
			z-index:99999;
	        text-align:left;
	        /*line-height: 47px;*/
	        width:auto; margin-left:0; margin-right:0; margin-top:16px; margin-bottom:0; padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px
	        
	        }                                                                                            

.titulo_cabecalho span a:link, .titulo_cabecalho span a:visited, .titulo_cabecalho span a:active {
            text-decoration: none;
            text-transform:none;
            color: #fff;
			position:relative;
            font-family:Arial, Verdana, Helvetica, sans-serif;
            font-size:1em;
            font-weight:bold;
            background-image: url('../../proweb3_sites/images/fundos/bg_painel_perfil_home.png');padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px      
            }

.titulo_cabecalho span a:hover 
			{
            text-decoration: underline;
            text-transform:none;
            color: #fff;
 			position:relative;
            font-family:Arial, Verdana, Helvetica, sans-serif;
            font-size:1em;
            font-weight:bold;
            background-image: url('../../proweb3_sites/images/fundos/bg_painel_perfil_home.png');
            }	


#message {
  margin:10px auto;
  border:6px solid #222;
  width:240px;
  height:40px;
  background:#0D0D0D;
  font-size:1.3em;
  line-height:2em;
  color:#FC4;
}

#tab_destaques {
	position:relative;
	/*z-index:50;*/
	/*margin-bottom:15px;*/
	width: 600px;
	height:210px;
	/*background-color:#727272;*/
	border:0px solid red;
	z-index:3; margin-left:0; margin-right:0; margin-top:0; margin-bottom:8px
	}
 
.marginal { 
	position:absolute;
	width: 600px;
	height:210px;
	}
	
#secundario { height:160px; *height:200px; border:0px solid red;}
	
#coluna_2 {width:240px; height:240px;  *height:200px; float: left;}
	
#coluna_3 {width:240px; height:240px; *height:200px; float: right;}

.lead {width:auto; height:240px;}

.direita {float:left; margin-right:10px;}

#lista_secoes {display:none !important;} /*PARA FAZER VOLTAR A BARRA DE REDES SOCIAIS É SÓ TIRAR ESTA LINHA*/

/* Contatos __________________________________________ */	
#tab_contato {
clear: both;
text-align: center;
width: 200px;
background-color: #6aa4d7;
color: #fff;
margin: 80px 0 0;
border:0px solid red;
height:48px;
position: relative;
top:22px;
}

#contato_sec {
background-color: #6aa4d7;
clear: both;
display: block;
float: left;
height: auto;
padding: 5px 10px;
position: relative;
width: 530px;
top:20px;
}


#paginador
{
position:relative;
width:312px;
max-width:312px;
left:auto;
height:34px;
padding-top:20px;
}

#paginador ul {
    list-style-type: none;
}
#paginador li {
    float: left;
    display: inline;
    margin: 0 5px 0 0;
    display: block;
}
#paginador li a {
    color: #696969;
    padding: 4px;
    border: 1px solid #696969;
    text-decoration: none;
    float: left;
    font-size: 0.8em;
}
#paginador li a:hover {
    color: #696969;
    background: #D3D3D3;
    border: 1px solid #696969;
    font-size: 0.8em;
}
#paginador li.nolink {
    color: #DCDCDC;
    border: 1px solid #DCDCDC;
    padding: 4px;
    font-size: 0.8em;
}
#paginador li.current {
    color: #FFF;
    border: 1px solid #333;
    padding: 4px;
    background: #333;
    font-size: 0.8em;
}

#paginador2
{
position:relative;
width:auto;
top:15px;
left:75px;
height:28px;
clear:both;
}

#paginador2 ul {
    list-style-type: none;
}
#paginador2 li {
    float: left;
    display: inline;
    margin: 0 5px 0 0;
    display: block;
}
#paginador2 li a {
    color: #696969;
    padding: 4px;
    border: 1px solid #696969;
    text-decoration: none;
    float: left;
    font-size: 0.8em;
}
#paginador2 li a:hover {
    color: #696969;
    background: #D3D3D3;
    border: 1px solid #696969;
    font-size: 0.8em;
}
#paginador2 li.nolink {
    color: #DCDCDC;
    border: 1px solid #DCDCDC;
    padding: 4px;
    font-size: 0.8em;
}
#paginador2 li.current {
    color: #FFF;
    border: 1px solid #333;
    padding: 4px;
    background: #333;
    font-size: 0.8em;
}

#col_result_n h1 { margin:5px 0px 0px 0px; padding:0px; border:0px solid green; }

#col_result_g h1 { margin:5px 0px 0px 0px; padding:0px; border:0px solid green; }

#busca_google {clear:both;}     