/*

----- Footsteps Clinic screen stylesheet -----
----- Simon Kitson 2010 -----
----- www.kitsimons.com -----

----- enjoy. -----

----- Background Colours -----

Header Background: #0b2878

----- Foreground Colours -----

Red: #d5221e
Blue: #0b2878

----- Text Colours -----

Main Heading: #000
Main Body: #333
Link: #d5221e

----- Dimensions -----

Site Width: 760px
Column Width: 227px
Gutter Width: 20px 

*/

* {
	padding:0;
	margin:0;
}

/* ----- tags ----- */
body {
	background: #fff url(../images/content_bg.png) 50% 0 no-repeat;
	text-align: center; /* centre in IE */
	line-height: 1em;
	font: small Arial, Helvetica, sans-serif;
	color: #000;
}
body#map {
	background: #fff;
	padding-top: 20px;
}
a {
	color: #d5221e;
	outline: none;
}
a:hover {
	color: #0b2878;
}
a img {
	border: none;
}
em {
	color: #ff0202;
}
blockquote {

}
blockquote p {

}

/* ----- universal styles ----- */
.hide {
	display: none;
}
.centre {
	text-align: center;
}
.clear {
	clear: left;
}

/* ----- main containers & general text styles ----- */
.frame {
	position: relative;
	margin: 0 auto; /* centre in proper browsers */
	width: 760px;
}
.col-main {
	clear: left;
	float: left;
	width: 473px;
	margin-left: 20px;
	text-align: left;
	display: inline; /* fudge IE6 */
}
#about .col-main, #contact .col-main, #directions .col-main {
	width: 720px;
}
.col-sub {
	float: right;
	width: 227px;
	margin-right: 20px;
	text-align: left;
	display: inline; /* fudge IE6 */
}
.col-split {
	float: left;
	width: 350px;
	margin-left: 20px;
	text-align: left;
	display: inline; /* fudge IE6 */
}
.col-main p, .col-sub p, .col-split p {
	margin-bottom: 15px;
	color: #333;
}
.col-main p.note {
	font-size: 80%;
}
.col-main p, .col-main ul, .col-split ul {
	line-height: 120%;
}
.col-main ul, .col-split ul {
	color: #333;
}
.col-main p.intro, .col-split p.intro {
	font-size: 120%;
	font-weight: bold;
}
.col-main h2, .col-split h2 {
	width: 100%;
	font-size: 160%;
	line-height: 120%;
	color: #000;
	margin-bottom: 15px;
	padding-bottom: 6px;
	border-bottom: 1px solid #d5221e;
}
.col-main h2 span, .col-split h2 span {
	color: #333;
}
.col-main h3, .col-split h3 {
	width: 100%;
	font-size: 120%;
	color: #000;
	margin-bottom: 15px;
	padding-bottom: 6px;
	border-bottom: 1px solid #0b2878;
}
.col-main .hpc {
	float: left;
	margin-right: 10px;
	padding-bottom: 15px;
}
.col-main p.hpc-i {
	float: left;
	width: 380px;
	margin-top: 12px;
}
.col-sub p.det {
	margin-top: 30px;
}
.col-sub p.det-2 {
	margin-bottom: 25px
}
.col-main .gen-img, .col-split .gen-img {
	float: left;
	margin: 0 15px 15px 0;
}
#privacy .col-main ol {
	line-height: 120%;
	color: #333;
	margin-left: 15px;
	margin-bottom: 15px;
	list-style-type: lower-roman;
}
.row-full {
	clear: left;
	float: left;
	width: 740px;
	margin-bottom: 15px;
	display: inline; /* fudge IE6 */
	text-align: left;
	color: #333;
}

/* ----- header ----- */
#header {
	width: 100%;
	height: 107px;
	background: #0b2878 url(../images/header_bg.png) 50% 0 no-repeat;
	color: #fff;
	text-align: left;
}
#header .frame {
	height: 107px;
}
#header h1 {
	position: absolute;
	top: 10px;
	left: 10px;
	display: block;
	width: 146px;
	height: 66px;
}
#header h1 a {
	display: block;
	width: 146px;
	height: 66px;
	text-indent: -1000em;
	background: url(../images/footsteps_logo_2.png) 0 0 no-repeat;
}
#header p {
	position: absolute;
	right: 10px;
	bottom: 61px;
	font-size: 170%;
	font-weight: bold;
}
#header p.tel {
	position: absolute;
	width: 108px;
	height: 104px;
	bottom: -55px !important;
	bottom: -56px; /* fudge IE6 */
	right: 46px;
	text-indent: -1000em;
	background: url(../images/telephone_number.png) 0 0 no-repeat;
	z-index: 10;
}

