
/*-------[ general ]---------------------*/

body {
background:url(images/bg.gif);
margin:100px 0 30px 0;
font:11px Arial, Tahoma, Sans-Serif;
color:#999;
}
p,ul,ol,h1,h2,h3,h4,blockquote,fieldset,form {
margin:0;
padding:0;
}
a {
text-decoration:none;
outline:none;
color:#54859E;
}
a:hover {
color:#fff;
}
img {
border:none;
}
.img-left {
float:left;
border:1px solid #26292B;
padding:2px;
margin:3px 7px 2px 0;
}
.img-right {
float:left;
border:1px solid #26292B;
padding:2px;
margin:3px 0 2px 7px;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#tooltip {
position:absolute;
border:1px solid #0a0a0a;
background:#1A1D1E;
color:#999;
display:none;
}
#tooltipX {
border:1px solid #26292B;
padding:5px 10px;
}
#screenshot {
position:absolute;
display:none;
border:1px solid #0a0a0a;
}
#screenshotX {
border:1px solid #2F3335;
padding:5px;
background:#111;
}
#screenshot img {
display:block;
}
#screenshot span {
display:block;
border-bottom:1px solid #2F3335;
margin:-5px -5px 5px -5px;
padding:5px;
font-size:13px;
background:#1F2223;
}
.ie7 #works {
padding-bottom:20px;
}
.ie7 #networks {
padding-bottom:10px;
}
.ie6 #navigation li a, .ie7 #navigation li a {
padding-bottom:5px;
}
.ie6 #navigation li a span {
cursor:pointer;
}
.ie6 #networks li a {
height:1%;
}
.ie6 #networks {
margin-right:-20px;
}
.ie6 #works {
margin-right:-40px;
}
.ie6 #logo {
margin:20px 20px 0 10px;
height:7px;
overflow:hidden;
}
.ie6 #contact-information {
width:210px;
}

/*-------[ container ]---------------------*/

#container {
margin:0 auto;
width:502px;
border:1px solid #161616;
}

/*-------[ canvas ]---------------------*/

#canvas {
background:#0F0F0F;
border:1px solid #26292B;
width:500px;
}

/*-------[ header ]---------------------*/

#header {
height:50px;
width:500px;
background:#1A1D1E;
border-bottom:1px solid #26292B;
}

/*-------[ logo ]---------------------*/

#logo {
float:left;
margin:23px 20px 0 20px;
text-indent:-9999pt;
}
#logo a {
background:url(images/logo.gif) no-repeat;
width:91px;
height:21px;
display:block;
}

/*-------[ navigation ]---------------------*/

#navigation {
list-style:none;
float:right;
margin:15px 8px 0 0;
}
#navigation li {
float:left;
margin-right:6px;
}
#navigation li a {
background:url(images/buttons.gif) repeat-x;
padding:6px 10px 6px 10px;
font-size:11px;
text-transform:uppercase;
display:block;
border:1px solid #090909;
}
#navigation li a:hover, .selected {
background:url(images/buttons.gif) 0 -19px repeat-x !important;
}
#navigation li a span {
display:block;
height:7px;
text-indent:-9999pt;
overflow:hidden;
}
#navigation li a:hover span, .selected2 {
background-position:0 -7px !important;
}
#home-button {
background:url(images/home.gif) no-repeat;
width:20px;
}
#files-button {
background:url(images/files.gif) no-repeat;
width:20px;
}
#account-button {
background:url(images/account.gif) no-repeat;
width:36px;
}
#status-button {
background:url(images/status.gif) no-repeat;
width:31px;
}
#howto-button {
background:url(images/howto.gif) no-repeat;
width: 31px;
}

/*-------[ content ]---------------------*/

#content {
line-height:16px;
margin:20px;
}
#content p {
margin-bottom:10px;
}
#content h3 {
font:14px Arial, Tahoma, Sans-Serif;
color:#bbb;
border-bottom:1px solid #26292B;
padding-bottom:2px;
margin-bottom:10px;
}

/*-------[ about styles ]---------------------*/

#about ul {
list-style-image:url(images/bullet.gif);
margin:0 0 10px 15px;
}

/*-------[ work styles ]---------------------*/

#works {
list-style:none;
width:480px;
}
#works li {
float:left;
margin:0 20px 20px  0;
}
.work-thumb {
display:block;
}
.work-thumb img {
border:1px solid #26292B;
padding:3px;
background:#131415;
width:130px;
height:100px;
display:block;
}
.work-thumb span {
display:block;
border:1px solid #080808;
}

/*-------[ social styles ]---------------------*/

#networks {
list-style:none;
width:470px;
}
#networks li {
float:left;
border:1px solid #080808;
width:223px;
margin:0 10px 10px 0;
}
#networks li a {
border:1px solid #26292B;
padding:5px;
display:block;
background:#131415;
min-height:48px;
}
#networks img {
float:left;
display:block;
margin-right:5px;
}
#networks strong {
display:block;
font-size:14px;
color:#ccc;
margin:2px 0 5px 0;
}
#networks span {
display:block;
}

/*-------[ contact form ]---------------------*/


#contactform {
float:left;
width:210px;
margin-right:20px;
}
#contactform fieldset {
border:none;
}
#contactform input {
width:210px;
}
#contactform textarea {
width:210px;
height:120px;
}
#contactform input, #contactform textarea {
display:block;
border:1px solid #26292B;
padding:5px;
background:#1A1E1E;
font:11px Arial, Tahoma, Sans-Serif;
color:#CBCBCB;
margin-bottom:10px;
}
#contactform input:focus, #contactform textarea:focus {
background:#111313;
}
.send {
width:222px !important;
background:#15181A !important;
border:1px solid #26292B !important;
color:#ccc !important;
cursor:pointer;
}
.send:hover {
border:1px solid #444 !important;
}
#contact-information {
float:right;
width:220px;
}

/*-------[ footer ]---------------------*/

#footer {
background:#131415;
border-top:1px solid #26292B;
clear:both;
}
#footer p {
padding:10px 20px 10px 20px;
}
