/*
Website: http://bwdb
Name: Brevard Workforce
Description: CSS based website, designed and hosted by Artemis Inc.
Version: 1.0
Author: Jefte Puente
Author URI: http://www.artemisit.com
Comments: This stylesheet is best viewed without word wrapping
*/
/*** Header Styles ***/
#header { border-left: 1px solid #b7e1df; border-right: 1px solid #b7e1df; width: 760px; background-image:url('/images/hd_banner.jpg'); background-repeat: repeat-x; height: 125dpx; float: left; }
#wageButton { width: 125px; height: 25px; display: block; margin: 92px 0 0 610px;}
/*** Body and Common Styles ***/
body {margin: 0px; color: #000; font-size: 62.5%; /**** This percentage sets 1.0 em to 10px. Increasing this value will increase the entire sites font scale.****/
font-family: Arial, Arial, sans-serif; }
.spacer { clear: both; }
p {font-size: 1.2em; color: #222;}
#page { overflow: hidden; width: 760px; margin: 20px auto; padding: 10px; background: #fff; }
#content { border-right: 1px solid #b7e1df; border-left: 1px solid #b7e1df; width: 730px; float: left; padding: 15px; }
#content_border { border-left: 1px solid #b7e1df; border-right: 1px solid #b7e1df; }
hr { height: 1px; border-top: 1px solid #c1c1c1; border-bottom: 0; margin: 10px 0 15px 0;}
table { width: 100%; }
.rowHeader { background-color: #699D9B; font-size: 1.1em;}
.DocrowHeader { background-color: #699D9B; font-size: 1.1em; color: #FFFFFF; font-weight: bolder;}
/*** Footer Styles ***/
#footer { border-right: 1px solid #b7e1df; border-bottom: 1px solid #b7e1df; border-left: 1px solid #b7e1df; margin: 0; background-image: url(/images/ft_bg.gif); height: 65px; width: 730px; clear: both; color: #555; text-align: center; padding: 15px; padding-bottom: 30px; float: left; font-size: 0.9em; background: #fff; }
#footer p { border-top: 1px solid #d1d1d1; padding-top: 15px;}
/*** Links ***/
#content a { color: #222; font-weight: bold; }
#content a:hover {color: #008479; }
#footer a { color: #699D9B; font-weight: normal; }
#footer a:hover { color: #BEEBE7; }
/*** Lists ***/
ol { font-size: 1.2em; line-height: 1.5; }
ul { font-size: 1.2em; line-height: 1.5;}
/*** Heading Styles ***/
h1 { display: block; line-height: 1.0; color: #444; font-size: 1.8em; margin: 0; font-style: italic; width: 380px; border-bottom: 1px solid #444; padding-top: 10px; }
h1 a { text-decoration: none; }
h1 a:hover { text-decoration: none; }
h2 { font-size: 1.7em; color: #4f7674; margin: 0; padding: 0; letter-spacing: -1px;}
h3 { font-size: 1.5em; letter-spacing: 0; margin: 15px 0 -15px 0;}
h4 { font-size: 1.4em; background: #eee; padding: 5px; width: 750px; }
h3 a { text-decoration: none; }
/*** Navigation - Uses an unordered list and styles them as buttons ***/
/* Main Nav */
/* Main Nav Container */
#navcontainer1 {
float: left;
width: 100%;
height: 22px;
margin: 5px 0 0 0;
background: #efefef;
}
/* Tabs (Top level menu items) - Special for this site - http://www.alistapart.com/articles/slidingdoors2/ */
#nav1 {
float:left;
width:100%;
font-size:11px;
line-height:normal;
font-style: normal;
letter-spacing: -1;
}
#nav1 ul {
margin:0;
padding:0;
list-style:none;
font-size: 1.1em; font-weight: bold;
}
#nav1 li {
float: left;
position: relative;
margin: 0 0 0 0px;
padding:0;
}
#nav1 a {
float:left;
background: none;
margin:0;
padding: 5px 5px 5px 5px;
text-decoration:none;
color: #555;
}
#nav1 a span { /* Spans in the nav are not being used on this site */
float:left;
display:block;
background:url("/images/nav_endcap.png") no-repeat right 35%;
padding: 5px 5px 5px 5px; /* The padding around the text */
font-weight:bold;
margin-right: 3px; /* Spacing between navigation tabs */
color: #333;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav1 a span {float:none;}
/* End IE5-Mac hack */
#nav1 a:hover span {
color: #fff;
}
#nav1 #current a {
background-position:0% 100%;
border-width:0;
}
#nav1 #current a span {
background-position:100% 100%;
padding: 5px 5px 5px 5px;
color: #333;
}
#nav1 a:hover {
background: #d5d5d5;
}
#nav1 a:hover span {
background-position: 100% 100%;
}
/* Dropdowns - http://www.htmldog.com/articles/suckerfish/dropdowns/ */
/* Applies to all sub-levels */
#nav_dropdown1, #nav_dropdown1 ul {
padding: 0;
margin: 0;
list-style: none;
line-height: 1;
}
/*#nav_dropdown1 ul { padding: 0 0 5px 0; background: url('/images/nav_footcap.png') 0% 100%; } /* footer cap */
#nav_dropdown1 ul a {
display: block;
background: none;
font-weight: normal;
font-size: 11px;
}
/* 1st Level List Items */
#nav_dropdown1 li { float: left; }
/* 2nd Level List - UL
Sets a width on the UL element - Without it, list goes horizontal
Hides the UL from view using left */
/* Using left instead of display to hide menus because display: none isn't read by screen readers */
#nav_dropdown1 li ul { position: absolute; left: -999em; }
/* 2nd Level List elements - LI */
#nav_dropdown1 ul li { clear:left; margin: 0;}
/* 2nd Level List elements - A */
#nav_dropdown1 ul li a { width: 140px; padding: 5px; background: #566e6f; color: #fff;}
#nav_dropdown1 ul li a:hover { background: #637f80; color: #fff; }
/* 3rd Level List elements - UL - Sets position of the UL element */
#nav_dropdown1 li ul ul { width: 140px; }
/* 3rd Level List elements - A */
#nav_dropdown1 ul ul li a { background: #ccc; }
#nav_dropdown1 ul ul li a:hover { background: #ffd09d; color: black; }
/* This bit moves list items off the page using negative left margin */
#nav_dropdown1 li:hover ul ul, #nav_dropdown1 li.sfhover ul ul { left: -999em; }
/* This brings the list items back on screen and into view upon hover
Note usage of .sfhover, a class required and called by the javascript function
that handles :hover attributes so that IE will properly :hover on a LI element */
/* lists nested under hovered list items - edit to adjust position of menu popup*/
#nav_dropdown1 li:hover ul, #nav_dropdown1 li li:hover ul, #nav_dropdown1 li.sfhover ul, #nav_dropdown1 li li.sfhover ul {
left: 0px;
top: 26px;
}
#nav_dropdown1 li li:hover ul, #nav_dropdown1 li li.sfhover ul {
left: 0px;
top: 26px;
}
/* Special Class For showing bg-image w/arrow for 3rd level items */
#nav_dropdown1 .nav_has_level3 { background-image: url('/images/dot_arrow.png');
background-position: top right;
}
#nav_dropdown1 .nav_has_level3:hover { background-image: url('/images/dot_arrow_up.png');
background-position: top right;
}
/*** Images & Alignments
Using 'class="alignright"' on an image will align the image to the right.
And using 'class="centered', will of course center the image. This is much
better than using align="center", being much more futureproof (and valid) ***/
img { border: none; }
img.centered { display: block; margin-left: auto; margin-right: auto; }
img.alignright { padding-left: 8px; margin: 0 0 0px 0px; display: inline; }
img.alignleft { padding: 0; padding-right: 8px; margin: 0 0px 8px 0; float: left;}
.alignright { float: right; }
.alignleft { float: left; margin-right: 5px; margin-bottom: 10px; }
/*** Form Styles ***/
/* WE CAN FINALLY STOP USING TABLES FOR forms!
Example Markup: */
label { display: block; width: 280px; float: left; margin-bottom: 10px; font-size: 1.2em; font-weight: bolder; text-align: right; padding-right: 10px; }
#Telephone, #FAX { width: 100px; }
#State { width: 130px; float: left; }
#Zip { width: 45px; }
#Comments { height: 55px; width: 250px; margin-bottom: 10px; }
.submit { width: 50px; margin: auto; background-color: white; margin-right: 10px; }
#submit { margin-left: 100px;}
.form { margin: 0; padding: 0; }
/* Home Page Login form */
#login_Username {width: 130px; }
#login_Password { width: 130px; }
#login_Submit { border: 1px solid #333333; font-size: 12px; margin: 10px 0 5px 0; font-family: Helvetica, Verdana, Sans-serif;}
#login_Form p { font-size: 1.2em; margin: 0; line-height: 16px; color: #555;}
#login_Form a { font-size: 0.9em; font-weight: normal; margin: 2px 0 0 0; }
#login_Form { margin: 0 0 0 0; width: 130px; }
#login_FormBox { background: #ddd; margin: 0 10px 10px 0; padding: 10px; width: 140px; }
#login_Form h3 { width:120px; }
/*** Added styles by Jerry, please revise Jefte ***/
#news { float:right; width: 150px; background: #def3f2; padding: 10px; }
#homepage_content { float:left; width: 380px; margin-left: 18px; }
#sidebar { float:left; display: block; width: 140px; }
#sidebar_dropdown { position: relative; float: left; display: block; width: 140px; list-style-type: none; margin: 0; padding: 0; }
#sidebar_dropdown li a { width: 120px; position: relative; margin: 0; display: block; padding: 10px 10px 10px 10px; background: #f5f5f5; color: #444; text-decoration: none; }
#sidebar_dropdown li a:hover { position: relative; margin: 0; display: block; padding: 10px 10px 10px 10px; background: #dcdcdc; text-decoration: none; }