﻿@import url("Reset.css");

body { background: #fff url(../Images/bck_bodyBg.jpg) no-repeat top center;position: relative; }

.js #overlay, .js .home #aspnetForm { display:none; } /* to avoid flash of content-before-shutter or shutter-before-content scenarios */

.no-js #overlay { display:none; }
/*#overlay { display:none; }*/

.no-js #overlay { display:none; }
.js #overlay { width:100%;height:100%;position:fixed;z-index:1000;top:0;left:0; }
.js #overlay #top-section { height:362px;position:relative;z-index:101; }
.js #overlay #top-section .top { background:transparent url(../Images/stream-selector/top-bg.png) 0 0 repeat;height:100%; }

.js #overlay #top-section .top .info-panel { width:275px;margin:0 auto;padding-top:190px; }
.js #overlay #top-section .top .info-panel p { text-transform:uppercase; }
.js #overlay #top-section .top .info-panel p.main-title { font-size:2.4em;color:#a8a8a8;padding:15px 0 5px;border-bottom:1px solid #afc0b8;margin:0; }
.js #overlay #top-section .top .info-panel p.main-title span { font-weight:bold;color:#afc0b8; }
.js #overlay #top-section .top .info-panel p.sub-title { font-size:1.6em;color:#a8a8a8;padding:10px 0 5px; }
.js #overlay #top-section .base { background:transparent url(../Images/stream-selector/top-arrow.png) center 0 no-repeat;height:30px; }
.js #overlay #bottom-section { height:75%;position:relative;z-index:100;margin-top:-15px; }
.js #overlay #bottom-section .top { background:transparent url(../Images/stream-selector/bottom-arrow.png) center 0 no-repeat;height:31px; }
.js #overlay #bottom-section .base { background:transparent url(../Images/stream-selector/bottom-bg.png) 0 0 repeat;height:100%; }
.js #overlay #bottom-section .base .info-panel { width:760px;margin:0 auto;padding:25px 17px 0; }
.js #overlay #bottom-section .base ul { list-style-type:none;padding:0 0 25px;margin:0;background:transparent url(../Images/stream-selector/divider.png) center bottom no-repeat; }
.js #overlay #bottom-section .base ul li { display:block;float:left;padding:0 25px;border-right:1px solid #fff; }
.js #overlay #bottom-section .base ul li.first { padding-left:0; }
.js #overlay #bottom-section .base ul li.last { border-right:none;padding-right:0; }
.js #overlay #bottom-section .base ul li a { color:#fff;text-transform:uppercase;font-size:1.2em; }
.js #overlay #bottom-section .base p.view-all { padding:30px 0 0; }
.js #overlay #bottom-section .base p.view-all a { color:#fff;text-transform:uppercase;font-size:1.3em;background:transparent url(../Images/stream-selector/white-arrow.png) right center no-repeat;padding:0 15px 0 0; }
.js #overlay #bottom-section .base #overlay-loader { display:none; }

#stream-selector-bar { background:transparent url(../Images/stream-selector-bar.png) repeat-x left bottom;text-align:center;width:100%;height:48px;position:fixed;z-index:1001;top:-48px;left:0; }
.no-js #stream-selector-bar { top:0; }
#stream-selector-bar p { padding:6px 0 0 0;text-transform:uppercase;font-size:1.2em; }
#stream-selector-bar p a { padding:0 20px;font-weight:bold; }
#stream-selector-bar p a.current { color:#b1413f; }

#container {width: 984px; margin: 0 auto;text-align: left; line-height: 1.3; position: relative; padding:30px 0 0;}
/* .no-js #container { padding:0; } */

/* ------ PNG FIX ------ */
#homepageDivider, .panelDivider, .bott, #mapPins a, div #container div #ourPeople .panel div .bott, h2.title span, #csrIcons li img,#secondaryNavigation ul li,#secondaryNavigation,#secondaryNavigation ul li a.active,#videoPageContainer,.mapShadow, #SocialMap, #MatchMe,#ourPeople .bott,.videoPlaylistShadow,.videoPlayerShadow,#videoPlaylistOuter  { behavior: url(/iepngfix.htc); }

/* ------ HEADER ------ */
#header  {margin:0 25px 0 25px;padding-top: 24px;width: 934px;}
#header #ultimateDestination {float: left; margin-top: 7px;width: 275px;}
#header #logos {float: right;}
#header #logos img {margin-top: 0;}

/* ------ NAVIGATION ------ */
#navigation {clear: both; float: left; display: inline;background: transparent url(../Images/bck_horizontalRule.gif) 0px 0px no-repeat; margin: 6px 25px 0 25px; padding-top: 18px;}
#navigation ul {float: left; margin-left: -20px;}
#navigation ul li {float: left; list-style: none; background: url(../Images/bck_navDivider.gif)  top right no-repeat;}
#navigation ul li a {color: #bdcac8; text-transform: uppercase;padding: 7px 20px;display: block;}
#navigation ul li a.active {background: url(../Images/bck_navItemSelected.png) top right no-repeat;color: #fff; }
#navigation ul li a:hover {color: #fff}

/* ------ SEARCH ------ */



#search { position:absolute;top:120px;right:24px;background:#daeae9 url(../Images/search.png) 5px center no-repeat;padding:3px; }

#search .txtSearch, #search .btnSearch { background:transparent;border:0; }
#search .txtSearch { margin-left:20px;color:#242f2b;font-size:11px; }
#search .btnSearch { color:#5c796f;font-weight:bold;font-size:11px;cursor:pointer; }

/* ------ HOMEPAGE STYLES ------ */
#homeBanner {width: 935px; clear: left; height:355px;margin: 20px 25px 0 25px; float:left; display: inline; background: #fff; position:relative;}
#homeBanner h1 {position: absolute; left: -2200em;}
#homeBanner .hero-block { margin:19px 0 18px 20px;width:894px;height:318px;position:absolute;top:0;left:0; }
#homeBanner .block-overlay { z-index:100;display:none;background:transparent url(../Images/stream-selector/top-bg.png) 0 0 repeat; }
/*#homeBanner .hero-block img {position:absolute; top:0; left:0; z-index:2;}*/
#homeBanner .block-overlay .loading { text-align:center;padding-top:145px; }
#homeBanner .hero-block div#homeBannerLink {position:absolute; bottom:0; right:19px; height:114px; width:278px; z-index:3;}
#homeBanner .hero-block div#homeBannerLink a {display:block; height:114px; width:278px; text-indent:-999999px;}

#homeBanner #graduate-video-overlay { background:url("../Images/hero-video/graduate/overlay.jpg") 0 0 repeat;width:894px;height:318px;position:absolute;top:0;left:0; }
#homeBanner #graduate-video-overlay a#nick-lee { display:block;width:255px;height:44px;position:absolute;left:79px;top:250px; }
#homeBanner #graduate-video-overlay a#eimear-odonnell { display:block;width:152px;height:44px;position:absolute;left:425px;top:250px; }
#homeBanner #graduate-video-overlay a#steve-wortley { display:block;width:152px;height:44px;position:absolute;left:690px;top:250px; }

#homeBanner #apprentice-video-overlay { background:url("../Images/hero-video/apprentice/overlay.jpg") 0 0 repeat;width:894px;height:318px;position:absolute;top:0;left:0; }
#homeBanner #apprentice-video-overlay a { display:block;width:167px;height:250px;position:absolute;top:30px;background:left bottom no-repeat; }
#homeBanner #apprentice-video-overlay a#label-1 { left:64px; background-image:url("../Images/hero-video/apprentice/andrew.png"); }
#homeBanner #apprentice-video-overlay a#label-2 { left:258px; background-image:url("../Images/hero-video/apprentice/nozrul.png"); }
#homeBanner #apprentice-video-overlay a#label-3 { left:470px; background-image:url("../Images/hero-video/apprentice/kirsty.png"); }
#homeBanner #apprentice-video-overlay a#label-4 { left:684px; background-image:url("../Images/hero-video/apprentice/danielle.png"); }


#homepageDivider {float: left;height: 23px; width: 930px; background: transparent url(../Images/bck_homeBannerShadow.png) no-repeat;}

.panel { float: left; display: inline; width: 300px;position:relative; }
.panel .content-block { padding:20px;background:#fff;width:260px;height:255px;position:absolute;top:0;left:0; }
.panel .content-block .loading { text-align:center;padding-top:110px; }

.panel .content-block p.social {color:#878787; font-weight:bold; padding:10px 0 24px;}
.panel .content-block h4.social {color:#5e5e5e; width:85px; float:left; margin:7px 0 0; font-size:1.2em; font-weight:bold;}
.panel .content-block ul.social {list-style:none; float:left; margin:0; width:105px;}
.panel .content-block ul.social li {float:left; margin:0 0 0 10px;}
.panel .content-block ul.social li.first {margin:0;}

.panel .block-overlay { z-index:100;display:none;background:transparent url(../Images/stream-selector/top-bg.png) 0 0 repeat; }
.no-js .panel .block-overlay { display:none; }

.panel h2 { color:#728986;font-size: 1.6em;padding:0;margin:10px 0 8px;font-weight:bold;text-transform:uppercase;}
.panel p { margin:0 0 10px;font-size: 1.2em;}
.panel p.link { margin:0; }
.panel p.link a { color:#b0413e;text-transform:uppercase;font-size:1.2em;font-weight:bold;background: transparent url(../Images/link-arrow.gif) right center no-repeat;padding:0 20px 0 0; }
.panel .bott {background: url(../Images/bck_panelBottomShadow1.png) no-repeat; width: 266px; clear: right; height:20px; }

* html .panel .bott  {background: none;}



.panelDivider {float: left; width: 16px; margin-right: 1px; height: 340px; background: transparent url(../Images/bck_homePanelDivider.png) no-repeat;}
#panel-left {margin-left: 25px;}

/* ------ HOMEPAGE STYLES Programmes Slider ------ */
#view-jobs { padding:20px 20px 10px;background:#fff; height:127px;}
#view-jobs p.view-all { margin-bottom:5px; }
#view-jobs p.view-all a { background:#b0413e;display:block;font-weight:bold;color:#fff;padding:5px;font-size:1.1em;border-top:1px solid #fff;text-align:center; }
#view-jobs ul.ats-links { list-style-type:none;margin:0;padding:0; }
#view-jobs ul.ats-links li a { font-size:11px;color:#2c2c2c;padding:0 12px 0 0;background: transparent url(../Images/home-promo/small-arrow.png) no-repeat right center; }
#view-jobs #job-ticker { background:#2c2c2c;padding:12px 15px 11px; }

/* Sudo Slider */
#view-jobs #slider ul, #view-jobs #slider li{ margin:0;padding:0;list-style:none;position:relative;display:block;}
#view-jobs #slider, #view-jobs #slider li { width:230px;overflow:hidden;text-align:center; }
#view-jobs #slider ul li a { color:#fff;font-weight:bold; font-size:0.9em}
#view-jobs ol { width: 50%; margin: 11px 0 0 82px; padding:0;list-style:none;height:11px; }
#view-jobs ol li { text-indent:-999999em;background:url('../Images/home-promo/sliders-buttons.png') 0 0 no-repeat; width:9px; height:11px; float:left;margin:0 5px 0 0; cursor:pointer; padding:0; }
#view-jobs ol li.current { background-position:0 -11px; cursor:default; }
#view-jobs ol li a { float:left;height:11px; }
#view-jobs ol li.current a { background:#5DC9E1;color:#fff;}
#view-jobs ol li a:focus, .prevBtn a:focus, .nextBtn a:focus{outline:none;}


/* ------ HOMEPAGE STYLES News List ------ */
#news-list {padding:15px 20px 20px;background:#fff; height:83px;}
#news-list h2 { margin-top:0; } 
#news-list ul { position: relative;width:auto;height:54px;background:#000 url(../Images/home-promo/news-list-bg.png) repeat-x left bottom;color:#fff;overflow: hidden;list-style:none;text-align:left;margin: 0 auto; }
#news-list ul li { margin:0;padding:0;width:100%;height:54px;border:0;	border-bottom:1px gray solid;background:#000 url(../Images/home-promo/news-list-bg.png) repeat-x left bottom;display: none;/* important: if js is off, only lis with class of current are visible on page load */ }
#news-list ul li.current { position: absolute;display: block;top: 0px;/* important: change to set final position of li -- make sure that the js knows this too */z-index: 0;/* important ensures that the next li is not hidden underneath the on-screen */ }
#news-list ul li.new { position: absolute;display: block;top: -54px;/* important: change to set off-screen start position of li */z-index: 1;/* important: ensures that the next li is not hidden underneath the on-screen */ }
#news-list ul li span { padding:12px 13px;display:block; }
#news-list ul li span a { color:#fff;font-size:0.9em; }



/* ------ FULL WIDTH ------ */
#fullWidth {clear: left; width: 984px;float: left;padding: 20px 0px 0px 0px; margin: 0;}
#fullWidth h1 {width: 700px;float: left;font-size: 2.3em; color: #bdcac8; padding: 10px 0; background: transparent url(../Images/bck_horizontalRule.png) bottom left no-repeat;}
#fullWidth #contentArea {background: white; clear: left; float: left; margin-top: 20px; padding: 25px; width: 660px; min-height: 550px; height:auto !important; height: 550px;}
#fullWidth #contentArea p {line-height: 1.6;}
#fullWidth #contentArea p.note {font-weight:bold;}
#fullWidth #contentArea ol, #fullWidth #contentArea ul {line-height: 1.6; color: #61726f; margin:0 0 30px 25px;}
#fullWidth #contentArea ul li {margin:5px 0;}
#fullWidth #fullWidthWrap {margin-left: 25px;}

/* ------ TWO COL STYLES ------ */
#main {clear: left; padding:20px 0 0 25px; float: left; width: 959px}
#main #secondaryNavigation {float: left; width: 225px; background: transparent url(../Images/bck_secondaryNavDivide.png) top left no-repeat;}
#main #secondaryNavigation ul {}
#main #secondaryNavigation ul li {list-style: none; background: url(../Images/bck_secondaryNavDivide.png) bottom left no-repeat;}
#main #secondaryNavigation ul li a {color: #c9d5d3; font-size: 0.9em; display: block; padding: 6px 0 6px 2px; }
#main #secondaryNavigation ul li a:hover {color:#fff;}
#main #secondaryNavigation ul li a.active {color:#c1c0b6; }
#main #secondaryNavigation ul li ul {margin-left:18px;}
#main #secondaryNavigation ul li ul li { background: url(../Images/bck_secondaryInnerNavDivide.png) top left no-repeat;}
#main #secondaryNavigation ul li ul li a {font-size: 0.7em; color: #b9b9b0; padding-left:0px;}
#main #secondaryNavigation ul li ul li ul li {font-size:1em; color: #b9b9b0;}
#main #secondaryNavigation ul li ul li ul li {  }
#main #secondaryNavigation ul li ul li a.active { color:#fff; }

#main #mainContentArea {width:716px; float:left; margin-left:17px; min-height: 550px; height:auto !important; height: 550px;}
#main #mainContentArea .banner { background: #fff; padding: 15px;width:663px;margin-bottom: 17px;}
#main #mainContentArea #copy {background: #fff;padding: 20px;width:653px; }
#main #mainContentArea .content-side-promo #copy { width:407px;float:left; }
#main #mainContentArea .content-side-promo #side-promo { width:250px;float:right;margin:0 0 0 17px; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap { width:239px;background: transparent url(../Images/side-promo/promo-right.png) right center no-repeat; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content { width:198px;background:#fff;padding:16px 14px; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content h3 { padding-top:10px;padding-bottom:10px; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content h3 a { color:#b0413e;text-transform:uppercase;font-size:1.3em;font-weight:bold;background: transparent url(../Images/link-arrow.gif) right center no-repeat;padding:0 20px 0 0; }
.ie7 #main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content h3 a {display:inline-block;}
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content p { margin:0; }

#main #mainContentArea .content-side-promo #side-promo .promo-wrap .graduate-brochure h3 { padding-top:3px;padding-bottom:3px; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .graduate-brochure h3 a { text-transform:none;font-size:1.2em; }
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .graduate-brochure p { font-size:1.4em;color:#828282;padding:12px 0 7px; }



#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content.social p {color:#878787; font-weight:bold; padding:10px 0 16px;}
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content.social h4 {color:#5e5e5e; width:85px; float:left; margin:7px 0 0; font-size:1.2em; font-weight:bold;}
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content.social ul {list-style:none; float:right; margin:0; width:105px;}
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content.social ul li {float:left; margin:0 0 0 10px;}
#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-content.social ul li.first {margin:0;}

#main #mainContentArea .content-side-promo #side-promo .promo-wrap .promo-base { background: transparent url(../Images/side-promo/promo-base.png) bottom left no-repeat;width:226px;height:15px; }


/* BOTTOM PROMOS */
#main #mainContentArea #bottom-promos { position:relative; margin:14px 0 0 0}
#main #mainContentArea #bottom-promos #left { float:left; margin:20px 22px 20px 0; }
#main #mainContentArea #bottom-promos #right { float:right; margin:20px 23px 20px 0; }
#main #mainContentArea #bottom-promos .promo { width:287px; height:270px; padding:18px; background:#fff; }
#main #mainContentArea #bottom-promos .promo-wrap { position:relative; height:270px; }
#main #mainContentArea #bottom-promos #left.promo .promo-wrap { width:352px; background: transparent url(../Images/bottom-promo/Right-double-shadow-x270.png) 305px 50% no-repeat; }
#main #mainContentArea #bottom-promos #right.promo .promo-wrap { width:320px; background: transparent url(../Images/bottom-promo/Right-shadow-x270.png) 305px 50% no-repeat; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content {float:left; width:270px;}
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content img { padding-bottom:13px; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h2 { padding:0;color:#8ca19e;font-size:1.5em;font-weight:bold;text-transform:uppercase; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h3 { padding:20px 0 0; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h3 a { color:#b0413e;text-transform:uppercase;font-size:1.5em;font-weight:bold;background: transparent url(../Images/link-arrow.gif) right center no-repeat;padding:0 20px 0 0; }
.ie7 #main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h3 a { display:block; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h3 a { margin:0; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content p { font-size:1.3em; line-height:1.6em;padding-top:0;margin:0; }

#main #mainContentArea #bottom-promos .promo-top { position:absolute; top:-33px; left:0; background:transparent url(../Images/bottom-promo/Top-shadow.png) top left no-repeat;width:287px;height:15px; }
#main #mainContentArea #bottom-promos .promo-base { position:absolute; bottom:-33px; left:0; background:transparent url(../Images/bottom-promo/Bottom-shadow.png) bottom left no-repeat;width:287px;height:15px; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content h3.bott-promo-head {color:#61726F;text-transform:uppercase;font-size:1.5em;font-weight:bold;padding:5px 0 0 0;}

/* BOTTOM PROMOS - SOCIAL MEDIA PROMO BOX */
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content.social p {color:#878787; font-weight:bold; padding:20px 0 9px;}
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content.social h4 {color:#5e5e5e; float:left; margin:7px 0 0; font-size:1.3em; font-weight:bold;}
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content.social ul {list-style:none; float:left; margin:0 0 0 1em; }
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content.social ul li {float:left; margin:0 0 0 10px;}
#main #mainContentArea #bottom-promos .promo .promo-wrap .promo-content.social ul li.first {margin:0;}

/* apply now button for Solihull-Opportunities.aspx */
#main #mainContentArea #copy p#apply-button-wrap {text-align:right;font-size:10px;height:50px;margin:10px 0 0 0;position:relative;}
#main #mainContentArea #copy a.apply-button {height:25px; background:#B0413E; color:#FFF; font-size:1.3em; height:25px; font-weight:normal; padding:0.5em 1em 0 1em; margin:0;position:absolute;top:10px;right:0;text-decoration:none;}



#main #mainContentArea #copy table#assessment {margin:0 0 20px; border-top:1px solid #798D8B;}
#main #mainContentArea #copy table#assessment td {color:#555; font-size:1.1em; padding:4px; border-bottom:1px solid #798D8B;}


#main #mainContentArea #copy h1 {font-size: 2.2em; background: url(../Images/bck_H1Repeat.gif) bottom left no-repeat; color: #61726f; padding-bottom: 10px; margin-bottom: 15px;}
#main #mainContentArea #copy h2 {font-size: 1.75em; color: #798d8b; margin: 20px 0 10px 0;}
#main #mainContentArea #copy h3 {font-size: 1.6em; color: #798d8b; margin: 20px 0 8px 0;}
#main #mainContentArea #copy h4 {font-size: 1.4em; color: #798d8b; margin: 20px 0 15px;}
#main #mainContentArea #copy p {line-height: 1.4;}
#main #mainContentArea #copy p a {text-decoration: underline;}
#main #mainContentArea #copy p a:hover {text-decoration: none;}
#main #mainContentArea #copy ul, #main #mainContentArea #copy ol {line-height: 1.6; color: #555;margin:0 0 30px 15px;}
#main #mainContentArea #copy .video-content { margin-bottom:30px; }
#main #mainContentArea #copy div.view-video { margin:30px 0 0 0; }
#main #mainContentArea #copy .label { color: #61726f; font-size: 13px; }
#main #mainContentArea #copy #accordion h3 { margin:0; padding: 0 0 0 11px; }
#main #mainContentArea #copy #accordion p { padding:2px 0 0 12px; }

/* ------ SEND TO A FRIEND ------ */
#sendToAFriend input[type="text"] { margin-bottom: 20px; }
#sendToAFriend input[type="submit"], #sendToAFriend input[type="button"], #sendToAFriend button { color: white; font-family: Arial,Verdana,Helvetica,'Trebuchet MS',sans-serif; font-size: 12px; font-weight: bold; background-color: #BDCAC8; border: 0; text-align: center; float: left; margin: 0px 5px 0px 0px; padding: 3px 5px;}
#sendToAFriend .required { color: Red; }
#sendToAFriend .error ul li { color: Red; }
#sendToAFriend .error ul { margin: 0px 0px 20px 15px !important; }

/* ------ COMPETITION PAGE ------ */
#competition #topBanner {background: #fff; padding: 19px; width: 894px; margin: 0 25px;}
#competition #topBanner img {float: left; margin-right: 19px;}
#competition #topBanner #info { height: 287px;float: left; width: 250px; background: url(../Images/bck_infoback.jpg) no-repeat; padding:15px; }
#competition #topBanner #info p, #competition #topBanner #info a{color: #fff}
#competition #topBanner #info a {text-decoration: underline}
#competition #topBanner #info a:hover {text-decoration: none;}
#competition #shadowDivider {background: url(../Images/bck_competitionShadow1.png) no-repeat; width: 933px; height: 24px; margin: 0 0 0 25px;}
#competition #competitionForm {width: 950px; margin: 0 0 0 25px; }
#competition #competitionForm div#inner {float: left;padding: 50px 30px;background: #fff; margin: 0; width: 872px; }
#competition #competitionForm #rightShadow {float: left; width: 17px; height: 312px; background: url(../Images/bck_competitionShadow2.png) no-repeat;}
#competition #bottomShadow {width: 928px; height: 34px; margin-left: 25px; clear: left; background: url(../Images/bck_competitionShadow3.png) no-repeat; }
#competition #introWithVideo {float: left; width: 398px; padding-right: 30px; margin-right: 30px; border-right: 1px solid #bdcac8}
#competition #introWithVideo h1 {background: none; margin: 0 0 15px 0; padding: 0;color:#61726f;}
#competition #introWithVideo h2 {font-size: 1.5em; color:#61726f; margin: 20px 0 10px 0; }
#competition #introWithVideo p {margin-bottom: 10px;line-height: 1.6}
#competition #introWithVideo ol {margin: 0 0 20px 20px;line-height: 1.6}
#competition #introWithVideo ol li {font-size: 1.3em; color: #555; }
#competition #introWithVideo ol li a { text-decoration:underline; }
#competition table {margin-left: 30px; width: 408px;}
#competition table tr td {padding-bottom: 10px}
#competition table tr td a {color: #636969; text-decoration: underline}
#competition table tr td label {color: #636969; font-size: 1.4em; padding-top: 7px;width: 150px;}
#competition table tr td input { background: #dadada; border: none; width: 225px; padding: 7px 0 7px 5px; color: #636969}
#competition table tr td span.radio-button-male,#competition table tr td span.radio-button-female {float: left;}
#competition table tr td span.radio-button-male label {float: left; width: 45px;}
#competition table tr td span.radio-button-female label {float: left; width: 60px;}
#competition table tr td span.radio-button-male input,#competition table tr td span.radio-button-female input {width: 20px; float: left; background-color: #fff; margin: 7px 15px 0 0; }
#competition table tr td  span.licenceCheck input,#competition table tr td span.termsCheck input {width: 20px; margin-top: 7px; background: white;}
#competition input.button { padding: 5px;border: none;float: right; background: #a2b1af; text-transform: uppercase; color: White; margin-right:30px;}
.validation-Summary { margin: 0px 0 20px 0px; float: left;}
.validation-Summary h4 { font-size: 1.6em;}
.validation-Summary ul li{ margin: 0 0 0 20px;}
.entry-failure p{width:387px; color:red; float: left;}

/* ------ VIDEO PAGE ------ */
#videoPageContainer {padding: 19px 25px 0 25px; min-height: 550px; height:auto !important; height: 550px; clear: left;background: transparent url(../Images/bck_horizontalRule.png) 25px 19px no-repeat; }
#videoPageContainer h1 {width: 700px;float: left;font-size: 2.3em; color: #bdcac8; padding: 10px 0; background: url(../Images/bck_horizontalRule.png) bottom left no-repeat; }
#videoPlayerOuter {width: 546px; float: left; clear: left; margin-top: 30px;}
#videoPlayerOuter .videoPlayerShadow {height: 21px; width: 564px; background: url(../Images/bck_VideoLeftShadow.png) no-repeat; float: left}
#videoPlayer {background: white;}
#videoPlayerInner {padding: 19px; height: 370px;position: relative;}
#videoPlayerOuter #videoControls #currentTime, #videoPlayerOuter #videoControls #totalTime, #videoPlayerOuter #videoControls #muteUnmute {display: none}
#videoPlaylistOuter {width: 316px; float: left; padding-bottom: 30px;margin: 30px 0 0 27px;background: url(../Images/bck_VideoRightShadow.png) bottom left no-repeat; width :264px;}
#videoPlaylist {width: 316px;  background: white; position: relative; }
#videoPlaylist {padding: 12px;}
#videoPlaylist h4 {color: #5f7070; font-size: 1.4em;padding-top: 15px; position: absolute; left: 20px; top: 45px; font-weight: bold;}
#videoPlaylist #scroller {height: 550px; overflow: auto;}
#videoPlaylist h3 {color: #5f7070; cursor:pointer; padding: 7px 5px 7px 20px; margin-bottom: 50px; font-size: 1.5em; font-weight: bold;background: #dfdfdf url(../Images/icon_filterArrow.gif) 95% 50% no-repeat;}
#videoPlaylist h3.active {background: #dfdfdf url(../Images/icon_filterArrowActive.gif) 95% 50% no-repeat;}
#videoPlaylist #filterList {display: none; background: #dfdfdf;  position: absolute; top: 45px; left: 12px; width: 314px; z-index: 2; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;border-left: 1px solid #dfdfdf;border-top: 1px solid #5f7070;}
#videoPlaylist #filterList {padding: 5px 0;}
#videoPlaylist #filterList li {list-style: none}
#videoPlaylist #filterList li a {padding: 0 4px 4px 20px; color: #5f7070; display: block; width: 200px;}
#videoPlaylist #filterList li a:hover {text-decoration: underline}
#videoPlaylist .thumb {margin-bottom: 10px; height: 86px;}
#videoPlaylist .thumb img  { float: left; clear: left;}
#videoPlaylist .thumb span {width: 170px;display: block;padding-left: 10px; float: left; color: #808080; font-weight: bold; font-size: 1.3em; line-height: 1.6}
#videoInfo {float: left; background: white; margin-top: 20px; width: 546px}
#videoInfo a {color: #808080; text-decoration: underline;}
#videoInfo a:hover {text-decoration: none}
#videoInfo ul {padding:25px}
#videoInfo p {padding: 25px 25px 0 25px;}
#videoInfo ul li {list-style: none; margin: 4px 0;}
#videoTitle {color: #666565; font-size: 1.5em; margin-left: 25px; padding-bottom: 20px; font-weight: bold; position: absolute; bottom: 0px; left: 0px; z-index: 3;}
#progressBarOuter {position: absolute;width: 150px; bottom: 105px; left: 30px; background: #ccc; height: 7px;cursor: pointer;}
#progressBar {position: absolute; top: 0; left: 0;background: red; width: 0px; font-size: 0px; height: 7px; z-index: 2; } 
#bytesLoaded {position: absolute; top: 0; left: 0;background: #bbb; width: 0px; font-size: 0px; height: 7px; z-index: 2 }
#videoPlayerInner object {}
.play {outline: 0;position:absolute; z-index: 2; bottom: 50px; left: 18px;text-indent: -2000em;background: transparent url(../Images/button_youtubePlay.png) no-repeat; width: 508px; height: 53px; display: block; }
.pause {outline: 0;position:absolute; z-index: 2; bottom: 50px; left: 18px;text-indent: -2000em;background: transparent url(../Images/button_youtubePause.png) no-repeat; width: 508px; height: 53px; display: block; }
#ViewTranscript {font-size: 1.3em; margin: 0 25px 25px 25px;float: right}
#transcript {display: none; margin: 20px 0 0 0; padding: 0;}
#transcript p {margin: 10px 25px 20px 0px; line-height: 1.6}

/* SCROLLER */
.jScrollPaneContainer {position: relative;overflow: hidden;z-index: 1;}
.jScrollPaneTrack {position: absolute;cursor: pointer;right: 0;top: 0;height: 100%;background: #dfdfdf;}
.jScrollPaneDrag {position: absolute;background: #849590;cursor: pointer;overflow: hidden;}
.jScrollPaneDragTop {position: absolute;top: 0;left: 0;overflow: hidden;}
.jScrollPaneDragBottom {position: absolute;bottom: 0;left: 0;overflow: hidden;}
a.jScrollArrowUp {display: block;position: absolute;z-index: 1;top: 0;right: 0;text-indent: -2000px;overflow: hidden;height: 9px;}
a.jScrollArrowUp:hover {}
a.jScrollArrowDown {display: block;position: absolute;z-index: 1;bottom: 0;right: 0;text-indent: -2000px;overflow: hidden;height: 9px;}

/* ------ OUR WORLD ------- */
#SocialMap {margin: 0 25px; width: 934px; background: url(../Images/bck_horizontalRule.png) no-repeat;}
#SocialMap #googleMapContainer { width: 904px; background: #fff; margin-top: 25px;  padding: 15px;float: left; position: relative; }
#SocialMap #googleMapContainer p {margin: 20px 20px 10px 0px; font-size: 1.4em}
#SocialMap #googleMapContainer .loader {position: absolute; top: 250px; left: 420px; width: 155px;display: none}
#SocialMap #googleMapContainer .loader p {text-align: center}
#SocialMap #googleMapContainer .loader img {display:block; margin: 0 auto}
#SocialMap #googleMapContainer #map {z-index: 2;}

/** TWITTER GOOGLE MAP BUBBLE **/
.twitter-map-bubble{ width:250px; height:130px; font-family: arial; font-size:13px; }
.twitter-map-bubble div.twitter-icon{ margin:0 0 5px 0; background:url('../Images/bubble-icon-twitter.gif') no-repeat; height:24px; width:24px;}
.twitter-map-bubble div.twitter-text{ color:#848887; font-style:italic; font-weight:bold; text-align:left;}
.twitter-map-bubble div.twitter-text a{ color:#848887; text-decoration: underline}
.twitter-map-bubble div.twitter-text a:hover{ text-decoration:underline;}

/** FLICKR GOOGLE MAP BUBBLE **/
.flickr-map-bubble{ width:250px; font-family: arial; font-size:13px; }
.flickr-map-bubble div.flickr-icon{ margin:0 0 5px 0; background:url('../Images/bubble-icon-flickr.gif') no-repeat; height:24px; width:70px;}
.flickr-map-bubble div.flickr-text{ color:#848887; font-style:italic; font-weight:bold; text-align:left;}
.flickr-map-bubble img.flickr-image{ margin: 3px 0 0 0; text-align:center;}
.flickr-map-bubble div.flickr-text a{ color:#848887; text-decoration: underline}
.flickr-map-bubble div.flickr-text a:hover{ text-decoration:underline;}

/* ------ OUR CAREERS ------ */
#MatchMe {margin: 0 18px; width: 948px;background: url(../Images/bck_horizontalRule.png) no-repeat;}
#MatchMe #MatchMeContainer { background: white; width: 948px;height: 510px;margin: 25px 0 0 0px;  padding: 0px;float: left; position: relative; }

/* ------ UK LOCATIONS MAP ------ */ 
#mainContentArea #copy #ukMap { width: 575px; height: 235px; background: transparent url(../Images/bck_UkLocationsMap.jpg) no-repeat; position: relative;}
#mainContentArea #copy #ukMap ul {float: right; margin: 35px 10px 0 0;display: inline;}
#mainContentArea #copy #ukMap ul li { background: transparent url(../Images/bck_ukMapListDivider.gif) no-repeat;list-style: none; width: 170px; } /* plus see line later for padding */
#mainContentArea #copy #ukMap ul li a {outline: 0;color: #7c8988; padding: 7px 0; display: block; font-size: 0.9em}
#mainContentArea #copy #ukMap ul li a.active {color: #ffffff}
#ukMap #browns, #ukMap #castle, #ukMap #gaydon, #ukMap #halewood, #ukMap #solihull, #ukMap #whitley {position: absolute; background: url(../Images/bck_yellowDot.png) no-repeat; width: 7px; height: 7px;}
#ukMap #browns {top: 115px; left: 205px; }
#ukMap #castle {top: 100px; left: 193px; }
#ukMap #gaydon {top: 130px; left: 200px; }
#ukMap #halewood {top: 40px; left: 127px; }
#ukMap #solihull {top: 110px; left: 193px; }
#ukMap #whitley {top: 122px; left: 212px;}
#ukMap #browns.active, #ukMap #castle.active, #ukMap #gaydon.active, #ukMap #halewood.active, #ukMap #solihull.active, #ukMap #whitley.active {background: url(../Images/bck_yellowDotSelected.png) no-repeat;}
#copy .details h2 {margin: 20px 0}

/* ------ ACCORDION STYLES ------ */
.ui-wrapper { border: 1px solid #50A029; }
.ui-wrapper input, .ui-wrapper textarea { border: 0; }
#main #mainContentArea #copy #accordion h2.title {position: relative;cursor: pointer;color:#fff; background: #7c918a url(../Images/bck_accordionBck-2.png) no-repeat right top; font-size: 1.4em; margin: 1px 0 0 0; padding: 10px 20px 9px 20px;}
#main #mainContentArea #copy #accordion h2.title.selected {background-position: right -44px;}
#main #mainContentArea #copy #accordion h2.title span.subtitle {font-size:0.8em;}
#accordion div {margin-top: 10px; padding: 0 10px;}


/* ------ FOOTER ------ */
#footer { margin-top:80px;clear: left; width: 100%; float: left; background: #d3d4d6 url(../Images/bck_footer.jpg) top center no-repeat;}
#footerInner {width: 984px; margin: 0 auto;} 
#footer #footerInner ul {float: left; padding-top: 48px; margin-left: 37px;}
#footer #footerInner ul li {float: left;display: inline; list-style: none; background: url(../Images/bck_footerDivide.gif) center right no-repeat}
#footer #footerInner ul li.last {background: none}
#footer #footerInner ul li a {color: #526053; display: block; padding: 0 13px;}
#footer #footerInner ul li a:hover {text-decoration: underline}
#footer #footerInner ul#socialLinks {margin-top: 0px; padding-top: 30px;}
#footer ul#support {display: inline;background: url(../Images/bck_footerHorizontalRule.gif) bottom left no-repeat;float: left;width: 600px;padding: 0px 0 30px 0; margin: 40px 0 0px 37px;}
#footer #footerInner ul#support li.first a {padding: 0 13px 0 0;}
#footer ul#csrIcons {display: inline; padding: 10px 10px 0 0; margin-bottom: 30px;}
#footer #footerInner ul#csrIcons li {background: none;margin: 0px 25px 0 0; padding: 0;  display: block;}
#footer #footerInner ul#csrIcons li a { padding:0;margin:0; }
#footer #footerInner ul#socialLinks { display: inline;clear: left; width: 480px; }
#footer #footerInner ul#socialLinks li a {padding: 4px 20px 10px 30px; margin-left: 15px;border-right: none}
#footer #footerInner ul#socialLinks li.first a {margin-left:0;}
#footer #footerInner ul#socialLinks li a#facebook {background: transparent url(../Images/icon_facebook.gif) no-repeat;}
#footer #footerInner ul#socialLinks li a#twitter {background: transparent url(../Images/icon_twitter.gif) no-repeat;}
#footer #footerInner ul#socialLinks li a#youtube {background: transparent url(../Images/icon_youtube.gif) no-repeat;}
#footer #footerInner ul#socialLinks li a#linkedin {background: transparent url(../Images/icon_linkedin.gif) no-repeat;}

/* ------ SITE MAP ------ */
#fullWidth #contentArea #siteMap ul { margin-bottom:5px; }
#fullWidth #contentArea #siteMap ul li {margin:5px 0; width: 300px;list-style-type:disc;font-size:12px; }
#fullWidth #contentArea #siteMap a{ list-style-type:none; display:block;}




/* ------ SCREENREADER MENU ------ */
.screenReaderMenu {position: absolute; top: -1000px; left: -1000px; font-size: 1px; line-height: 1px;}


/* ------- BANNER SLIDESHOW -------*/
#slideshow {
    position: relative;
    display: block;
    width:663px;
    height: 245px;
    background-color: #02050a; /* IE fix */
    overflow:hidden; 
}
#slideshow img{
    border:none;
}
#slideshow ul, #slideshow li{
    position: relative;
    display: block;
    margin:0;
    padding:0 20px 0 0;
    list-style:none;
    width:663px;
    height: 245px;
    background-color: #02050a; /* IE fix */
    overflow:hidden; 
}
#slideshow li { 
    width:663px;
    height: 245px;
    background-color: #02050a; /* IE fix */
}
#slideshow li { 
    display:none; /* prevent extra lis from being fleetingly visible at page load / visble in no-js */
}
#slideshow li.show { 
    display:block; /* show this li at page load */
}


/* ------- CAREER EVENTS TABLE -------*/
table.events { color: #555555; border-collapse:collapse; font-size: 1.15em; }
table.events th { color: #61726F; font-weight: bold; font-size: 1.25em; text-align:left; }
table.events th, table.events td { border-bottom: 1px solid #555555; padding: 0.3em; font-size: 1.1em; }
table.events td a {text-decoration:underline;}

/* ------ GLOBAL ------ */
p { color: #555; font-size: 1.3em; margin-bottom: 20px;}
/*p.lead {font-size: 1.8em; color: #61726f}*/
a {color: #61726f; text-decoration: underline;}
ul li, ol li {font-size: 1.3em;}
#main #mainContentArea #copy ul li, #main #mainContentArea #copy ol li {padding:5px 0;}
#mainContentArea #copy #ukMap ul li { padding:0; }
#main #mainContentArea #copy ul li ul, #main #mainContentArea #copy ul li ol, #main #mainContentArea #copy ol li ol, #main #mainContentArea #copy ol li ul {margin:0 0 0 30px;}
#main #mainContentArea #copy ul li ul li,
#main #mainContentArea #copy ol li ol li, 
#main #mainContentArea #copy ul li ol li, 
#main #mainContentArea #copy ol li ul li {font-size: 1.0em;}
* {outline: 0;}
.clear {clear: both; height: 0px; font-size: 0; border:0;}
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* ------ WALLPAPERS ------ */
#divWallpaperTeasersWrapper {width:100%;display:block;clear:both;}
.divWallpaperTeaser {float:left;margin:2em 0 2em 3em; height:105px;}
.divWallpaperTeaser img {float:left;margin:0 20px 0 0;}
.divWallpaperTeaser ul {font-size:0.9em; font-weight:bold;width:100px; float:left; margin:30px 0 0 0;}
.divWallpaperTeaser ul li a {text-decoration:underline;}
#divWallpaperTeasersWrapper .divWallpaperTeaser ul li { padding: 3px 0 !important; }

/* MEDIA QUERY TO TARGET IPAD */

/*@media screen and (min-device-width:768px) and (max-device-width:1024px) */

@media only screen and (device-width: 768px)
{
 body { background: #fff url(../Images/bck_bodyBg_ipad.jpg) no-repeat 0 0; }
 .graduate-brochure h3.online-brochure { display:none; }
 .js #overlay #bottom-section .base .info-panel { width:770px;padding:25px 0; }
 .js #overlay #bottom-section .base ul li a { font-size:1.2em; }
}

/* LIGHTBOX */
/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 100%;
    height: 500px;
}
#jquery-lightbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999999;
    text-align: center;
    line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
    position: relative;
    background-color: #fff;
    width: 250px;
    height: 250px;
    margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
}
#lightbox-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
    width: 49%;
    height: 100%;
    zoom: 1;
    display: block;
}
#lightbox-nav-btnPrev {
    left: 0;
    float: left;
}
#lightbox-nav-btnNext {
    right: 0;
    float: right;
}
#lightbox-container-image-data-box {
    background-color: #fff;
    margin: 0 auto;
    line-height: 1.4em;
    overflow: auto;
    width: 100%;
    padding: 0 10px 0;
}
#lightbox-container-image-data {
    padding: 0;
    color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
    width: 70%;
    float: left;
    text-align: left;
}    
#lightbox-image-details-caption { font-weight: bold;display:none;color:#fff; }
#lightbox-image-details-currentNumber {
    display: block;
    clear: left;
    padding-bottom: 1.0em;    
}            
#lightbox-secNav-btnClose {
 
    width: 28px;
    float: right;
    padding:0  1em 1em 0;    
}
p.lightbox-prompt {font-size:1.1em; font-style:italic;}

