* { padding:0; margin:0; }
h1 { font-size:36px; }
h2 { font-size:25px; }
h3 { font-size:20px; }
h4, h5 { font-size:18px; }
input, textarea { font-size:inherit; font-family:inherit; padding:2px 3px; }
h1, h2, h3, h4, h5 { padding:0; line-height:1.1em; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; font-weight:normal; }
p { padding: 0 0 1em; }
ul, ol { padding: 0 0 1em 2em; }
img { border:none; }
input[type=button], input[type=submit] { cursor:pointer; height:23px; padding:0 2px 2px; vertical-align:top; }
:focus	{ outline:0; }

a { color:inherit; }
a:hover { color:#fff; }

body { background: url(art/bg-trans.png) repeat-x #fff; font: 15px/24px Arial, Helvetica, sans-serif; color: #fff; }

.left { float:left; }
.right { float:right; }
.clear { clear:both; }

ul.toc { list-style-type:none; }
ul.toc li { float:left; }
ul.toc li + li { margin:0 0 0 22px; }
ul.toc li a { font: 16px/16px "ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; text-transform: lowercase; color:#fff; text-decoration:none; }
ul.toc li a:hover { text-decoration:underline; }

.footer { clear:both; }

#container { width: 850px; margin:0 auto; background: url(art/flame.jpg) no-repeat left -2px; }

/* header */
.header { height:120px; }
.header .logo { float:left; clear:left; margin:25px 0 0; }
.header .top.toc { float:right; clear:right; padding:0; margin:50px 0 0; }

/* content */
.content { width: 805px; height:550px; padding:0 0 0 85px; }
.stripe { position:absolute; top: 200px; height:146px; color:#8e8e8e; width:767px; }
.stripe a:hover { color:#666; }
.below-stripe { position:absolute; top:346px; width:767px; padding:35px 0 0; }

.page-title { font-size:36px; float:left; padding:50px 0 0; }
.page-intro { font-size:30px; float:right; clear:none; padding:30px 0 0; width:400px; }
.page-intro.small { font-size:18px; line-height:24px; padding:20px 0 0; }
.page-intro.list { font-size:18px; line-height:30px; padding:25px 0 0; }
.page-intro.list ul { float:left; padding:0 10px 0 15px; }
.page-intro.list ul + ul { float:right; padding:0 0 0 15px; }

/* home page */
#front-flash { float:right; position:relative; } /* position fixes a bug in safari */
h1.promo { float:left; width:240px; position:absolute; top:250px; }
h1.promo #promo-header { display:block; margin:0 0 30px; color:#444; }

#current-promo { position:absolute; width:400px; height:420px; top: 160px; margin:0 0 0 368px; }
#current-promo img { position:absolute; }
#current-promo .text { width:330px; margin:0 0 0 30px; position:relative; top:375px; }
#current-promo .title { width:330px; position:absolute; margin:-20px 0 0 30px; font-size:30px; }

img#seo { margin:42px 0 0 17px; }
.about-text { padding:40px 30px 20px; }
.about-text + .about-text { padding:0 30px 20px; }

/* case-studies */
.cs-viewer { width: 800px; float:left; }
.cs-viewer .cs-back { display:block; clear:both; text-align:right; padding:0 35px 10px 0; text-decoration:none; }
.cs-viewer .frame { float:left; background:url(art/case-studies/cs-frame.png) no-repeat; width:715px; height:339px; padding:8px; margin:0 34px; clear:none; }
.cs-viewer #scroll-left, .cs-viewer #scroll-right { background:url(art/case-studies/arrow-sliders.png) repeat-x; width:22px; height:32px; margin:270px 0 0; position:absolute; cursor:pointer; }
.cs-viewer #scroll-right { margin:270px 0 0 775px; }

.cs-viewer .cs-mask { width:715px; overflow:hidden; height:339px; position:relative; }

#gallery-area { height:339px; background:#000; position:relative; }
#gallery-area .cs-gallery { height:339px; width:715px; float:left; }

#cs-details { padding:25px 0 0; clear:both; }
#cs-details .cs-summary { float:left; width:310px; margin:0 0 0 30px; }
#cs-details #cs-title { font-size:26px; margin:0 0 0 10px; }
#cs-details #cs-link { margin:0 0 0 10px; position:relative; } /* position fixes a bug in safari */
#cs-details #cs-screenshots { list-style-type:none; padding:0; position:relative; } /* position fixes a bug in safari */
#cs-details #cs-screenshots li { float:left; margin:55px 5px 0 0; }
#cs-details #cs-screenshots li img { cursor:pointer; }
#cs-details #cs-text { float:right; width:380px; margin:0 50px 0 0; position:relative; } /* position fixes a bug in safari */
#cs-details #cs-text ul { float:left; width:160px; }

#cs-data { display:none; }

/* screen shots */
.overlay { background:#000; position:fixed; z-index:100; top:0; left:0; cursor:pointer; }
#cs-large-sshot { position:absolute; z-index:101; padding:5px; border:1px solid #000; top:0; left:0; cursor:pointer; }
#cs-large-sshot img { display:block; cursor:pointer; }

/* services */
.below-stripe.services { margin:0 0 0 -39px; width:845px; }
.service-arrow-left, .service-arrow-right { width:22px; height:32px; background:url(art/service-arrows.png); cursor:pointer; }
.service-arrow-left { float:left; margin:80px 17px 0 0; }
.service-arrow-right { float:right; background-position:-22px 0; margin:80px 0 0 17px; }
.service-arrow-left:hover { background-position:0 -32px; }
.service-arrow-right:hover { background-position:-22px -32px; }
.service-previews { width:767px; overflow:hidden; float:left; margin:35px 0 0; position:relative; }
.service-previews ul { list-style:none; padding:0; width:2000px; position:relative; }
.service-previews li { float:left; width:249px; padding:0 10px 0 0; font-size:14px; line-height:22px; }
.service-previews h3 { padding:0 0 1em; font-size:18px; font-weight:bold; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; }
.service-previews .learn-more { font-weight:bold; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; }
.service-previews .learn-more:before { content:"> "; text-decoration:none; }

.service-screenshots { list-style:none; padding:0; width:216px; float:left; }
.service-screenshots li { float:left; padding:0 5px 5px 0; }
.service-screenshots li img { display:block; }
.service-text { float:right; width:400px; }

.service-get-started { float:left; clear:left; padding:20px 0 0; }

.stripe.service { width:890px; margin:0 0 0 -85px; }
.stripe.service .page-title { width:368px; }
.stripe.service .page-intro { float:left; }

.service-stripe-left, .service-stripe-right { width:22px; height:32px; background:url(art/service-arrows-grey.png) no-repeat; display:block; }
.service-stripe-left { float:left; margin:55px 38px 0 25px; }
.service-stripe-right { float:right; margin:55px 0 0; background-position:-22px 0; clear:right; }
.service-stripe-left:hover { background-position:0 -32px; }
.service-stripe-right:hover { background-position:-22px -32px; }
.service-stripe-left span, .service-stripe-right span { display:none; }

/* company */
.stripe.company .page-intro { padding:20px 0 0; }
.stripe.company .page-intro p { padding:0; margin:0; font-size:18px; }
.company-text { float:right; width:400px; }
.company-text h1 { font-size:24px; line-height:36px; margin:0 0 30px; }
.company-text h2 { text-decoration:underline; font-size:18px; margin:0 0 5px; }
.company-toc { float:left; list-style:none; padding:0; font-size:18px; line-height:36px; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; }
.company-toc .sub-toc { list-style:disc; padding:0 0 0 30px; font:15px/24px Arial, Helvetica, sans-serif; }

.news h1.page-title { padding:25px 0 0;  }
ol.recent-launches { list-style:none; padding:0; width:400px; float:right; }
ol.recent-launches li { float:left; clear:both; padding:0 0 20px; width:400px; }
ol.recent-launches .text { float:right; width:345px; }
ol.recent-launches .title { display:block; text-decoration:underline; }
ol.recent-launches .summary { font-style:italic; padding:0; font-size:14px; line-height:16px; }
.news-side { float:left; width:300px; }
.looking-for-more { float:left; clear:left; margin:50px 0 0; }

.team dt { float:left; clear:left; margin:0 0 10px; }
.team dt img { border:1px solid #aaa; }
.team dd { float:right; clear:right; margin:0 70px 0 0; width:220px; }
.team dd .title { display:block; }
.team dd h2 { text-decoration:none; }

.stripe.bio { top: 150px; height:227px; }
.bio .bio-info { float:left; padding:80px 0 0 193px; }
.bio .title { font:18px/24px Arial, Helvetica, sans-serif; }
.bio .bio-pic { border:1px solid #aaa; float:left; }
.bio .company-toc { padding:30px 0 0 0; }


.news .date { background:url(art/date-bg.png) no-repeat; margin:3px 0 0; float:left; width:41px; height:48px; text-align:center; padding:0 7px 0 0; font-weight:bold; color:#fff; }
.news .day { display:block; height:18px; font-size:24px; padding:1px 0 1px; line-height:22px; overflow:visible; color:#666; }

/* contact */
.panel { width:398px; float:right; margin:0 35px 0 0; position:relative; } /* position fixes a bug in safari */
.contact-form.panel .top { background:url(art/grey-panel.png); height:39px; width:398px; }
.contact-form.panel .bottom { background:url(art/grey-panel.png) 0 -39px; height:50px; width:398px; }
.contact-form.panel .body { background:url(art/grey-panel.png) repeat-y -398px 0; padding:0 28px 1px 20px; }
.form input[type=text], .form textarea, .form select { width:350px; }
.form .status.error, .form .status.notice, .form .status.success { line-height:1em; margin:10px 0 5px; }
.form .status p { padding:0 0 8px; }
.form .status + dd { text-align:right; }
.contact-address { font-size:18px; line-height:24px; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; padding:30px 0 0; float:left; width:340px; }
.social-networking { list-style:none; padding:0; }
.social-networking li { float:left; }
.social-networking li + li { margin:0 0 0 8px; }
.social-networking li a { display:block; height:0px; padding:37px 0 0; overflow:hidden; width:37px; background-position:bottom left; }
.social-networking li a:hover { background-position:top left; }
.social-networking li.facebook a { background-image:url(art/icon-facebook.png); }
.social-networking li.twitter a { background-image:url(art/icon-twitter.png); }
.social-networking li.linked-in a { background-image:url(art/icon-linkedin.png); }
.social-networking li.stumble-upon a { background-image:url(art/icon-stumble.png); }

/* creative reel */
.cr-viewer { background:url(art/cr-frame.png) no-repeat; padding:8px; width:715px; height:402px; margin:0 0 20px 35px; }
#creative-reel-container { background:#e0e2e4; width:715px; height:402px; overflow:hidden; }
.cr-details { padding:0 0 30px 35px; width:730px; float:left; }
.cr-details .left { width: 300px; position:relative; font-size:20px; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; }
.cr-details .right h1 { padding:0 0 15px; font-size:26px; }
.cr-details .right { width: 395px; position:relative; }

/* portfolio */
#portfolio-flash { float:right; }
.below-stripe .portfolio-text { width:400px; float:right; }
.portfolio-text h2 { font-size:36px; padding:0 0 1em; }
.portfolio-links { float:left; }
.portfolio-links ul { list-style:none; padding:0; }
.portfolio-links ul li { padding:0 0 10px; font-size:20px; line-height:1.1em; font-family:"ITC Avant Garde", "Avant Garde", "Century Gothic", Arial, Helvetica, sans-serif; text-align:center; }

/* forms */
.status.success, .status.error, .status.notice { padding: 5px; border: 1px solid; }
.status.success { color:#026f05; background-color:#c1ecc3; }
.status.error { color:#6f0202; background-color:#f7c3c3; }
.status.notice { color:#824600; background-color:#ffe6a1; }

input[type=text], textarea { background:url(art/input-bg.png) repeat-x #fff; border:1px solid #888; }
input[type=text]:focus, textarea:focus { border-color:#000; }

/* four oh four */
.stripe.four-oh-four .page-intro { font-size:20px; }
.stripe.four-oh-four .page-intro a:hover { color:#000; }