/* STANDARD HTML TAG RESET--------------- */
html, body {margin: 0; padding: 0; height: 100%; width: 100%;}
body, img,
h1, h2, h3, h4,
ul, li,
form {
border: 0;
margin: 0px;
padding: 0px;
}
/* STANDARD HTML TAG DEFINITION--------------- */
body,
form, input, p{
color: #4b4a4a;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
body {background-color: #d4ad6a;}
.home, .scents {
background-image: url(images/bg-oranament.png);
background-repeat: no-repeat;
background-position: left bottom;
}
h1 {
font-size:21px;
}
h2 {font-size:18px; /* ...other properties... */}
h3 {
font-size:15px;
}
h4 {
font-size:12px;
color: #FFFFFF;
}
#ratings a {
font-size: 10px;
color: #FFFFFF;
}
#page-left #ratings p {margin: 3px 0; padding: 0; color: #fff; height: auto;}
a {outline: none;}
a:link {color: #000; text-decoration: underline;}
a:visited {
color: #000000;
text-decoration: underline;
}
a:hover {
color: #000000;
text-decoration: underline;
}
.gray {text-transform: uppercase;}
p {
border: 0;
margin: 0px;
padding: 10px 0 0 0;
}
.float-right {float: right;}
#product-image img.no-margin {margin: 0;}
/* CONTAINER--------------- */
#main {
background-color: #fff;
border-bottom: 3px solid #671835;
border-top: 3px solid #671835;
}
#container, #footerContainer {
overflow: visible;
}
#footerContainer {
width:760px;
text-align: left;
padding: 0 0 0 150px;
}
/* HEADER--------------- */
#header-bg{
position: relative;
height: 50px;
background: #fff url(images/bg-header.jpg) repeat-x;
}
#header {
height: 50px;
text-align: right;
}
#headernav {
float: left;
width: 900px;
padding: 33px 0 0 0;
font-size: 9px;
}
#headernav li {
color: #222;
display: inline-block;
float: right;
list-style-type: none;
padding: 0 0 0 40px;
}
/* NAVIGATION--------------- */
#navigation {
position: absolute;
z-index: 100;
top: 0;
left: 40px;
width: 157px;
overflow: visible;
}
#navigation li {padding: 0; margin: 0; height: 20px;}
#navigation li a {display: block;}
dl#menu dt a {
color: #6d6d6d;
padding: 0 0 0 5px;
}
dl#menu li a.renew {
color: #007dcd;
}
dl#menu li a.aroma {
color: #000;
}
dl#menu dt a.pnav-on {
background-color: #671835;
color: #fff;
}
dl#menu li a, dl#menu dt a {
text-decoration: none;
display: block;
border: 0 none;
font-size: 10px;
line-height: 21px;
}
dl#menu li a:hover {
text-decoration: underline;
}
dl, dt, dd, ul, li {
list-style-type: none;
}
dl#menu dt {
padding: 0 0 12px 0;
text-decoration: none;
}
dl#menu {
margin: 5px 0 0 0;
}
dl#menu dt.subnavPad {
padding: 0;
}
dl#menu ul {
margin-top: -15px;
padding-top: 0;
padding-right: 0;
padding-bottom: 15px;
padding-left: 8px;
}
dd {padding: 0;
margin: 0;}
#btn-smc {
width: 110px;
}
#nav-shadow {
background-image: url(images/crafts-nav-shadow.gif);
background-repeat: repeat-y;
width: 5px;
height: auto;
margin: 0 0 0 197px;
}
/* CONTENT--------------- */
#content {
height: 478px;
width: 808px;
margin: 0 0 0 157px;
padding: 13px 0 10px 0;
}
#home #content {
height: 494px;
width: 790px;
margin: 0 0 0 165px;
padding: 0;
}
.scents #content {
background-image: url(images/shadow.png);
background-repeat: no-repeat;
background-position: 0px 13px;
}
#blank #content, #crafts #content {
height: auto;
}
#crafts #content {
margin:0px;
background-image: url(images/crafts-bg.gif);
background-repeat: no-repeat;
}
#copy, #pltcopy {
height: 462px;
width: 726px;
margin: 8px 41px;
}
#blank #copy {
height: auto;
min-height: 400px;
width: 450px;
margin: 40px 0 0 40px;
padding: 0 0 50px 20px;
}
#crafts #copy {
height: auto;
width: 575px;
margin: 40px 0 0 30px;
padding: 0;
}
#btn-previous {
height: 60px;
width: 41px;
padding: 401px 0 8px 0;
float: left;
}
#btn-next {
height: 60px;
width: 41px;
padding-top: 401px;
padding-right: 0;
padding-bottom: 8px;
padding-left: 0;
float: right;
}
#page-left {
height: 447px;
width: 363px;
padding: 15px 0 0 0;
float: left;
background-repeat: no-repeat;
position: relative;
}
#page-left p {
padding: 0 32px 0 35px;
font-size: 11px;
line-height: 16px;
clear: both;
height: 150px;
}
#header-end {
height: 48px;
width: 13px;
float: left;
}
#product-info {
width: 150px;
padding: 40px 0 0 25px;
}
#ratings {
width: 165px;
text-align: left;
color: #ffffff;
top: 351px;
left:135px;
position: absolute;
}
#page-right {
height: 462px;
width: 363px;
float: right;
}
#product-image {
float: right;
}
#product-image img {
margin: 40px 20px 0 0;
}
.scent-after {background: url(images/scent-atrain.jpg) no-repeat right bottom;}
.scent-ambvan {background: url(images/scent-ambvan.jpg) no-repeat right bottom;}
.scent-applecinn {background: url(images/scent-applecinnimon.jpg) no-repeat right bottom;}
.scent-applehol {background: url(images/scent-applecinnimon.jpg) no-repeat right bottom;}
.scent-citrussun {background: url(images/scent-citrus.jpg) no-repeat right bottom;}
.scent-cookie {background: url(images/scent-cookie.jpg) no-repeat right bottom;}
.scent-dream {background: url(images/scent-dreamgarden.jpg) no-repeat right bottom;}
.scent-emerald {background: url(images/scent-emeraldrainforest.jpg) no-repeat right bottom;}
.scent-fresh {background: url(images/scent-fresh.jpg) no-repeat right bottom;}
.scent-fsnow {background: url(images/scent-fsnow.jpg) no-repeat right bottom;}
.scent-gspice {background: url(images/scent-gspice.jpg) no-repeat right bottom;}
.scent-hawaiian {background: url(images/scent-tropwaters.jpg) no-repeat right bottom;}
.scent-lavender {background: url(images/scent-freshlavendar.jpg) no-repeat right bottom;}
.scent-lavendervio {background: url(images/scent-lavendarviolet.jpg) no-repeat right bottom;}
.scent-morningmead {background: url(images/scent-morningmeado.jpg) no-repeat right bottom;}
.scent-orchard {background: url(images/scent-orchardgarden.jpg) no-repeat right bottom;}
.scent-paradiseb {background: url(images/scent-paradise.jpg) no-repeat right bottom;}
.scent-pureb {background: url(images/scent-morningmeado.jpg) no-repeat right bottom;}
.scent-pureclean {background: url(images/bg-pureclean-r.jpg) no-repeat right bottom;}
.scent-raspberry {background: url(images/scent-raspberry.jpg) no-repeat right bottom;}
.scent-relaxspa {background: url(images/scent-relaxingspa.jpg) no-repeat right bottom;}
.scent-ruby {background: url(images/scent-rubyberries.jpg) no-repeat right bottom;}
.scent-seaside {background: url(images/scent-seasidebreezes.jpg) no-repeat right bottom;}
.scent-simplyvan {background: url(images/scent-vanilla.jpg) no-repeat right bottom;}
.scent-sok {background: url(images/scent-sok.jpg) no-repeat right bottom;}
.scent-sunnylaundry {background: url(images/scent-sunnylaundry.jpg) no-repeat right bottom;}
.scent-tropwaters {background: url(images/scent-tropwaters.jpg) no-repeat right bottom;}
.scent-whitepeony {background: url(images/scent-whitepeony.jpg) no-repeat right bottom;}
.scent-wintberry {background: url(images/scent-rubyberries.jpg) no-repeat right bottom;}
#product-large {
float: right;
}
#specialoffers {
clear: right;
float: right;
margin: 20px 0 0 0;
width:117px;
height: 40px;
}
#safety-image {
width: 337px;
height: 33px;
display: block;
clear: right;
float: right;
}
#scentcue {
position: relative;
}
#product-info p {
padding: 0px;
}
#product-nav {
margin: 0 0 17px 9px;
}
#product-nav img {margin: 0 3px 0 0;}
#product-nav li {list-style-type: none; float: left;}
.scentdetails {
clear:both;
display: block;
font-size: 10px;
padding-left: 14px;
}
.attributes {display: inline-block; float: right; text-align: right;}
.pr-scentedoil, .pr-crystalelements, .pr-electricgel,
.pr-adjustables, .pr-triscents, .pr-pearlscents, .pr-son, .pr-car {
color: #FFFFFF;
padding: 10px 5px 0 10px;
height: 36px;
float: left;
min-width: 170px;
white-space: nowrap;
}
.pr-scentedoil, .pr-crystalelements, .pr-electricgel {
background-image: url(images/header-scentedoil.png);
}
.pr-adjustables {
background-image: url(images/header-adj.png);
}
.pr-triscents {
background-image: url(images/header-tri.png);
}
.pr-pearlscents {
background-image: url(images/header-pearl.png);
}
.pr-son {
background-image: url(images/header-son.png);
}
.pr-car {
background-image: url(images/header-car.png);
}
.end-scentedoil, .end-crystalelements, .end-electricgel {background-image: url(images/header-scentedoil-end.png);}
.end-adjustables {background-image: url(images/header-adj-end.png);}
.end-triscents {background-image: url(images/header-tri-end.png);}
.end-pearlscents {background-image: url(images/header-pearl-end.png);}
.end-son {background-image: url(images/header-son-end.png);}
.end-car {background-image: url(images/header-car-end.png);}
.pr-after {color: #008d61;}
.pr-ambvan {color: #c37a40;}
.pr-applecinn {color: #570b2d;}
.pr-applehol {color: #bd3632;}
.pr-citrussun {color: #d44218;}
.pr-cookie {color: #936830;}
.pr-dream {color: #394c91;}
.pr-lavender, .pr-lavendervio {color: #461560;}
.pr-emerald {color: #005c25;}
.pr-fresh {color: #6a9c27;}
.pr-fsnow {color: #187537;}
.pr-gspice {color: #660033;}
.pr-hawaiian {color: #d92733;}
.pr-morningmead {color: #00a55d;}
.pr-mountain {color: #000;}
.pr-orchard {color: #cb6c95;}
.pr-paradiseb {color: #fe521b;}
.pr-pureb {color: #2c738c;}
.pr-raspberry {color: #60012a;}
.pr-relaxspa {color: #018475;}
.pr-ruby {color: #e30034;}
.pr-seaside {color: #006ba3;}
.pr-sok {color: #013559;}
.pr-simplyvan {color: #995019;}
.pr-sunnylaundry {color: #013244;}
.pr-tropwaters {color: #37802b;}
.pr-whitepeony {color: #820143;}
.pr-wintberry {color: #660033;}
textarea, input {margin: 5px 0;}
.right-callout {float: right; width: 250px; margin: 40px 0 0 0;}
.img-left {float: left; margin: 0 5px 0 0;}
.clear {clear: both;}
.pureclean-text {margin: 145px 0 0 0;}
#btn-pureclean {
float: right;
}
#plt #page-left p {height: 240px;}
span.ingredients p {font-size: 11px;}
/* CRAFTS--------------- */
#crafts h2 {
background-image: url(images/scissors.gif);
background-repeat: no-repeat;
padding: 0 0 0 30px;
}
#crafts p {padding: 0 0 10px 0;}
.craft-intro {margin: 0 0 15px 30px; width: 490px;}
#craft-start {
background: #FFF url(images/crafts-project-bg.png) no-repeat;
width: 305px;
height: 251px;
margin: 0 0 15px 0;
padding: 22px 250px 18px 30px;
}
.blue-box {
background: #b6dff2 url(images/crafts-border-r.png) repeat-y right;
width: 720px;
margin: 0 0 22px 0;
}
.blue-content {
padding: 33px 27px 24px 33px;
}
#craft-example {
float: right;
background: url(images/crafts-example-bg.jpg) no-repeat top right;
width: 226px;
height: 234px;
margin: 0;
padding: 7px 70px 0 7px;
text-align: right;
}
#craft-example img {
height: 215px;
border: 7px solid #FFF;
}
#craft-btns {text-align: center;}
.craft-by {font-size: 10px; margin: 0 0 0 30px;}
.jump-width {width: 240px;}
/* FOOTER--------------- */
#footer {
background: #d4ad6a url(images/bg-footer.jpg) repeat-x;
bottom: 0;
height: 124px;
padding-bottom: 10px;
}
#footernav {padding: 15px 0 0 0;}
#footernav li {
display: inline;
list-style-type: none;
padding: 0 15px 0 0;
}
#dial-logo {
margin: -21px 10px 0 0;
float: right;
height: 32px;
width: 33px;
}
#footer a, #headernav li a, #footernav li, .disclaimer {
font-size: 9px;
color: #222;
text-decoration: none;
}
#footer img.henkel-helps {float: right; margin: -24px 0 0 0;}
/* SEARCH--------------- */
.resultHead {font-weight: bold; font-size: 14px; background-color: #000; color: #fff; padding: 5px 10px;}
.resultRowTwo {background-color: #f4f4f4;}
.outerBorder {margin: 10px 0 0 0;}
/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.
Copyright 2006 � 2008 Mark Wubben,
Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben
See also and .
This software is licensed and provided under the CC-GNU LGPL.
See
*****************************************************************************/
@media screen {
.sIFR-flash {
visibility: visible !important;
margin: 0;
padding: 0;
}
h2.sIFR-flash {
width: 200px;
}
.sIFR-replaced, .sIFR-ignore {
visibility: visible !important;
}
.sIFR-alternate {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
display: block;
overflow: hidden;
}
.sIFR-replaced div.sIFR-fixfocus {
margin: 0pt;
padding: 0pt;
overflow: auto;
letter-spacing: 0px;
float: none;
}
}
@media print {
.sIFR-flash {
display : none !important;
height : 0;
width : 0;
position : absolute;
overflow : hidden;
}
.sIFR-alternate {
visibility : visible !important;
display : block !important;
position : static !important;
left : auto !important;
top : auto !important;
width : auto !important;
height : auto !important;
}
}
/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
.sIFR-active h1 {
font-family: Arial, Verdana, San-Serif;
color: #ffffff;
font-size: 21px;
visibility: hidden;
text-transform: uppercase;
white-space: nowrap;
}
.sIFR-active h1 sup {
font-size:10px;
}
.sIFR-active h2 {
font-family: Arial, Verdana, San-Serif;
color: #ffffff;
font-size: 21px;
visibility: hidden;
}
.sIFR-active h3 {
font-family: Arial, Verdana, San-Serif;
color: #4f4f4f;
font-size: 18px;
height: 24px;
visibility: hidden;
}
.sIFR-active h4 {
font-family: Arial, Verdana, San-Serif;
color: #ffffff;
font-size: 14px;
height: 20px;
visibility: hidden;
}
/* PUBLIX HOLIDAY LANDING PAGE--------------- */
body#publix {
background-color: #660031;
}
#publix #content {
height: 494px;
width: 790px;
margin: 0 0 0 165px;
padding: 0;
}
.publix {
background: #fff url(images/publix-bg-oranament.jpg) no-repeat 197px 0;
}
#publix #footer {
background: none;
}
#publix #footer a, #publix #headernav li a, #publix #footernav li, #publix .disclaimer {
color:#FFF;
}
#publix img.logo {
margin: 11px 0 0 0;
}
#publix #content {
text-align: center;
}
#publix-cones {
height: 324px;
padding: 17px 0 0 0;
width: 525px;
}
.rules {
color: #000;
font-size: 9px;
margin: 0 125px 12px;
}
#publix #footer img.henkel-helps {
display: none;
}
#publix #dial-logo {
background-color: #e9e9e9;
display: block;
padding: 3px;
}
#publix #footerContainer {
padding: 0 0 0 150px;
}
#publix #footernav {
padding: 15px 0 0 60px;
}
#publix-form a {
background-image: url(images/publix-form.png);
display: block;
float: left;
height: 62px;
margin: 0 23px 0 110px;
width: 267px;
}
#publix-rules a {
background-image: url(images/publix-rules.png);
display: block;
float: left;
height: 62px;
width: 163px;
}
#publix-logo {
float: left;
margin: 10px 0 0 19px;
}
#publix-content {
height: auto;
margin:0 0 0 157px;
padding:13px 0 10px;
width:808px;
}
#publix-content #copy {
height:auto;
margin:40px 0 0 40px;
min-height:400px;
padding:0 0 50px 20px;
width:450px;
}
#publix-content li {
margin: 15px 0 0 0;
}