html { font-size:0.8em}
body, html { margin:0; padding:0; color:#000; background-color:#000;}
body { min-width:980px;	color: #333; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 100%;   }

#wrap { margin:auto; width:980px; }

a, a:hover, a:link { color: #ccc; text-decoration:none}	
a:hover { color: #ccc; text-decoration:underline;}

.bold { font-weight: bold;}
 
img, div, span, table, tr, td, input {border: none; padding:0; margin:0}
.clear { clear:both}

h1 { font-weight:bold; font-size:120%}
h2 { font-weight:bold; font-size:120%}
h3 { font-size:120%}

/******************************************         C O N T E N T        **********************************************************/

#pageOutercontainer {background:url(../images/purple/bg_background1.gif) top left repeat-y;float:left; width:980px }
#pagecontainer {background:url(../images/purple/bg_home.jpg) top left no-repeat; float:left; width:980px; min-height:606px}
#pagecontainer2 {}
#containerFooter { background:url(../images/purple/bg_footerbase.gif) bottom left no-repeat; width:980px; height:35px}


/* HOME */
#welcome {background:url(../images/purple/logo.gif) 21px 42px no-repeat; height:120px; width:400px; }
#welcometext {padding: 48px 0 15px 21px; color:#333; display:block}
#home-content {padding: 10px 0 20px 21px; width:390px; font-size:85%; color:#333; text-align:justify}
#home-content a, #home-content2 a{ color:#333; text-decoration:underline}
#home-content2 {padding: 0 0 20px 21px; font-size:85%; color:#333; text-align:justify}
#home-imagescontainer { padding: 0 0 0 21px}
#home-imagescontainer img { padding: 0 12px 0 0}

/* GET IN TOUCH */
#contactWrap { width:780px; float:left}
#contact-address {float:left; text-align: left; font-size:88%; line-height: 1.5em; padding: 10px; clear:both; width:463px}
#contact-container {width:463px; float: left; font-size: 90%; margin: 7px; }
#contact-container table.getintouch-tableA tr td.bold input, #contact-container table.getintouch-tableB tr td.bold textarea { border: 1px inset; width:274px }
#contact-container table tr { vertical-align:top}
#contact-container form table.getintouch-tableA { margin: 5px 0 40px 0}
table.getintouch-tableA, table.getintouch-tableB { width:434px; }
table.getintouch-tableA tr td.bold { width:160px; height:26px; }
table.getintouch-tableB tr td.bold div.courseinfo { width: 140px; float:left; font-size:95%; vertical-align:middle}
table.getintouch-tableB tr td.submit input { float:right}

/* STYLIST */
.stylist-row { width:100%; float:left; margin: 0 0 25px 0; }
.stylist-img {float: left; width:160px; padding: 0 10px 0 0}
.stylist-text { float:right; margin: 0 10px; font-size:85%; color:#333; }

/* SHOP */
#shop-content {padding: 48px 0 20px 0; width:763px; font-size:85%; color:#333; text-align:justify; float:left; }
#shop-leftcontent { width:397px; background-color:#000000; height:100%; float:left; color:#fff; }
#shop-leftcontent p { padding: 0 25px;}
#shop-rightcontent { float:right; width:359px; background-color:#e6e6e6; height:100%; padding:50px 0}
#shop-rightcontent-content, #shop-rightcontent-img { margin: 0 0 0 20px; float:left}
#shop-rightcontent img { float:left;}

#products-content { background-color: #E6E6E6; width:100%; margin: 10px 0 0 0 }
#products-content div.centre { margin: 12px 53px}

#product-content { xfloat:left; xbackground-color: #E6E6E6; width:744px; margin: 10px 0 0 0; xborder:1px solid red; border-left:10px solid #E6E6E6; border-right: 10px solid #E6E6E6; border-bottom:10px solid #E6E6E6; border-top: 10px solid #E6E6E6; text-align:center  }
#product-content img { text-align:center}
#prodimg { float: left; width:310px; height:400px; xborder:1px solid #FF0000; background-color:#fff; display:block; border-right: 10px solid #E6E6E6}
#prodtext { float: left; background-color:#000; color:#fff; height:400px; width:424px; text-align:left}

img#product-header { text-align:center}

.productblock { width: 100px; height: 135px; float: left; margin: 1px 5px 11px 0; xborder:1px solid red;  }
.productblock img {margin: 0 2px 0 2px; text-align:center;  }

.prodname { padding: 5px 4px; color: #1F1F1F; text-align:left; border-top:10px solid #E6E6E6; background-color:#FFF; margin: 0 0 0 2px; width:91px; font-size: 95%; letter-spacing: -0.1em; line-height: 1.5em; }
.prodname a, .prodname { color: #101010}
.clear{ clear:both;}

/*****************         N A V I G A T I O N        ********************/

#logo { width:778px; background-color:#000; height:83px}
#home-navigation {	clear:both;	width: 980px;	height:28px;	padding:0;	margin:0;	text-align:right;	background: #000; float:left}
#styleswitcher { float:left; font-size:80%; padding: 10px 0 0 10px; color:#fff}
ul#home-navigation-list { xheight:26px; list-style:none; xfloat:left; margin: 1px 0; padding: 0 0 0 20px; font-weight:lighter; vertical-align:middle; float:right }
ul#home-navigation-list li {height:28px; display:inline; padding-right: 13px;    }
ul#home-navigation-list li img { height:26px; padding:0; margin:0}


/******************************************         F O O T E R       **********************************************************/

#footer { clear:both; text-align: center; width: 980px; padding: 10px 0; color: #666666; font-size: 85% }
#footer img { vertical-align:middle}


ul#navlist { float: left; margin: 0; padding: 0; white-space: nowrap; height:24px; color: #666; text-transform:lowercase  }
#navlist li { display: inline; list-style-type: none; height:24px; margin: 0 10px 0 0 }
#navlist a {  text-decoration: none; color:#666 }
#navlist a:link, #navlist a:visited { color: #666; text-decoration: none; }
#navlist a:hover { color: #999; text-decoration: underline; }

.navcontainer {float: left; margin: 0; padding: 0;  }
span.copyright {float: right; color: #666; }
span.tingleweb { float:right; color: #666; margin: 0 0 0 10px}