@font-face {
	font-family: 'ClarendonBTRoman';
	src: url('clarendon_bt_roman-webfont.eot');
	src: local('☺'), url('clarendon_bt_roman-webfont.woff') format('woff'), url('clarendon_bt_roman-webfont.ttf') format('truetype'), url('clarendon_bt_roman-webfont.svg#webfontuB12xjNj') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* reset */
html,body,div,span,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
abbr,address,cite,code,
del,dfn,em,img,ins,kbd,q,samp,
small,strong,sub,sup,var,
b,i,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
body{line-height:1;}
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary{display:block;}
nav ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,
q:before,q:after{content:'';content:none;}
a{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent;outline:none;}
ins{background-color:#ff9;color:#000;text-decoration:none;}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}
del{text-decoration:line-through;}
abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help;}
table{border-collapse:collapse;border-spacing:0;}
hr{display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}
input,select{vertical-align:middle; padding:0;}
li {list-style: none;}

/* uteis */
.bt {text-indent: -9999em;}
.bt a, header h1 a, .twitter .mais a, .intro section li a {display: block; height: 100%;}
body, a {color:#666;}
input, textarea, select {border:0;}
a:hover {text-decoration:none;}

::-moz-selection {background:#ee3740; color:#fff;}
::selection {background:#ee3740; color:#fff;}


/* estrutura */
body {width:100%; height:1090px;}
body, input, textarea, select {font: 14px 'Calibri', Helvetica, Arial, sans-serif;}

header h1, footer, .twitter .mais, .intro section li, .contact .fechar {background:url(../img/sprites.jpg) no-repeat; text-indent:-9999em;}

header, .first {background:#fff; float: left; display:inline; width: 390px;}
header {width:100px; height:1090px;}
#stickers header {width:120px;}
header h1 {width:100px;height:115px; background-position: 20px 22px;}

footer {background-position: 0 -110px; width:30px; height: 310px; float: left; display: inline; margin-top:740px;}

/* home */

.intro {padding: 37px 10px 45px 0;}
.intro h1, .intro h2, .wtf h1, .twitter h1, .link-contact, .link-twitter, .contact h1, .contact .button,
.stickers h1, .stickers h2, .stickers figcaption, .stickers .voltar, .hungry h3, .hungry h4, .stickers li h3  {font: 88px 'ClarendonBTRoman', Georgia, 'Times New Roman', serif; text-transform:uppercase;}
.intro h1, .intro h1 a, .intro h2, .wtf h1, .twitter h1 {color:#ee3740; line-height:70px; text-decoration:none;}
.intro p {padding: 35px 0 25px; line-height:20px; height:180px; float: left; display:inline; width:305px;}
.intro h2 {font-size: 18px; line-height: 18px;}
.intro h1 {letter-spacing:-0.03em;}
.intro h1 span {font-size:96px;}

.intro p.lang {text-align:right; float:right; width: 20px; padding:40px 20px 0 0;}
.intro p.lang a {color:#ee3740; font-weight:bold;}

.intro ul {padding: 5px 0 30px; overflow:auto;}
.intro li {float: left; display:inline; width: 52px; height: 52px; margin: 3px 6px 3px 0px;}

.intro section {clear:both;}

.clients li {width: 112px; height:112px;}

.intro section li { background-position: -60px -117px;}
.intro section li.bt-vimeo { background-position: -119px -117px;}
.intro section li.bt-tumblr { background-position: -179px -117px;}
.intro section li.bt-foursquare { background-position: -60px -178px;}
.intro section li.bt-flickr { background-position: -119px -178px;}
.intro section li.bt-facebook { background-position: -179px -178px;}

.intro section li.bt-twitter:hover { background-position: -251px -117px;}
.intro section li.bt-vimeo:hover { background-position: -310px -117px;}
.intro section li.bt-tumblr:hover { background-position: -370px -117px;}
.intro section li.bt-foursquare:hover { background-position: -251px -178px;}
.intro section li.bt-flickr:hover { background-position: -310px -178px;}
.intro section li.bt-facebook:hover { background-position: -370px -178px;}

.intro .clients ul {padding-top: 10px;}
.intro .clients li {background-position: -70px -236px; border: 1px dotted #cecece; border-left:0; border-top:0; margin:0;}
.intro .clients li.cli-veet {background-position: -190px -236px;}
.intro .clients li.cli-votorantim {background-position: -310px -236px; border-right:0;}
.intro .clients li.cli-ibm {background-position: -70px -357px;}
.intro .clients li.cli-novaschin {background-position: -190px -357px;}
.intro .clients li.cli-drscholls {background-position: -310px -357px; border-right:0;}
.intro .clients li.cli-sbp {background-position: -70px -477px; border-bottom:0;}
.intro .clients li.cli-dulux {background-position: -190px -477px; border-bottom:0;}
.intro .clients li.cli-ibmr {background-position: -310px -477px; border-bottom:0; border-right:0;}

body, .link-contact, .wtf h1, .link-twitter {background:#ee3740;}
.link-contact, .link-contact a, .wtf h1, .wtf h1 a, .link-twitter a {color:#fff;}
.link-contact a, .link-twitter a {display:block; text-decoration:none; padding: 0 15px;}
.intro .link-contact, .link-twitter {font-size:17px; font-weight: normal; height:65px; line-height:65px; position:absolute; top:1090px; width:390px;  text-align:center; padding:0;}

.wtf {float: left; display:inline; width:245px; position:relative;}
.wtf ul {z-index:1;}
.wtf h1 {position:absolute; font-size:30px; top:500px; left:150px; z-index:999; line-height: 30px; padding: 7px 10px; display:none;}
.wtf li, .wtf li a {width: 245px; height:485px;}
.wtf .scrollable {height: 1090px; overflow:hidden;}
.wtf li { position:relative;}
.wtf li .capa {position:absolute; z-index:99; top:0; left:0; display:none;}
.wtf li:hover .capa, .wtf li.hover .capa {display:block;}
.wtf li:hover .sticker, .wtf li.hover .sticker {width:171px; height:338px; margin:40px 0 0 42px;}

.twitter {float: left; display:inline; width: 190px; background:#fff; padding: 25px; height: 1040px; position:relative; z-index:0;}
.twitter h1 {border-bottom: 1px dotted #c5c5c5; font-size:16px; line-height:50px;}
.twitter h1, .twitter h1 a {text-decoration:none; color:#ee3740;}
.twitter li {padding: 20px 0; border-bottom: 1px dotted #c5c5c5; width:185; overflow:hidden;}
.link-twitter {left:-1px; width:245px;}

.twitter .mais {width: 185px; height: 20px; background-position:-100px 0; position: absolute; top: 1050px;}

/* contato */
.contact {position: absolute; width: 390px; height: 0; top: 1090px; z-index:99; background:#ee3740 url(../img/bg-form.gif); color: #fff; text-align:left; display:none;}
.contact form {padding: 15px; background:#ee3740;}
.contact h1 {font-size: 24px; font-weight:normal;}
.contact .fechar { width:9px; height:9px; background-position: -92px -46px; padding:0; position:absolute; top:15px; right:15px; overflow:hidden;}
.contact p {padding: 20px 0;;}
.contact label, .contact input, .contact textarea {float:left; display:inline;}
.contact label {width:50px;}
.contact input {width:304px;}
.contact #email {width:150px;}
.contact #ddd {width:30px; margin-right: 5px;}
.contact #tel {width:84px;}
.contact #mensagem {width:279px;}
.contact .lbl-tel {width:30px; padding-left:5px;}
.contact .lbl-msg {width:75px;}
.contact .button {background:#ee3740; color:#fff; font-size:13px; width: 70px; position: absolute; bottom:0; right:2px; padding-bottom:5px;}
.contact fieldset {position:relative; border-bottom: 0px dotted #fff; padding-bottom:10px;}
.contact fieldset div {clear:both; padding: 2px 0; overflow:auto;}
.contact label.error, .contact label.success {clear:both; background:#fff; color:#ee3740; width:auto; padding: 0px 5px;}
.contact label.success {background:#060; color:#fff; width: 314px; margin-bottom:10px;}

/* address */
.address, .address h2 {line-height: 1.5em;}
.vcard .fn {display:none;}

/* stickers */
#stickers footer {display:none;}
.stickers hgroup, .stickers .voltar {position: absolute; left: 115px; top:0;}
.stickers h1, .stickers h2, .stickers {color:#fff;}
.stickers h1 {font-size:89px; padding-top:15px;}
.stickers h1 span {font-size:25px; position: absolute; top:35px; left:480px;}
.stickers h2 {font-size:35px; line-height:35px; margin: -20px 0 35px; font-weight:normal;}
.stickers ul {width: 2000px; padding: 190px 20px 10px;}
.stickers li {float: left; display: inline; position:relative; padding: 120px 0 0;}
.stickers li figure, .stickers li img, .stickers li .capa {width: 165px; height: 314px; }
.stickers li .capa {display:block; position:absolute;}
.stickers figcaption {text-align:center; font-size:13px; display:none;}
.stickers li div {display:none; position:absolute; width: 185px; top:-5px; left: 270px;}
.stickers li.pos div {left: -180px; text-align:right;}
.stickers li h3 {font-size:13px; padding-bottom:2px;}

.stickers .scrollable {width: 900px; position:absolute; left: 120px; top:0;}


.stickers li.on {padding:0 20px;}
.stickers li.on figure, .stickers li.on img, .stickers li.on .capa {width: 236px; height: 449px; }
.stickers li.on figure {height:469px;}
.stickers li.on div, .stickers li.on figcaption {display:block;}


.stickers .voltar {top: 680px;}
.stickers .voltar, .stickers .voltar a {text-decoration:none; color:#fff; font-size: 25px;}

.hungry {width: 120px; position:absolute; top:260px; left:0;}
.hungry h3, .hungry h4 {font-size:20px; color:#ee3740;}
.hungry h3 {padding: 0px 5px 5px;line-height:23px;}
.hungry h3 span {font-size: 25px;}
.hungry li {padding-bottom: 10px;}
.hungry li p {padding: 5px; font-size:12px;}


/* jcarousel */
.jcarousel-skin-tango .jcarousel-next-vertical, 
.jcarousel-skin-tango .jcarousel-prev-vertical {background:#ee3740 url(../img/setas.png) no-repeat;}

.jcarousel-skin-tango .jcarousel-container-vertical {overflow:hidden;}
.jcarousel-skin-tango .jcarousel-container-vertical, .jcarousel-skin-tango .jcarousel-clip-vertical{width:245px;height:1090px;}
.jcarousel-skin-tango .jcarousel-item{width:245px;height:485px;}

.jcarousel-skin-tango .jcarousel-next-vertical,
.jcarousel-skin-tango .jcarousel-prev-vertical {position:absolute;left:101px;width:42px;height:42px;cursor:pointer; background-position:-43px 0px;z-index:999; opacity:1}
.jcarousel-skin-tango .jcarousel-next-vertical{bottom:0px;}
.jcarousel-skin-tango .jcarousel-prev-vertical{top:0px;background-position:0px 0px;}
.jcarousel-skin-tango .jcarousel-next-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-vertical:active,
.jcarousel-skin-tango .jcarousel-prev-vertical:active  {opacity:1;}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {opacity:0; cursor:none;}
