@IMPORT url("jquery.fancybox.css");
@IMPORT url("jquery.loadmask.css");
@IMPORT url("-vacancy-application.css");

/** Color Palette
 *
 * @colordef #2175d9; Blue 1 (Blue #2175d9 is used as a primary colour. Used in the Randstad logo, C2 Global Navigation, and B1 Primary Action Button. It is also used as the primary link colour.)
 * @colordef #6da7e6; Blue 2 (Blue #6da7e6 is used as header background colour. Used in the C6 Title Header, and C23 Job Search component.)
 * @colordef #d1e4f6; Blue 3 (Blue #d1e4f6 is used for header typography. Used in the C5 Tabbed Header, C6 Title Header, and C23 Job Search component.)
 * @colordef #e61e1e; Red (Red #e61e1e is used as a negative action colour. This colour is used for error message text, and is also used in B3 Negative Action Button.)
 * @colordef #b8d000; Light Green (Green #b8d000 is used as an accent colour to work along with the primary Blue. This colour is used in C2 Global Navigation. Colours specific to a particular Randstad service, e.g. dark purple for Search & Selection, could also replace this colour.)
 * @colordef #009900; Green (Green #009900 is used as a positive action colour. Used in B2 Positive Action Button.)
 * @colordef #333333; Dark Gray (Black #333333 is used as highlighting text, module headers, selected items in left-hand navigation, refine filters, browser listing as well as an on-state for bread-crumb navigation, tabbed header and tabbed modules. Please refer to the Link and Typography Element sections for detailed usage.)
 * @colordef #666666; Medium Gray (Grey #666666 is primarily used as standard body text colour. In addition, it is used in headers for primary marketing modules, selected section in global navigation and neutral action buttons. Please refer to the Link and Typography Element sections for detailed usage.)
 * @colordef #999999; Light Gray (Grey #999999 is primarily used as secondary body text colour. Please refer to the Link and Typography Element sections for detailed usage.)
 * @colordef #cccccc; Supporting Gray 1 (Grey #cccccc is used for Tertiary content and Primary Dotted Horizontal rules. Please refer to the Link and Typography Element sections for detailed usage.)
 * @colordef #e0e0e0; Supporting Gray 2 (Grey #e0e0e0 is used in headers for standard marketing and content modules on Home and Landing pages.)
 * @colordef #eeeeee; Supporting Gray 3 (Grey #eeeeee is used as the framing background colour for all templates.)
 * @colordef #f9f9f9; Supporting Gray 3 (Grey #f9f9f9 is used as the background colour for specific content modules such as Small Modules in right-hand columns, My Messages in Dashboard Template, Refine filters and Browser listings. )
 *
 */


