 /* CSS Mastery: Advanced Web Standards Solutions - Simon Collison's tutorial */

/* the appropriate background class will be applied based on class attached to the body */

body {
margin: 0;
padding: 0;
font: 92.5%/1.5 Verdana, Arial, Helvetica, sans-serif;
background: #fff;
}
#threeColLayout {
background: #fff;
}
#twoColLayout {
background: #FFF;
}
#oneColLayout {
background: #FFF;
}

/* default links */
a img { border: none; } 

a:link, a:visited {
text-decoration: none;
color: #630;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}
a:hover {
text-decoration: underline;
color: #333;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}

a.headline:link {
text-decoration: none;
color: #333;
font: normal 18px Verdana, Arial, Helvetica, sans-serif;
}
a.headline:hover {
text-decoration: underline;
color: #663300;
font: normal 18px Verdana, Arial, Helvetica, sans-serif;
}
a.headline:visited {
text-decoration: underline;
color: #663300;
font: normal 18px Verdana, Arial, Helvetica, sans-serif;
}

#podcast a:link, #podcast a:visited { color: #333; }
#podcast a:hover { color: #630 }

.mLink a:link, mLink a:visited {text-decoration: none;
color: #333;
font: normal 14px Verdana, Arial, Helvetica, sans-serif;
}
.mLink a:hover {
text-decoration: underline;
color: #630;
}

.sponsor {
text-decoration: none;
color: #990000;
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
}
a.sponsor:link, a.sponsor:visited  {
text-decoration: none;
color: #990000;
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
}
a.sponsor:hover {
text-decoration: underline;
color: #990000;
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
}

a.green:link {
text-decoration: none;
color: #060;
font-size: 12px;
}
a.green:hover {
text-decoration: underline;
color: #060;
font-size: 12px;
}
a.green:visited {
text-decoration: underline;
color: #060;
font-size: 12px;
}

a.go:link, a.go:visited {
text-decoration: none;
padding: 0 0 0 100px;
color: #333;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}
a.go:hover {
text-decoration: underline;
padding: 0 0 0 100px;
color: #663300;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}

.advertisers {
	font-size: 9px;
	text-decoration:  none;
	font-weight:normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	}
a.advertisers:link, a.advertisers:visited {
	font-size: 9px;
	text-decoration:  none;
	font-weight:normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	}
a.advertisers:hover {
	font-size: 9px;
	color: #999;
	font-weight: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: underline;
	}


/* ISSA ShowGuide */
#mainContent ul.showguide { list-style: none; margin: 0; padding: 0 0 0 10px; }
#mainContent ul.showguide li a { font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif;}
#mainContent h3.showguide { margin-bottom: -15px; color: #666; }

/* headers here */

h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
font-size: 20px;
color: #000;
}

h2 {
margin: 15px 0 0 10px;
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-size: 13px;
font-style: normal;
padding: 2px 15px 0 5px;
color: #333;
background: #eaeaea;
}

p {
font-family: Verdana, Arial, Helvetica, sans-serif;
}

#mainContent h2.storefront {
margin: 0;
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-size: 13px;
font-style: normal;
padding: 0 15px 0 15px;
color: #333;
background: none;
}

.news h1 {
margin: 0;
padding: 10px 0 0 10px;
font-size: 16px;
color: #000;
}

.box h2, .boxSponsorLinks h2, .boxRt h2, .boxRt h2 img, .boxWide h2, .boxLinks h2, .boxLinks h1, .boxSponsors h2, .boxSponsors h1 {
  font-size: 1.2em;
  font-weight: normal;
  color: #333;
  margin: 0;
}

.box p, .boxp, .boxRt p, .boxWide p, .boxLinks p, .boxSponsors p {
  font-size: 11px;
  font-weight: normal;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 1px 0 1px 0;
}

hr  { margin: 0 15px 0 15px; }

/* and then these h3 statements, unique to whichever section has been attached above, will give the headers the appropriate background color */

h3 {
font-size: 1.0em;
margin: 0;
padding: 1px 0 0 15px;

}

/* Article Styles */
#mainContent p, #mainContent2 p { padding: 0 15px 0 15px; font-size: 12px; line-height: normal; }
#mainContent #article p { padding: 0 15px 0 15px; font-size: 12px; line-height: 2em; }
#mainContent #article p a:link { text-decoration: underline; font-size: 12px;}
#mainContent #article h2 { padding: 0 0 0 5px; margin-bottom: -10px; font-size: 15px; background: none; color:#000; }
#mainContent #article h3 { padding: 0 0 0 15px; margin-bottom: -10px; margin-top: 15px; color: #000; text-transform: none; font-size: 16px; color: #000; font-weight: bold; }
#mainContent ul { font-size: 12px; padding-right: 15px; line-height: 2em; }
#mainContent ul li { padding-bottom: 15px; }
#mainContent ul li p { padding: 0 0 0 0; margin-left: -15px; }
#mainContent ol { font-size: 12px; padding-right: 15px; line-height: 2em; }
#mainContent ol li { padding-bottom: 15px; }
#mainContent ol li p { padding: 0 0 0 0; margin-left: -15px; }

#mainContent #article .boxSponsorLinks p {
  font-size: 10px;
  font-weight: normal;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
  padding: 20px 3px 1px 10px;
  line-height: 1.5em;
}

/* article table styles */


#flashPlayer { padding: 0 15px 0 15px; font-size: 11px; line-height: normal; }
/* main container that holds it all centrally */

#container {
width:990px;
/*background: url("http://www.cleanlink.com/graphics/bkg_3column.gif") repeat-y center;*/
margin:0 auto;
background-color: #fff;
padding: 0;
}

