/*
Milk-it Software Farm
General Stylesheet
---
Lucas Petes <lucas@milk-it.net>
2009
*/


/* ========= Body */

body {
	margin:0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.70em;
	line-height:18px;
	/* background:url(../images/bg_grid.gif); */
	color:#262C38;
}

textarea {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	}

#container { width:1010px; margin:0 auto; }

h2 {
	line-height:36px;
	text-indent:-9999px;
	background-image:url(../images/el_titulos.png);
	background-repeat:no-repeat;
}

h2#t_como-trabalhamos { background-position:0 -108px;}
h2#t_design { background-position:0 0px;}
h2#t_desenvolvimento { background-position:0 -36px;}
h2#t_vamos-comecar { background-position:0 -72px; margin-top:21px;}
h2#t_processo { background-position:0 -144px; margin-top:14px; position:relative; clear:left;}
h2#t_principios { background-position:0 -180px; margin-top:-10px; position:relative;  }
h2#t_entre-em-contato { background-position:0 -216px; margin-top:31px;}


/* ========= Top */

#milk-it { position:absolute; padding:19px 0 0 18px; }
#software-farm { position: absolute; padding-left:856px; top:0; }

h1 {
	background:url(../images/el_fazenda.jpg) no-repeat;
	width:1010px;
	height:326px;
	text-indent:-9999px;
	margin-bottom:35px;
}

/* ========= Main Cols */

#left { width:720px; float:left; padding-left:18px; }
#right { padding-left:783px; }
/* #right { padding-left:774px; } */

/* ========= Main Col: Left | Child Col: Left */

#l_left { width:216px; float:left; }
#l_left img { margin:16px 0 8px; }
#l_left ul, .errorExplanation ul { line-height:27px; list-style:url(../images/bullet.gif) inside; }
#l_left li, .errorExplanation li { background:url(../images/hr.gif) no-repeat 0 100%; }
#l_left li.last { background:none; }

/* ========= Main Col: Left | Child Col: Right */

/* === Cols */

#l_right { padding-left:252px; }
#l_servicos { width: 216px; float:left; }
#r_servicos { padding-left: 252px; }

/* === Titles */

#l_servicos h3, #r_servicos h3, #primeiro-contato h3, #pc-home h3 {
	line-height:18px;
	text-indent:-9999px;
	background-image:url(../images/el_titulos.png);
	background-repeat:no-repeat;
}

#s_websites h3 { background-position: 0 -254px; }
#s_interfaces h3 { background-position: 0 -272px; }
#s_face-lift h3 { background-position: 0 -290px; }
#s_cms h3 { background-position: 0 -307px; height:36px; }
#s_sob-demanda h3 { background-position: 0 -343px; }
#s_ai h3 { background-position: 0 -361px; }

/* === Icons and separator */

#l_right div div { background-image:url(../images/icones.jpg); background-repeat:no-repeat; padding-left:72px; }
#l_right hr { background: white url(../images/hr.gif) 50% 100% no-repeat; color:none; border:0; height:5px; margin:16px 0 15px 0; color: none; }

#s_websites { background-position:0 0}
#s_interfaces { background-position: 0 -120px; }
#s_face-lift { background-position: 0 -240px; }
#s_cms { background-position: 0 -360px;}
#s_sob-demanda { background-position: 0 -480px; }
#s_ai { background-position: 0 -600px; }

/* === Language Panel */

#language-panel { padding-top:36px;}

/* ========= Main Col: Left | Full Size */

/* === Process */

#processo { background:url(../images/el_processo.jpg) no-repeat; text-indent:-9999px; width:732px; height:222px; clear:left; margin-top:-18px; }

/* === Principles */

/* Menu */

#principios { list-style:none none; background:url(../images/el_fita.png) no-repeat; padding:15px 0 0 30px; width:693px; height: 202px; }
#principios div { background:url(../images/hr_principios.gif) repeat-x 0 100%; line-height:27px; padding-left:6px; width: 225px; }
#principios div a { display:block; height:27px; background-image: url(../images/principios.gif); background-repeat:no-repeat; text-indent:-9999px; }
#principios div a:hover { width:200px; }
#principios div a.selected:hover { width:auto; }

