@charset "utf-8";
/* CSS BIBLIOTECA */
/* -webkit-para browsers webkit */
/*    -moz- para browsers gecko */
/*               -o- para opera */

/* ==========================================================================
Bloco de comentário de Seção
========================================================================== */

/* Bloco de comentário de Sub-seção
========================================================================== */

/*
* Bloco de comentário de Grupo
* Explicações em múltiplas linhas e Documentação.
*/

/* Comentário Básico */




/* Importar Arquivos Básicos
================================================== */
@import url("resetar.css");        /* Reseta a Estrutura HTML */




/* ==========================================================================
Definições Básicas da Estrutura
========================================================================== */
/* Resetar Elementos da Estrutura */
@-webkit-keyframes bugfix { from { padding:0; } to { padding:0; } }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, textarea, select, radio, checkbox, fieldset, form, input, button, reset, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	outline: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block; 
}

ol, ul { list-style: none; }

blockquote, q {	quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none; 
}

table {
	width: 100%;
	height: auto;
	border-collapse: collapse;
	border-spacing: 0; 
}

* {
	margin: 0;
	padding: 0;
	outline: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


/* Estrutura Geral */
html, body { height: 100%; }

html {
	background: #c3262b url(../imagens/texturas/fundo-01.jpg) bottom center no-repeat fixed;
	overflow-x: hidden; /* barra de rolagem horizontal */
	overflow-y: auto; /* barra de rolagem vertical */
	-webkit-text-size-adjust: none;
}

body {
	font-family: 'raleway-light', Arial, sans-serif;
	font-size: 1.1em;
	color: #9b9b9b;
	line-height: 150%;
	-webkit-animation: bugfix infinite 1s;
	-webkit-font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
}

/* Cabeçalho */
header {
	background: #b30707;
	width: 100%;
	height: auto;
	top: 0;
	left: 0;
	position: fixed;
	-webkit-box-shadow: rgba(0,0,0,0.1) 0 0 20px;
	   -moz-box-shadow: rgba(0,0,0,0.1) 0 0 20px;
	        box-shadow: rgba(0,0,0,0.1) 0 0 20px;
	z-index: 9999;
}

/* Artigo/Seção */
article,
section {
	width: 100%;
	height: auto;
}

/* Rodapé */
footer {
	position: relative;
	width: 100%;
	height: auto;
	vertical-align: middle;
	z-index: 999;
}




/* ==========================================================================
Links
========================================================================== */
a, a:link {
	color: #00b4b3;
	text-shadow: rgba(0,0,0,0.1) 1px 1px 2px;
	text-decoration: none;
	outline: none;
	cursor: pointer;
}

a:hover, a:focus {
	color: #3c1f22;
	text-decoration: none;
	outline: none;
	cursor: pointer;
}

a:hover img { opacity: 0.5; }

a, a > * {
	-webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	   -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	    -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	     -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	        transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}




/* ==========================================================================
Tipografia
========================================================================== */
/* Títulos */
h1 { font-size: 2.7em; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.2em; }
h5 { font-size: 1.0em; }
h6 { font-size: 0.7em; }

h1, h2, h3, h4, h5, h6 {
	color: #3c1f22;
	text-shadow: rgba(0,0,0,0.2) 1px 1px 3px;
	line-height: 115%;
	clear: both;
	font-weight: normal;
	padding: 10px 2px 10px 2px;
}

h1 span, h2 span, h3 span, 
h4 span, h5 span, h6 span { color: #3c1f22; }

/* Parágrafos */
p {
	margin: 0 auto;
	padding: 5px 5px 5px 5px;
	display: block;
}
p span { color: #00b4b3; }
p img { margin: 0; }
p a, p a:visited { line-height: inherit; }

em, i {
	font-style: italic;
	line-height: inherit;
}

strong, b {
	font-weight: bold;
	line-height: inherit;
}

small {
	font-size: 0.8em;
	line-height: inherit;
}

code { font-weight: bold; }

/* Destaca o Parágrago */
blockquote { 
	font-family: 'Times New Roman', Times, serif;
	font-style: italic;
	text-align: center;
}

/* Separador */
hr { 
	border: dashed #ccc; 
	border-width: 1px 0 0; 
	clear: both; 
	margin: 15px 0 15px 0;
	padding: 5px 5px 5px 5px;
	height: 0;
}

/* Lista */
ul, ol {
	line-height: 1.6;
	margin-bottom: 17px;
	list-style-position: outside;
}

ul li ul {
	margin-left: 20px;
	margin-bottom: 0;
	list-style: outside;
}




/* ==========================================================================
Imagem / Figura / Objeto / Video
========================================================================== */
img, figure {
	margin: 0;
	padding: 0;
	border: none;
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}

img,
figure,
embed,
object,
video {
	max-width: 100%;
	height: auto;
}

.img { overflow: hidden; } 
.img img { display: block; }




/* ==========================================================================
iFrame
========================================================================== */
iframe {
	overflow: hidden;
	border: none; 
	width: 100%;
	height: auto;
	left: 0;
}




/* ==========================================================================
Campos e Formulário Padrão
========================================================================== */
form { width: 100%; margin: 0; }

.linha form .linha { margin: 0 -6px; }
.linha form .linha .coluna, 
.linha form .linha .colunas { padding: 0 6px; }
.linha form .linha.collapse { margin: 0; }
.linha form .linha.collapse .coluna, 
.linha form .linha.collapse .colunas { padding: 0; }

/* Estatus Envio */
#estatus-envio { margin: 0;}

/* Labels / Legendas */
label {
	font-family: 'raleway-medium', Arial, sans-serif;
	margin-bottom: 3px;
	display: block;
}

label span { font-size: 1.2em; }
label.direita {	float: none; text-align: right; }
label.em-linha { line-height: 32px;	margin: 0 0 12px 0; }

.label.alert { background-color: #c60f13; }
.label.success { background-color: #5da423; }
.label.secondary { background-color: #e9e9e9; color: #505050; }

/* Conjunto dos Campos */
fieldset {
	border: 1px dashed #ddd;
	padding: 15px 5px 15px 5px;
	margin: 5px;
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
	     	border-radius: 5px;
}

fieldset legend {
	font-weight: bold;
	padding: 0 3px;
	margin: 0 0 0 -3px;
}

fieldset ul li { text-align: left; }

::-webkit-input-placeholder { }
	 :-ms-input-placeholder { }
		  :-moz-placeholder { }

input#nome, input#assunto { text-transform: capitalize; }
input#email, input#facebook { text-transform: lowercase; }

/* Input, textarea, select */
input,
textarea,
select {
	color: #999;	
	padding: 8px 7px 8px 7px;
	margin: 5px 0 5px 0;
	width: 100%;
	height: auto;
	min-height: 42px;
	border: solid 1px #dcdcdc;
	background: #fff;
	-webkit-border-radius: 5px;
	   -moz-border-radius: 5px;
	        border-radius: 5px;
	-webkit-box-shadow: rgba(0,0,0,0.1) 0px 1px 5px;
	   -moz-box-shadow: rgba(0,0,0,0.1) 0px 1px 5px;
			box-shadow: rgba(0,0,0,0.1) 0px 1px 5px;
}

textarea { height: 110px; }

/* Inputs, textarea, select - Hover / Focus */
input:hover,
textarea:hover,
select:hover,
input:focus,
textarea:focus,
select:focus { 
	background: #fff;
	color: #3c1f22;
	border: solid 1px #3cb496;
	-webkit-box-shadow: rgba(60,180,150,0.8) 0 0 5px;
	   -moz-box-shadow: rgba(60,180,150,0.8) 0 0 5px;
			box-shadow: rgba(60,180,150,0.8) 0 0 5px;		
}

/* Radio, checkbox */
input[type=checkbox],
input[type=radio] {
	width: 14px;
	height: 14px;
	min-height: inherit;
	margin-right: 2px;
	padding: 0;
	background: none;
	border: none;
	display: inline-block;
}

/* Submit, Reset, Button */
input[type=button].button, 
button.button { -webkit-appearance: none; }

input[type=submit].button, 
button.button { -webkit-appearance: none; }

input[type=reset].reset, 
button.reset { -webkit-appearance: none; }

p input[type=button].button,
p input[type=submit].button,
p input[type=reset].reset { float: right; margin-left: 10px; }

.submit, 
.reset, 
.button {
	font-family: 'raleway-medium', Arial, sans-serif;
	font-size: 1.1em;
	color: #fff;
	text-align: center;
	text-shadow: rgba(0,0,0,0.2) 1px 1px 1px ;
	text-decoration: none;
	padding: 10px 25px 10px 25px;
	border-width: 0;
	cursor: pointer;
	height: auto;
	width: auto;
	background: #00b4b3;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
	-webkit-box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
	   -moz-box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
	        box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
}

/* Submit, Reset, Button - Hover / Focus */
.submit:hover, 
.reset:hover, 
.button:hover,
.submit:focus, 
.reset:focus, 
.button:focus {
	color: #fff;
	text-shadow: rgba(0,0,0,0.1) -1px -1px 0;
	border-width: 0;
	background: #3c1f22;
	-webkit-box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
	   -moz-box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
	        box-shadow: rgba(0,0,0,0.2) 0 2px 4px;
}

input, textarea, select, .submit, .reset, .button {
	-webkit-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out;
	   -moz-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out;
	    -ms-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out;
	     -o-transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out;
	        transition: background-color .3s ease, border .3s ease, color .3s ease, opacity .3s ease-in-out;
}




/* ==========================================================================
Estrutura do Layout
========================================================================== */
#corpo {
	width: 100%;
	height: 100%;
	min-height: 100%;
	margin: 0;
	padding: 0;
}

.margem { padding: 100px 0 50px 0; }
.espacamento { padding: 50px 0 0 0; }
.separa { height: 100px; }
.juntar { margin-top: -40px; }

.icn-titulo {
	position: relative;
	display: inline;
	border: none;
	bottom: 0;
}

.mais-info { margin: 30px 0 30px 0; }



/* Cabeçalho do Layout
========================================================================== */
.topo:before, .topo:after { display: table; content: ""; }
.topo:after { clear: both; }

.topo {
	height: auto;
	min-height: 50px;
	padding: 0 20px;
	position: relative;
	margin-bottom: 0;
}

.logo-unifil-p {
	float: left;
	left: 8px;
	top: 10px;
	width: 143px;
	height: auto;
	display: inline; 
	position: absolute;	
	display: none;
	z-index: 9999;
}




/* Navegador do Layout
========================================================================== */
/* Menu Principal */
.nav {
	width: 100%;
	font-size: 1.1em;
	font-style: normal;
	text-align: center;
	display: block; 
	margin-top: 15px;
}

.nav, .menu, .menu > li, .menu > li > a { height: 100%; }
.menu > li { list-style: none; display: inline-block; }
.menu > li.barra { border-right: 1px #fff solid; }


nav.nav ul li { 
	display: inline-block;
	*display: inline; /* para ie7 */
}
nav.nav ul li a {
	color: #fff; 
	text-shadow: rgba(0,0,0,0.2) 1px 1px 2px;
	text-decoration: none;
	line-height: 120%;	
	padding: 5px 20px 5px 15px;
	list-style-type: none;
	display: inline-block;
	cursor: pointer;
	border: 0;
	-webkit-transition: color 0.5s ease-in-out;
	   -moz-transition: color 0.5s ease-in-out;
	        transition: color 0.2s ease-in-out;
	
}
nav.nav ul li a:hover {  }
nav.nav ul li.active a { color: #5efdff; }


#nav .esconder { display: none; }
#alternar, .alternar { display: none; }
.alternar { z-index: 2; }




/* Seções do Layout
========================================================================== */
#principal,
#informacoes,
#inscricoes,
#organizacao,
#contato,
#webapp {
	background: #fff;
	width: 100%;
	height: auto;
	min-height: 100%;
	position: relative;
	display: block;
	top: 0;
	margin:0;
	padding: 0;
}




/* Seção Principal
========================================================================== */
#principal {
	background: url(../imagens/texturas/textura-01.png), #c3262b url(../imagens/texturas/fundo-01.jpg);
	background-size: auto, cover;
	background-color: transparent;
    background-repeat: repeat, no-repeat;
	background-position: bottom center;
    background-attachment: fixed;
    -webkit-background-size: auto, cover;
       -moz-background-size: auto, cover;
         -o-background-size: auto, cover;
	color: #fff;
}

#principal h1,
#principal h2 { color: #fff; text-align: center; }
#principal h3 { color: #fff; }

#principal p { 
	text-align: center;
	padding: 20px;
	line-height: 110%;
}

#principal .button,
#principal .button:hover { color: #fff; }

#principal .button.action { 
	color: #fff; 
	background: #3c1f22;
	font-size: 1.2em;
	padding: 20px 25px 20px 25px;
}
#principal .button.action:hover { color: #fff; background: #b30707; }

#principal .mais-info { margin: 25px 0 40px 0; }

#principal .tl-01 { 
	margin-top: 0;
	text-align: center;
}
#principal .tl-02 { 
	margin-top: 2%;
	text-align: center;
}
#principal .tl-01-m { display: none; }

#principal .youtube {
	border: 4px solid #5f9fbb;
}




