/*
    CreamUK: Core Style Sheet 
    2009-04-20 (AK)
    722969
*/


/* --------------- Reset Styles! ---------------- */
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,
b, u, i, center,
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;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1em;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* ---------------------------------------------- */


body {
    background-color: #352919; 
    font: normal 14px Trebuchet MS, Helvetica, sans-serif;
    /*tahoma, helvetica, sans-serif;*/
    color: #D4CCBF;
}


#wrap {
    margin: 0 auto;
    position: relative;
    width: 973px;
   /* overflow: hidden; */
}

#header{
    height: 31px;  /* 63px -32px = 31px (for navbar placement) */
    margin-top: 32px;
}

#bodyarea { 
    border: 1px solid #ABADAC;
    background-color: #887A68;
    height: 517px;
    /* overflow: hidden; */  
    position: relative;
    width: 971px;
    z-index: 2;
}

#col-left{
    border-right: 1px solid #ABADAC;
    float: left;
    height: 517px;
    width: 388px; 
}

#col-right{
    background: transparent url(../images/logo-bg.jpg) no-repeat top right;
    float: left;
    height: 366px; /* 517px - 181px = 339px */
    padding: 151px 20px 0 40px;
    margin: 0; 
    width: 521px; /* -40px for padding */
}



/* --------------- Navigation ---------------- */

#navplaceholder{
    background: transparent url(../images/navbar.gif) no-repeat top;
    height:12px;
    
}

ul#navbar {
    color: #474747;
    float: left;  /* Default: left when login is ready */
}

ul#navbar li {
    display: block;
    float: left;
    width: 139px;
    text-align: center;
}

ul#navbar li a { 
    background: transparent url(../images/navbarblock.gif) no-repeat top left;
    display: block;
    height: 12px; 
    margin: 0 auto;
    overflow: hidden; /* IE 6 fix */ 
    text-indent: -4000px; 
}

/* Horiz / Vert */
ul#navbar li#home a { width: 42px;}
ul#navbar li#home a:hover, ul#navbar li#home a.on {  background-position: 0 -20px;}

ul#navbar li#about a { background-position: -44px 0; width: 47px;}
ul#navbar li#about a:hover,ul#navbar li#about a.on {  background-position: -44px -20px;}

ul#navbar li#services a { background-position: -93px 0; width: 60px; }
ul#navbar li#services a:hover, ul#navbar li#services a.on {  background-position: -93px -20px;}

ul#navbar li#clients a { background-position: -155px 0; width: 52px;}
ul#navbar li#clients a:hover, ul#navbar li#clients a.on {  background-position: -155px -20px;}

ul#navbar li#people a { background-position: -209px 0; width: 49px; }
ul#navbar li#people a:hover, ul#navbar li#people a.on {  background-position: -209px -20px;}

ul#navbar li#news a {background-position: -260px 0; width: 39px; }
ul#navbar li#news a:hover, ul#navbar li#news a.on {  background-position: -260px -20px;}

ul#navbar li#contactus a { background-position: -301px 0; width: 82px; }
ul#navbar li#contactus a:hover, ul#navbar li#contactus a.on {  background-position: -301px -20px;}



/* --------------- Home intro movie ---------------- */
#ctrl {
    height: 519px;
    width: 973px;
    overflow: hidden;
    position: absolute;
    z-index: 10;
}

#moviewrap { 
    background-color: #352919;
    height: 519px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 973px;
    z-index: 30;
}

#slider{
    /* Starting size */
    background-color: #352919;
    height: 519px;
    left: 0;
    /* left: -583px;  for final flash animation */
    position: absolute;
    top: 0;
    width: 973px;
    z-index: 32;
}


a#playagain  {  
	background: transparent url(../images/button_playagain.gif) no-repeat;
    bottom: 15px;
	color: #352919;
    display: hidden;
	height: 29px;
    left: 15px;
    position: absolute;
	text-indent: -4000px;
	width: 98px;
    z-index: 35; 
} 
a:hover#playagain { background: transparent url(../images/button_playagain_on.gif) no-repeat; }


#movie{
    background-color: transparent; 
    display: block;
    height: 519px;
    width: 973px; 
}

#still{
    background: #352919 url(../images/movie_still.jpg) no-repeat;
    height: 519px;
    width: 970px; 
}


/* -- Text styles -- */
h1{
    
    display: block;
    height: 36px;
    margin: 0 0 20px 0;
    padding: 0; 
    text-indent: -4000px;
    /*width: 150px; */
    
    
}

h1.home { background: transparent url(../images/title_home.gif) no-repeat; }
h1.about { background: transparent url(../images/title_about.gif) no-repeat; }
h1.services { background: transparent url(../images/title_services.gif) no-repeat; }
h1.clients { background: transparent url(../images/title_clients.gif) no-repeat; }
h1.people { background: transparent url(../images/title_people.gif) no-repeat; }
h1.news { background: transparent url(../images/title_news.gif) no-repeat; }
h1.contactus { background: transparent url(../images/title_contactus.gif) no-repeat; }



