@charset "utf-8";
/*
Webs with love
http://www.webswithlove.com

CSS Main Styles
Version: 1.0
Last change: 24 May 2009
.
Copyright 2009 Webs with love - All rights reserved
.

[Table Of Contents]
	1- Global
	2- Links
	3- Headings
	4- Header
	5- Navigation
	6- Structure
	7- Main content
	8- Main content
	9- Extras
	10- Footer
*/

/*–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
	=1 Global
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
html, body {
	height: 100%;
	}
body {
	color:#222;
	font-size:85%;
	font-family:'Lucida Grande','Lucida Sans','Lucida Sans Unicode',Verdana,sans-serif;
  background:#555 url(../img/bkgd.png) bottom fixed repeat-x;
}
hr {
	display:none;
}
p {
	padding-bottom:0.8em;
}
p:last-child {
	padding-bottom:0;
}
.right {
	float: right;
}
.left {
	float: left;
}
.align-left {
	text-align: left;
}
.align-right {
	text-align: right;
}
.align-center {
	text-align:center;
}
.justify {
	text-align:justify;
}
.hide {
	display: none;
}
.clear {
	clear: both;
}
.bold {
	font-weight:bold;
}
.italic {
	font-style:italic;
}
.underline {
	border-bottom:1px solid;
}
.highlight {
	background:#ffc;
}
img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
img.alignleft {
	float:left;
	margin:4px 10px 4px 0;
}
img.alignright {
	float:right;
	margin:4px 0 4px 10px;
}
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}
.tinyGap {
	margin:0.2em 0;
}
.bottomGap {
	margin-bottom:1.12em;
}
.topGap {
	margin-top:.5em;
}
p.original {
	padding-bottom: 1.12em;
}
button {
  display: inline-block;
  float: left;
  margin:0 0.583em 0.667em 0;
  padding:5px 10px 5px 7px;   /* Links */
  border:1px solid #dedede;
  border-top:1px solid #eee;
  border-left:1px solid #eee;
  background-color:#f5f5f5;
  font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
  font-size:100%;
  line-height:130%;
  text-decoration:none;
  font-weight:bold;
  color:#565656;
  cursor:pointer;
	-moz-border-radius: 3px;
	-webkit-border-bottom-left-radius:3px;
	-moz-box-shadow: 0em 0em .2em #a7b6aa;
	-webkit-box-shadow: 0em 0em .2em #a7b6aa;
	opacity:.9;
}
button { width:auto; overflow:visible; padding:4px 10px 3px 7px; }
button[type] { padding:4px 10px 4px 7px; line-height:17px; }
*:first-child+html .container button[type] { padding:4px 10px 3px 7px; }

