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}:focus{outline:0}body{line-height:1;color:black;background:white}ol,ul{list-style:none}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:""""}a{text-decoration:none}


.cufon-loading { 
   visibility: hidden !important; 
}
.cufon-active { 
   visibility: visible !important; 
} 


body {font-family: Arial, "Helvetica Neue", Helvetica, sans-serif}

a {color:#888}
a:hover {color:#333}

strong {font-weight:bold}
em {font-style:italic}

#main {width:620px;position:relative;height:500px;left:370px;top:40px}


/* LOGO */
.logo {position:fixed;left:105px;top:39px;width:200px;height:21px}
#logo-cover a {text-indent:-9999em;display:block;width:200px;height:21px;cursor:pointer}
#logo-cover {z-index:3;background:url(/images/logo.png) no-repeat 0 0;}
#logo-image {z-index:2;display:none}


/* SLICE */
.slice {width:200px;height:484px;position:fixed;left:0;bottom:0}
#slice-cover {z-index:1;background:url(/images/slice.png) no-repeat 0 0}
#slice-image {z-index:0;display:none}


/* V */
#remove-cover, #cover {position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;z-index:9997}
#remove-cover {background:none;z-index:9996}
#inner {background:#fff;text-align:center;position:absolute;top:50%;left:0px;width:100%;height:1px;overflow:visible;visibility:visible;display:block}
#intro {visibility:visible;left:50%;top:-160px;margin-left:-180px;position:absolute;background:#fff;width:360px;height:319px;z-index:9999}
.v {width:360px;height:319px;position:absolute;top:0;left:0}
#v-cover {z-index:9998;background:url(/images/v.png) no-repeat 0 0}
#v-cover2 {z-index:9999;background:url(/images/v.png) no-repeat 0 0}
#v-image {z-index:9997;display:none}


/* NAV */
#nav {background:#fff;padding-top:40px;position:fixed;z-index:5;left:370px;top:0;width:600px;text-transform:uppercase;height:165px;border-bottom:1px dotted #ccc}
#nav li {line-height:11px}
#nav li.top {float:left;position:relative;display:inline;font-size:10px;width:135px;margin-right:20px}
#nav li.top.last {margin-right:0}
#nav li a.top {display:block;padding:8px 0 10px 0;border-top:1px solid #ccc}
#nav li.selected a.top, #nav li.top:hover, #nav li:hover a.top, #nav li a:hover {border-color:#333}
#nav li ul {display:none;padding:4px 0;border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;margin-bottom:20px}
#nav li ul li {font-size:9px}
#nav li ul li a {display:block;padding:4px 0;border:0}
#nav li a.top.selected, #nav li ul li a.selected {color:#333}


/* CONTENT */
#content {z-index:4;color:#333;position:absolute;top:205px;left:370px;padding-top:20px;width:600px;display:none;padding-bottom:80px}
#content h1 {margin-bottom:20px}
#content p {font-size:13px;line-height:22px;margin:0 0 11px;padding-right:30px}
#content a {color:#5886ad}
#content a.arrow {display:block;background:url(/images/blue-right-arrow.gif) no-repeat 0 8px;padding-left:10px}
#content a:hover {color:#333}


/* BREADCRUMB */
.breadcrumb {position:fixed;top:184px;left:370px;z-index:5;font-size:10px;text-transform:uppercase;color:#333}
.breadcrumb span {color:#aaa;margin:0 3px}


/* CONTACT */
.contact-address {position:absolute;top:55px;left:465px}
#content .contact-address p {padding-right:0}
.twitter span, .facebook span {color:#888}
.twitter {background:url(/images/twitter.gif) no-repeat 4px left;display:block;font-size:11px;padding-left:22px;line-height:14px}
.facebook {background:url(/images/facebook.gif) no-repeat 4px left;display:block;font-size:11px;margin-top:70px;margin-bottom:10px;padding-left:22px;line-height:14px}
a:hover.twitter, a:hover.facebook {background-position:left -68px}


/* HEADERS */
h1 {font-size:18px}
h2 {font-size:18px;color:#888;margin-bottom:15px}


/* HOME */
#home h2 {font-size:24px;line-height:34px;margin-bottom:15px}
#home h2 span a {color:#333}
#home h2 span a:hover {color:#5886ad}


/* CASE STUDIES */
a.case-logo {display:block;width:135px;height:135px;float:left;margin-right:17px;margin-top:20px;border:1px solid #ccc;text-indent:-9999em;background:yellow}
a.case-logo.rockstar {background:url(/images/case-logos/rockstar.gif) no-repeat top left}
a.case-logo.microsoft {background:url(/images/case-logos/microsoft.gif) no-repeat top left}
a.case-logo.petroglyph {background:url(/images/case-logos/petroglyph.gif) no-repeat top left}
a.case-logo.firaxis {background:url(/images/case-logos/firaxis.gif) no-repeat top left;margin-right:0}
a.case-logo.crowdstar {background:url(/images/case-logos/crowdstar.gif) no-repeat top left}
a.case-logo.realtime {background:url(/images/case-logos/realtime.gif) no-repeat top left}
a:hover.case-logo {border-color:#5886ad;background-position:bottom left}
.case-thumb a {display:block;float:left;width:288px;height:93px;border:1px solid #ccc;overflow:hidden;font-size:11px;line-height:16px;margin-right:20px;margin-top:20px}
.case-thumb a.no-margin {margin-right:0}
.case-thumb a img {float:left;width:134px;height:93px;margin-right:20px} 
.case-thumb a span {color:#333;display:block;padding-right:10px}
.case-thumb a .case-title {color:#333;margin-top:10px}
.case-thumb a:hover {border-color:#5886ad}
.case-thumb a .case-client {color:#888}
#case-study-logo {position:absolute;top:0;left:465px}
#case-study h1 {font-size:24px;margin-bottom:5px}
#case-study h2 {font-size:24px;margin-bottom:20px;color:#888}
#case-study {position:relative;width:600px}
#case-study .carousel li {width:600px;height:350px}
.case-image {margin-top:-20px}
.clear {clear:left}
p.quote {}


/* ARROWS */
#arrows {position:fixed;top:176px;left:922px;width:48px;z-index:5}
#arrows a.next {float:right;display:block;width:24px;height:27px;background:url(/images/next-arrow.gif) no-repeat}
#arrows a.prev {display:block;width:24px;height:27px;background:url(/images/prev-arrow.gif) no-repeat}
#arrows .prev.disabled, #arrows .next.disabled {background-position:0 -27px;cursor:default}


/* FORM */
#contact input, #contact textarea {color:#888;width:290px;margin-bottom:10px;display:block;border:1px solid #ccc;padding:5px}
#contact textarea {overflow:auto;height:100px}
#contact label {font-size:12px;line-height:18px;float:left;width:135px;display:inline;position:relative;padding-bottom:20px}
#contact .check {float:left;width:20px}
#contact .send {background:#fff;border:1px solid #5886ad;padding:4px 4px 5px 4px;color:#5886ad;width:63px;clear:left;margin-top:20px}
#contact .send:hover {background:#5886ad;color:#fff;cursor:pointer}
#contact .required-error {border-color:red;}
#contact .focus {color:#5886ad;border-color:#5886ad}
#contact-form p.error {display:none;color:red}
#contact-form p.success {display:none}


/* FOOTER */
#footer {position:fixed;z-index:5;bottom:0;left:370px;width:600px;padding:20px 0;background:#fff}
#footer p {font-size:9px;text-transform:uppercase}
#footer a.credit {position:absolute;right:0;top:19px;margin-top:3px;display:inline-block;width:10px;height:10px;background:url(/images/credit.gif) no-repeat;background-position:0 0}
#footer a.credit:hover {background:url(/images/credit.gif) no-repeat;background-position:0 -10px}
#footer p span {color:#888;padding:0 3px}


/* COPYRIGHT */
#copyright {position:absolute;top:18px;right:20px}
.copyright {font-size:14px}
.copyright-tip {display:none;color:#888;background:#fff;border:1px solid #ddd;position:absolute;top:-40px;right:0;width:320px;padding:10px;line-height:15px}