#mainNavContainer {
	width: 990px;
	text-align: left;
	margin: 0 auto;
}

/* default masthead holding the banner and mainNav */

#header { position:relative; width: 990px; height: 190px; background-color: #fff; }
#mainNavbar { width: 990px; height: 30px; }
#news { width: 990px; float:left; display:inline; padding: 0; margin:0; }
#news_interest { width: 420px; height: 100%; background-color: #e4854d; float: left ;display:inline; padding: 0; margin:0; }
#news_people  { line-height: inherit; background: #fff url("http://www.cleanlink.com/graphics/bkg_512px.gif") right top; display: inline; position: relative; width: 570px; height: 186px; float: right }
div#magazines{ margin: 0; color: #fff; background-color:#333; width:990px; overflow: auto; position: relative; clear: both; } 

#bxIndustryNews {
margin: 0;
padding: 15px 0 0 0;
  width: 418px;
  float: left;
  display: inline;
  background-color: #fff;
}

#bxPeopleNews {
margin: 0;
padding: 15px 0 0 0;
    width: 570px;
	height: 172px;
  float: right;
  display: inline;
  background: #fff url(http://www.cleanlink.com/graphics/bkg_podcast.gif) repeat-x top left;
  border-right: 1px solid #eaeaea;
}
#podcast {
margin-top: 15px;
width: 555px;
height: 143px;
}

#podcast h2 { margin: 0; padding: 0 0 0 3px; background: none; border-bottom: thin #ccc solid; color: #666; font: 18px normal; }

#podcastLt2 {
  margin: 0;
  padding: 0 5px 0 8px;
  width: 255px;
  height: 109px;
  float: left;
  border-right: #ccc thin solid;
}

#podcastRt2 {
  margin: 0;
  padding: 0 5px 0 3px;
  width: 270px;
  height: 109px;
  float: right;
}

#podcastLt {
  margin: 0;
  padding: 0 5px 0 3px;
  width: 255px;
  height: 100%;
  float: left;
  border-right: #ccc thin solid;
}

#podcastRt {
  margin: 0;
  padding: 0 5px 0 3px;
  width: 270px;
  height: 100%;
  float: right;
}

#podcastLt h2, #podcastRt h2, #podcastLt2 h2, #podcastRt2 h2 { color: #333; font: bold 12px Verdana, Arial, Helvetica, sans-serif; background:none; padding: 0 0 5px 0; margin: 0; letter-spacing: normal;  }

/* now the three main columns, named in order of importance and display when styles switched off */

#mainContent  { display: inline; margin: 0; width: 990px; float: left; }
#mainContent2  { background: #fff url(http://www.cleanlink.com/graphics/bg_tile_white.gif) repeat-y; display: inline; margin: 0; width: 990px; float: right; }


#mainContentCL {
float:left;
width:990px;
display:inline;
margin: 0;
}

/* note here that specifying threeColLayout in the body will activate the following div instead of the default primaryContent */


#threeColLayout #mainContentCL  { background: url(http://www.cleanlink.com/graphics/diags.gif); margin: 0 0 0 180px; width: 630px; float: left }


