body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

body {
    font-family: helvetica, arial, sans-serif;
    color: #fff;
    font-size: 14px;
}

.clear {
    clear:both;
    height:0;
    overflow:hidden;
    line-height:0;
    font-size:0;
}

/** Layout **/

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    background: #111111 url(../images/background_image.jpg) no-repeat;
}

a {
    text-decoration: underline;
    color: white;
}

#page {
    position: relative;
    /* hack to get the page to extend to the bottom when content scrolls */
    min-height: 100%;
    height: auto !important;
    height: 100%;
    width:735px;
    margin: 0 auto;
}


#header {
    height: 163px;
    margin: 0;
}

#logo {
    float: left;
    display: inline;
    margin-top: 33px;
    width: 300px;
    height: 0;
    padding-top: 25px;
    overflow: hidden;
    background: transparent url(../images/sclogo.png) no-repeat;
}


#content {
    margin-top: 20px;
}

#footer {
    clear: both;
    height: 30px;
    padding-top: 10px;
    text-align: center;
}

/** Typography **/

/* main title */

h1,h2,h3,h4 {
	line-height: 1.2;
}

h1 { 
	font-size: 30px;
}

/* sidebar/block title */
h2 {
	font-size: 22px;
}

/* subtitle*/
h3 {
    font-size: 16px;
	padding-top: 0.5em;
	color:#aad037;
}

.breadcrumbs,
.breadcrumbs a {
	font-size: 12px;
	color:#aad037;
}

.intro p {
	color:#aad037;
}

.portfolio p {
	color:#aad037;
}

.side-box p {
	font-size: 12px;
}

#careers-box p,
#design-box p,
#people-box p {
	color:#aad037;
}

#people-box h3 {
	color: #fff;
	padding-top: 10px;
	font-size: 18px;
}

#company #people-box h4 {
	color: #aad037;
}

.bodytextgreen {
    font-size:11px;
    color:#aad037;
}

.bodytext {
    color:#FFFFFF;
    font-family:Arial,Helvetica,sans-serif;
    font-size:11px;
}

.style1 {
    font-size:12px;
}

.style3 {
    color:#aad037;
    font-size:12px;
    margin-bottom: 5px;
}

.style7 {
    color:#aad037;
    font-size:11px;
}

.style8 {
    font-size:14px;
    color:#aad037;
}


#footer {
    color: #fff;
    font-size: 12px;
}

/** Navigation **/

#nav {
    padding-top: 55px;
    clear: both;
}

#nav li{
	float: left;
	display: inline;
    margin-right: 5px;
    list-style: none;
}

#nav li a {
    display: block;
    width: 178px;
	height: 0;
    padding-top: 23px;
    overflow: hidden;
}

#nav li.home a { background: url(../images/nav_buttons/home.png); }
#nav li.company a { background: url(../images/nav_buttons/company.png); }
#nav li.solutions a { background: url(../images/nav_buttons/solutions.png); }
#nav li.clients a { background: url(../images/nav_buttons/clients.png); }
body.home #nav li.home a { background: url(../images/nav_buttons/home_sel.png); }
body.company #nav li.company a { background: url(../images/nav_buttons/company_sel.png); }
body.solutions #nav li.solutions a { background: url(../images/nav_buttons/solutions_sel.png); }
body.clients #nav li.clients a { background: url(../images/nav_buttons/clients_sel.png); }

/** Forms **/

/** Login Box **/

#login-box {
    margin-top: 16px;
    float: right;
    display: inline;
    color: #fff;
}

#login-box #login-form {
    float: left;
    display: inline;
}

#login-box label {
    font-size: 11px;
}

#login-box .form-item {
    float: left;
    display: inline;
    width: 100px;
    margin-right: 10px;
}

#login-box input {
    width: 100px;
}

#login-box input.submit {
    width: 45px;
    height: 21px;
	margin-top: 17px;
	float: left;
	display: inline;
}

#login-box p {
    clear: both;
    font-size: 11px;
}

/** Content **/
.column-wrap {
	float: left;
	display: inline;
}

.column {
    float: left;
    display: inline;
}

#content p {
    padding: 0.5em 0;
}

#content ul {
    padding: 0.5em 0 0.5em 15px;
}

/** Page specific **/


/** image titles **/

.img-title {
    display: block;
    height: 0;
    overflow: hidden;
}

#index #mobile-life-banner {
	margin: 10px 0 20px;
    width: 411px;
    padding-top: 91px;
    background: transparent url(../images/titles/new_wave.png) no-repeat;
}

