/* min-width nos wrappers serve para garantir o background quando o viewport eh menor que min-width do componente interno */
/* #AF97D3 - Lilás Claro */
/* #8C73A9 - Lilás Escuro */
/* #C29B8E - Marrom Claro */

#topo1Wrapper   	{ top: 0; z-index: 9}
#topo1Wrapper   	{ background-color: #643E9B; } /*#54309c;*/
#topo1Wrapper   	{ min-width: 980px; width: 100%; }
#topo1 				{ min-width: 980px; width: 97%; margin: 0 auto; position: relative; height: 76px; text-align: center;}
#topo1L             { width: 70px; float: left; }
#topo1M             { float: left }
#topo1R0            { float: right; }
#topo1R0 a          { color: #fff; padding: 0 10px; line-height: 40px; display: block; text-align: center; text-decoration: none}
#topo1R0 a:hover    { background-color: #fff; color: #000}
#topo1R0 a i.fa     { line-height: 38px; }
#topo1R             { float: right }
#topo1R2            { float: right }

#topo2Wrapper   	{ padding-top: 40px; border-bottom: 1px solid #bbb; background: #eee;}
#topo2Wrapper   	{ min-width: 980px; width: 100%; }
#topo2 				{ min-width: 980px; width: 97%; margin: 0 auto; position: relative;  text-align: left; padding-bottom: 2px; }

#conteudoWrapper  	{ min-width: 980px; width: 100%; }
#conteudo        	{ min-width: 980px; width: 97%; margin: 0 auto; position: relative; text-align: left; margin-top:10px;}

#rodapeWrapper    	{ min-width: 980px; width: 100%; }
#rodape        		{ min-width: 980px; width: 97%; margin: 0 auto; position: relative; text-align: left; text-align: center}
#rodape        		{ font-size: 12px; padding: 35px 0px; }

#menuContexto							{ position: relative; padding-left: 70px; padding-bottom: 5px}
#menuContexto h1						{ float: left; padding: 6px 0 5px 14px; font-size: 14px; font-weight: 400; color: #f8f8f8}
#menuContexto a 						{ color: #f8f8f8}
#menuContexto .botoesContexto 			{ float: right; padding: 0 2px 5px 0}
#menuContexto .botoesContexto table		{ border-collapse: collapse; border-spacing: 0;} /* botoes com panelGrid */
#menuContexto .botoesContexto table	td	{ padding: 0 2px;} /* botoes com panelGrid */
#menuContexto button,
#menuContexto input,
#menuContexto select 					{ margin-bottom: 0; margin-top: 0}

#logo 	    							{ color: #fff; font-size: 20px; font-style: italic; font-weight: bold; padding: 10px 10px 0 0 }
#logo a             					{ color: #fff; text-decoration: none }
			
#menuAdministracao.wmenu table a 		{ padding: 0 10px } /* para casar com topo1R0 - link dashboard */
#menuAdministracaoItens            		{ display: none;  }
#menuPrincipalItens	             		{ display: none;  }

#menuPrincipal .fa-caret-down 			  { margin-left: 6px}
#menuPrincipal .submenuWrapper > a > span { font-weight: 700}

#menuAdministracao .submenu ,
#menuPrincipal .submenu 			 	  { padding: 12px 0 12px 0; } /* TODO mover para websupport */

/* para uso em panelGrid */
table td.valor	{ font-weight: bold !important; color: #000; border-color: #fff}
table td.campo 	{ padding-right: 4px; width: 140px; text-align: right; border-color: #fff }
table td.botao 	{ padding-right: 4px; width: 30px; text-align: left; border-color: #fff }
table td.simples{ color: #000; border-color: #fff}
.c4 	   		{ width: 25%; vertical-align: top }

.ui-linha-form .valorOutput { padding: 8px 2px !important; font-weight: bold !important; color: #000; border-color: #fff}

.ui-button.priority-btn { background: #008000; color: #fff; border-color: #008000; }
.ui-button.priority-btn.ui-state-hover { background: #009900; color: #fff; border-color: #008000; }

.ui-button.priority-high-btn { background: #8f0000; color: #fff; border-color: #8f0000; }
.ui-button.priority-high-btn.ui-state-hover { background: #a00000; color: #fff; border-color: #8f0000; }

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { background: #AF97D3; color: #fff; }
.ui-datepicker .ui-datepicker-buttonpane button { background: #AF97D3; color: #fff; }

.ui-tabs .ui-tabs-nav.ui-widget-header li a { color: #695A7E; }

.ui-panelmenu .ui-panelmenu-header a { color: #000; text-decoration: none; }

/* ajuste de css utils */
.valor  		{ padding-top: 4px; }
.campo 			{ padding-top: 4px; }

/* fundo leve em toolbar e rowexpansion */
body .ui-toolbar,
body .ui-datatable .ui-datatable-data > tr.ui-expanded-row-content  { background-color: #eae7f3; }
body .ui-datatable.datatable-rowExpansion th { background-color: #d3d3d3; border-color: #C0C0C0; color: #000000; }