html, body {margin:0; padding:0; height:100%;}
body {background: #fff; color: #333; font-family: times, 'times new roman', serif; background-position: top center; background-repeat: no-repeat;}
a {color: #662248; text-decoration: none;}
a:hover {text-decoration: underline;}
hr {border: 0px; border-bottom: 1px solid #cbcbcb; height: 1px; line-height: 1px; margin: 15px 0 20px 0; padding: 0; clear: both;}

.container {width: 960px; margin: 0 auto; overflow: auto; border-bottom: 1px solid #dfdfdf;}
.container.about {background: url(/_assets/bg_about.png) 0 244px no-repeat;}
.container.top {border: none;}
.container.sub {background: url(/_assets/bg_sub.png) 0 400px repeat-y;}
#footer .container {border-bottom: 0; position: relative; overflow: visible;}

#home #header {height: 400px; position: relative; overflow: hidden;}
#sub #header {height: 172px; position: relative; border-bottom: 1px solid #dfdfdf;}
#sub.alt #header {height: 182px; border: none;}

#header #logo a {background: url(/_assets/logo.png) 0 0 no-repeat; display: block; width: 305px; height: 84px; text-indent: -999em;}

#nav_home_about a, #nav_home_work a {height: 34px; text-indent: -999em; display: block; position: absolute;}
#nav_home_about a:hover, #nav_home_work a:hover  {background-position: 0 -34px;}
#nav_home_about a {width: 139px; background: url(/_assets/nav_home_about.png) 0 0; top: 216px;}
#nav_home_work a {width: 131px; background: url(/_assets/nav_home_work.png) 0 0; top: 314px; left: 305px;}

#nav_sub_home a, #nav_sub_about a, #nav_sub_work a, #nav_sub_contact a {width: 96px; height: 30px; text-indent: -999em; display: block; position: absolute; top: 54px;}
#nav_sub_home a:hover, #nav_sub_about a:hover, #nav_sub_work a:hover, #nav_sub_contact a:hover {background-position: 0 -30px;}
#nav_sub_home a.active, #nav_sub_about a.active, #nav_sub_work a.active, #nav_sub_contact a.active {top: 100px; background-position: 0 -30px !important;}
#nav_sub_home a {background: url(/_assets/nav_sub_home.png) 0 0; left: 333px;}
#nav_sub_about a {background: url(/_assets/nav_sub_about.png) 0 0; left: 458px;}
#nav_sub_work a {background: url(/_assets/nav_sub_work.png) 0 0; left: 583px;}
#nav_sub_contact a {background: url(/_assets/nav_sub_contact.png) 0 0; left: 755px;}

#callout {font-size: 28px; color: #e6f5f8; width: 305px; position: absolute; right: 10px; bottom: 15px;}
#callout p {margin: 5px 0;}
#callout a {font-size: 18px; color: #643838; padding-right: 16px; background: url(/_assets/icn_arrows.png) right 5px no-repeat;}

#banner {background: #5c4f62; background: url(/_assets/bg_bnr_home.png) 0 0 no-repeat; padding: 13px 10px 0 10px; width: 600px; height: 96px; margin: 0 0 5px 0;}
#banner h1, #banner h2, #banner h2 a {font-size: 34px; font-weight: normal; color: #fff !important;}
#banner h2 a:hover {text-decoration: underline;}
#banner p {font-size: 15px; color: #dce9e9; margin-top: 5px; line-height: 20px;}

#sub #banner {width: 579px; background: url(/_assets/bg_bnr_sub.png) 0 0 no-repeat; padding: 15px 15px 0 15px;}
#sub #banner p {color: #dad8d8;}
#sub.alt #banner {width: 710px; height: 62px; background: url(/_assets/bg_header.png) 0 0 no-repeat; padding: 15px 15px 0 15px; margin-top: -5px;}
#sub.alt #banner h1, #sub.alt #banner h2 {font-size: 44px !important;}
#sub.alt #banner.alt h1, #sub.alt #banner.alt h2 {color: #d7e299 !important;}
 
#home #col_left {width: 620px; height: 337px; float: left; margin: 5px 0; padding-bottom: 15px; position: relative;}
#home #col_left #sketch {width: 620px; height: 27px; border-top: 1px solid #d0d0d0; position: absolute; bottom: 10px;}
#home #col_left #sketch img {float: right; margin: 0; padding: 0;}

#sub #col_left {width: 609px; float: left; margin: 5px 0; padding-bottom: 15px;}

#home #col_right {width: 327px; min-height: 352px; background: url(/_assets/bg_sidebar.png) repeat-x; float: right; margin: 5px 0; position: relative;}
#home #col_right h2 {font-size: 44px; font-weight: normal; color: #4c4453; padding: 10px 0 16px 10px;} 
#home #col_right span a {display: block; font-size: 24px; line-height: 22px; color: #662248; font-family: times, 'times new roman', serif; margin: 15px 0 0 0; text-decoration: none; clear: left;}
#home #col_right span a:hover {text-decoration: underline;}
#home #col_right p {margin: 5px 10px 8px 10px; font-family: helvetica, arial, sans-serif; color: #666; font-size: 12px; line-height: 17px;}
#home #col_right img {float: left; margin: 3px 8px 10px 10px;}
#home #col_right #words {width: 327px; height: 27px; border-top: 1px solid #d0d0d0; position: absolute; bottom: 10px;}
#home #col_right #words a, #home #col_right #words img {float: right; margin: 0 !important; padding: 0;}

#sub #col_right {width: 340px; float: right; margin: 5px 0; padding-bottom: 15px; font: 12px/20px helvetica, arial, sans-serif; color: #666;}

#sub.alt #col_left {width: 740px;}

#sub.alt #col_left h2 {font-size: 30px; color: #1f1f1f; font-weight: normal; margin-top: 15px;}
#sub.alt #col_left h3 {font-size: 22px; font-weight: normal; margin-top: 20px;}
#sub.alt #col_left h4 {font-size: 14px; font-weight: normal; text-transform: uppercase; margin: 10px 0 0 0;}

#sub.alt #col_left p {margin: 10px 0; font-size: 15px; line-height: 22px; color: #666;}

#sub.alt #col_left p.alt { color: #7d7a15; font-size: 18px; line-height: 24px;}

#sub.alt #col_right {width: 205px; margin: 0 0 5px 0;}

#sub.alt #col_right ul {margin: 10px 20px 20px 20px;}
#sub.alt #col_right li {line-height: 15px !important; margin-bottom: 5px;}

.floater {width: 240px; float: left; margin: 5px 0 15px 10px; color: #6f6c0e; font: 14px helvetica, arial, sans-serif;}
.floater.first {margin-left: 0; clear: left;}
.floater img {border: 5px solid #898889;}
.floater img:hover {border: 5px solid #b4c264;}
.floater a {text-decoration: none; color: #6f6c0e;}
.floater a.alt {line-height: 18px; font-family: times, 'times new roman', serif !important; font-size: 22px !important; line-height: 20px; color: #666 !important;}
.floater a:hover {color: #b4c264 !important;}
.floater a.alt img {margin-bottom: 4px;}
.floater p {margin: 3px 0 0 0 !important; line-height: 16px !important;}

.float_left {float: left; margin: 5px 15px 5px 0; border: 5px solid #898889;}

.img_left {float: left; margin: 5px 15px 5px 0;}

.img_right {float: right; margin: 5px 0 5px 15px;}

#col_right h4 {font: 18px times, 'times new roman', serif; width: 180px; margin: -8px 0 0 1px; *margin-top: -4px; background: #eee; color: #4c4453; font-weight: normal; padding: 12px 12px 8px 12px;}

.col_about {width: 300px; font: 14px/20px times, serif; color: #666;}
.col_about h3 {font-size: 30px; color: #666; font-weight: normal;}
.col_about p {margin-top: 10px;}
.col_about p.alt {font-size: 18px; line-height: 22px; color: #7d7a15;}
.col_about img {border: 5px solid #898889;}
.col_about.left {float: left;}
.col_about.right {float: right; margin-right: -5px;}
.col_about.right p.alt {color: #baa517;}

#tagline {font-size: 44px; color: #4c4453; line-height: 60px; height: 75px;}

#recent {width: 340px; height: 355px; background: url(/_assets/tmp_recent.jpg) 0 0 no-repeat; position: relative;}
#recent h3 {font-size: 40px; color: #662248; font-weight: normal; margin: 52px 0 16px 10px; float: left;}
#recent p {margin: 0 0 0 10px; float: left; width: 240px;}
#recent a {display: block; width: 340px; height: 355px; position: absolute; top: 0; left: 0;}

#how {width: 340px; height: 166px; background: url(/_assets/bg_how.png) 0 0 no-repeat; margin: 10px 0;}
#how p {margin: 12px 10px 0 0; line-height: 18px; float: right; width: 205px;}

#rolling {background: #e9e6e1; padding: 10px;}
#rolling h3 {font-size: 24px; color: #541c3b; font-weight: normal;}
#rolling label {display: block; margin-top: 5px;}
#rolling input, #rolling textarea {width: 310px; border: none; background: #fff; padding: 4px; font: 12px helvetica, arial, sans-serif; color: #666;}
#rolling textarea {height: 150px;}
#rolling input.submit {border: none; background: url(/_assets/btn_send.png); width: 54px; height: 19px; font-size: 1px; color: #662248; margin: 5px 0 10px 0; padding: 0; cursor: pointer; text-align: left;}
#rolling input.submit:hover {background-position: 0 -19px;}
#rolling strong {font-size: 18px; color: #531b3a;}

#footer {width: 100%; height: 218px; background: url(/_assets/bg_footer.png) repeat-x;}

#contact {width: 308px; height: 218px; background: url(/_assets/bg_contact.png) repeat-x; position: absolute; top: 0; left: 0;}
#contact h3 {width: 78px; height: 22px; background: url(/_assets/hdr_contact.png); text-indent: -999em; margin: 0 0 15px 15px;}
#contact p {color: #777; font-family: helvetica, arial, sans-serif; font-size: 12px; line-height: 17px; margin: 0 0 10px 15px;}
#contact p span {font-size: 14px; color: #3b3b3b;}
#contact a {color: #777; text-decoration: none;}
#contact a:hover {text-decoration: underline;}
#contact div {position: absolute; bottom: 8px; left: 0; height: 56px; padding: 0 0 0 15px;}
#contact div p {color: #662248; margin: 6px 0 0px 0;}
#contact input {float: left; border: 1px solid #c3c3c3; color: #a5a5a5; font-family: helvetica, arial, sans-serif; font-size: 12px; padding: 4px 3px; width: 210px;}
#contact input.submit {border: none; background: url(/_assets/btn_yeah.png); width: 54px; height: 19px; font-size: 1px; color: #662248; margin: 2px 0 0 8px; cursor: pointer; text-align: left;}
#contact input.submit:hover {background-position: 0 -19px;}

#footnav {overflow: auto; position: absolute; top: 0; left: 308px;}
#footnav li {display: inline;}
#footnav li a {height: 22px; text-indent: -999em; display: block; float: left; margin-bottom: 1px;}
#footnav li a:hover  {background-position: 0 -22px;}
#nav_foot_home a {width: 79px; background: url(/_assets/nav_foot_home.png);}
#nav_foot_about a {width: 84px; background: url(/_assets/nav_foot_about.png);}
#nav_foot_work a {width: 80px; background: url(/_assets/nav_foot_work.png);}
#footnav img {clear: left;}

#collab {width: 327px; height: 218px; background: url(/_assets/bg_collab.png) repeat-x; position: absolute; top: 0; right: 0;}
#collab h3 {width: 138px; height: 21px; background: url(/_assets/hdr_collab.png); text-indent: -999em; margin: 0 0 15px 15px;}
#collab ul {width: 145px; float: left; margin-left: 13px; color: #ededed; font-family: helvetica, arial, sans-serif; font-size: 12px;}
#collab li {padding-bottom: 10px;}
#collab a {color: #ededed; text-decoration: none;}
#collab a:hover {text-decoration: underline;}