#p_1 a { background-position:0 7px;}
#p_2 a { background-position:0 -20px;}
#p_3 a { background-position:0 -47px;}
#p_4 a { background-position:0 -74px;}
#p_5 a { background-position:0 -101px;}
#p_6 a { background-position:0 -128px;}
#p_1 a:hover, #p_1 .selected { background-position:-251px 7px;}
#p_2 a:hover, #p_2 .selected { background-position:-251px -20px;}
#p_3 a:hover, #p_3 .selected { background-position:-251px -47px;}
#p_4 a:hover, #p_4 .selected { background-position:-251px -74px;}
#p_5 a:hover, #p_5 .selected { background-position:-251px -101px;}
#p_6 a:hover, #p_6 .selected { background-position:-251px -128px;}


/* Texts */

#slider .scroll {
	height: 202px;
	overflow: auto;
	position: relative; /* fix for IE to respect overflow */
	clear: left;
	width:395px;
	margin:-196px 0 0 287px;
 }
 
#slider .scrollContainer div.panel { height: 202px; width:340px; color: #D0CCAC; padding:0 25px 0 30px; }
#slider .scrollContainer div.panel p { margin-top: 9px; }
#slider .scrollContainer div.panel h3 { display:none; }
.icon { width:48px; height:48px; /* background-color:#B8B397; */ }

/* ========= Main Col: Right */

#portefoleo {
width: 216px;
position: relative;
	}

#portefoleo .scroll {
	height: 208px;
	overflow: auto;
	position: relative; /* fix for IE to respect overflow */
	/* clear: left; */
	width:216px;
	z-index:52;
 }
 
#portefoleo .scrollContainer div.panel { height: 208px; width:216px; z-index:51; }

#portfolio-bg {
	position:relative;
	background:url(../images/bg_portfolio.gif) no-repeat;
	width:216px;
	height:83px;
	padding: 0 10px 0 13px;
	margin:-74px 0 0 -13px;
	z-index:50;
	}
	
#portfolio-controller {
	text-align:right;
	position:relative;
	z-index:53;
	margin-top:-26px;
	padding-right:10px;
	}


/* === Let's Get Started */

h3#s_guia-do-cliente, h3#s_primeiro-contato {
	line-height:18px;
	text-indent:-9999px;
	background-image:url(../images/el_titulos.png);
	background-repeat:no-repeat;
	margin-top:9px;
	margin-bottom:3px;
}

h3#s_guia-do-cliente a, h3#s_primeiro-contato a { display:block; }

h3#s_guia-do-cliente { background-position:0 -424px;}
h3#s_primeiro-contato { background-position:0 -391px;}