p{
    line-height: 1.1em; 
    padding-bottom: 23px;   
}


/* -- people -- */

#col-left.people  { 
    background: #887A68 url(../images/bg_stripe1.gif) repeat-y top left; 
    border-right: 1px solid #ABADAC; 
    /* -- new version by kung -- */
    width: 388px; /* old value - width: 208px; */
}

#col-left h1, #col-left-clients h1{ margin: 64px 0 0 56px; }

#col-left ul{ margin: 9px 0 0 58px; }
#col-left ul li, #col-right ul li { font-size: 14px; }
#col-left ul li a, #col-right ul li a { color: #ACA095; text-decoration: none; }
#col-left ul li a:hover, #col-left ul li.on a, #col-right ul li a:hover, #col-right ul li.on a { color: #D4CCBF; font-weight: bold; }


#col-right.people {
    border: 0;
    /* height: 405px;  517px - 112px = 405px */
    /* -- new version by kung -- */
    /* old value - padding: 110px 304px 0 0; */
    width: 521px; /* old value - width: 459px;  */
}

#col-right #staff-list {
    float: left;
    width: 155px;
}

#col-right #biog .bodytext {
    height: 250px;
}
#col-right div.bodytext{
    line-height: 1.2em;
    padding-right: 10px;
    overflow: hidden; /* Required by IE7 */
}

#col-right div.bodytext h2{ color: #E9E3DB; margin-bottom: 10px; }
#col-right div.bodytext span{ color: #E9E3DB; }

#col-right .peopleTitle{ height: 28px;}
#col-right .peopleTitle h2 span {color: #ACA095}
#col-right h2, #col-right h3 { font-size: 16px }
#col-right h3 {color: #ACA095; margin-top: 5px;}


/* -- clients -- */
    
#col-left-clients  { 
    float: left;
    background: #887A68 url(../images/bg_stripe1.gif) repeat-y top left;  
    height: 517px;
    position: relative;
    width: 150px;
    z-index: 2;
}

#col-right-clients{
    background: transparent url(../images/logo-bg.jpg) no-repeat top right;
    float: left;
    height: 517px; /* 517px - 112px = 405px */
    margin: 0;
    padding: 0;
    position: relative;
    width: 821px; 
}

#col-right-clients.clientlist {

}

#col-right-clients #clientbox{
    /* background-color: #aaa; */
    /* background: transparent url(../images/clients_shadow.png) no-repeat; */
    height: 332px;
    margin: 108px 0 0 0;
    padding: 10px;
    width: 626px;
}

#col-right-clients #clientbox img { display: none; float: left; margin: 0 5px 6px 1px;}

.loader { 
	background: transparent url(../images/loader.gif) no-repeat 10px 5px;
	display: none; 
	height: 100px;
	left: 290px;
	position: absolute;
	top: 210px;
	padding-top: 35px;
	width: 100px;
	z-index: 50;
}


/* case studies */
h1.client-hobbs { background: transparent url(../images/title_case_hobbs.gif) no-repeat; }
h1.client-clarion_events { background: transparent url(../images/title_case_clarion.gif) no-repeat; }

div.casetext{
    /* border: 1px solid #ABADAC; */
    /* height: 203px;*/
    padding: 0;
    /* overflow: auto;*/
}

/* scroll zone */
div#szone { height: 233px; padding-right: 15px; }
div#stdzone { height: 290px; padding-right: 15px; }

p.back { margin-top: 15px; font-size: 11px; /* text-indent: 11px; */ }
p.back a { text-decoration: none; }
p.back a:hover { text-decoration: underline; }

/* -- news -- */

#newsform label, #newsform span.space {
    display: block;
    float: left;
    width: 92px;    
}

#newsform input  {
    float: left; 
}

/* -- contact us -- */
address { font-style: normal; }



/* -- demo mode -- */

#demo{
    height: 23px;
    width: 100%;
    background-color: red;
    color: white;
    font-weight: normal;
    padding-top: 5px;
    text-align: center;
    border-bottom: 2px solid #A00000;
}

.debug{
    width: 100%;
    background-color: red;
    color: white;
    padding: 5px;
    text-align: left;
    border: 4px solid #A00000;
    margin-bottom: 15px;
}

.debug:before{
    font-weight: bold;
    content: "Debug: "; 
}


/* -- General styles -- */


a { color: #E9E3DB; }

#clientbox a { float: left; margin: 0 5px 6px 1px; overflow: hidden; }
#col-right-clients #clientbox a img {  margin: 0; }

.hide { display: none; }
.show { display: block; }
.center { margin: 0 auto; }
.pad10 { /* padding: 10px; */}