/* Seção Informações
========================================================================== */
#informacoes { 
	background: #00b4b3 url(../imagens/texturas/textura-01.png) top left repeat;
	color: #fff;
}

#informacoes h1,
#informacoes h2,
#informacoes h3 { text-align: center; }

#informacoes h1 span,
#informacoes h2 span,
#informacoes h3 span { color: #fff; }

#informacoes p { 
	text-align: justify;
	padding-bottom: 20px;
}

#informacoes p span { color: #00b4b3; }

#informacoes .button { background: #c72829; color: #fff; }
#informacoes .button:hover { background: #fff; color: #c72829; }




/* Seção Inscrições
========================================================================== */
#inscricoes {
	background: #c72829 url(../imagens/texturas/textura-01.png) top left repeat;
	color: #fff;
}

#inscricoes h1,
#inscricoes h2,
#inscricoes h3 { color: #5efdff; text-align: center; }

#inscricoes h1 span,
#inscricoes h2 span,
#inscricoes h3 span { color: #fff; }

#inscricoes p { 
	text-align: justify;
	padding-bottom: 20px;
}

#inscricoes p span { color: #5efdff; font-size: 1.3em; }

#inscricoes ul li { text-align: center; }
#inscricoes ul li span { 
	color: #5efdff; 
	font-size: 1.4em;
}

