/*------------------------
BCIR.com Style Sheet

version: 1.0
author: Mike Morrissey
website: http://www.3phase.com
------------------------- */

@media screen
{
    /*
    General CSS
    */

	body {
	  padding: 0;
	  margin: 4px 0 0 0;
	  font: 12px Trebuchet MS, Arial, Helvetica, sans-serif;
	  text-align: center; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	  min-width: 842px; /* Centered design work around for Netscape 6. */
	  background:url(../images/backgroundHybrid.png) repeat-x top center;
	
	}
	
	body#two_column {
	  padding: 0;
	  margin: 0;
	  font: 12px Trebuchet MS, Arial, Helvetica, sans-serif;
	  text-align: center; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	  min-width: 842px; /* Centered design work around for Netscape 6. */
	  background:url(./images/secondBG.png) repeat-x;
	}

	/* Class for clearing floats */
	.clear { clear:both; }
	
	/* Remove border around linked images */
	img { border: 0;
		z-index: 0;}
	
.floatimgleft {
	float:left;
	margin-top:7px;
	margin-right:7px;
	margin-left:7px;
	margin-bottom:7px;
	border: 0px solid #043149;
}

.floatimgright {
	float:right;
	margin-top:7px;
	margin-left:7px;
	margin-right:7px;
	margin-bottom:7px;
	border: 0px solid #043149;
}

.caption {
	font-size: 10px;
	font-family:"Trebuchet MS", Georgia, "Times New Roman", Times, serif;
	font-weight: bold;
	text-align:center;
	margin: 4px 0;
}

	p { margin: 0.8em 0; }

	h1, h2, h3, h4, h5 { margin: 0.4em 0; color:#4f8536; }
	h1 { font-size: 1.5em; }
	h2 { font-size: 1.2em; color: #333333}
	h3 { font-size: 1.1em; }
	h4 { /* different color */ }
	h5 { /* different color */ }

	/*
      Header
    */
	#branding { height:149px; }

	#branding h1 { height:113px; width:466px; margin:0; float:left; position:relative; }
	#branding h1 span { height:100%; width:100%; position:absolute; background:url(../images/header2.png) no-repeat; }
	#branding_sub span {
		
		float:left;
		
	}
	
	#three_column #branding_sub { height:227px; display:block;position: relative; top: 0px;  }
	#two_column #branding_sub { height:227px; position: relative; top: 0px; }

	/*
    Section Headers
    */

	h2#banner { width:490px; height:93px; margin:0; padding:0; float:left; position:relative; }
	
	body.about_us h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_about_us.jpg) no-repeat; }
	body.about_cancer h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_about_cancer.jpg) no-repeat; }
	body.brachytherapy h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_brachytherapy.jpg) no-repeat; }
	body.research h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_research.jpg) no-repeat; }
	body.your_visit h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_your_visit.jpg) no-repeat; }
	body.contact h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_contact.jpg) no-repeat; }
	body.privacy h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_privacy.jpg) no-repeat; }
	body.thanks h2#banner span { width:100%; height:100%; position:absolute; background:url(../images/banners/banner_thanks.jpg) no-repeat; }
	
	/*
    Links
    */

	a:link { color: #51713f;; }
	a:visited { color: #51713f;; }
	a:hover {  }
	
	/*
	Top Small Navigation
	*/
	#nav_sub { margin:0; float:right; text-align:center;}
	#nav_sub, #nav_sub a { color: #51713f; }
	
	
	#nav_supp { margin:5px 0; text-align:center; font-size: 0.92em; }
	#nav_supp, #nav_supp a { color: #ee3b33; }
	#nav_supp a { padding:0 3px; text-decoration: none; }
	#nav_supp a:hover { text-decoration: underline; }



	/*
	  Footer
	*/
	#site_info { margin-bottom:5px; text-align:center; font-size: 0.92em; }
	#site_info, #site_info a { color: #ee3b33;}
	#site_info a { text-decoration: none; }
	#site_info a:hover { text-decoration: underline; }


	/* 
       Structure
	*/
	#container {
	  width: 842px;
	  margin: 0 auto;
	  text-align: left; /* Centered design work around for IE 5.X and 6 in quirks mode. */
	}

	#content { width:842px; }

	#content_main {
		float: left;
		width: 480px;
		padding:0;
		margin-right: 20px;
	}
	
	#content_sub {
		width: 342px;
		float:right;
		
	}
	#three_column #content { margin-top:0px; background:url(../images/bg_content_home.gif) repeat-y; }
	#two_column #content { margin-top:0px; background:url(../images/bg_content2.gif) repeat-y; }

	#footer { margin-top:15px; background:url(../images/footerbg2.png) repeat-x top; }
	
	/*
	  Menu
	*/
	
	/*
	hybrid menu
	*/
	
	#divNav {
			/* background: transparent url(bk-nav.jpg) no-repeat top left; */
			margin: 0;
			padding: 0;
			height: 77px;
			width: 842px;
		}

		#nav {
			position: relative;
			top: 0px;
			margin: 0 0 0 40px;
			padding: 0;
			height: 77px;
			width: 802px;
		}

		#nav li ul, #nav li ul {
			margin: 0;
			padding: 0;
		}

		#nav a {
			text-decoration: none;
		}

		#nav li { /*float the main list items*/
			height: 40px;
			margin: 0;
			float: left;
			display: block;
			padding-right: 15px;
		}

		#nav li ul {
			display: none;
		}

		#nav li.off ul, #nav li.on ul  { /*put the subnav below*/
			position: absolute;
			top: 40px;
			left: 0;
			padding-top: 12px;
			/* background: #224d6f; */
			height: 25px;
			width: 782px;
			padding-left: 20px;
			display:none;
		}

		#nav li.on ul {
		/*	background: #f90; */
			display:block;
		}

		#nav li.on:hover ul, #nav li.over ul { /*for ie*/
		/*	background: #224d6f; */
		}

		#nav li a {
			color: #224d6f;
			font-weight: bold;
			display: block;
			padding: 0;
		}

		#nav li.on a {
			color: #f90;
		}

		#nav li.on ul a, #nav li.off ul a {
			border: 0;
			float: left; /*ie doesn't inherit the float*/
			color: #f90;
			width: auto;
			margin-right: 15px;
		}

		#nav li.on:hover ul a, #nav li.over ul li a { /*for ie - the specificity is necessary*/
		/*	background: #224d6f; */
		}

		#nav li.on ul {
			display: block;
		}

		#nav li.off:hover ul, #nav li.over ul {
			display: block;
			z-index: 6000;
		}

		#nav li.off a:hover, #nav li.on a:hover { 
			color: #f90;
		}

		/*do the image replacement*/

		#nav li span {
			position: absolute;
			left: -9384px;
		}

		#liHome a, #liBCIREducation a, #liAboutUs a, #liCommunityTools a, #liTestimonials a {
			height: 40px;
			display: block;
			position: relative;
			height: 40px;
			background: url(../images/bcirMenuImageMap.png) no-repeat; /*contains all hover states*/
		}
		#liHome ul li, #liBCIREducation ul li, #liAboutUs ul li, #liCommunityTools ul li, #liTestimonials ul li {
			height: 1.7em;
		}
		#liHome ul li a, #liBCIREducation ul li a, #liAboutUs ul 