#threeColLayout #mainContent  { background: url(http://www.cleanlink.com/graphics/bkg_3column.gif) center top; margin: 3px 0 0 180px; width: 630px; float: left;  }

#twoColLayout #mainContent2  { background: #fff url(http://www.cleanlink.com/graphics/bg_tile_white.gif) repeat-y; margin: 3px 0 0 180px; width:807px; float: left; }


#threeColLayout #threeColBorders {
width:990px;
background: url(http://www.cleanlink.com/graphics/bkg_threeColLayout.gif) center top;
padding: 0;
float: left 
}
/* note here that specifying twoColLayout in the body will activate the following div instead of the default primaryContent */

#twoColLayout #mainContent {
width:810px;
float:left;
margin: 0 0 0 180px;
background-color: #eaeaea;
}

/* just incase twoColLayout is specified in body, and secondaryContent is left in, we turn it off - not ideal, but it works */

#twoColLayout #rightContent {
display: none;
width: 1px;
}

#rightContent{
float:left;
width:180px;
margin: 3px 0 0 0;
}

#rightContent2{
float:left;
width:1px;
margin: 3px 0 0 0;
}

#rightContent_CLM{
float:left;
width:180px;
margin: 0;
background:url(http://www.cleanlink.com/graphics/bg_tile_white.gif) repeat-y ; 
}


#leftNav{
float:left;
display: inline;
width:180px;
margin: 0 0 0 -990px;
}


/* just incase oneColLayout is specified in body, and these are left in, we turn them off - not ideal, but it works */

#oneColLayout #rightContent, #oneColLayout #leftNav {
display: none;
}


/* box is the shaded area that holds a rounded corner box or flat box, fitting the given width of the column it is in. Usually combined with another class to control inner elements, eg box default */

.boxWide  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; margin: 20px 15px 0; padding: 0; width: 599px; height: 175px }

.boxLinks  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; margin: 20px 15px 0; padding: 0; width: 599px }

.boxSponsors  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; margin: 20px 15px 0; padding: 0; width: 599px; height: 550px }

.boxRt  { background: url("http://www.cleanlink.com/graphics/bt_lt_orange.gif") no-repeat left bottom; display: inline; margin: 10px 15px 0 0; width: 395px; float: right }

.box_floatRight  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; display: inline; margin: 10px 0 0; width: 98%; float: right }

.box_More  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; display: inline; margin: 0 10px 0 0; width: 225px; float: right }

.box_More_w  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey_w.gif") no-repeat left bottom; display: inline; margin: 0 10px 0 0; width: 225px; float: right; }

.box  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; margin: 10px 0 0 15px; width: 195px; float: none; }

.boxSponsorLinks  { background: url("http://www.cleanlink.com/graphics/bt_lt_grey.gif") no-repeat left bottom; display: inline; margin: 10px 0 0 15px; width: 250px; float: left }

/* BEGIN Inside Right/Left Product & Sponsors Boxes*/
.boxWide p.bx {
  margin: 0;
  padding:  10px 0 0 10px;
  width: 275px;
  float: left;
  display: inline;
}

.boxWide p.bxRt {
  margin: 0;
  padding: 3px 10px 0 0;
  width: 275px;
  float: right;
  display: inline;
}

.boxWide p.bxRtLong {
  margin: 0;
  padding: 3px 10px 0 0;
  width: 500px;
  float: right;
  display: inline;
}

.boxSponsors p.bx {
  margin: 0;
  padding:  3px 0 0 10px;
  width: 275px;
  float: left;
  display: inline;
}

.boxSponsors p.bxRt {
  margin: 0;
  padding: 3px 10px 0 0;
  width: 275px;
  float: right;
  display: inline;
}

/* END Inside Right/Left Product Boxes*/
.mainLt { width: 195px; float: left; display: inline; }
.mainRt { width: 395px; float: right; display: inline; }
.left {
  margin: 0;
  padding: 0 0 0 5px;
  width: 45%;
  float: left;
  display: inline;
  border-right: 1px #CCCCCC;
}
.right {
  margin: 0;
  padding: 0;
  width: 40%;
  float: left;
  display: inline;
}
.Lt {
  margin: 0;
  padding:  10px 0 0 0;
  width: 190px;
  float: left;
  display: inline;
}

.Rt {
  margin: 0;
  padding: 10px 10px 0 10px;
  width: 390px;
  float: left;
  display: inline;
}

