/* ------------------------------------------------------------

Orchid democratic.css, Version 2.1
CSS by ppk; May 2004
http://www.quirksmode.org

customstyles.css contains the color and border definitions, these are different
for each site

navstyles.css contains a few extra styles that should only work when the browser
supports enough JavaScript for the foldout menus

------------------------------------------------------------ */


/* ------------------------------------------------------------

OVERALL

These styles define the overall overhead of the site. Set body
padding and margin to 0, define the overall font size and family,
center div#sitecontainer.

Note that this is the ONLY place where a font size is NOT set in
percentages. ALL other font sizes should be set in percentages,
which are interpreted as percentages of the font size defined here
for the body.
This makes font size switching quite easy.

------------------------------------------------------------ */


html,body {
    margin: 0;
    padding: 0;
}

body {
    font: 0.75em helvetica,arial,sans-serif;
    text-align: center;
    padding: 0 0 20px;
}

div#sitecontainer {
    margin-left: auto;
    margin-right: auto;
    width: 800px;
    text-align: left;
    border: 1px solid #333333;
    border-bottom: none;
}

.smaller {
    font-size: 80%;
}

.bolder {
    font-weight: 600;
}

.dateline {
    float: right;
    font-size: 90%;
}

div.clearer {
    clear: both;
    font-size: 1px;
    line-height: 1px;
}


/* ------------------------------------------------------------

MASTHEAD

No margin/padding, img is block to prevent line height
and ugly whitespace.

------------------------------------------------------------ */


#logo {
    margin: 0;
    padding: 0;
}

#logo img {
    display: block;
}

/* ------------------------------------------------------------

MAIN NAVIGATION - GENERAL RULES

Two separate navigations: top (#nav1) and left (#nav2). Both consist
of uls with subnavigation as divs in the relevant li.

First some general rules: uls and lis have no margin/padding, and
the lis dont have a bullet.

Links have no underline, but on hover they do.

Links in div (ie. foldouts) are always blocks and have a background image. 
The !important serves to override the background image in the left navigation.

------------------------------------------------------------ */


.nav ul {
    margin: 0;
    padding: 0;
}

.nav li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.nav a {
    text-decoration: none;
}

.nav li div a {
    display: block;
    width: 122px;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 10px;
}

/* ------------------------------------------------------------

TOP NAVIGATION - SPECIFIC RULES

Top navigation is assigned a 800x22 area. 

The lis float for horizontal alignment.

The top-level links are 125px, and they have display: block to actually make 
them blocks (ie. receptive to width).

Links in foldouts in top are aligned left and have a width of 106

------------------------------------------------------------ */

#nav1 {
    width: 800px;
    height: 17px;
}

#nav1 li {
    float: left;
    margin: 0;
    padding: 0;
    font-size: 90%;
}

#nav1 a {
    width: 129px;
    height: 13px;
    display: block;
    text-align: center;
}

#nav1 div a {
    text-align: left;
    width: 100px;
    height: auto;
}

/* ------------------------------------------------------------

LEFT NAVIGATION

Entire left navigation floats left and is 180px wide.

lis have a padding-left to keep the space above the background image free.

Links have more padding-left and a background image. These style declarations
go for the main links AND the foldout links!

------------------------------------------------------------ */

#nav2 {
    float: left;
    width: 180px;
    padding-top: 10px;
}

#nav2 li {
    padding: 0;
    margin: 0;
    padding-left: 8px;
    padding-bottom: 4px;
    line-height: 130%;
}

#nav2 a {
    margin-left: 6px;
    padding-left: 16px;
    background-image: url(https://careers.meatinstitute.org/website/318349/images/navbullet.gif);
    background-repeat: no-repeat;
    background-position: 0 5px;
    margin: 0;
}

/* ------------------------------------------------------------

LEFT NAVIGATION - SPECIAL

ul class=attention has several special styles to give it another look than the
common run of uls.

------------------------------------------------------------ */


#nav2 ul.attention {
    margin: 6px;
}

#nav2 ul.attention li {
    padding: 0;
    margin: 0;
    padding-left: 6px;
    padding-bottom: 4px;
}

