
/* the appropriate background class will be applied based on class attached to the body */
body { margin: 0; padding: 0; font-family: Georgia, Times, serif; font-size: 13px; line-height: 16pt; color: #353536; }
#threeColLayout { background: #fff url(images/background2.gif) repeat-x fixed; }
#twoColLayout { background: #fff url(images/background2.gif) repeat-x fixed; }
#oneColLayout { background: #fff url(background.gif) repeat-x fixed;}
/* default links */
a:link { background-color: transparent; text-decoration: none; color: #0b69bc; }
a:hover { background-color: #fff; text-decoration: none; color: #163b65; }
a:visited { background-color: transparent; text-decoration: none; color: #fff }
/* headers here */
h1 { margin: 0; padding: 30px; font-size: 150%; color: #FF0000; text-indent: -9000px; }
h2 { margin: 0 0px 0 0px; padding: 2px; font-family: Georgia, Times, serif; font-size: 13px; line-height: 20pt; color: #353536; }
/* and then these h3 statements, unique to whichever section has been attached above, will give the headers the appropriate background color */
h3 { text-transform: uppercase; display: inline; font-size: 92%; margin: 10px 5px 0 5px; padding: 2px; }

/* main wrapper that holds it all centrally */
#wrapper { width:976px; margin:0; background-color: #fff; padding: 0 0px 0px 0px; }

/* default masthead holding the banner and mainNav */
#header {width: 976px;height: 210px; background:url(images/header1.jpg); }
#header.counterfeitSituations { width: 976px;height: 210px; background:url(images/header2.jpg); }
#header.safeMedicines { width: 976px;height: 210px; background:url(images/header3.jpg); }
#header.reportMedicines { width: 976px;height: 210px; background:url(images/header4.jpg); }
#header.members { width: 976px;height: 210px; background:url(images/header5.jpg); }
#header.links { width: 976px;height: 210px; background:url(images/header6.jpg); }


/* this is for any centered table page, such as the members page */
div.centered { text-align: center; }
div.centered table { margin: 0 auto; text-align: left; }

/* now the three main columns, named in order of importance and display when styles switched off */
#primaryContent { float:left; width:956px; display:inline; margin: 0 0 0 0; }

/* note here that specifying threeColLayout in the body will activate the following div instead of the default primaryContent */
#threeColLayout #primaryContent { float:left; width:270px; margin: 0 0 20px 43px;/*lastnumber was 195, making zero moved everything over*/}

#twoColLayout #primaryContent { width:555px; float:left; margin: 0 0 20px 195px; }
/* just incase twoColLayout is specified in body, and secondaryContent is left in, we turn it off - not ideal, but it works */
#twoColLayout #secondaryContent { display: none;}
/* twoColContent - used to span two right-hand columns - ONLY LEAVE THIS IN IF I DISCUSS IT - box used only if no selector */
#twoColContent{ width:500px; float:left; margin: 0 0 0 0px; padding: 0 0 0 35px}

/* note here that specifying twoColLayout in the body will activate the following div instead of the default primaryContent */
#secondaryContent{ float:left; width:270px; margin: 0 0 20px 15px; }
#sideContent{ float:left; width:270px; margin: 0 0 20px 15px; }
/* just incase oneColLayout is specified in body, and these are left in, we turn them off - not ideal, but it works */
#oneColLayout #secondaryContent, #oneColLayout #sideContent { display: none; }
.box { margin: 15px 0 0 0; padding: 5px 0 5px 0; background:url(images/diags2.gif); }
.box2 { margin: 15px 0 0 33px; padding: 5px 0 5px 0; background:url(diags2.gif); }
address {margin-left: 0px;}

#dottedrule { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0; float: left; /*font-weight: bold;*/ }
/* erm, the footer */
#footer{ clear:both; width: 976px; height: 85px; background: transparent url(footer.gif); padding: 0px; }
#footer p { margin: 10px 10px 0 50px; padding: 20px 4px 4px 0; /*font-weight: bold;*/ }
#footer a:link, #footer a:visited { color: #263c64; }
#footer a:hover { color: #0b69bc; background: #fff; }

/* 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: 0px 0px 0px 0px; 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 */
.default img { 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 */
.mainImage { display: block; float: none; margin-top: 130px; border: 0; }
.mainImage2 { display: block; float: none; margin-top: 10px; border: 0; }
.mainImage3 { display: block; float: none; border: 0; padding: 25px 25px 25px 25px;} /* incident graph */
.mainImage4 { display: block; float: right; border: 0; padding: 30px 0 10px 25px;} /* arrest photo */
/* spacer used immediately after the floated gallery thumbnails to ensure the box expands to hold them all */
.spacer { clear: both; }

/* horizontal main menu navigation - based on a method from Richard Rutter */
#mainNav { margin: 0px 0 0 20px; padding: 0; width: autopx; height: 20px; /*font-weight: bold;*/ font-size: 120%; }
#mainNav ul { list-style: none; margin: 0; padding: 0; border: none; }
#mainNav li { display: block; margin: 100; padding: 0; float: left; width: auto; }
#mainNav a { color: #3f4042; display: inline; width: auto; text-decoration: none; background: #fff; margin: 0; padding: 0px 20px;  }
#mainNav a:hover, #mainNav a:active { background: #fff;color: #0b69bc; }
#mainNav a.active:link, #mainNav a.active:visited { position: relative; z-index: 102; background: #fff; color: #0b69bc; /*font-weight: bold; */}

#subNav { margin: 0px 0 0 105px; padding: 0; width: autopx; height: 15px; /*font-weight: bold;*/ font-size: 100%; }
#subNav ul { list-style: none; margin: 0; padding: 0; border: none; }
#subNav li { display: block; margin: 100; padding: 0; float: left; width: auto; }
#subNav a { color: #3f4042; display: inline; width: auto; text-decoration: none; background: #fff; margin: 0; padding: 0px 20px;  }
#subNav a:hover, #subNav a:active { background: #fff;color: #0b69bc; }
#subNav a.active:link, #subNav a.active:visited { position: relative; z-index: 103; background: #fff; color: #0b69bc; /*font-weight: bold; */}

#subNav li.active a { color: #0b69bc; text-decoration: none; }
/*http://www.456bereastreet.com/archive/200503/css_tips_and_tricks_part_1/*/
/*
#subNav .sel { margin: 0px 0 0 250px; padding: 0; width: autopx; height: 15px; font-size: 100%;  }
#subNav .sel a { color: #3f4042; display: inline; width: auto; text-decoration: none; background: #fff; margin: 0; padding: 0px 20px; }
*/


#subNav2 { margin: 0px 0 0 227px; padding: 0; width: autopx; height: 15px; /*font-weight: bold;*/ font-size: 100%; }
#subNav2 ul { list-style: none; margin: 0; padding: 0; border: none; }
#subNav2 li { display: block; margin: 100; padding: 0; float: left; width: auto; }
#subNav2 a { color: #3f4042; display: inline; width: auto; text-decoration: none; background: #fff; margin: 0; padding: 0px 20px;  }
#subNav2 a:hover, #subNav2 a:active { background: #fff;color: #0b69bc; }
#subNav2 a.active:link, #subNav2 a.active:visited { position: relative; z-index: 103; background: #fff; color: #0b69bc; /*font-weight: bold; */}

#subNav2 li.active a { color: #0b69bc; text-decoration: none; }

/* Highlighting the current page */
body.home #mainNav a#home, body.counterfeitSituations #mainNav a#counterfeitSituations, body.safeMedicines #mainNav a#safeMedicines, body.reportMedicines #mainNav a#reportMedicines, body.members #mainNav a#members, body.links #mainNav a#links { color: #0b69bc; text-decoration: none; }
body.home #mainNav a:hover#home, body.counterfeitSituations #mainNav a:hover#counterfeitSituations, body.safeMedicines #mainNav a:hover#safeMedicines, body.reportMedicines #mainNav a:hover#reportMedicines, body.members #mainNav a:hover#members, body.links #mainNav a:hover#links { color: #0b69bc; }



ul.main { margin-top: 5px; margin-left:0px; list-style-type:square;font-size:13px; font-family:Georgia; color:#0b69bc; }


/*
#nodisappear ul { color:#0b69bc; margin-top: 0px; margin-left:5px; list-style-type:square; font-size:13px; font-family:Georgia;  }
#nodisappear li {  margin: 0; padding: 0; }
#nodisappear a { color: #0b69bc; display: inline;  text-decoration: none; background: #fff; margin: 0; }
#nodisappear a:hover, #nodisappear a:active { background: #fff;color: #163b65; }
#nodisappear a.active:link, #nodisappear a.active:visited { position: relative; z-index: 102; background: #fff; color: #0b69bc; }
*/

.nodisappear ul { color:#0b69bc; margin-top: 0px; margin-left:5px; list-style-type:square; font-size:13px; font-family:Georgia;  }
.nodisappear li { /*display: block;*/ margin: 0; padding: 0; }
.nodisappear a { color: #0b69bc; display: inline;  text-decoration: none; background: #fff; margin: 0; }
.nodisappear a:hover, .nodisappear a:active { background: #fff;color: #163b65; }
.nodisappear a.active:link, .nodisappear a.active:visited { position: relative; z-index: 102; background: #fff; color: #0b69bc; }

/*
ul.main a:hover, ul.main a:active { background: #fff;color: #0b69bc; }
ul.main a.active:link, ul.main a.active:visited { position: relative; z-index: 203; background: #fff; color: #0b69bc; }
*/

/* Highlighting the current page 
body.home #mainNav a#home, body.counterfeitSituations #mainNav a#counterfeitSituations, body.safeMedicines #mainNav a#safeMedicines, body.reportMedicines #mainNav a#reportMedicines, body.memberArea #mainNav a#memberArea, body.links #mainNav a#links, { color: #0b69bc; text-decoration: none; }

body.home #mainNav a:hover#home, body.counterfeitSituations #mainNav a:hover#counterfeitSituations, body.safeMedicines #mainNav a:hover#safeMedicines, body.reportMedicines #mainNav a:hover#reportMedicines, body.memberArea #mainNav a:hover#memberArea, body.links #mainNav a:hover#links,{ color: #0b69bc; }

*/

/*
Home
Counterfeit Situations
Safe Medicines
Report Counterfeit Medicines
Member Area
Links

Definitions
Incident Trends
Geographic Distribution
Arrest Data
Therapeutic Categories

CIS Forms
CIS Guide
Operating Plan
Resources
*/
