/*IT Business - Jeff Radecki CSS */

* {margin: 0; padding: 0;}
body {background: #999999; font-family:"Trebuchet MS", Verdana, Tahoma, Georgia ; font-size: 75%;}
/**************************************** Header and Top Nav ****************************/
#container { width: 996px;	margin: auto;	font-size: 1em;}
#topAd{	height: 100px; padding-top: 5px;}
#headerTop {background-image: url(layoutImg/topCorners.gif); height: 4px;}
#header {
	background: #FFFFFF;
	height: 102px;
	padding-left: 10px;
	
}
#navLeft {
	width: 10px;
	background-image: url(layoutImg/navLeft.gif);
	height: 40px;
}
#mainNav {
	width:993px;
	padding-left:3px;
	padding-top:3px;
	height:23px;
	border: #999 2px solid;
	border-right:0px;
	border-left:0px;
	background-image: url(http://www.itbusiness.ca/it/image/en/cdn/mainNav.jpg);
	background-repeat: repeat-x;
	color:#ccc;
	
		
}

#mainNav a{

	font-size:1.2em;
color:#666;
}

#mainNav a:link, #mainNav a:visited{
color:#666;
text-decoration:none;
}

#mainNav a:hover{
color:#990000;
text-decoration:underline;
}

#btmNav {
width:993px;
	padding-left:3px;
	height:20px;
	border: #999 2px solid;
	border-right:0px;
	border-left:0px;
	background-image: url(http://www.itbusiness.ca/it/image/en/cdn/mainNav.jpg);
	background-repeat: repeat-x;
	color:#ccc;
}

#btmNav a{
color:#000000;
}

#btmNav a:link, #btmNav a:visited{
color:#000000;
text-decoration:none;
}

#btmNav a:hover{
color:#000000;
text-decoration:underline;
}


#highlight {
	width:247px;
	padding:5px;
	border: #333 1px solid;	
	float:right;
	margin-left:5px;
	background: #CCCCCC;
	/*background: url(http://www.itbusiness.ca/it/image/en/cdn/highlightTop.jpg) #CCCCCC no-repeat top left;*/

}



/**************************************** Sidebars ****************************/
#left {
	float: left;
	width: 10px;	
}
#right {
	font-family:"Trebuchet MS", Verdana, Tahoma, Georgia ;
	float: right;
	width: 305px;
	padding-right: 5px;
}
#right ul, #right ol {
padding-left:15px;
}
.rightBox {
display:block;
background: #fff url(layoutImg/rightBoxMid.gif);
width: 290px;
padding-left:5px;
padding-right:5px;
}
.rightBox h3 {
display:block;
background: url(layoutImg/rightBoxTop.gif) no-repeat top left;
font-size:1.2em;
font-weight:bold;
width: 295px;
height: 20px;
padding-top:5px;
margin-left:-5px;
padding-left: 5px;
}
.rightBox h4 {
display:block;
background: url(layoutImg/rightBoxBtm.gif) no-repeat bottom left;
font-size:0.2em;
width: 295px;
height: 10px;
color:#FFFFFF;
padding-top:5px;
margin-left:-5px;
padding-left: 5px;
}

/**************************************** Main Divs ****************************/
#contentwrapper {
 background:#FFFFFF;
}
#content {
    font-family:"Trebuchet MS", Verdana, Tahoma, Georgia ;
	position: relative;
width:665px;
	margin-right: 320px;
	margin-left: 10px;
}
#sky {
float:left;
padding-right:5px;
padding-bottom:5px;
}
#greyBox {
background: #e1e1e1;
padding:5px;
border:1px solid #ccc;
}
#blackHomeTop {
float:right;
width:335px;
}
#blackHomeTop h2 {
width: 325px;
background: url(layoutImg/blackBarH.gif) no-repeat top left;
color:#FFFFFF;
font-size:1.4em;
padding-top:3px;
height:26px;
padding-left: 5px;
}
#greyBoxH h1 {
width: 656px;
background: url(layoutImg/greyBoxTop.gif) no-repeat top left;
margin-left:-5px;
padding-left: 5px;
}
#greyBoxH {
background: #CCCCCC url(layoutImg/greyBoxBtmH.gif) no-repeat bottom left;
width: 651px;
padding-left:5px;
padding-right:5px;
}
#greyHome {
background: #CCCCCC url(layoutImg/greyHomeBtm.gif) no-repeat bottom left;
width: 310px;
padding-left:5px;
padding-right:5px;
}
#footer {
	background-image: url(images/footer.gif) repeat-x;	
	width: 991px;
	padding-top:5px 0px 10px 0px;
	clear: both;
	text-align: center;
}
.grey:link, .grey:visited{
color:#666666;
text-decoration:none;
padding-right:5px;
}

.grey:hover {
color:#000;
text-decoration:underline;
padding-right:5px;
}

/**************************************** text, images, lists ****************************/
a {
	color: #990000;
	font-weight:bold;
	text-decoration:none;
}

