/*
Theme Name: WNPS
Theme URI: http://www.accent-adc.co.uk
Description: custom theme build for Wales National Pool Swansea
Version: 1.0
Author: Tom Webb / Accent-ADC
Author URI: http://www.accent-adc.co.uk/
*/


body {
	margin: 0;
	padding: 0;
	text-align: center;
	color: #143361;
	font-family: Arial, Helvetica, sans-serif;
}
#page {
	width: 940px;
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left;
	color: #FFFFFF;
	font-size: 12px;
}
#mid {
	
	width: 860px;
	padding-top: 0;
	padding-bottom: 20px;
	text-align: left;
	padding-right: 30px;
	padding-left: 50px;
	background-image: url(img/mid.jpg);
	background-repeat: repeat-y;background-position: -430px 0px;
}
#header {
	background-repeat: no-repeat;
	background-position: -430px 0px;
	height: 275px;
	width: 940px;
	background-image: url(img/headbg.jpg);
}
#bubbles {
	height: 123px;
	width: 405px;
	position: absolute;
	top: 79px;
	left: 386px;
	background-repeat: no-repeat;
	text-align: left;
	margin: 0px;
	padding: 0px;
	z-index: 10;
}
#footer {background-repeat: no-repeat;
	background-position: -430px 0px;
	height: 140px;
	width: 940px;
	background-image: url(img/footerbg.jpg);
}

#headbg {
	width: 100%;
	position: static;
	z-index: -50;
	height: 275px;
	background-image: url(img/headbg.jpg);
	background-position: center 0px;
	background-repeat: no-repeat;
}
#midbg {
	width: 100%;
	position: static;
	z-index: -50;
	left: 0px;
	background-image: url(img/mid.jpg);
	background-repeat: repeat-y;
	background-position: center top;
}

#header, #mid, #footer {
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	position: relative;
}
#topmemu {
	position: absolute;
	top: 30px;
	left: 390px;
	width: 550px;
	background-color: #FFFFFF;
	z-index: 50;
}

#footerbg {
	position: static;
	z-index: -50;
	width: 100%;
	background-image: url(img/footerbg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

.marginfix{
	margin:0px;
	height: 1px;
	width: 100%;
	padding: 0px;
}
hr {
	display: none;
	}

.hidden {
	display:none;
	height: 0px;
	width: 0px;
}
.left570 {
	float: left;
	width: 570px;
}
.right240 {
	float: right;
	width: 262px;
	padding-top: 25px;
}
#hometitle{
	font-family:Impact;
	font-size: 58px;
	line-height: 80px;
	color: #FFFFFF;
}
#hometext{
	color: #FFFFFF;
	padding-right: 25px;
	font-size: 15px;
	float: right;
	padding-left: 23px;
	width: 170px;
	letter-spacing: -1px;
	line-height: 16px;
}
.left570 .slideshow-corners {
	float: left;
	margin-bottom: 15px;
	position: relative;
	padding: 0px;
}

.left570 .slideshow-corners{
	width:351px;
	height:261px;
	overflow: hidden;
}
.left570 .slideshow-corners #slideshow img{
	float: left;
	margin:0px;
	z-index: -50;
}

.clear {
	clear: both;
}
.times {
	background-image: url(img/swimtimes.png);
	height: 115px;
	width: 266px;
	overflow: hidden;
	background-position: 0px -115px;
	margin-top: 8px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 15px;
}
.times:hover{background-position: 0px 0px;}

.phone{
	background-image: url(img/phonehome.png);
	height: 233px;
	width: 266px;
	overflow: hidden;
	margin-top: 0px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 15px;
	background-repeat: no-repeat;
	background-position: center center;
}

#bubbleslist li {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	position: absolute;
	z-index: 10;
}
#bubbleslist a {
	display: block;
	text-indent: -9999px;
	text-decoration: none;
	z-index: 10;
}

#bubble1,#bubble2,#bubble3,#bubble4,#bubble5 {
 background:url(img/bubbles.png);
}