#index #featured-app h2 {
    margin-left: 11px;
    width: 242px;
    padding-top: 34px;
    background: transparent url(../images/titles/featuredapp.png) no-repeat;
}

#company #contact-title {
    width: 100px;
    padding-top: 22px;
    background: transparent url(../images/titles/contact.png) no-repeat;
}

#company #careers-title {
    width: 95px;
    padding-top: 22px;
    background: transparent url(../images/titles/careers.png) no-repeat;
}

#company #design-title {
    width: 431px;
    padding-top: 50px;
    background: transparent url(../images/titles/designandtech.png) no-repeat;
}

#company #keypeople-title {
    width: 227px;
    padding-top: 41px;
    background: transparent url(../images/titles/key_people.png) no-repeat;
}

#solutions #solutions-title {
    width: 219px;
    padding-top: 40px;
    background: transparent url(../images/titles/solutions.png) no-repeat;
}

#sales-title {
    width: 91px;
    padding-top: 31px;
    background: transparent url(../images/titles/sales.png) no-repeat;
}

#conference-title {
    width: 205px;
    padding-top: 31px;
    background: transparent url(../images/titles/conference.png) no-repeat;
}

#richmedia-title {
    width: 193px;
    padding-top: 31px;
    background: transparent url(../images/titles/richmedia.png) no-repeat;
}

#clients #clients-title {
    width: 119px;
    padding-top: 31px;
    background: transparent url(../images/titles/client.png) no-repeat;
}

#clients #testimonials-title {
    width: 430px;
    padding-top: 31px;
    background: transparent url(../images/titles/testimonials_casestudies.png) no-repeat;
}

#casestudies-title {
    width: 258px;
    padding-top: 34px;
    background: transparent url(../images/sales_case_study/casestudiescopy.png) no-repeat;
}

/** Page layout **/

#index .center {
    width: 430px;
}

#index .right {
    margin-left: 15px;
    width: 285px;
}

#index .center img {
	margin-top: 0.5em;
}

#featured-app img {
    text-align: center;
    margin-left: 31px;
}

#company .left {
    width: 225px;
    margin-right: 10px;
}

#company .center {
    width: 495px;
}

#solutions .column .box .content {
	height: 469px;
}

#appmaker .column .box .content {
	height: 401px;
}

.three-equal-cols .column {
    width: 241px;
    margin-right: 6px;
}

.three-equal-cols .right {
    margin-right: 0;  
}

.three-equal-cols h1 {
    margin-bottom: 18px;
}

.three-equal-cols .column img {
    margin-left: 9px;
    margin-top: 10px;
    margin-bottom: 8px;
}

#sales .center .content, 
#sales .right .content{
	height: 591px;
}

/** Rounded corners **/

.box {
 position:relative;
 margin:0px auto;
 min-width:8em;
 max-width:800px; /* based on image dimensions - not quite consistent with drip styles yet */
 color:#fff;
 z-index:1;
 margin-left:12px; /* default, width of left corner */
 margin-top: 0.5em;
 margin-bottom:0.5em; /* spacing under dialog */
}

.box .content,
.box .t,
.box .b,
.box .b div {
 background:transparent url(../images/blackbox.png) no-repeat top right;
}

.box .content {
 position:relative;
 zoom:1;
 _overflow-y:hidden;
 padding:10px 12px 0px 0px;
}

.box .t {
 /* top+left vertical slice */
 position:absolute;
 left:0px;
 top:0px;
 width:12px; /* top slice width */
 margin-left:-12px;
 height:100%;
 _height:1600px; /* arbitrary long height, IE 6 */
 background-position:top left;
}

.box .b {
 /* bottom */
 position:relative;
 width:100%;
}

.box .b,
.box .b div {
 height:10px; /* height of bottom cap/shade */
 font-size:1px;
}

.box .b {
 background-position:bottom right;
}

.box .b div {
 position:relative;
 width:12px; /* bottom corner width */
 margin-left:-12px;
 background-position:bottom left;
}

.box .hd,
.box .bd,
.box .ft {
 position:relative;
}

.box .wrapper {
 /* extra content protector - preventing vertical overflow (past background) */
 position:static;
 max-height:1000px;
 overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}

.box h1,
.box p {
 margin:0px; /* margins will blow out backgrounds, leaving whitespace. */
}

.box p {
 padding:0.5em 0px 0.5em 0px;
}