button img, a.button img{ margin:0 3px -3px 0 !important; padding:0; border:none; width:16px; height:16px; float:none; }
/* Standard Buttons */
button:hover, a.button:hover{ background-color:#dff4ff; border:1px solid #c2e1ef; color:#336699; }
a.button:active, button:active{ background-color:#6299c5; border:1px solid #6299c5; color:#fff; }

/* Positive */
body .positive { color:#529214; }
a.positive:hover, button.positive:hover { background-color:#E6EFC2; border:1px solid #C6D880; color:#529214; }
a.positive:active, button.positive:active { background-color:#529214; border:1px solid #529214; color:#fff; }

/* =2 Links
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
:focus, a {
 -moz-outline-style: none;
 outline: none !important;
}
a:link, a:visited {
	color: #333;
}
a:hover {
	color: #111;
}
a:active {
	color: #111;
}
a:link, a:visited, a:focus {
    color: #0066CC;
    text-decoration: none;
	outline:none;
}
a:hover {
    text-decoration: underline;
	outline:none;
}

/* =3 Headings
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
h1, h2, h3, h4, h5, h6, strong {
letter-spacing:-1px;
}

h1 {
	font: bold 2em "Times New Roman", Times, serif;
}
h2 {
	font: bold 1.5em "Times New Roman", Times, serif;
}
h3 {
	font: bold 1.2em Arial, Geneva, Helvetica, sans-serif;
}
h4 {
	font: bold 1em Arial, Geneva, Helvetica, sans-serif;
}
h5 {
	font: bold 0.9em Arial, Geneva, Helvetica, sans-serif;
}
/* =4 Header
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#logo {
	display:block;
	position:absolute;
	top:0px;
	left:-101px;
	z-index:999;
	background:transparent url(../img/logo.png) no-repeat;
	width:130px;
	height:185px;
	text-indent:-9999px;
}
#shadow {
	position: absolute;
	bottom: 10px;
	left:0;
	right:0;
	width:625px;
	height:39px;
	background:transparent url(../img/shadow.png);
	z-index:1;
}
#solutions {
	display:block;
	width: 520px;
	height: 40px;
	padding:15px 0 0 27px;
	margin-left:25px;
	text-indent:-9999px;
}
#solutions.en {
	background:transparent url(../img/we-make-things-easier-for-you.png) no-repeat bottom left;
}
#solutions.es {
	background:transparent url(../img/creamos_soluciones_web.png) no-repeat bottom left;
}
#litleBallons {
	display:block;
	margin:5px 0 0 30px;
}
#welcome {
padding-top:8px;
font-size:19px;
width:540px;
padding-bottom:10px;
font-family:'Myriad Pro',Helvetica,Arial,sans-serif;
text-align:center;
}
#welcome_span1 {
display:block;
color:#373B3F;
font-size:1.1em;
padding-bottom:4px;
}

#welcome_span2 {
display:block;
color:#4F4A4A;
font-size:1.6em;
letter-spacing:-1px;
font-weight:bold;
}
#welcome_span3 {
display:block;
color:#4F4A4A;
font-size:1.6em;
letter-spacing:-1px;
font-weight:bold;
}
/* =5 Navigation
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#tooltip{
	position:absolute;
	width:623px;
	height:78px;
	bottom:-35px;
	left:0px;
	z-index:1009;
  overflow:hidden;
}
#tooltip:hover{
	height:250px;
}
#ie-friendly-input {
	position:absolute;
	bottom:0px;
	left:0px;
	width:623px;
	height:66px;
	padding:7px 26px;
	background:transparent url(../img/bubble.png) no-repeat 0 0;
	z-index:1009;
}
#ie-friendly-input input#bubble {
	border:0;
	width:550px;
	height:36px;
	padding:8px 25px 8px 0px;
	font: italic 2em 'Trebuchet MS', arial, Helvetica, sans-serif;
	background: transparent;
	cursor:pointer;

}

#suggest.extended {
	height : 226px;
	bottom : 16px !important;
}
#suggest {
	position:absolute;
	width:599px;
	bottom:70px;
	left:5px;
	height:172px;
	padding:10px 15px;
	background:transparent url(../img/suggest_ballon.png) no-repeat 0 15px;
	opacity: .9;
	z-index:1010;
}

#suggest ul {
	margin: 25px 0;
}
#suggest ul ul{
	margin: 10px 0;
}
#suggest ul li {
	float:left; padding:0px;
}

#suggest ul ul li {
	float:none;
}

#suggest ul strong {
	height:1px; line-height:1px; overflow:hidden; visibility:hidden
}

#suggest ul ul li {
	font-weight:bold;
	font-size:16px;
	font-family:Georgia, serif;
}

#suggest .sAbout {
	background:transparent url(../img/webs-with-love.png) no-repeat; margin: 0px 5px; width:190px;
}

#suggest .sAbout a {
	display:block; color:#d20c35; height:100%;padding:5px 0; border-top:1px solid #f0b2b1;
}

#suggest .sServices {
	margin: 0px 5px; width:180px;
}

#suggest .sServices.en {
	background:transparent url(../img/services.png) no-repeat;
}

#suggest .sServices.es {
	background:transparent url(../img/servicios.png) no-repeat;
}

#suggest .sServices a {
	display:block; color:#0d90dc; height:100%;padding:5px 0; border-top:1px solid #b5dae4;
}

#suggest .sContact {
	margin: 0px 5px; width:180px;
}

#suggest .sContact.en {
	background:transparent url(../img/contact.png) no-repeat;
}

#suggest .sContact.es {
	background:transparent url(../img/contacto.png) no-repeat;
}

#suggest .sContact a {
display:block; color:#598527; height:100%;padding:5px 0; border-top:1px solid #cbd7ad;
}

#suggest ul li a, #suggest ul li a:link {
	text-decoration:none;
}

#suggest ul li a:hover {
	text-decoration:underline;
}

/* =6 Structure
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#wrapper {
	position:relative;
	text-align:left;
	margin: 0px auto;
	width:620px;
	z-index:1;
	height:100%;
}
#chat-wrapper {
	position:absolute;
	top:20px;
	bottom:75px;
	min-height:280px;
	left:0;
	z-index:2;
}
#lang-select {
	position:absolute;
	top:-7px;
	right:-8px;
	background:transparent url(../img/lang_select.png) no-repeat;
	height:37px;
	width:73px;

}
#lang-select span{ display:none; }
#lang-select a{
	display:block;
	float:left;
	text-indent:-9999px;
	height:37px;
	width:30px;
}
#chat-wrapper-top {
	font-size:1px;
	line-height:1px;
	height:10px;
	width:611px;
	background:transparent url(../img/wrapper_top.png) no-repeat;

}
#chat-wrapper-bottom {
	font-size:1px;
	line-height:1px;
	position:relative;
	height:11px;
	width:611px;
	background:transparent url(../img/wrapper_bottom.png) no-repeat;
}
#chat-wrapper-content {
	margin:0;
	height:100%;
	width:611px;
	background:#e8f4f7 url(../img/wrapper_back.png) repeat-x;
}

#corner-left{
	position:absolute;
	background:transparent url(../img/corner_left.png) no-repeat;
	height:9px;
	width:9px;
	left:6px;
	top:122px;
	z-index:1002;
}

#corner-right{
	position:absolute;
	background:transparent url(../img/corner_right.png) no-repeat;
	height:10px;
	width:9px;
	right:6px;
	top:122px;
	z-index:1002;
}
#corner-bleft{
	position:absolute;
	background:transparent url(../img/corner_bleft.png) no-repeat;
	width:10px;
	height:9px;
	left:6px;
	bottom:42px;
	z-index:1002;
}
#corner-bright{
	position:absolute;
	background:transparent url(../img/corner_bright.png) no-repeat;
	width:10px;
	height:9px;
	right:6px;
	bottom:42px;
	z-index:1002;
}
/* =7 Main content
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#chat-wrapper-content #msgBox{
	position:absolute;
	top:122px;
	left:6px;
	width:599px;
	bottom:43px;
	padding:0;
	margin:0;
	overflow:auto;
}

#chat-wrapper-content #msgBox .even {
	position:relative;
	margin:0;
	margin-top: -35px;
	z-index:98;
}
#chat-wrapper-content #msgBox .even .wrap{
	padding:40px 20px 0px 20px;
	padding-bottom:0;
	font-size: 130%;
	letter-spacing:-1px;
	line-height:1.32em;
	background:#ace8f9 url(../img/patt_1.png);
}


#chat-wrapper-content #msgBox .even .hr
{
	background:transparent url(../img/patt_1_end.png) top left repeat-x;
	border:0;
	margin:0;
	height:46px;
}

#chat-wrapper-content #msgBox .odd
{
	position:relative;
	margin-top:-20px;
	z-index:99;
}

#chat-wrapper-content #msgBox .odd .wrap
{
	padding:15px 20px;
	padding-top:35px;
	color:#fff;
	text-shadow: 0px 0px 5px #fff;
	background: #f2835c url(../img/patt_4.png) bottom repeat-x;
}

#chat-wrapper-content #msgBox .odd .wrap h3{
	font: italic 2em georgia, serif;
}
#chat-wrapper-content #msgBox .odd .hr{
	border:0;
	padding: 0;
	margin:0;
	background:transparent url(../img/patt_4_end.png) top left repeat-x;
	height:13px;
}
/* =8 Extra
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
#contactForm{
	padding-top:15px;
}
#contactForm legend {font-family:georgia, serif;
      display:block;
      font-size:1.4em;
      padding-bottom:10px;
      color:#43AF00;
	  }
#contactForm div {
	margin-bottom: 8px;
	margin-left:6px;}

#contactForm label {
	font-family:georgia, serif;
      display:block;
      font-size:1.2em;
      margin-bottom:5px;
	  font-style:italic;
	  color:#555;
	  }
#contactForm input.text {
   font:1.5em Georgia,serif;
   padding:0 5px;
   width:93%;
    border: 1px solid #abadb3;  border-left-color:#e2e3ea; border-bottom-color:#e2e3ea; background: #fff;
  -moz-border-radius: 3px;
-webkit-border-bottom-left-radius:3px;
}
#submit {
	display:none;
}
#sendForm {
position:absolute;
bottom:6px;
right:41px;
}
input#message {
position:absolute;
bottom:5px;
left:21px;
border:0;
width:550px;
height:36px;
padding:8px 25px 8px 0px;
font-family:'Trebuchet MS', arial, Helvetica, sans-serif;
font-size: 28px;
font-style: italic;
font-weight:normal;
background: transparent;

}
a#exitForm {
position:absolute;
display:block;
right:30px;
top:0px;
width:32px;
height:32px;
background:url(../img/Back.png);
text-indent:-9999px;
}
#succesMsg {
	font-family: "Myriad Pro", Helvetica, Arial, sans-serif;
	font-size:1.8em;
	color:#555;
}
#succesMsg h1{
	margin-top:6px;
	font-family:Georgia,serif;
	font-size:1.2em;
	letter-spacing:-2px;
	color:#0f9b00;
	}
#sending {
	position:absolute;
	bottom:3px;
	left:28px;
	width:545px;
	height:60px;
	z-index:1009;
}
#sending p{
	float:left;

	font: italic 26px 'Trebuchet MS', arial, Helvetica, sans-serif;
}
#sending img{
	float:right;
	margin-top:6px;
}

/* =9 Extra
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/
.workContainer {
	position:relative;
	width:536px;
	height:170px;
	padding:10px 0 0 15px;
	margin-top:10px;
	background:transparent url(../img/work_wrapper.png) no-repeat;
	margin-left:-4px;
}
.workContainer h4{

font-size:1.2em;
height:20px;

}
.workContainer p{
font-size:.8em;
line-height:1.2em;
width:275px;
}
.workContainer .thumb{
	position:absolute;
	display:block;
	top:2px;
	right:1px;
	width:257px;
	height:167px;
	z-index:9999;

}

.comment {
	color:gray;
	font-size:14px;
	font-weight:normal;
}

/* =10 Footer
–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/