#bubble1 {
	left: 5px;
	top: 9px;
	width: 101px;
	height: 101px;
	background-position: -5px -8px;
}
#bubble2 {
	left: 127px;
	top: 9px;
	width: 70px;
	height: 68px;
	background-position: -127px -9px;
}
#bubble3 {
	left: 219px;
	top: 6px;
	width: 54px;
	height: 55px;
	background-position: -219px -6px;
}
#bubble4 {
	left: 297px;
	top: 13px;
	width: 46px;
	height: 47px;
	background-position: -297px -13px;
}
#bubble5 {
	left: 359px;
	top: 23px;
	width: 37px;
	height: 37px;
	background-position: -359px -23px;
}
#bubble1 a{height: 101px;}
#bubble2 a{height: 68px;}
#bubble3 a{height: 55px;}
#bubble4 a{height: 47px;}
#bubble5 a{height: 37px;}

#bubble1 a:hover { background:url(img/bubbles.png) -5px -131px no-repeat;}
#bubble2 a:hover { background:url(img/bubbles.png) -127px -132px no-repeat;}
#bubble3 a:hover { background:url(img/bubbles.png) -219px -129px no-repeat;}
#bubble4 a:hover { background:url(img/bubbles.png) -297px -136px no-repeat;}
#bubble5 a:hover { background:url(img/bubbles.png) -359px -146px no-repeat;}
#userfunctions {
	height: 60px;
	width: 320px;
	margin-bottom: -60px;
	position: absolute;
	left: 620px;
	top: 155px;
	text-align: left;
	color: #FFFFFF;
	text-decoration: none;
	font-size: 0.8em;
	z-index: 20;
}
#userfunctions a{
	color: #FFFFFF;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
}
#search #searchform input {
	background-image: url(img/search.png);
	height: 15px;
	width: 126px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	background-repeat: no-repeat;
	padding-right: 32px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 4px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	margin-top: 0px;
	margin-bottom: 4px;
}
#login input {
	background-image: url(img/input.png);
	background-repeat: no-repeat;
	height: 16px;
	width: 70px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	margin-right: 3px;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
	z-index: 20;
}
#userfunctions form {
	margin: 0px;
	padding: 0px;
	z-index: 20;
}
#userfunctions #login .formbutton {
	background-image:none;
	color: #ffffff;
	background-color: transparent;
	text-decoration: none;
	border: none;
	cursor: pointer;
	cursor: hand;
	margin: 0px;
	padding: 0px;
	height: 18px;
	width: 40px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
}

strong.search-excerpt {
	background-color: #FFFF00;
}


#content, #content-timetable{
	min-height:210px;
	background-image: url(img/content-bg.png);
	background-repeat: repeat-x;
	background-color: #FFFFFF;
	position: relative;
	padding: 20px;
	color: #013467;
	float: left;
	font-size: 0.9em;
}
#content{width: 525px;}
#content-timetable{
	width: 660px;
}


