/* Mixins */
/**region**/
.button {
  border: none;
  cursor: pointer;
  overflow: hidden;
  vertical-align: top;
}
.submit {
  margin-left: 122px;
}
/**endregion**/
/* HTML Elements */
/**region**/
a {
  color: #fff;
}
body {
  background: #e5ecf4 url(images/SXsky.jpg) no-repeat center top;
  color: #fff;
  font-family: arial, helvetica, sans-serif;
  font-size: 9pt;
  margin: 0;
  padding: 0;
}
#container {
  min-height: 1100px;
  _height: 1100px;
  background: url(images/SXgrass.png) no-repeat center bottom;
  padding: 0 0 20px;
}
form {
  margin: 0;
}
img {
  border: none;
}
/**endregion**/
/* Date Picker */
/**region**/
table.jCalendar {
  border: none;
  background: #9f4601;
  border-collapse: separate;
  border-spacing: 2px;
}
table.jCalendar th {
  background: #333;
  color: #fff;
  font-weight: bold;
  padding: 3px 5px;
}
table.jCalendar td {
  background: #ccc;
  color: #000;
  padding: 3px 5px;
  text-align: center;
}
table.jCalendar td.other-month {
  background: #ddd;
  color: #aaa;
}
table.jCalendar td.today {
  background: #666;
  color: #fff;
}
table.jCalendar td.selected {
  background: #f66;
  color: #fff;
}
table.jCalendar td.selected.dp-hover {
  background: #f33;
  color: #fff;
}
table.jCalendar td.dp-hover, table.jCalendar tr.activeWeekHover td {
  background: #fff;
  color: #000;
}
table.jCalendar tr.selectedWeek td {
  background: #f66;
  color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
  background: #bbb;
  color: #888;
}
table.jCalendar td.unselectable, table.jCalendar td.unselectable:hover, table.jCalendar td.unselectable.dp-hover {
  background: #bbb;
  color: #888;
}
a.dp-choose-date {
  background: url(images/sprite.gif) no-repeat -303px -34px;
  display: block;
  float: left;
  height: 0;
  margin: 0 26px 0 0;
  overflow: hidden;
  padding: 19px 0 0;
  width: 21px;
}
div.dob a.dp-choose-date {
  background: url(images/sprite.gif) no-repeat -303px -34px;
  display: inline-block;
  float: none;
  height: 0;
  margin: 0 0 -4px 4px;
  overflow: hidden;
  padding: 19px 0 0;
  width: 21px;
}
div.dp-popup {
  position: relative;
  background: #f86c00;
  border: solid 2px #fff;
  font-size: 10px;
  font-family: arial, sans-serif;
  padding: 2px;
  width: 171px;
  line-height: 1.2em;
}
div#dp-popup {
  position: absolute;
  z-index: 199;
}
div.dp-popup h2 {
  font-size: 12px;
  text-align: center;
  margin: 2px 0;
  padding: 0;
}
a#dp-close {
  font-size: 11px;
  padding: 4px 0;
  text-align: center;
  display: block;
}
a#dp-close:hover {
  text-decoration: underline;
}
div.dp-popup a {
  color: #000;
  text-decoration: none;
  padding: 3px 2px 0;
}
div.dp-popup div.dp-nav-prev {
  position: absolute;
  top: 2px;
  left: 4px;
  width: 100px;
}
div.dp-popup div.dp-nav-prev a {
  float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
  cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
  cursor: default;
}
div.dp-popup div.dp-nav-next {
  position: absolute;
  top: 2px;
  right: 4px;
  width: 100px;
}
div.dp-popup div.dp-nav-next a {
  float: right;
}
div.dp-popup a.disabled {
  cursor: default;
  color: #aaa;
}
div.dp-popup td {
  cursor: pointer;
}
div.dp-popup td.disabled {
  cursor: default;
}
/**endregion**/
/* Structure */
/**region**/
#wrapper {
  margin: 0 auto;
  position: relative;
  width: 855px;
}
/**endregion**/
/* Header */
/**region**/
#header {
  height: 115px;
  position: relative;
  width: 855px;
}
#header h1 {
  background: url(images/sprite.png) no-repeat 0 -80px;
  height: 0;
  left: 5px;
  margin: 0;
  overflow: hidden;
  padding: 94px 0 0;
  position: absolute;
  top: 10px;
  width: 146px;
}
#header p {
  background: url(images/passionate.gif) no-repeat;
  height: 0;
  overflow: hidden;
  padding: 66px 0 0;
  position: absolute;
  right: 0px;
  top: 10px;
  width: 456px;
}
#header #logo2 {
  background: url('images/sprite.png') no-repeat -710px -80px;
  height: 0;
  overflow: hidden;
  padding: 90px 0 0;
  position: absolute;
  left: 155px;
  top: 10px;
  width: 115px;
}
#header .logon-box {
  left: 795px;
  position: absolute;
  top: 95px;
}
#header #advert {
  position: absolute;
  top: 10px;
  right: 0;
}
#header #advert h2 {
  background: url(images/banners/webbanner-parties.png) no-repeat 0 0;
  height: 0;
  margin: 0;
  overflow: hidden;
  padding: 80px 0 0;
  width: 550px;
}
/**endregion**/
/* Navigation */
/**region**/
#navigation {
  position: relative;
  z-index: 1000;
}
#navigation ul {
  height: 40px;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 855px;
}
#navigation li {
  float: left;
  position: relative;
  z-index: 1000;
}
#navigation a {
  background: url(images/sprite_nav.png) no-repeat;
  display: block;
  height: 0;
  padding: 40px 0 0;
  overflow: hidden;
}
#navigation li.home a {
  width: 72px;
}
/*#navigation li.what-we-do a {
				background-position: -72px 0;
				width: 121px;
			}*/
#navigation li.xperience-courses a {
  background-position: -72px 0;
  width: 152px;
}
/*
				#navigation li:hover ul {
					display: block;
				}
				
					#navigation li ul a {
						background: none;
						padding: 39px 0 0;
						position: absolute;
						top: 0;
					}
					
					#navigation li li.inspiration a {
						left: 0;
						width: 93px;
					}
					
					#navigation li li.schoolsfaq a {
						left: 94px;
						width: 55px;
					}
				*/