.RtDouble {
  margin: 0;
  padding: 10px 10px 0 10px;
  width: 185px;
  float: left;
  display: inline;
}

.boxLeft {
  margin: 0;
  padding: 20px 0 0 0;
  width: 399px;
  float: left;
  display: inline;
}

.boxRight {
  margin: 0;
  padding: 0 10px 0 0;
  width: 190px;
  float: right;
  display: inline;
}

.boxRight2 {
  margin: 0;
  padding: 0 10px 0 0;
  width: 280px;
  float: right;
  display: inline;
}

.boxRightCLMin {
  margin: 0;
  padding: 0 10px 0 0;
  width: 310px;
  float: right;
  display: inline;
}
.boxLeftCLMin {
  margin: 0;
  padding: 20px 0 0 0;
  width: 300px;
  float: left;
  display: inline;
}

p.bxPlain {
  margin: 10px 0 0 10px;
  width: 260px;
  height: 140px;
  float: left;
  display: inline;
  background-color: #eaeaea;
  border: 2px solid #fff;
}

.bxPlain {
  margin: 10px 0 0 10px;
  width: 260px;
  float: left;
  display: inline;
  background-color: #eaeaea;
  border: 2px solid #fff;
}

.bxProduct {
  margin: 10px 0 0 10px;
  width: 280px;
  height: 190px;
  float: left;
  display: inline;
  background-color: #fff;
  border: 2px solid #eaeaea;
}

.bxProductWatch {
  margin: 10px 0 0 10px;
  width: 280px;
  height: 125px;
  float: left;
  display: inline;
  background-color: #fff;
  border: 2px solid #eaeaea;
}
.bxProductWatchAudio {
  margin: 10px 0 0 10px;
   float: left;
 width: 270px;
  background-color: #FFFFCC;
  border: 2px solid #eaeaea;
}
.bxProductWatchAudio .sponsor{
color:#333333;
font-size: 10px;
}

.box-outer  { background: url("http://www.cleanlink.com/graphics/bt_rt_orange.gif") no-repeat right bottom; padding-bottom: 5% }

/* orange border */
.box-inner  { background: url("http://www.cleanlink.com/graphics/tp_lt_orange.gif") no-repeat left top }

.box-outer2  { background: url("http://www.cleanlink.com/graphics/bt_rt_grey.gif") no-repeat right bottom; padding-bottom: 5% }

.box-outer_w  { background: url("http://www.cleanlink.com/graphics/bt_rt_grey_w.gif") no-repeat right bottom; padding-bottom: 5% }

.boxOuterProd  { background: url("http://www.cleanlink.com/graphics/bt_rt_grey.gif") no-repeat right bottom; padding-bottom: 5%; height: 145px }

.boxOuterSponsor  { background: url("http://www.cleanlink.com/graphics/bt_rt_grey.gif") no-repeat right bottom; padding-bottom: 5%; height: 520px }

/* grey border */
.box-inner2  { background: url("http://www.cleanlink.com/graphics/tp_lt_grey.gif") no-repeat left top }

.box-inner2 ul { list-style: none; }

.box-inner2 ul li a:link { font-size:10px; }

.box-inner_w  { background: url("http://www.cleanlink.com/graphics/tp_lt_grey_w.gif") no-repeat left top }

.box h2, .boxSponsorLinks h2, .boxWide h2, .boxLinks h2, .boxLinks h1, .boxSponsors h2, .boxSponsors h1, .box_floatRight h2, .box_More h2  { background: url("http://www.cleanlink.com/graphics/tp_rt_grey.gif") no-repeat right top; padding-top: 5px; height: 30px }

.box_More_w h2 { background: url("http://www.cleanlink.com/graphics/tp_rt_grey_w.gif") no-repeat right top; padding-top: 5px; height: 30px }

.boxRt h2  { background: url("http://www.cleanlink.com/graphics/tp_rt_orange.gif") no-repeat right top; padding-top: 5px; height: 30px }

.box h2, .boxSponsorLinks h2, .boxWide h2, .boxLinks h2, .boxLinks h1, .boxSponsors h2, .boxSponsors h1, .boxRt h2, .boxRt h2 img, .box_floatRight h2 { padding: 0 5% 0 5%; }

