/* Fixes the flicker problem in IE6 when mousing over images.*/
html {
  filter: expression(document.execCommand("BackgroundImageCache", false, true));
}

/* eliminates the outline when clicking on a linked image in Firefox */
a {
	outline: none;
}

#slides {
  background: #FFF;
  height: 306px;
  position: relative;
  top: -20px;
}

.ie #slides {
  background: #FFF;
  height: 306px;
  position: relative;
  top: 0px;
}




ul#slides  li	{
	list-style:none;

	}

.slideimage {
  position: absolute;
  left: 0;
  top: 0;
  width: 802px;
  height: 296px;
  visibility: hidden;
}

#slide1	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3890.jpg);
	}
	

#slide2	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3356.jpg);
	}
	
#slide3	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3357.jpg);
	}
	
#slide4	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3358.jpg);
	}
	
.slideimage h2	{
	margin: 0 0 0 -2000px;
	}
	
#header1	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3359.gif) top left no-repeat;
	height: 34px;
	}
	
#header2	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3360.gif) top left no-repeat;
	height: 34px;
	}
	
#header3	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3361.gif) top left no-repeat;
	height: 34px;
	}
	
#header4	{
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3362.gif) top left no-repeat;
	height: 34px;
	}
	
div#copy	{
	color: #B0B0B0; 
	font-size: 14px;
	width: 400px;
	line-height: 18px;
	position: absolute;
	top: 150px;
	left: 400px;
	z-index: 2;
	}


li.on {
  z-index: 10;
  visibility: visible;
  
}

li.next {
  z-index: 9;
  visibility: visible;  
}

li#slide1 {
	visibility: visible;
}

ul#controls {
  background-image: url(http://www.cloroxenespanol.com/img/clorox/ES_3891.png);
  position: absolute;
  bottom: 19px;
  left: 0;
  margin: 0 !important;
  padding: 0 !important;
  display: inline;
  list-style: none;
  z-index: 100;
  width: 802px; /* 832 */
  height: 39px;
  overflow: hidden;
}

.ie6 ul#controls {
  background-image: url(http://www.cloroxenespanol.com/img/clorox/ES_3892.gif);
  position: absolute;
  bottom: 16px;
  left: 0;
  margin: 0 !important;
  padding: 0 !important;
  display: inline;
  list-style: none;
  z-index: 100;
  width: 802px; /* 832 */
  height: 39px;
  overflow: hidden;
}

ul#controls li { 
  float: left;
  display: inline;
}

ul#controls li a {
  color: #FFF;
  font-weight: bold;
  display: block;
  padding: 39px 0 0 0 !important;
  margin: 0 !important;
}

a#ctrl1, a#ctrl2, a#ctrl3, a#ctrl4 {
  background-image: url(http://www.cloroxenespanol.com/img/clorox/ES_3891.png);
}

.ie6 a#ctrl1, .ie6  a#ctrl2, .ie6 a#ctrl3, .ie6 a#ctrl4 {
  background-image: url(http://www.cloroxenespanol.com/img/clorox/ES_3892.gif);
}

ul#controls li a#ctrl1 {

  background-position: 0 0;
  width: 200px;
}
  ul#controls li a:hover#ctrl1 { background-position: 0 78px }
  ul#controls li a.on#ctrl1 { background-position: 0 39px }

ul#controls li a#ctrl2 {
  background-position: -200px 0;
  width: 125px;
}
  ul#controls li a:hover#ctrl2 { background-position: -200px 78px }
  ul#controls li a.on#ctrl2 { background-position: -200px 39px }

ul#controls li a#ctrl3 {
  background-position: -325px 0;
  width: 140px;
}
  ul#controls li a:hover#ctrl3  { background-position: -325px 78px }
  ul#controls li a.on#ctrl3  { background-position: -325px 39px }

ul#controls li a#ctrl4 {

  background-position: -405px 0;
  width: 147px;
}

  ul#controls li a:hover#ctrl4 { background-position: -405px 78px  }
  ul#controls li a.on#ctrl4 { background-position: -405px 39px  }
  
a:hover#ctrl1, a:hover#ctrl2, a:hover#ctrl3, a:hover#ctrl4, a.on#ctrl1, a.on#ctrl2, a.on#ctrl3, a.on#ctrl4 {
  background-position: 0 -50px;
}

/*#notice {
  background: #ffffff;
  width: 176px;
  height: 77px;
  position: absolute;
  top: -10px;
  right: 0px;
  z-index: 200;
}

#notice a {
  background: url(http://www.cloroxenespanol.com/img/clorox/ES_3327.png);
  display: block;
  width: 176px;
  height: 77px;
  text-indent: -3000px;
}


#notice a:hover {
  background-position: 0 77px;  
}*/

/*H1 TAG IN EXPANDING BLUE BOX*/
#notice {
	background: url(http://www.clorox.com/img/home/expand-notice.png) bottom left no-repeat;
	width: 176px;
	position: absolute;
	top: -10px;
	right: 0px;
	z-index: 200;
}

#notice h1 { margin: 8px 0 0 0; }

#notice h1 a {
	background: url(http://www.cloroxenespanol.com/img/clorox/ES_3794.png) 0 0 no-repeat;
	line-height: 19px;
	text-indent: -9999px;
	display: block; }
	
#notice h1 a:hover { background: url(http://www.cloroxenespanol.com/img/clorox/ES_3794.png) 0 0 no-repeat; }

#notice p {
	line-height: 1.2em;
	margin: 0 8px 10px 8px;
	padding: 0;
	text-decoration: none; 
}

#notice a p, #notice p a {
	margin: 0;
	padding-left: 10px\0; /* IE 8 Hack*/
	*padding-left: 10px; /* IE 6 & 7 Hack*/
	font-weight: normal;
	text-decoration: none; 
}

#notice a, #notice a:link, #notice a:visited {
	text-decoration: none;
} 

/*END OF BLUE EXPANDING BOX*/

a.learnmore {
  display: block;
  position: absolute;
  top: 230px;
  right: 250px;
  width: 140px;
  padding-top: 35px;
  height: 0;
  background: url(http://www.cloroxenespanol.com/img/clorox/ES_3328.png) no-repeat 0 0;
  overflow: hidden;
  z-index: 101;
}

  a:hover.learnmore { background: url(http://www.cloroxenespanol.com/img/clorox/ES_3328.png) no-repeat 0 -35px }