#nav2 ul.attention li a {
    background-image: none;
    display: block;
    padding-left: 10px;
}

#nav2 ul.textsize {
    margin-top: 30px;
}

/* ------------------------------------------------------------

MAIN BODY

Main body also floats left. It usually has a 610px width, but any page with an extra
right column gets a body class="threecolumn", and here the main body only has 460px.

------------------------------------------------------------ */


#main {
    float: right;
    width: 565px;
    padding: 10px 20px 0 20px;
}

/* IE Mac hack \*/

#main {
    width: 575px;
}

/* End IE Mac hack */

#main a {
    text-decoration: none;
}

body.threecolumn #main {
    float: left;
    width: 450px;
    padding-right: 0;
}

body.admin #main {
    float: left;
}

/* ------------------------------------------------------------

RIGHT COLUMN

The right column is also floated left.

Special styles for links (usually image/links) and forms in the right column.

------------------------------------------------------------ */


#extra {
    float: right;
    width: 140px;
    text-align: center;
    padding-top: 10px;
}

#extra a {
    display: block;
    margin-top: 10px;
}

#extra a img {
    float: none;
}

#extra a.joinnow {
    font-size: 150%;
    margin: 4px 0;
}

#extra form h4 {
    font-size: 90%;
    margin: 0;
    font-weight: 600;
}

#extra input {
    width: 80px;
}

#extra input.submit {

}

#extra form p {
    margin: 0;
    margin-bottom: 10px;
    font-size: 80%;
}

/* ------------------------------------------------------------

FOOTER

Footer clears all floats. It usually contains three sets of data: address (of the
Party), Notice (site without financial support of candidate etc.) and Powered (Orchid
image).

------------------------------------------------------------ */

#footer {
    clear: both;
    padding-left: 2px;
    padding-top: 10px;
    text-align: center;
}

.address {
    font-size: 80%;
    width: 400px;
    margin: 0 auto;
}

.notice {
    padding: 5px;
    margin-top: 10px;
    border: 1px solid #000000;
}

#footer .powered {
    margin-top: 10px;
}

/* ------------------------------------------------------------

HEADERS (H1 - H4)

Header styles

------------------------------------------------------------ */

h1 {
    font-size: 130%;
    background-color: #1E2472;
    padding: 2px;
    color: #ffffff;
    border: 1px solid #000000;
}

h2 {
    font-size: 120%;
    background-color: #1E2472;
    padding: 2px;
    color: #ffffff;
    border: 1px solid #000000;
}

h3 {
    font-size: 120%;
    color: #003399;
    background-image: url(https://careers.meatinstitute.org/website/318349/images/navbullet.gif);
    background-repeat: no-repeat;
    background-position: 2px 5px;
    padding-left: 15px;
}

h4 {
    font-size: 100%;
    margin: 0;
}

#main a {
    color: #1E2472;
}

#main a:visited {
    color: #551A8B;
}

/* ------------------------------------------------------------

PARAGRAPHS

Paragraph styles

------------------------------------------------------------ */

#main {
    line-height: 130%;
}

/* ------------------------------------------------------------

ITEM LISTS

Item list styles

------------------------------------------------------------ */

ul.itemlist {
    clear: both;
}

ul.itemlist,ul.itemlist li {
    margin: 0;
    padding: 0;
}

ul.itemlist li {
    display: block;
    margin: 20px 0;
    list-style-type: none;
    clear: both;
}

span.itemname, span.itemname-moc, span.itemname-pushdown, span.itemname-moc-pushdown {
    font-weight: 600;
    display: block;
    font-size: 110%;
}

span.itemname a {
    display: inline;
}

span.itemname-moc a, span.itemname-pushdown a, span.itemname-moc-pushdown a {
    display: inline;
    background-color : #ffff99;
}

.moc
{
    background-color : #ffff99 ! important;
}

ul.itemlist.links li {
    margin: 10px 0;
}

/* ------------------------------------------------------------

IMAGES

Image styles. Inline images float left. Images in links NEVER have a border.

------------------------------------------------------------ */

img.inline,img.outline {
    float: left;
    margin-right: 10px;
}

