html
{
height: 800px;
}

body
{
margin: 0;
background: #180000 url("../images/bg/gradient.gif") repeat-x top left;
height: 100%;
font-family: Helvetica, Arial, sans-serif;
}

div#bg
{
background: url("../images/bg/leaf.gif") no-repeat top left;
height: 100%;
}

#page
{
width: 820px;
margin: 10px auto 0 auto;
color: #e77;
}


#header
{
margin-left: 18px;
overflow: hidden;
background: url("../images/logo/main.gif") no-repeat top left;
width: 361px;
height: 79px;
display: block;
}

a#header:hover
{
background-image: url("../images/logo/hover.gif");
}

a#header:focus {
  outline: none;
}

div#menu
{
float: right;
margin: 34px 40px 0 0;
}

object
{
outline: none;
}

div.sandbags div
{
float: right;
clear: right;
height: 1.2em;
}


div#menu ul
{
padding: 0;
text-align: right;
}

div#menu ul li
{
display: inline;
font-weight: bold;
font-family: "Lucida Sans Unicode";
font-size: 0.8em;
margin: 0 0.5em;
letter-spacing: -0.03em;
}

div#menu ul li a
{
color: #694c4c;
}

div#menu ul li a:hover,div#menu li.active
{
color: #fff;
text-decoration: none;
}

div#menu a:visited
{
color: #694c4c;
}

div#inner
{
clear: both;
margin: 20px 15px 0 62px;
}

div#footer
{
clear: both;
overflow: hidden;
padding: 10px 0;
margin-top: 20px;
font-size: 0.8em;
color: #811;
}

#inner h1
{
color: #811;
font-family: Tahoma;
font-weight: normal;
margin-bottom: 0.5em;
font-size: 2em;
}

#inner h2
{
color: #d22;
font-family: Tahoma;
font-weight: normal;
border-bottom: 2px solid #600;
margin: 1em 0 0.5em 0;
line-height: 1em;
overflow: visible;
}

#inner h3
{
font-size: 1em;
font-family: Tahoma;
margin: 2.5em 10px 1em 10px;
width: 500px;
color: #b22;
}

/* Top Page */


div.top
{
background: url("../images/top/swish.gif") no-repeat 70px 0;
}

div.top p
{
font-size: 0.95em;
}

div#quickkanji
{
float: left;
width: 400px;
overflow: hidden;
}

div#quickkanji p
{
text-align: left;
}

div#tables
{
width: 380px;
margin: 70px 30px -250px 0;
float: right;
}

div#tables,div#tables p
{
text-align: right;
}

div#profile
{
float: left;
width: 500px;
margin: 80px 0 20px 90px;
text-align: right;
}

div#profile p
{
margin: 0.7em 0;
text-align: left;
}

div#profile img
{
margin-right: 50px;
}

div#other
{
width: 236px;
float: left;
clear: left;
margin: -60px 0 -20px 500px;
}

/* Portfolio */

div#featured
{
margin: 50px 0;
}

div#featured div.explanation
{
float: right;
width: 277px;
}

div#featured h4
{
font-family: Tahoma;
color: #fff;
}

div#featured p.features
{
font-size: 0.9em;
color: #fcc;
}

div#featured p
{
font-size: 0.8em;
}

div.stagebg
{
background: url("../images/bg/stage.png") no-repeat top left;
margin-bottom: 20px;
padding: 15px;
}

div.stage
{
height: 185px;
overflow: auto;
}

div.stage div.item
{
color: #fff;
height: 190px;
width: 690px;
margin-bottom: 40px;
}

div.stage div.item img.screenshot
{
float: left;
margin-right: 15px;
}

div.stage div.item div.info
{
overflow: hidden;
}

div.stage div.item div.info p
{
margin: 0.5em 0;
}

div.item h4,div.item h5
{
font-family: Tahoma;
}

div.item h5
{
margin: 0.5em 0;
color: #977;
}

div.item h5 img
{
vertical-align: -1px;
}

div.item p
{
font-size: 0.8em;
color: #b99;
}

#carousel .thumbnails
{
position: relative;
left: -40px;
width: 830px;
}

#carousel .scroll
{
width: 770px;
overflow: auto;
}

ol {
  padding: 0;
}

#carousel ul
{
padding-left: 50px;
width: 1800px;
overflow: hidden;
}

#carousel ul li
{
display: block;
float: left;
margin: 0 6px;
width: 202px;
height: 142px;
background: url("../images/portfolio/thumbnails/shadow.png") no-repeat top left;
}

#carousel .scroll ul li a
{
display: block;
width: 180px;
margin: 12px 0 0 12px;
}

#carousel a:focus
{
outline: none;
}


#carousel .leftButton, #carousel .rightButton
{
position: absolute;
z-index: 105;
width: 90px;
height: 135px;
}

