@import url(ads_core.css);

/*
This file inherits from ads_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 ads_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.
*/



/* Show the left sidebar - commented see below */
/*
#ocwrapper {
  border-left-width: 180px;
}
#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 */
/*
#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: 980px;
/*  padding-left: 10px; */
}


/* Don't want the shadows? */
.shadowtop, .shadowbottom, .shadowleft, .shadowright {
  background: #0066CC; 
}
.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: 33%;
}
*/

/*============= My New Stuff ================ */

 body {
      background: #ffffff;
      font: normal 12px arial, verdana, tahoma, geneva, sans-serif;
      background-image: url(/images/background.gif);
padding-left: 4px; 
 }

/* forms */
.row label.name {
  font-weight: bold;
  text-align: right;
}

h2 { 
   color: red; 
   font-weight: bold; 
}

/* ------------------------------------- */
/*---------------*\
|* contentheader *|
\*---------------*/
#contentheader {
  padding: 0px 0px 0px 0px;
  background: #e2e1eb;
}
#contentheader .error, #contentheader .message {
  margin: 0px 0px 0px 0px;
  padding: 2px;
  border: 1px solid #ffffff;
  color: #ffffff;
  font-size: 16px;
  text-align: center;
  font-weight: bold;

}
#contentheader .error {
  background: #0066CC;
}
#contentheader .message {
  background: #339966;
}
#contentheader .error *, #contentheader .message * {
  margin: 0px;
  padding: 0px;
}


/*--------*\
|* footer *|
\*--------*/
#footer {
  margin-top: 3px;
  padding: 5px;
  border-top: 1px solid #57594b;
  background: #FFFFCC;
}
#footer img {
  float: right;
}
#footer p {
  margin: 0px;
  padding: 10px 0px;
  color: #8a8d77;
  font-size: 9px;
}

/* ---------- footer me ------------------------------------------*/

#bottomsmall p {
  margin: 0px;
  padding: 4px 0px;
  color: black;
  font-size: 11px;
}

#bottomsmaller p {
  margin: 0px;
  padding: 6px 0px;
  color: #8a8d77;
  font-size: 10px;
}

/*-----------*\
|* searchbar *|
\*-----------*/
.searchbar {
  background: #9999cc;
}
/* these colours are the same as defined by 'a', but we unset a:visited */
.searchbar a {
  color: white;
}
.searchbar a:visited {
  color: white;
}
.searchbar a:hover {
  color: yellow;
}


/*------------*\
|* navigation *|
\*------------*/
ul.primarynav {
  background: #333399;
  background: transparent url(/images/bg_h_darkblue.gif) center right repeat;
}
ul.secondarynav {
  background: #3333cc;
}

/* links */
a {
  color: #0000CC;
}
a:visited {
  color: #0000CC;
}
a:hover {
  color: #3333FF;
  text-decoration: none;
}


/* show left side bar */
#ocwrapper {
  border-left-width: 170px;
}
#leftsidebar {
  margin-left: -170px;
  padding: 10px 0px 10px 0px;
  width: 170px;
  float: left;
  position: relative;
  display: block;
}

.leftsidebox {
  margin-top: 10px;
  padding: 4px;
  width: 150px;
  position: relative;
  float: left;
  display: block;
  border: 1px solid blue;
  background: #FFFccc;
  font-size:11px;
}


/* Shift main content */
#contentwrapper
{
  margin: 10px 0px 10px 0px;
}


.linklisting .linkdescription, .review .reviewcontent {
  margin: 0px 0px 5px 0px;
  padding-top: 8px;
  padding-bottom: 8px;
  border: 1px solid #ffffff;
  background: none;
}

.linktitle {
  padding: 6px;
  border: 1px solid #000080;
  background: #ccccff;
}

/* sub headings */
#content h3 {
  margin: 2px 0px 0px 0px;
}

/* links */
.linklisting {
  margin: 10px 0px 0px 0px;
}

.linklisting .linkdescription {
  padding-left: 0px;
}

/* overflow: hidden doesn't work in ie unless the width is set */
* html .linklisting .linkdescription, * html .review .reviewcontent {
  width: 98%;
}

/* margine to flags on the title of links */
.flag_image {
  margin-right:6px;
}



/* tables */
.ftable {
  border-bottom: 3px solid #9999cc;
  font-size: 14px;
}
.ftable th {
  background: #9999cc;
}
.ftable th, .ftable td {
  padding: 3px 5px;
}
.ftablecol {
  border-right: 1px solid #9999cc;
}


/* the previous style causes problems with long sidebars in ie6 */
.row .value input.text, .row .value input.password, .row .value textarea {
  w\idth: 50%;
}

h6 { 
  color: red; 
  font-weight: bold; 
  font-size: 22px;
margin: 10px 10px 10px 10px;
  }

.biggrey { 
  color: #999999; 
  font-weight: bold; 
  font-size: 16px;
  margin-bottom: 4px;
  }

.bigblack { 
  color: #666666; 
  font-weight: bold; 
  font-size: 18px;
  }


/* message block on home */
.message {
  margin: 0px 0px 0px 0px;
  padding: 8px;
  border: 1px solid blue;
  background: #FFFccc;
  overflow: hidden;
  font-size:14px;
  height: auto;
}

/* message block with margins except bottom */
.message2 {
  margin: 0px 10px 0px 0px;
  padding: 4px;
  border: 1px solid blue;
  background: #ccccff;
  overflow: hidden;
  font-size:13px;
  height: auto;
}

/* message block with no padding for skyscaper*/
.message3 {
  margin: 0px 0px 0px 0px;
  padding: 0px;
  width: 160px;
  border: 1px solid blue;
  background: #FFFFcc;
  overflow: hidden;
  font-size:10px;
  height: 600;
}


