@charset "utf-8";
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background-color:#000000;
	background-image:url(../images/mb08_bg.jpg);
	background-repeat:repeat-x;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #CCCCCC;
}
.mb08 #container {
	width: 900px;
	margin: 0 auto;
	text-align: left; 
}
.mb08 #header {
	height: 40px;
	padding: 60px 0px 0px 0px;

}
.mb08 #header h1 {
	margin: 0;
	padding:10px 0;
	float:right;
	font-size:11px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#666666;
}

/* ========================= MAIN CONTENT ========================== */

.mb08 #mainContent {
}

/* ========================= DISPLAY ========================== */

.mb08 #display {
	float:left;
	background-color: #272827;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
	height: 300px;
	width: 898px;
}

/* ========================= FOOTER ========================== */

.mb08 #footer {
	float: left;
	width: 900px;
}
.mb08 #footer p {
	margin: 0;
	padding: 10px 0;
	color: #333333;
	text-align:right;
}
#footer p a {
color: #333333;
text-decoration:none;
}
#footer p a:visited {
color: #333333;
text-decoration:none;
}
#footer p a:hover {
	color: #666666;
	text-decoration:none;
}

/* ========================= NAVI ========================== */

.mb08 #navi {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 160px;
	height: 300px;
	padding: 20px 20px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

#nav-menu ul
{
list-style: none;
padding: 0;
margin: 0;
}

#nav-menu li
{
	float: left;
}

#nav-menu li a
{
	height: 14px;
	float: left;
	width: 150px;
	display: block;
	padding:5px 5px 5px 5px;
	font-size:11px;
	letter-spacing:4px;
	font-weight:normal;
	color: #666666;
	text-decoration: none;
	text-align: left;
	font-family:Verdana,Arial,Helvetica,sans-serif;
}

#nav-menu li a:hover
{
	color: #CCCC99;
}


/* Hide from IE5-Mac \*/
#nav-menu li a
{
float: none
}
/* End hide */

#nav-menu
{
	width:160px;
	float:left;
}

.highlight{
	color: #CCCC99;
	font-weight:bold;
}

.inactive{
	color: #333333;
}


/* ========================= NEWS ========================== */

.mb08 #news {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 326px;
	height: 300px;
	padding: 20px 5px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

#news ul {
list-style: none;
padding: 0;
margin: 0;
}
#news li {
float: left;
width:280px;
padding:0px 0px 10px 0px;
}

/* ========================= RECENT PROJECTS ========================== */

.mb08 #projects {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 320px;
	height: 300px;
	padding: 20px 0px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

/* ========================= Thumbs ========================== */

#thumbs {
	float:left;
	width: 300px;
}

#thumbs  ul {
list-style: none;
padding: 0;
margin: 0;
}
#thumbs li{
	float: left;
}

#thumbs li a{
	float: left;
	background-color:#272827;
	margin:0px 5px 0px 0px;
	padding:5px 5px 5px 5px;
	text-decoration:none;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	color:#666666;
}
#thumbs li a:hover {
	background-color:#333333;
	text-decoration:none;
}
#thumbs li img {
padding:0px 0px 0px 0px;
}


/* Tooltip */

a.info{
    position:relative; /*this is the key*/
    z-index:24;
	background-color:#ccc;
    color:#000;
    text-decoration:none}

a.info:hover{z-index:25; background-color:#333333}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
	display:block;
	position:absolute;
	top:0em;
	left:0em;
	background-color:#333333;
	color:#CCCC99;
	padding:5px;
	text-align: center;
	z-index:25;
}

/* ========================= CLIENT LIST ========================== */

.mb08 #clientlist {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 326px;
	height: 300px;
	padding: 20px 5px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

#clientlist ul {
list-style: none;
padding: 0;
margin: 0;
}
#clientlist li {
	width:160px;
	float:left;
	padding:0px 0px 5px 0px;
}

#clientlist li a {
	display:block;
}

/* ========================= CLIENT INFO ========================== */

.mb08 #client {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 300px;
	height: 300px;
	padding: 20px 20px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

/* ========================= Thumbs 2 ========================== */

#thumbs2 {
	float:left;
	width: 300px;
	padding: 0px 0px 5px 0px;
}

#thumbs2  ul {
list-style: none;
padding: 0;
margin: 0;
}
#thumbs2 li{
	float: left;
}

#thumbs2 li a{
	float: left;
	background-color:#272827;
	text-decoration:none;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	color:#666666;
	height:40px;
	width: 40px;
	overflow: hidden;
	border:5px solid #272827;
}
#thumbs2 li a:hover {
	background-color:#333333;
	text-decoration:none;
	border:5px solid #333;
}
.thumb_highlight{
	background-color:#333333;
	text-decoration:none;
	border:5px solid #333;
}

/* ========================= LIST ========================== */

.mb08 #list {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 140px;
	height: 300px;
	padding: 20px 5px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}

#list ul {
list-style: none;
padding: 0;
margin: 0;
}
#list li {
	display:block;
	float:left;
	width:130px;
	padding:0px 0px 5px 0px;
}

/* ========================= ABOUT US ARTICLES ========================== */

.mb08 #article {
	float:left;
	margin:2px 2px 0px 0px;
	background-color:#272827;
	width: 485px;
	height: 300px;
	padding: 20px 20px 0px 20px;
	border-top:1px solid #333333;
	border-left:1px solid #333333;
}


/* ========================= TYPE ========================== */

p, h1, h2, h3, h4, h5 {
font-family:Verdana, Arial, Helvetica, sans-serif;
margin:0px;
}

p {
	font-size:11px;
	color:#999999;
	line-height:15px;
}
p a{
	color:#999999;
	text-decoration:underline;
}
p a:visited{
	color:#999999;
	text-decoration:underline;
}
p a:hover{
	color:#CCCC99;
	text-decoration:underline;
}


h2 { /*section titles*/
	font-size:11px;
	color:#CCCC99;
}

h3 { /*clients*/
	font-size:11px;
	color:#666666;
	font-weight:normal;
}
h3 a { /*clients*/
	color:#666666;
	text-decoration:none;
}
h3 a:visited { /*clients*/
	color:#666666;
	text-decoration:none;
}
h3 a:hover { /*clients*/
	color:#CCCC99;
	text-decoration:none;
}

h4 { /*date*/
	font-family:Arial, Helvetica, sans-serif;
	font-size:9px;
	color:#666666;
	font-weight:normal;
}
h4 a{ /*date*/
	color:#666666;
	text-decoration:underline;
}
h4 a:visited{ /*date*/
	color:#666666;
	text-decoration:underline;
}
h4 a:hover{ /*date*/
	color:#CCCC99;
	text-decoration:underline;
}


/* ========================= INPUT ========================== */

.input_generic { /* FIELD */
	background-color:#272827;
	font-size: 11px;
	color: #666666;
	padding: 3px;
	border: 1px solid;
	border-left-color: #000000;
	border-top-color: #000000;
	border-right-color: #272827;
	border-bottom-color: #272827;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	overflow: auto;
}

input:focus { /*FIELD FOCUS*/
	background-color:#333333;
}
textarea:focus { /*FIELD FOCUS*/
	background-color:#333333;
}

.input_btn_submit { /*BUTTON*/
	background-color:#333333;
	font-size: 11px;
	color: #CCCC99;
	padding: 3px;
	border: 0px solid;
	cursor: pointer;
}

.input_btn_clear { /*BUTTON*/
	background-color:#666666;
	font-size: 11px;
	color: #CCCC99;
	padding: 3px;
	border: 0px solid;
	cursor: pointer;
}
