﻿/*
Name:   tlsHeader.css
Date:   2012-07-11
Desc:   CSS used for the header and footer of The Law Society website
*/

/*
    TABLE OF CONTENTS:
    ==================
	- Generic, Shared and Layout styles
	- Header
	- Footer
		- Error Footer (sticky footer)
	- Error Pages
	- Bespoke Headers
	- Print Styles
	
*/
	

/* Generic, Shared and Layout Styles */
html {
	overflow-y:scroll;
}
body {
	margin:0;
	padding:0;
	font:62.5%/1.3 "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#010101;
	background-color:#fff;
}
img, header, nav, footer {	/*	img: FF 3px space when html5; rest: html5 tags	*/
	display:block;
}
.ftr .big a:hover, .ftr .big a:focus {
	background-position:0 -87px;
}
input.txt:focus, .billDeliv .delOpt textarea:focus {
	border-color:#333 !important;
}
.btnGo {
	width:35px;
	height:25px;
	border:1px solid;
	border-color:#61b41d #64bb1e;
	background:#73d325 url(i/btnMagnif.gif) no-repeat 50% 3px;
	background:url(i/btnMagnif.gif) no-repeat 50% 3px, -webkit-gradient(linear, 0 0, 0 bottom, from(#80e62d), to(#6fcd23)) #73d325;
	background:url(i/btnMagnif.gif) no-repeat 50% 3px, -moz-linear-gradient(#80e62d, #6fcd23) #73d325;
	background:url(i/btnMagnif.gif) no-repeat 50% 3px, -o-linear-gradient(#80e62d, #6fcd23) #73d325;
	background:url(i/btnMagnif.gif) no-repeat 50% 3px, linear-gradient(#80e62d, #6fcd23) #73d325;
	-webkit-border-bottom-right-radius:12px;	/*	shorthand bug in Safari 4	*/
	-webkit-border-top-right-radius:12px;
	-moz-border-radius:0 12px 12px 0;
	border-radius:0 12px 12px 0;
	text-indent:-999em;
	margin:0 11px 0 0;
	cursor:pointer;
	float:left;
}
.btnGo:hover, .btnGo:focus {
	border-color:#4f8f1a;
	background:#569821 url(i/btnMagnif.gif) no-repeat 50% -39px;
	background:url(i/btnMagnif.gif) no-repeat 50% -39px, -webkit-gradient(linear, 0 0, 0 bottom, from(#68b827), to(#518f1f)) #569821;
	background:url(i/btnMagnif.gif) no-repeat 50% -39px, -moz-linear-gradient(#68b827, #518f1f) #569821;
	background:url(i/btnMagnif.gif) no-repeat 50% -39px, -o-linear-gradient(#68b827, #518f1f) #569821;
	background:url(i/btnMagnif.gif) no-repeat 50% -39px, linear-gradient(#68b827, #518f1f) #569821;
}
.posOut {
	position:absolute;
	left:-999em;
}

/*	HEADER
	=============================================== */
.hdr {
	min-width:960px;	/*	bg was cropped when page (not only text) zoomed	*/
	height:20.1em;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	background:#484a48 url(i/hdrBg.jpg) repeat-x 50% 100%;
}
.hdr a, .hdr a:visited, .hdr a:active {
    text-decoration: none;
}
.hdr .cent, .ftr .cent {
	width:960px;
	margin:0 auto;
}
.hdr ul, .hdr ol {
	list-style:none;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
}
.skip:focus {	/*	hidden element appears when focused	*/
	font-size:1.2em;
	color:#fff;
	text-decoration:underline;
	margin-top:10px;
	float:right;
	position:static;
}
.hdr .logo {
	width:147px;
	height:159px;
	color:#ccc;	/*	= outline color	*/
	background:url(i/hdrLogo.png) no-repeat;
	text-indent:-999em;
	overflow:hidden;	/*	crop outline when focused	*/
	margin:34px -145px 0 -2px;
	float:left;
}

.hdr .topNav, .hdr .myLS li, .hdr .login li, .commuLists ul, .topicRes ul, .arrowList, .colFW .midRow ul, .colFW .colLW .col ul, .homeCols ul, .commentList .arrowList, .forumQList .postBy span, h1.btnInl, .latestGazetteJobs .btnGrp li, .labelBr .singDate input, .labelBr .singDate .ui-datepicker-trigger, .payComp .billAddr {
	float:left;
}
.hdr .topNav li {
	height:34px;
	background:url(i/topNavBd.gif) no-repeat 100% 100%;
	float:left;
}
.hdr .topNav a, .hdr .topNav span {
	height:25px;
	font-size:1.2em;
	color:#fefffe;
	padding:9px 13px 0 14px;
	margin:0 1px 0 0;
	float:left;
}
.hdr .topNav .sel, .hdr .topNav .sel:hover, .hdr .topNav span {
	height:31px;
	margin-bottom:-6px;
	background:url(i/topNavSelBg_2.png) repeat-x top;
}
.hdr .topNav a:hover, .hdr .topNav a:focus {
	color:#baff58;
	background-color:#2b2c2b;
}
.hdr .topNav a.sel:hover, .hdr .topNav a.sel:focus,
.hdr .topNav li:first-child a:hover, .hdr .topNav li:first-child a:focus {
	background-color:transparent;
}
.hdr .mid {
	width:800px;
	height:130px;
	float:right;
}
.hdr .myLS {
	margin:10px 0 0;
	float:left;
}
.hdr .myLS ul {
	border:1px solid #090909;
	-webkit-border-radius:13px;
	-moz-border-radius:13px;
	border-radius:13px;
	float:left;
}
.hdr .myLS span {
	font-size:1.3em;
	font-weight:bold;
	color:#fefffe;
	text-shadow:0 -1px 1px #000;
	background-color:#207720;	/*	fallback for gradient-incompatible browsers	*/
	background:-webkit-gradient(linear, 0 0, 0 bottom, from(#278827), to(#196519)) #207720;	/*	plain color set when images are off	*/
	background:-moz-linear-gradient(#278827, #196519) #207720;
	background:-o-linear-gradient(#278827, #196519) #207720;
	background:linear-gradient(#278827, #196519) #207720;
	border:1px solid;
	border-color:#439843 #1b491b #134013 #4d924d;
	-webkit-border-bottom-left-radius:12px;	/*	shorthand bug in Safari 4	*/
	-webkit-border-top-left-radius:12px;
	-moz-border-radius:12px 0 0 12px;
	border-radius:12px 0 0 12px;
	padding:3px 15px;
	float:left;
}
.hdr .myLS .sec a, .hdr .myLS .sec span {
	-webkit-border-bottom-right-radius:12px;	/*	shorthand bug in Safari 4	*/
	-webkit-border-top-right-radius:12px;
	-webkit-border-bottom-left-radius:0;
	-webkit-border-top-left-radius:0;
	-moz-border-radius:0 12px 12px 0;
	border-radius:0 12px 12px 0;
}
.hdr .myLS li span
{
   -webkit-border-radius:12px;
    -moz-border-radius:12px;
    border-radius:12px;
}


.hdr .login {
	height:29px;
	padding:27px 12px 0 0;
	font-size:1.1em;
	color:#fff;
	text-align:right;
}
.hdr .login strong {
	font-size:1.091em;
	margin:0 7px;
}
.hdr .login a {
	font-size:1.091em;
	color:#68d121;
}
.hdr .login a:hover, .hdr .sm a:hover, .hdr .sm .sel:hover, .hdr .login a:focus, .hdr .sm a:focus, .hdr .sm .sel:focus {
	text-decoration:underline;
}
.hdr .login ul, .hdr .dd .top, .commentBbl, .premBox .btnGreen, .pageNav, .fasSeek .selector {
	float:right;
}
.hdr .login li:first-child {
	padding-right:10px;
	margin-right:10px;
	border-right:1px dotted #8e8e8e;
}

.hdrSeek {
	float:right;
}
.hdr .dd .txt, .seekBox .innerSB .txt, .bareSeek .innerBS .txt, .search .txt {
	width:182px;
	height:25px;
	padding:0 10px;
	font-size:1.3em;
	color:#555;
	border-width:1px 1px 1px 0;
	border-style:solid;
	border-color:#d1d1d1 #80b058 #d1d1d1 #fff;
	-webkit-border-bottom-left-radius:12px;	/*	shorthand bug in Safari 4	*/
	-webkit-border-top-left-radius:12px;
	-moz-border-radius:12px 0 0 12px;
	border-radius:12px 0 0 12px;
	float:left;
}
.mainNav .top .txt {
    width:229px !important;   
}
.mainNav .top 
{
    display:inline-block;
    background:#484a48;
    height: 43px;
    margin-top: -2px;
    padding: 13px 0 0 27px;
    width: 303px;
    z-index:100;
}
.hdr .mainNav {
	border-left:1px dotted #4c4d4c;
	margin:0 0 0 162px;
	position:relative;
	float:left;
}
.hdr .mainNav li {
	border-right:1px dotted #4c4d4c;
	float:left;
}
.hdr .mainNav a, .hdr .mainNav span {
	height:29px;
	font-size:1.3em;
	font-weight:bold;
	color:#fff;
	text-shadow:1px 1px 3px #000;
	padding:8px 10px 0 12px;
	float:left;
}
.hdr .mainNav a:hover, .hdr .mainNav a:focus, .hdr .mainNav .sel, .hdr .mainNav span, .barousel_content div a {
	color:#81ed29;
}
.hdr .sm a {
	-webkit-font-smoothing:antialiased;
	background:url(i/mainNavSmArrow.gif) no-repeat 100% 25px;
}
.hdr .sm a:hover, .hdr .sm a:focus, .hdr .mainNav .sel, .hdr .mainNav span {
	background:url(i/mainNavOverBg.png) no-repeat 50% 0;
	text-shadow:none;
}
.hdr .sm a:hover/*, .hdr .sm a:focus*/ {	/*	uncomment if tabbing in dropdowns solved	*/
	padding-bottom:12px;
	margin-bottom:-12px;
	position:relative;
	z-index:100;
}
.hdr .sm:hover > a {
	color:#81ed29;
	background:url(i/mainNavOverBg.png) no-repeat 50% 0;
	text-shadow:none;
	padding-bottom:12px;
	margin-bottom:-12px;
	position:relative;
	z-index:100;
}
.hdr .sm .sel {
	background-position:100% 0;
}

.hdr .dd {
	width:936px;
	padding:0px 0px 44px 24px;
	background:#daddd7 url(i/megaDropdownBg.gif);
	background:url(i/megaDropdownBg.gif), -webkit-gradient(linear, 0 0, 0 bottom, from(#ced1cc), to(#e8eae5)) #daddd7;
	background:url(i/megaDropdownBg.gif), -moz-linear-gradient(#ced1cc, #e8eae5) #daddd7;
	background:url(i/megaDropdownBg.gif), -o-linear-gradient(#ced1cc, #e8eae5) #daddd7;
	background:url(i/megaDropdownBg.gif), linear-gradient(#ced1cc, #e8eae5) #daddd7;
	border-top:2px solid #a2a5a1;
	border-bottom:1px solid #aaaba8;
	-webkit-box-shadow:#666 0 8px 20px;
	-moz-box-shadow:#666 0 8px 20px;
	box-shadow:#666 0 8px 20px;
	position:absolute;
	left:-163px;
	top:3.7em;
	z-index:50;
	display:none;
}
.hdr .dd .txt {
	font-size:1.3em;
	border:solid #b2b4b1;
	border-width:1px 0 1px 1px;
}
.hdr .dd .cols {
	width:926px;
	margin-top:0px;
	overflow:hidden;	/*	pseudo equal height columns	*/
	float:left;
	margin-top:-12px;
	z-index:0;
}
.hdr .dd .cols .col1
{
    
}
.hdr .dd .cols div {
	width:258px;
	padding:17px 22px 200px;
	margin-bottom:-213px;	/*	pseudo equal height columns	*/
	float:left;
	margin-top:12px;
	border-left:2px dotted #99a898;
}
.hdr .dd .col1 {
	border-right:2px dotted #99a898;
	position:relative; top:-12px;
	border-left:0px !important;
	padding-top:0px !important;
}
.hdr .dd .col2 {
	position:relative; top:-12px;
	border-left:0px !important;
	padding-top:0px !important;
}
.hdr .dd li {
	width:100%;
	padding-bottom:12px;
	border-right:0;
}
.hdr .dd li:last-child 
{
    padding-bottom:25px;
}
.hdr .dd a {
	height:auto;
	font-size:1.5em;
	font-weight:bold;
	color:#396b0f;
	text-shadow:none;
	background:url(i/lstIcoArrow.gif) no-repeat 0 7px;
	padding:0 0 0 12px;
}
.hdr .dd a:hover, .hdr .dd a:focus {
	color:#000;
	text-decoration:none;
	padding-bottom:0;
	margin:0;
}
.hdr .dd div a:hover, .hdr .dd div a:focus {
	background:url(i/lstIcoArrow.gif) no-repeat 0 -86px;
}
.hdr .dd .small li {
	padding:5px 0 0;
}
.hdr .dd .small a {
	font-size:1.2em;
	font-weight:bold;
	background:url(i/lstIcoArrow.gif) no-repeat 0 4px;
}
.hdr .dd .small a:hover, .colLN .bookm .saved:hover, .ftr a:hover, .hdr .dd .small a:focus, .colLN .bookm .saved:focus, .ftr a:focus {
	background-position:0 -89px;
}
.hdr .horizList {
	padding-top:19px;
	margin-top:34px;
	border-top:1px solid #adafab;
	float:left;
}
.hdr .horizList li {
	width:274px;
	padding:0 14px;
	float:left;
}
.hdr .horizList a {
	height:78px;
	font-size:1.5em;
	font-weight:bold;
	padding:4px 0 0 96px;
}
.hdr .horizList .icon1, .hdr .horizList .icon1:hover, .hdr .horizList .icon1:focus {
	background:url(i/megaDDIcon1.jpg) no-repeat;
}
.hdr .horizList .icon2, .hdr .horizList .icon2:hover, .hdr .horizList .icon2:focus {
	background:url(i/megaDDIcon2.jpg) no-repeat;
}
.hdr .horizList .icon3, .hdr .horizList .icon3:hover, .hdr .horizList .icon3:focus {
	background:url(i/megaDDIcon3.jpg) no-repeat;
}
.hdrSeek label {
	position:absolute;
	left:-999em;
}


/*	FOOTER
	=============================================== */
.ftr {
	min-width:960px;
	height:29.9em;
	padding-top:30px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight:bold;
	background:#ededed url(i/ftrBg.jpg) no-repeat 100% 0;
}
.altFtr {
	height: auto;
	padding-bottom: 5px;
}
.altFtr .cent {
	width: auto;
	display: table;
}
.ftr .cent div {
	width:190px;
	margin:0 20px 0 10px;
	float:left;
}
.ftr .cent .col1 {
	width:160px;
}
.ftr .cent .col2 {
	width:160px;
}
.ftr .cent .col3 {
	width:140px;
}
.ftr .cent .col4 {
	width:180px;
}
.ftr .cent .col5 {
	width:140px;
}
.ftr h2 {
	font-size:1.4em !important;
	font-weight:bold;
	padding:0 8px 5px 0;
	border-bottom:3px dotted #d3d3d2;
	margin:0 0 14px;
	/*float:left;*/
}
.ftr ul {
	clear:both;
	overflow:hidden;
}
.ftr ul, .ftr ol {
	list-style:none;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
}
.ftr li {
	width:100%;
	padding-bottom:5px;
	float:left;
}
.ftr li a, .ftr li a:visited, .ftr li a:active {
    color: #396B0F;
    text-decoration: none;
}
.altFtr ul {
	margin: 0 auto;
	width: auto;
	max-width: 960px;
	display: inline;
}
.altFtr li {
	width: auto;
	margin: 0 20px;
}
.ftr a {
	font-size:1.2em;
	background:url(i/lstIcoArrow.gif) no-repeat 0 4px;
	padding-left:10px;
	float:left;
}
.ftr .big a {
	font-size:1.4em;
	background-position:0 6px;
	margin:0 0 7px;
}
.ftr .soc {
	padding:12px 0 0 10px;
}
.ftr .soc li {
	width:auto;
	margin-right:8px;
}
.ftr .soc a, .ftr .soc a:hover {
	width:32px;
	height:32px;
	padding:0;
	background:url(i/iconsFtr.png) no-repeat;
	text-indent:-999em;
	overflow:hidden;	/*	crop outline when focused	*/
}
.ftr .soc a:focus {
	outline:1px solid #396b0f;
}
.ftr .soc .tw, .ftr .soc .tw:hover {
	background-position:-40px 0;
}

.ftr p {
	font-size:1.1em;
	color:#1e1e1e;
	text-align:center;
	padding-top:26px;
	clear:both;
}


/* Error Footer (sticky footer)*/
html, body, form.errorPageForm {
	height: 100% !important;
}
#wrap {
	min-height: 100%;
	clear: both;
}
#wrap .cont
{
	overflow: auto;
	padding-bottom: 4em;
}
.errorFtr {
	min-width:960px;
	height:4em;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight:bold;
	background:transparent url(i/error_footer_bg.png) repeat 0 0;
	position: relative;
	margin-top: -4em;
	clear: both;
}
.errorFtrBody {
	background:transparent url(i/error_footer_top.png) repeat-x 0 0;	
	padding-top:25px;
	position: relative;
	top: -20px;
}
.errorFtr small {
	text-align: center;
	display: block;
	font-size: 1em;
	color: #1e1e1e;
}


/*	ERROR PAGES 
	==================================================== */
#wrap .hdr {
	background: #484848 url(i/error_header_bg.gif) repeat 0 0;
	height: 170px;	
}
#wrap .hdr .logo {
	margin: 0 -145px 0 -2px;
}
.errorHeader {
	padding-top: 100px;
}
.errorHeader a, .errorHeader img {
	display: block;
	width: 111px;
	margin: 0 auto;
}
.errorHeader a img, .errorPage {
	text-align: center;
	margin: 0 auto;
}


/*	BESPOKE HEADERS 
	==================================================== */
.hdrAlt1 {
	background:#484a48 url(i/hdrBgAlt1.jpg) repeat-x 50% 100%;
}
.hdrAlt2 {
	background:#484a48 url(i/hdrBgAlt2.jpg) repeat-x 50% 100%;
}
.hdrAlt3 {
	background:#484a48 url(i/hdrBgAlt3.jpg) repeat-x 50% 100%;
}
#logo {
	margin-left: 10px;
}
	#logo p {
		margin: 0;
	}
	.hdrAlt1 .bespokeTop {
		font-size: 3.75em;
		font-weight: bold;
		color: #ffffff;
		letter-spacing: 0.075em;
		padding-bottom: 0px;
		border-bottom:  1px solid #ffffff;
		float: left;
		clear: both;
		position: relative;
		top: 20px;
	}
	.hdrAlt1 .bespokeBottom {
		font-size: 2.62em;
		font-weight: bold;
		color: #ffffff;
		clear: both;
		padding-top: 2px;
		letter-spacing: 0.05em;
		position: relative;
		top: 20px;
	}
	.hdrAlt2 #logo p {
		float: left;
		font-weight: bold;
		font-size: 5em;
		font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
		margin-top: 40px;
	}
	.hdrAlt2 .mid .hdrSeek {
		background-color: #c1c1c1;
		border: 1px solid #8b8b8b;
	}
	.hdrAlt2 .login {
		color: #000000;
	}
		.hdrAlt2 .login a {
			color: #286400;
		}
	.hdrAlt3 #logo {
		margin-top: 0px;
	}
		.hdrAlt3 .bespokeTop {
			font-size: 6.5em;
			color: #ffffff;
			letter-spacing: 0.075em;
			padding-bottom: 0px;
			float: left;
			background: transparent url(i/cpd_logo.png) no-repeat 0 0;
			width: 125px;
			height: 45px;
			overflow: hidden;
			text-indent: -9999em;
			position: relative;
			top: 45px;
			left: -2px;
		}
		.hdrAlt3 .bespokeBottom {
			font-size: 2.6em;
			color: #ffffff;
			float: left;
			letter-spacing: 0.05em;
			border-left: 1px solid #ffffff;
			line-height: 1;
			padding-left: 5px;
			margin-left: 2px !important;
			position: relative;
			top: 54px;
		}




/*	PRINT STYLES 
	==================================================== */
@media print
{
	.hdr, .ftr {
		display:none !important;
	}
}



/* 2015-07-23 MH Updates */
.hdr .myLS a {
	height: 24px;
	background: url(i/cham-link.png) 100% -111px no-repeat;
	padding: 5px 13px 0px 8px;
	display: block;
	color: white !important;
	font-size: 14px;
	float: left;
	margin: 0 20px 0 0;
	border: 0;
	min-width: 75px;
	text-align: left;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	width:101px;
}
.hdr .myLS a:hover {
	text-decoration:underline;
}
.hdrSeek input[type=text] {
  	border: 1px solid #a9aca7;
	color: #a9aca7;
	height: 25px;
	width: 200px;
	padding: 0 6px 0 6px;
	float: left;
	border-radius:0 !important;
	font-size: 1.3em;
}
.hdrSeek .btnGo {
	background: url(i/mag-white-green.jpg) no-repeat;
	width: 35px;
	height: 27px;
	cursor: pointer;
	border: none;
	text-indent: -9999px;
	float: left;
	margin: 0 0 0 3px;
	border-radius:0 !important;
	-moz-border-radius:0 !important;
	-webkit-border-radius:0 !important;
}