/* reset */
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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
input, textarea, select { font-size: 100%; line-height: 1; }
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* generales */
body {
	color:#545454;
	font-family:Helvetica, Arial, sans-serif;
	font-size:13px;
}
a { color:#ee3124; text-decoration:none; }
a:hover { text-decoration:underline; }
strong { font-weight:bold; }
.clear { clear:both; }
.left { float:left; }
.right { float:right; }
.upper { text-transform:uppercase; }
.red { color:#ee3124; }
.big-text { font-size:1.4em; }

#header,
#content,
#footer {
	clear:both;
}
ul#navigation li a,
a#head-logo,
.portfolio-box a.prev,
.portfolio-box a.next,
#content div.clients-box li,
#content div.orange-box h1.about,
body.contact a.become-fan,
#our-redes a {
	display:block;
	text-indent:-9999px;
}
ul#navigation li a,
a#head-logo,
.portfolio-box a.prev,
.portfolio-box a.next,
#content div.clients-box li,
#footer a.tc-blog img,
#footer a.facebook img,
#footer a.phone img,
#content div.orange-box img.contact,
#content div.orange-box img.about,
#content div.orange-box img.pr,
#content div.orange-box h1.about,
div.orange-box.development,
div.orange-box.pr,
div.orange-box.spreading,
body.contact a.become-fan,
body.contact div.contact-form,
body.contact div.contact-form input.submit,
.user .social a img,
#our-redes a {
	background-image:url('../img/sprites.png');
	background-repeat:no-repeat;
}

h2 {
	font-size:18px;
	font-weight:700;
	margin-bottom:1em;
}

dl {
	line-height:1.5;
}

dt {
	float:left;
	font-weight:700;
	width:100px;
}

dd {
	color:#777;
	font-size:11px;
	line-height:21px;
	margin-left:100px;
}

.user {
	float:left;
	margin-bottom:50px;
	margin-right:20px;
	padding-left:120px;
	position:relative;
	width:322px;
}

.user.last {
	margin-right:0;
}

.user-photo {
	display:block;
	height:100px;
	left:0;
	position:absolute;
	top:0;
	width:100px;
}

.user .social {
	left:0;
	position:absolute;
	text-align:center;
	top:115px;
	width:100px;
}

.user .social a {
	margin:0 .5em;
}

.user .social a img {
	background-position:0 -35px;
	height:30px;
	margin-bottom:.5em;
	width:30px;
}

.user .social a.flickr img {
	background-position:-30px -35px;
}

.user .social a.twitter img {
	background-position:-60px -35px;
}

.user .social a.youtube img {
	background-position:-90px -35px;
}


ul#our-redes {
	bottom:-15px;
	position:absolute;
	right:37%;
	margin:0;
	padding:0;
}

#content ul#our-redes li {
	list-style:none;
	margin:0 0 0 10px;
	padding:0;
}

ul#our-redes li a {
	height:30px;
	margin:0;
	padding:0;
	width:30px;
}

ul#our-redes li a.facebook {
	background-position:0 -35px;
}

ul#our-redes li a.twitter {
	background-position:-60px -35px;
}

ul#our-redes li a.youtube {
	background-position:-90px -35px;
}

ul#our-redes li a.flickr {
	background-position:-30px -35px;
}

/* layout */
#header,
#footer {
	margin:0 auto;
	width:960px;
}
#container {
}

a#head-logo {
	float:left;
	height:35px;
	width:237px;
}

