﻿/* All screen styles go in here - common.css is just for styles that you want to appear on print and screen */

.outer {margin: 0 auto;width:970px;}
.main {float:left;width:970px;}
.header {position:relative;margin:0; padding:0;width:970px;float:left;height:86px; /*text-indent:-999em;*/}




/* top level nav */
ul.nav {line-height:1.0;font-size:1.2em;float:left;width:960px;list-style:none; background:url(../images/menu-bg.gif) repeat-x; height:62px; padding:0 15px;}

/* 1st level dropdown + styles that apply to all levels */
.nav ul {position:absolute;	top:-999em;list-style:none;	}
.nav ul li a {display:block;}
.nav li {position:relative;z-index:99;float:left;margin:5px 0px;display:inline;}
.nav li ul{width:142px;background:url(../images/bg-nav-drop.png) bottom left no-repeat;padding:0 4px 5px 4px;margin-top:4px;}
.nav li:hover ul,ul.nav li.sfHover ul {left:-1px;top:52px; }
.nav li:hover li ul,.nav li.sfHover li ul {top:-999em;}
.nav li li:hover ul,ul.nav li li.sfHover ul {left:9.45em;top:-1px;}
.superfish li:hover ul,.superfish li li:hover ul {top: -999em;}
.nav a {text-decoration:none;text-align:center;display:block;line-height:4em;color:#fff;font-weight:bold;white-space:nowrap;text-transform:uppercase;padding:0 40px;height:52px;}
.nav a:hover{ text-decoration:none; }
.nav li li a {text-align:left;line-height:1.6em;height:auto;color:#fff;font-weight:normal;text-transform:none;background:#2f4566;padding:3px 0 3px 5px;}
.nav li li a:hover, .nav li li a:focus {background:#1f314d;}
.nav li:hover, .nav li.sfHover,.nav a:focus, .nav a:hover, .nav a:active {color:#fff;background:url(../images/bg-nav-on.png) top left repeat-x;}
.nav li li {background:#2f4566;width:142px;margin:0;border-bottom:1px solid #708cad;}
.nav li li.first {margin-top:-4px;border-top:1px solid #708cad;background:url(../images/bg-nav-drop-top.png) top left no-repeat;}
.nav li li.last {border-bottom:none;}
.nav li li li {background:#2f4566;width:200px;}
.nav li a:hover, .mainnav li a:focus {color:#fff;background:url(../images/bg-nav-on.png) top left repeat-x;}
.nav a.on {color:#fff;background:url(../images/bg-nav-on.png) top left repeat-x;}
.nav a.on:hover, .nav a.on:focus {color:#fff;background:url(../images/bg-nav-on.png) top left repeat-x;}


/* accessible skip links */
div.skiplinks {text-indent:-999em;}

.maincontent {float:right;width:759px;font-size:1.3em;padding:0 20px 0 0; position:relative}
.home .maincontent {width:990px;padding:0px 10px 0px 0px; overflow:hidden; position:relative; float:left;margin-bottom:10px;}

.maincontent ul {margin: 20px;}
.homecontent {float:left; font-size:1em;line-height:1.5em;background:url(../images/bg-page-base.png) bottom left no-repeat; padding-bottom:8px;}
.homecontent .inner{ float:left;background:url(../images/body-bg.png) repeat-y; padding:0pt 12px 0px 6px;display:inline;width:605px;}

.subcontent{  float:left; font-size:1em;line-height:1.5em;background:url(../images/bg-page-base.png) bottom left no-repeat; padding-bottom:8px;}
.subcontent .inner{ float:left;background:url(../images/body-bg.png) repeat-y; padding:0pt 12px 0px 7px;display:inline;width:605px;}

.subnav {width:187px;float:left;padding: 0 0 5px 0;font-size:1.3em}

/* level 1 */
.subnav ul {list-style:none;font-size:1em;}
.subnav ul li a {display:block;text-decoration:none;color:#808080;background:url(../images/arrow-right.gif) no-repeat 23px 9px;padding: 0 0 0 35px;line-height:1.7em;}
.subnav ul li a:hover, .subnav ul li a:focus {background-color:#fff9cf;}
.subnav ul li.on a,.subnav ul li.on a:hover,.subnav ul li.on a:focus {background-color:#eee;border-top:1px solid #DCDCDC;border-bottom:1px solid #DCDCDC;} /* affects all list items under the "on" one */

/* level 2 */
.subnav ul li ul {list-style:none;}
.subnav ul li li a {background:#f9f9f9;font-size:0.85em;padding-left:45px;border-top:1px solid #eee;}
.subnav ul li li a:hover, .subnav ul li li a:focus {background:#f9f9f9;color:#3479BE;}
.subnav ul li li a.more,.subnav ul li li a.more:hover, .subnav ul li li a.more:focus  {background-repeat:no-repeat;background-position:171px 8px;}
.subnav ul li li a.more {background-image:url(../images/bg-subnav-off.gif);}
.subnav ul li li a.more:hover, .subnav ul li li a.more:focus {background-image:url(../images/bg-subnav-on.gif);}

/* level 3 */
.subnav ul li li li a {padding-left:60px;}
.subnav ul li li li.first a,.subnav ul li li li.first a:hover,.subnav ul li li li.first a:focus {border:none;}
.subnav ul li.on li a,.subnav ul li.on li a:hover,.subnav ul li.on li a:focus {border-top:1px solid #fff;border-bottom:none;}
.subnav ul li.on li a:hover, .subnav ul li.on li a:focus {color:#000 !important;}


/*    */
.footer {clear:both;background:url(../images/footer-bg.png) no-repeat top left;padding:10px 40px 0 30px; width:920px;margin:0 0 0 4px;color:#2356b6;height:50px; font-size:1.1em; line-height:1.5em;}
div.footer ul { margin:0 auto; padding:0; width:890px; height:40px; list-style-type:none; }
div.footer ul li { margin:10px 0 0 0; padding:0; float:left;  color:#2356b6;}
div.footer ul li a {  text-decoration:none; }
div.footer ul li a:hover { text-decoration:underline; }
div.footer ul li.first { text-align:left; width:400px; height:40px; margin:0px 130px 0 0; padding:10px 0 0 0px; }
div.footer ul li.last { text-align:right; width:220px; height:44px;  margin:0 0 0 120px; float:right }
div.footer ul li.last a {background:url(../images/wiliam-logo.gif) top right no-repeat; display:block; background-position:right;padding:9px 86px 10px 0; width:144px;}
div.footer ul li.last span { display:none; }
div.footer a{ color:#000; }

/* enquiry popup - don't forget the ie6 fixes */
.jqmWindow {display: none;position: fixed;top: 17%;left: 50%;margin-left: -300px;width:500px;height:458px;background-color: #fff;color: #333;border: 1px solid #686868;padding: 9px; }
.jqmWindow .enqform {clear:both;background:#fff;}
.jqmWindow .enqform h2, .jqmWindow .enqform h3 {padding: 15px 0 5px 15px;margin:0;}
.jqmWindow table th,.jqmWindow table td {padding: 3px 25px;}
.jqmWindow table {width:100%;}
.jqmWindow table th {background-color:#fafafa;}
.jqmWindow table td {background-color:#f6f6f6;}

/* scrolling images */
.jcarousel-skin-tango.jcarousel-container-horizontal {width: 245px; padding: 20px 40px;}
.jcarousel-skin-tango .jcarousel-clip-horizontal {width:  245px; height: 75px;}
.jcarousel-skin-tango .jcarousel-item {width: 59px; height: 59px;}
.jcarousel-skin-tango .jcarousel-item-horizontal {margin-right: 10px;}
.jcarousel-skin-tango .jcarousel-item-placeholder {background: #fff; color: #000;}
.jcarousel-skin-tango .jcarousel-next-horizontal {position: absolute; top: 43px; right: 5px; width: 10px; height: 18px; cursor: pointer; background: transparent url(../images/arrow-right-orange.gif) no-repeat;}
.jcarousel-skin-tango .jcarousel-prev-horizontal {position: absolute; top: 43px; left: 5px; width: 10px; height: 18px; cursor: pointer; background: transparent url(../images/arrow-left-orange.gif) no-repeat;}

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {position: relative;}
.jcarousel-clip {z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative;}
.jcarousel-list {z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0;}
.jcarousel-item {float: left; list-style: none; /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px; height: 75px; border:1px solid #e5e5e5;}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next,.jcarousel-prev {z-index: 3; display: none;}




.contenthome { margin-top:6px; padding: 40px; width:500px; line-height:1.5em;}
.contenthome h2{color:#3c69bf;line-height:1.5em;}
.spotlightholder {width:361px; float:left; font-size:0.9em; padding-top:10px;}
.spotlight1 {float:left;margin:0 3px;display:inline;}
.spotlight2 {float:left;background:url(../images/bg-spotlight.png) no-repeat 50% 0%;width:345px;padding:6px 3px 0px 3px; margin:6px 5px 0 5px; min-height:50px;height:auto !important;height:50px;display:inline;}
.spotlight2 p {padding:15px; font-weight:bold;font-size:.95em;}
.btn { float:left;width:361px; height:45px; margin:0; padding:0;}
.spotlightimg {float:left; margin:-15px 10px 5px 0; border:none;}

.spotlight2 ul { list-style:none; margin:0;padding:0;}
.spotlight2 ul li{ background:#e0e7f1 url(../images/arrow-blue-bg.png) 0 50% no-repeat;margin-bottom:2px;padding:3px 0 3px 20px; }
.spotlight2 ul li a{color:#3e6bbf;font-size:.95em;}

.spotlight2 h3{ background:url(../images/hdr-spotlight.png) top left no-repeat;position:relative; top:-3px;color:#2356B6;padding:5px 15px;font-size:1.3em; }
.spotlight2 a.more{ color:#2356B6; font-size:.95em; float:right;margin-right:10px; }

p.first {font-weight:bold;}

.homecontent .hero { height:313px;}
.hero{ margin:0; padding:0;height:auto;border-bottom:2px solid #333333; }
.subcontent h2{ margin:0 0 25px 0; padding:8px 40px;background:#f3f3f3;color:#3c69bf; font-size:1.3em;text-transform:uppercase;}

.subcontent .personwrapper{ float:left;margin:0 32px 0 40px;display:inline; }
.subcontent .personwrapper .person{ float:left;margin:0 0 20px 0; }
.subcontent .personwrapper .person .pDetails h3{color:#274B8E;margin:0 0 2px 0;padding:0;}
.subcontent .personwrapper .person .pDetails h4{color:#919191;margin:0;padding:0 0 5px 0;font-size:.8em;border-bottom:1px solid #e8e8e8;font-weight:normal;margin:0 0 10px 0;}
.subcontent .personwrapper .person .pImage{ float:left; background:url(../images/bg-image.png) top left no-repeat;width:116px; height:120px;  }
.subcontent .personwrapper .person .pImage img{ float:left; margin:1px 0 0 2px;  }
.subcontent .personwrapper .person .pDetails{ float:right; width:405px;  }
.subcontent .personwrapper .person a{color:#274b8e;display:block;}
.subcontent .personwrapper .person.last{ border-bottom:none; }

.subcontent .newswrapper{ float:left;margin:0;display:inline; }
.subcontent .newswrapper .news{ float:left;margin:0 30px 20px 40px;padding:0 0 10px 0; display:inline;border-bottom:1px solid #e8e8e8;}
.subcontent .newswrapper .news .pImage{  float:left; background:url(../images/bg-image.png) top left no-repeat;width:116px; height:120px;  }
.subcontent .newswrapper .news .pImage img{ float:left; margin:2px 0 0 3px;  }
.subcontent .newswrapper .news .pDetails{ float:right; width:405px;  }
.subcontent .newswrapper .news h3{color:#274b8e;margin:0;padding:0;}
.subcontent .newswrapper .news a{color:#274b8e;display:block;}

.subcontent .newswrapper .news.featured{ background:url(../images/bg-featured.png) bottom left repeat-x; margin:0 0 20px 0;padding:0 30px 20px 40px;display:inline;border-bottom:none;}
.subcontent .newswrapper .news.last{ border-bottom:none; }

.subcontent .content{ float:left;margin:0 30px 20px 40px;display:inline; }
p.intro{ font-weight:bold; }

.contact { width:529px;background:#f3f3f3 url(../images/bg-form-top.png) top left no-repeat;padding-top:18px;margin:0 0 20px 0;}
.contact label{ display:block;color:#274b8e;font-weight:bold; }
.contact textarea{ width:481px;height:100px; border:1px solid #b8cbed;}
.contact input{ width:216px;border:1px solid #b8cbed; }
.contact table{ width:529px;background:url(../images/bg-form.png) bottom left repeat-x;  }
.contact table tr td{ padding:0 20px 15px 20px; }

.banner{ position:absolute; right:20px; top:20px;font-size:1.1em; }
.banner h3{ font-size:1.5em; text-transform:uppercase; letter-spacing:.3em;border-bottom:1px solid #d0d1d7; padding:0 0 5px 0;margin:0 0 10px 0; color:#3c69bf; }
.banner a{ color:#000;text-decoration:underline; }
a.more{ font-size:.85em;color:#274b8e; }

.mediawrapper{ float:left; font-size:1em;}
.mediawrapper .media{ float:left; width:259px; background:url(../images/box-media-btm.png) bottom left no-repeat;position:relative;padding-bottom:25px;margin-bottom:15px; display:inline;}
.mediawrapper .odd{ margin-right:15px; }
.mediawrapper .media h3{ float:left; width:239px; background:url(../images/box-media-top.png) top left no-repeat;padding:5px 10px; font-size:1em;color:#274b8e;display:inline;}
.mediawrapper .media .thumb{ border:1px solid #3c598f; float:left;margin:10px 0 0 10px; display:inline;}
.mediawrapper .media .content{ float:right;margin:0;padding:10px;width:150px;line-height:1.2em;display:inline;}
.mediawrapper .media .content .type{ font-size:.85em; color:#274b8e;margin-bottom:5px; }
.mediawrapper .media .content a{ position:absolute; bottom:10px;right:10px;color:#fc9906;font-size:.85em; }
.mediawrapper .media .thumb .video {background:url(../images/video-overlay.png) center left no-repeat;}
.mediawrapper .media .thumb .audio {background:url(../images/audio-overlay.png) center left no-repeat;}
.mediawrapper .media .thumb .image {background:url(../images/image-overlay.png) center left no-repeat;}
.mediawrapper .media .thumb .overlay {cursor:pointer;display:block;float:left;height:66px;margin:-66px 0pt 0pt;position:absolute;text-decoration:none;width:74px;}