.box p, .boxSponsorLinks p, .boxWide p, .boxLinks p, .boxSponsors p, .boxRt p {
   padding: 0 3% 0 3%;
}
.box_floatRight p {
   padding: 0 0 0 0;
}
/* BOXES for magazine headers, logo and cover graphic */
.mag_lt {
  margin: 0;
  padding: 20px 0 20px 10px;
  width: 509px;
  height: 108px;
  float: left;
  display: inline;
}

.cover_rt {
  margin: 0;
  padding: 20px 10px 20px 0;
  width: 90px;
  float: right;
  display: inline;
}

/*.boxWide ul { list-style-type: none; margin: 0; padding: 0; }
.boxWide li { float: left; display: inline; margin: 0; width: 280px; height: 100%; padding: 0; background-color: transparent; }
.boxWide li.oneProd p { float: left; display: inline; margin: 0; padding: 5px 0 15px 15px; width: 280px; color: #999999; background: url(http://www.cleanlink.com/graphics/bkg_315px.gif) repeat top right; }
.boxWide li.twoProd p { float: left; display: inline; margin: 0; padding: 5px 0 15px 15px; width: 280px; color: #999999; } */
	
/* Styling */

div#bxIndustryNews h1{ font-size: 14px; padding: 15px 25px 0 25px; }
div#bxIndustryNews span a{ color: #fff; font-size:12px; }
div#bxIndustryNews p{ padding: 0 25px 0 25px; }
div#bxPeopleNews h1{ font-size: 14px; padding: 15px 25px 0 25px; }
/*div#bxPeopleNews a{ color: #663300; font-size: 12px; padding: 5px 0 0 0; }*/
div#bxPeopleNews p{ padding: 0 25px 0 25px; }
div#bxIndustryNews p.space, div#bxPeopleNews p.space{ padding: 0 25px 5px 25px; }

div#rightContent h1, div#rightContent2 h1{ font-size: 16px; padding: 20px 0 0 15px; }
div#rightContent p, div#rightContent2 p { padding: 1px 15px 1px 15px; }
div#rightContent2 p { font-size: 10px; }

div#mainContent h1{ font-size: 16px; padding: 0 0 0 15px; }
div#mainContent h1#others { padding: 40px 0 0 15px; }
div#mainContent h1#headline { color: #663300; font-size: 20px; padding: 0 0 0 15px; }

div#header p { margin:0; padding:0; }
div#header h1  { background: url("http://www.cleanlink.com/graphics/CleanLinkLogo.gif") no-repeat; text-indent: -9999px; margin: 0; padding: 0; position: absolute; z-index: 3; top: 131px; left: 5px; width: 350px; height: 59px }
div#header h1 a { display: block; width: 350px; height: 59px; text-indent: -9999px; }
#navSearch form { left: 769px; }
div#header h2  { background: url("http://www.cleanlink.com/graphics/CleanHoundLogo_sm.gif") no-repeat; text-indent: -9999px; margin: 0; padding: 0; position: absolute; z-index: 5; top: 166px; left: 818px; width: 171px; height: 23px }
div#header h2 a { display: block; width: 171px; height: 23px; text-indent: -9999px; }
div#header form { z-index: 4; position: absolute; right: 175px; top: 144px; width: 325px; height: 47px; margin: 0; padding: 0; }

div#navbar p { float: right; }
/* div#navbar p img { 0 0 15px 0 } */

#magazines ul { list-style-type: none; width: 990px; margin: 0; padding: 0; }
#magazines li { float: left; margin: 0; width: 330px; height: 100%; padding: 0; background-color: transparent;}
#magazines li#one h3 { float: right; width: 165px; margin: 0; padding: 35px 0 0 5px; font: 14px Verdana, Arial, san-serif; }
#magazines li#two h3 { float: right; width: 165px; margin: 0; padding: 35px 0 0 5px; font: 14px Verdana, Arial, san-serif; }
#magazines li#three h3 { float: right; width: 165px; margin: 0; padding: 35px 0 0 5px; font: 14px Verdana, Arial, san-serif; }
#magazines li#one p { float: right; margin: 0; padding: 5px 0 3px 5px; width: 165px; color: #ffffff; border-right: 2px #FF9933; }
#magazines li#two p { float: right; margin: 0; padding: 5px 0 3px 5px; width: 165px; color: #ffffff; border-right: 2px #FF9933; }
#magazines li#three p { float: right; margin: 0; padding: 5px 0 3px 5px; width: 165px; color: #ffffff; border-right: 2px #FF9933; }
#magazines li p { font: normal 11px verdana,arial,sans-serif; color: #fff; }
#magazines li p.small { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; color: #cccccc; }
#magazines li p a { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; padding: 10px 0 3px 0; color: #E4854D; text-decoration: none; }
#magazines li img { float: left; padding: 2%;}