#navigation li.parents a {
  background-position: -224px 0;
  width: 73px;
}
#navigation li.schools a {
  background-position: -297px 0;
  width: 72px;
}
#navigation li.xperience-courses ul {
  background: url(images/sprite_nav.png) no-repeat;
  background-position: 0 -184px;
  display: none;
  height: 46px;
  left: -1px;
  position: absolute;
  top: 36px;
  width: 390px;
  z-index: 10;
}
#navigation li.parents ul, #navigation li.schools ul {
  background: url(images/sprite_nav.png) no-repeat;
  background-position: 0 -84px;
  display: none;
  height: 46px;
  left: -1px;
  position: absolute;
  top: 36px;
  width: 155px;
  z-index: 10;
}
#navigation li:hover ul {
  display: block;
}
#navigation li ul a {
  background: none;
  padding: 39px 0 0;
  position: absolute;
  top: 0;
}
#navigation li li.xperiencespyschool a {
  left: 0;
  width: 91px;
}
#navigation li li.xperiencesport a {
  left: 92px;
  width: 50px;
}
#navigation li li.xperiencedance a {
  left: 143px;
  width: 56px;
}
#navigation li li.xperienceadventure a {
  left: 200px;
  width: 85px;
}
#navigation li li.xperiencemartialarts a {
  left: 286px;
  width: 98px;
}
#navigation li li.parentsinspiration a, #navigation li li.inspiration a {
  left: 0;
  width: 93px;
}
#navigation li li.parentsfaq a, #navigation li li.schoolsfaq a {
  left: 94px;
  width: 55px;
}
#navigation li.coaches a {
  background-position: -369px 0;
  width: 79px;
}
/*#navigation li.events a {
				background-position: -428px 0;
				width: 68px;
			}*/
#navigation li.parties a {
  background-position: -448px 0;
  width: 67px;
}
#navigation li.news a {
  background-position: -515px 0;
  width: 56px;
}
#navigation li.about-us a {
  background-position: -571px 0;
  width: 79px;
}
#navigation li.franchising a {
  background-position: -650px 0;
  width: 99px;
}
#navigation li.contact-us a {
  background-position: -749px 0;
  width: 106px;
}
/*****************/
/* Over & Active */
#navigation li a:hover, #navigation li a.active {
  margin: 0 0 0 -1px;
}
#navigation li.home a:hover, #navigation li.home a.active {
  background-position: 0 -40px;
  margin: 0;
}
/*#navigation li.what-we-do a:hover, #navigation li.what-we-do a.active {
				background-position: -72px -40px;
				width: 122px;
			}*/
#navigation li.xperience-courses a:hover, #navigation li.xperience-courses a.active {
  background-position: -71px -40px;
  width: 153px;
}
#navigation li.parents a:hover, #navigation li.parents a.active {
  background-position: -223px -40px;
  width: 74px;
}
#navigation li.schools a:hover, #navigation li.schools a.active {
  background-position: -298px -40px;
  width: 73px;
}
#navigation li.coaches a:hover, #navigation li.coaches a.active {
  background-position: -368px -40px;
  width: 80px;
}
/*#navigation li.events a:hover, #navigation li.events a.active {
				background-position: -428px -40px;
				width: 69px;
			}*/
