/*	SARAH GREENWOOD - PERSONAL TRAINER | PILATES TEACHER | NUTRITION ADVISOR
	by Green Pickle Design
	VERSION 1.0
	
	CONTENTS ----------
	
	   1.BODY/WRAPPER
	   2.HEADINGS
	   3.LINKS
	   4.BRANDING/MASTHEAD
	   5.MAIN CONTENT
	   6.COLUMNS/SIDEBAR
	   7.COLUMNS/SIDEBAR BOXES
	   8.NAVIGATION
	   9.FOOTER
	   10.FORM STYLING
	   11.COMMON
	   12.EXTRAS
	   
    -------------------
*/


/* 1.BODY/WRAPPER
---------------------------------------------------------------------- */

body {
	margin: 40px 0 30px 0;
	padding: 0;
	font: 70% 'Lucida Grande',Verdana, Helvetica, sans-serif;
	line-height: 1.6em;
	color: #000;
	background: #d10f17 url(../img/background.png) repeat-x;
}

#wrapper {
	width: 750px;
	margin: 0 auto;
}



/* 2.HEADINGS
---------------------------------------------------------------------- */

h2 {
	margin: 5px 0 0 0;
	height: 32px;
	text-indent: -9999px;
	background:url(../img/header-home.gif) no-repeat;	
}

/* Swaps H2 Image depending body ID  --------------------- */

#about h2 { background:url(../img/header-about.gif) no-repeat; }
#pt h2 { background:url(../img/header-pt.gif) no-repeat; }
#pilates h2 { background:url(../img/header-pilates.gif) no-repeat; }
#massage h2 { background:url(../img/header-massage.gif) no-repeat; }
#nutrition h2 { background:url(../img/header-nutrition.gif) no-repeat; }
#testimonials h2 { background:url(../img/header-testimonials.gif) no-repeat; }
#pricing h2 { background:url(../img/header-pricing.gif) no-repeat; }
#contact h2 { background:url(../img/header-contact.gif) no-repeat; }
#further h2 { background:url(../img/header-further.gif) no-repeat; }


h3 {
	font-size: 1.1em;
	color: #d30e17;
	margin: 0 0 1.2em 0;
}

h4 {
	font-size: 1em;
	text-transform: uppercase;
}



/* 3.LINKS
---------------------------------------------------------------------- */

a {
	outline: none;
	text-decoration: none;
	border-bottom: 1px solid #d5d0c2;
	color: #d30e17;
}

a:hover {
	border-bottom: 1px solid #d30e17;
}

#footer a {
	color: #fff;
	border-bottom: 0;
}

#footer a:hover {
	border-bottom: 1px solid #fff;
}



/* 4.BRANDING/MASTHEAD
---------------------------------------------------------------------- */

#logo {
	width: 750px;
	height: 45px;
	background: url(../img/logo-bgd.gif);

}

#logo h1 {
	margin: 0px;
	width: 314px;
	height: 45px;
	text-indent: -9999px;
}

#logo h1 a {
	display: block;
	width: 314px;
	height: 45px;
	border-bottom: 0;
	text-indent: -9999px;
}
	
#logo h1 a:hover {
	background: url(../img/logo.gif) 0 -46px no-repeat;
}

#home #logo h1 a:hover {
	background: url(../img/logo.gif) no-repeat;
	cursor: default;
}

#mainImage {
	width: 750px; 
	height: 237px;
	text-indent: -9999px;
}

/* Swaps Main Image depending body ID --------------------- */
#home #mainImage { background: url(../img/main-img-home.jpg) no-repeat; }
#about #mainImage { background: url(../img/main-img-about.jpg) no-repeat; }
#pt #mainImage { background: url(../img/main-img-pt.jpg) no-repeat;}
#pilates #mainImage { background: url(../img/main-img-pilates.jpg) no-repeat; }
#massage #mainImage { background: url(../img/main-img-massage.jpg) no-repeat; }
#nutrition #mainImage { background: url(../img/main-img-nutrition.jpg) no-repeat; }
#testimonials #mainImage { background: url(../img/main-img-testimonials.jpg) no-repeat; }
#pricing #mainImage { background: url(../img/main-img-pricing.jpg) no-repeat; }
#contact #mainImage { background: url(../img/main-img-contact.jpg) no-repeat; }
#further #mainImage { background: url(../img/main-img-further.jpg) no-repeat; }