/* ----- footer ----- */
#footer {
	clear: both;
	float: left;
	width: 100%;
	margin-top: 25px;
	padding-bottom: 20px;
	border-top: 1px solid #ccc;
	font: 80% Verdana, Arial, sans-serif;
	color: #333;
	text-align: left;
}
#footer .frame {
	width: 720px;
	padding: 10px 20px 0 20px;
}
#copy {
	float: left;
	margin-left: 10px;
}
#copy span {
	color: #999;
}
#legal {
	float: right;
	list-style: none;
}
#legal li {
	float: left;
	margin-left: 20px;
}
#ftstps {
	position: absolute;
	top: -25px;
	left: 0;
}

/* ----- masthead ----- */
#masthead {
	width: 758px;
	height: 180px;
	margin: -37px auto 0 auto;
}

/* ----- global navigation ----- */
#global-nav {
	float: left;
	width: 758px;
	height: 30px;
	margin: 0 1px 30px 1px;
	border-top: 1px solid #fff;
	background: #0b2878;
}
#global-nav ul {
	list-style: none;
	margin-left: 24px;
}
#global-nav ul li {
	float: left;
	margin-right: 10px;
}
#global-nav ul li a {
	display: block;
	height: 30px;
	text-indent: -1000em;
	background-position: 0 0;
	background-repeat: no-repeat;
}
#global-nav ul li a#nav1 {
	width: 54px;
	background-image: url(../images/nav/home.png);
}
#global-nav ul li a#nav2 {
	width: 129px;
	background-image: url(../images/nav/podiatry.png);
}
#global-nav ul li a#nav3 {
	width: 91px;
	background-image: url(../images/nav/treatments.png);
}
#global-nav ul li a#nav4 {
	width: 112px;
	background-image: url(../images/nav/advice.png);
}
#global-nav ul li a#nav5 {
	width: 110px;
	background-image: url(../images/nav/meet_the_team.png);
}
#global-nav ul li a#nav6 {
	width: 143px;
	background-image: url(../images/nav/contact.png);
}
#global-nav ul li a#nav7 {
	width: 93px;
	background-image: url(../images/nav/map_and_links.png);
}
#global-nav ul li a#nav8 {
	width: 125px;
	background-image: url(../images/nav/opening_and_prices.png);
}
#global-nav ul li a#nav9 {
	width: 150px;
	background-image: url(../images/nav/podiatry_and_chiropody.png);
}
#global-nav ul li a#nav10 {
	width: 113px;
	background-image: url(../images/nav/sports_therapy.png);
}
#global-nav ul li a:hover {
	background-position: 0 -130px;
}
#global-nav ul li a.current {
	background-position: 0 -260px;
}

/* ----- call to action boxes ----- */
.action-box {
	position: relative;
	width: 239px;
	height: 180px;
	margin: 0 -6px 10px -6px;
	background: url(../images/actionbox/gen_bottom.png) 0 100% no-repeat;
}
.action-box p {
	margin-bottom: 0;
	text-align: center;
	line-height: 0;
}
.action-box p a {
	display: block;
	width: 207px;
	height: 26px;
	text-indent: -1000em;
	background-position: 0 0;
	background-repeat: no-repeat;
	margin: 10px 16px 0 16px;
}
.action-box p a:hover {
	background-position: 0 -100px;
}
a.treatments {	
	background-image: url(../images/buttons/treatments.png);
}
a.practitioners {	
	background-image: url(../images/buttons/practitioners.png);
}
a.meet-team {	
	background-image: url(../images/buttons/meet_team.png);
}
a.contact {	
	background-image: url(../images/buttons/contact.png);
}
a.download-leaflet {
	background-image: url(../images/buttons/download_leaflet.png);
}
.action-box .footsteps {
	position: absolute;
	left: -6px;
	top: -19px;
	width: 68px;
	height: 68px;
	text-indent: -1000em;
	background: url(../images/actionbox/footsteps_disc.png) 0 0 no-repeat !important;
	background-image: url(../images/actionbox/footsteps_disc_8bit.png); /* pander to IE6s' lack of png alpha transparency support */
}
.download-box, .news-box {
	position: relative;
	width: 239px;
	height: 59px;
	margin: 0 -6px 10px -6px;
}
.download-box p a, .news-box p a {
	display: block;
	width: 239px;
	height: 59px;
	text-indent: -1000em;
	background-position: 0 0;
	background-repeat: no-repeat;
}
.download-box p a:hover, .news-box p a:hover {
	background-position: 0 -110px;
}
a.leaflet {	
	background-image: url(../images/buttons/leaflet.png);
}
a.newsletter {	
	background-image: url(../images/buttons/newsletter.png);
}
a.news {	
	background-image: url(../images/buttons/in_the_news.png);
}
a.news1 {	
	background-image: url(../images/buttons/in_the_news1.png);
}
a.news2 {	
	background-image: url(../images/buttons/in_the_news2.png);
}