img.inline.home {
    float: right;
    margin-right: 0;
    margin-left: 10px;
}

a img {
    border: 0; /* special case: should ALWAYS be set to 0 */
}

/* ------------------------------------------------------------

FORMS

Styles of input boxes, except those in the right column, which are defined above.
td.question is for the TDs that contain form questions (like Your name).
div.errorMessage is for the error messages.

------------------------------------------------------------ */

input,textarea,select {
    font-family: helvetica,arial,sans-serif;
    font-size : 100%;
}

input.smallinput {
    width: 100px;
}

input.mediuminput {
    width: 200px;
}

input.largeinput {
    width: 300px;
}

td.question {
  color                 : #6b7f7f;
  background-color      : #ffffff;
  text-align        : right;
}

div.errorMessage {
  color         : #cc0000;
  font-weight       : 600;
}

.required {
    color: #990000;
    font-size: 150%;
    vertical-align: bottom;
}

/* ------------------------------------------------------------

ADMIN-STYLE forms on public or member pages.

We don't want to show the whole admin interface, but
the forms need to look decent.

------------------------------------------------------------ */
div#main .s .h {
    font: normal 16px arial, verdana, sans-serif;
    line-height: 130%;
    margin: 0;
    padding: 3px;
}



label.oneline
{ 
  float : none;
  vertical-align : bottom;
  display : inline;
  padding: 2px 15px 10px 5px;
  margin: 0px 0px 0px 0px;
}

input, select, button, textarea
 { 
  font: normal 11px verdana, arial, helvetica, sans-serif;
/*  vertical-align : bottom; */
 }

div.st {
    margin: 6px;
    clear: both; 
}

div.st input {
    width: 7em;
}


div.mt {
    margin: 5px;
    clear: both; 
}

div.mt input {
    width: 20em;
}

div.lt {
    margin: 5px;
    clear: both; 
}

div.lt input { 
    width: 30em;
}
div.lt textarea {
    margin: 8px;
    width: 40em;
}

div.dd {
    margin: 5px;
}

div.dd input {
    clear:right;
}

div.cb {
    margin: 5px;
    padding-left: 11em;
}

div.cb label {
    display: inline;    
    text-align:left;
    float:none;
    width:30em;
}

div.ta label {
    display: block;
/*    vertical-align:top; */
    text-align:left;
    float:none;
/*    width:30em;  */
/*    margin-left : 6em;*/
}

div.ta textarea {
    display: block;
}

div.dd input {
}


/* ------------------------------------------------------------

HEADER FORMS

Styles for header forms, those are the small "Search" forms at the top of,
for instance, Candidates

------------------------------------------------------------ */

div.headerform {
    clear: right;
    float: right;
    width: 200px;
}

/* Also hide from IE Mac \*/

div#main > div.headerform { /* not for IE */
    margin-top: 15px;
}

/* End hide */

div.headerform.nofloat {
    float: none;
    width: auto;
    text-align: center;
    margin-top: 0;
}

div.headerform p {
    margin: 5px 0;
}

div.headerform input.main {
    width: 130px;
}

div.headerform input.submit {
    width: 60px;
}

.catitem {
    margin-right: 210px;
    margin-top: 15px;
}

div.headerform form.special {
    float: left;
    width: 45%;
}

/* ------------------------------------------------------------

POPUPS

Special div for in popups

------------------------------------------------------------ */

body.popup {
    background-color: #eeeeee;
}

body.popup div.popupborder {
    margin: 15px;
    background-color: #ffffff;
    padding: 5px 60px;
    border: 1px solid #000000;
    text-align: left;
}

div.popupborder form {
    text-align: center;
}

div.popupborder img {
    text-align: center;
}

div.popupborder p.date {
    color: #9F9F9F;
    text-align: center;
    font-size: 80%;
    margin: 0;
}

div.popupborder h1 {
    text-align: center;
    font-size: 190%;
    margin-top: 5px;
    font-weight: 600;
    font-family: verdana, sans-serif;
    color: #000000;
    background-color: transparent;
    border: none;
}

