#carousel {display: inline-block; clear: left; width: 606px; padding-top: 5px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_outer_top.gif) no-repeat top;}
#carousel {display: block;}
#carousel .wrapper {display: inline-block; position: relative; width: 586px; background: #f6f6f6 url(http://p.webshots.net/images/grfk/grfk_carousel_bg.gif) repeat-x; border: solid #2464a7; border-width: 0 1px; overflow: hidden;}
#carousel .wrapper {display: block;}
#carousel .wrapper1 {padding-bottom: 5px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_outer_btm.gif) no-repeat bottom;}
#carousel .wrapper2 {padding: 5px 8px; border: solid #2465a5; border-width: 0 1px; background: #3a7dc3;}
#carousel h2 {margin: 0 10px 8px; color: #fff; font: normal 150% arial, sans-serif;}
#carousel ul {text-transform: lowercase;}
#carousel .content {display: inline-block; position: relative;}
#carousel .content {display: block;}
#carousel .sections {display: inline-block; padding-top: 5px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_inner_top.gif) no-repeat top; overflow: hidden;}
#carousel .sections {display: block;}
#carousel .section {float: left; position: relative; width: 588px; padding-bottom: 5px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_inner_btm.gif) no-repeat bottom; white-space: nowrap;}
html.js #carousel .section {position: absolute; left: -9999px;}
html.js #carousel .active {position: relative; left: auto;}
#carousel .section h3 {position: absolute; left: -9999px;}
#carousel .section ul {position: relative; width: 560px; margin: 0 30px; padding: 10px 0 16px; overflow: hidden;}
html.js #carousel .section ul {height: 100px;}
#carousel .section li {display: table; position: relative; float: left; height: 104px; padding: 0 8px;}
#carousel .section li div {display: table-cell; position: relative; vertical-align: middle;}
#carousel .section li div div {display: block;}
#carousel .section li img {display: block; border: 1px solid #e4e4e2;}
#carousel .section li em.new {position: absolute; bottom: -8px; left: -8px; width: 30px; height: 29px; background: url(http://p.webshots.net/images/icon/icon_new_burst.png) no-repeat; text-indent: -9999px;}
#carousel .section li span.video {position: absolute; bottom: -4px; left: -6px; width: 28px; height: 17px; background: url(http://p.webshots.net/images/icon/icon_carousel_video.gif) no-repeat; text-indent: -9999px;}
#carousel p {position: relative; clear: both; padding: 4px 10px 1px; font-size: 89%; background: #ecece4; color: #666; border-top: 1px solid #fefefe;}
#carousel p a {color: #1180d5;}
#carousel p cite img {display: inline; padding: 1px; background: #fff; border: 1px solid #dedede; vertical-align: middle;}
#carousel p.premium em {position: absolute; left: -9999px;}
#carousel p.premium cite {padding-right: 18px; background: url(http://p.webshots.net/images/icon/icon_premium_star_12x13.gif) no-repeat right;}

#carousel p.super em {position:absolute; left:-9999px}
#carousel p.super cite b {margin-left:5px; position:absolute; width:25px; height:20px; background: url(http://p.webshots.net/images/icon/icon_super_prem_sm.png) no-repeat;}
* html #carousel p.super cite b {background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://p.webshots.net/images/icon/icon_super_prem_sm.png', sizingMethod='image');}


#carousel-tabs {display: inline-block; position: relative; overflow: hidden; margin: 0 0 -1px 7px; z-index: 1;}
#carousel-tabs {display: block;}
#carousel-tabs * {float: left; display: inline;}
#carousel-tabs li {margin: 0 1.5px; padding-left: 5px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_inactive_left.gif) no-repeat;}
#carousel-tabs li a {color: #1180d5; background: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_inactive_right.gif) no-repeat top right; font: bold 94% arial, sans-serif; text-align: center;}
#carousel-tabs li a span {position: relative; margin: 0 1px 0 -4px; padding: 7px 13px 5px 12px; border-bottom: 1px solid #a7c5e1; cursor: pointer;}
#carousel-tabs li.active {background: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_active_left.gif) no-repeat;}
#carousel #carousel-tabs li.active a {color: #333 !important; background: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_active_right.gif) no-repeat top right;}
#carousel #carousel-tabs li.active a:hover {color: #333 !important;}
#carousel-tabs li.active a span {border-bottom-color: #fefefe !important;}
#carousel .side1,
	#carousel .side2 {position: absolute; top: 16px; width: 25px; height: 102px; background: no-repeat; z-index: 1;}
#carousel .side1 {left: 1px; background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_fade_left.png);}
#carousel .side2 {right: 1px; background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_fade_right.png);}
#carousel #scroll-l,
	#carousel #scroll-r {position: absolute; top: 65px; width: 29px; height: 29px; margin-top: -13px; background: url(http://p.webshots.net/images/grfk/grfk_carousel_buttons.gif) no-repeat; border: none; text-indent: -9999px; z-index: 1;}
#carousel #scroll-l.inactive {background-position: -29px;}
#carousel #scroll-r.inactive {background-position: -87px;}
#carousel #scroll-l {left: -5px;}
#carousel #scroll-r {right: -5px; background-position: -58px;}



/* clorox carousel 10/30 - 11/5 */
body#family #carousel.skin-clorox {background-image: url(http://p.webshots.net/images/skin/skin_clorox_carousel_top.jpg);}
body#family #carousel.skin-clorox a.clorox {display: block; height: 68px; background: url(http://p.webshots.net/images/skin/skin_clorox_carousel_btm.jpg) no-repeat bottom; text-indent: -9999px; overflow: hidden;}
body#family #carousel.skin-clorox .section {background-image: url(http://p.webshots.net/images/skin/skin_clorox_carousel_inner_btm.jpg);}
body#family #carousel.skin-clorox .wrapper1 {background: #a3c5e6 url(http://p.webshots.net/images/skin/skin_clorox_carousel_mid.jpg) center 7px; padding-bottom: 0;}
body#family #carousel.skin-clorox .wrapper2 {background: url(http://p.webshots.net/images/skin/skin_clorox_carousel_mid.jpg) no-repeat top; border-color: #556145; border-right-color:#818b73; padding-bottom: 0;} 
body#family #carousel.skin-clorox .wrapper2 h2 {visibility: hidden;}
body#family #carousel.skin-clorox .wrapper {border-color: #5e6b4c;}
body#family #carousel.skin-clorox .sections {background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_inner_top_green.gif);}
body#family #carousel.skin-clorox-tabs li {background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_inactive_left_green.gif);}
body#family #carousel.skin-clorox-tabs li a {color: #c93c20 !important; background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_inactive_right_green.gif);}
body#family #carousel.skin-clorox #carousel-tabs li.active {background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_active_left_green.gif);}
body#family #carousel.skin-clorox #carousel-tabs li.active a {background-image: url(http://p.webshots.net/images/grfk/grfk_carousel_tab_active_right_green.gif);}
body#family #carousel.skin-clorox-tabs li a span {border-bottom-color: #ecc4ba;}