/* ----- main content boxes boxes ----- */
.cnt-box, .cnt-box-2, .cnt-box-3 {
	clear: both;
	float: left;
	display: inline;
	width: 485px;
	margin: 0 -6px 15px -6px;
	padding-bottom: 6px;
	background: url(../images/content_box_bottom.png) 0 100% no-repeat;
}
.cnt-box {
	padding-bottom: 18px;
}
.cnt-box-2 {
	width: 350px;
	background: url(../images/content_box_bottom_2.png) 0 100% no-repeat;
}
.cnt-box-3 {
	width: 233px;
	background: url(../images/content_box_bottom_3.png) 0 100% no-repeat;
}
.cnt-box h4 {
	display: block;
	width: 453px;
	padding: 16px 16px 10px 16px;
	background: url(../images/content_box_top.png) 0 0 no-repeat;
	color: #d5221e;
	font-size: 110%;
}
.cnt-box h4 a {
	text-decoration: none;
}
.cnt-box .content {
	display: none;
}
.cnt-box p {
	margin: 0 16px 10px 16px;
}
.cnt-box ul {
	margin: 0 16px 10px 30px;
}
ul.list {
	margin: 0 16px 20px 30px;
}
.cnt-box .inner {
	width: 485px;
	height: 18px;
	background: url(../images/content_box_top.png) 0 0 no-repeat;
}
.cnt-box-2 .inner {
	width: 350px;
	height: 18px;
	background: url(../images/content_box_top_2.png) 0 0 no-repeat;
}
.cnt-box-3 .inner {
	width: 233px;
	height: 18px;
	background: url(../images/content_box_top_3.png) 0 0 no-repeat;
}
.cnt-box p.img {
	float: left;
	width: 100px;
	margin: 0 10px 10px 16px;
	display: inline;
}
.cnt-box p.img2 {
	float: right;
	margin: 0 16px 10px 10px;
	display: inline;
}
.cnt-box .inf {
	float: right;
	width: 353px;
	display: inline;
}
.cnt-box .inf h4 {
	width: auto;
	background: none;
	padding: 0;
	margin-bottom: 10px;
}
.cnt-box .inf p {
	margin-left: 0;
}
.row-full .cnt-box-2 {
	clear: none;
	float: left;
	display: inline;
	width: 350px;
	min-height: 245px;
	margin: 0 0 0 20px;
	padding-bottom: 6px;
	background: url(../images/content_box_bottom_2.png) 0 100% no-repeat;
}
.row-full .cnt-box-2 p.img {
	float: left;
	width: 100px;
	margin: 0 10px 10px 16px;
	display: inline;
}
.row-full .cnt-box-2 .inf {
	float: right;
	width: 202px;
	margin-right: 6px;
	padding-right: 10px;
	display: inline;
}
.cnt-box-2 .inf h4 {
	color: #d5221e;
	margin-bottom: 10px;
}
.cnt-box-2 .inf p {
	color: #333;
	margin-bottom: 10px;
}
.row-full .cnt-box-3 {
	clear: none;
	float: left;
	display: inline;
	width: 233px;
	min-height: 320px;
	margin: 0 0 0 13px;
	padding-bottom: 6px;
	background: url(../images/content_box_bottom_3.png) 0 100% no-repeat;
}
.row-full .cnt-box-3 p.img {
	float: right;
	width: 100px;
	margin: 0 0 10px 10px;
	display: inline;
}
.row-full .cnt-box-3 .inf {
	float: left;
	width: 201px;
	margin-left: 16px;
	display: inline;
}
.cnt-box-3 .inf h4 {
	color: #d5221e;
	margin-bottom: 10px;
	font-size: 1em;
}
.cnt-box-3 .inf p {
	color: #333;
	margin-bottom: 10px;
}

/* ----- tables ----- */
.stnd {
	width: 318px;
	margin: 0 16px 10px 16px;
	color: #333;
}
.stnd th, .stnd td {
	padding-bottom: 4px;
	text-align: left;
	vertical-align: top;
}
.stnd th {
	width: 160px;
}

/* ----- directions page ----- */
.map {
	clear: both;
	text-align: center;
	margin-top: 20px;
}