.comeco { padding-left:37px; }
.comeco a { text-decoration:none; color:#262C38; border-bottom:1px dotted #ddd; }
.comeco a:hover, .comeco a:active { color:#008798; border-bottom:1px dotted #008798; }

#right hr { background:white url(../images/hr.gif) 0% 100% no-repeat; color:none; border:0; height:5px; margin: 2px 0; color: none;}


/* === Contact */

form ul { list-style: none none; }
form li { margin-bottom:10px; }
form label { padding:6px 0 0 9px; color: #008798; }
form .req { background:url(../images/req.gif) no-repeat 96% 55%; }
form input, form textarea { border:1px solid #B8B397; -moz-border-radius:3px; border-radius:3px; -ms-border-radius:3px; -webkit-border-radius: 3px; padding:6px 5px 4px 8px; }
form textarea { padding-bottom:10px; padding-right:1px; }
#enviar { padding:0; border:0; width:auto; position:relative; margin:-40px 0 0 138px; }

#form-contato label { position:absolute; }
#form-contato textarea { width:207px; height:128px; }

/* === vCard */

.vcard { text-align:center }
.fn, address, .tel { display:none; }

/* ========= Footer */

#footer { height:85px; clear:both; background:url(../images/bg_footer.png) 0 100% repeat-x; padding-top:64px;}

.active { background:#EA584B !important; border: 1px solid #B6242E !important; color:white }

/* ========= Let's Get Started - Primeiro contato */

#pc-home { background: url(../images/bg_primeiro-contato.gif) no-repeat; padding:15px 10px; width:577px; height:421px; /* margin:17px 0 0 26px; */ }
#pc-titulo { background-position:0 -530px; margin-bottom:10px;}

h3#pc-website, h3#pc-form-website { background-position: 0 -452px; margin:24px 0 10px 0;}
h3#pc-form-website, h3#pc-form-sistema { margin: 0 0 10px 0 !important; }
h3#pc-sistema, h3#pc-form-sistema { background-position: 0 -470px; margin:24px 0 10px 0;}
h3#pc-servico { background-position: 0 -488px; margin:0px 0 0 0;}
h3#pc-outsourcing { background-position: 0 -506px; margin-top:30px;}

#pc-left { float:left; width:244px; }
#pc-right { padding-left:324px; }
.path {line-height:0; margin-top:10px;}

#pc-services { clear:left; width:350px; padding:45px 230px 0 0; background:url(../images/bg_hello.gif) no-repeat 415px 85px; }

#primeiro-contato { width: 660px; padding: 20px; margin:20px auto; background:#fff url(../images/bg_pc-top.gif) no-repeat; }
#pc-footer { width: 700px; height:6px; background:url(../images/bg_pc-bottom.gif) no-repeat; clear:both; margin:0 auto 20px auto; }

/* Forms +++++++++++++++++++++ */

#primeiro-contato form ul { 
clear:none;
float:left;
width:100%;
text-align:left;
}

#primeiro-contato form li {
clear:both;
float:left;
width:100%;
margin-bottom:0; padding-top:6px; padding-bottom:4px;
border-top: 1px dotted #B9B497;
}
	
#primeiro-contato form li div li {float:none;border:none; }
#primeiro-contato form li div ul {float:none;margin:0;border:0;}


#primeiro-contato form li div ul.short-list { width:460px;}
#primeiro-contato form li div ul.short-list li {display:block; float:left; width:185px; border:none; clear:none !important;}

#primeiro-contato form li div input {margin-right:0px;}

#primeiro-contato form label {
float:left;
display:block;
width:185px;
padding:6px 0 0 0;
}

#primeiro-contato form label.inline {
display:inline !important;
float:none !important;
margin-top:-2px;
width:auto;
padding-right:2px;
}

#pc-comentarios, .pc-comentarios { width:460px; height:150px; }
#primeiro-contato #enviar { padding:0; border:0; width:auto; position:relative; margin:-40px 0 0 575px; }


#primeiro-contato select { border:1px solid #B8B397; -moz-border-radius:3px; border-radius:3px; -ms-border-radius:3px; -webkit-border-radius: 3px; padding:6px 5px 4px 8px; }

.alone { padding-top:13px; display:none }
#primeiro-contato form li div {float:left;}
#primeiro-contato form li div div { margin-left:0 !important; float:none !important; }

#form-header {margin-bottom:27px;}

span.info {
display:block;
color:#AAA;
	}

div.fieldWithErrors input,
div.fieldWithErrors select {border:1px solid #FC0;}

div.formError,
div.information,
div.sucess {
line-height:110%;
font-size:11px;
padding:4px 0 1px 20px;
margin-top:4px;
width:330px;
margin-bottom:10px;
}

form div.formError,
form div.information,
form div.sucess { margin-bottom:0;}

div.formError { background:url(../images/icon_error.gif) no-repeat 0 2px; }
div.information { background:url(../images/icon_information.gif) no-repeat 0 2px; }
div.sucess { background:url(../images/icon_sucess.gif) no-repeat 0 2px; }

.errorExplanation h2 { color: #B6242E; text-transform:uppercase; background-position:0 -570px; line-height:18px; }
#primeiro-contato .errorExplanation { border-top:1px dotted #EA584B; }
#primeiro-contato .errorExplanation h2 { display:none; }
#primeiro-contato .errorExplanation p { color: #B6242E ; }
#primeiro-contato .errorExplanation ul { border-bottom:1px dotted #EA584B; margin-bottom:10px; }
#primeiro-contato .errorExplanation li { background:none; border-top:none; line-height:18px; float:none; }
.errorExplanation { padding:5px 4px 0 0;}