#navigation li.parties a:hover, #navigation li.parties a.active {
  background-position: -447px -40px;
  width: 68px;
}
#navigation li.news a:hover, #navigation li.news a.active {
  background-position: -514px -40px;
  width: 57px;
}
#navigation li.about-us a:hover, #navigation li.about-us a.active {
  background-position: -570px -40px;
  width: 80px;
}
#navigation li.franchising a:hover, #navigation li.franchising a.active {
  background-position: -649px -40px;
  width: 100px;
}
#navigation li.contact-us a:hover, #navigation li.contact-us a.active {
  background-position: -748px -40px;
  width: 106px;
}
#navigation li.xperience-courses li a:hover, #navigation li.xperience-courses li a.active {
  background-position: 0 -234px;
}
.follow-us {
  background: url(images/follow-us.png) no-repeat;
  float: left;
  height: 114px;
  width: 281px;
  /*
	.linked-in a {
		.link-replace(url(images/linked-in.png), 36px, 36px);
	}
	*/

}
.follow-us ul {
  list-style: none;
  margin: 50px 0 0;
  padding: 0 0 0 20px;
}
.follow-us li {
  float: left;
  margin: 0 10px 0 0;
}
.follow-us .facebook a {
  background: url(images/facebook-icon.jpg) no-repeat;
  display: inline-block;
  height: 0;
  overflow: hidden;
  padding: 47px 0 0;
  vertical-align: middle;
  width: 122px;
}
.follow-us .twitter a {
  background: url(images/twitter-icon.jpg) no-repeat;
  display: inline-block;
  height: 0;
  overflow: hidden;
  padding: 47px 0 0;
  vertical-align: middle;
  width: 48px;
}
.follow-us .youtube a {
  background: url(images/youtube-icon.png) no-repeat;
  display: inline-block;
  height: 0;
  overflow: hidden;
  padding: 47px 0 0;
  vertical-align: middle;
  width: 48px;
}
/**endregion**/
/* Main */
/**region**/
#main {
  position: relative;
}
#side-bar {
  margin: 0 23px 0 0;
  position: absolute;
  width: 279px;
  z-index: 10;
}
#side-bar h2 {
  background: url(images/sprite.png) no-repeat;
  height: 0;
  margin: 0;
  overflow: hidden;
}
#content {
  position: relative;
  top: 19px;
  min-height: 480px;
  /*margin-left: 320px;*/

}
#content .content-module {
  margin: 0 0 0 302px;
  padding: 0 0 14px;
  width: 556px;
}
#content .news-module {
  width: 387px;
}
/**endregion**/
/* Book a Course */
/**region**/
#side-bar .book-a-course {
  background: url(images/book-a-course-bottom.png) no-repeat 0 bottom;
  margin: 15px 0 0;
  padding: 0 0 15px;
  position: relative;
  width: 279px;
}
#side-bar .book-a-course h2 {
  background-position: -149px -80px;
  padding: 33px 0 0;
}
#side-bar .book-a-course .confirm-checkout {
  background: url(images/booking-basket.png) no-repeat 0 top;
  height: 52px;
  margin: 5px 0 15px;
  padding: 15px 0 0 60px;
  position: relative;
}
#side-bar .book-a-course .confirm-checkout a {
  color: #f86c00;
  text-decoration: underline;
}
#side-bar .book-a-course .confirm-checkout a.checkout {
  background-repeat: no-repeat;
  text-indent: -8000px;
  text-decoration: none;
  font-size: 0.05em;
  line-height: .05em;
  width: 189px;
  height: 24px;
  margin: 0;
  padding: 0;
  display: block;
  position: absolute;
  right: 27px;
  bottom: 0;
  background: url(images/buttons/confirm-checkout.png) no-repeat 0 top;
}
#side-bar .book-a-course .outer {
  background: url(images/book-a-course-top.png) no-repeat;
  padding: 18px 0 0;
}
#side-bar .book-a-course .container {
  background: url(images/book-a-course-back.gif) repeat-y;
  margin: -10px 0 0;
  padding: 0 15px 10px;
}
#side-bar .book-a-course h3 {
  background: url(images/sprite.gif) no-repeat 0 -18px;
  height: 0;
  overflow: hidden;
  margin: 18px 0 0;
  padding: 12px 0 0;
  width: 83px;
}
#side-bar .book-a-course hr {
  background: #ca5a02;
  border: none;
  height: 1px;
  margin: 10px auto 0;
}
#side-bar .book-a-course label {
  display: block;
  margin: 10px 0 7px;
}
#side-bar .book-a-course .categories {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
}
#side-bar .book-a-course li {
  margin: 8px 0 0;
}
.book-a-course .categories .expand {
  background: url(images/sprite.gif) no-repeat -326px -34px;
  display: block;
  float: left;
  height: 0;
  overflow: hidden;
  padding: 12px 0 0;
  width: 7px;
}
.book-a-course .categories .collapse {
  background-position: -333px -34px;
}
#side-bar .book-a-course .ages strong, #side-bar .book-a-course .course-types strong {
  background: url(images/sprite.gif);
  display: block;
  height: 0;
  overflow: hidden;
}
#side-bar .book-a-course .ages strong {
  background-position: -63px 0;
  padding: 12px 0 0;
  width: 31px;
}
#side-bar .book-a-course .course-types strong {
  background-position: -94px 0;
  padding: 11px 0 0;
  width: 89px;
}
#side-bar .book-a-course .options {
  list-style: none;
  margin: 0;
  padding: 0;
}
#side-bar .book-a-course .options li {
  margin: 4px 0 0;
}
#side-bar .book-a-course .options label {
  display: inline;
  margin: 0 0 0 4px;
}
#side-bar .book-a-course .find-advanced {
  bottom: -9px;
  background: url(images/sprite.png) -428px -81px;
  height: 25px;
  padding: 25px 0 0;
  position: absolute;
  right: 25px;
  width: 67px;
}
#side-bar .book-a-course .find-reference {
  background: url(images/sprite.gif) 0 0;
  height: 18px;
  padding: 18px 0 0;
  margin: 0 0 0 5px;
  width: 56px;
}
#side-bar .book-a-course .text {
  background: #9f4601;
  border: solid 1px #fff;
  color: #fff;
  font-size: 8pt;
  font-style: italic;
  padding: 2px;
}
#side-bar .book-a-course .dateITA {
  float: left;
  margin: 0 3px;
  width: 63px;
}
#side-bar .book-a-course .date-wrapper {
  height: 19px;
}
#side-bar .book-a-course .place {
  width: 150px;
}
#side-bar .book-a-course .reference {
  width: 165px;
}
#side-bar .book-a-course .course {
  width: 235px;
}
/**endregion**/
/* Main Panel */
/**region**/
#content .imagePanel {
  background: url(images/mainPanel/lg1.jpg) no-repeat 0 top;
  height: 237px;
  width: 556px;
}
#content .imagePanel .tape {
  background: url(images/tape/big-tape.png) no-repeat;
  height: 261px;
  left: -15px;
  position: absolute;
  top: -13px;
  width: 586px;
}
#content .imagePanel ul {
  left: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 163px;
}
#content .imagePanel li {
  float: left;
  margin: 0 10px 0 0;
}
#content .imagePanel li img {
  cursor: pointer;
}
/**endregion**/
/* Results*/
/**region**/
#content .results, #content .inner {
  background: url(images/results-bottom.png) no-repeat 0 bottom;
  color: #333536;
  min-height: 394px;
}
#content .results input[type="submit"], #content .inner input[type="submit"] {
  font-size: 0.95em;
}
#content .news-module {
  background: url(images/news-bottom.png) no-repeat 0 bottom;
  color: #333536;
}
#content .containertop {
  background: url(images/sprite.png) -149px -131px;
  height: 12px;
  width: 556px;
}
#content .news-module .containertop {
  background: url(images/sprite.png) no-repeat 0 -1307px;
  width: 387px;
}
#content .results h2, #content .inner h2 {
  margin: 0 0 15px;
  padding: 0;
  color: #333536;
  font-size: 30px;
}
/*
	#content .results h2, #content .inner h2 {
		background: url(images/sprite.png) -149px -131px;
		height: 0;
		margin: 0;
		overflow: hidden;
		padding: 39px 0 0;
		width: 556px;
	}
	
		#content .hello h2 {
			background: url(images/sprite.png) no-repeat 0 -271px;
			padding: 39px 0 0;
		}
		
		#content .aboutus h2 {
			background: url(images/sprite.png) no-repeat 0 -1403px;
			padding: 47px 0 0;
		}
		
		#content .inspiration h2 {
			background: url(images/sprite.png) no-repeat 0 -1451px;
			padding: 47px 0 0;
		}
		
		#content .parentsinspiration h2 {
			background: url(images/sprite.png) no-repeat 0 -1596px;
			padding: 47px 0 0;
		}

		#content .schoolsfaq h2 {
			background: url(images/sprite.png) no-repeat 0 -1499px;
			padding: 47px 0 0;
		}
		
		#content .parentsfaq h2 {
			background: url(images/sprite.png) no-repeat 0 -1547px;
			padding: 47px 0 0;
		}

		#content .whatweoffer h2 {
			background: url(images/sprite.png) no-repeat 0 -231px;
			padding: 39px 0 0;
		}
	
		#content .whatsnew h2 {
			background: url(images/sprite.png) no-repeat 0 -311px;
		}
		
		#content .news-module h2 {
			background: url(images/sprite.png) no-repeat 0 -1307px;
			padding: 47px 0 0;
			width: 387px;
		}
	
		#content .parents h2 {
			background: url(images/sprite.png) no-repeat 0 -351px;
			padding: 44px 0 0;
		}
	
		#content .teachers h2 {
			background: url(images/sprite.png) no-repeat 0 -396px;
			padding: 47px 0 0;
		}
	
		#content .coaches h2 {
			background: url(images/sprite.png) no-repeat 0 -444px;
			padding: 46px 0 0;
		}
	
		#content .events h2 {
			background: url(images/sprite.png) no-repeat 0 -491px;
			padding: 47px 0 0;
		}
	
		#content .contactus h2 {
			background: url(images/sprite.png) no-repeat 0 -539px;
			padding: 47px 0 0;
		}
	
		#content .franchising h2 {
			background: url(images/sprite.png) no-repeat 0 -1355px;
			padding: 47px 0 0;
		}

		#content .logon h2 {
			background: url(images/sprite.png) no-repeat 0 -635px;
			padding: 47px 0 0;
		}
	
		#content .registration h2 {
			background: url(images/sprite.png) no-repeat 0 -683px;
			padding: 46px 0 0;
		}
		
		#content .privacy h2 {
			background: url(images/sprite.png) no-repeat 0 -731px;
			padding: 46px 0 0;
		}
		
		#content .terms h2 {
			background: url(images/sprite.png) no-repeat 0 -779px;
			padding: 46px 0 0;
		}
		
		#content .accessibility h2 {
			background: url(images/sprite.png) no-repeat 0 -827px;
			padding: 46px 0 0;
		}
		
		#content .sitemap h2 {
			background: url(images/sprite.png) no-repeat 0 -875px;
			padding: 46px 0 0;
		}
		
		#content .booking h2 {
			background: url(images/sprite.png) no-repeat 0 -923px;
			padding: 47px 0 0;
		}
		
		#content .schedule-detail h2 {
			background: url(images/sprite.png) no-repeat 0 -971px;
			padding: 46px 0 0;
		}
		
		#content .contact h2 {
			background: url(images/sprite.png) no-repeat 0 -1019px;
			padding: 47px 0 0;
		}
		
		#content .checkout h2 {
			background: url(images/sprite.png) no-repeat 0 -1067px;
			padding: 47px 0 0;
		}
		
		#content .bookingcomplete h2 {
			background: url(images/sprite.png) no-repeat 0 -1115px;
			padding: 46px 0 0;
		}
		
		#content .mydetails h2 {
			background: url(images/sprite.png) no-repeat 0 -1163px;
			padding: 47px 0 0;
		}
		
		#content .error h2 {
			background: url(images/sprite.png) no-repeat 0 -1211px;
			padding: 47px 0 0;
		}
		
		#content .message h2 {
			background: url(images/sprite.png) no-repeat 0 -1645px;
			padding: 14px 0 0;
		}
		
		#content .newsletter h2 {
			background: url(images/sprite.png) no-repeat 0 -1743px;
			padding: 47px 0 0;
		}
		
		#content .newsletter-success h2 {
			background: url(images/sprite.png) no-repeat 0 -1694px;
			padding: 47px 0 0;
		}
	*/
