<html>
<head>
<title>UNIDADE 2</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="css/secao2.css" rel="stylesheet" type="text/css" />
<link href="css/message.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(window).load(function () {
  // run code
  	var id = ('#secao2_apresentacao');
	
	var maskHeight = $(document).height();
	var maskWidth = $(window).width();
	
	$('#mask').css({'width':maskWidth,'height':maskHeight});

	$('#mask').fadeIn(1000);	
	$('#mask').fadeTo("slow",0.8);	
	
	//Get the window height and width
	var winH = $(window).height();
	var winW = $(window).width();
              
	$(id).css('top',  20);
	$(id).css('left', winW/2-$(id).width()/2);
	
	$(id).fadeIn(2000); 
	
	$('.window .close').click(function (e) {
		e.preventDefault();
		$('#mask').fadeOut(1000);	
		$('.window').hide();
	});		
	
	$('#mask').click(function () {
	});	
});
$(document).ready(function() {	

	$('a[name=modal]').click(function(e) {
		e.preventDefault();
		
		var id = $(this).attr('href');
	
		var maskHeight = $(document).height();
		var maskWidth = $(window).width();
	
		$('#mask').css({'width':maskWidth,'height':maskHeight});

		$('#mask').fadeIn(1000);	
		$('#mask').fadeTo("slow",0.8);	
	
		//Get the window height and width
		var winH = $(window).height();
		var winW = $(window).width();
              
		$(id).css('top',  20);
		$(id).css('left', winW/2-$(id).width()/2);
	
		$(id).fadeIn(2000); 
	
	});
	
	$('.window .close').click(function (e) {
		e.preventDefault();
		$('#mask').fadeOut(1000);	
		$('.window').hide();
	});		
	
});
</script>

</head>
<body>
<div id="secao2">
	<div id="secao2-01">
		<img src="images/secao2_01.jpg" width="800" height="437" alt="">
	</div>
	<div id="barra_navegacao">
        <div id="secao2-02"></div>
        <div id="secao2-03"><a href="arquivos/PROCESSO_DE_TRABALHO_EM_SAUDE.pdf" target="_blank"><img src="images/secao2_03.jpg" width="102" height="73" alt=""></a></div>
        <div id="secao2-04"></div>
        <div id="secao2-05"><a href="arquivos/CONCEITO_CONDICOES_SAUDE.pdf" target="_blank"><img src="images/secao2_04.jpg" width="102" height="73" alt=""></a></div>
        <div id="secao2-06"></div>
        <div id="secao2-07"><a href="arquivos/GESTAO_PROCESSO_TRABALHO.pdf" target="_blank"><img src="images/secao2_05.jpg" width="102" height="73" alt=""></a></div>
        <div id="secao2-08"></div>
        <div id="secao2-09"><a href="#auto_instrucional" name="modal"><img src="images/secao2_07.jpg" width="101" height="73" alt=""></a></div>
  </div>
</div>

<div id="boxes">

<!-- Janela Modal -->
<div id="secao2_apresentacao" class="secao2_apresentacao window">
    <div id="mensagem" class="mensagem">
        <div id="mensagem_texto" class="mensagem_texto">
            <p>Imerso na cultura de modelo &agrave; sa&uacute;de institu&iacute;do, com foco na doen&ccedil;a, &eacute; comum que um profissional de sa&uacute;de veja a situa&ccedil;&atilde;o vivenciada por uma pessoa da comunidade de uma perspectiva bem diferente da dela. Veja como esta situa&ccedil;&atilde;o est&aacute; representada na charge (imagem) apresentada a seguir.</p>
            <p> Quando atua na aten&ccedil;&atilde;o b&aacute;sica, onde promover sa&uacute;de tem como finalidade a melhoria da qualidade de vida das pessoas, &eacute; essencial que o profissionalse coloque no lugar do outro e o ajude a ser protagonista; socialize saberes que forne&ccedil;am subs&iacute;dios para a tomada de decis&atilde;o.</p>
        </div>
        <div id="mensagem_btn">
        	<div id="btn_ok"><a href="#" class="close"><img src="img/fechar.png"></a></div>
        </div>
    </div>
</div>
<!-- Fim Janela Modal -->

<!-- Janela Modal -->
<div id="auto_instrucional" class="auto_instrucional window">
    <div id="mensagem" class="mensagem">
        <div id="mensagem_texto" class="mensagem_texto">
			<p><strong>Atividade auto instrucional</strong></p>
<p>Nessas atividades voc&ecirc; vai ser desafiado a entrar num jogo conceitual. Para realizar as atividades voc&ecirc; deve relacionar as colunas</p>
<p>Clique nos links abaixo e boa sorte!</p>
        <p align="center"><a href="hotpotatoes/atividade_hotpotatoes1.html" target="_blank">Atividade autoinstrucional 1</a></p>
        <p align="center"><a href="hotpotatoes/atividade_hotpotatoes2.html" target="_blank">Atividade autoinstrucional 2</a></p>

        </div>
        <div id="mensagem_btn">
        	<div id="btn_ok"><a href="#" class="close"><img src="img/fechar.png"></a></div>
        </div>
    </div>
</div>
<!-- Fim Janela Modal -->

<!-- Janela Modal -->
<div id="atividade4" class="atividade4 window">
    <div id="mensagem" class="mensagem">
        <div id="mensagem_texto" class="mensagem_texto">
			<p><strong>Atividade 4 - Envio de arquivo</strong></p>
            <p>Para realizar essa atividade voc&ecirc; deve  voltar ao menu de navega&ccedil;&atilde;o principal do m&oacute;dulo processo de trabalho e acessar  o link Atividade 04.</p>
        </div>
        <div id="mensagem_btn">
        	<div id="btn_ok"><a href="#" class="close"><img src="img/fechar.png"></a></div>
        </div>
    </div>
</div>
<!-- Fim Janela Modal -->



<!-- Janela Modal -->
<div id="atividade5" class="atividade5 window">
    <div id="mensagem" class="mensagem">
        <div id="mensagem_texto" class="mensagem_texto">
			<p><strong>Atividade 5 - F&oacute;rum </strong></p>
            <p>Para realizar essa atividade voc&ecirc; deve  voltar ao menu de navega&ccedil;&atilde;o principal do m&oacute;dulo processo de trabalho e acessar  o link Atividade 05 &ndash; F&oacute;rum.</p>
        </div>
        <div id="mensagem_btn">
        	<div id="btn_ok"><a href="#" class="close"><img src="img/fechar.png"></a></div>
        </div>
    </div>
</div>
<!-- Fim Janela Modal -->



<!-- Mscara para cobrir a tela -->
  <div id="mask"></div>

</div>



</body>
</html>