/* date and posted control the small text info in article blurbs */
.center { text-align: center; }
.date { font: normal 9px Verdana, Arial, Helvetica, sans-serif; color: #333; padding: 0; }
.tag { font: normal 9px Verdana, Arial, Helvetica, sans-serif; color: #666; padding: 0 15px 0 15px; }
.specialHeadline { font: normal 9px Verdana, Arial, Helvetica, sans-serif; color: #666; padding: 0 15px 0 15px; }
.author { font: normal 10px Verdana, Arial, Helvetica, sans-serif; color: #666; padding: 0; }
a.author:link, a.author:active { font: normal 10px Verdana, Arial, Helvetica, sans-serif; color: #666; padding: 0; }
a.author:visited { font: normal 10px Verdana, Arial, Helvetica, sans-serif; color: #666; padding: 0; }
a.author:hover { font: normal 10px Verdana, Arial, Helvetica, sans-serif; color: #333; padding: 0; }
a.mag:link, a.mag:visited {
	font-size:10px;
	text-decoration:underline;
	font-weight:normal;
	color: #c60;
	}
a.mag:hover {
	font-size:10px;
	color: #c00;
	text-decoration: underline;
	}
.small { font: normal 9px Verdana, Arial, Helvetica, sans-serif; color: #999; padding: 0; }
.deckmain { font: normal 12px Verdana, Arial, Helvetica, sans-serif; color: #000; padding: 0; }
.deck { font: normal 12px Verdana, Arial, Helvetica, sans-serif; color: #333; padding: 0; }

a.posted {
padding: 0 0 20px 50px;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
color: #663300;
}
a.posted:hover {
padding: 0 0 20px 50px;
text-decoration: underline;
color: #666;
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
}

.postedUnderline {
display: block;
margin: 0 5px 5px 50px;
padding: 0 0 5px 0;
font-weight: bold;
color: #666;
border-bottom: 1px solid #999;
}

.specialColumn {
font-size: 12px;
font-weight: bold;
}

address {
margin-left: 50px;
}

/* BANNER AD, holds rotating banner ad */
#bannerAd {
clear:both;
width: 990px;
height: 75px;
margin: 0;
background-color: #333333;
}
#bannerAd img { padding: 7px 0 0 278px; }

/* erm, the footer */

#footer{
clear:both;
width: 990px;
height: 15px;
background-color: #FFF;
padding: 0px;
}
div#footer p { font: normal 9px Verdana, Arial, Helvetica, sans-serif; padding: 10px 0 10px 3px; }

#footer .copyright { color: #333333; font-size: 9px; }

#footer a:link, #footer a:visited {
color: #333333;
font-size: 9px;
}
#footer a:hover {
color: #000;
background: #333333;
font-size: 9px;
}

/* image control. First we define stuff common to ALL images on the page. It is then up to other styles to override these. By default, all images will have a 2px border, and bottom and right margins of 5px. They will all float left. */

img {
/* float: left; */
margin: 0;
border: 0;
} 

/* For any images in the default boxes - the pencil icons - I don't want the 2px border. So I set border to 0 */

#mainContent img.default {
float: none;
display: inline;
margin: 0;
padding: 0;
border: 0;
}

img.dots {
float: none;
display: inline;
margin: 0 15px 0 15px;
padding: 0;
border: 0;
}

/* For these larger images, I don't want them to float, for that causes the h3 above to be pushed to the right. I also declare a top margin to space the header and image apart, and also increase the border width slightly.  We also set it to display:block so that if body id is twoColLayout, the image will force the header and other bits to wrap around it */
#mainContentCL img.mainImage {
margin: 0 10px 10px 0;
border: 2px solid #333333;
}

img.magLogo {
float: left;
margin: 20px 0 0 10px;
padding: 0;
border: 0;
}

img.product {
float: left;
display: inline;
margin: 0 7px 0 0;
padding: 0 0 0 0;
border: 0;
}

img.blog {
float: left;
margin: 0 7px 0 0;
padding: 0;
border: 2px solid #333333;
}

img.blog2 {
display: block;
float: none;
margin: 1px 0 0 0;
padding: 0;
border: 2px solid #333333;
}

img.imgRight {
float: right;
margin: 0 7px 4px 5px;
padding: 0;
border: 0;
}

img.blog3 {
float: left;
margin: 0 1px 0 0;
padding: 0;
border: none;
}

img.navBar { margin: 0 0 0 10px; }

img.hotBox { display: block; float: none; margin: 20px 0 0 15px; }

img.ads { display: block; float: none; text-align: center; margin: 20px 0 0 0; }

#mainContent img#imgMain {
display: block;
float: none;
margin: 20px 0 0 10px;
border: 2px solid #333333;
}

img#imgMain2 {
display: block;
float: none;
margin: 20px 0 0 10px;
border: none;
}

img.hotBoxBorder { display: block; float: none; margin: 20px 0 0 15px; border:thin; }

/* used to ensure all our floated thumbnails stay the right width away from the left side of the box */

.thumbnails {
margin: 0 0 20px 50px;
}

/* spacer used immediately after the floated gallery thumbnails to ensure the box expands to hold them all */

.spacer {
clear: both;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


/* --------------------------

	CleanLink NAV styles

----------------------------- */

/* NAVIGATION BAR, global nav */
#mainNav, #mainNav ul {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	width: 990px;
	list-style: none;
	z-index: 100;
}

#mainNav a {
	display: block;
	text-decoration: none;
}

#mainNav a:link {
	display: block;
	color: #ffffff;
	text-decoration: none;
}