li a, #liCommunityTools ul li a, #liTestimonials ul li a {
			height: 1.7em;
		}
		
		

	/*first, put the initial states in place*/

	#liHome a {
		background-position: -22px 0;
		width: 99px;
	}

	#liBCIREducation a {
		background-position: -130px 0;
		width: 150px;
	}

	#liAboutUs a {
		background-position: -309px 0;
		width: 139px;
	}

	#liCommunityTools a {
		background-position: -469px 0;
		width: 166px;
	}

	#liTestimonials a {
		background-position: -656px 0;
		width: 162px;
	}

	/*active area - for this demo - the code could be based on a body class, and probably work better.*/

	 #liHome.on a {
	 	background-position: -22px -83px;
	 }
	#liBCIREducation.on a {
	 	background-position: -130px -83px;
	 }
	#liAboutUs.on a {
	 	background-position: -309px -83px;
	 }
	#liCommunityTools.on a {
	 	background-position: -469px -83px;
	 }
	#liTestimonials.on a {
	 	background-position: -656px -83px;
	 }
	
	/*hover states*/

	#liHome a:hover, #liHome:hover a, #liHome.over a {
		background-position: -22px -42px;
		position: relative;
		top:-1px;
	}

	#liBCIREducation a:hover, #liBCIREducation:hover a, #liBCIREducation.over a {
		background-position: -130px -43px;
	}

	#liAboutUs a:hover, #liAboutUs:hover a, #liAboutUs.over a {
		background-position: -309px -43px;
	}

	#liCommunityTools a:hover, #liCommunityTools:hover a, #liCommunityTools.over a {
		background-position: -469px -43px;
	}

	#liTestimonials a:hover, #liTestimonials:hover a, #liTestimonials.over a {
		background-position: -656px -43px;
	}

	/*subnav formatting*/

	#nav li.off ul a, #nav li.on ul a {
		display: block;
		/* background: #224d6f; */
		background-image: none;
		color: #fff;
		font-family: arial, verdana, sans-serif;
		font-size: 10px;
	}		

	#nav li.on ul a {
	/*	background: #f90; */
	}
	
}