#carousel .leftButton img, #carousel .rightButton img
{
margin-top: 25px;
cursor: pointer;
}

#carousel .leftButton
{
left: 10px;
margin: 0 -40px 0 -20px;
background: url("../images/portfolio/thumbnails/leftcover.png") no-repeat center right;
}

#carousel .rightButton
{
right: 10px;
margin: 0 -20px 0 0px;
background: url("../images/portfolio/thumbnails/rightcover.png") no-repeat center left;
}

#carousel .rightButton img
{
float: right;
}

/* Software */

div.software
{
width: 330px;
height: 204px;
background: url("../images/bg/software.png");
float: left;
padding: 15px;
margin: 0 10px 10px 0;
overflow: hidden;
cursor: pointer;
color: #c55;
}

div.software p
{
font-size: 0.9em;
margin: 10px;
line-height: 1.2;
}

div.software div.inner
{
height: 100%;
background-position: right bottom;
background-repeat: no-repeat;
overflow: hidden;
}

div.software a.started
{
display: block;
float: left;
font-size: 0.8em;
font-weight: bold;
margin: 20px 0 0 8px;
}

div#tablegear div.inner  { background-image: url("../images/software/thumbnails/tablegear.gif"); }
div#hottext div.inner  { background-image: url("../images/software/thumbnails/hottext.gif"); }
div#quickbox div.inner  { background-image: url("../images/software/thumbnails/quickbox.gif"); }
div#carousel div.inner  { background-image: url("../images/software/thumbnails/carousel.gif"); }


#donate
{
clear: left;
padding: 10px;
}

#donate form
{
float: left;
margin: 10px;
}

#donate p
{
font-size: 0.8em;
color: #a33;
margin-top: 0;
}

div#submenu
{
float: right;
margin-left: 10px;
padding: 20px;
background: #200;
border: 1px solid #440505;
}

div#submenu h4
{
font-family: "Tahoma";
font-size: 0.9em;
color: #611;
border-bottom: 1px dotted #611;
margin-bottom: 0.3em;
}

div#submenu h5
{
margin-top: 0.5em;
color: #a33;
}

div#submenu ul
{
line-height: 0.9em;
}

div#submenu ul ul
{
padding-left: 0.5em;
margin-bottom: 0.5em;
}

div#submenu ul ul ul
{
margin-bottom: 0;
}

div#submenu ul li a
{
font-size: 0.8em;
font-family: Trebuchet MS;
color: #66c;
background: url("../images/icons/bullet.gif") no-repeat left center;
padding-left: 12px;
line-height: 0.9em;
}

div#submenu ul li a:hover,div#submenu ul li a:focus
{
text-decoration: none;
background: url("../images/icons/bullet_on.gif") no-repeat left center;
outline: none;
}

div#submenu ul li a:visited
{
color: #55a;
}

div#submenu p
{
margin: 0;
font-size: 0.9em;
}

div.code h2
{
overflow: hidden;
}

div.code div
{
margin-bottom: 2em;
color: #f88;
}


div.code p
{
margin: 10px 20px;
width: 600px;
font-size: 0.9em;
}

div.code p.link
{
font-size: 1em;
}

div.code p.link img
{
vertical-align: bottom;
margin-right: 6px;
}

div.code p.code
{
margin: 20px 30px;
padding: 0 15px;
white-space: pre;
color: #fff;
font-family: "Lucida Console", "Courier New", monospace;
border-left: 6px solid #600;
}

div.code p.code span.dimmed
{
color: #611;
}

div.code p.code span.dimmed span.user
{
color: #830;
}

div.code span.user
{
color: #e80;
}

div.code ul
{
color: #d33;
margin: 1em 0 2em 3em;
}

div.code ul li span
{
margin-left: 1em;
font-size: 0.9em;
color: #822;
}

div.code table.options
{
margin: 10px 30px;
width: 700px;
border-collapse: collapse;
}

div.code table.parameter
{
width: auto;
}

div.code table.options th
{
font-size: 0.8em;
color: #822;
text-align: left;
}

div.code table.options td
{
border: 1px solid #411;
font-size: 0.9em;
padding: 0.2em 0.5em;
}

div.code table.options ul
{
color: #f88;
margin: 0;
}

div.code .code,div.code td.description table th
{
font-family: "Lucida Console", "Courier New", monospace;
color: #fff;
margin: 0;
}

div.code table td.accepts
{
width: 7em;
}

div.code table td.default
{
width: 5em;
font-size: 0.8em;
}

div.code table td.description
{
font-size: 0.8em;
color: #a33;
}

div.code table td.description div
{
color: #a33;
margin-bottom: 0.5em;
}

div.code table.options table
{
width: auto;
margin: 0;
}

div.code table.options table th
{
font-size: 0.9em;
padding: 0;
font-weight: normal;
}

