/**/
div#shadefinder p.shade a.a1 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat 0 0;}
div#shadefinder p.shade a.a1:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat 0 -65px;}
div#shadefinder p.shade a.a2 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -63px 0;}
div#shadefinder p.shade a.a2:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -63px -65px;}
div#shadefinder p.shade a.a3 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -126px 0;}
div#shadefinder p.shade a.a3:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -126px -65px;}
div#shadefinder p.shade a.a4 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -189px 0;}
div#shadefinder p.shade a.a4:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -189px -65px;}
div#shadefinder p.shade a.a5 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -252px 0;}
div#shadefinder p.shade a.a5:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -252px -65px;}
div#shadefinder p.shade a.a6 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -315px 0;}
div#shadefinder p.shade a.a6:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -315px -65px;}
div#shadefinder p.shade a.a7 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -378px 0;}
div#shadefinder p.shade a.a7:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -378px -65px;}
div#shadefinder p.shade a.a8 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -441px 0;}
div#shadefinder p.shade a.a8:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -441px -65px;}
div#shadefinder p.shade a.a9 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -504px 0;}
div#shadefinder p.shade a.a9:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -504px -65px;}
div#shadefinder p.shade a.a10 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -567px 0;}
div#shadefinder p.shade a.a10:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -567px -65px;}
div#shadefinder p.shade a.a11 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -630px 0;}
div#shadefinder p.shade a.a11:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -630px -65px;}
div#shadefinder p.shade a.a12 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -693px 0;}
div#shadefinder p.shade a.a12:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -693px -65px;}
div#shadefinder p.shade a.a13 {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -756px 0;}
div#shadefinder p.shade a.a13:hover {background: url(../../images/find_your_shade/swatches.jpg) no-repeat -756px -65px;}
/**/

body.shadepalette div#otherproductslist { margin-left:172px;}
body.shadepalette div#otherproductslist li{ padding:3px 0px; color:#0099FF; font-weight:bold; text-decoration:none;}
body.shadepalette div#otherproductslist h4 { font-size:90%; font-weight:bold; padding:20px 0px 10px; color:#000;}
body.shadepalette div#otherproductslist { clear:both; }


body#ni-graysolutions-home div#content {background: url(../../images/main_bkg.jpg) no-repeat 0% 0%; min-height:565px;}
body.graysolutions div#content {background: url(../../images/secondary_bkg.jpg) no-repeat top left;}
/* This !important declaration is bad form but I can't overwrite the site.css which used it */
body.graysolutions div#product-navigation h2.product { background:transparent url(../../images/NNE_logo.png) no-repeat 11px 15px !important; }

body.findyourshade div#cl-a div#cl-a-b { padding-top:140px; background: url(../../images/findyourshade.png) no-repeat 40px 110px; }
body.findyourshade div#cl-a div#cl-a-c { padding-top:15px; }
body.findyourshade div#cl-a div#cl-a-c h2 { margin-bottom:85px; padding-left:65px; }
body.findyourshade div#shadefinder-instructions { border:0; }

body.step1 div#cl-a-b div#findshade-step1 h1 { background:url(../../images/step1.png) no-repeat top left; }
body.step2 div#cl-a-b div#findshade-step2 h1 { background:url(../../images/step2.png) no-repeat top left; }
body.step3 div#cl-a-b div#findshade-step3 h1 { background:url(../../images/step3.png) no-repeat top left; }
body.step4 div#cl-a-b div#findshade-step4 h1 { background:url(../../images/txt_the_results_are_in.png) no-repeat center center;}

body.howtouse div#cl-a div#cl-a-c { padding-top:15px; }
body.howtouse div#cl-a div#cl-a-c h2 { padding-left:80px; }
body.howtouse div#cl-a div#cl-a-b div.product h1.title { background:url(../../images/HTU_header_text.png) no-repeat bottom left; }

body.shadepalette div#cl-a div#cl-a-b { padding-top:190px; background: url(../../images/hdr_FullShadePalette.png) no-repeat left 100px; }
body.shadepalette div#cl-a div#cl-a-b h2.phark { height:0; width:0; }
body.shadepalette div#cl-a div#cl-a-c { padding-top:15px; }
body.shadepalette div#cl-a div#cl-a-c h2 { padding-left:20px; margin-bottom:110px; }

body.shadepalette div#cl-a div#cl-a-b div.swatches .title h6 { font-size:85%; font-weight:bold; color:#000; line-height:1.5; vertical-align:middle; display:inline; }
body.shadepalette div#cl-a div#cl-a-b div.swatches .title a { vertical-align:middle; }
body.shadepalette div#cl-a div#cl-a-b div.swatches { position:relative; }
body.shadepalette div.tip { right:50px; position:absolute; top:20px; width:174px; z-index:10;}
body.shadepalette div.tip p { border:1px solid #083E88; border-width:0 1px; padding:0 10px;  background:#FFF; }
body.shadepalette div.tip .tipclose img { display:block; }

.phark {
    text-indent: -5000px;
    overflow: hidden;
    display:block;
}