.tl {
z-index:100;
	background-repeat: no-repeat;
	left: 0px;
	top: 0px;
	height: 200px;
	width: 20px;
	position: absolute;
}
.tr {
z-index:100;
	background-repeat: no-repeat;
	right: 0px;
	top: 0px;
	height: 200px;
	width: 20px;
	position: absolute;
}
.bl {
z-index:100;
	background-repeat: no-repeat;
	left: 0px;
	bottom: 0px;
	height: 20px;
	width: 20px;
	position: absolute;
}
.br {
z-index:100;
	background-repeat: no-repeat;
	height: 20px;
	width: 20px;
	position: absolute;
	right: 0px;
	bottom: 0px;
}
#content .tl,#content-timetable .tl, .homescroll-bg .tl{
	background-image: url(img/content-tl2.png);
}
#content .tr,#content-timetable .tr, .homescroll-bg .tr{
	background-image: url(img/content-tr2.png);
}
#content .bl,#content-timetable .bl, .homescroll-bg .bl{
	background-image: url(img/content-bl.png);
}
#content .br,#content-timetable .br, .homescroll-bg .br{
	background-image: url(img/content-br.png);
}
#blue-box .tl {
	background-image: url(img/side-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#blue-box .tr {
	background-image: url(img/side-tr.png);
	height: 20px;
	right: -4px;
	top: -4px;
}
#blue-box .bl {
	background-image: url(img/side-bl.png);
	left: -4px;
	bottom: -4px
}
#blue-box .br {
	background-image: url(img/side-br.png);
	right: -4px;
	bottom: -4px;
}
#green-box .tl {
	background-image: url(img/sidegreen-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#green-box .tr {
	background-image: url(img/sidegreen-tr.png);
	height: 20px;
	right: -4px;
	top: -4px;
}
#green-box .bl {
	background-image: url(img/sidegreen-bl.png);
	left: -4px;
	bottom: -4px
}
#green-box .br {
	background-image: url(img/sidegreen-br.png);
	right: -4px;
	bottom: -4px;
}
#green-box .tl {
	background-image: url(img/sidegreen-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#red-box .tl {
	background-image: url(img/sidered-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#red-box .tr {
	background-image: url(img/sidered-tr.png);
	height: 20px;
	right: -4px;
	top: -4px;
}
#red-box .bl {
	background-image: url(img/sidered-bl.png);
	left: -4px;
	bottom: -4px
}
#red-box .br {
	background-image: url(img/sidered-br.png);
	right: -4px;
	bottom: -4px;
}
#purple-box .tl {
	background-image: url(img/sidepurple-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#purple-box .tr {
	background-image: url(img/sidepurple-tr.png);
	height: 20px;
	right: -4px;
	top: -4px;
}
#purple-box .bl {
	background-image: url(img/sidepurple-bl.png);
	left: -4px;
	bottom: -4px
}
#purple-box .br {
	background-image: url(img/sidepurple-br.png);
	right: -4px;
	bottom: -4px;
}
#orange-box .tl {
	background-image: url(img/sideorange-tl.png);
	height: 20px;
	left: -4px;
	top: -4px;
}
#orange-box .tr {
	background-image: url(img/sideorange-tr.png);
	height: 20px;
	right: -4px;
	top: -4px;
}
#orange-box .bl {
	background-image: url(img/sideorange-bl.png);
	left: -4px;
	bottom: -4px
}
#orange-box .br {
	background-image: url(img/sideorange-br.png);
	right: -4px;
	bottom: -4px;
}
#content .photo-corners .tl {
	background-image: url(img/pic-tl.png);
	height: 20px;
	left: -3px;
	top: -3px;
}
#content .photo-corners .tr {
	background-image: url(img/pic-tr.png);
	height: 20px;
	right: -3px;
	top: -3px;
}
#content .photo-corners .bl {
	background-image: url(img/pic-bl.png);
	left: -3px;
	bottom: -3px
}
#content .photo-corners .br {
	background-image: url(img/pic-br.png);
	right: -3px;
	bottom: -3px;
}
.left570 .slideshow-corners .tr {
	background-image: url(img/slideshow-tr.png);
	height: 20px;
}
.left570 .slideshow-corners .tl {
	background-image: url(img/slideshow-tl.png);
	height: 20px;
}
.left570 .slideshow-corners .br {
	background-image: url(img/slideshow-br.png);
	
}
.left570 .slideshow-corners .bl {
	background-image: url(img/slideshow-bl.png);
	
}
h2 {
	margin: 0px;
	color: #0DAAC9;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing: -2px;
	font-size: 40px;
	line-height: 35px;
}
#scrollmenu-bg2, #datamenu{
	cursor: pointer;
	cursor: hand;
	font-weight: bold;
	background-color: #FFFFFF;
	background-image: url(img/scrollmenu-bg2.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 485px;
	position: relative;
	margin-bottom: 15px;
	margin-top:30px;
	padding-top: 9px;
	padding-right: 20px;
	padding-bottom: 6px;
	padding-left: 20px;
	background-position: -20px 0px;
	clear: both;
}
#scrollmenu-bg li a:hover, #datamenu li:hover, #timetablemenu-bg li:hover{
	color: #88BA09;
}
#timetablemenu-bg, #scrollmenu-bg {
	background-color: #FFFFFF;
	background-repeat: no-repeat;
	height: 20px;
	position: relative;
	margin-bottom: 15px;
	padding-top: 9px;
	padding-right: 20px;
	padding-bottom: 6px;
	padding-left: 20px;
}
#timetablemenu-bg{width: 660px;background-image: url(img/timetable/timetablemenu-bg.png);}
#scrollmenu-bg {width: 525px;background-image: url(img/scrollmenu-bg.png);}