/* 5.MAIN CONTENT
---------------------------------------------------------------------- */

#container {
	position: relative;
	width: 750px;
	padding-bottom: 15px;
	background: url(../img/container-bgd.gif) top left repeat-x;
}

* html #content {
	height: 1%;
}

#content {
	height: 1%;
	margin: 0 10px 0 183px;
	background: url(../img/content-bgd.png) top left repeat-y;
}

#contentBottom {
	position: relative;
	margin: 0 10px 0 183px;
	height: 22px;
	background: transparent url(../img/content-bot.png) center left no-repeat;
}



/* 6.COLUMNS/SIDEBAR
---------------------------------------------------------------------- */

#leftCol {
	margin: 0 0 0 28px;
	width: 322px;
	float: left;
	display: inline; /* fixes double margin float bug */
}

#rightCol {
	margin-right: 5px;
	width: 182px;
	float: right;
	display: inline; /* fixes double margin float bug */
}

#sideBar {
	margin: 0;
	position: absolute;
	top: -22px;
	left: 10px;
	width: 170px;
	z-index: 100;
}

#sideBarTop {
	width: 170px;
	height: 16px;
	background: url(../img/sideBar-top.png) top left no-repeat;
}

#sideBarMiddle {
	width: 170px;
	background: url(../img/sideBar-bgd.png) top left repeat-y;
}

#sideBarBottom {
	margin: 0;
	width: 170px;
	height: 11px;
	background: url(../img/sideBar-bot.png) top left no-repeat;
}



/* 7.COLUMNS/SIDEBAR BOXES
---------------------------------------------------------------------- */

#leftCol h3 {
	margin: 0.4em 0 1em 0;
	padding: 0.4em 0 0.4em 0;
	border-top: 1px solid #e0dbce;
	border-bottom: 1px solid #e0dbce;
}

#leftCol p {
	margin: 0;
	padding-bottom: 1em;
}

.contactClick {
	width: 182px;
	height: 40px;
	background: url(../img/contact-click.jpg) no-repeat;
	text-indent: -9999px;
}

.contactClick a {
	display: block;
	height: 40px;
	border-bottom: 0;
	background: url(../img/contact-click.jpg) no-repeat;
}

.contactClick a:hover {
	display: block;
	height: 40px;
	border-bottom: 0;
	background: url(../img/contact-click.jpg) 0 -40px no-repeat;
}

#contact .contactClick a {
	display: block;
	height: 40px;
	border-bottom: 0;
	background: url(../img/contact-click.jpg) 0 -40px no-repeat;
	cursor: default;
}

#rightCol h4 {
	margin: 0 15px 11px 18px;
	padding: 0;
	height: 1em;
	line-height: 1em;
	color: #d30e17;
	background: url(../img/header-hatch.gif) repeat;
}

#rightCol span {
	background-color: #FFFFFF;
	height: 1em;
	line-height: 1em;
	padding-right: 0.2em;
}

#rightCol p {
	margin: 0;
	padding: 0 15px 15px 18px;
}

#leftCol ul {
	margin-bottom: 12px;
	padding: 0;
	list-style-type: none;
}

#rightCol ul {
	margin: 0;
	padding: 0 15px 15px 18px;
	list-style-type: none;
}

#leftCol ul {
	margin: 0 0 1em 0;
	padding: 0;
}

#leftCol li, #rightCol li {
	margin: 0;
	background: url(../img/bullet.gif) no-repeat left 6px;
	padding-left: 14px;
}

#sideBar h4 {
	margin: 0 5px 0 5px;
	padding: 20px 15px 10px 15px;
	color: #fff;
	background: url(../img/sideBar-header-bgd.jpg) no-repeat;
}

#sideBar p {
	margin: 0 5px 0 5px;
	padding: 0 13px 15px 13px;
	color: #fff;
}

.divider {
	height: 20px;
	background: url(../img/rightCol-header-bgd.gif) no-repeat;
}

#sideBar .divider {
	margin: 0 5px 0 5px;
	height: 20px;
	background: url(../img/sideBar-header-bgd.jpg) no-repeat;
}

.wp1 {
	margin-bottom: 1.2em;
	float: left;
	width: 155px;
}

#leftCol .wp1 p {
	padding: 0.3em 0;
}

#leftCol .wp1 ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#leftCol .wp1 li {
	margin: 0;
	background: none;
	padding-left: 0;
}

.wp2 {
	margin-bottom: 1.2em;
	float: right;
	width: 155px;
}

