@charset "utf-8";
/* CSS Document */

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}

img {
	border:0;
}

#headLogo {
	position: absolute;
	width: 1050px;
	height: 115px;
	margin: 10px 0px 0px 120px;
	background-image:url(graphics/topbar.png);
	background-repeat:no-repeat;
	z-index: 1;
}

#logo {
	position: absolute;
	width: 310px;
	height: 110px;
	margin: 18px 0px 0px 140px;
	background-image:url(graphics/Technologics-and-Controls.png);
	background-repeat:no-repeat;
	z-index: 2;
}

#sidebar {
	position: absolute;
	padding-left: 10px;
	width: 220px;
	height: 490px;
	margin: 100px 0px 0px 140px;
	background-image:url(graphics/sidebar.png);
	background-repeat:no-repeat;
	z-index: 0;
}

#sidebar div:hover {
	background-color:#eeeeee;
}

#sidebar div a {
	text-decoration: none;
}

#content {
	position:absolute;
	padding-left: 15px;
	width: 760px;
	height: 205px;;
	margin: 115px 0px 0px 360px;
	background-image:url(graphics/textbg.png);
	background-repeat:no-repeat;
	z-index: 3;
}

#box1 {
	position:absolute;
	padding-left: 15px;
	width: 265px;
	height: 275px;
	margin: 320px 0px 0px 360px;
	background-image:url(graphics/box1.png);
	background-repeat:no-repeat;
	z-index: 4;
}

#box2 {
	position:absolute;
	padding-left: 15px;
	width: 265px;
	height: 275px;
	margin: 320px 0px 0px 610px;
	background-image:url(graphics/box2.png);
	background-repeat:no-repeat;
	z-index: 5;
}

#box3 {
	position:absolute;
	padding-left: 15px;
	width: 265px;
	height: 275px;
	margin: 320px 0px 0px 860px;
	background-image:url(graphics/box3.png);
	background-repeat:no-repeat;
	z-index: 6;
}

#box3 a { text-decoration:none; }

#boxHeading1 {
	position: absolute;
	margin: 10px 0px 0px 90px;
	font-weight:bold;
	z-index: 7;
}
#boxContent1 {
	width: 230px;
	text-align:justify;
	font-size:11px;
	position: absolute;
	margin: 35px 0px 0px 0px;
	z-index: 8;
}

#boxHeading2 {
	position: absolute;
	margin: 10px 0px 0px 90px;
	font-weight:bold;
	z-index: 9;
}
#boxContent2 {
	width: 230px;
	text-align:left;
	font-size:11px;
	position: absolute;
	margin: 35px 0px 0px 0px;
	z-index: 10;
}

#boxContent2 a {
	text-decoration: none;
	font-size: 9px;
}

#boxHeading3 {
	position: absolute;
	margin: 10px 0px 0px 90px;
	font-weight:bold;
	z-index: 11;
}
#boxContent3 {
	width: 230px;
	text-align:justify;
	font-size:11px;
	position: absolute;
	margin: 35px 0px 0px 0px;
	z-index: 12;
}

#pageContent {
	position: absolute;
	padding-left: 10px;
	width: 775px;
	font-size: 11px;
	height: 472px;
	margin: 115px 0px 0px 360px;
	background-image:url(graphics/PageContentBG.png);
	background-repeat:no-repeat;
	z-index: 13;
}

#pageContent div a {
	text-decoration: none;
}

#pageContent div ul li a {
	text-decoration: none;
}

#headlink {
	list-style-type: none;
	width: 650px;
	height: 25px;
	display: inline;
	position: absolute;
	margin: 80px 0px 0px 455px;
	z-index: 14;
}

#headlink li {
	float: left;
	padding-top: 3px;
	padding-bottom:3px;
	padding-right: 10px;
}

#headlink li a {
	text-decoration:none;
}

#contactus {
	position: absolute;
	width: 260px;
	font-size:11px;
	height: 45px;
	margin: 14px 0px 0px 870px;;
	z-index:15;
}

a.info{
    position:relative; /*this is the key*/
    z-index:24;
    color:#6633FF;
    text-decoration:none}

a.info:hover{z-index:25; text-decoration:underline;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:2em; left:2em; width:20em;
    border:1px solid;
    background-color:#CCFF99; color:#000;
    text-align: left;
}
