@import url(luna_core.css);

/*
This file inherits from luna_core.css, so styles in this file will override styles defined in it.  Changes to this file will NOT be overwritten during upgrades.

Here's a quick tutorial on overriding styles.  Say you want to change the background colour of the body.  Looking at luna_core.css, the colour is defined in the rule:

    body {
      margin: 0px;
      padding: 0px;
      color: #33332e;
      background: #ffffff;
      font: normal 11px arial, tahoma, geneva, verdana, sans-serif;
      text-align: center;
    }

To change the background colour of white (#ffffff) to gray (#dddddd), you would add the following to this file:

    body {
      background: #dddddd;
    }

If you also wanted to change the font as well as the background, then you could
use:

    body {
      background: #dddddd;
      font: normal 12px times new roman;
    }

Also note that every template's body id is assigned the template name (without the .html extension).  So if you want to change the h2 heading in the category.html template, you can do this by:

    #category h2 { 
      color: red; 
      font-weight: bold; 
    }

To start you off, some sample overriding styles have been provided below.
Note
that you will have to uncomment the rules for them to work.
*/

/* Logo size and image source */
/*
#logo {
  width: 250px;
  height: 80px;
  background-image: url(images/logo.gif); } */
/* If the height of your logo changes from the original, then you will probably want to also change the vertical position of the login link */
/*
#loginbar a {
  margin-top: 25px;
}
*/

/* Show the left sidebar */

#ocwrapper {
  background: #ffffff;
  border-left-width: 180px;
  border-left-color: #ffffff;
}
#leftsidebar {
  width: 170px;
  display: block;
  margin-left: -180px;
  padding: 10px 0px 0px 0px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
}
#contentheader .error, #contentheader .message {
  margin: 0px 180px 0px 180px;
}


/* Hide the right sidebar */

#ocwrapper {
  border-right-width: 0px;
}
#rightsidebar {
  display: none;
  
}
#contentheader .error, #contentheader .message {
  margin: 0px;
}


/* Change the right sidebar width.  Note that the sidebars have a 10px left or right padding (left sidebar has a left padding and right sidebar has a right padding), hence the 150px - 10px = 140px width */
/*
#ocwrapper {
  border-right-width: 150px;
}
#rightsidebar {
  margin-right: -150px;
  width: 140px;
}
#contentheader .error, #contentheader .message {
  margin: 0px 150px 0px 0px;
}
*/

/* Change width of document */

#wrapper {
  width: 800px;
}


/* Don't want the shadows? */

.shadowtop, .shadowbottom, .shadowleft, .shadowright {
  background: none;
}
.shadowtopleft, .shadowtopright, .shadowbottomleft, .shadowbottomright {
  width: auto;
  height: auto;
  float: none;
  background: none;
}


/* If you change the globals category_cols or home_category_cols, then you will need to change the width of the columns themselves.  Note that IE sometimes has problems if this value adds up to 100%, so keep the width a little under 100%.
For example, if you changed category_cols to 3, then this example would set the width of the columns to 33% (99% total).  If you want to change the columns on the home page as well, then remember to set a rule for "#home dl" as well. */

#category dl {
  width: 25%;
}
#home dl {
  width: 25%;
}


/*-----------*\
|* searchbar *|
\*-----------*/
.searchbar {
  margin-bottom: 3px;
  padding: 5px 5px;
  border-bottom: 4px solid #CD5717;
  background: #353534;
  text-align: right;
 color: #ffffff;
  width: 768px;
}
.searchbar input.text, .searchbar input.submit {
  margin-right: 5px;
}
/* setting this in mozilla causes rendering issues */
* html .searchbar input.submit {
  height: 21px;
}
/* these colours are the same as defined by 'a', but we unset a:visited */ .searchbar a {
  color: #ffffff;
  font-size: 10px;
}
.searchbar a:hover {
  color: #5c5b66;
}

/*--------*\
|* footer *|
\*--------*/
#footer {
  margin-top: 3px;
  padding: 5px;
  border-top: none;
  background: #ffffff;
  text-align: center;
font-size: 11px;
  font-family:Arial, Helvetica, sans-serif; } #footer img {
  float: none;
}

#footer p {
  margin: 0px;
  padding: 10px 0px;
  color: #000000;
  font-size: 9px;
}