#leftCol .wp2 p {
	padding: 0.3em 0;
}

#leftCol .wp2 ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#leftCol .wp2 li {
	margin: 0;
	background: none;
	padding-left: 0;
}



/* 8.NAVIGATION
---------------------------------------------------------------------- */

#sideBar ul {
	margin: 0 16px 10px 16px;
	padding: 0;
}

#sideBar ul a {
	padding: 0.3em 8px;
	border-bottom: 2px solid #b11519;
	display: block;
	color: #e0dcbe;
	text-decoration: none;
	background: #bd1319;
}

#sideBar ul a:hover {
	color: #fff;
	background: #d30e17;
}

#sideBar ul li {
	display: inline; /* Removes large gaps in IE/Win */
}

/* Highlight current page */

#home #sideBar ul .home,
#about #sideBar ul .about,
#pt #sideBar ul .pt,
#pilates #sideBar ul .pilates,
#massage #sideBar ul .massage,
#nutrition #sideBar ul .nutrition,
#testimonials #sideBar ul .testimonials,
#pricing #sideBar ul .pricing,
#contact #sideBar ul .contact,
#further #sideBar ul .further {
	color: #fff;
	background: #d30e17 url(../img/nav-arrowhead.gif) right 50% no-repeat;
	cursor: default;
}



/* 9.FOOTER
---------------------------------------------------------------------- */

#footer {
	position: relative;
	width: 750px;
	height: 50px;
	margin: 2px auto 0 auto;
	color: #FFFFFF;
	font-size: 0.8em;
}

.telephone {
	position: absolute;
	width: 500px;
	left: 18px;
}

.copyright {
	position: absolute;
	right: 18px;
}



/* 10.FORM STYLING
---------------------------------------------------------------------- */
/* Contact Form --------------------- */

legend {
	display: none;
}

fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

#leftCol form {
	margin: 0;
	padding: 0;
	width: 322px;
}

#leftCol form h4 {
	margin: 0 0 0.5em 0;
	color: #d30e17;
	font-size: 1.1em;
	text-transform: none;
}

#leftCol label {
	display: block;
	padding-bottom: 0.5em;
}

#leftCol input, #leftCol textarea {
	margin: 0;
	border: 1px solid #d30e17;
	padding: 0.3em 0.2em;
	font-size: 1em;
} 

#leftCol textarea {
	width: 310px;
}

.row {
	width: 322px;
	float:left;
}

.row p {
	display: block;
	width: 161px;
	float: left;
}

.row p input {
	width: 148px;
	margin: 0;
}

input.submit {
	border: 0;
	width: 6em;
	font-size: 1em;
	color: #fff;
	background-color: #d30e17;
}

/* Newsletter Form --------------------- */

#sideBar form {
	margin: 0;
	padding: 0;
}

#sideBar form p {
	margin: 0;
	padding: 0.2em 0 1em 0;
}

#sideBar fieldset {
	margin: 0 5px;
	padding: 0 12px;
}

#sideBar h4 {
	margin: 0;
	padding: 0;
	text-transform: uppercase;
	font-size: 1em;
	font-weight: bold;
	color: #FFF;
	background: none;
}

#sideBar label {
	display: none;
}

#sideBar input {
	margin: 6px 0 3px 0;
	padding: 0.3em 0.2em;
	width: 100px;
	border: 0;
	color: #666;
	font-size: 1em;
}

#sideBar input.submit {
	border: 0;
	margin: 0 0 0 4px;
	padding-top: 7px;
	vertical-align: top;
	width: auto;
	background: transparent;
	font-size: 1em;
}



/* 11.COMMON
---------------------------------------------------------------------- */

img {
	border: 0px;
}

.imgRight {
	float: right;
	margin: 2px 0 5px 20px;
	padding: 0;
	border: 3px solid #e0dbce;
}

.imgLeft {
	float: left;
	margin: 2px 20px 5px 0;
	padding: 0;
	border: 3px solid #e0dbce;
}

.clear {
	clear: both;
}

.rightFloat {
float: right;
}

.leftFloat {
float: left;
}

blockquote {
	font-style: italic;
	margin: 0 0 0 15px;
}



/* 12.EXTRAS
---------------------------------------------------------------------- */

.print {
	background: url(../img/print.gif) 0 50% no-repeat;
	padding-left: 25px;
}

.bold {
	font-weight: bold;
	color: #d30e17;
}