ul.sc_menu, ul.sc_menu2, ul.timetable_menu{
	display: block;
	height: 20px;
	/* Max width here, for users without Javascript */
  width: 1500px;
	/* Remove default margin */
  margin: 0;
	list-style: none;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 10px;
}
.sc_menu li:hover, .sc_menu2 li:hover, .timetable_menu li:hover{
cursor:pointer;}
.sc_menu li, .sc_menu2 li, .timetable_menu li{
	display: block;
	float: left;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 10px;
}
.sc_menu a, .sc_menu2 a,.timetable_menu a{
	display: block;
	text-decoration: none;
	color: #003466;
	font-weight: bold;
}
.sc_menu span {
  /* We want a caption to display on the next line */
  display: block;
  margin-top: 3px;
  text-align: center;
  font-size: 12px;
  color: #fff;
}

.sc_menu {
	width: 525px;
}
.sc_menu2 {
	width: 485px;
}
.timetable_menu{
	width:660px;}

#right-bar{
	width: 272px;
	float: right;
}
#right-bar-small{
	width: 145px;
	float: right;
}
#right-bar a, #right-bar-small a{
	text-decoration: none;
	color:#FFFFFF
}
#right-bar a:hover, #right-bar-small a:hover{
	text-decoration: none;
	color: #EDEDED;
}

#blue-box {background-color: #003466;}
#green-box {background-color: #96b92e;}
#red-box {background-color: #c73328;}
#orange-box {background-color: #dc9305;}
#purple-box {background-color: #93378c;}
#blue-box, #green-box, #red-box, #orange-box, #purple-box{
	width: 100%;
	border: 4px solid #FFFFFF;
	position: relative;
	color: #FFFFFF;
	padding: 16px;
}
#blue-box h3, #green-box h3, #red-box h3, #orange-box h3, #purple-box h3{
	font-weight: bold;
	letter-spacing: -1px;
	font-size: 20px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}

#blue-box p, #green-box p, #red-box p, #orange-box p, #purple-box p{
	font-size: 12px;
}
.photo-corners {
	padding:0px;
	margin-left:8px;
	border: 3px solid #FFFFFF;
	position: relative;
	float:right;
	margin-bottom: 8px;
	width: 260px;
}
.photo-corners img{
margin:0px;}
.data {
	position: relative;
	clear: both;
	float: none;
}
th, td{
padding:5px;
text-align:center;}
#data div{overflow:hidden;}
.homescroll {
	overflow:hidden;
	width: 560px;
	height: 124px;
	clear: both;
	position: relative;
	background-color: #FFFFFF;
	background-image: url(img/content-bg.png);
	background-repeat: repeat-x;
	padding-top: 15px;
	padding-right: 5px;
	padding-bottom: 15px;
	padding-left: 5px;
}
.homescroll-bg .tl, .homescroll-bg .tr{
	height:139px;
}
.homescroll-bg .bl, .homescroll-bg .br{
	background-position:0px -5px;
	height:15px;
}
.homescroll-bg {position: relative;
clear: both;
width: 570px;
	height: 154px;}
.homescroll .hscroll {
	height: 100px;
	display: block;
	/* Max width here, for users without Javascript */
  width: 1500px;
	list-style: none;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: -30px;
}
.homescroll .hscroll img {
	margin-right: auto;
	margin-left: auto;
	border: 2px solid #FFFFFF;
}


.homescroll .hscroll img:hover{filter:alpha(opacity=70);
	-moz-opacity:0.7;
	opacity: 0.7;}
.homescroll .hscroll li {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	height: 100px;
	display: block;
	float: left;
	padding-right: 15px;
	text-align: center;
}
.homescroll .hscroll a {
	color: #003466;
	text-decoration: none;
}
.homescroll .hscroll a:hover{
	color: #88BA09;
	text-decoration: none;
}
#blue-box a {
	text-decoration: none;
	color: #CCCCCC;
}
#blue-box a:hover {
color:#7AD0F3;}
.newsitem{
	background-image: url(img/logoicon.png);
	background-repeat: no-repeat;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	margin-top: 2px;
	margin-right: 0px;
	margin-bottom: 2px;
	margin-left: 0px;
	clear: both;
}

