body{ 
	font-family:"Open Sans", Arial;
}
img { border:none}
.clear{ clear:both}

#head > div > img {
	max-width: 918px;
    width: expression(this.width > 918 ? "918px" : "auto"); /* Fix IE 6 */
	
}

/*CONFIG MIOLO*/
#content{
	padding-bottom:50px;
}
#content h1{
	font-family:"Open Sans", arial,'lucida grande',tahoma,verdana,sans-serif;
	font-size:20px;
	font-weight:lighter;
	margin-bottom:10px;
}
#content h2, .FormHeader{
	font-family:"Open Sans", arial,'lucida grande',tahoma,verdana,sans-serif;
	font-size:16px;
	margin-bottom:4px;
	margin-top:30px;
	font-weight:bold;
}
#content a {
	text-decoration:underline;
}
#content h3{
	font-family:"Open Sans", arial,'lucida grande',tahoma,verdana,sans-serif;
	font-size:14px;
	margin-bottom:4px;
	margin-top:20px;
}
#content p{
	font-size:12px;
	margin:0;
	margin-bottom:8px;
	line-height:20px;
	/*text-align:justify;*/
	font-family:"Open Sans", Arial;
}
#content ul, 
#content ol{
	font-size:12px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	list-style-position:inside;
	font-family:"Open Sans", Arial;
}
#content ul > li,
#content ol > li{
	margin-bottom:4px;	
}
/*CONFIG SIDE-BAR*/
#side-bar small{
	font-size:11px;	
}
#side-bar #inscreva > p {
	font-size:17px;	
	text-align:center;
	border:5px solid;
	font-weight:bold;
	font-family:"Open Sans", arial;
}
#side-bar #inscreva > p a{
	text-decoration:none
}
#side-bar #inscreva > p a:hover{
	text-decoration: underline
}
#side-bar #inscreva > p + p {
	font-size:12px;
	padding:6px 0 0 0 ;
	border:none;
	background:0;
	text-transform:none;
	font-weight:lighter;
	text-align:left;
	text-align:center
}
/*CONFIG PARCEIROS*/
#parceiros span{
	font-size:10px;	
}
#rodape {
	font-size:14px;
	font-family:"Open Sans", Arial;
}
#rodape p{
	text-align:center
}
#rodape ul li > a{
	text-decoration:none;	
}
#rodape ul li > a:hover{
	text-decoration:underline;
}
/*CONFIG NAV MENU*/
#nav a{
	text-decoration:none;
}
#nav a.active,
#nav a:hover,
#nav a.active:hover{
	text-decoration:none;
}
#nav ul.notDisplay *{
	display:none;
}

/************************************
CONSTRUÇÃO COMUM A TODOS OS LAYOUTS:
*************************************/
body, html{
	padding:0;
	margin:0;
	height:100%;
}

h1,h2,h3,h4,h5,h6{
	margin:0;
	padding:0;
}
#wapper{
	min-height:100%;
}

#main {
	width:960px;
	margin:auto;
	margin-top:15px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#main-head > div{
	width:960px;
	margin:auto;
	margin-top:10px;
}
#main-content > div{
	width:960px;
	margin:auto;
	margin-top:15px;
	-moz-border-radius: 4px;
	border-radius: 4px;	
}
#main-rodape > div{
	width:960px;
	margin:auto;
	margin-top:15px;
	-moz-border-radius: 4px;
	border-radius: 4px;	
}
#head{
	padding:20px 20px 20px 20px;
	margin-bottom:25px;
}
#title{
	padding:0px 30px 0 20px;
}
#title h1{
	float:left;
}
#title h2{
	font-family: "Open Sans", arial,'lucida grande',tahoma,verdana,sans-serif;
	float:left;
	margin-left:13px;
	margin-top:10px;
	font-size:32px;
	font-weight:lighter;
