/**
 * @author mcosta
 */

/* Browser Viewport
----------------------------------------------------------------------------------------------------*/

html {
	background: #3ab24a;
	overflow-x: hidden;
	height: 100% !important;
}

html,
body,
#content {
	height: auto;
}

body { background: url("../../up/images/bg-hp.png") no-repeat scroll center 25px #FFFFFF }

/* Containers
----------------------------------------------------------------------------------------------------*/

#content {
	min-height: auto;
	overflow: hidden;
	/*background: #fff url(../images/content_background.png) repeat-x;*/
}

#wrap-content {
	position: relative;
	height: 700px;
	overflow: hidden;
}

#footer {
	left:0;
	z-index: 1000;
	/*margin-top: -54px;*/
	margin-top: -52px;
}

/* Content
----------------------------------------------------------------------------------------------------*/

#mask {
	/*width: 3760px;
	overflow: hidden;
	margin: 0 auto 0 -470px;
	position: relative;*/
}

.box {
	width: 980px;
	position: relative;
	z-index: 1000;
	margin: 0 auto;
	margin-top:7px
}

.box-content {
	height: 700px;
	overflow: hidden;
}

.box-content .detail {
	position: absolute;
	z-index: 500;
}

.navegacao {
	position: absolute;
	top: 50%;
	margin-top: -33px;
	display: block;
	width: 46px;
	height: 66px;
	z-index: 1500;
	background: url("../images/arrows_background.png") no-repeat;
}

.layout-text{text-indent:-9999px}
.box-content #get-started-now {
color:#FFFFFF;
font-size:22px;
line-height:113px;
text-align:center;
text-decoration:none;
text-indent:0;
}

#arrow-back {
	left: 0;
	background-position: 0 0;
}
#arrow-next {
	right: 0;
	background-position: -46px 0;
}

#arrow-back.hidden,
#arrow-next.hidden {
	display: none;
}

/* How it works */

#how-it-works { background: url(../images/how_it_works_background_new.png) no-repeat 118px -100px; }

#how-it-works h2.layout-text {
	width: 239px;
	height: 130px;
	position: absolute;
	top: 7px;
	right: 60px;
	background: url("../images/how_it_works.png") no-repeat;
}

#how-it-works #get-started-now {
	width: 255px;
	height: 115px;
	display: block;
	position: absolute;
	z-index: 1500;
	top: 500px;
	left: 50%;
	margin-left: -125px;
	background: url("../images/get_started_button.png") 0 -115px no-repeat
}

#how-it-works #get-started-now:hover { background-position: 0 0; }

/* Video player */

#video-player { background: url("../images/experience_background.png") no-repeat; }

#video {
	top: 30px;
	left: 50%;
	margin-left: -330px;
	width: 660px;
	height: 405px;
	position: relative;
}

#video-player h2.layout-text {
	width: 170px;
	height: 105px;
	position: absolute;
	bottom: 120px;
	left: 260px;
	background: url("../images/experience.png") no-repeat;
}

#video-player .detail {
	bottom: 0;
	left: -50px;
}

/* Get started */

#get-started { background: url("../images/get_started_background.png") 0 20px no-repeat; }

#get-started h2.layout-text {
	width: 200px;
	height: 133px;
	position: absolute;
	top: 30px;
	left: 40px;
	background: url("../images/get_started.png") no-repeat;
}

#profile-choose {
	width: 700px;
	margin: 0 auto;
	overflow: hidden;
}

#profile-choose .profile-type {
	width: 250px;
	margin-top: 150px;
	padding-top: 150px;
}

#profile-choose .profile-type p {
	padding-left: 20px;
	clear: both;
}

#profile-choose #professional {
	margin-left: 50px;
	background: url("../images/professional_background.png") 40px 30px no-repeat;
}

#profile-choose #user {
	margin-left: 150px;
	background: url("../images/user_background.png") 30px 10px no-repeat;
}

/* System message */

#system-message {
	width: 465px;
	position: absolute;
	top: 50px;
	left: 50%;
	margin-left: -300px;
}

/* Create Account */

#create-account { background: url("../images/create_account_background.png") 100% 20px no-repeat; }

#create-account h2.layout-text {
	width: 247px;
	height: 107px;
	position: absolute;
	top: 30px;
	left: 40px;
	background: url("../images/create_account.png") no-repeat;
}

#create-account .detail {
	bottom: 0;
	right: 0;
}

#account-pro {
	width: 570px;
	margin: 150px 0 0 150px;  
}

#account-pro form {
	position: relative;
	padding: 0 20px;
}

#account-pro form ul li { width: auto; }

#account-pro form ul li.left { margin-right: 10px; }

#account-pro form ul li.z-index { z-index: 10000; }

#account-pro form ul li:last-child { margin-bottom: 0; }

#account-pro form fieldset {
	overflow: visible;
	z-index: 9000;
}

#account-pro form label { display: block; }

#account-pro form .full-name label { margin-bottom: 2px; }

