View Careers Website Customization
Table of Contents
When uploading your HTML into BrightMove, do not include the <DOCTYPE> or <HTML> tags. Those are automatically added. Just include your <HEAD> and <BODY>.
Careers Website Customization
Please read the following document for instructions on customizing the Careers Website.
File:CompanyPortalInstructions.pdf
Default Look and Feel
BrightMove offers a clean and crisp standard career site look and feel. The default CSS looks like this.
div.BMRequired {
color: #E3877F
}
table {
font-family: Verdana;
font-size: 11px
}
table.BMPortalLogin {
font-size: 10px;
color: #000000;
font-size: 11px
}
table.BMBorder {
background-color: #000000;
font-size: 11px
}
table.BMTitle {
font-weight: bold;
background-color: #F5FAFD;
color: #182E51;
border: 1px solid #000000;
font-size: 11px
}
table.BMContent {
background-color: #FFFFFF;
border: 1px solid #000000;
font-size: 11px
}
table.BMJobDescription {
background-color: #FFFFFF;
border: 1px solid #000000;
font-size: 11px
}
table.BMForm {
background-color: #F7FCDE;
border: 1px solid #000000;
font-size: 11px
}
table.BMDataGrid {
font-family: Verdana;
background-color: #DDDDDD;
border: 1px solid #000000;
font-size: 11px
}
table.BMPageResults {
background-color: #C4E996;
border: 1px solid #000000;
font-size: 11px
}
table.Timecard {
font-family: "Tahoma";
background-color: #F5FAFD;
border: 1px solid #000000
}
table.Timesheet {
font-family: "Tahoma";
background-color: LightYellow;
border: 1px solid #000000
}
table.Timeentry {
font-family: "Tahoma";
background-color: #cccccc;
border: 1px solid #000000
}
tr.BMHeader {
font-weight: bold;
color: #000000;
background-color: CCCCCC;
text-indent: 5pt
}
tr.BMTitle {
font-weight: bold;
color: #182E51;
background-color: #E5EFAF
}
tr.BMNoDataFound {
background-color: #FFFFFF;
font-style: italic
}
tr.BMData {
background-color: #FFFFFF
}
tr.BMHighlight {
background-color: #B5EFAF
}
tr.BMLoginLine {
font-size: 12px
}
tr.TimeHeader {
font-weight: bold;
background-color: #ffffff;
text-align: center
}
tr.Timeentry {
background-color: #ffffff
}
td.Header {
font-weight: bold;
color: #000000;
background-color: #CCCCCC
}
td.SortedHeader {
font-weight: bold;
color: #142E50;
background-color: #E6E6E6
}
td.BMError {
font-weight: bold;
color: #FF0000
}
td.BMTitle {
font-size: 14px;
font-weight: bold
}
td.BMLabel {
text-align: left;
vertical-align: top;
font-size: 11px
}
td.BMViewData {
font-weight: bold;
vertical-align: top;
font-size: 11px
}
td.BMMenu {
font-size: 10px
}
td.BMRequired {
color: #E3877F;
text-align: left;
vertical-align: top;
white-space: nowrap;
font-size: 11px
}
td.Small {
font-family: Verdana;
font-size: 11px
}
td.SmallBold {
font-family: Verdana;
font-weight: bold;
font-size: 11px
}
td.XSmall {
font-family: Verdana;
font-size: 10px
}
td.XSmallBold {
font-family: Verdana;
font-weight: bold;
font-size: 10px
}
td.Timeentry {
text-align: right
}
td.TimeentryTotal {
text-align: right;
font-weight: bold
}
input.PortalButton {
font-size: 11px;
background-color: #CCCCCC;
border: 1px solid #000000
}
input.PortalMiniButton {
font-size: 10px;
background-color: #CCCCCC;
border: 1px solid #000000
}
input.BMButton {
font-size: 10px;
background-color: #F5FAFD;
border: 1px solid #000000
}
input.BMMiniButton {
font-size: 8px;
background-color: #F5FAFD;
border: 1px solid #000000
}
input.TimeHoursRO {
text-align: right;
width: 30px;
background-color: #DDDDDD;
border: 1px solid #cccccc
}
input.TimeHoursEdit {
text-align: right;
width: 30px;
background-color: #D4FFC4;
border: 1px solid #000000
}
select.BMWide {
width: '2 in'
}
a.BMNewLink {
color: blue
}
a.BMNewLink:active {
color: blue
}
a.BMNewLink:visited {
color: blue
}
a.BMNewLink:hover {
color: blue
}
a.Header {
color: #FFFFFF
}
a.Header:active {
color: #FFFFFF
}
a.Header:visited {
color: #FFFFFF
}
a.Header:hover {
color: #FFFFFF
}
a.SortedHeader {
color: #142E50
}
a.SortedHeader:active {
color: #142E50
}
a.SortedHeader:visited {
color: #142E50
}
a.SortedHeader:hover {
color: #142E50
}
a.BMTitle {
color: #000066
}
a.BMTitle:active {
color: #000066
}
a.BMTitle:visited {
color: #000066
}
a.BMTitle:hover {
color: #000066
}
b.BMHighLight {
color: #FF0000;
font-size: 12px
}
Customization
A company can customize HTML style elements further by overriding the CSS used to render the site. There are 2 options for applying these styles to the BrightMove careers site.
Link to Local CSS
Save the modified CSS on your company website, then reference the CSS from the portal code you upload into BrightMove.
<link rel="StyleSheet" href="http://www.yourcompanysite.com/brightmove_style.css" type="text/css" media="screen">
Embedded CSS
If you just want to override a handful of styles, you can use the embedded style sheet solution in the HTML you upload to BrightMove. Just add this in the <head> tag of your HTML.
<style type="text/css" media="screen">
<!--
tr.BMHeader {
font-weight: bold;
color: #DDDDDD;
background-color: #FFFFFF;
text-indent: 10pt
}
tr.BMTitle {
font-weight: bold;
color: #000000;
background-color: #FFFFFF
}-->
</STYLE>