#inscricoes .button,
#inscricoes .button:hover { color: #fff; }




/* Seção Organização
========================================================================== */
#organizacao { background: #fff; }

#organizacao h1,
#organizacao h2,
#organizacao h3 { text-align: center; }
#organizacao h2 { color: #d52a29; }

#organizacao p { 
	text-align: justify;
	padding-bottom: 20px;
}

#organizacao p span { font-size: 1.4em; }

#organizacao ul li { 
	text-align: center;
	padding: 0 0 15px 0;
}
#organizacao ul li span { 
	color: #d52a29; 
	display: block;
}




/* Seção Fale Conosco
========================================================================== */
#contato { 
	background: #00b4b3 url(../imagens/texturas/textura-01.png) top left repeat;
	color: #fff;
}

#contato h1,
#contato h2,
#contato h3 { text-align: center; }

#contato p { padding-bottom: 20px; }

#contato ul li span { 
	font-family: 'raleway-medium', Arial, sans-serif;
}

#contato label { font-weight: normal; }

#contato .button,
#contato .button:hover { color: #fff; }

#contato .telefone { 
	font-size: 1.6em; 
	padding-bottom: 10px;
}




/* Rodapé do Layout
========================================================================== */
footer {
	background: #d65e1d url(../imagens/texturas/textura-01.png) top left repeat;
	border-top: #d8bd27 4px solid;
	color: #fff;
	text-align: center;
	padding: 20px 0 20px 0;
 }

