/* CSS Document */
html {
min-height:100%;
margin-bottom:1px;
}
* {
padding:0;
margin:0;
}

body {
text-align:center;
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-size:14px;
}
#top-color {
position:absolute;
width:100%;
height:170px;
background-color:#9ca5aa;
top:0;
left:0;
}
#middle-color {
position:absolute;
width:100%;
height:565px;
top:170px;
left:0;
background-color:#dfecf3;
}
#wrapper {
position:relative;
width:930px;
z-index:1;
margin:0 auto;
text-align:left;
}

/*Header and Footer*/

#header {
width:930px;
}
#header .logo {
width:900px;
height:121px;
background-image:url(images/logo.gif);
background-position:left center;
background-repeat:no-repeat;
margin-top:10px;
}
#phone {
float:right;
margin-top:55px;
}
#footer {
clear:both;
height:40px;
padding:75px 0px 0px 0px;
}
#footer a:link, #footer a:visited {
color:#80898e;
text-decoration:none;
}
#footer a:hover, #footer a:active {
color:#000;
text-decoration:none;
}
#footer p {
float:right;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#666666;
}

/*Navigation*/

#navigation {
width:650px;
margin:0px 0px 0px 330px;
font-family:Arial, Helvetica, sans-serif;
}
#navigation ul {
list-style-type:none;
margin:10px;
text-decoration:none;
}
#navigation li {
display:inline;
padding:0px 20px 0px 0px;
font-size:14px;
}
#navigation a {
padding:5px;
color:#ffffff;
text-decoration:none;
}
#navigation #a:link, #a:visited {
color:#dfecf3;
}
#navigation a:hover, #navigation a#current {
color:#FFFFFF;
border-top:#f29538 4px solid;
}
.small-links {
width:225px;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding:10px 0px 10px 0px;
}
.small-links a:link, .small-links a:visited {
color:#f29538;
text-decoration:none;
}
.small-links a:hover, .small-links a:active {
color:#0469a0;
text-decoration:none;
}




/*layout*/

#left-side {
padding-top:10px;
float:left;
width:450px;
}
#left-side .container-left {
width:450px;
}
#left-side .h2 {
font-family:Arial, Helvetica, sans-serif;
color:#0469a0;
font-size:19px;
margin:55px 0px 10px 75px;
font-weight:bold;
}
#left-side .p1 {
height:52px;
background-image:url(images/bullet_1.gif);
background-position:center left;
background-repeat:no-repeat;
padding:15px 0px 0px 80px;
margin-bottom:10px;
}
.p1 a:link, .p1 a:visited {
color:#000000;
text-decoration:underline;
font-weight:bold;
}
#left-side .p2 {
height:52px;
background-image:url(images/bullet_2.gif);
background-position:center left;
background-repeat:no-repeat;
padding:10px 0px 0px 80px;
margin-bottom:10px;
}
#left-side .p3 {
height:52px;
background-image:url(images/bullet_3.gif);
background-position:center left;
background-repeat:no-repeat;
padding:15px 0px 0px 80px;
margin-bottom:10px;
}

#left-side .free {
margin:30px 0px 0px 80px;
}
#left-side strong {
color:#000;
}
#left-side a:link, #left-side a:visited {
color:#666666;
text-decoration:none;
font-weight:600;
}
#right-side {
width:425px;
float:left;
margin:20px 0px 0px 50px;
}
right-side .container-right {
width:425px;
}
#right-side .p1 {
height:135px;
background-image:url(images/pic_1.jpg);
background-position:center left;
background-repeat:no-repeat;
padding:0px 0px 0px 170px;
margin-bottom:30px;
}
#right-side .p2 {
height:135px;
background-image:url(images/pic_2.jpg);
background-position:center left;
background-repeat:no-repeat;
padding:0px 0px 0px 170px;
margin-bottom:30px;
}
#right-side .p3 {
height:135px;
background-image:url(images/pic_3.jpg);
background-position:center left;
background-repeat:no-repeat;
padding:0px 0px 0px 170px;
}
#right-side .p4 {
height:60px;
background-image:url(images/couvre.jpg);
background-position:center left;
background-repeat:no-repeat;
padding:0px 0px 0px 170px;
}

#right-side .p5 {
height:112px;
background-image:url(images/magic_hair.jpg);
background-position:center left;
background-repeat:no-repeat;
padding:20px 0px 0px 170px;
}
#right-side a:link, #right-side a:visited {
color:#f29538;
text-decoration:none;
font-weight:100;
}
#right-side a:hover, #right-side a:active {
color:#f29538;
text-decoration:underline;
padding-bottom:5px;
font-weight:100;
}
#right-side .h2 {
width:240px;
height:45px;
font-family:Arial, Helvetica, sans-serif;
color:#0469a0;
font-size:19px;
margin:75px 0px 5px 90px;
font-weight:bold;
background-image:url(images/shop_ico.gif);
background-position:right top;
background-repeat:no-repeat;
padding:10px 0px 0px 80px;
}
/*about us layout*/