#header {
	padding-top:16px;
}
ul#navigation, #our-redes {
	float:right;
	margin:10px 0 0 20px;
}
ul#navigation li, #our-redes li {
	float:left;
}
ul#navigation li a, #our-redes a { height:24px; margin-left:5px; }
ul#navigation li.about a { background-position:-251px 0; width:143px; }
ul#navigation li.advertising a { background-position:-394px 0; width:88px; }
ul#navigation li.spreading a { background-position:-482px 0; width:88px; }
ul#navigation li.pr a { background-position:-570px 0; width:62px; }
ul#navigation li.development a { background-position:-632px 0; width:84px; }
ul#navigation li.blog a { background-position:-716px 0; width:48px; }
ul#navigation li.contact a { background-position:-764px 0; width:76px; }
ul#navigation li.about a:hover  { background-position:-251px -24px; }
ul#navigation li.about a.active  { background-position:-251px -48px; }
ul#navigation li.advertising a:hover  { background-position:-394px -24px; }
ul#navigation li.advertising a.active { background-position:-394px -48px; }
ul#navigation li.spreading a:hover { background-position:-482px -24px; }
ul#navigation li.spreading a.active { background-position:-482px -48px; }
ul#navigation li.pr a:hover { background-position:-570px -24px; }
ul#navigation li.pr a.active { background-position:-570px -48px; }
ul#navigation li.development a:hover { background-position:-632px -24px; }
ul#navigation li.development a.active { background-position:-632px -48px; }
ul#navigation li.blog a:hover { background-position:-716px -24px; }
ul#navigation li.blog a.active { background-position:-716px -48px; }
ul#navigation li.contact a:hover { background-position:-764px -24px; }
ul#navigation li.contact a.active { background-position:-764px -48px; }

#content {
	padding-top:26px;
}
#content div.orange-box {
	background-color:#ee3124;
	color:#fff;
	font-size:1em;
	line-height:1.4em;
	margin:0 auto;
	position:relative;
	overflow:visible;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}
#content div.orange-box a { color:#fff; }
.orange-box.about {
	height:160px;
	margin-bottom:30px !important;
	padding:40px 0 0 56px;
	width:904px;
}
.orange-box.about p {
	width:400px;
}
.orange-box h1 {
	font-size:1.9em;
	margin-bottom:6px;
}
#content div.orange-box h1.about {
	background-position:-251px -109px;
	height:51px;
	width:331px;
}
#content div.orange-box img.pr {
	background-position:-934px 0;
	height:35px;
	right:191px;
	position:absolute;
	top:-3px;
	width:52px;
}
#content div.orange-box img.portfolio {
	height:188px;
	right:80px;
	position:absolute;
	top:10px;
	width:349px;
}
#content div.orange-box img.contact {
	background-position:-620px -109px;
	height:188px;
	right:80px;
	position:absolute;
	top:10px;
	width:349px;
}
#content div.orange-box img.about {
	background-position:0 -67px;
	height:230px;
	right:80px;
	position:absolute;
	top:-14px;
	width:251px;
}
#content div.portfolio-box {
	background:url('../img/porfolio-slide-bg.png') center bottom repeat-x;
	border-top:1px solid #ddd;
	height:286px;
	position:relative;
	/*padding:10px 0 30px 0;*/
	padding:12px 0 5px;
}
body.advertising #content div.portfolio-box,
body.contact #content div.portfolio-box,
body.development #content div.portfolio-box,
body.spreading #content div.portfolio-box,
body.pr #content div.portfolio-box { border-top:1px solid #f2f2f2; }
#content div.portfolio-window {
	background:url('../img/portfolio-window-bg.png') center bottom repeat-x;
	border:1px solid #e6e6e6;
	height:178px;
	margin:30px auto 0;
	overflow:hidden;
	padding:10px 25px;
	width:816px;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}
ul.portfolio-holder { margin-left:0; }
ul.portfolio-holder li { float:left; }

.portfolio-box a.prev,
.portfolio-box a.next {
	height:49px;
	left:50%;
	position:absolute;
	top:140px;
	width:47px;
}
.portfolio-box a.prev { background-position:-840px 0; margin-left:-455px; }
.portfolio-box a.next { background-position:-887px 0; margin-left:408px; }

.portfolio-box a.more-link {
	background:#f2f2f2;
	display:block;
	float:right;
	font-size:12px;
	margin:15px 18px 0 0;
	padding:3px 10px;
}

