body {font-family: Arial, Verdana; color: #808080; font-size: 11px; font-style: normal; line-height: 14px;
	background-color:#FFF;
	background-size: cover;
	moz-background-size: cover;
	background-attachment: fixed;
}

a {color: #808080; text-decoration: none; font-style: normal;}
.icon {display: inline-block; height: 18px; padding-left: 18px;}
.icon.big {display: inline-block; height: 24px; padding-left: 40px; padding: 2px 0px 2px 32px; font-family: 'Alternate-Gothic'; font-size: 24px; line-height: 24px;}
.icon.fb {background:url(../images/icon-fb.png) no-repeat;}
.icon.tw {background:url(../images/icon-tw.png) no-repeat;}
.icon.vi {background:url(../images/icon-vi.png) no-repeat;}
.icon.li {background:url(../images/icon-li.png) no-repeat;}
.icon.tb {background:url(../images/icon-tb.png) no-repeat;}
.icon.fb.rounded {background:url(../images/icon-fb-rounded.png) no-repeat;}
.icon.tw.rounded {background:url(../images/icon-tw-rounded.png) no-repeat;}
.icon.vi.rounded {background:url(../images/icon-vi-rounded.png) no-repeat;}
.icon.tb.rounded {background:url(../images/icon-tb-rounded.png) no-repeat;}
.icon.fb.light {background:url(../images/icon-fb-light.png) no-repeat;}
.icon.tw.light {background:url(../images/icon-tw-light.png) no-repeat;}
.icon.vi.light {background:url(../images/icon-vi-light.png) no-repeat;}
.icon.tb.light {background:url(../images/icon-tb-light.png) no-repeat;}
.icon.fb.big {background:url(../images/icon-fb-big.png) no-repeat;}
.icon.tw.big {background:url(../images/icon-tw-big.png) no-repeat;}
.icon.vi.big {background:url(../images/icon-vi-big.png) no-repeat;}
.icon.tb.big {background:url(../images/icon-tb-big.png) no-repeat;}

.clear {width: 952px; height: 40px; clear: both; }

a.arrow {display: inline-block; height: 30px;}
a.arrow span {font-family: 'Gotham-Black'; font-size: 9px; color: #808080; height: 10px; padding: 10px; float: left;  line-height: 10px;}
a.arrow span.arrow {display: inline-block; padding: 9px; background:url(../images/arrow-right.png) no-repeat 50% 50%; width: 12px; height: 12px; float: right;}
a.arrow.gray {background: #F2F2F2;}

a.arrow.top {width: 30px;}
a.arrow.top span.arrow {background-image: url(../images/arrow-top.png);}
a.arrow.left span.arrow {background-image: url(../images/arrow-left.png); float: left;}

#backtotop {position: fixed; right: 10px; bottom: 50px; background: #000; color: #FFF; width: 30px; height: 50px; display: none;}
#backtotop span {padding: 5px 0px; text-align: center; color: #FFF;}
#backtotop span.arrow {background-color: #F2F2F2; padding: 9px;}
#backtotop span.text {width: 30px;}

h2 {font-family: 'Alternate-Gothic'; font-size: 56px; line-height: 56px; margin-bottom: 10px; font-weight: normal; font-style: normal; color: #4F4F4F;}
h3 {font-family: 'Gotham-XLight'; font-size: 32px; font-style: normal; line-height: 32px; margin-bottom: 10px; font-weight: normal;}
h4 {font-family: 'Gotham'; font-size: 9px; line-height: 18px; font-weight: normal; font-style: normal; margin-bottom: 5px;}
h4 span.icon {float: left; margin-right: 5px;}

h3#tw-user {font-size: 24px;}

#wrapper {padding: 23px 36px; width: 952px; margin: 0px auto;}

#wrapper > header > nav {font-family: 'Gotham'; font-size: 10px; line-height: 18px; float: right; margin: 8px 0px 0px; height: 18px;}
#wrapper > header > nav a.text {display: inline-block; line-height: 10px; height: 10px; float: left; padding: 4px 0px; margin-left: 20px; color: #4D4D4D;}
#wrapper > header > nav .language {float: right; padding-left: 20px;}
#wrapper > header > nav a.text.language {float: none; margin: 0px 5px; color: #808080;}
#wrapper > header > nav a.text.language.active {color: #4D4D4D;}
#wrapper > header > nav a.fb {margin-left: 25px;}
#wrapper > header > nav a.tw {margin-left: 10px;}

#wrapper > header > article {margin-top: 20px; position: relative; padding-bottom: 25px; border-bottom: 1px solid #CCCCCC;}
	#header-video-holder {width: 952px; height: 540px; overflow: hidden; position: relative;}
	#header-video {width: 952px; height: 540px; overflow: hidden; position: absolute; z-index: 0; left: 0px; top: 0px;}
	#header-image {width: 952px; height: 540px; overflow: hidden; position: absolute; z-index: 10; left: 0px; top: 0px; cursor: pointer;}
	#header-image nav {text-align: center; height: 30px; position: absolute; bottom: 0px; left: 0px; width: 952px;}
	#wrapper > header > article p {margin: 25px 0px 0px;}

	a.play-video span {padding:10px 20px; background: #000;}
	a.play-video span.arrow {background-color: #FFF;}
	a.play-video:hover span {color: #FFF;}

#wrapper > section {padding-top: 50px; }
#wrapper > section {border-bottom: 1px solid #CCC;}
#wrapper > section hgroup {float: left; width: 224px;}
#wrapper > section hgroup hr {background: none; border: none; border-bottom: 1px solid #CCC; margin: 20px 0px 15px;}
#wrapper > section article {float: right; width: 708px;}

#contact hgroup a {padding-left: 14px; background:url(../images/icon-mail.png) no-repeat 0px 50%; font-style: italic;}
#contact hgroup a.arrow {background: #F2F2F2; padding: 0px; font-style: normal;}

#works h2 {margin-bottom: 10px;}
#works .work-item h2 {font-size: 31px;}

#work-thumb-list { height: 492px; padding-bottom: 30px; }
#work-cycle { height: 464px; overflow: hidden;}
#work-thumb-list .page {height: 464px; width: 952px;}
.work-thumb-item {width: 221px; float: left; margin-left: 21px; height: 228px; overflow: hidden;}
.work-thumb-item:first-child {margin-left: 0px;}
.work-thumb-holder {height: 150px; position: relative; margin-bottom: 7px; width: 221px; display: inline-block;}
.work-thumb-holder .title {display: inline-block; height: 30px; position: absolute; bottom: 0px; left: 0px; font-family: 'Gotham-Black'; font-size: 9px; color: #808080; background: #FFF;}
.work-thumb-holder .title span.arrow {display: inline-block; padding: 9px; background:url(../images/arrow-right.png) no-repeat 50% 50%; width: 12px; height: 12px; float: right;}
.work-thumb-holder .title span.text {display: inline-block; height: 10px; padding: 10px; line-height: 10px; text-transform: uppercase;}
.work-thumb-item .new-work {background: #000; color: #FFF; font-family: 'Gotham-Black'; position: absolute; left: 0px; top:0px; display: inline-block; padding: 5px 5px; font-size: 9px;}

#work-thumb-list nav {height: 30px;}
#cycle-prev {float: left;}
#cycle-next {float: right;}
#work-thumb-list nav .anchors {text-align: center; padding-top: 11px;}
#work-thumb-list nav .anchors a {display: inline-block; height: 12px; width: 12px; overflow: hidden; background:url(../images/bullet.png) no-repeat; margin: 0px 1px;}
#work-thumb-list nav .anchors a.activeSlide{background-position: 0px -12px;}

#work-full-list {border-top: 1px solid #CCC; overflow: auto; position: relative;}
#work-full-list-holder { overflow: auto; position: relative; z-index: 1;}
#work-full-list .work-item {border-top:1px solid #CCC; position: relative; min-height: 492px;}
#work-full-list .work-item:first-child {border: none;}
#work-full-list .work-item .anchor-link {padding: 0px 0px 30px; display: inline-block; height: 10px; width: 100%;}
#work-full-list .work-item .work-item-holder {padding-top: 30px;}
#work-full-list .work-item .work-item-holder:first-child {padding: 0px;}
#wrapper > section #work-full-list .description {width: 214px; position: absolute; left: 0px;  float: none;}
#wrapper > section #work-full-list article {margin-left: 224px;}

.social-share {font-family: 'Gotham-Book'; font-size: 10px; text-align: right; height: 18px; font-style: normal;}
.social-share span {display: inline-block; height: 10px; line-height: 10px; padding: 4px 10px; float: right;}
.social-share a {float: right; margin-left: 5px;}

#backtoworks {position: absolute; left: 0px; bottom: 30px; background: #FFF; color: #FFF; height: 30px; z-index: 10000;}
#backtoworks.arrow.left span.arrow {background: url(/html/images/arrow-top.png) no-repeat #F2F2F2 50% 50%; padding: 9px;}


#wrapper section#social-2 {padding-top: 25px; padding-bottom: 50px;}
#wrapper section#social-2 h2 {font-size: 40px; line-height: 40px;}
#wrapper section#social-2 h2 > span {display: inline:block; height: 28px; padding: 6px; float: right;}
#wrapper section#social-2 h2 a {margin-left: 90px;}
#wrapper section#social-2 h2 a, #wrapper section#social-2 h2 a span {vertical-align: top;}


#wrapper section#about article {margin: 0px; float: none; width: 100%;}
#wrapper section#about article .left-c {float: left; width: 467px;}
#wrapper section#about article .right-c {float: right; width: 467px;}
#wrapper section#about article p {line-height: 15px; margin: 0px 0px 15px 0px;}

#wrapper section#about #about-logos {clear: both; padding-top: 40px;}
#wrapper section#about #about-logos .row {height: 92px; padding-bottom: 20px;}
#wrapper section#about #about-logos img {width: 99px; height: 90px; float: left;}
#wrapper section#about #about-logos a {margin-left: 20px; display: inline-block; width: 99px; height: 90px; border: 1px solid #E6E6E6;float: left; }
#wrapper section#about #about-logos a:first-child {margin-left: 0px;}


#wrapper section#cases .cycle article {height: 390px; float: none; width: 100%;}
#wrapper section#cases .cycle article aside {width: 214px; float: left;}
#wrapper section#cases .cycle article .caso {width: 99px; height: 90px; border: 1px solid #E6E6E6; margin-left: 55px; margin-top: 10px;}
#wrapper section#cases .cycle article .thumb {width: 214px;}

#wrapper section#cases .cycle article .content {width: 708px; float:right;}
#wrapper section#cases .cycle article .content p {line-height: 15px; margin-bottom: 15px;}
#wrapper section#cases nav {height: 122px; padding: 14px 0px 48px;}
#wrapper section#cases nav a {display: inline-block; float: left; width: 99px; height: 120px; border: 1px solid #CCC; margin-left: 20px; }
#wrapper section#cases nav a:first-child {margin-left: 0px;}
#wrapper section#cases nav a img {width: 99px; height: 90px; float: left;}

#wrapper section#cases h2.subtitle {font-size: 32px; margin-bottom: 0px; }

#social h2 {margin-bottom: 40px;}
#network-list {clear:both;}
.network-item {width: 222px; overflow: hidden; float: left; margin-left: 20px;}
.network-item:first-child {margin-left: 0px;}
.network-item .arrow span.text {padding-left: 0px;}
.network-item h4 {text-transform: uppercase;}

#map_canvas {height: 450px; width: 708px;}

footer {background: #F0F0F0; padding: 10px; /*height: 110px;*/}
footer nav, footer nav a, footer nav a.arrow span {font-family: 'Gotham'; font-size: 9px; font-style: normal;}
footer nav a.arrow {height: 18px;}
footer nav a.arrow span.text {padding: 4px 0px;}
footer nav a.arrow span.arrow {padding: 3px 10px;}

footer .credits {float: left; padding-top: 2px;}
footer .social-icons {height: 18px; float: right;}
footer .centered {text-align: center; padding-top: 2px;}
footer .centered a {margin: 0px 17px;}
footer .contact-info {clear: both; padding-top: 15px; font-size: 11px;}


.field-group {clear: both; height: 56px;}
.field-group p {float: left; margin-left: 20px;}
.field-group p:first-child {margin-left: 0px;}
.field-group input {color: #808080; font-family: Arial, Verdana;  padding: 2px 5px; border: none; background: #EFEFEF; line-height: 24px; height: 24px;}
.field-group select {color: #808080; font-family: Arial, Verdana;  padding: 2px 5px; border: none; background: #EFEFEF; line-height: 24px; height: 24px; width:222px}
.field-group p.c2 {width: 343px;}
.field-group p.c3 {width: 222px;}
.field-group p.c2 input {width: 333px;}
.field-group p.c3 input {width: 212px;}
.field-group .message {display: inline-block; height: 30px; line-height: 30px; padding-left: 20px; vertical-align: top;}

/*JScrollPane CSS*/
.jspContainer {
    overflow: hidden;
    position: relative;
}
.jspPane {
    position: absolute;
}
.jspVerticalBar {

    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 6px;

}
.jspHorizontalBar {

    bottom: 0;
    height: 16px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 1000;
}
.jspVerticalBar *, .jspHorizontalBar * {
    margin: 0;
    padding: 0;
}
.jspCap {
    display: none;
}
.jspHorizontalBar .jspCap {
    float: left;
}
.jspTrack {
    background: none repeat scroll 0 0 #CCC;
    -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
    position: relative;
}
.jspDrag {
    background: none repeat scroll 0 0 #232323;
    cursor: pointer;
    left: 0;
    position: relative;
    top: 0;
    -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag {
    float: left;
    height: 100%;
}
.jspArrow {
    background: none repeat scroll 0 0 #50506D;
    cursor: pointer;
    display: block;
    text-indent: -20000px;
}
.jspArrow.jspDisabled {
    background: none repeat scroll 0 0 #80808D;
    cursor: default;
}
.jspVerticalBar .jspArrow {
    height: 16px;
}
.jspHorizontalBar .jspArrow {
    float: left;
    height: 100%;
    width: 16px;
}
.jspVerticalBar .jspArrow:focus {
    outline: medium none;
}
.jspCorner {
    background: none repeat scroll 0 0 #EEEEF4;
    float: left;
    height: 100%;
}
* html .jspCorner {
    margin: 0 -3px 0 0;
}