/*
Theme Name: HairCheck
Theme URI: http://www.haircheck.com/
Description: Identity site for HairCheck.
Version: 1.1
Author: Jayme Lam
Author URI: http://www.4threaction.com/
Tags: blue, custom header, fixed width, two columns, widgets



*/
/* CSS Document */
body{ margin:0; padding:0; background:url(images/background_slate.jpg) #000000; font-family:Arial, Helvetica, sans-serif; font-size:14px; line-height:19px; }
#header{ margin:auto; width:975px; text-align: center; padding:15px 0 0 0;}
img{border:0;}

.alignleft{ float:left;}
.alignright{ float:right;}

h1{ font-size:24px; margin:0 0 25px 0; padding:0;font-weight:lighter;color:#4F334A;}
h2{ font-size:20px; font-weight:lighter; margin:0 0 25px 0; padding:0; border-bottom:1px solid #CCCCCC; color:#4F334A; font-family: Helvetica, Arial,sans-serif; }
h3{font-size:18px;font-weight:lighter;  margin:10px 0; padding:0; color:#660099;}

/*
#navBar{ margin:10px 0; clear:both; }
#navBar ul{ list-style:none; text-transform:uppercase; font-size:18px; margin:0; padding:10px 0;}
#navBar ul li{display:inline;border-top:1px solid #333333;padding:2px 15px; margin:0;}
#navBar ul li a{ color:#FFFFFF; text-decoration:none; }
#navBar ul li a:hover{ color:#FFCC00;}
*/
#sideBar{ width:170px; overflow:hidden; float:left;margin-right:10px;}
#sideBar ul{ list-style:none; margin:0; padding:0;}

#fullText{width:600px; margin:65px 0 65px 50px;}
/***************** home page elements*************/
#homeImage{width:975px; margin:auto;}

#homeBar{width:975px; margin:10px auto; height:160px;}
#homeBar #bar1{ float:left; margin-top:40px; width:435px; text-align:center;}
#homeBar #bar2 { float:left; }
#homeBar #bar2 ul{ list-style:none; padding:0; margin:0;}
#homeBar #bar2 ul li{ float:left;}
#homeBar #bar2 ul li a{ display:block; background:url(images/purple_box1.jpg) no-repeat; width:169px; height:160px; margin-left:10px;}
#homeBar #bar2 ul li a:hover{background:url(images/purple_box1_over.jpg) no-repeat #660066;}
#homeBar #bar2 ul li img{ border:0; padding:25px 0 0 15px;}


/****************** About section elements ***************/

#content{width:885px; margin:auto; margin-bottom:15px;}

#sideButtons{ width:169px;}
#sideButtons ul{ list-style:none; padding:0; margin:0;}
#sideButtons ul li a{ display:block; background:url(images/purple_box2.jpg) no-repeat; width:169px; height:130px; margin-bottom:8px;}
#sideButtons ul li a:hover{background:url(images/purple_box2_over.jpg) no-repeat #660066;}
#sideButtons ul li img{ border:0; padding:20px 0 0 15px;}

#page{ float:left; width:700px; min-height:700px; background:url(images/white_gradient.jpg) repeat-x #D7D7D7;}
#page #textArea{ width:400px; padding:65px 0 65px 50px;}
#page #fulltextArea{ width:600px; padding:65px 0 65px 50px;}
#page #pictureArea{ position:absolute; margin:20px 0 0 470px; z-index:1;}

ol{ margin:10px 20px; padding:5px;}
ol li{ margin-bottom:12px;}
ul{ margin:10px 20px; padding:5px;}
ul li{margin-bottom:12px;}


.navigation{ width:auto; margin:20px auto; overflow:auto; border:1px solid #CCCCCC; padding:10px;}

#postList{}
#postList ul{ list-style:none; margin-bottom:20px;}
#postList ul li{ clear:both; padding:4px; margin-bottom:10px;}
#postList ul li img{float:left; margin-right:10px; border:2px solid #CCCCCC;}


#postListThum{}
#postListThum ul{ list-style:none; margin:0; padding:0; margin-bottom:20px; width:600px;}
#postListThum ul li{float:left;padding:4px; margin:5px; width:175px; height:215px; text-align:center;}
#postListThum ul li img{ margin-bottom:10px;border:4px solid #fff;}
#postListThum ul li #textLink{ height:50px; margin:0; padding:0;}

/******************** footer *******************************/
#footer{ width:885px; text-align:center; clear:both; margin:10px auto; color:#666666; padding:8px; font-size:9px; }