.comm_header {
  padding: 3px;
  background: #353534;
  border-bottom: 4px solid #cd5717;
  color: white;
  font-size: 14px;
}

.comm_detailed_dvd_sub_header {
  padding: 3px;
  background: #C4FF99;
  color: black;
  font-size: 14px;
}

.comm_sub_header {
  padding: 3px;
 color: #cd5717;
  width: "100%";
}

.comm_form {
  padding: 3px;
  font-size: 12px;
  font-weight: bold;
  line-height: 16px;
}
.comm_divide {
  background: url('/reviews/images/sidebar_divider.gif') repeat-x;
 width: 100%;
 height: 10px;
}

.body { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12pt;
color: #000000 }

#home dt a {
  font-weight: normal;
  line-height: 20px;
  font-size: 11px;
  text-decoration: none;
}

a {
  color: #000000;
text-decoration: none;
}
a:visited {
  color: #000000;
text-decoration: none;
}
a:hover {
  color: #5c5b66;
  text-decoration: none;
}


.hl {
  background: #e5e5e5;
  padding: 3px;
  width: 100%;
}

.scoring_header {
  font-size: 12px;
  padding-top: 5px;
  padding-bottom: 3px;
  color: #4b6282;

}
.scoring_description {
 font-size: 12px;
 padding-bottom: 3px;
 text-align: justify;
}

.side_rating_header {
  background: url(/reviews/images/rating_gradient_header.gif) repeat-x;
  color: white;
  font-size: 12px;
  font-weight: bold;
  height: 26px;
  padding: 5px;
 width: 165px;
}
.side_rating_rating {
 background: url(/reviews/images/rating_background.gif)
 width: 165px;
 height: 26px;
 padding-left: 10px;
}
.side_rating_outside {
  border: 1px solid #4b6282;
}
.small_rating_left {
  float: left;
  width: 135px;
}
.small_rating_right {
  float: right;
  width: 30px;
  text-align: right;
}

.linkdescription_blog {
  margin: 0px 0px 5px 0px;
  padding: 0px;
  border: none;
  background: #00000;
  overflow: hidden;
}

.alphabar {
  font-size: 12px;
  align: center;
 text-align: center;

  
}
#content {
  margin: 0px 8px;
  padding: 0px;
  background: #ffffff;
}

.login {
	font-family: Arial;
	font-size:10px;
	color: #333;
	align: right;
	text-align: right;
	padding: 0px;
	font-weight: bolder;
}

.alphapage {
  font-size: 12px;
  border: 1px solid #dee7eb;
  padding: 2px;
  width: 30px;
  text-align: center;
  color: #0000cc;
  background: #f4f4f4;
}
.alphapagecurrent {
  font-size: 12px;
  border: 1px solid #dee7eb;
  padding: 2px;
  width: 30px;
  text-align: center;
  color: black;
}


.alphapagepn {
  font-size: 12px;
  padding: 2px;
  width: 70px;
  text-align: center;
}

.alphapagefont {
  color: #0000cc;
}

/* paging */
.paging {
  text-align: center;
 font-size: 12px;
  
}
.paging img, .paging select, .paging input {
  vertical-align: middle;
}




.paging span {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #ffffff;
  padding: 2px;
color: #000000;
}


.paging a {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #f4f4f4;
  padding: 2px;
color: #0000cc;
}
.paging a:visited {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #f4f4f4;
  padding: 2px;
color: #0000cc;
}


.sidebar_item {
text-transform: lowercase;
}

.sidebar_divider {
}

@import url(luna_core.css);

/*
This file inherits from luna_core.css, so styles in this file will override styles defined in it.  Changes to this file will NOT be overwritten during upgrades.

Here's a quick tutorial on overriding styles.  Say you want to change the background colour of the body.  Looking at luna_core.css, the colour is defined in the rule:

    body {
      margin: 0px;
      padding: 0px;
      color: #33332e;
      background: #ffffff;
      font: normal 11px arial, tahoma, geneva, verdana, sans-serif;
      text-align: center;
    }

To change the background colour of white (#ffffff) to gray (#dddddd), you would add the following to this file:

    body {
      background: #dddddd;
    }

If you also wanted to change the font as well as the background, then you could
use:

    body {
      background: #dddddd;
      font: normal 12px times new roman;
    }

Also note that every template's body id is assigned the template name (without the .html extension).  So if you want to change the h2 heading in the category.html template, you can do this by:

    #category h2 { 
      color: red; 
      font-weight: bold; 
    }

To start you off, some sample overriding styles have been provided below.
Note
that you will have to uncomment the rules for them to work.
*/