#mainNav a:visited {
	display: block;
	color: #ffffff;
	text-decoration: none;
}

#mainNav a:hover {display: block;}
#mainNav a:active {display: block;}

#mainNav li {
	float: left;
	margin: 0;
	padding: 0;
	width: 10em; /* width needed or else Opera goes nuts */
	height: 28px;
   background: #333;
}

#mainNav li ul { /* second-level lists */
	position: absolute;
	margin: -5px 0 0 0;
	background: #333;
	width: 175px;
	padding: 5px;
	line-height: 1.5em;
	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
	z-index: 10000;
}

/* lists nested items under hovered list items */
#mainNav li:hover ul ul, #mainNav li:hover ul ul ul, #mainNav li.sfhover ul ul, #mainNav li.sfhover ul ul ul {
	left: -999em;
}

#mainNav li:hover ul, #mainNav li li:hover ul, #mainNav li li li:hover ul, #mainNav li.sfhover ul, #mainNav li li.sfhover ul, #mainNav li li li.sfhover ul {
	left: auto;
}

#mainNav li:hover, #mainNav li.hover {
    position: static;
}

/* dropdown styles */
.dropNav li a {
	font-size: 10px;
	font-family: Verdana, Lucida, Helvetica, Arial, sans-serif;
	font-weight: normal;
	width: 175px;
	padding: 0 0 0 5px; /* this gives adds an indent to the dropdown link text */
	border-bottom: 1px dotted #ffffff;
}

.dropNav a:visited {
	display: block;
	width: 175px;
	color: #ffffff;
	text-decoration: none;
}
.dropNav a:hover {
	display: block;
	width: 175px;
	color: #ffffff;
	background-color: #777778;
}

.dropNav a:active {
	display: block;
	width: 175px;
	color: #ffffff;
	background-color: #777778;
}

/* BEGIN NAVIGATION, left nav */
#leftNav ul { font-size: 9px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; list-style: none; margin: 0; padding: 0; border: none; }
#leftNav li {
	float: none;
	margin: 0;
	padding: 0;
	width: 18em; /* width needed or else Opera goes nuts */
}
#leftNav li.header  { color: #000; font-size: 9px; font-family: Verdana, Lucida, Helvetica, Arial, sans-serif; padding-left: 0.5em; }
#leftNav li.hdrSpace  { color: #000; font-size: 9px; font-family: Verdana, Lucida, Helvetica, Arial, sans-serif; padding: 20px 0 0 0.5em; }
#leftNav li a   { color: #663300; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; display: block; padding: 0.2em 0 0 0.5em;  }
#leftNav li a:active   { color: #ffffff; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; background-color: #663300; display: block; padding: 0.2em 0 0 0.5em; }
#leftNav li a:hover   { color: #ffffff; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; background-color: #663300; display: block; padding: 0.2em 0 0 0.5em; }
#leftNav a.on { color: #ffffff; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; background-color: #663300; display: block; padding: 0.2em 0 0 0.5em; }