#content div.clients-box {
	margin-top:16px;
}
#content div.clients-box ul {
	margin-top:18px;
	margin-left:165px;
	overflow:hidden;
}
#content div.clients-box li {
	float:left;
	height:42px;
	margin:0 6px;
}
#content div.clients-box li.brahma { background-position:-251px -896px; width:53px; }
#content div.clients-box li.unilever { background-position:-304px -896px; width:38px; }
#content div.clients-box li.pepsi { background-position:-342px -896px; width:51px; }
#content div.clients-box li.vh1 { background-position:-393px -896px; width:45px; }
#content div.clients-box li.mtv { background-position:-438px -896px; width:53px; }
#content div.clients-box li.intel { background-position:-491px -896px; width:42px; }
#content div.clients-box li.lays { background-position:-533px -896px; width:48px; }
#content div.clients-box li.twistos { background-position:-582px -896px; width:51px; }
#content div.clients-box li.rosstoc { background-position:-633px -896px; width:51px; }
#content div.clients-box li.sushi-pop { background-position:-684px -896px; width:67px; }
#content h3 { font-size:14px; font-weight:bold; margin:0 0 1em; /*margin:1em 0;*/ }
#content blockquote {
	color:#cb3408;
	font-size:1.85em;
	line-height:1.2em;
	margin:1.2em 0;
	text-indent:-37px;
	padding-left:37px;
}
#content blockquote.small { font-size:1.5em; }
span.big-quote {
	font-size:3em;
	font-weight:bold;
	height:75px;
	width:32px;
}
span.big-quote.left {
	margin:18px 5px -75px 0;
}
span.big-quote.right {
	margin-top:18px;
	margin:18px 0 -75px 5px;
	text-indent:0;
}
#content ul { margin-left:20px ; }
#content ul li {
	list-style-image: url("../img/raquo.png");
	margin-bottom:0.5em;
}
#content ul.red li {
	list-style-image: url("../img/raquo-red.png");
}

div.container {
	margin:0 auto;
	padding:0 28px;
	width:904px;
}

#footer {
	border-top:1px solid #f2f2f2;
	color:#666666;
	font-size:11px;
	margin:28px auto 20px auto;
	padding-top:10px;
	text-align:center;
}
#footer span.copyright { color:#b1b1b1; padding-right:4px; }
#footer span.address { padding-left:4px; }
#footer img { vertical-align:middle;}
#footer a.phone img {
	background-position:-251px -93px;
	height:16px;
	margin:0 4px;
	width:156px;
}
#footer a.tc-blog img {
	background-position:-136px -35px;
	height:16px;
	margin:0 10px 0 4px;
	width:67px;
}
#footer a.facebook img {
	background-position:-120px -35px;
	height:16px;
	width:16px;
}

div.orange-box.development { background-position:right -696px; }
div.orange-box.pr { background-position:right -496px; }
div.orange-box.spreading { background-position:right -297px; }
div.orange-box.portfolio,
div.orange-box.contact,
div.orange-box.development,
div.orange-box.pr,
div.orange-box.spreading {
	height:160px;
	padding:20px;
	width:920px;
}

div.orange-box.contact p.col1 strong.big { font-size:1.3em; font-weight:normal; }
div.orange-box.contact a {
	background:url(../img/map.png) no-repeat 0 0;
	padding-left:20px;
}
div.orange-box.portfolio p.col1 {
	font-size:1.1em;
	line-height:1.3em;
	width:350px;
	padding:20px 20px 20px 0;
}div.orange-box.contact p.col1 {
	font-size:1.1em;
	line-height:1.3em;
	width:350px;
	padding:20px 20px 20px 50px;
}
div.orange-box.pr p.col1 {
	background-position:right top;
	font-size:1.1em;
	line-height:1.3em;
	margin-right:24px;
	width:350px;
	padding:20px 100px 30px 0;
}
div.orange-box.spreading p.col1 {
	background-position:right top;
	font-size:1.1em;
	line-height:1.3em;
	margin-right:24px;
	width:250px;
	padding:20px 100px 30px 0;
}
div.orange-box.advertising {
	height:160px;
	padding:20px;
	width:920px;
}
h1.advertising { font-weight:normal; }
h1.advertising span.small { font-size:14px; font-weight:bold; }
div.orange-box.advertising p { float:left; margin-top:15px; }
div.orange-box.advertising p.col1,
div.orange-box.advertising p.col2,
div.orange-box.advertising p.col3 {
	background:url('../img/advertising.png') no-repeat;
}
div.orange-box.advertising p.col1 {
	background-position:right top;
	font-size:1.3em;
	line-height:1.3em;
	margin-right:24px;
	width:120px;
	padding:4px 100px 30px 0;
}
div.orange-box.advertising p.col2,
div.orange-box.advertising p.col3 {
	background-position:right -160px;
	font-size:1.1em;
	padding:4px 90px 30px 0;
	width:155px;
}
div.orange-box.advertising p.col4 {
	font-size:1.1em;
	width:186px;
	padding-top:4px;
}

