/* ========================================
   == NAPA CSS. Styles for NAPA Careers website.
   == C. Ott, JWT Employment Communications
   == Last revision: Nov 8, 2006
   == ====================================== */
body, html {
    margin: 0; padding: 0; height: 100%;
    background: white;
    color: #444444;     /* Dark Gray */
    font-family: Arial, Helvetica, sans-serif;
    font-size: medium;  /* Establishes base size in browser. */
    font-size: 87%;
    line-height: 1.1em;
}

td, select, input {
    font-family: Arial, Helvetica, sans-serif;
    font-size: medium;  /* Establishes base size in browser. */
    font-size: 85%;
}

h3 {
    margin: 0.5em 0 0.125em 0;
    font-weight: bold;
    font-size: 110%;
}
h4 {
    font-size: 100%;
    font-weight: bold;
    color: #333333;
    margin: 0.5em 0 0.25em 1em;
}
p {}
p.jobtitle {
    font-size: 100%;
    margin: 0 0 0.5em 0;
}
p.pullquote {
    font-size: 100%;
    font-weight: bold;
    color: #0E2B8A; /* Blue */
}
p.firstpara {clear: both;}

img.employee_profile {
    float: left;
    margin: 0 1em 1em 0;
    border: 0;
}

div.jobsearchlabel {
    position: absolute;
    width: 28%; height: 20px; z-index: 10;
    top: 100px; right: 3%;
    background: #FFB310 url('../art/banner_Job_Search.gif') no-repeat;
}
div.blankyellowlabel {
    position:absolute;
    width:28%;
    height:20px;
    z-index:10;
    top:440px;
    right:3%;
    background:#FFB310;
}

/* The wrapper positions all the content on the screen. Note that the wrapper has no height, so you can't
use it for bordering. */
div#wrapper {
    position: absolute;
    width: 90%;
    margin: 0 5% 0 5%;
    background: white;
}

/* Left and right borders. These are mostly blue, but have a dark-blue inner border.*/
div#rightside {
    position: absolute;
    width: 5%;
    margin: 0 0 0 95%;
    height: 1000px;
    background: #0E2B8A;
    border-left: 4px solid #003466; /* Dark blue */
    z-index: 0;
}
div#leftside {
    position: absolute;
    width: 5%;
    margin: 0 0 0 0%;
    height: 1000px;
    background: #0E2B8A;
    border-right: 4px solid #003466; /* Dark blue */
}

div#toplogo {
    float: left;
    width: 60%;
    margin: 1em 1em 1em 4em;
}
div#toptext {
    float: left;
    width: 60%;
    margin: 1em 1em 1em 4em;
}
div#toptext select,
div#toptext select option {
    font-size: 90%;
    width: 20em;
    color: white;
    background: #999999;
    font-weight: bold;
}

div#searchblock {
    width:28%;
    float:right;
    margin:0 0 0 0;
}
iframe#searchpage {
    /*width:90%;*/
    /*height:300px;*/
    padding:0;
    margin:0;
}

/* Styles for blue divider lines. The max-width follows the text settings. */
div.bluedivider { 
    width: 100%; height: 10px; margin: 0; padding: 0;
    text-align: center;
    max-width: 45em;
}
.bottom {border-bottom: 1px solid #0A3C91; }
.bottom img {position: relative; top: 1px; }
.top {border-top: 1px solid #0A3C91; }
.top img {position: relative; top: -1px; }

div#bottomtext {
    float: left;
    width: 60%;
    margin: 1em 1em 1em 4em;
}

div#footer {
    float: left;
    width: 60%;
    margin: 1em 1em 1em 4em;
    clear: left;
}
div#footer p {
    font-size: 75%;
    font-weight: bold;
    color: #999999;
    max-width: 58em;
}

/* Set a max-width so that lines of text don't run too wide. */
div#toptext p,
div#bottomtext p {
    max-width: 45em;
}

div#crosspromotion {
    width: 28%;
    float: right;
    padding: 1em 0 0 2em;
}


/* The yellow bar menu is used on search results pages and some others. */
div#yellowbarmenu {
    float: left;
    height: 2em; width: 100%;
    background: #FFB310; /* Yellow */
}

div#yellowbarmenu a 
{
    display: block;
    font-weight: bold; font-size: 90%;
    padding: 0.5em 0 0.125em 3em;
    float: left;
    color: black;
    text-decoration: none;
}

div#yellowbarmenu a:hover { 
		color: red; 
}

div#yellowbarmenu a.homelink {
    color: white;
    padding: 0.5em 1em 0.125em 3em;
}

div#yellowbarmenu a.rightlink { float: right; }
div#yellowbarmenu a.endlink { float: right; padding: 0.5em 2em 0.125em 0.5em;}