#right-bar  li, #right-bar  ul {
	list-style-type: none;
	margin-left: 0px;
	padding-left: 0px;
}
#footer #copyright {
	color: #666666;
	text-align: left;
	font-size: 11px;
	width: 300px;
	margin-top: 60px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: right;
}
#footer #copyright a {
	color: #4898BE;
	text-decoration: none;
}
#footer #copyright a:hover {
	color: #000000;
}
.entry li {
	list-style-image: url(img/tick.png);
	}
.entry ul {
margin-left: 15px;
	padding-left: 15px;
}

.entry a{
	text-decoration: none;
	color: #0054A7;}
.entry a:hover{
	text-decoration: none;
	color: #87B90A;}

#content .pdf{
	text-decoration: none;
	color: #0054A7;
	padding-left: 40px;
	height:25px;
	background-image: url(img/pdf_icon.jpg);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	margin:0px;
	padding-top: 10px;
	padding-bottom: 0px;
	vertical-align: middle;
}
#right-bar .pdf {
	text-decoration: none;
	padding-left: 32px;
	height:25px;
	background-image: url(img/pdf_icon_small.png);
	background-repeat: no-repeat;
	background-position: left center;
	display: block;
	margin:0px;
	padding-top: 10px;
	padding-bottom: 0px;
	vertical-align: middle;
}


#browserWarning {
	display:none;
	position: absolute;
	top: 143px;
	font-size: 18px;
	font-weight: bold;
	color: #003466;
	width: 300px;
	left: 46px;
}

.timetable .date {
	color: #003466;
	font-size: 25px;
	font-weight: bold;
}
.timetable .changeweek, .timetable .blank-last, .timetable .blank-next{
margin-top:10px;
	height: 26px;
	width: 108px;
}
.timetable .blank-last{float:left;}
.timetable .blank-next{float:right;}
.timetable .last {
	float:left;
	background-image: url(img/timetable/weeks.png);
	background-repeat: no-repeat;
	background-position: left top;
}
.timetable .next {
	float:right;
	background-image: url(img/timetable/weeks.png);
	background-repeat: no-repeat;
	background-position: right top;
	width: 95px;
}
.timetable .next:hover{
background-position: right -28px;
cursor:pointer;}

.timetable .last:hover{
background-position: left -28px;
cursor:pointer;}

.timetable .heading {
	text-align:center;
	font-size: 2em;
	font-weight: bold;
	color: #86B90B;
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
.timetable table {
	width: 100%;
	padding: 0px;
	clear: both;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
	text-align: left;
	color: #55478a;
}
.timetable th {
	text-align: left;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #b1b4c8;
	padding: 2px;
}
.timetable td {
	text-align: left;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #b1b4c8;
	padding-bottom: 8px;
	font-size: 12px;
	vertical-align: top;
}
.timetable .day {
	text-align: right;
	vertical-align: top;
	background-image: url(img/timetable-bg.jpg);
	background-repeat: repeat-y;
	background-position: right top;
	width: 80px;
}
.timetable .space {
	border: 0px none #FFFFFF;
	width: 20px;
}
.timetable td img {
	vertical-align: text-top;
	margin-left: 2px;
}
.timetable #arrow {
	background-image: url(img/timetable/arrow.png);
	background-repeat: no-repeat;
	background-position: 30px center;
	height: 60px;
	width: 560px;
	padding-top: 30px;
	font-weight: bold;
	padding-left: 100px;
	font-style: italic;
}
.timetable #deafultscreen {
	background-image: url(img/timetable/defaultscreen.jpg);
	background-repeat: no-repeat;
	height: 448px;
	width: 660px;
	background-position: center 78px;
}
#content-timetable .loading {
	position: absolute;
	height: 112px;
	width: 400px;
	left: 140px;
	top: 114px;
	background-position: center center;
	background-image: url(img/loading.gif);
	background-repeat: no-repeat;
}