html {
margin:0;
padding:0;
}

body {
background:#111 url(suzu.gif) repeat-y;
margin:0;
padding:0;
}

em {
border-bottom:1px dashed #ccc;
}

h1, h2, h3, h4, h5 {
font-family:Georgia, verdana, arial;
padding:10px;
}

ul {
padding-left:80px;
font: normal normal 1em/1.4em arial;
margin:0;
}

dl {
padding-left:40px;
margin:0;
}

dt {
font-weight:bold;
font-family:arial;
text-decoration:underline;
margin-top:25px;
font: bold 1.4em/1.4em arial;
}

dt:first-letter {
font-style:italic;
}

dd {
font: normal 1.05em/1.4em arial;
width:340px;
margin:0;
padding-left:20px;
}

form {
font:1.2em/1.8em arial;
padding-left:42px;
}

label,
input {
display:block;
}

label {
margin-top:15px;
font-weight:bold;
font-size:1.2em;
}

input, textarea {
border:1px solid #888;
padding:5px;
font-family:arial;
font-size:1em;
width:86%;
background: #ECECEC url(inputs.jpg) repeat-x;
}

input.submit {
background:#000 url(submit.jpg) repeat-x;
color:#fff;
border:1px solid #666;
cursor:pointer;
margin-top:10px;
width:89%;
font-weight:bold;
}


.skipto {
display:none;
}

a.footnote {
text-decoration:none;
color:#0E7FCA;
}

/*~~~~~~~~~~TOP AND BOTTOM MENUS~~~~~~~~~~*/
.widemenu {
background:#191919;
padding:5px 20px;
border-bottom:1px solid #222;
}

.widemenu ul {
margin:0;
padding:0;
}

.widemenu li {
display:inline;
padding-right:20px;
}

.widemenu li.last {
padding-right:0;
}

.widemenu a {
color:#ddd;
font: small-caps normal .8em arial;
letter-spacing:1px;
text-decoration:none;
}
.widemenu a:hover {
text-decoration:underline;
color:#fff;
}

#bottom {
border-top:1px solid #222;
}

/*~~~~~~~~~~WRAPPER~~~~~~~~~~*/
#root {
margin:0 auto;
font-size:75%;
clear:both;
width:442px;
}

#header {
margin:10px auto 0;
width:442px;
height:120px;
color:#fff;
}

#header img {
float:left;
width:50px;
margin-top:30px;
}

#header h1 {
font-size:4.5em;
font-weight:normal;
text-align:center;
margin:0;
font-style:italic;
float:left;
width:250px;
}

#header h1 a {
text-decoration:none;
color:#fff;
}

#header h1 a:hover {
color:#fafafa;
}

#header #slogan {
text-align:right;
font-family:arial;
float:right;
width:90px;
margin-top:30px;
font-size:.7em;
line-height:1.5em;
letter-spacing:1px;
}

#menu {
border:1px solid #000;
padding:0 1px;
height:45px;
background:#fff;
}

#menu ul {
list-style-type:none;
margin:0;
padding:0;
height:45px;
background:#000 url(menu.jpg);
text-align:left;
line-height:1.8em;
}

/**
 For IE is not enough to float the a tags, you also have to float the li tags
 **/
#menu li {
float:left;
}

#menu li a {
display:block;
text-align:center;
float:left;
height:33px;
color:#fff;
text-decoration:none;
font-family:Georgia, arial;
font-size:1.7em;
letter-spacing:1px;
padding-top: 12px;
border-right:1px solid #fff;
}

#menu li a.last {
border:0;
}

#menu li a:hover,
#about #menu a.about:hover {
text-decoration:underline;
background:#000 url(menu.jpg) 0 -94px;
}

#menu a.services {
width:140px;
}

#menu a.work {
width:159px;
}

#menu a.contact {
width:136px;
}

/* CURRENT PAGE selector */
/* For main menu */
#services #menu a.services,
#portfolio #menu a.work,
#contact #menu a.contact {
background:#000 url(menu.jpg) 0 -47px;
text-decoration:underline;
font-style:italic;
}

/* For top/bottom menus */
#index .widemenu .home,
#about .widemenu .about,
#services .widemenu .services,
#portfolio .widemenu .work,
#contact .widemenu .contact,
#glossary .widemenu .glossary {
background:#555;
padding:2px 5px;
}

#portfolio #content img {
margin-top:5px;
}

#portfolio #content h2 {
margin-top:40px;
}

#portfolio #content #youarehere {
margin-top:0;
}

#portfolio #content h2.first {
margin-top:25px;
}

#content {
clear:left;
background: #fff url(kontent.png) top center repeat-y;
border:1px solid #000;
border-top:0;
border-bottom:0;
padding:0 0 20px 0;

}

#content p {
padding:0 40px;
margin:0 0 1.6em 0;
font: normal 1.1em/1.6em arial, verdana, arial;
color:#151515;
}

#content p strong {

}


#content img {
border:none;
}

#content p.img img {
margin-bottom:15px;
}

#content #youarehere {
background: transparent url(h2.png) top left repeat-x;
/* Cool Blue: background:#00bff3; */
font: small-caps bold 2.5em/1.4em Georgia;
margin:0 0 1px 0;
letter-spacing:1px;
color:#0E7FCA;

padding:25px 40px 0 40px;

}

#content h2 {
font: italic bold 1.9em/1.4em Georgia;
padding:0px 40px;
padding-left:60px;
margin:1em 0 0 0;
color:#222;
background:url(colors.gif) no-repeat 40px 8px;
}

/* h3 heading */
#content h3 {
font: bold 1.4em arial;
margin:10px 0 0 40px;
padding:7px 10px;
color:#eee;
background:#000 url(h3.jpg) repeat-x;
width:340px;
}

/**
ABOUT site section info
**/
#content .site {
padding:0 10px;
background:#eee url(diagonals.gif);
width:300px;
margin:0 auto;
border:1px solid #eee
}

#content .site h2 {
font:bold 1.6em/1.2em Georgia;
background:none;
}

#content .site ul {
margin:0 auto;
padding:0 0 10px 0;
list-style:none;
width:250px;
}

#content .site li {
background:url(bullet_blue.gif) no-repeat 0 -1px;
padding-left:20px;
font:normal .9em/1.2em Georgia;
margin:.5em 0;
}

#footer {
background:url(f2.png) top center no-repeat;
padding:35px 0 10px 20px;
color:#eee;

}

#footer ul {
list-style:none;
line-height:180%;
padding:0;
margin:0;
}

#footer li {
font:small-caps normal 1.1em/1.2em arial;
margin:.5em 0;
letter-spacing:1px;
}

#footer .note {
display:block;
margin-top:.3em;
}

#footer a {
color:#87CAF7;
}

#footer a:hover {
color:#87CAF7;
}

#content #contact-sent {
font-weight:bold;
color:#f00;
}

#sidebar {
position:fixed;
top:158px;
left:83px;
background:red;
}
#sidebar h2 {
margin:0;
padding:0;
}