#aboutus-content {
float:left;
width:650px;
margin:50px 0px 0px 65px;
}
#location {
width:450px;
padding-top:20px;
}
#location .map {
float:right;
margin-right:10px;
border:#333333 1px solid;
}
#location a:link, #location a:visited {
color:#333333;
text-decoration:underline;
}
.burnaby {
float:left;
margin:5px 10px 10px 0px; 
}
#side-bar-left {
float:left;
width:200px;
margin-top:50px;
}
#side-bar-left ul {
text-decoration:none;
list-style-type:none;
padding:10px;
}
#side-bar-left li {
color:#000000;
padding:10px 0px 10px 0px;
background-image:url(images/underline.gif);
background-position:left bottom;
background-repeat:no-repeat;
color:#80898e;
}
#side-bar-left a:link, #side-bar-left a:visited {
color:#80898e;
text-decoration:none;
}
#side-bar-left a:hover, #side-bar-left a:active {
color:#f29538;
text-decoration:none;
}

#blue-color {
position:absolute;
width:100%;
height:40px;
top:165px;
left:1px;
background-color:#dfecf3;
}
img {
border:none;
}

/*hair replacement layout*/

#hair-content {
float:left;
width:650px;
margin:50px 0px 0px 65px;
}
#hair-content a:link, #hair-content a:visited {
color:#f29538;
text-decoration:none;
}
#hair-content li {
color:#2872A9;
padding:10px;
list-style-type:upper-alpha;
margin-left:25px;
}
#hair-content ul {
padding:0;
margin-bottom:20px;
text-decoration:none;
}
.couple {
float:left;
margin:5px 10px 10px 0px 
}



/*contact us*/

#contact-content {
float:left;
width:625px;
margin:75px 0px 0px 65px;
border-left:#f19539 1px solid;
}
#contact-content .formintro {
padding-left:45px;

}
#contact-content .maintext {
font-family:Arial, Helvetica, sans-serif;
font-size: 1em;
font-style: normal;
}
#contact-content td {
padding:10px 10px 0px 0px;
color:#666666;
}
form {
padding-left:45px;
}
.hours {
color:#f19539;
font-weight:500;
}


/*product layout*/

#product-content {
float:left;
width:650px;
margin:50px 0px 0px 15px;
}
#couvre {
position:relative;
width:550px;
background-image:url(images/couvre.jpg);
background-position:left center;
background-repeat:no-repeat;
margin-bottom:20px;
}
#couvre .product-text {
width:350px;
margin-left:150px;
}
#product-content-two {
float:left;
width:650px;
margin:50px 0px 0px 65px;
}
#hair-fibre {
position:relative;
width:550px;
background-image:url(images/magic_hair.jpg);
background-position:left center;
background-repeat:no-repeat;
}
#hair-fibre .product-text-two {
width:350px;
margin-left:150px;
}
#product-content .h1 {
font-family:Arial, Helvetica, sans-serif;
color:#0469a0;
font-size:18px;
margin:0px 0px 20px 150px;
font-weight:bold;
padding-bottom:10px;
border-bottom:#f19539 1px solid;
}

/* site map */

#sitemap-content {
float:left;
width:650px;
margin:50px 0px 0px 65px;
}
#sitemap-content a:link, #sitemap-content a:visited {
color:#f29538;
text-decoration:none;
}
#sitemap-content a:hover, #sitemap-content a:active {
color:#f29538;
text-decoration:none;
}
#sitemap-content li {
color:#2872A9;
padding-bottom:5px;
list-style-type:none;
}
#sitemap-content ul {
padding:0;
text-decoration:none;
}




/*Common Selectors*/

h1 {
font-family:Arial, Helvetica, sans-serif;
color:#0469a0;
font-size:18px;
margin-bottom:10px;
font-weight:bold;
}
h2 {
font-family:Arial, Helvetica, sans-serif;
color:#0469a0;
font-size:18px;
margin-bottom:10px;
}
h3 {
font-family:Arial, Helvetica, sans-serif;
color:#000;
font-size:15px;
margin-bottom:10px;
}
p {
margin-bottom:15px;
font-family:Arial, Helvetica, sans-serif;
color:#666666;
font-size:14px;
line-height:18px;
letter-spacing:0.2px;
}