footer .telefone,
footer a:link { color: #d8bd27; }

footer .logo-unifil {
	width: 230px;
	height: auto;
}

footer .direitos { 
	font-family: Georgia, Times New Roman, serif; 
	font-size: 0.75em;
	font-style: italic;
	line-height: 130%;
}
footer .dcd { color: #d8bd27; }

#voltar-ao-topo {
	border: 0;
	position: fixed; 
	bottom: 0; 
	right: 20px; 
	display: none;
	z-index: 9997; 
}

#voltar-ao-topo a img {
	width: 60px;
	height: 60px;
	border: none;
	opacity: 0.8;
}

#voltar-ao-topo a:hover img {
	border: none;
	opacity: 1;
}

#voltar-ao-topo a img,
#voltar-ao-topo a:hover img {
	-webkit-transition: opacity .3s ease-in-out;
	   -moz-transition: opacity .3s ease-in-out;
		-ms-transition: opacity .3s ease-in-out;
		 -o-transition: opacity .3s ease-in-out;
			transition: opacity .3s ease-in-out;
}




/* ==========================================================================
Acordião
========================================================================== */
.acordiao { 
	margin-top: 10px;
	position: relative; 
	border-bottom: 1px dashed #e0e0e0;
}

.acordiao .btn-exterior {
	background: url(../imagens/icn-mais.png) no-repeat 0 7px; 
	border-top: 1px dashed #e0e0e0; 
	cursor: pointer;
	padding-left: 35px;
}
.acordiao .btn-exterior.atual { background: url(../imagens/icn-menos.png) no-repeat 0 7px; }
.acordiao .btn-exterior .btn-interior {
	height: auto; 
	line-height: 110%;
	padding: 5px 0 5px 0; 
	overflow: hidden;
}

.acordiao .conteudo-abrir {
	padding: 0 0 15px 0;
}