/*	line-height:24px;*/
}
#title h2 p{
	margin:4px 0 0 0;
	padding:0;
	font-size:18px;
	font-family:"Open Sans", Arial;
}
#title.notDisplay{
	height:4px;	
}
#title.notDisplay *{
	display:none;
}
#head > div{
	min-height:150px;
}
#head h1{
	position:relative;
	left: 55px;
	top:68px;
}
#content{
	float:left;
	margin-right: 15px; 
}
#side-bar{
	float:left;
	width:180px;
	margin-left: 15px;
	
}
	#inscreva{
		margin-bottom:25px;
	}
	#inscreva > p{
		margin:0;
		padding:10px 0 10px 0;
	}
	#inscreva > p + p{
		padding:10px;
	}
	#publicidade > ul{
		list-style:none;
		margin:10px 0 0 0;
		padding:0;
	}
	#publicidade > ul > li{
		margin-top:10px;	
	}
/*RODAPÉ PARCEIROS*/
#parceiros{
	margin:0 0 0 0;
	padding:0;
	padding-top:0;
	clear:both;
	list-style:none;
}
#parceiros > li{
	padding-top:10px;
	padding-bottom:30px;
	text-align:center;
	text-transform:uppercase;
	font-family:"Open Sans", Arial;
}
#parceiros > li + li{
	border-top:1px solid;
}
#parceiros > li > ul{
	list-style:none;
	margin:15px 0 0 0;
	padding:0;
}
#parceiros > li > ul > li{
	display:inline;
	list-style:none;
	padding-right:15px;
	padding-left:15px;
}

/*RODAPÉ DO EVENTO*/
#rodape{
	color:#000;
	border-top:1px solid;
	margin:22px 0 0 0;
	padding-top:5px;
	padding-bottom:60px;
	font-size:14px;
}
#rodape > ul{
	float:right;
	margin:0;
	padding:0;
}
#rodape strong{
	font-size:18px;
	font-weight:lighter;
}
#rodape p > a{
	font-size:12px;
	margin-left:12px;
}
#rodape > ul > li{
	display:inline;
	margin-left:12px;
}
#rodape > p{
	margin:0;
	padding:0;
}


#botoes_compartilhamento {
	padding:0;
	margin:0 0 20px 0;
}
#botoes_compartilhamento  li {
	display:inline;
}
/* Steps */
.StepList ol{
	height:51px;
	list-style:none;
	margin:0;
	padding:0;
	font-family:"Open Sans", arial,'lucida grande',tahoma,verdana,sans-serif;
	display: block;
}
.Step{
	display:inline;
	list-style-type:none
}
.Step .part{
	float:left;
	height:51px
}
.Step .back{
	background-repeat:no-repeat;
	background-size:auto;
	background-position:0 -156px
}
.Step .middle{
	max-width:100px;
	min-width:100px;
}
.Step .point{
	background-repeat:no-repeat;
	background-size:auto;
	background-position:-1px 0;
	width:21px
}
.Step .title{
	margin-bottom:1px;
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 0.75px;
}
.Step .description{
	line-height:11px;
	font-size:10px;	
	font-family:verdana;
	letter-spacing: -0.75px;
}
.Step .content{
	margin:5px 5px 0 5px;
	text-shadow: 1px 1px #ddd;
}
.StepSelected .content{
	margin-left:5px;
	text-shadow: 1px 1px #666;
}
.StepListSmallDescription .description{
	font-size:9px
}
.StepFirst .back{
	width:3px
}
.StepFirst .content{
	margin-left:15px
}
.StepSelected .back{
	background-repeat:no-repeat;
	background-size:auto;
	background-position:-5px -156px
}
.StepSelected .point{
	background-repeat:no-repeat;
	background-size:auto;
	background-position:-1px -104px
}
.StepNextSelected .point{
	background-repeat:no-repeat;
	background-size:auto;
	background-position:-1px -52px
}
.StepSelected a:hover{
	text-decoration:none
}
.StepUndone .content, .StepUndone .title, .StepUndone .description, .StepUndone a{
	text-shadow: none;
}

/* ==========================
   LAYOUT / ÁREAS PRINCIPAIS
   ========================== */

body
{
	background-color: var(--color-body-bg);
}