div.code table.options table td
{
font-size: 0.9em;
padding: 0 0 0 1em;
border: none;
}


div.code table td.hint
{
text-align: center;
font-size: 1.2em;
color: #fff;
cursor: help;
}

div.code .type
{
color: #fff;
font-style: italic;
}

div.code .custom
{
color: #fa3;
font-style: italic;
}

div.code .parameter
{
color: #fff;
}

div.code table th.sortable
{
cursor: pointer;
}

a.example
{
font-size: 1.2em;
}

p.html
{
background: url("../images/bg/html.gif") no-repeat top right;
}

p.php
{
background: url("../images/bg/php.gif") no-repeat top right;
}

dl.faq dt
{
  color: #AA3333;
  font-size: 0.9em;
  font-style: italic;
  font-weight: bold;
  margin: 0.5em 0;
}

dl.faq dd p
{
  margin: 0.5em 0;
}

dl.faq ul {
  list-style-type: square;
  margin: 0;
  color: #e77;
}

/* Contact */


form#contact
{
margin-bottom: 200px;
}

form#contact fieldset
{
border: none;
padding: 0;
width: 700px;
}

form#contact fieldset div.right
{
width: 250px;
float: right;
text-align: right;
}
form#contact fieldset div.right p
{
text-align: right;
}

form#contact div#envelope
{
float: right;
width: 80px;
height: 90px;
margin-top: 10px;
background: url("../images/contact/envelope.png") no-repeat top right;
}

form#contact label
{
color: #e44;
display: block;
font-weight: bold;
font-size: 0.8em;
margin: 1em 0 0.5em 0.3em;
}

form#contact .textInput,form#contact textarea
{
color: #666;
font-weight: bold;
font-family: "Arial", sans-serif;
}

form#contact .textInput
{
background: url("../images/contact/input.gif") no-repeat top left;
border: none;
width: 250px;
height: 17px;
padding: 3px 6px;
}

form#contact #messageBG
{
background: url("../images/contact/textarea.gif") no-repeat top left;
position: relative;
z-index: 100;
padding: 10px;
}

form#contact textarea
{
width: 354px;
height: 137px;
border: none;
background: none;
font-size: 0.8em;
overflow: auto;
}

form#contact #submit
{
border: none;
background: url("../images/text/en/send.gif") no-repeat top left;
width: 118px;
height: 29px;
cursor: pointer;
position: relative;
left: 256px;
z-index: 99;
margin-top: 10px;
}

form#contact .error
{
color: red;
}

#mailsent
{
opacity: 0.9;
position: absolute;
z-index: 999;
top: 0;
left: 0;
text-align: center;
background: #000;
cursor: pointer;
}

/* Photography */


div#photos
{
width: 730px;
height: 500px;
background: url("../images/photos/photoBG.gif") no-repeat top left;
margin: 20px 0 150px 0;
overflow: hidden;
}


/* General */


#page span.tag
{
color: #9a6666;
}

a
{
color: #55c;
}

a:visited
{
color: #53a;
}

p
{
font-family: "Lucida Sans Unicode";
}

a.external
{
font-weight: bold;
font-family: Tahoma;
font-size: 0.9em;
}

.tip
{
width: 260px;
height: 103px;
font-size: 0.8em;
line-height: 1.2em;
font-family: "Lucida Sans Unicode";
z-index: 105;
padding: 35px 20px 8px 20px;
opacity: 0.9;
color: #002;
text-align: justify;
background: url("../images/bg/hint.gif") no-repeat top left;
}


/* Universal */

h1,h2,h3,h4,h5,h6
{
margin: 0;
}

a
{
text-decoration: none;
}

a:hover
{
text-decoration: underline;
}

a img
{
border: none;
}

.graphic
{
text-indent: -4000px;
overflow: hidden;
}

.hidden
{
display: none;
}

ul
{
margin: 0;
padding: 0;
list-style-type: none;
}

p
{
text-align: justify;
}

p.left
{
text-align: left;
}

a.external
{
background: url("../images/icons/external.gif") no-repeat right 2px;
padding-right: 32px;
}

a.external:hover
{
border-bottom-width: 1px;
border-bottom-style: solid;
text-decoration: none;
}

a.external:visited
{
background-image: url("../images/icons/external_visited.gif");
}

.loading
{
display: none;
}

div.code p.announcement {
  color: #F91;
  font-size: 1.1em;
}

div.code div.new {
  position: relative;
}

div.code div.new div {
  position: absolute;
  color: #f91;
  font-family: Trebuchet MS;
  font-size: 3em;
  font-weight: bold;
  margin: 0;
  opacity: 0.2;
  left: -72px;
  top: -29px;
}

#donate p.vps {
  font-size: 1em;
}

#donate p.vps em {
  font-style: normal;
  font-weight: bold;
}