/*
** M E R I X
** 2008/10/23
*/
html { height: 100%; margin-bottom: 1px; font-size: 100%; }
body { min-width: 950px; margin: 0; padding: 0 0 65px; background: #F8F8F8; color: #555; font: .75em/1.3 "Arial", "Helvetica", sans-serif; }
textarea, input, select, option, optgroup, button { font: 1em "Arial", "Helvetica", sans-serif; }
* { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; }
p, ul, ol, dl { padding-bottom: 1em; }
img { border: none; vertical-align: bottom; }
h1, h2, h3, h4, h5, h6 { font-size: 1em; }
ul, ol { margin-left: 1.5em; padding-left: 0; }
ul { list-style-type: disc; }
address { padding: 0; font-style: normal; }
acronym { border-bottom: 1px dotted #555; cursor: help; }
code { font-family: "Consolas", "Lucida Console", "Monaco", monospace; }
pre { font-size: 1.1em; }
blockquote { margin: 0; padding: 0 50px; background: transparent url("../images/quote.png") no-repeat 0 0; font-style: italic; }
a { background: transparent url("../images/border_00.png") no-repeat -512px 100%; color: #F47F20; text-decoration: none; outline: none; cursor: pointer; }
a:hover { background-position: 0 100%; color: #555; text-decoration: none; }
a:active { color: #000; }


/*
** some globally used classes
*/
.left { float: left !important; }
.right { float: right !important; }

.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

.undo-margin { margin-top: -.8em; }
.no-margin { padding-bottom: 0 !important; }
.margin { padding-bottom: 1em !important; }

.hide { position: absolute; left: -999em; top: -999em; }

button, input.radio, input.checkbox, label, select { cursor: pointer; }

label { font-weight: 700; }
label.checkbox { font-weight: 400; }
label em { color: #888; font-weight: 400; font-style: normal; }


/*
** header
*/
.header { position: relative; overflow: hidden; background: #333 url("../images/header_background.png") repeat-x 0 0; color: #808080; }
.header div { position: relative; width: 950px; margin: 0 auto; padding: 126px 0 0; }
.header div div { position: static; width: auto; margin: 0; padding: 0; }
.header a { background: transparent; }

/* logo */
.header p.logo { position: absolute; top: 45px; left: -4px; float: left; width: 286px; height: 60px; background: transparent url("../images/logo.jpg") no-repeat 0 0; }
.header p.logo a { float: left; width: 100%; height: 100%; }
.header p.logo img { display: none; }

.us .header p.logo { background-image: url("../images/logo_alt.jpg"); }

.december .header p.logo { top: 23px; height: 82px; background-image: url("../images/logo_december.jpg"); }
.december.us .header p.logo { width: 184px; background-image: url("../images/logo_december_alt.jpg"); }


/* page title */
.header h2 { float: left; padding: .8ex 0 .8ex 20px; color: #fff; font-size: 3em; font-weight: 400; }
.header p.tagline { padding: 1.75em 20px 0 0; color: #fff; font-size: 1.5em; font-weight: 400; text-align: right; }
.header p.tagline strong { color: #F47F20; font-weight: 400; }

/* links */
.header ul.links { position: absolute; top: 7px; right: 0; overflow: hidden; float: right; list-style: none; margin: 0 -1em 0 0; padding: 0 20px 50px 0; font-size: .833em; }
.header ul.links li { float: left; margin-left: -1px; padding: 0 1em; border-left: 1px solid #2F2F2E; }
.header ul.links a { float: left; color: #636363; text-transform: uppercase; }
.header ul.links a.contrast { color: #AAA; }
.header ul.links a.contrast:hover { text-decoration: underline; }
.header ul.links a:hover { color: #FFF; }
.header ul.links strong { color: #B0471F; font-weight: 400; }
.header ul.links a:hover strong { color: #F47F20; }

.js .header ul.links li.contrast { display: block; }

/* main menu */
.header ul.menu { position: absolute; top: 70px; right: 0; overflow: hidden; float: right; clear: right; list-style: none; margin: 0; padding: 0; line-height: 1.1; }
.header ul.menu li { float: left; margin-left: -1px; border-left: 1px solid #2E2E2E; }
.header ul.menu a { float: left; padding: 0 20px; color: #D0D0D0; font-size: 1.167em; font-weight: 700; text-transform: lowercase; white-space: nowrap; }
.header ul.menu a strong,
.header ul.menu a:hover { color: #F47F20; text-decoration: none; }

/* corner link */
.play-link { position: fixed; top: 0; right: 0; z-index: 5; width: 95px; height: 97px; }
.play-link a { overflow: hidden; float: right; width: 95px; height: 97px; background: transparent; line-height: 97px; text-align: center; }


/*
** content
*/
.content-parent { border-bottom: 1px solid #EFEFEF; background: #FFF; }
.content { width: 948px; margin: 0 auto; padding: 0 0 24px; border: 1px solid #EFEFEF; border-top: none; }
.content .content { width: auto; margin: 0; padding: 0 19px; border: none; }
.content h1 { padding: 1em 19px 1.5ex; color: #000; font-size: 2em; font-weight: 700; line-height: 1; }
.content h1.after-tabs { clear: both; border-top: 1px solid #efefef; }
.content h3 { padding: 0 0 1ex; color: #000; font-size: 1.5em; font-weight: 400; line-height: 1; }
.content h3 a { background: transparent; color: #000; }
.content h3 a:hover { color: #F47F20; }
.content hr { height: 4px; margin-top: 3em; border: none; background: #EFEFEF; }
.content hr.special { height: 1px; clear: both; margin-top: 0; }


/*
** location bar/breadcrumbs
*/
p.location { padding: 1em 19px; border-bottom: 4px solid #EFEFEF; color: #888; font-size: .917em; line-height: 1.1; word-spacing: .5ex; }
p.location a { background: transparent; color: #888; word-spacing: normal; }
p.location a:hover { color: #000; text-decoration: underline; }
p.location strong { color: #F47F20; word-spacing: normal; }


/*
** footer
*/
.footer { overflow: hidden; width: 950px; margin: 0 auto; padding: 26px 0 0; color: #666; font-size: .917em; }
.footer img { position: relative; top: -2px; vertical-align: middle; }
.footer p { padding: 0; color: #AAA; line-height: 35px; word-spacing: .75ex; }
.footer p * { word-spacing: normal; }
.footer span { color: #888; }
.footer span.copyright { float: left; margin-right: 10px; padding: 0 60px 0 0; background: transparent url("../images/footer_background.png") no-repeat 100% 50%; line-height: 35px; }
.footer b { color: #666; font-weight: 400; }
.footer a { background: transparent; color: #3B5E73; }
.footer a strong { padding-right: 8px; background: transparent url("../images/bullet_02.png") no-repeat 100% 60%; }
.footer a:hover { text-decoration: underline; }


/*
** two columns
*/
ul.two-columns { overflow: hidden; list-style: none; margin: 0; padding: 0; }

.header ul.two-columns { position: relative; margin: 0 0 20px; padding: 0 20px 23px; background: transparent url("../images/border_01.png") repeat-y 50% 0; line-height: 1.4; }
.header ul.two-columns li { width: 420px; padding: 0 0 1em; }
.header ul.two-columns h3 { color: #FFF; font-size: 1.917em; font-weight: 400; text-transform: lowercase; line-height: 1; }
.header ul.two-columns h3.sifr { font-size: 2.3em; }
.header ul.two-columns p { overflow: hidden; padding: 1.5ex 0 0; }
.header ul.two-columns p.last { position: absolute; bottom: 5px; padding: 0; }
.header ul.two-columns a.button-05 { background-position: 0 -20px; }
.header ul.two-columns a.button-05 span { background-position: 100% -20px; }

.content ul.two-columns { clear: both; border-top: 1px solid #EFEFEF; }
.content ul.two-columns li.left { width: 320px; }
.content ul.two-columns li.right { width: 550px; padding: 25px 19px 0 0; line-height: 1.4; }
.content ul.two-columns li.right h3 { padding-top: 1ex; padding-bottom: 1ex; }
.content ul.two-columns li.right h4 { padding-bottom: 1em; }
.content ul.two-columns h1 { padding-left: 0; padding-top: 0; }

.content ul.two-columns-alt { overflow: hidden; padding: 2em 19px 0; border-top: none; }
.content ul.two-columns-alt li.left { width: 425px; margin-right: -1px; padding: 0 30px 0 0; border-right: 1px solid #efefef; }
.content ul.two-columns-alt li.right { width: 424px; margin-left: -1px; padding: 0 0 0 30px; border-left: 1px solid #efefef; }
.content ul.two-columns-alt h3 { padding-top: 0; }
.content ul.two-columns-alt .icon { margin-left: -6px; }


/*
** three columns/what do we do box
*/
ul.three-columns { position: relative; top: 30px; overflow: hidden; list-style: none; margin: 0 0 30px; padding: 0 15px 0; background: transparent url("../images/three_columns_background.png") repeat-y 315px 0; }
ul.three-columns li { width: 285px; padding-bottom: 38px; }
ul.three-columns-offer li { padding-bottom: 0; }
ul.three-columns li ul { padding-top: 3ex; color: #F47D20; }
ul.three-columns li li { width: auto; padding-top: 1ex; }
ul.three-columns li li a { background: transparent; color: #3B5E73; }
ul.three-columns li li a:hover { color: #F47D20; }
ul.three-columns li.left { padding-right: 15px; border-right: 1px solid #EDEDED; }
ul.three-columns li.left p.first { background: transparent none no-repeat 0 1em; }
ul.three-columns li.middle { float: left; margin: 0 -1px; padding: 0 15px; border-left: 1px solid #EDEDED; border-right: 1px solid #EDEDED; }
ul.three-columns li.middle p.first { background: transparent none no-repeat 0 1em; }
ul.three-columns li.right { width: 286px; padding-left: 15px; border-left: 1px solid #EDEDED; }
ul.three-columns li.right p.first { background: transparent none no-repeat 0 1em; }
ul.three-columns h4 { padding: 0 0 .5ex; color: #000; font-size: 1.583em; font-weight: 400; text-transform: lowercase; line-height: 1; }
ul.three-columns h4.sifr { font-size: 1.8em; }
ul.three-columns p { overflow: hidden; padding: 1em 5px 0 76px; }
ul.three-columns p.first { min-height: 64px; line-height: 1.4; }
ul.three-columns p.last { position: absolute; bottom: 5px; padding-top: 0; }

ul.three-columns-footer { top: 0; width: 950px; margin: 25px auto 0; padding: 0; background-position: 316px 0; color: #888; font-size: .917em; line-height: 1.2; }
ul.three-columns-footer li { min-height: 60px; padding-bottom: 0; }
ul.three-columns-footer li.left { width: 186px; padding-left: 120px; padding-right: 10px; }
ul.three-columns-footer li.middle { width: 185px; padding-left: 120px; padding-right: 10px; }
ul.three-columns-footer li.right { width: 186px; padding-left: 131px; }
ul.three-columns-footer p { padding: 0; }
ul.three-columns-footer p.image { float: left; width: 120px; margin-left: -120px; text-align: center; }
ul.three-columns-footer a { background: transparent; color: #3B5E73; font-size: 1.091em; font-weight: 700; }
ul.three-columns-footer a:hover { text-decoration: underline; }


/*
** site map/no scripts version
*/
.site-map { width: 910px; margin: 20px auto 0; padding: 19px; border: 1px solid #EFEFEF; }
.site-map ul { overflow: hidden; list-style: none; margin: 0 0 0 -40px; padding: 0; }
.site-map ul ul { overflow: hidden; list-style: none; margin: 0; padding: 0 0 1em; font-size: .917em; line-height: 1.1; }
.site-map li { float: left; width: 150px; padding: 0 0 0 40px; }
.site-map li li { float: none; width: auto; padding: .5ex 0; }
.site-map h5 { padding: 0 0 1.5ex; color: #000; font-size: 1.167em; font-weight: 400; text-transform: uppercase; line-height: 1; }
.site-map h6 { padding: 0 0 1ex; color: #000; font-weight: 400; text-transform: uppercase; line-height: 1; }

/* scripted version */
.js .site-map { display: none; width: auto; margin: 0 auto; padding: 20px 0; border: none; background: #111; }
.js .site-map ul { width: 950px; margin: 0 auto; }
.js .site-map ul ul { width: auto; margin: 0; }
.js .site-map li { padding: 0 20px; }
.js .site-map li li { padding: .5ex 0; }
.js .site-map h5 { color: #F47D20; }
.js .site-map h6 { color: #FFF; }
.js .site-map a { background: transparent; color: #888; }
.js .site-map a:hover { color: #FFF; }


/*
** intro / non scripted version
*/
.intro { position: relative; overflow: hidden; padding: 0 0 30px !important; }

.intro .navigation { position: absolute; left: 345px; overflow: hidden; width: 260px; background: transparent url("../images/intro_navigation_background.png") repeat 0 0; color: #A2A2A2; font-size: .833em; text-align: center; text-transform: uppercase; line-height: 1; }
.intro .navigation:hover ul { display: block; }
.intro .navigation ul { display: none; float: left; list-style: none; margin: 0; padding: 25px 72px; text-align: left; }
.intro .navigation li { float: left; }
.intro .navigation li a { overflow: hidden; float: left; width: 58px; height: 60px; background: transparent url("../images/intro_navigation.png") no-repeat 0 0; text-indent: -999em; }
.intro .navigation li a.previous { }
.intro .navigation li a.previous:hover { background-position: 0 100%; }
.intro .navigation li a.next { background-position: -114px 0; }
.intro .navigation li a.next:hover { background-position: -114px 100%; }
.intro .navigation p { position: relative; padding: 1ex 0; }
.intro .navigation p span { padding-right: 20px; background: transparent url("../images/bullet_03.png") no-repeat 100% 50%; }

.intro .content { width: auto; min-height: 200px; margin: 0; padding: 40px 50px 0 520px; border: none; }
.intro .content p.photo { float: left; margin: -40px 0 0 -500px; padding: 0; }
.intro .content h2 { background: transparent; color: #FFF; font-size: 1.917em; font-weight: 900; text-transform: uppercase; line-height: 1.2; letter-spacing: -.1ex; }
.js .intro .content h2 { letter-spacing: normal; }
.intro .content h2 em { color: #A8B934; font-style: normal; }
.intro .content p.info { color: #535353; font-size: .833em; text-transform: uppercase; word-spacing: .5ex; }
.intro .content p.info * { word-spacing: normal; }
.intro .content a { background: transparent url("../images/border_00.png") no-repeat -1024px 100%; color: #A8B934; }
.intro .content a:hover { background-position: -1536px 100%; }
body .header .intro .content h2 { float: none; height: auto; margin: 0 !important; padding: 0; background: transparent; text-indent: 0; }

.intro p.ruler { position: relative; width: 812px; margin: 0 auto; padding: 10px 59px 0; background: transparent url("../images/intro_ruler.png") no-repeat 0 100%; font-size: .75em; text-transform: uppercase; line-height: 1; }
.intro p.ruler a { position: relative; top: 2px; display: block; width: 44px; margin-left: -22px; padding: 0 0 22px; background: transparent url("../images/button_01.png") no-repeat 0 100%; color: #999; text-align: center; }
.intro p.ruler a span { position: absolute; bottom: 22px; display: block; width: 120px; margin: 0 -38px; }

.intro-0 p.ruler a { left: 0; }
.intro-1 p.ruler a { left: 116px; }
.intro-2 p.ruler a { left: 232px; }
.intro-3 p.ruler a { left: 348px; }
.intro-4 p.ruler a { left: 464px; }
.intro-5 p.ruler a { left: 580px; }
.intro-6 p.ruler a { left: 696px; }
.intro-7 p.ruler a { left: 812px; }

/* scripted version of intro */
.intro-scripted { position: relative !important; width: 1260px !important; margin: 0 -155px !important; padding-bottom: 41px !important; }
.intro-scripted .navigation { position: absolute; left: 500px; z-index: 6; }
.intro-scripted .navigation ul { z-index: 3; display: block; padding-left: 44px; padding-right: 44px; }
.intro-scripted .navigation li a.pause { width: 56px; background-position: -58px 0; }
.intro-scripted .navigation li a.pause:hover { background-position: -58px 100%; }
.intro-scripted .navigation li a.play { background-position: -172px 0 !important; }
.intro-scripted .navigation li a.play:hover { background-position: -172px 100% !important; }

.intro-scripted .content { position: absolute; left: 0; top: 0; z-index: 3; width: 385px; padding: 40px 170px 0 675px; }

.intro-scripted p.ruler { position: relative; z-index: 2; margin-bottom: 10px; }
.intro-scripted p.ruler a { cursor: pointer; }
.intro-scripted p.ruler a.drag,
.intro-scripted p.ruler a:hover { background-position: 100% 100%; color: #FFF; }

.intro-scripted .fade-left { position: absolute; left: 0; top: 0; z-index: 4; width: 200px; height: 500px; background: transparent url("../images/intro_fade_left.png") no-repeat 0 0; }
.intro-scripted .fade-right { position: absolute; right: 0; top: 0; z-index: 4; width: 200px; height: 500px; background: transparent url("../images/intro_fade_right.png") no-repeat 0 0; }


/*
** clients list
*/
ul.clients { overflow: hidden; clear: both; list-style: none; margin: 40px 17px 0 19px; padding: 0; background: transparent url("../images/clients_background.png") repeat 0 0; }
ul.clients li { float: left; width: 227px; height: 110px; margin: 0 -1px; padding: 1px 1px 0 0; border: 1px solid #EFEFFE; border-width: 0 1px; text-align: center; }
ul.clients li.last-one { margin-left: 340px; }
ul.clients li.last-two { margin-left: 227px; }
ul.clients li.last-three { margin-left: 113px; }
ul.clients img { display: block; max-width: 227px; max-height: 110px; }


/*
** tabs
*/
ul.tabs { position: relative; float: right; clear: both; list-style: none; margin: 0 0 -1px; padding: 12px 19px 0 0; line-height: 1; }
ul.tabs li { float: left; }
ul.tabs a { float: left; padding: 0 0 0 20px; background: transparent url("../images/tab.png") no-repeat 0 0; color: #000; }
ul.tabs a.selected,
ul.tabs a:hover { background-color: #EFEFEF; background-position: 0 -200px; color: #000; }
ul.tabs span { float: left; padding: 1em 20px 1em 0; background: transparent url("../images/tab.png") no-repeat 100% 0; }
ul.tabs a.selected span,
ul.tabs a:hover span { background-position: 100% -200px; }
ul.tabs a.selected { color: #F47F20; font-weight: 700; }


/*
** submenu
*/
ul.submenu { list-style: none; margin: 1em 0 0; padding: 0; border-bottom: 1px solid #EFEFEF; line-height: 1.25; }
ul.submenu li { padding: 1ex 0 1ex 22px; border-top: 1px solid #EFEFEF; background: transparent url("../images/bullet_08.png") no-repeat 9px 1em; }
ul.submenu a { background: transparent; }
ul.submenu a em { font-size: .917em; }
ul.submenu a.selected,
ul.submenu a:hover { color: #000; }

p.after-submenu { overflow: hidden; padding: 0 0 3ex; line-height: 1; }
p.after-submenu a { float: right; padding: 1ex 1.5ex; border: 1px solid #EFEFEF; border-top: none; background: transparent; color: #888; font-size: .833em; text-transform: uppercase; }
p.after-submenu a:hover { color: #000; }


/*
** contact form
*/
.contact h4 { padding: 0 0 1em; color: #000; font-size: 1.083em; line-height: 1; }

form.write { overflow: hidden; }
form.write .left { width: 225px; padding: 0 0 1em; }
form.write .right { width: 300px; padding: 0 0 1em; }
form.write h4 { margin: 0 0 2em; border-bottom: 1px solid #EFEFEF; }
form.write p { overflow: hidden; clear: both; }
form.write p.text-right { padding: 1em 0 0; }
form.write textarea,
form.write input.text { display: block; margin: .5ex 0 0; }
form.write .left input.text { width: 220px; }
form.write .right textarea { width: 295px; height: 15em; }
form.write label.checkbox { float: right; width: 525px; color: #888; font-size: .917em; font-weight: 400; }
form.write input.checkbox { float: left; }

form.quote { overflow: hidden; }
form.quote .left { width: 300px; padding: 0 0 1em; }
form.quote .right { width: 225px; padding: 0 0 1em; }
form.quote h4 { margin: 0 0 2em; border-bottom: 1px solid #EFEFEF; }
form.quote p { overflow: hidden; clear: both; }
form.quote p.type strong { clear: both; display: block; }
form.quote select,
form.quote textarea,
form.quote input.text { display: block; margin: .5ex 0 0; }
form.quote input.checkbox { float: left; clear: left; }
form.quote p.type input { float: left; clear: left; margin-top: .5ex; cursor: pointer; }
form.quote p.type label { float: left; clear: right; margin-top: .5ex; margin-left: 5px; font-weight: 400; }
form.quote .left input.text { width: 295px; }
form.quote .left textarea { width: 295px; }
form.quote .left select { width: 300px; }
form.quote .right input.text { width: 220px; }
form.quote .right input.file { width: 225px; }
form.quote label.checkbox { float: right; width: 525px; color: #888; font-size: .917em; font-weight: 400; }


/*
 * note
 */
.note { margin: 3ex 0 3ex -3ex; padding: 3ex 2em 2ex 80px; border: 1px solid #e6e7e6; background: #f6f8f8 url("../images/icon_21.png") no-repeat 22px 3ex; font-style: italic; }
.note p { padding: 0 0 1ex; }
.note input.text { margin: 0 1ex; vertical-align: middle; }
.note button { vertical-align: middle; }


/*
** Google map
*/
.google-map { height: 290px; }
.google-map #_overview > div { background-color: #FFF !important; }
.google-map p { padding: 0; }
.google-map a { color: #F47F20 !important; }
.google-map a:hover { color: #555 !important; }

.js .google-map { height: 288px; border: 1px solid #C2C2C2; }

.js form.google-directions { padding: 1em 0 0; border-top: 1px solid #EFEFEF; }
.js form.google-directions p.first { padding-left: 35px; background: transparent url("../images/icon_00.png") no-repeat 0 0; line-height: 25px; }
.js form.google-directions p.error { display: none; }
.js form.google-directions label { font-weight: 400; }
.js form.google-directions label em { font-size: .833em; }
.js form.google-directions input { width: 220px; margin-left: 1ex; margin-right: .5ex; }
.js form.google-directions input,
.js form.google-directions button { vertical-align: middle; }


/*
** portfolio
*/
.work { overflow: hidden; margin: 0 0 -25px; padding: 0 0 1px; }
p.work { margin: 0; }

.work ul.navigation { overflow: hidden; list-style: none; margin: 0; padding: 1em 19px 1em 14px; border-bottom: 1px solid #EFEFEF; }
.work ul.navigation li { float: right; padding-left: 5px; font-size: .917em; }
.work ul.navigation a { float: left; padding: 0 0 0 15px; background: transparent url("../images/button_03.png") no-repeat 0 0; color: #888; line-height: 19px; text-transform: lowercase; }
.work ul.navigation a span { float: left; padding: 0 12px 1px 0; background: transparent url("../images/button_03.png") no-repeat 100% 0; }
.work ul.navigation a.alt { padding-left: 12px; background-position: 0 -40px; }
.work ul.navigation a.alt span { padding-right: 15px; background-position: 100% -40px; }
.work ul.navigation a:hover { background-color: #F47E20; background-position: 0 -20px; color: #FFF; }
.work ul.navigation a:hover span { background-position: 100% -20px; }
.work ul.navigation a.alt:hover { background-position: 0 -60px; }
.work ul.navigation a.alt:hover span { background-position: 100% -60px; }

.work .description { float: left; width: 410px; padding: 20px 0 25px 19px; }
.work .description h1 { padding: 0; }
.work .description p { padding: 0 0 1ex; line-height: 1.5; }
.work .description p.date { padding: 0 0 1.2em; color: #888; font-size: .833em; text-transform: uppercase; }
.work .description p.work { margin-left: -12px; padding: 1em 0 0; }

.work .screenshot { float: right; width: 460px; padding: 20px 19px 25px 0; }
.work .screenshot p { position: absolute; padding: 0; }
.work .screenshot div { position: relative; z-index: 2; overflow: hidden; width: 460px; padding: 345px 0 0; background: transparent url("../images/screenshots_border.png") no-repeat 0 0; font-size: .917em; text-align: right; line-height: 17px; }
.work .screenshot div p { position: static; float: left; }
.work .screenshot div.right { width: auto; margin-top: 0; padding: 0; background: transparent; font-size: 1em; }
.work .screenshot .right p { position: static; padding-right: 9px; text-align: right; }
.work .screenshot .right ul { float: left; list-style: none; margin: 0; padding: 0; }
.work .screenshot .right li { float: left; }
.work .screenshot .right a { float: left; width: 18px; margin-left: 1px; background: transparent url("../images/button_04.png") no-repeat 0 0; color: #888; font-size: .909em; text-align: center; }
.work .screenshot .right a.selected,
.work .screenshot .right a:hover { background-color: #000; background-position: 0 100%; color: #FFF; }

.work .projects { clear: both; padding: 25px 19px; border-top: 4px solid #EFEFEF; }
.work .projects h3 { float: left; width: 90px; text-transform: lowercase; }
.work .projects h3.sifr { font-size: 2em; }
.work .projects ul { overflow: hidden; float: left; list-style: none; width: 860px; margin: 0 -40px 0 0; padding: 0; background: transparent url("../images/work_projects_background.png") repeat-y 195px 0; }
.work .projects li { float: left; padding: 0 40px 0 19px; margin-left: -20px; border-left: 1px solid #EDEDED; }
.work .projects li span,
.work .projects li a { float: left; width: 153px; height: 35px; padding: 3px 0 0 22px; background: transparent url("../images/work_projects_item_background.png") no-repeat 0 38px; color: #555; font-size: .917em; /*text-transform: lowercase;*/ }
.work .projects li span strong,
.work .projects li a strong { overflow: hidden; display: block; width: 150px; margin: 0 0 -1px; color: #F47F20; font-size: 1.273em; font-weight: 400; text-transform: none; white-space: nowrap; }
.work .projects li a:hover { background-color: #000; background-position: 0 0; color: #777; }
.work .projects li a:hover strong { color: #FFF; }
.work .projects li span { background-color: #F0F0CB; background-position: 0 -38px; }
.work .projects li span strong { color: #000; }
.work .projects div.ehm { overflow: hidden; }

.work .projects .navigation { position: relative; top: 1px; float: right; padding: 0 0 0 5px; background: transparent url("../images/work_projects_navigation_background.png") no-repeat 0 0; color: #888; font-size: .917em; line-height: 2; word-spacing: 1ex; white-space: nowrap; }
.work .projects .navigation p { padding: 0 15px 0 10px; background: transparent url("../images/work_projects_navigation_background.png") no-repeat 100% 0; }
.work .projects .navigation a { font-weight: 700; word-spacing: normal; }
.work .projects .navigation a:hover { color: #F47F20; text-decoration: underline; }
.work .projects .navigation a.next { padding-right: 7px; background: transparent url("../images/bullet_04.png") no-repeat 100% 60%; }
.work .projects .navigation a.previous { padding-left: 7px; background: transparent url("../images/bullet_06.png") no-repeat 0 60%; }
.work .projects .navigation span.next { padding-right: 7px; background: transparent url("../images/bullet_05.png") no-repeat 100% 60%; }
.work .projects .navigation span.previous { padding-left: 7px; background: transparent url("../images/bullet_07.png") no-repeat 0 60%; }

p.work-big { position: absolute; left: 50%; top: 0; z-index: 11; width: 300px; margin-left: -150px; padding: 1em; background: #000; color: #FFF; line-height: 1; }
p.work-big img { position: relative; margin-top: -1em; }


/*
** testimonials
*/
.testimonials { padding: 24px 24px 24px 29px; border: 1px solid #EFEFEF; border-width: 0 1px 1px 0; }
.testimonials ul { list-style: none; margin: 0; padding: 0; }
.testimonials li { padding: 1em 0 0; }
.testimonials blockquote { padding: 0; background: transparent; font-style: normal; }
.testimonials h4 { padding: 0 0 1ex; color: #000; font-size: 1.25em; line-height: 1.2; }
.testimonials h4 em { display: block; color: #888; font-size: .8em; font-weight: 400; font-style: normal; }
.testimonials p { padding: 0 0 1ex; }

.js .testimonials ul { position: relative; }
.js .testimonials li { position: absolute }
.js .testimonials ul.numbers { overflow: hidden; margin: 0 0 0; line-height: 17px; }
.js .testimonials ul.numbers li { position: static; float: left; }
.js .testimonials ul.numbers a { float: left; width: 18px; margin-left: 1px; background: transparent url("../images/button_04.png") no-repeat 0 0; color: #888; font-size: .909em; text-align: center; }
.js .testimonials ul.numbers a.selected,
.js .testimonials ul.numbers a:hover { background-color: #000; background-position: 0 100%; color: #FFF; }
.js .testimonials p,
.js .testimonials h4 { background-color: #FFF; }


/*
** welcome box
*/
.welcome { position: relative; padding: 1em 0; background: #161616; color: #808080; font-size: .917em; }
.welcome p { position: relative; width: 866px; margin: 0 auto; padding: 11px 33px 11px 11px; background: #000; }
.welcome em { color: #FFF; }
.welcome a { background: transparent; }
.welcome a.alt { color: #B2B2B2; }
.welcome a:hover { color: #FFF; }
.js .welcome a.close { position: absolute; z-index: 1; right: 11px; top: 13px; overflow: hidden; float: right; width: 11px; height: 11px; background: transparent url("../images/button_07.png") no-repeat 0 0; text-indent: -999em; }
.js .welcome a.close:hover { background-position: 0 100%; }


/*
** press section
*/
.media { overflow: hidden; margin: 0 0 2em; border-bottom: 1px dotted #CCC; }
.media .left { width: 250px; }
.media .right { width: 292px; }
.media p { padding: 0 0 1ex; }
.media p.logo { height: 152px; line-height: 152px; }
.media p.logo img { border: 1px solid #E5E5E5; vertical-align: middle; }
.media em { font-size: .75em; font-style: normal; }
.media a { margin: 0 .5ex; }


/*
** tooltips
*/
p#tooltip { position: absolute; padding: 0 0 0 15px; background: transparent url("../images/tooltip_left.png") no-repeat 0 0; color: #FFF; font-size: .833em; line-height: 26px; text-transform: uppercase; }
p#tooltip span { display: block; padding: 0 10px 0 0; background: transparent url("../images/tooltip_right.png") no-repeat 100% 0; }

p#tooltip-alt { position: absolute; z-index:13; padding: 0 0 0 15px; background: transparent url("../images/tooltip_alt_left.png") no-repeat 0 0; color: #000; font-size: .917em; line-height: 26px; }
p#tooltip-alt span { display: block; padding: 0 10px 0 0; background: transparent url("../images/tooltip_alt_right.png") no-repeat 100% 0; }

p#tooltip2-alt { position: absolute; z-index:13; padding: 0 0 0 15px; background: transparent url("../images/gallery/tooltip2_alt_left.png") no-repeat 0 0; color: #000; font-size: .917em; line-height: 23px; }
p#tooltip2-alt span { display: block; padding: 0 10px 0 0; background: transparent url("../images/gallery/tooltip2_alt_right.png") no-repeat 100% 0; color: #fff; }


/*
** misc. styles
*/
a.bullet-00 { padding-left: 18px; background: transparent url("../images/bullet_00.png") no-repeat 0 50%; }
a.bullet-00:hover { background-position: -999px 50%; }
.js a.bullet-00 { background-image: url("../images/bullet_00_b.png"); }

a.button-00 { float: left; padding: 0 0 0 8px; background: #000 url("../images/button_00.png") no-repeat 0 0; color: #FFF !important; font-size: 10px !important; text-transform: uppercase; line-height: 17px; }
a.button-00 span { float: left; padding: 0 16px 0 0; background: transparent url("../images/button_00.png") no-repeat 100% 0; }
a.button-00:hover { color: #F47F20 !important; }
a.button-00:hover span { background-position: 100% -34px; }

.header a.button-00 { background-position: 0 -17px; }
.header a.button-00 span { background-position: 100% -17px; }
.header a.button-00:hover span { background-position: 100% -51px; }

button.button-02 { height: 26px; padding: 0; border: none; background: transparent; color: #FFF; font-size: .833em; text-transform: uppercase; }
button.button-02 span { float: left; padding: 0 0 0 8px; background: #838383 url("../images/button_02.png") no-repeat 0 0; line-height: 26px; white-space: nowrap; }
button.button-02 span span { padding: 0 8px 0 0; background-position: 100% 0; }

form.search button.button-02 span { background-position: 0 100%; }
form.search button.button-02 span span { background-position: 100% 100%; }

a.button-05 { float: left; padding: 0 0 0 10px; background: #000 url("../images/button_05.png") no-repeat 0 0; color: #FFF !important; font-size: 11px !important; line-height: 19px; }
a.button-05 span { float: left; padding: 0 20px 1px 0; background: transparent url("../images/button_05.png") no-repeat 100% 0; }
a.button-05:hover { color: #F47F20 !important; }

.address { padding: 24px 25px 35px 29px; }
.address h3 { padding: 0; color: #000; font-size: 1.167em; text-transform: uppercase; }
.address address { padding-bottom: 1ex; }
.address p { padding-bottom: 0; }
.address .contact-options { padding: 1em 0 0; }
.address .contact-options h4,
.address .contact-options p { padding-bottom: 1ex; }
.address .icon { padding-top: 1.2em; padding-left: 64px; }
.address .icon p { padding-bottom: .75ex; }

.icon { min-height: 64px; margin-left: -12px; padding: 1em 0 0 81px; background: transparent none no-repeat 0 1.2ex; }
.icon-offer { height: 14.5em !important; margin: -2.1em 0 0 !important; padding-top: 2.1em; padding-bottom: 1em; border-top: 1px solid #efefef; }
.icon-big-left { float: left; padding: 1em 3em 1em 0; }
.icon-big-right { float: right; padding: 1em 0 1em 3em; }
.icon p.icon { float: left; margin: 0 0 0 -81px !important; padding: 0; }
.icon h3 { padding: 0 0 1ex !important; }
.js .icon h3.sifr { padding: 0 0 .5ex !important; }
.icon-01 { background-image: url("../images/icon_01.png") !important; }
.icon-02 { background-image: url("../images/icon_02.png") !important; }
.icon-03 { background-image: url("../images/icon_03.png") !important; }
.icon-04 { background-image: url("../images/icon_04.png") !important; }
.icon-05 { background-image: url("../images/icon_05.png") !important; }
.icon-06 { background-image: url("../images/icon_06.png") !important; }
.icon-07 { background-image: url("../images/icon_07.png") !important; }
.icon-08 { background-image: url("../images/icon_08.png") !important; }
.icon-09 { background-image: url("../images/icon_09.png") !important; }
.icon-10 { background-image: url("../images/icon_10.png") !important; }
.icon-11 { background-image: url("../images/icon_11.png") !important; }
.icon-12 { background-image: url("../images/icon_12.png") !important; }
.icon-13 { background-image: url("../images/icon_13.png") !important; }
.icon-14 { background-image: url("../images/icon_14.png") !important; }
.icon-15 { background-image: url("../images/icon_15.png") !important; }
.icon-16 { background-image: url("../images/icon_16.png") !important; }
.icon-17 { background-image: url("../images/icon_17.png") !important; }
.icon-18 { background-image: url("../images/icon_18.png") !important; }
.icon-19 { background-image: url("../images/icon_19.png") !important; }

textarea,
input.text { padding: 5px 0 5px 3px; border: 1px solid #E1E1E1; border-left-color: #D6D6D6; border-top-color: #CBCBCB; background: #FFF url("../images/text_background.png") no-repeat 0 0; color: #000; }

p.error { margin: -1ex 0 0; padding: 0 0 1em 20px; background: transparent url("../images/bullet_01.png") no-repeat 0 1px; font-size: .917em; }
p.error label,
p.error label:hover { color: #CB1111; font-weight: 400; }

div.error { min-height: 145px; padding: 165px 140px 0 450px; background: transparent none no-repeat 95px 30px; }
div.error-404 { background-image: url("../images/404.jpg"); }

p.brochure { padding: 20px 0 20px 34px; border-bottom: 1px solid #EFEFEF; line-height: 1; }
p.brochure a { background: transparent; }

a.image { background: transparent; }
a.image img { vertical-align: middle; }

.sidebar { padding: 24px 24px 34px 29px; border: 1px solid #EFEFEF; border-width: 0 1px 1px 0; }

.spread li { padding-bottom: 1.5ex; }

.js div.more { display: none; }

.js .overlay { position: fixed; left: 0; top: 0; z-index: 100; width: 100%; height: 100%; background: #000; }
.js .overlay-loading { background: #000 url("../images/gallery/loading.gif") no-repeat 50% 50%; }
.js .overlay-hidden { display: none; }


/*
 * Gallery
 */
#gallery { position: absolute; left: 0; top: 0; z-index: 101; width: 100%; }
#gallery .navigation { position: fixed; left: 0; top: 0; z-index: 12; width: 100%; padding: 12px 0 0; background: #000 url("../images/gallery/navigation_background.png") repeat-x 0 0; color: #fff; }
#gallery .navigation .tabs { width: 940px; margin: 0 auto; }
#gallery .navigation .tabs ul { overflow: hidden; float: left; list-style: none; margin: 0 0 0 -15px; padding: 0; }
#gallery .navigation .tabs li { position: relative; float: left; }
#gallery .navigation .tabs li a { float: left; padding: 0 15px; background: transparent url("../images/gallery/navigation_tab_background.png") no-repeat -1000% -1000%; color: #fff; font-weight: 700; line-height: 35px; text-transform: uppercase; }
#gallery .navigation .tabs li a.active,
#gallery .navigation .tabs li a:hover { background: #f37c20 url("../images/gallery/navigation_tab_background.png") repeat-x 0 0; }
#gallery .navigation .tabs p { padding: 0; line-height: 35px; }
#gallery .navigation .tabs p a { padding-left: 11px; background: transparent url("../images/gallery/back_bullet.png") no-repeat 0 60%; font-weight: 700; text-transform: uppercase; }
#gallery .navigation .tabs p a:hover { background-position: -496px 60%; color: #fff; }

#gallery .navigation .slider { position: relative; overflow: hidden; clear: both; height: auto; border-top: 1px solid #f37c20; background: #be4704 url("../images/gallery/slider_background.png") repeat-x 0 100%; }
#gallery .navigation .slider-child { position: relative; width: 1010px; height: 162px; margin: -162px auto 0; zoom: 1; }
#gallery .navigation .slider .clip { position: absolute; bottom: 18px; left: 35px; overflow: hidden; float: left; width: 940px; padding: 18px 0 0; }
#gallery .navigation .slider ul { position: relative; left: 0; overflow: hidden; display: none; list-style: none; width: 99999px; margin: 0 0 0 70px; padding: 0; }
#gallery .navigation .slider ul.active { display: block; }
#gallery .navigation .slider li { float: left; padding: 0 10px; }
#gallery .navigation .slider li a { position: relative; overflow: hidden; float: left; width: 140px; }
#gallery .navigation .slider li a img { position: relative; left: -40px; background: transparent url("../images/gallery/loading_alt.gif") no-repeat 50% 50%; }
#gallery .navigation .slider li a:hover span { position: absolute; top: 0; left: 0; float: left; width: 140px; height: 125px; background: transparent url("../images/gallery/thumbnail.png") no-repeat 0 100%; }
#gallery .navigation .slider p { width: 35px; padding: 68px 0 0; }
#gallery .navigation .slider p a { overflow: hidden; float: left; width: 18px; height: 25px; background: transparent url("../images/gallery/slider_navigation.png") no-repeat 0 0; text-indent: -99em; }
#gallery .navigation .slider p.right a { float: right; background-position: 100% 0; }
#gallery .navigation .slider p.left a:hover { background-position: 0 100%; }
#gallery .navigation .slider p.right a:hover { background-position: 100% 100%; }
#gallery .navigation .slider .fade-right,
#gallery .navigation .slider .fade-left { position: absolute; top: 18px; left: 0; width: 70px; height: 125px; background: transparent url("../images/gallery/slider_fade_left.png") no-repeat 0 0; }
#gallery .navigation .slider .fade-right { left: auto; right: 0; background: transparent url("../images/gallery/slider_fade_right.png") no-repeat 0 0; }

#gallery .project { position: fixed; top: 50%; left: 50%; z-index: 11; display: none; width: 940px; height: 46px; margin: -23px 0 0 -470px; }
#gallery .project p { float: left; padding: 0; }
#gallery .project p.next { float: right; }
#gallery .project p.prev a,
#gallery .project p.next a { overflow: hidden; float: left; width: 34px; height: 46px; background: transparent url("../images/gallery/navigation.png") no-repeat 0 0; text-indent: -99em; }
#gallery .project p.next a { background-position: 100% 0; }
#gallery .project p.prev a:hover { background-position: 0 100%; }
#gallery .project p.next a:hover { background-position: 100% 100%; }

#gallery .preview { position: absolute; left: 50%; top: 0; z-index: 11; display: none; width: 820px; min-height: 66px; margin: 0 0 0 -410px; padding: 82px 0 0; font-size: .917em; }
#gallery .preview img { position: relative; z-index: 1; display: block; padding: 0 0 100px; }
#gallery .preview img.new { z-index: 2; }
#gallery .preview p.back { float: right; padding: 0 0 6px; }
#gallery .preview p.back a { float: left; padding-left: 20px; background: transparent url("../images/gallery/back.png") no-repeat 0 50%; color: #fff; line-height: 20px; }
#gallery .preview p.back a:hover { color: #f47f20; }
#gallery .preview p.visit { float: left; padding: 0 0 6px; line-height: 20px; }
#gallery .preview p.visit a { float: left; padding-right: 10px; background: transparent url("../images/gallery/visit_bullet.png") no-repeat 100% 0; color: #fff; }
#gallery .preview p.visit a:hover { color: #f47f20; background-position: 100% 100%; }
#gallery .preview ul.tabs { float: left; clear: none; list-style: none; margin: 0; padding: 0 17px 6px 0; }
#gallery .preview ul.tabs li { padding-right: 1px; }
#gallery .preview ul.tabs li.description { padding-right: 6px; }
#gallery .preview ul.tabs li.description a { width: auto; padding: 0 22px; }
#gallery .preview ul.tabs a { width: 22px; padding: 0; background: #393939 url("../images/gallery/preview_tabs_background.png") no-repeat 0 0; color: #fff; line-height: 20px; text-align: center; }
#gallery .preview ul.tabs a.active,
#gallery .preview ul.tabs a:hover { background-color: #f27b1f; background-position: 100% 0; color: #fff; }
#gallery .preview div.description { margin: 0; padding: 0 40px; border: 1px solid #3b3b3b; border-bottom: none; background:#000; color: #aaa; line-height: 1.2; }
#gallery .preview div.description-active { position: relative; }
#gallery .preview div.description h3 { padding: 20px 0 0; color: #fff; font-size: 1.909em; font-weight: 700; text-transform: uppercase; }
#gallery .preview div.description img { display: inline; padding: 0; }
#gallery .preview div.description p.date { color: #777; text-transform: uppercase; }
#gallery .preview div.description p.tooltip-alt img { margin: 5px 15px 10px 0; }
#gallery .preview p.loading { position: fixed; top: 50%; left: 50%; z-index: 3; display: none; width: 31px; height: 31px; padding: 15px; margin: -30px 0 0 -30px; background: transparent url("../images/gallery/loading_background.png") no-repeat 0 0; }
#gallery .preview p.loading img { width: 31px; height: 31px; }

#gallery .thumbnails { position: absolute; left: 50%; top: 0; width: 940px; margin: 0 0 0 -470px; padding: 48px 0 100px; color: #fff; }
#gallery .thumbnails p.close { float: right; padding: 4.1em 0 0; }
#gallery .thumbnails p.close a { float: left; padding: 0 10px 0 33px; background: #1b1b1b url("../images/gallery/close.png") no-repeat 10px 50%; color: #ccc; font-weight: 700; line-height: 21px; text-transform: uppercase; }
#gallery .thumbnails h1 { padding: 1em 0 0; font-size: 3.333em; font-weight: 400; }
#gallery .thumbnails h1 em { color: #f47d20; font-style: normal; }
#gallery .thumbnails h2 { padding: 1em 0 0; font-size: 1.75em; font-weight: 400; text-transform: lowercase; }
#gallery .thumbnails ul { overflow: hidden; list-style: none; margin: 0 0 0 -20px; padding: 0; }
#gallery .thumbnails li { float: left; padding: 15px 0 0 20px; }
#gallery .thumbnails li a { position: relative; float: left; width: 220px; height: 125px; background: transparent !important; }
#gallery .thumbnails li a img { width: 220px; height: 125px; background: transparent url("../images/gallery/loading.gif") no-repeat 50% 50%; }
#gallery .thumbnails li a span { position: absolute; top: 0; left: 0; float: left; width: 220px; height: 125px; background: transparent url("../images/gallery/thumbnail_big.png") no-repeat 0 0; }
#gallery .thumbnails li a:hover span { background-position: 0 100%; }


/*
** date picker
*/
.datepicker { position: absolute; top: 0; left: 0; display: none; padding: 4px; border: 2px solid #000; background: #FFF; }
.datepicker a { background: transparent; }
.datepicker a:hover { background: #000; color: #FFF; }
.datepickerHidden { display: none; }
.datepicker table { border-collapse: collapse; }
.datepicker a { color: #000; text-decoration: none; outline: none; }
.datepicker table td { margin: 0; padding: 0; text-align: right; }
.datepicker th { color: #999; font-weight: normal; text-align: center;}
.datepicker tbody th { text-align: left; }
.datepicker tbody a { display: block; }
.datepickerDays a { width: 20px; padding: 2px; }
.datepickerYears a,
.datepickerMonths a { width: 44px; height: 36px; line-height: 3; text-align: center; }
td.datepickerNotInMonth a { color: #666; }
tbody.datepickerDays td.datepickerSelected { background: #000; }
tbody.datepickerDays td.datepickerSelected a {color: #FFF; }
div.datepicker td.datepickerNotInMonth a:hover { color: #999; }
div.datepicker tbody th { text-align: left; }
.datepickerSpace div { width: 20px; }
.datepickerGoNext a,
.datepickerGoPrev a,
.datepickerMonth a { height: 20px; line-height: 20px; text-align: center; }
.datepickerGoNext a { float: right; width: 20px; }
.datepickerGoPrev a { float: left; width: 20px; }
table.datepickerViewDays tbody.datepickerMonths,
table.datepickerViewDays tbody.datepickerYears,
table.datepickerViewMonths tbody.datepickerDays,
table.datepickerViewMonths tbody.datepickerYears,
table.datepickerViewMonths tr.datepickerDoW,
table.datepickerViewYears tbody.datepickerDays,
table.datepickerViewYears tbody.datepickerMonths,
table.datepickerViewYears tr.datepickerDoW { display: none; }
td.datepickerDisabled a,
td.datepickerDisabled.datepickerNotInMonth a { color: #333; }
td.datepickerDisabled a:hover { color: #333; }
td.datepickerSpecial a { background: #700; }


/*
** high contrast styles
*/
.hc { background: #FFF; color: #000; }

.hc * { border-color: #000 !important; }

.hc a { color: #0B83DF; background: transparent; }
.hc a:hover { color: #0B83DF; text-decoration: underline; }

.hc label em { color: #F00; }

.hc .sifr span { display: inline !important; margin: 0 !important; }
.hc .sifr embed { display: none !important; width: 0; height: 0; }

.hc .content h2.sifr { line-height: 1; }
.hc .content h3.sifr { padding: 0 0 1ex; line-height: 1; letter-spacing: 0; }
.hc .header ul.two-columns h3.sifr { padding: 0; font-size: 1.917em; }
.hc ul.three-columns h4.sifr { font-size: 1.583em; }
.hc .work .description h2.sifr { padding: 0; line-height: 1; }
.hc .work .projects h3.sifr { font-size: 1.5em; }

.hc .header * { border-color: #FFF !important; }

.hc .header ul.links a { background: transparent; color: #FFF; }
.hc .header ul.links a strong { color: #F47F20; }

.hc .header ul.menu a img { display: none; }

.hc ul.three-columns { background-image: url("../images/three_columns_background_hc.png") !important; }

.hc .content hr { background: #000; }

.hc .work .projects li span strong,
.hc .work .projects li a strong,
.hc .work ul.navigation a:hover,
.hc ul.tabs a.selected,
.hc .footer a,
.hc p.location strong { color: #0B83DF; }

.hc .footer ul.left li.first { border-color: #FFF !important; }

.hc .intro .navigation { background: #000; color: #FFF; }
.hc .intro .content h2 { font-size: 1.75em; }
.hc .intro .content a { background: transparent; }
.hc .intro .content a:hover { color: #A8B934; }

.hc ul.clients { background-image: url("../images/clients_background_hc.png"); }

.hc .note { background: transparent; }

.hc ul.tabs strong,
.hc ul.tabs a,
.hc ul.tabs span { background-image: url("../images/tab_hc.png"); }

.hc .work ul.navigation a { color: #0B83DF; background: transparent; }
.hc .work ul.navigation a span { background: transparent; }

.hc .testimonials ul.numbers a,
.hc .work .screenshot div a { background-image: url("../images/button_04_hc.png"); color: #000; }

.hc .work .projects li span strong,
.hc .header ul.menu a,
.hc .header,
.hc .site-map a,
.hc .presentation p.ruler a,
.hc .presentation .content p.info,
.hc .testimonials ul.numbers a.selected,
.hc .testimonials ul.numbers a:hover,
.hc .work .screenshot div a.selected,
.hc .work .screenshot div a:hover { color: #FFF; }

.hc .work .projects li span,
.hc .work .projects li a { background: transparent; color: #000; }
.hc .work .projects li a:hover { background: #000; color: #FFF; }
.hc .work .projects li a:hover strong { color: #FFF; }
.hc .work .projects li span { background: #000; color: #FFF; }

.hc .datepicker a,
.hc p.location,
.hc p.location a,
.hc .footer,
.hc .work .description p.date,
.hc .sidebar p.after-list a,
.hc form.quote label.checkbox,
.hc form.write label.checkbox { color: #000; }

.hc a.bullet-00 { background: transparent url("../images/bullet_00_b.png") no-repeat -999px 50% !important; }

.hc a.button-00 { background: #000 url("../images/button_00.png") no-repeat 0 0; }
.hc .header a.button-00 { background-position: 0 -17px; }

.hc button.button-02 span { background: #000 url("../images/button_02_hc.png") no-repeat 0 0; }
.hc button.button-02 span span { background-position: 100% 0; }

.hc .post-footer { background: #FFF; color: #000; }

.hc .welcome { color: #FFF; }
.hc .welcome a { color: #F47F20; }


/*
 * Playing cards
 */
div.cards { overflow: hidden; clear: both; margin: 0 -5px 0 0; }
div.cards .column { float: left; width: 237px; }
div.cards .column div.card { position: relative; z-index: 2; width: 236px; height: 271px; padding: 10px 0 0; background: transparent url("../images/cards.png") no-repeat 21px 10px; }
div.cards .column div.card img { position: absolute; left: 114px; top: 19px; width: 236px; height: 271px; margin-left: -118px; }
div.cards .column div.card img.deck { width: 0; margin-left: 0; }
div.cards .column div.content { position: relative; z-index: 1; overflow: hidden; width: 237px; margin-top: -235px; padding: 240px 0 0; background: #000 url("../images/cards_content_background.png") no-repeat 0 0; }
div.cards .column div.content div { padding: 0 30px 30px; background: transparent url("../images/cards_content_background.png") no-repeat 0 100%; color: #8a8a8a; font-size: .917em; }
div.cards .column div.content div p { padding-bottom: 1ex; }
div.cards .column div.content a:hover { background-position: -2048px 100%; color: #fff; }
div.cards .column div.content a:active { background-position: 0 100%; color: #555; }
div.cards .column h2 { padding-bottom: 1ex; color: #fff; font-size: 1.545em; font-weight: 900; }

.js div.cards .column div.card img { cursor: pointer; }
.js div.cards .column div.card img.deck { width: 236px; margin-left: -118px; }
.js div.cards .column div.card img.card { width: 0; margin-left: 0; }
.js div.cards .column div.card h2 { position: absolute; left: 50%; top: 50%; z-index: 3; display: none; width: 148px; margin-left: -78px; padding: 0; font-size: 1.333em; font-style: italic; line-height: 18px; text-align: center; cursor: pointer; }
.js div.cards .column div.card div.question { position: absolute; top: 19px; left: 19px; z-index: 3; width: 190px; height: 250px; background: transparent url("../images/card_name.png") no-repeat 50% 43%; cursor: pointer; }
.js div.cards .column div.card:hover h2 { display: block; }
.js div.cards .column div.card:hover div.question { display: none; }
.js div.cards .column .opening div.card h2,
.js div.cards .column .opening div.card div.question,
.js div.cards .column .active div.card h2,
.js div.cards .column .active div.card div.question { display: none !important; }
.js div.cards .column div.content-hidden { position: fixed; visibility: hidden; }
.js div.cards .column .opening div.content { height: 10px; margin-top: -20px; padding-top: 10px; }
.js div.cards .column div.content div { overflow: hidden; }
.js div.cards .column .opening div.content div { height: 0; padding-bottom: 10px; }
.js div.cards .column div.content p.close { position: absolute; bottom: 0; right: 20px; float: left; padding: 0; }
.js div.cards .column div.content p.close a { overflow: hidden; float: left; width: 36px; height: 18px; background: #f47f20 url("../images/cards_content_close.png") no-repeat 0 0; text-indent: -99em; }
.js div.cards .column .opening div.content p.close,
.js div.cards .column div.content-hidden p.close { display: none; }


/*
 * Side column boxes (Django/Zend/Drupal)
 */
.box { width: 200px; height: 130px; margin: 20px 0 0 30px; padding: 15px 40px 0 25px; background: transparent none no-repeat 0 0; color: #fff; font-size: .917em; }
.box h3 { color: #fff; font-size: 1.727em; font-weight: 400; font-style: italic; }
.js .box h3 { font-size: 1.909em; }
.box a.button { display: inline-block; background: transparent url("../images/box_buttons.png") repeat-y 0 0; color: #fff; line-height: 20px; }
.box a.button:hover span { text-decoration: underline; }
.box a.button span { position: relative; left: 10px; display: inline-block; padding-right: 20px; padding-bottom: 1px; background: transparent url("../images/box_buttons.png") repeat-y 100% 0; line-height: 19px; vertical-align: top; }
.box-zend { background-color: #64af05; background-image: url("../images/box_zend.png"); color: #d2e9b4; }
.box-django { background-color: #346b57; background-image: url("../images/box_django.png"); color: #c4d5cf; }
.box-django a.button { background-position: 0 -20px; }
.box-django a.button span { background-position: 100% -20px; }
.box-drupal { background-color: #39b1cc; background-image: url("../images/box_drupal.png"); color: #c4e8f0; }
.box-drupal a.button { background-position: 0 -40px; }
.box-drupal a.button span { background-position: 100% -40px; }


/*
 * Flickr photos gallery
 */
p.flickr { float: right; clear: right; width: 255px; margin-top: -4em; padding: 0 20px 1em 3ex; font-size: .917em; }
p.flickr img { display: block; margin-bottom: 1ex; border-bottom: 1px solid #efefef; }
p.flickr a { color: #999; background: transparent; font-style: italic; }
p.flickr a span { color: #f47f20; font-size: .818em; font-style: normal; }

.two-columns p.flickr { margin-top: 0; }

.modal-flickr { position: fixed; left: 50%; top: 50%; z-index: 101; width: 500px; height: 375px; margin: -187px 0 0 -250px; }



/*
** the end
*/