#content .inner a {
  color: #333536;
}
#content .inner .container {
  background: #fff;
  min-height: 380px;
  padding: 1px 16px 1px;
}
#content .message .container {
  min-height: 630px;
}
#content .inner .container .franchisee-search form {
  margin: 0;
}
#content .results .container {
  background: #fff;
  min-height: 586px;
  padding: 19px 16px 1px;
}
#content .results .result-summary {
  border-bottom: solid 1px #bababa;
  border-top: solid 1px #bababa;
  height: 28px;
  position: relative;
}
.result-summary .courses-found {
  height: 26px;
  padding-left: 6px;
  position: relative;
}
.result-summary .courses-found span {
  color: #036fed;
  display: block;
  float: left;
  font-weight: bold;
  line-height: 28px;
}
.result-summary .courses-found strong {
  background: url(images/sprite.gif) no-repeat -183px 0;
  display: block;
  height: 0;
  left: 2px;
  overflow: hidden;
  padding: 11px 0 0;
  position: relative;
  top: 8px;
  width: 108px;
}
.result-summary ul {
  height: 13px;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 6px;
  top: 8px;
}
.result-summary li {
  float: left;
  width: 20px;
}
.result-summary li.prev {
  width: 58px;
}
.result-summary li.next {
  width: 45px;
}
.result-summary li a {
  background: url(images/sprite.gif) no-repeat;
  border: none;
  cursor: pointer;
  display: block;
  float: left;
  height: 0;
  overflow: hidden;
  margin: 0 4px 0 0;
  padding: 13px 0 0;
}
.result-summary li span {
  background: url(images/sprite.gif) no-repeat -51px -36px;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 13px 0 0;
  width: 4px;
}
.result-summary li.prev a {
  background-position: -1px -36px;
  width: 46px;
}
.result-summary li.prev a.selected, .result-summary li.prev a:hover {
  background-position: -1px -55px;
  width: 46px;
}
.result-summary li.p1 a {
  background-position: -60px -36px;
  width: 7px;
}
.result-summary li.p1 a.selected, .result-summary li.p1 a:hover {
  background-position: -60px -55px;
  width: 7px;
}
.result-summary li.p2 a {
  background-position: -72px -36px;
  width: 8px;
}
.result-summary li.p2 a.selected, .result-summary li.p2 a:hover {
  background-position: -72px -55px;
  width: 8px;
}
.result-summary li.p3 a {
  background-position: -84px -36px;
  width: 9px;
}
.result-summary li.p3 a.selected, .result-summary li.p3 a:hover {
  background-position: -84px -55px;
  width: 9px;
}
.result-summary li.p4 a {
  background-position: -96px -36px;
  width: 10px;
}
.result-summary li.p4 a.selected, .result-summary li.p4 a:hover {
  background-position: -96px -55px;
  width: 10px;
}
.result-summary li.p5 a {
  background-position: -108px -36px;
  width: 9px;
}
.result-summary li.p5 a.selected, .result-summary li.p5 a:hover {
  background-position: -108px -55px;
  width: 9px;
}
.result-summary li.p6 a {
  background-position: -120px -36px;
  width: 9px;
}
.result-summary li.p6 a.selected, .result-summary li.p6 a:hover {
  background-position: -120px -55px;
  width: 9px;
}
.result-summary li.p7 a {
  background-position: -132px -36px;
  width: 8px;
}
.result-summary li.p7 a.selected, .result-summary li.p7 a:hover {
  background-position: -132px -55px;
  width: 8px;
}
.result-summary li.p8 a {
  background-position: -144px -36px;
  width: 8px;
}
.result-summary li.p8 a.selected, .result-summary li.p8 a:hover {
  background-position: -144px -55px;
  width: 8px;
}
.result-summary li.p9 a {
  background-position: -158px -36px;
  width: 9px;
}
.result-summary li.p9 a.selected, .result-summary li.p9 a:hover {
  background-position: -158px -55px;
  width: 9px;
}
.result-summary li.p10 a {
  background-position: -170px -36px;
  width: 9px;
}
.result-summary li.p10 a.selected, .result-summary li.p0 a:hover {
  background-position: -170px -55px;
  width: 9px;
}
.result-summary li.next a {
  background-position: -186px -36px;
  width: 45px;
}
.result-summary li.next a.selected, .result-summary li.next a:hover {
  background-position: -186px -55px;
  width: 45px;
}
#content .results .results-list {
  list-style: none;
  margin: 0 0 0 -14px;
  padding: 0;
}
#content .results .results-list li {
  margin: 20px 0 0;
}
#content .results .results-list .schedule-detail {
  min-height: 72px;
  _height: 72px;
  position: relative;
  margin-left: 39px;
}
#content .results .results-list h3 {
  line-height: 20px;
  margin: 0;
  /*
					overflow: hidden;
					width: 380px;
					position: absolute;
					left: 39px;
					top: 0;
					*/

}
.results-list .course-rating {
  background: url(images/sprite.gif) no-repeat -254px -12px;
  height: 0;
  margin: 0;
  overflow: hidden;
  padding: 17px 0 0;
  position: absolute;
  right: 13px;
  top: 0;
  width: 100px;
}
.results-list .course-info {
  bottom: 4px;
  color: #109ade;
  line-height: 20px;
  margin: 0;
  position: absolute;
  right: 13px;
}
.results-list .course-description {
  /*
					height: 50px;
					left: 39px;
					margin: 0;
					overflow: hidden;
					position: absolute;
					top: 21px;
					*/

  width: 340px;
}
.results-list .course-distance {
  display: block;
  position: absolute;
  right: 13px;
  bottom: 25px;
}
.results-list .none {
  display: none;
}
.results-list .one {
  background-position: -214px -12px;
}
.results-list .two {
  background-position: -214px -12px;
}
.results-list .three {
  background-position: -194px -12px;
}
.results-list .four {
  background-position: -174px -12px;
}
.results-list .five {
  background-position: -154px -12px;
}
.results-list .course-details {
  background: #99c1f4 url(images/course-details-top.gif) no-repeat 0 0;
  clear: both;
  margin: 0 0 0 33px;
  width: 491px;
}
.results-list .course-details table {
  background: url(images/course-details-bottom.gif) no-repeat center bottom;
  margin: 14px 0 0;
  padding: 0 0 10px;
  width: 491px;
}
.results-list .course-details th {
  color: #fff;
  text-align: center;
}
.results-list .course-details td {
  text-align: center;
}
.results-list .course-details .book-course {
  background: url(images/sprite.gif) no-repeat -237px -34px;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 24px 0 0;
  width: 62px;
}
.container .book-course1 {
  background: url(images/sprite.gif) no-repeat -237px -34px;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 24px 0 0;
  width: 62px;
}
/**endregion**/
/* Schedule Detail */
/**region**/
/**endregion**/
/** Modal **/
/**region**/
#modal-back {
  background: url(images/haze.png);
  display: none;
  height: 100%;
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
}
#modal-container {
  height: 470px;
  left: 50%;
  margin: -235px 0 0 -326px;
  position: fixed;
  top: 50%;
  width: 652px;
}
#modal-top {
  background: url(images/sprite.png) no-repeat 0 -179px;
  height: 26px;
}
#modal-content {
  background: url(images/modal-back.png) repeat-y;
  height: 418px;
  padding: 1px 0 0;
  width: 652px;
}
#modal {
  color: #000;
  height: 418px;
  margin: 0 30px;
  overflow: auto;
}
#modal-bottom {
  background: url(images/sprite.png) no-repeat 0 -203px;
  height: 26px;
}
.modal-close {
  background: url(images/sprite.png) no-repeat -509px -89px;
  height: 0;
  overflow: hidden;
  padding: 31px 0 0;
  position: absolute;
  top: -4px;
  right: -4px;
  width: 31px;
}
/**endregion**/
/** Footer **/
/**region**/
#footer {
  margin: 35px 0 0 302px;
  width: 556px;
  height: 49px;
  background: url(images/SX-footer.png) no-repeat top left;
}
#footer ul {
  /*width: 650px;
		float: right;*/

  text-align: right;
  position: relative;
  right: 25px;
  top: 17px;
  margin: 0;
  padding: 0;
  color: #fff;
}
#footer ul li {
  display: inline;
  margin: 0 0 0 6px;
  padding: 0 0 0 6px;
  list-style-type: none;
  font-size: 1em;
  border-left: 1px solid #fff;
}
#footer li a {
  color: #fff;
}
#footer li.first {
  border: 0 none;
}
#footer a {
  text-decoration: none;
}
#footer a:hover {
  text-decoration: underline;
}
#footer li#ic {
  position: absolute;
  left: 30px;
  top: 0;
  border: 0 none;
}
/**endregion**/
/** Colour Panels **/
/**region**/
.panelwide {
  width: 515px;
  height: 123px;
  background-repeat: no-repeat;
  margin: 0 0 15px;
}
.panelnarrow {
  width: 248px;
  height: 149px;
  background-repeat: no-repeat;
}
.panelInner {
  padding: 0 10px;
  position: relative;
  height: 125px;
}
.panelInner p {
  margin: 2px 0 0;
}
.panelnarrow .panelInner {
  height: 140px;
}
.panelwide .panelInner .tape {
  background: url(images/tape/mini-tape-1.png) no-repeat;
  height: 139px;
  left: -5px;
  position: absolute;
  top: -8px;
  width: 224px;
}
.panelwide h3, .panelnarrow h3 {
  height: 0;
  overflow: hidden;
  padding: 28px 0 0;
  margin: 0;
}
p.tellmemore a {
  background-repeat: no-repeat;
  text-indent: -8000px;
  text-decoration: none;
  font-size: 0.05em;
  line-height: .05em;
  width: 106px;
  height: 15px;
  margin: 0;
  padding: 0;
  display: block;
  position: absolute;
  right: 15px;
  bottom: 0;
}
.panelBlue {
  background: url(images/colourPanels/bluePanel.gif);
}
.panelBlue .panelInner {
  padding: 0 10px 0 220px;
  background: url(images/colourPanels/parent-HP-tile-photo.jpg) no-repeat 10px 8px;
  height: 117px;
}
.panelBlue h3 {
  background: url(images/headers/parent-blue.gif) no-repeat 0 8px;
}
.panelBlue p.tellmemore a {
  background: url(images/buttons/tell-me-more-blue.gif) no-repeat right bottom;
}
.panelRed {
  background: url(images/colourPanels/redPanel.gif);
}
.panelRed .panelInner {
  padding: 0 10px 0 220px;
  background: url(images/colourPanels/teacher-HP-tile-photo.jpg) no-repeat 10px 8px;
  height: 113px;
}
.panelRed h3 {
  background: url(images/headers/teacher-pink.gif) no-repeat 0 8px;
}
.parents .module-one h3, .teachers .module-one h3 {
  background: url(images/headers/need-inspiration.png) no-repeat 0 8px;
}
.parents .module-two h3, .teachers .module-two h3 {
  background: url(images/headers/do-you-have-a-question.png) no-repeat 0 8px;
}
.panelRed p {
  color: #fff;
}
.panelRed p.tellmemore a {
  background: url(images/buttons/tell-me-more-pink.gif) no-repeat right bottom;
}
.panelGrey {
  background: url(images/colourPanels/greyPanel_narrow.gif);
  float: left;
}
.panelGrey h3 {
  background: url(images/headers/coach-grey.gif) no-repeat 0 8px;
}
.panelGrey p.tellmemore a {
  background: url(images/buttons/tell-me-more-grey.gif) no-repeat right bottom;
}
.panelPurple {
  background: url(images/colourPanels/purplePanelnarrow.gif);
  float: right;
  margin: 0 9px 0 0;
}
.panelPurple h3 {
  background: url(images/headers/public-sector-purple.gif) no-repeat 0 8px;
}
.panelPurple p.tellmemore a {
  background: url(images/buttons/tell-me-more-purple.gif) no-repeat right bottom;
}
.content-box-green, .content-box-yellow {
  padding: 0;
  width: 279px;
  float: left;
  background-repeat: no-repeat;
  background-position: top left;
  background-color: Transparent;
}
.content-box-green {
  margin: 30px 0 17px 0;
}
.content-box-yellow {
  margin: 4px 0 17px 0;
}
.content-box-green {
  background-image: url(images/colourPanels/green-top.gif);
}
.content-box-yellow {
  background-image: url(images/colourPanels/yellow-top.png);
}
.content-box-green .content-box-inner, .content-box-yellow .content-box-inner {
  padding: 0;
  margin: 17px 0 0;
  position: relative;
  min-height: 150px;
}
.content-box-green .content-box-inner {
  background: url(images/colourPanels/green-bottom.gif) bottom left;
}
.content-box-yellow .content-box-inner {
  background: url(images/colourPanels/yellow-bottom.png) bottom left;
}
#side-bar .content-box-inner h2 {
  height: 0;
  overflow: hidden;
  padding: 27px 0 0;
  margin: 0 0 10px;
}
#side-bar .content-box-green h2 {
  background: url(images/headers/whats-new-green.gif) no-repeat 10px 0;
}
#side-bar .content-box-yellow h2 {
  background: url(images/headers/keep-up-to-date-yellow.gif) no-repeat 10px 0;
}
.content-box-inner p {
  margin: 0;
  padding: 0 15px;
}
.content-box-inner a {
  background-repeat: no-repeat;
  text-indent: -8000px;
  text-decoration: none;
  font-size: 0.05em;
  line-height: .05em;
  width: 116px;
  height: 15px;
  margin: 0;
  padding: 0;
  display: block;
  position: absolute;
  right: 25px;
  bottom: 0;
  height: 25px;
}
.clear {
  clear: both;
}
/**endregion**/
/** Form Styles **/
/**region**/
#content form div, #modal form div {
  margin: 0 0 8px;
}
#content form label, #modal form label {
  width: 120px;
  display: inline-block;
}
#content form label.error, #modal form label.error {
  /*width: 205px;*/

  margin-left: 5px;
}
#content form label.isdependent, #modal form label.isdependent {
  width: 170px;
}
#content form label.optin, #modal form label.optin {
  width: 470px;
}
.field-validation-error,
span.required,
p.required,
label.error {
  color: #ff0000;
}
.advanced-search .field-validation-error, .advanced-search label.error {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background: none repeat scroll 0 0 #FFFFFF;
  display: block;
  font-weight: bold;
  margin: 5px 0 0;
  padding: 5px;
}
.reference-search label.error {
  color: #fff;
}
input.postcode {
  width: 90px;
}
input.wide {
  width: 180px;
  margin: 0 2px;
}
input.day, input.month {
  width: 16px;
}
input.year, input.small {
  width: 34px;
}
select, input {
  font-size: 9pt;
}
#content table.contacts {
  width: 525px;
  background-color: #c0d3e7;
  padding: 1px;
  margin-bottom: 15px;
}
#content table.contacts th, #content table.contacts td {
  text-align: left;
  font-size: 0.95em;
}
#content table.contacts th.th_center, #content table.contacts td.td_center {
  text-align: center;
}
#content table.contacts td.checkoutsummary, #content table.contacts td.checkoutsummary1, #content table.contacts td.checkoutsummary2 {
  font-weight: bold;
  padding: 5px 0;
}
#content table.contacts td.checkoutsummary1 {
  border-top: 1px solid #444;
}
#content table.contacts td.checkoutsummary2 {
  border-bottom: 1px solid #444;
}
#content table.contacts td.discountcolumn, #content table.contacts td.discountcolumn a {
  color: #ff0000;
}
#content table.contacts td.totalcolumn {
  font-weight: bold;
  text-align: right;
}
#content table.contacts td.coursecolumn, #content table.contacts td.coursecolumn div {
  width: 160px;
}
table.sessions {
  width: 500px;
}
table.sessions th {
  text-align: left;
}
table.sessions .session {
  text-align: center;
  width: 70px;
}
table.sessions .sessiondate,
table.sessions .sessiontime,
table.sessions .sessionduration,
table.sessions .sessionxtratime {
  text-align: center;
}
table.sessions select.xtratime {
  width: 135px;
}
.containerinner table {
  margin: 10px 0;
}
.emphasis {
  font-style: italic;
}
.afterCourse ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#content form div.afterCourse label {
  width: 170px;
}
#content form div.indent {
  margin-left: 120px;
  clear: both;
}
#content form div.indent label {
  width: 350px;
}
.container li {
  margin-bottom: 5px;
}
input.postcode {
  width: 90px;
}
input.email {
  width: 180px;
}
#content .step1 table.contacts {
  width: 500px;
  background-color: transparent;
}
#content .step1 table.contacts td, #content .step1 table.contacts th {
  font-size: 1em;
}
#content table.contacts th {
  text-align: left;
}
#content table.contacts th.th_center {
  text-align: center;
}
#content table.contacts td.checkoutsummary1, #content table.contacts td.checkoutsummary2 {
  font-weight: bold;
  padding: 5px 0;
}
#content table.contacts td.checkoutsummary1 {
  border-top: 1px solid #444;
}
#content table.contacts td.checkoutsummary2 {
  border-bottom: 1px solid #444;
}
.containerinner table {
  margin: 10px 0;
}
.emphasis {
  font-style: italic;
}
.afterCourse ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#content form div.afterCourse label {
  width: 170px;
}
#content form div.terms label {
  width: 250px;
}
.container li {
  margin-bottom: 5px;
}
/**endregion**/
/** Contact Us **/
/**region**/
.contactus textarea, .coaches textarea {
  height: 100px;
  vertical-align: top;
  width: 315px;
}
#content .contactus label.error,
.contactus span.field-validation-error,
#content .coaches label.error,
.coaches span.field-validation-error {
  display: block;
  margin: 3px 0 0 120px;
}
.contactus ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#submitEnquiry {
  background: url(images/sprite.gif) -363px -1px;
  border: none;
  cursor: pointer;
  height: 24px;
  padding: 24px 0 0;
  margin: 0 0 0 356px;
  vertical-align: middle;
  width: 85px;
}
.franchisee #submitEnquiry {
  margin: 0 0 0 255px;
}
.franchisee-search {
  width: 515px;
}
.franchisee-search h3.franchisee-search-header {
  background: url(images/sprite.gif) 0 -168px;
  height: 0;
  overflow: hidden;
  padding: 21px 0 0;
  width: 449px;
}
.franchisee-search-form {
  background: url(images/sprite.gif) 0 -126px;
  height: 40px;
  width: 515px;
}
#content .franchisee-search .field-validation-error {
  margin: 0;
  text-align: center;
}
#content .franchisee-search-form label {
  color: #fff;
  display: inline;
  font-family: arial black;
  line-height: 40px;
  margin: 0 0 0 10px;
  width: auto;
}
.franchisee-search-submit {
  background: url(images/sprite.gif) 0 0;
  border: none;
  cursor: pointer;
  height: 18px;
  padding: 18px 0 0;
  margin: 0 0 0 5px;
  vertical-align: middle;
  width: 56px;
}
.franchisee-search-total {
  border-bottom: solid 1px #4c4c4c;
  border-top: solid 1px #4c4c4c;
  height: 38px;
  margin: 8px 0 0;
}
.franchisee-search-total p {
  line-height: 38px;
  margin: 0 0 0 10px;
  padding: 0;
}
.franchisee-search .franchisee {
  border-top: solid 1px #ccc;
  overflow: hidden;
  margin: 0;
  padding: 17px 0 18px;
  position: relative;
  width: 515px;
}
.franchisee-search .first {
  border: none;
}
.franchisee-search .franchisee-image {
  float: left;
  margin: 0 18px 0 13px;
}
.franchisee-search .franchisee div {
  float: left;
  width: 370px;
}
.franchisee-search .franchisee h3 {
  font-size: 9pt;
  margin: 0;
  padding: 0;
}
.franchisee-search .franchisee li {
  margin: 0;
  padding: 0;
}
.franchisee-search .franchisee h4 {
  font-size: 9pt;
  margin: 4px 0 0;
  padding: 0;
}
.franchisee-search .franchisee p {
  margin: 0 13px 0 0;
  padding: 0;
}
.franchisee-search .franchisee a {
  background: url(images/sprite.gif) no-repeat;
  display: block;
  height: 0;
  overflow: hidden;
  position: absolute;
}
.franchisee-search a.franchisee-profile {
  background-position: -1px -72px;
  left: 383px;
  padding: 24px 0 0;
  top: 17px;
  width: 132px;
}
.franchisee-search a.franchisee-question {
  background-position: -1px -101px;
  left: 344px;
  padding: 24px 0 0;
  position: absolute;
  top: 46px;
  width: 171px;
}
/**endregion**/
/** News **/
/**region**/
#content .news-module .container {
  min-height: 440px;
}
#content .archive-module {
  left: 689px;
  position: absolute;
  top: 69px;
  width: 169px;
}
#content .archive-module h2 {
  background: url(images/archive.png) no-repeat;
  height: 0;
  overflow: hidden;
  padding: 46px 0 0;
  margin: 0;
  width: 169px;
}
#content .archive-articles {
  background: #333536;
  height: 350px;
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
}
#content .archive-articles ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
#content .archive-articles li {
  margin: 0;
  padding: 0 0 0 18px;
}
#content .archive-articles li strong {
  text-decoration: underline;
}
#content .archive-articles .archive-month {
  list-style: disc outside;
}
#content .archive-month li {
  margin: 10px 4px 10px 14px;
  padding: 0;
}
#content .archive-articles li a {
  font-size: 8pt;
  text-decoration: none;
}
#content .archive-articles li a:hover {
  text-decoration: underline;
}
#content .archive-navigation {
  background: url(images/archive.png) no-repeat 0 -46px;
  height: 51px;
  position: relative;
  width: 169px;
}
.archive-navigation .left, .archive-navigation .right {
  background: url(images/archive.png) no-repeat;
  height: 0;
  overflow: hidden;
  padding: 8px 0 0;
  position: absolute;
  top: 31px;
  width: 13px;
}
.archive-navigation .left {
  background-position: 0 -97px;
  left: 41px;
}
.archive-navigation span {
  left: 61px;
  position: absolute;
  text-align: center;
  top: 28px;
  width: 40px;
}
.archive-navigation .right {
  background-position: -13px -97px;
  left: 108px;
}
/**endregion**/
/** Franchisee **/
/**region**/
#content div.franchisee {
  background: url(images/content-module-top.png) no-repeat;
  padding: 12px 0 0;
}
#content div.franchisee .container {
  min-height: 449px;
  padding-top: 0;
}
.franchisee .side-bar {
  background: #ccc;
  float: left;
  font-size: 8pt;
  padding: 4px;
  width: 114px;
}
#content .franchisee .side-bar h2 {
  background: none;
  font-size: 8pt;
  height: auto;
  margin: 4px 0 0;
  overflow: visible;
  padding: 0;
  width: auto;
}
.franchisee .side-bar ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.franchisee .side-bar li {
  margin: 0;
  padding: 0;
}
.franchisee .main-content {
  margin: 0 0 0 130px;
  width: 394px;
}
#content .franchisee .main-content h2 {
  background: none;
  height: auto;
  margin: 4px 0 0;
  overflow: visible;
  padding: 0;
  width: auto;
}
/**endregion**/
/** Booking Form **/
/**region**/
#content .booking label {
  width: auto;
}
#content fieldset {
  margin-bottom: 15px;
}
#content fieldset legend {
  font-weight: bold;
  font-size: 1.25em;
}
#content .boldtext {
  font-weight: bold;
}
#content #recaptcha_widget_div div {
  margin: 0;
}
.step1 legend {
  background: url(images/step1.gif) no-repeat;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  overflow: hidden;
  padding: 0 0 0 82px;
}
.step2 legend {
  background: url(images/step2.gif) no-repeat;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  overflow: hidden;
  padding: 0 0 0 82px;
}
.step3 legend {
  background: url(images/step3.gif) no-repeat;
  display: inline-block;
  height: 25px;
  line-height: 25px;
  overflow: hidden;
  padding: 0 0 0 82px;
}
.one-two-three {
  position: absolute;
  right: 10px;
  top: 10px;
}
/**endregion**/
/** Register or Login **/
/**region**/
.login-button {
  margin-left: 122px;
  background: url(images/buttons/login.gif) no-repeat;
  font-size: 0;
  height: 26px;
  padding: 26px 0 0;
  width: 83px;
  border: none;
  cursor: pointer;
  overflow: hidden;
  vertical-align: top;
}
.forgot-password-button {
  background: url(images/buttons/forgot-password.gif) no-repeat;
  font-size: 0;
  height: 26px;
  padding: 26px 0 0;
  width: 247px;
  border: none;
  cursor: pointer;
  overflow: hidden;
  vertical-align: top;
}
.register-button {
  background: url(images/buttons/register.gif) no-repeat;
  display: inline-block;
  height: 0;
  overflow: hidden;
  padding: 26px 0 0;
  vertical-align: middle;
  width: 112px;
}
input.register-button {
  margin-left: 122px;
  background: url(images/buttons/register.gif) no-repeat;
  font-size: 0;
  height: 26px;
  padding: 26px 0 0;
  width: 112px;
  border: none;
  cursor: pointer;
  overflow: hidden;
  vertical-align: top;
}
/**endregion**/
/** Checkout **/
/**region**/
.security-code {
  vertical-align: middle;
}
/**endregion**/
/**/
/** Manage Account **/
/**region**/
.addchild-button {
  background: url(images/buttons/new-child.gif) no-repeat;
  display: inline-block;
  height: 0;
  overflow: hidden;
  padding: 26px 0 0;
  vertical-align: middle;
  width: 180px;
}
/**endregion**/
/**/
.hidden {
  display: none !important;
}
/* simple css-based tooltip */
.tooltip {
  background-color: #000;
  border: 1px solid #fff;
  padding: 10px 15px;
  width: 220px;
  display: none;
  color: #fff;
  text-align: left;
  font-size: 12px;
  /* outline radius for mozilla/firefox only */

  -moz-box-shadow: 0 0 10px #000;
  -webkit-box-shadow: 0 0 10px #000;
}
/* vTip style */
p#vtip {
  display: none;
  position: absolute;
  padding: 10px;
  left: 5px;
  font-size: 0.9em;
  background-color: white;
  color: #333;
  border: 1px solid #a6c9e2;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  z-index: 9999;
}
p#vtip #vtipArrow {
  position: absolute;
  top: -10px;
  left: 5px;
}
div.vtip {
  white-space: nowrap;
  position: relative;
  margin: 0;
  overflow: hidden !important;
  display: block;
  cursor: pointer;
}
/* Really clever way of masking text that is wider than the content area it occupies. The text needs to have no-wrap set.*/
span.overlay {
  background: url("images/fade-white.png") repeat-y scroll 0 0 transparent;
  position: absolute;
  right: 0;
  top: 0;
  width: 15px;
  height: 100%;
}
.contacts span.overlay {
  background: url("images/fade-blue.png") repeat-y scroll 0 0 transparent;
}