/* Logo size and image source */
/*
#logo {
  width: 250px;
  height: 80px;
  background-image: url(images/logo.gif); } */
/* If the height of your logo changes from the original, then you will probably want to also change the vertical position of the login link */
/*
#loginbar a {
  margin-top: 25px;
}
*/

/* Show the left sidebar */

#ocwrapper {
  background: #ffffff;
  border-left-width: 180px;
  border-left-color: #ffffff;
}
#leftsidebar {
  width: 170px;
  display: block;
  margin-left: -180px;
  padding: 10px 0px 0px 0px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
}
#contentheader .error, #contentheader .message {
  margin: 0px 180px 0px 180px;
}


/* Hide the right sidebar */

#ocwrapper {
  border-right-width: 0px;
}
#rightsidebar {
  display: none;
  
}
#contentheader .error, #contentheader .message {
  margin: 0px;
}


/* Change the right sidebar width.  Note that the sidebars have a 10px left or right padding (left sidebar has a left padding and right sidebar has a right padding), hence the 150px - 10px = 140px width */
/*
#ocwrapper {
  border-right-width: 150px;
}
#rightsidebar {
  margin-right: -150px;
  width: 140px;
}
#contentheader .error, #contentheader .message {
  margin: 0px 150px 0px 0px;
}
*/

/* Change width of document */

#wrapper {
  width: 800px;
}


/* Don't want the shadows? */

.shadowtop, .shadowbottom, .shadowleft, .shadowright {
  background: none;
}
.shadowtopleft, .shadowtopright, .shadowbottomleft, .shadowbottomright {
  width: auto;
  height: auto;
  float: none;
  background: none;
}


/* If you change the globals category_cols or home_category_cols, then you will need to change the width of the columns themselves.  Note that IE sometimes has problems if this value adds up to 100%, so keep the width a little under 100%.
For example, if you changed category_cols to 3, then this example would set the width of the columns to 33% (99% total).  If you want to change the columns on the home page as well, then remember to set a rule for "#home dl" as well. */

#category dl {
  width: 25%;
}
#home dl {
  width: 25%;
}


/*-----------*\
|* searchbar *|
\*-----------*/
.searchbar {
  margin-bottom: 3px;
  padding: 5px 5px;
  border-bottom: 4px solid #CD5717;
  background: #353534;
  text-align: right;
 color: #ffffff;
}
.searchbar input.text, .searchbar input.submit {
  margin-right: 5px;
}
/* setting this in mozilla causes rendering issues */
* html .searchbar input.submit {
  height: 21px;
}
/* these colours are the same as defined by 'a', but we unset a:visited */ .searchbar a {
  color: #ffffff;
  font-size: 10px;
}
.searchbar a:hover {
  color: #5c5b66;
}

/*--------*\
|* footer *|
\*--------*/
#footer {
  margin-top: 3px;
  padding: 5px;
  border-top: none;
  background: #ffffff;
  text-align: center;
font-size: 11px;
  font-family:Arial, Helvetica, sans-serif; } #footer img {
  float: none;
}

#footer p {
  margin: 0px;
  padding: 10px 0px;
  color: #000000;
  font-size: 9px;
}

.comm_sub_header {
  padding: 3px;
 color: #cd5717;
}

.comm_form {
  padding: 3px;
  font-size: 12px;
  font-weight: bold;
  line-height: 16px;
}
.comm_divide {
  background: url('/reviews/images/sidebar_divider.gif') repeat-x;
 width: 100%;
 height: 10px;
}

.body { font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 12pt;
color: #000000 }

#home dt a {
  font-weight: normal;
  line-height: 20px;
  font-size: 11px;
  text-decoration: none;
}

a {
  color: #000000;
text-decoration: none;
}
a:visited {
  color: #000000;
text-decoration: none;
}
a:hover {
  color: #5c5b66;
  text-decoration: none;
}