#account-pro form select { width: 255px; }

#account-pro form #full-name {
	margin-bottom: 0;
	clear: both;
}

#login-info #form-box  { width: 488px; }

/* Tooltip validation */

.tooltip .warning ul li,
.tooltip .error ul li {
	margin-bottom: 5px;
}

.tooltip .warning ul li:last-child,
.tooltip .error ul li:last-child {
	margin-bottom: 0;
}

input[type=text],
input[type=password] {
	padding: 3px 0 4px 0;
}

input[type=checkbox] { margin-left: 0; }

form input.large-input { width: 484px; }

form input.medium-input { width: 248px; }

form #form-box input.medium-input { width: 229px; }

form input.mini-input { width: 164px; }

input.error { background: #fddedd; }

input.warning { background: #ffee8f; }

#login-info h3 { margin-top: 10px; }

/* Password Strenght */

#password-strength { margin-top: 10px; }

#password-strength span {
	margin-top: 10px;
	display: block;
	width: 104px;
	height: 5px;
	overflow: hidden;
	background: url(../images/password_strength_background.png) no-repeat;
}

#password-strength span.strongPass { background-position: 0 0; }

#password-strength span.goodPass { background-position: 0 -5px; }

#password-strength span.badPass { background-position: 0 -10px; }

#password-strength span.shortPass { background-position: 0 -15px; }

.personas{width:1440px;z-index:2;position:absolute;top:0;left:0}
.persona-1{position:absolute;top:241px;left:20px;z-index:2}
.persona-2{position:absolute;top:325px;right:71px;z-index:2}

/* Modal
----------------------------------------------------------------------------------------------------*/

#modal-content {
	color: #383838;
	border: 3px solid #8cc63f;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}

#subscribe-form p { clear: both; }

#modal-content #subscribe-success { min-height: 22px; }

#modal-content h1 {
	width: 94%;
	margin-bottom: 0.36em;
}

#modal-content .content { padding: 1.25em;	background: #fff;-moz-border-radius: 17px;
	-webkit-border-radius: 17px; }

#modal-content ul {
	width: 100%;
	margin: 0;
	list-style: none;
	margin-bottom: 0.42em;
}

#modal-content ul li {
	width: 100%;
	margin-bottom: 0.83em;
	float: left;
}

#modal-content ul#captcha {
	width: 100%;
	margin-bottom: 1.67em;
	border-bottom: 1px solid #ebebeb;
}

#modal-content ul#captcha li {
	width: 49%;
	margin: 0 0 0.42em 0;
}

#modal-content ul#captcha li p {
	margin: 0 0 0.58em 0;
	line-height: normal;
}

#modal-content #frmRegister fieldset {
	border-top: 1px solid #ebebeb;
	padding: 1.67em 0 0 0;
}

#modal-content #frmRegister label {
	display: block;
	float: left;
	font-weight: bold;
	width: 50px;
}

#modal-content #frmRegister input {
	width: 402px;
	margin-bottom: 0.42em;
	padding: 0.25em 0 0.33em 0.36em;
}

#modal-content #frmRegister input,
#modal-content #frmRegister select {
	color: #000;
	font-size: 1.0em;
	font-family: "Arial", Helvetica, sans-serif;
}

#modal-content #frmRegister input#register-button {
	width: auto;
	padding: 0;
	margin: 0;
}

#modal-content #frmRegister #user-code { width: 220px; }

#modal-content #frmRegister select {
	width: 185px;
	margin-bottom: 0.42em;
}

html>body #captcha-image { min-height: 60px; }

#captcha-image {
	height: 60px;
	margin-bottom: 0.63em;
}

#captcha-image img { border: 1px solid #b8b8b8; }

#modal-content #frmRegister span.error {
	display: block;
	color: #cc3333;
	line-height: 1.0em;
	font-size: 0.92em;
	margin-left: 50px;
}

#modal-content #frmRegister ul#captcha span.error { margin-left: 0; }

#modal-content #frmRegister a {
	color: #338135;
	font-size: 0.92em;
}

#modal-content #subscribe-success p { margin-bottom: 0.83em; }

.copyright{
	width: 980px;
	position: absolute;
	bottom:10px;
	z-index: 1000;
	/*background:#3AB24A;*/
	margin-left:-490px;
	left:50%
}

.copyright p{width:600px;float:left;color:#ddd}

.copyright p a{color:#ddd}

.ut-logo{
	background:url("../../up/images/logo-ut.png") no-repeat scroll left top transparent;
	display:block;
	height:23px;
	line-height:normal;
	text-indent:-9999px;
	width:89px;
	float:right;
	background-position:0 -23px
}

.ut-logo:hover{
	background-position:0 0
}
.ua-logo{
	background:url("../../up/images/logo-ua.png") no-repeat scroll left top transparent;
	display:block;
	height:23px;
	line-height:normal;
	text-indent:-9999px;
	width:140px;
	float:right;
	background-position:0 -23px
}

.ua-logo:hover{
	background-position:0 0
}