/* ------------------------------------------------------------

PHOTO GALLERY

Photo gallery styles.
Dateline floated right (next to header)

------------------------------------------------------------ */

table.gallery{
    margin: 0 -10px;
}

table.gallery div.dateline {
    float: right;
    font-weight: 600;
    font-size: 90%;
}

table.gallery h2 {
    margin-top: 10px;
    background-color: transparent;
    color: #000000;
    border-color: #9BB2B0;
    padding: 5px;
}

table.gallery td {
    vertical-align: top;
}

table.gallery td.photo {
    border: 1px solid #AEAEAE;
    padding: 5px;
    padding-top:10px;
    text-align: center;
}

/* ------------------------------------------------------------

BOOKMARKING LINKS

------------------------------------------------------------ */

#bookmarkinglinks a{
font-size:0.75em;
margin-right:0.5em;
}

#bookmarkinglinks img{
vertical-align:bottom;
margin-bottom:0px;
height:16px;
width:16px;
}

/* ------------------------------------------------------------

LETTERS

Styles for the letters (a-z) in some listings

------------------------------------------------------------ */

div.letters a {
    text-decoration: none;
}

div.letters b {
    font-weight: 700;

    background-color: #ffdede;
}

/* ------------------------------------------------------------

HOMEPAGE

Special styles for the homepage

------------------------------------------------------------ */

div.releases p {
    margin-left: 0;
    margin-top: 0;
    margin-right: 0;
}

body.admin table {
    width: auto !important;
}
.notice 
{
  border                : 1px solid #000000;
}
.letters a{
   font-weight: bold;
}

.pushdown {
   font-weight: bold;
    color: #666666;
}
.membersonly {
   font-weight: bold;
    color: #990000;
}

.outline
{ 
 border-width     : 1px;
 border-style     : solid;
 border-color     : #9bb2b0;
}
.outline-dark
{ 
 border-width     : 1px;
 border-style     : solid;
 border-color     : #6b7b7a;
}
.outline-subtle
{ 
 border-width     : 1px;
 border-style     : solid;
 border-color     : #ccffee;
}

/* ----------------------------------------------------------- */
/* CSS tab technique, from  http://www.alistapart.com/articles/slidingdoors/ */
#tabheader {
  float:left;
  width:100%;
  line-height:normal;
  }
#tabheader ul {
  margin:0;
  padding:10px 10px 0 0;
  list-style:none;
  }
#tabheader li {
  float:left;
  background:url("../../../orchid/images/tab_left.gif") no-repeat left top;
  margin:0;
  padding:0 0 0 9px;
  }
#tabheader a {
  float:left;
  display:block;
  background:url("../../../orchid/images/tab_right.gif") no-repeat right top;
  padding:5px 10px 2px 1px;
  text-decoration:none;
  font-weight:bold;
  font-size: 8pt;
  color:#765;
  }
/* Commented Backslash Hack
   hides rule from IE5-Mac \*/
#tabheader a {float:none;}
/* End IE5-Mac hack */
#tabheader a:hover {
  color:#333;
  }
#tabheader #current {
  background-image:url("../../../orchid/images/tab_left_on.gif");
  }
#tabheader #current a {
  background-image:url("../../../orchid/images/tab_right_on.gif");
  color:#333;
  }
.pagetop 
{
background-color:#ffdddd;
color:#000000;
text-align:center;
border:solid 1px #000000
}

.rss 
{
background-image: none
}

.overlib 
{
position:absolute;
visibility:hidden;
z-index:1000;
}

.showimageborder
{
border:1px solid #000000;
padding:10px 10px;
text-align:center ! important;
}

.searchbox
{
width: 120px
}

.alert 
{
color:#ff6666
}


/* ------------------------------------------------------------

VIEWCART BUTTON

Special styles for he view cart button on Stores

------------------------------------------------------------ */

#viewcart 
{
    background: #CCCCCC url(../../../orchid/images/cart.gif) no-repeat scroll 8px top;
    border:1px solid #000000;
    display:block;
    height:32px;
    line-height:32px;
    margin:0 auto;
    padding:2px 0 2px 40px;
    width:64px;
}