#leftNav ul#space { cursor: pointer; background-color: #eaeaea; display: block; margin: 1px 0 5px 0.5em; width: auto; border-left: 1px solid #ccc; } 
/* END NAVIGATION, left nav */

/* BEGIN NAVIGATION PRODUCT WATCH */
#ProdWatch { margin: 20px 15px 0; padding: 0; width: 599px; }
ul#ProductWatch  {  background: #FAA819 url(http://www.cleanlink.com/graphics/nav/mainNavBg.gif) repeat-x; list-style: none; margin: 0; padding:0; width: auto; float: left }
ul#ProductWatch li { float: left; border: 1px solid #fff; }
ul#ProductWatch a  { color: #333; line-height: 2.1em; text-decoration: none; background: url("http://www.cleanlink.com/graphics/nav/mainNavBorder.gif") repeat-y left top; display: block; padding: 0 1.1em; float: left }
ul#ProductWatch a:hover { color: #fff; }
/*ul#ProductWatch .first a { background: none; }*/
/* END NAVIGATION PRODUCT WATCH */
              
div#footer p{ font: normal 9px Verdana, Arial, Helvetica, sans-serif; padding: 10px 0 10px 3px; }


/* FORM ELELMENTS Styling*/
fieldset { margin: 0.5em 0; padding: 1em; border:1px solid #ccc; background: #eaeaea; }
fieldset.radio { margin: 0; padding: 0; border: none; background-color: #fff; }
/* legend styling */
legend {
	font-weight: bold;
}

form p {
  position: relative;
	width: auto;
}

#standard label { float: left; width: 10em; font-size: 1em; }
#radio label { float: left; display: inline; width: auto; font-size: 9px; }
#radio label.srchTxt { width: auto; font-size: 0.9em; }
#radio input.text { float: left; display: none; }
input.text { width: 200px; }

input.submit { width: auto; } 
input:focus, textarea:focus { background: #ffc; }
/* Styling Form Elements, useful for Firefox */
input[type="text"], textarea {
border-top: 2px solid #999;
border-left: 2px solid #999;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
}
*/

input[type="image"], #btn {
width: 50px;
height: 12px;
padding: 0;
margin: 0;
}

input.radio, input.checkbox, input.submit {
  width: auto;
}
input.radio { 
float: left;
margin-right: .1em; }

.bg input.radio { 
float: left;
margin-right: .1em; }

/* checkProduct form styling */
#checkProduct {
  margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

#checkProduct h2 {
  width: 10em;
	float: left;
	font-size: 1em;
	font-weight: normal;
}

#checkProduct div {
  width: 30em;
	float: left;
}

#checkProduct label {
  /*width: 3em;*/
	float: none;
	display: inline;
}

/* TABLE ELELMENTS Styling*/

/* Calendar table */
#calendarTable.clear{clear:both}
#calendarTable table{ width: 95%; border: solid 1px #666; border-collapse:collapse; }
#calendarTable caption{ font-size:1.2em; margin:1em 0;}
#calendarTable col{ font-family: Verdana, Arial, Helvetica, sans-serif; border-right:1px solid #ccc;}
#calendarTable col#monthRow{border:none;}
#calendarTable .month{color: #333; background-color: #E4854D; font-weight: bold; }
#calendarTable thead { background: #ccc url("http://www.cleanlink.com/graphics/bar.gif") repeat-x left center; border-top: 1px solid #a5a5a5; border-bottom: 1px solid #a5a5a5 }
#calendarTable th{text-align:left; width:25em;}
#calendarTable th, #calendarTable td{padding:0.1em 1em;}
#calendarTable .odd{background-color:#eaeaea;}
/*#calendarTable tr:hover{color:#fff;background-color:#666;}
#calendarTable thead tr:hover{color:inherit;background-color:transparent;}*/

/* default table */
.bg table { border-collapse: collapse; margin: 0 0 20px 10px; width: 96%}
.bg th, .bg td { padding: 0.1em 0.1em 10px 10px; }
.bg tr:hover a { background-color: #FFFFCC; }
.bg caption { text-indent: -1000em; height: 1px; } */

/* floated table */
table { border-collapse: collapse; margin: 0 0 15px 10px; float: left; display: none; }
th, td {  padding: 0 15px 0 15px; }
tr:hover a { background-color: #FFFFCC; }
caption { text-indent: -1000em; height: 1px; }

/* Community */
.community p{ padding: 0; margin-top: 0; margin-bottom: 5px; }