* { margin: 0; padding: 0; }
body { background-color: #373839; font-family: Tahoma, Verdana, Geneva, Arial, sans-serif; color: #333; font-size: 83%; line-height: 1.6em; }

a { color: #0B869F; }
a:hover { color: #0956C2; }
a:active { color: #f00; }

div.portfolio { line-height: 0; width: 468px; margin-top: 8px; }
div.portfolio a { display: block; width: 140px; height: 90px; float: left; padding: 1px; border: 1px solid #ccc; margin: 4px 12px 4px 0; border-bottom-color: #999; border-right-color: #999; }
div.portfolio a:hover { border-color: #0956C2; }
div.portfolio a:active { border-color: #f00; }
div.portfolio img { border: 0; }

img.float { float: left; margin: 13px 13px 4px 0; }

h2, h3 { border-bottom: 1px dotted #d7d7d7; background-repeat: no-repeat; height: 15px; overflow: hidden; text-indent: -9999px; }
h2 { margin-top: 52px; }
h3 { margin-top: 24px; }

h2.home { background-image: url(/images/h2_home.gif); }
h2.about { background-image: url(/images/h2_about.gif); }
h2.services { background-image: url(/images/h2_services.gif); }
h2.portfolio { background-image: url(/images/h2_portfolio.gif); }
h2.contact { background-image: url(/images/h2_contact.gif); }
h2.sent { background-image: url(/images/h2_sent.gif); }
h2.error_404 { background-image: url(/images/h2_error_404.gif); }
h2.validate { background-image: url(/images/h2_validate.gif); }

h3.home { background-image: url(/images/h3_home.gif); }
h3.about { background-image: url(/images/h3_about.gif); }
h3.services { background-image: url(/images/h3_services.gif); }
h3.error_404 { background-image: url(/images/h3_error_404.gif); }
h3.validate { background-image: url(/images/h3_validate.gif); }

input, textarea { border: 1px solid #999; border-bottom-color: #ccc; border-right-color: #ccc; font: 90% "Lucida Console", monaco, monospace; padding: 2px; }
input.button { border: 0; padding: 0; margin-top: 7px; }

p { margin-top: 8px; }

table { border-collapse: collapse; }
table.contact { margin-top: 10px; }
table.contact th { font-weight: normal; text-align: left; line-height: 1.8em; }

textarea { margin-top: 3px; }

ul { list-style-position: inside; list-style-image: url(/images/checkmark.gif); margin-top: 5px; }

/* Logo
----------------------------------------------------------*/
#prelogo { background-color: #4F5052; height: 15px; border-bottom: 3px solid #434446; overflow: hidden; }
#logo { background: url(/images/bg_logo_left.jpg); height: 124px; border-top: 1px solid #EAEAEA; border-bottom: 1px solid #FFF; overflow: hidden; }
#logo_right { background: url(/images/bg_logo_right.jpg); width: 50%; height: 124px; float: right; }
#logo_main { width: 100%; height: 124px; float: left; margin-top: -124px; }
#logo_main h1 { background: url(/images/x3_logo.jpg) no-repeat 15px 0; width: 696px; height: 124px; margin: 0 auto; text-indent: -9999px; }

/* Navigation
----------------------------------------------------------*/
#nav { background: url(/images/bg_nav.jpg) repeat-x; height: 65px; border-bottom: 1px solid #000; }
#nav ul { width: 707px; margin: 0 auto; list-style: none; }
#nav li { float: left; }

#nav a { background-repeat: no-repeat; background-position: 17px 17px; display: block; height: 60px; text-indent: -9999px; overflow: hidden; }
#nav a.active, #nav a:hover { background-position: 0 3px; }

#nav #b1 { background-image: url(/images/b1_off.jpg); width: 143px; }
#nav #b2 { background-image: url(/images/b2_off.jpg); width: 141px; }
#nav #b3 { background-image: url(/images/b3_off.jpg); width: 142px; }
#nav #b4 { background-image: url(/images/b4_off.jpg); width: 140px; }
#nav #b5 { background-image: url(/images/b5_off.jpg); width: 141px; }

#nav #b1.active, #nav #b1:hover { background-image: url(/images/b1_on.jpg); }
#nav #b2.active, #nav #b2:hover { background-image: url(/images/b2_on.jpg); }
#nav #b3.active, #nav #b3:hover { background-image: url(/images/b3_on.jpg); }
#nav #b4.active, #nav #b4:hover { background-image: url(/images/b4_on.jpg); }
#nav #b5.active, #nav #b5:hover { background-image: url(/images/b5_on.jpg); }

/* Content
----------------------------------------------------------*/
#main { background: url(/images/bg_main_left.jpg); height: 434px; }
#main_right { background: url(/images/bg_main_right.jpg); width: 50%; height: 434px; float: right; }
#main_center { width: 100%; height: 434px; float: left; margin-top: -434px; }
#main_group { background: #eee url(/images/bg_main_center.jpg) no-repeat 318px 0; width: 748px; height: 434px; margin: 0 auto; position: relative; }

#content { position: absolute; width: 430px;  top: 0; left: 318px; }

/* Footer
----------------------------------------------------------*/
#prefooter { background-color: #EEE; height: 1px; border-bottom: 1px solid #4F5052; overflow: hidden; }
#footer { background: url(/images/bg_footer.gif) repeat-x; height: 98px; border-top: 3px solid #434446; }
#copyright { background: url(/images/copyright.png) no-repeat 0 46px; width: 686px; height: 57px; text-indent: -9999px; margin: 0 auto; }

#preload { display: none; }