/*
Theme Name: Billy Jealousy
Theme URI: http://wordpress.org/
Description: BJ Theme for WP 2.7.1; includes Sandbox Functions (modified sandbox_body_class)
Version: 1.0
Author: DB/JL
Author URI: http://dbcodeproject.com/
Tags: custom
*/




/* TEST
------------------------------------------------------------ */
/*
#header {
  background-color: lightblue;
}
  #navigation {
    background-color: orange;
  }
  form#searchform {
    background-color: pink;
  }
#section {
  background: lightgreen;
}
  #sidebar {
    background-color: wheat;
  }
  #content {
    background-color: pink;
  }
*/



/* MAIN
------------------------------------------------------------ */
body {
  font-size: 14px;
  font-family: "Myriad Pro", Arial;
  color: #000;
}
a {
  color: #C00;
  font-weight: bold;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}
.thread-alt {
  background-color: #f8f8f8;
}
.thread-even {
  background-color: white;
}
.depth-1 {
  border: 1px solid #ddd;
}
.even, .alt {
  border-left: 1px solid #ddd;
}
small {
  font-size: 0.9em;
  line-height: 1.5em;
}
acronym, abbr, span.caps {
  cursor: help;
}
acronym, abbr {
  border-bottom: 1px dashed #999;
}
blockquote {
  margin: 15px 30px 0 10px;
  padding-left: 20px;
  border-left: 5px solid #ddd;
}
blockquote cite {
  margin: 5px 0 0;
  display: block;
}
.center {
  text-align: center;
}
.hidden {
  display: none;
}
.navigation {
  display: block;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 60px;
}



/* FLASH
------------------------------------------------------------ */
#flash {
  width:100%;
  background-color: #F7E843;
  position:absolute; z-index:9;
  height:20px;
  padding-top:10px;
}
#flash p {
  color: #333;
  font-weight: bold;
  padding-left:20px;
}



/* FORM VALIDATION (RAILS GENERATED ELEMENTS, IDs and CLASSES)
------------------------------------------------------------ */
/* main div with both an id and class */
#errorExplanation.errorExplanation {
  width: auto !important;
  padding: 10px !important;
  border: 1px solid red !important;
  background: pink !important;
  margin-bottom: 10px;
  color: red;
}
/* ex: 7 errors prohibited this signup from being saved */
#errorExplanation.errorExplanation h2 {
  clear: both !important;
  font-size: 16px !important;
  font-weight: normal !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* ex: There were problems with the following fields: */
#errorExplanation.errorExplanation p {
  clear: both;
  font-weight: bold;
  margin: 10px 0 !important;
}
#errorExplanation.errorExplanation ul {
  list-style: disc outside;
  margin-left: 20px;
}
#errorExplanation.errorExplanation ul li {
}
div.fieldWithErrors select,
div.fieldWithErrors input {
  background: #FAEBE7;
  border: 1px dotted #F00;
}






/* TABLE
------------------------------------------------------------ */
div.table-container {
}
div.table-container table {
  width: 100%;
}
div.table-container table thead {
}
div.table-container table thead tr {
  background: #F3F3F3;
  text-align: center;
  font-weight: bold;
  color: #999;
  
}
div.table-container table thead tr th {
  padding: 5px;
}
div.table-container table tbody {
}
div.table-container table tbody tr {
}
div.table-container table tbody tr td {
  padding: 5px;
}
/**/
div.table-container table tfoot {
}


/* DEFINITION LISTS
------------------------------------------------------------ */
dl {
  width: 100%;
}
dl dt {
  float: left;
  clear: left;
  width: 140px;
  margin-bottom: 10px;
  font-weight: bold;
}
dl dt span {
  display: block;
  width: auto;
  float: left;
  padding: 10px;
}
dl dd {
  float: left;
  width: 300px;
  margin-bottom: 10px;
}
dl dd span {
  display: block;
  width: 100%;
  background: #F0F0F0;
  float: left;
  border: 1px solid #CCC;
  padding: 10px;
}
dl dd p {
}





/* CONTAINER
------------------------------------------------------------ */
#container {
  position: relative;
  margin: 10px auto;
  width: 960px;
}




/* HEADER
------------------------------------------------------------ */
#header {
  height: 95px;
  position: relative;
  background: url(images/separator_top.png) center bottom no-repeat;
}

#header div#logo {
  position: absolute;
  left: 0;
  top: 0;
  
  width: 158px;
  height: 67px;
  background: url(images/logo.png);
}
#header div#logo a {
  display: block;
  width: 100%;
  height: 100%;
}
#header div#logo a span {
  display: none;
}
#header div.description {
  display: none;
}