/* ==========================================================================
Video Vimeo / Youtube
========================================================================== */
.js-video {
	height: 0;
	padding-top: 25px;
	padding-bottom: 67.5%;
	margin-bottom: 10px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.js-video.youtube {
	padding-top: 0;
}

.js-video.widescreen {
	padding-bottom: 57.25%;
}

.js-video embed, .js-video iframe, .js-video object, .js-video video {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
}

.youtube {
	margin-top: 0;
	position: relative;
	display: block;
	left: 0;
}




/* ==========================================================================
Mapa do Google
========================================================================== */
#localizacao { margin-top: -20px; bottom: 0; }
.gmapa {
	max-width: 100%;
	width: 100%; 
	height: 520px;
	margin-top: 0;
	border: none;
	border-top: #CCC 1px solid;
	bottom: 0;
	position: relative;
}




/* ==========================================================================
Twitter
========================================================================== */
#tweet {
	width: 100%;
	text-align: center;
}

#tweet .twitterBird {
	width: 60px;
	height: auto;
	margin-right: 5px;
}

#tweet ul li {
	width: 100%;
	height: auto;
	line-height: 130%;
	position: relative;
	left: 0;
	margin: 0;
	margin-top: -15px;
	margin-bottom: 15px;
	padding: 0 10px 10px 10px;
}

#tweet a { padding: 0 0 2px 0; }




/* ==========================================================================
Midia Social Ícones
========================================================================== */
ul.social-menu {
	width: 100%;
	text-align: center;
	display: block;
	position: relative;
	list-style: none;
	margin: 0 0 0;
}

ul.social-menu li {
	display: inline-block;
	width: 30px;
	height: 29px;
	overflow: hidden;
}

ul.social-menu li:first-child { margin-left: 0; }
ul.social-menu li img {
	vertical-align: baseline;
	margin: 0;
	padding: 0;
}
ul.social-menu li:hover img { 
	margin-top: -30px;
	display: block;
}

.fb-tw { 
	width: 100%;
	text-align: center;
	display: block;
	position: relative;
	list-style: none;
	margin: 0;
	margin-top: 10px;
	margin-left: 10px;
	z-index: 2;
}
.fb-like-box {
	width: 100%;
	text-align: center;
}

a .icn-facebook,
a .icn-twitter,
a .icn-youtube,
a .icn-vimeo
a .icn-foursquare {
	width: 25px;
	height: 25px;
	border: none;
}




/* ==========================================================================
Diversos
========================================================================== */
.texto-esquerda { text-align: left; }
.texto-direita { text-align: right; }
.texto-centro { text-align: center; }
.texto-justificado { text-align: justify; }
.texto-pequeno { font-size: 0.75em; line-height: inherit; }
.bloco { display: block; }
.limpar { clear: both; }
.esquerda { float: left; }
.direita { float: right; }
.rodape { bottom: 0; position: absolute; }
.centro-relativo { margin-left: auto; margin-right: auto; }
.centro-absoluto { left: 50%; }
.absoluto {	position: absolute; }
.fixo {	position: fixed; }
.relativo {	position: relative; }
.esconder { display: none; }
.mostrar { display: block; }
.negrito { font-weight: bold; }
.italico { font-style: italic; }

/* Cores */
.destacar { background: #ff9; }
.vermelho { color: #f33420; }
.verde { color: #5d9b81; }
.azul { color: #498cc4; }
.laranja { color: #f60; }
.cinza { color: #999; }
.branco { color:#fff; }	

/* Ícones */
.icn-metas {
	line-height: 120%;
	margin-top: 10px;
	margin-bottom: 30px;
}
ul.icn-metas li { padding: 0 0 5px 0; }

ul.icn-metas li img {
	display: inline-block;
	width: 20px;
	height: 20px;
	overflow: hidden;
	margin-bottom: 4px;
	margin-right: 4px;
}

.icn {
	overflow: hidden;
	padding: 0;
	margin: 0;
}

.icn-mais {
	float: right;
	margin-right: 5px;
}

/* Opacidade - mudando a opacidade, todo o elemento fica transparente */
.opacidade { opacity: 0.4; }

/* Transparência - mudando a transparência da cor*/
.transparencia { background: rgba(0, 0, 0, 0.3); }

/* Gradiente */
.gradiente {
	background-color: #ff7e05;
    background-image: -moz-linear-gradient(top, #ff7e05, #ff480e); /* FF3.6 */
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ff7e05),color-stop(1, #ff480e)); /* Saf4+, Chrome */
}