.hl {
  background: #e5e5e5;
  padding: 3px;
  width: 100%;
}

.scoring_header {
  font-size: 12px;
  padding-bottom: 3px;
  color: #4b6282;

}
.scoring_description {
 font-size: 12px;
 padding-bottom: 3px;
}

.side_rating_header {
  background: url(/reviews/images/rating_gradient_header.gif) repeat-x;
  color: white;
  font-size: 12px;
  font-weight: bold;
  height: 26px;
  padding: 5px;
 width: 165px;
}
.side_rating_rating {
 background: url(/reviews/images/rating_background.gif)
 width: 165px;
 height: 26px;
 padding-left: 10px;
}
.side_rating_outside {
  border: 1px solid #4b6282;
}
.small_rating_left {
  float: left;
  width: 135px;
}
.small_rating_right {
  float: right;
  width: 30px;
  text-align: right;
}

.linkdescription_blog {
  margin: 0px 0px 5px 0px;
  padding: 0px;
  border: none;
  background: #00000;
  overflow: hidden;
}

.linktitlecustom {
 font-size: 14px;
 background: #e5e5e5;
 border-top: 1px solid #d6d6d6;
 border-bottom: 1px solid #d6d6d6;
 color: #000000;
 font-weight: bold;
 padding: 3px;
 margin-bottom: 10px;
}
#content {
  margin: 0px 8px;
  padding: 0px;
  background: #ffffff;
}

.login {
	font-family: Arial;
	font-size:10px;
	color: #333;
	align: right;
	text-align: right;
	padding: 0px;
	font-weight: bolder;
}

.alphapage {
  font-size: 12px;
  border: 1px solid #dee7eb;
  padding: 2px;
  width: 30px;
  text-align: center;
  color: #0000cc;
  background: #f4f4f4;
}
.alphapagecurrent {
  font-size: 12px;
  border: 1px solid #dee7eb;
  padding: 2px;
  width: 30px;
  text-align: center;
  color: black;
}


.alphapagepn {
  font-size: 12px;
  padding: 2px;
  width: 70px;
  text-align: center;
}

.alphapagefont {
  color: #0000cc;
}

/* paging */
.paging {
  text-align: center;
 font-size: 12px;
  
}
.paging img, .paging select, .paging input {
  vertical-align: middle;
}




.paging span {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #ffffff;
  padding: 2px;
color: #000000;
}


.paging a {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #f4f4f4;
  padding: 2px;
color: #0000cc;
}
.paging a:visited {
  width: 70px;
  font-size: 12px;
  border: 1px solid #dee7eb;
  background: #f4f4f4;
  padding: 2px;
color: #0000cc;
}


.sidebar_item {
text-transform: lowercase;
}

.sidebar_divider {
}

.linklisting {
  margin: 15px 0px 20px 0px;
}
.linklisting a, .linklisting a:visited, .linklisting a:hover {
  color: #003399;
  text-decoration: none;
  font-weight: bold;
}
.linklisting .featured {
  padding-top: 2px;
}
.linklisting .highlighted {
  background: #D8EbC9;
  width: 583px
}

.linklisting .highlighted_narrow {
  background: #D8EbC9;
  width: 410px
}

.linklisting .webreviewhighlighted {
  background: #D8EbC9;
  width: 400px
}

.linklisting .linkwhite {
  border: 1px solid #FFFFFF;
  margin-top: 5px;
  margin-left: 5px;
  text-align: left;
  padding-bottom: 3px;
}
td.top_site_greybar {
  background: #959393;
}
.top_site_review a, .top_site_review a:visited, .top_site_review a:hover {
  color: #730F1E;
  font-weight: bold;
}

.top_site_review {
  background: white;
  color: red;
  border: 1px solid #939393;
  width: 80px;
  padding: 3px;
}
.top_site_review_rating {
text-align: right;
background: #ffffff;
height: 15px;
color: black;
}
.top_site_listing {
  border-bottom: 1px solid #4c4c4c;
  padding: 2px 2px 2px 2px;
  background: #4c4c4c;
  height: 15px;
}
.top_site_listing a {
  color: #ffffff;
  font-weight: bold;
}