a:hover {
	color: #333333;
	font-weight:bold;
	text-decoration: underline;
}
a.info{
    position:relative; /*this is the key*/
    z-index:24; 
    text-decoration:none}

a.info:hover{z-index:25; background-color:#fff;}

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:15em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center}

img {
  border: 0px;
}

p {
padding-top:0px;
padding-bottom:10px;
}


h1 {
	color: #990000;
	font-size: 1.5em;
	text-decoration: none;
}

h1 a:hover, h2 a:hover{
	color: #990000;
	text-decoration: underline;
	cursor:pointer; 
}


h2 {
	font-size: 1em;
	color: #990000;
	height: 20px;
	text-decoration: none;
}

#content h3 {
	font-size: 1.2em;
	background:#f1f1f1; 
	
	color: #666;
	height: 20px;
	padding-left:5px;
	text-decoration: none;
}


.writer {
color:#434242;
font-weight:bold;
} 
.date {
color:#000;
font-weight:bold;
} 
.section {
display:block;
color:#000;
font-size:1.2em;
width:490px;
padding-left:6px;
height:26px;
page-break-after:always;
font-weight:bold;
background: url(layoutImg/greyBar.gif) no-repeat top left;
}
.smallDesc {
font-size:0.95em;
}

.blackTop {
float:left;
color:#fff;
font-size:1.4em;
width:485px;
padding-left:6px;
padding-right:5px;
height:26px;
background: url(layoutImg/blackBar.gif) no-repeat top right;
}
/********************* Search Form *******************************/
#searchform {
	margin: 5px 0;
	}
#searchform p {
	padding-bottom:0px;
	}	
#searchform form {
	margin: 0; /* for IE, Opera, ... */
	}
#searchform .equal { 
	vertical-align: middle; /* for IE */
	}
#searchform #btn {
	background: none;
	}
#logoBanner {
background: #ffffff;
width: 986px;
text-align: center;
}
#logoBanner img {
padding:4px 10px 0px 0px;	
}
#videoList  {
height:50px;
padding:6px;
border-bottom: 1px solid #ccc;
}

#videoList:hover  {
background:#e1e1e1;
cursor:hand;
}
#videoList span
{font-weight:bold; color:#666;}
#videoList img
{float:right;  width:65px; padding-left:5px; height:50px;}

#greyOut {
display:none;
z-index:1000;
background: url(http://www.itbusiness.ca/dell/linkBack.png) repeat; 
top:0px;
left:0px;
width:100%;
height:100%;
position:fixed;
margin:0px;
padding:0px;
}

#companion{
float:right;
padding:60px 30px 60px 5px;
width:300px;
clear:right;
}

#videoWrap {
display:none;
z-index:10010;
margin:1% auto auto auto;
padding-top:5px;
height:600px;
background:#fff;
width:990px;
border:2px solid #ccc;
}


#Video {
height:370px;
width:600px;
float:left;
padding-left:20px;
}
#vidInfo {
	float:left;
padding-left:20px;
clear:left;
width: 475px;
}

.close{
float:right;
padding-right:5px;
display:block;
}
.videoDesc{
font-size:11px;	
}

#resp 
{
	float:right;
width: 455px;
height: 170px;
overflow-x: auto;
overflow-y: auto;
display: block;
margin-right:2%;
}

.related {
padding-top: 0px;
padding-right: 5px;
padding-bottom: 0px;
padding-left: 5px;
overflow-x: hidden;
overflow-y: hidden;
}
.related img{
	width:100px;
	height:75px;
	
}
.smallName{
display: block;
width: 100px;
height: 35px;
overflow-x: hidden;
overflow-y: hidden;
font-size: 0.9em;
color: #660000;
}
.clear 
{clear:both;}
.clearleft{
	clear: left;}
#right a {color:#006;}
.vertitemContainer{
	display:block;
	float: left;
	width: 124px;
	text-align: center;
	margin: 5px 2px;
	padding: 10px 0px;
	}
.vertsmailTitle{
	display: block;
	margin: 0 auto;
	clear: both;
	}
#slideshow_container{
	background:#f1f1f1; 
	border:1px solid #ccc; 
	padding:5px; 
	margin-bottom:20px;
	}
#slideImageBox{
	float: left;
	background:#fff;
	border:1px solid #ccc; 
	padding:5px;
	}
#slideImageBox a{
	font-size:11px;
	}
.button_container{
	position:absolute;  top:20px; left:-55px; width:32px; background:#ccc;  margin-left:0px; padding:5px; border:2px solid #e1e1e1; border-left:0px}
	
	.pageNext, .pageNext:link, .pageNext:visited { float:right; padding:5px; background:#990000; color:#fff; -moz-border-radius: 5px;
border-radius: 5px;}
.pageBack,.pageBack:link, .pageBack:visited  { padding:5px; background:#e1e1e1; -moz-border-radius: 5px;
border-radius: 5px;} 