/** Basic styles
*/
body { font: 11px Arial, Verdana, sans-serif; background-color: #eee; }
strong, b { font-weight: bold; }
em, i { font-style: italic;}
td { white-space:nowrap; }
a { text-decoration: underline; color: #2274de; }
a:hover { text-decoration: underline; color: #111; }
input.text { width: 200px; padding: 2px 10px 0 10px; _padding-top: 4px; border: solid 1px #6DA7E6; height: 17px; _height: 15px; font-size: 11px; color: #666; }
select.text { width: 222px; border: solid 1px #6DA7E6; font-size: 9px; color: #666; height: 20px; }
select.dynamic { border: solid 1px #6DA7E6; font-size: 9px; color: #666; height: 20px; }
select.double, input.double { width: 120px; }
button { padding: 4px 5px 5px 10px; font-weight: bold; }
select { height: 17px; font-size: 12px; border: 1px solid #fff; color: #666; }
input.radio { _position: relative; _top: 2px; }
input.checkbox { _position: relative; _top: 2px; _height: 6px; _width: 14px; _height: 14px; }
input.file {
  *width: 235px; _width: 235px;
}
textarea { border: 1px solid #ccc !important;  }
img.article_img { margin: 0 10px 10px 0; }
.block { }


/** Layout
*/
.column { margin: 0 5px; display: inline; float: left; min-height: 1px; }
.first { margin-left: 0; }
.last { margin-right: 0; }
.span-768 { width: 768px; }
.span-720 { width: 720px; }
.span-634 { width: 634px; }
.span-544 { width: 544px; }
.span-496 { width: 496px; }
.span-480 { width: 480px; }
.span-306 { width: 306px; }
.span-308 { width: 308px; }
.span-352 { width: 352px; }
.span-368 { width: 368px; }
.span-316 { width: 316px; }
.span-224 { width: 224px; }
.span-204 { width: 204px; }
.span-205 { width: 205px; }
.span-192 { width: 192px; }
.span-176 { width: 176px; }

#zone_638 { z-index: 10 !important; }

/** Blocks
*/
.block { background-color: #f9f9f9; }
.block .block { margin-bottom: 0; }


/** Modules
*/
.module { }
.module .h { padding: 9px 16px 9px 16px; }
.module .b { padding: 20px 16px; }
.md_primary { height: 212px; overflow: hidden; }
.md_primary .h { color: #fff; background-color: #666; }
.md_primary .h h2 { font-size: 12px; font-weight: bold; text-shadow: #444 0px 0px 4px; }
.md_secondary { height: 188px; overflow: hidden; }
.md_secondary .h { color: #666; background-color: #e0e0e0; }
.md_secondary .h h2 { font-size: 12px; font-weight: bold; }


/** Masthead & Container
*/
#container { margin: 16px auto; width: 960px; }
#masthead { height: 212px; z-index: 998; position: relative; background-color: #fff; _margin-bottom: -14px; }
#masthead img.picture { position: absolute; left: 242px; top: 31px; display: block; }
#masthead .capability { position: absolute; right: 18px; top: 9px; }
#masthead .capability li { margin-right: 4px; padding-right: 4px; float: left; border-right: 1px solid #7e7e7e; }
#masthead .capability li.last { margin-right: 0; padding-right: 0; border: none; }
#masthead .actions { width: 100%; position: absolute; left: 0; bottom: 0; }
#masthead .tools a { margin: 0 4px; }
#masthead .nav_and_search { height: 28px; border-top: 1px solid #fff; background-color: #b8d000; width: 100%; z-index: 10; position: relative; }
#masthead #search { float: right; color: #fff; }
#masthead #search * { display: inline; float: left; }
#masthead #search label { margin: 7px 10px 0 0; }
#masthead #search input.text { margin: 5px 5px 0 0; border: none; font-size: 12px; }
#masthead #search input.image { margin: 5px 16px 0 0; }
#masthead .logo { width: 176px; height: 26px; left: 66px; top: 76px; position: absolute; }
#masthead .logo span { background-image: url(fir-logo.png); }
#masthead .good_to_know_you { width: 170px; height: 21px; right: 107px; top: 83px; z-index: 1; position: absolute; } 
#masthead .good_to_know_you span { background: transparent url(fir-masthead-good_to_know_you.png) no-repeat left top; }


/** Navigation
*/
#nav { display: block; float: left; _display: inline; background-color: #2175d9; }
#nav li { display: block; float: left; _display: inline; position: relative; }
#nav li.active div a { background-color: #666; background-image: none; }
#nav li div a { display: block; _float: left; padding: 8px 22px 0 15px; height: 20px; font-size: 12px; font-weight: bold; text-decoration: none; border-right: 1px solid #fff; color: #fff; background: #4874d5 url(bg-nav-dropdown.png) no-repeat right top; }
#nav li div a:hover,
#nav li:hover div a { background-color: #666; background-position: right -50px; }
#nav li ul { padding: 1px 4px 4px 0; _padding-bottom: 0; width: 224px; overflow: hidden; display: none; position: absolute; left: 0; top: 28px; background: url(bg-nav-shadow.png) right bottom; _background-image: none; _background-color: #fff; _border: 1px solid #eee; _border-top: none; }
#nav li li { margin-right: 4px; *margin-right: 0; float: none; display: block; }
#nav li li a { padding: 7px 5px 7px 15px; width: 204px; _width: 208px; text-decoration: none; display: block; color: #2175d9; }
#nav li li a:hover { color: #fff; background-color: #6da7e6; }
#nav > li:hover ul { display: block; }
#nav li.opened ul { display: block; }



/** Toolbar
*/
#toolbar { padding: 6px 16px 10px 16px; clear: both; height: 12px; _height: 11px; overflow: hidden; position: relative; }
#toolbar .breadcrumb { float: left; color: #2175d9; width: 500px; overflow: hidden; _position: absolute; }
#toolbar .breadcrumb a { text-decoration: none; }
#toolbar .breadcrumb a:hover { text-decoration: underline; }
#toolbar .breadcrumb span { color: #333; }
#toolbar .tools { color: #7e7e7e; float: right; }
* html #toolbar .tools { position: relative; white-space: nowrap; position: absolute; right: 5px; bottom: 6px; }


/** Footer
*/
#footer { width: 928px !important; padding: 15px 16px; border-top: 1px solid #999; color: #666; _margin-top: -24px; _background-color: #eee; }
#footer a { color: #2175d9; }
#footer .left { width: 600px; display: block; float: left; _display: inline; }
#footer .employer_services { margin-bottom: 5px; }
#footer .employer_services li { margin-right: 5px; float: left; display: inline; color: #2175d9; }
#footer .employer_services a { text-decoration: none; }
#footer .employer_services a:hover { text-decoration: underline; }
#footer .site_links { margin-bottom: 20px; }
#footer .site_links li { margin-right: 5px; float: left; display: inline; }
#footer .site_links a { color: #666; }
#footer .site_links a:hover { color: #333; }
#footer .left p { font-size: 9px; line-height: 1.43em; }
#footer .right { width: 256px; float: right; }
#footer .right img { display: block; float: left; _display: inline; margin-right: 10px; }
#footer .right h2 { margin-bottom: 3px; font-size: 14px; color: #ff8a00; }


/** Ajax spinner
 */
#ajax-indicator { position:absolute; z-index:1001; width:32px; height:32px; background-color:#F9F9F9; padding:2px; border:1px solid #6291BF; }



/** Inverstor relations
*/
.bk_investor_relations { height: 108px; color: #666; }
.bk_investor_relations h2 a { margin-left: 5px; font-size: 11px; font-weight: normal; text-decoration: none; }
.bk_investor_relations h2 a:hover { text-decoration: underline; }
.bk_investor_relations .price { margin-bottom: 3px; font-size: 16px; font-weight: bold; line-height: 1em; }
.bk_investor_relations td { padding-right: 10px; }


/** Unknown
*/
.bk_unknown { background-color: #e0e0e0; }
.bk_unknown div { padding: 15px 16px; }
.bk_unknown div * { display: block; float: left; _display: inline; }
.bk_unknown div h2 { margin-right: 30px; }
.bk_unknown div h3.T2 { margin: 2px 10px 0 0; color: #666; }


/** Sidebar RSS
*/
.bk_rss-block { margin-left: 1px; padding: 10px 0 15px 15px; background-color: #f9f9f9; }
.bk_rss-block div { margin-right: 5px; float: left; }
.bk_rss-block li { margin-bottom: 2px; }


 

.masthead-margin { padding-top: 0px !important; background-color: #eee; }
.comp_search-results { _margin-bottom: -10px; }
.bk_C6-XL { }
.bk_articles_list_block2 { clear: both !important; float: none !important; position: relative; }

.candidates_profile_profilestats { background: #fff none; float: left; clear: none; width: 191px; }
.candidates_profile_data { width: 720px; float: left !important; }
.bk_candidates_profile_data { background: none; }
.candidates_profile_data .section { background-color: #fff; }
.bk_search_results li img { margin: 0 0 5px 5px; float: right; }

 
.bk_sitemap .subcol { float: left; padding: 10px 16px; width: 275px; }
.bk_sitemap .section { margin: 0 0 15px 0; overflow: hidden; }
.bk_sitemap h2, 
.bk_sitemap h3.jobdetails { color: #333333; font-size: 12px; font-weight: bold; margin-bottom: 10px; }
.bk_sitemap ul { padding-left: 0px !important; }
.bk_sitemap ul li { list-style-type: none; background: transparent none !important; padding-left: 0px !important; }
.bk_sitemap .section ul.links li { padding-bottom: 2px; }
.bk_sitemap .section a { font-weight: normal !important; }
.bk_sitemap .section a:hover { font-weight: normal !important; text-decoration: underline !important; }

.bk_jobs_results_block .bk_C17-refine_filters h2 { margin-bottom: 10px; padding: 10px 0 10px 16px; background-image: none; background-color: #f9f9f9; }
.bk_jobs_results_block .bk_C17-refine_filters .section { border: 1px solid #ccc; }


.bk_static-content_display-box { color:#666666;  background-color:#F9F9F9; overflow:hidden; padding:0 16px;}
.bk_static-content_display-box .marketing-module { height:212px; }
.bk_static-content_display-box .module-header { background-color:#666; font-size:12px; font-weight:700; height:18px; color:#fff; margin:0 -16px 15px; padding:7px 16px 3px; }
.bk_static-content_display-box p { margin-bottom:8px; }
.bk_static-content_display-box h3 { border-bottom:1px dotted #ccc; margin:0 0 5px; padding:0 0 5px; }
.bk_static-content_display-box img { margin-bottom:3px; }
.bk_static-content_display-box .l1 { background-position:2px 5px; padding-left:12px; }
.bk_static-content_display-box .l6 { display:block; margin:2px 0 0; }
.bk_static-content_display-box ul { margin-bottom:14px; float:left; }
.bk_static-content_display-box ul li { background-image:url(list-star.gif); background-repeat:no-repeat; background-position:0 8px; padding:5px 0 0 12px; }
.bk_static-content_display-box ul li.linklist { list-style:none; background-image:none; margin-top:5px; padding:5px 0 0; }
.bk_static-content_display-box ul li.two-column-list { width:120px; float:left; }
.bk_static-content_display-box .job-list li a em { font-style:normal; color:#333; }
.bk_static-content_display-box .job-list li a:hover,.marketing-module .sector-list li a:hover {text-decoration:underline; color:#666; }
.bk_static-content_display-box .l1, .l1:visited { background-image:url(link-arrow.gif); background-position:2px 5px; background-repeat:no-repeat; color:#2175D9; font-size:11px; font-weight:700; padding:0 5px 0 10px; text-decoration:none; }

/*.bk_spontaneous_register .section { *width: auto !important; }
.bk_spontaneous_register input.text { width: 238px; }
.bk_spontaneous_register .section-body td.value { text-align: right; }
.bk_spontaneous_register .asterisk { float: right; }*/


.blockSB { margin: 0 0 -1px 1px; padding: 10px 16px 12px; border: 1px solid #e0e0e0; border-left: none; border-right: none; background-color: #f9f9f9; _zoom: 1; }
.blockSB .activator { margin: 0 0 8px -12px; }
.blockSB .activator .L7 { padding-left: 12px; }
.blockSB p { color: #666; }
.blockSB li { margin-bottom: 2px; }
.blockSB .SB-new_jobs li a { font-weight: bold; }

.bk_component_navtree {min-height: 281px}

