body { background: #fff; line-height: 1.5em; padding: 20px 0; text-align: center; font-family: arial, verdana, sans-serif; font-size: 80%; }

h1, h2, h3, h4 { margin-bottom: 15px; font-weight: bold; color: #005396; }
p, ul, ol { margin-bottom: 15px; }
strong { font-weight: bold; }

a, a:link, a:visited, a:hover, a:active { color: #d57a22; text-decoration: underline; }
a:hover { text-decoration: none; }

.wrapper, .feature, .feature-sub { width: 960px; margin: 0 auto; text-align: left; }

.tel { white-space: nowrap }

#header { overflow: auto; }
#header h1 {  background: url(../images/logo-header.jpg) no-repeat; display: block; height: 118px; width: 280px; float: left; text-indent: -9999em; }

#nav ul { float: right; }
#nav ul li { float: left; margin-right: 10px; }
#nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active { display: block; color: #005396; font-weight: bold; text-decoration: none; padding: 6px; }
#nav a:hover { -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; border-radius: 0.5em; background: #eee; }

.home .home a, .who .who a, .common .common a, .treatments .treatments a, .healthcare .healthcare a, .contact .contact a 
{ -moz-border-radius: 0.5em; border-radius: 0.5em; background: #eee; }

#feature { background: url(../images/bg-body.jpg) repeat-x; height: 343px; position: relative; top: -15px; }
#feature div.feature { background: transparent url(../images/bg-feature.gif) no-repeat; height: 343px; position: relative; }
#feature h2 { position: absolute; top: 100px; left: 0px; width: 580px; height: 54px; 
background: transparent url(../images/title-achieve.png) no-repeat; text-indent: -9999em; }
#feature ul { position: absolute; top: 180px; left: 5px; }
#feature ul li.button { float: left; margin-right: 20px; padding-left: 15px; background: url(../images/bg-button.gif) no-repeat; height: 55px; }
#feature ul li.button a { padding-right: 15px; background: url(../images/bg-button-2.gif) repeat-x top right; display: block; height: 55px; }
#feature ul li.button a, #feature ul li.button a:link, #feature ul li.button a:visited, #feature ul li.button a:hover, #feature ul li.button a:active 
{ color: #fff; font-size: 1.4em; padding-top: 17px; text-decoration: none; }
#feature ul li.button a:hover { text-decoration: underline; }

#feature-sub { background: url(../images/bg-body-sub.jpg) repeat-x; height:147px; position: relative; top: -15px; }
#feature-sub div.feature-sub { background: transparent url(../images/bg-feature-sub.jpg) no-repeat; height: 147px; position: relative; }
#feature-sub hr { display: none; }

#content { width: 580px; margin-left: 10px; float: left;  margin-right: 80px; margin-bottom: 60px; }

#content h2 { font-size: 2.5em; line-height: 1.5em; }
#content h2.home { font-size: 1.8em; line-height: 1.5em; }
#content ul li, #footer ul li { clear: left; padding-left: 20px; background: url(../images/bg-list-blue.gif) no-repeat; }
#content h3 { font-size: 1.5em; }

#content ul.plain li { background: none; }

.subcontent { float: left; width: 280px; margin-top: 40px; }

.quote { margin-bottom: 15px; }
.quote li { background: #005396; }
.quote li p { padding: 10px 15px; margin: 0; color: #fff; font-weight: bold; }
.quote li p.img { padding: 0px; }
.quote li p cite { display: block; text-align: right; font-style: italic; }

.cta h3 { font-size: 2em; color: #018834; }
.cta p { color: #005396; font-size: 1.2em; font-weight: bold; line-height: 1.4em; }

#footer { clear: both; margin-top: 30px; margin-left: 10px; }

#footer .news { width: 280px; float: left;font-size: 1.1em; }

#footer .news h4 {  background: url(../images/ft-title-news.jpg) no-repeat; display: block; height: 71px; 
width: 280px; float: left; text-indent: -9999em; margin-bottom: 20px; }
#footer .news ul li { margin-bottom: 6px; }
#footer .news a {  color: #777; font-weight: bold; text-decoration: none; }
#footer .news a:hover { text-decoration: underline; }

#footer .parkrun { color: #005396; font-weight: bold; }
#footer .parkrun a { color: #018834; }
#footer .parkrun img { float: left; margin-right: 10px; }


#footer .locations { width: 340px; float: left;font-size: 1.1em; margin-left: 20px; color: #777; }
#footer .locations p { margin-bottom: 10px; }
#footer .locations h4 {  background: url(../images/ft-title-locations.jpg) no-repeat; display: block; height: 71px; 
width: 340px; float: left; text-indent: -9999em; margin-bottom: 25px; }
#footer .tel { font-size: 1.5em;  color: #018834; font-weight: bold; }
.postal-code { white-space: nowrap; }
.vcard { margin-bottom: 25px; }

#footer .injuries { width: 280px; float: left;font-size: 1.1em; margin-left: 20px; color: #777; }
#footer .injuries h4 { background: url(../images/ft-title-injuries.jpg) no-repeat; display: block; height: 71px; 
width: 340px; float: left; text-indent: -9999em; margin-bottom: 25px; }

#footer h5 { color: #005396; font-weight: bold; margin-bottom: 15px; font-size: 1.6em; line-height: 1.4em; }

#footer .injuries ul li { background: none; margin-bottom: 10px; padding: 0; }
#footer .injuries a { color: #018834; font-weight: bold; text-decoration: none; }
#footer .injuries a:hover { text-decoration: underline; }


#content form ul li { clear: both; margin-bottom: 10px; overflow: hidden; background: none; padding: 10px;}
form label.text-label { display: block; font-weight: bold; width: 230px; float: left; margin-right: 20px; }

form .buttons { display: block; float: left; width: 280px; }
form textarea { width: 200px; }
input[type="text"] { width: 200px; }
input.submit {margin-left: 250px;}

#content form ul li.alt { background: #f6f6f6; padding: 10px; }

#consult .consult-links { position: relative; margin-left: 30px; }
#consult ul li.foot { position: absolute; top: 410px; left: 45px; }
#consult ul li.shin { position: absolute; top: 360px; left: 45px; }
#consult ul li.calf { position: absolute; top: 360px; left: 165px; }
#consult ul li.knee { position: absolute; top: 320px; left: 23px; }
#consult ul li.ankle { position: absolute; top: 420px; left: 163px; }
#consult ul li.thigh { position: absolute; top: 270px; left: 168px; }
#consult ul li.shoulder { position: absolute; top: 90px; left: 0px; }
#consult ul li.lower-back { position: absolute; top: 199px; left: 168px; background: #fff; opacity: 0.8; }
#consult ul li.elbow { position: absolute; top: 150px; left: 220px; }
#consult ul li.neck { position: absolute; top: 55px; left: 155px; }

#consult ul li a { font-size: 1.2em; color: #000; font-weight: bold; }

.modal { 
    background-color:#fff; 
    display:none; 
    width:350px; 
    padding:15px; 
    text-align:left; 
    border:2px solid #333; 
    opacity:1; 
    -moz-border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-box-shadow: 0 0 50px #ccc; 
    -webkit-box-shadow: 0 0 50px #ccc; 
} 
 
.modal h2 { 
    margin:0px; 
    padding:10px 0 10px 0px; 
    font-size: 1.8em; 
}
div.close { 
    background-image:url(../images/close.png); 
    position:absolute; right:5px; top:5px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

a.pdf { /*The background image*/
	background: url(../images/icons/pdf.png) no-repeat left center;
	padding-left: 25px;
	line-height: 16px; /* To center the text vertically with the icon */
}
a.word { /*The background image*/
	background: url(../images/icons/word.gif) no-repeat left center;
	padding-left: 25px;
	line-height: 16px; /* To center the text vertically with the icon */
}

/* root element for tabs  */
#content ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #666;	
	display: block;
	width: 100%;
}

/* single tab */
#content ul.tabs li { 
	float:left;
	clear: none;
	width: 174px;
	display: block;
	text-indent:0;
	padding: 0;
	margin:0 !important;
	list-style-image: none !important; 
}

/* link inside the tab. uses a background image */
#content ul.tabs a { 
	background: url(../images/bg-blue-tabs.png) no-repeat -652px 0;
	display:block;
	height: 30px;  
	font-size: 1.5em;
	line-height:30px;
	width: 111px;
	text-align:center;	
	text-decoration:none;
	color:#000;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

#content ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
#content ul.tabs a:hover {
	background-position: -652px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
#content ul.tabs a.current, #content ul.tabs a.current:hover, #content ul.tabs li.current a {
	background-position: -652px -62px;		
	cursor:default !important; 
	color:#000 !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
#content ul.tabs a.w1 	{ background-position: -519px 0; width:134px; }
#content ul.tabs a.w1:hover 	{ background-position: -519px -31px; }
#content ul.tabs a.w1.current { background-position: -519px -62px; }

/* width 2 */
#content ul.tabs a.w2 { background-position: -366px -0px; width:154px; }
#content ul.tabs a.w2:hover 	{ background-position: -366px -31px; }
#content ul.tabs a.w2.current { background-position: -366px -62px; }


/* width 3 */
#content ul.tabs a.w3 { background-position: -247px -0px; width:174px; }
#content ul.tabs a.w3:hover 	{ background-position: -247px -31px; }
#content ul.tabs a.w3.current { background-position: -247px -62px; }

/* width 4 */
#content ul.tabs a.w4 { background-position: -0px -0px; width:194px; }
#content ul.tabs a.w4:hover 	{ background-position: -0px -31px; }
#content ul.tabs a.w4.current { background-position: -0px -62px; }

#content div.panes div.vcard { padding: 20px; }

/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;
}
#content ul.testimonials {list-style-type: none;}
#content ul.testimonials li { border-left: 5px solid #ccc; padding: 0px 10px; margin-bottom: 20px; list-style-type: none; background-image: none; overflow: hidden; }
#content ul.testimonials li img {float: left; margin-right: 10px;}
blockquote { font-size: 1.2em; margin-bottom: 5px; }
#content ul.testimonials li p {margin: 0;}
.error { color: #cc0000; font-weight: bold; }

.new-button { font-size: 1.6em; text-align: center; margin-bottom: 30px; }