#head
{
	background: var(--color-surface);
}

#main-content
{
	background-color: var(--color-main-content-bg);
}

#main-rodape
{
	background-color: var(--color-footer-bg);
}

/* ==========================
   TÍTULOS / CONTEÚDO
   ========================== */

#title h2
{
	color: var(--color-primary);
}

#title h2 p
{
	color: var(--color-secondary);
}

#content h1
{
	color: var(--color-primary);
}

#content h2,
.FormHeader
{
	color: var(--color-secondary);
}

#content a
{
	color: var(--color-link-default);
}

#content h3
{
	color: var(--color-text-base);
}

/* ==========================
   SIDE BAR / INSCRIÇÃO
   ========================== */

#side-bar small
{
	color: var(--color-text-muted);
}

#side-bar #inscreva > p,
.FormButtonConfirm,
.btn-primary
{
	color: var(--color-side-highlight-text);
	border-color: var(--color-side-highlight-border);
	background: var(--color-side-highlight-bg);
}

#side-bar #inscreva > p a
{
	color: var(--color-side-highlight-text);
}

#side-bar #inscreva > p + p
{
	color: var(--color-text-strong);
}

/* ==========================
   PARCEIROS
   ========================== */

#parceiros span
{
	color: var(--color-text-secondary);
}

#parceiros > li + li
{
	border-color: var(--color-border-partner);
}

/* ==========================
   RODAPÉ
   ========================== */

#rodape
{
	color: var(--color-text-footer);
	border-color: var(--color-text-footer);
}

#rodape a
{
	color: var(--color-text-footer);
}

#rodape > ul > li
{
	color: var(--color-text-footer);
}

/* ==========================
   MENU LATERAL
   ========================== */

#side-menu
{
	border-color: var(--color-border-menu);
}

#side-menu a
{
	color: var(--color-menu-link);
}

#side-menu a.active,
#side-menu a:hover,
#nav a.active:hover
{
	color: var(--color-menu-link-active);
}

/* ==========================
   NAV / MENU SUPERIOR
   ========================== */

#nav ul.notDisplay *
{
	display: none;
}

#nav > div
{
	background: var(--color-nav-bg);
}

#nav a
{
	color: var(--color-nav-link);
}

#nav a.active,
#nav a:hover,
#nav a.active:hover
{
	color: var(--color-nav-link-active);
}

/* ==========================
   STEPS (mantidos com imagens)
   ========================== */

.StepList ol
{
	background: url(../img/steps/01_bkg.png);
}

.Step .back
{
	background-image: url(../img/steps/01_core.png);
}

.Step .middle
{
	background: url(../img/steps/01_bkg.png);
}

.Step .point
{
	background-image: url(../img/steps/01_core.png);
}

.StepSelected .back
{
	background-image: url(../img/steps/01_core.png);
}

.StepSelected .middle
{
	background: url(../img/steps/01_bkg_selected.png);
}

.StepSelected .point
{
	background-image: url(../img/steps/01_core.png);
}

.StepNextSelected .point
{
	background-image: url(../img/steps/01_core.png);
}

.StepSelected .title,
.StepSelected .description,
.StepSelected a
{
	color: #ffffff;
}

.StepUndone .content,
.StepUndone .title,
.StepUndone .description,
.StepUndone a
{
	color: #999999;
}

/* ==========================
   BOTÕES (AUTO)
   ========================== */

input[type='submit'],
input[type='button'],
button
{
	color: var(--btn-text);
	background-color: var(--btn-bg);
	background-image: linear-gradient(to bottom, var(--btn-gradient-light), var(--btn-bg));
	background-repeat: repeat-x;

	border-color: var(--btn-border);
	border-bottom-color: var(--btn-border-bottom);

	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.2),
		0 1px 2px rgba(0, 0, 0, 0.05);

	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.25);
}

input[type='submit']:hover,
input[type='button']:hover,
button:hover
{
	background-color: var(--btn-bg-hover);
	background-image: linear-gradient(to bottom, var(--btn-bg-hover), var(--btn-bg-hover));
}