/* message block header no border from bottom */
.message4 {
  margin: 0px 10px 0px 0px;
  padding: 2px;
  border-left: 1px solid blue;
  border-top: 1px solid blue;
  border-right: 1px solid blue;
  background: #0066CC;
  overflow: hidden;
  font-size:14px;
  font-weight: bold; 
  color: #FFFF99; 
  height: auto;
  text-align: center;
}

/* message block on the right of landing page */
.messageland {
  margin: 0px 0px 0px 10px;
  padding: 8px;
  border: 1px solid blue;
  background: #ccccff;
  overflow: hidden;
  font-size:13px;
  height: auto;
}
/* message block header for the landpage no border from bottom */
.messagelandheader {
  margin: 0px 0px 0px 10px;
  padding: 2px;
  border-left: 1px solid blue;
  border-top: 1px solid blue;
  border-right: 1px solid blue;
  background: #0066CC;
  overflow: hidden;
  font-size:14px;
  font-weight: bold; 
  color: #FFFF99; 
  height: auto;
  text-align: center;
}

/* links */
/*
#category a {
  text-decoration: none;
}
#category a:visited {
  text-decoration: none;
}
#category a:hover {
  text-decoration: none;
}
*/


/*---------*\
|* content *|
\*---------*/
#content {
  background-image: url(/images/bg_yellow.gif);
}


/* change form fields background */
.row.required {
  background: none;
}

/* space block 8px */
.spacer10x10 {
  margin: 10px;
  font-size:10px;
}
/* sub headings */
#content h3 {
  margin: 2px 10px 0px 0px;
  padding: 5px 0px 0px 0px;
  border-bottom: 1px dotted #bbbfa1;
}


/* Category names in the colum */
.categorycolumn {
  line-height: 1.5em;
}
.categorycolumn a {
  color: #0066CC;
  text-decoration: none;
}
.categorycolumn a:visited {
  color: #0066CC;
  text-decoration: none;
}
.categorycolumn a:hover {
  color: red;
  text-decoration: none;
}


/* put space at the bottom of the contents */
/*
#ocwrapper {
  padding-bottom: 10px;
}
*/


/* paging */
.paging {
  text-align: center;
  font-weight: bold; 
  font-size: 14px;
}
.paging img, .paging select, .paging input {
  vertical-align: middle;
}



.formsubmit {
  margin: 10px;
  text-align: center;
}

/*--- begin temp changes --------*\
|*       searchbar               *|
\*-------------------------------*/
.searchbar {
  margin-bottom: 2px;
  margin-top: 6px;
  padding-left: 10px;
  padding-top: 1px;
  padding-bottom: 2px;
/*  border: 1px solid #57594b; */
/* border-bottom: 1px solid #9999cc;  */

  background: transparent url(/images/bg_h_yellow.gif) center right repeat; 
}
/*---end - temp changes --------*\


.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: darkblue;
}
.searchbar a:visited {
  color: darkblue;
}
.searchbar a:hover {
  color: blue;
}


/*-------------------------------*\
|*  Making primary menubar bold  *|
\*-------------------------------*/
ul.primarynav a {
  font-weight: bold; 
}
ul.primarynav a:visited {
  font-weight: bold; 
}
ul.primarynav a:hover {
  font-weight: bold; 
}


/*========*\
|* header *|
\*========*/
#header {
  height: 110px; 
  background: none; 
}
#side1 { 
/* 
it should be 222px but because there is border for 
the banner increased so made it 730 instead of 728 
*/
margin-top: 10px;
margin-bottom: 8px;
width: 250px; 
float: left; 
} 
#side2 { 
margin-top: 10px;
margin-bottom: 8px;
width: 730px; 
float: left; 
} 

/*-----------------*\
|*  Logo in Header *|
\*-----------------*/
/* Logo size and image source */
#logo {
/* 
it should be 222px but because there is border for 
the banner increased so made it 730 instead of 728 
*/
  width: 250px;
  height: 92px;
  background: transparent url(images/logo.gif) top left no-repeat; 
}

/* 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;
}
*/

/*-----------------------*\
|*  banner ad in header  *|
\*-----------------------*/
#banner {
  margin-left: 0px;
  width: 728px;
  height: 90px;
  border: 1px solid blue;

}

/* for local banner/image use the rest
#banner a {
  text-decoration: none;
  display: block;
  width: 100%;
  height: 100%;
  background: transparent url(/banners/banner01.gif) top left no-repeat;
  text-indent: -9999px; 
}
*/

/*-------------------------------*\
|*  banner ad within the content *|
\*-------------------------------*/
#contentad { 
margin-top: 0px;
margin-bottom: 12px;
float: center;
width: 100%; 
height: 90px;
} 

#bannerad {

  height: 90px;
  text-align: center;
  border: 1px solid blue; 
  border-left: 5px solid #0066CC;
  border-right: 5px solid #0066CC;
}

/* for local banner/image use the rest
#bannerad a {
  text-decoration: none;
  display: block;
  width: 100%;
  height: 100%;
  background: transparent url(/banners/banner01.gif) top left no-repeat; 
  text-indent: -9999px;
}

*/


/* make 3 column in home and change global home_category_cols to 3 */
#home dl {
  width: 33%;
}
/* remove margins of subcategories on home to fit 3 columns */
#home dt, #home dd {
  margin: 0px 0px 0px 0px;
}


/* link info */
.small_green {
 font-size: 10px; 
 color: green; 
 }
.small_black {
  font-weight: normal;
  font-size: 10px;
  color: black; 
}