/* HEADER - NAVIGATION
------------------------------------------------------------ */
#navigation {
  position: absolute;
  top: 31px;
  left: 220px;
  width: 396px;
  height: 13px;
}
#navigation ul {
  margin-top: 0 !important;
}
#navigation ul li {
}
#navigation ul li a {
  position: absolute;
  top: 0;
  display: block;
  height: 13px;
}
#navigation ul li a span {
  display: none;
}

/* specific */
#navigation ul li.face a {
  background: url(images/nav_face.png);
  width: 33px;
  left: 0px;
}
#navigation ul li.shave a {
  background: url(images/nav_shave.png);
  width: 46px;
  left: 52px;
}
#navigation ul li.hair a {
  background: url(images/nav_hair.png);
  width: 33px;
  left: 119px;
}
#navigation ul li.body a {
  background: url(images/nav_body.png);
  width: 38px;
  left: 171px;
}
#navigation ul li.gift-travel a {
  background: url(images/nav_gift_travel.png);
  width: 86px;
  left: 228px;
}
#navigation ul li.apparel a {
  background: url(images/nav_apparel.png);
  width: 62px;
  right: 0px;
}




/* HEADER - USER
------------------------------------------------------------ */
#user {
  position: absolute;
  top: 0;
  right: 0;
}
#user ul {
  text-align: center;
  
}
#user ul li {
  display: inline;
  padding: 0 5px;
}
#user ul li a {
  text-transform: uppercase;
  font-weight: bold;
  color: #999;
  font-size: 12px;
}
/*
#user ul li.first {
  border-right: 1px solid #999;
}
#user ul li.first {
  padding-right: 10px;
}
*/
#user ul li:before {
  content: "|";
  margin: 0 10px 0 5px;
  color: #999;
}
#user ul li:first-child:before {
  content: "";
}



/* HEADER - SEARCH
------------------------------------------------------------ */
form#searchform {
  position: absolute;
  top: 28px;
  right: 0;
  
  width: 186px;
  height: 19px;
  padding: 0 !important;
  background: url(images/searchform_background.png) no-repeat;
}
form#searchform label {
}
form#searchform div {
}
form#searchform div input#s {
  position: absolute;
  left: 1px;
  top: 1px;
  width: 139px;
  height: 15px;
  border: 0;
  
  margin-right: 0;
  
  /*
  height: 18px;
  line-height: 18px;
  */
  /*
  font-size: 12px;
  border: 1px solid #999;
  */
}
form#searchform div input#searchsubmitimg {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 46px;
  height: 19px;
}



/* SECTION
------------------------------------------------------------ */
#section {
  padding: 0;
  margin-top: 5px;
}








/* FOOTER
------------------------------------------------------------ */
#footer {
  clear: both;
  overflow: auto;
  margin-top: 5px;
  background: url(images/separator_bottom.png) center top no-repeat;
}
#footer ul {
  margin-top: 50px;
  text-align: center;
}
#footer ul li {
  display: inline;
  padding: 0 5px;
}
#footer ul li a {
  text-transform: uppercase;
  font-weight: bold;
  color: #999;
  font-size: 12px;
}
#footer ul li:before {
  content: "|";
  margin: 0 10px 0 5px;
  color: #999;
}
#footer ul li:first-child:before {
  content: "";
}
/**/
#footer p.copyright {
  text-align: center;
  margin-top: 8px;
  font-size: 11px;
  color: #999;
  margin-bottom: 20px;
}





/* SECTION - CONTENT
------------------------------------------------------------ */
#content {
}
#content h1 {
  /*padding-top: 70px;*/
  color: #C00;
  padding-top: 10px;
  font-size: 18px;
  
  padding-bottom: 20px;
  border-bottom: 1px solid #999;
  margin-bottom: 20px;
}
#content h1 span {
  color: #999;
}
#content h2 {
  margin-top: 0 !important;
  /*margin: 30px 0 0;*/
}
#content h3 {
  padding: 0;
  margin: 30px 0 0;
}
#content h4 {
}
#content h5 {
}
#content h6 {
}
#content p {
  line-height: 17px;
  margin-bottom: 10px;
}




/* JSCROLL
------------------------------------------------------------ */

.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	/*background: #aaa;*/
	background: url(images/scroll_track.png) center repeat-y;
}
.jScrollPaneDrag {
	position: absolute;
	background: #FFF;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}
a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}