div.container.portfolio,
div.container.contact,
div.container.development,
div.container.pr,
div.container.spreading,
div.container.advertising {
	margin:28px auto;
	padding:0 28px;
}
div.container.portfolio { margin-top:48px; }

body.advertising div.wide { margin-left:27px; }
body.contact div.wide,
body.development div.wide,
body.pr div.wide,
body.spreading div.wide { margin-right:27px; }
div.container div.wide,
div.container div.narrow { float:left; }
div.container div.wide { width:490px; }
div.container div.narrow { width:370px; }

div.container p {
	font-size:1.1em;
	line-height:1.3em;
	margin:0 0 1.5em;
}

ul.cols li {
	width:120px;
	float:left;
}

body.contact a.become-fan {
	background-position:-251px -160px;
	height:137px;
	width:369px;
}
body.contact a.tc-blog {
	display:block;
	font-size:1.4em;
	font-style:italic;
	margin-top:10px;
}
body.contact div.contact-form {
	background-position:-988px 0;
	padding-left:120px;
}
body.contact div.contact-form input[type=text],
body.contact div.contact-form textarea {
	border:1px solid #eeeeed;
	font-family:Helvetica, Arial, sans-serif;
	font-size:1.15em;
	margin-bottom:5px;
	width:255px;
	padding:5px 22px;
	border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}
body.contact div.contact-form input[type=text]:focus,
body.contact div.contact-form textarea:focus {
	border:1px solid #ddd;
}
body.contact div.contact-form input[type=text].error,
body.contact div.contact-form textarea.error {
	border:1px solid #ffccc0;
}
body.contact div.contact-form textarea { height:70px; }
body.contact div.contact-form input.submit {
	background-position:-969px -265px;
	height:32px;
	width:93px;
}

ul.portfolio-page li { float:left; width:272px; height:210px; list-style:none !important; }

#contact-sending {
	background: #ffffff;
	padding: 20px;
	position: absolute;
	text-align:center;
	width: 400px;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
}
#contact-sending p { padding:0.5em 0; }

#layer-bg {
	background: #000000;
	display:none;
	left: 0;
	position: absolute;
	top: 0;
}

#contact-messages { color:#ee3124; font-size:1.1em; display:none; padding-bottom:1em; }

.hide {
	display:none;
}

#press {
	margin-bottom:3em;
}

#press h3 span {
	color:#bbb;
	font-size:11px;
}

#latest-press p {
	font-size:12px;
}

#latest-press p.media-type {
	margin-bottom:.75em;
}

#latest-press .press-item {
	margin-bottom:1.5em;
}

#latest-press h4 {
	font-weight:700;
	margin-bottom:.5em;
}

#press-button {
	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;

	background:url(../img/button.png) repeat-x 0 0;
	color:#777;
	display:block;
	font-size:20px;
	font-weight:700;
	margin:0 auto 3em;
	padding:31px 9px;
	text-align:center;
	text-decoration:none;
	text-shadow:0 1px 1px #fff;
	text-transform:uppercase;
	width:202px;
}

#press-button:hover {
	color:#ee3124;
}

