@import url(luna_core.css);





/* 



The original left side bar before I started fucking around



#ocwrapper {



  border-left-width: 160px;}





#leftsidebar {

  display: block;



}



 */



#ocwrapper {



  border-left-width: 180px;



}





#leftsidebar {  

  margin-left: -180px;

  padding: 10px 0px 10px 10px;

  width: 170px;

  float: left;

  position: relative;

 display: block;





}



.image{

border-style:outset;

	border-color: black;

	border-width:2px;

      }



.leftsidetitle a {

	font-family: "Trebuchet MS";

	font-size: 12px;

	font-weight: bold;

	text-decoration: none;

	color: #000000;

}



.leftsidetitle:hover {

	font-family: "Trebuchet MS";

	font-size: 12px;

	color: #ffffff;

	background-position: center;

	font-weight: bold;

	text-decoration: none;

	

}



#contentheader .error, #contentheader .message {



  margin: 0px 160px 0px 160px;







}



#wrapper {

  margin: 0px auto;

  width: 800px;

  text-align: left;



}

#header {
  background: transparent top right no-repeat;
}

#ocwrapper {



  border-right-width: 180px;



}





#rightsidebar {



  margin-right: -180px;



  width: 170px;}

#contentheader .error, #contentheader .message {



  margin: 0px 170px 0px 0px;



}



#logo {



  width: 500px;



  height: 150px;

  background-image: url(images/logo.gif);



  margin-top: 25px



}



ul.primarynav li.home {

  border-right: 1px solid #ffffff;

  background: #c45017;

}

ul.primarynav {

  width: 100%;

  background: #c45017;

}

ul.secondarynav {

  width: 100%;

  background: #c45017;

}



.searchbar {

  margin-bottom: 3px;

  padding: 5px 10px;

  border-bottom: 1px solid #57594b;

  background: #808080;

}



#footer {

  margin-top: 3px;

  padding: 5px;

  border-top: 1px solid #57594b;

  background: #808080;

}

body {

  margin: 0px;

  padding: 0px;

 background: #222222;

  background-attachment: scroll;

  color: #33332e;

   font: normal 13px tahoma, geneva, verdana, sans-serif;

  text-align: center;

}

	

.blackfont {

	

   font: normal 12px tahoma, geneva, verdana, sans-serif;

	color: #000000;



}





.fontoverride {

	

   font: normal 12px tahoma, geneva, verdana, sans-serif;

	color: #ffffff;



}









/*



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 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: 500px;



  height: 150px;



  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 {



  border-left-width: 200px;



}



#leftsidebar {



  display: block;



}



#contentheader .error, #contentheader .message {



  margin: 0px 200px 0px 200px;



}



*/







/* 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 */



/*





*/







/* Change width of document */



/*



#wrapper {



  width: 95%;



}



*/







/* 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). */



/*



#category dl {



  width: 33%;



}



*/