/*
 *   ----------------------------------
 *   The Physiotherapy Centre
 *   ----------------------------------
 *   Copyright Sticky New Media - 2010
 *   ----------------------------------
 */

/* -------------- general -------------- */

html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

body {
  background-color: #EAEEF8;
  color: #333;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100.01%;
  text-align: center;
  margin-bottom: 20px;
}

a {
  outline: none;
}

a:link {
  color: #3154B8;
  cursor: pointer;
    outline: none;
}

a:visited {
  color: #3154B8;
  cursor: pointer;
    outline: none;
}

a:hover {
  color: #FF0000;
  cursor: pointer;
    outline: none;
}

.clearit {
  clear: both;
}


/* -------------- build -------------- */

#pageWrapper {
  background-image: url(/resources/images/backgroundTile.gif);
  background-repeat: repeat-y;
  background-position: left top;
  margin: 0 auto 0;
  text-align: left;
  width: 909px;
  background-color: #EAEEF8;
}


/* -------------- header -------------- */

#pageHeader {
  height: 123px;
  background-color: #FFF;
  margin: 0 4px 0 4px;
}

#mainLogo {
  float: left;
  height: 89px;
  width: 369px;
  margin: 32px 0 0 40px;
}

#pageHeaderBand {
  margin: 20px 4px 0 4px;
}

/* -------------- mini navigation -------------- */

#miniNav {
  float: right;
  background-color: #EAEEF8;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 70%;
  height: 32px;
  line-height: 32px;
  width: 358px;
  margin: 0 30px 0 0;
}

#miniNav .left {
  background-image: url(/resources/images/miniNavLeftCap.gif);
  background-repeat: no-repeat;
  background-position: left top;
  height: 32px;
}

#miniNav .right {
  background-image: url(/resources/images/miniNavRightCap.gif);
  background-repeat: no-repeat;
  background-position: right top;
  height: 32px;
}


#miniNav ul {
  float: left;
  list-style-type: none;
  margin: 0 0 0 8px;
  padding: 0;
  text-align: left;
  height: 32px;
}

#miniNav li {
  float: left;
  margin: 0 2px;
  padding: 0;
  height: 32px;
    outline: none;
}

#miniNav A:link {
  text-decoration: none;
}

#miniNav A:visited {
  text-decoration: none;
}

#miniNav A:hover {
  text-decoration: underline;
} 

/* -------------- main navigation -------------- */

#mainNav {
  float: right;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 95%;
  height: 32px;
  line-height: 32px;
  width: 450px;
  margin: 34px 6px 0 0;
}

#mainNav ul {
  float: left;
  list-style-type: none;
  margin: 0 12px;
  padding: 0;
  text-align: left;
  height: 32px;
}

#mainNav li {
  float: left;
  margin: 0 12px;
  padding: 0;
  height: 32px;
    outline: none;
}

#mainNav A:link {
  text-decoration: none;
}

#mainNav A:visited {
  text-decoration: none;
}

#mainNav A:hover {
  text-decoration: none;
  color: #F26522;
  border-bottom: 4px solid #FCE0D3;
} 

/* -------------- home welcome image -------------- */

#homeImage {
  background-image: url(/resources/images/homeMainImage.jpg);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0 0 0 4px;
  padding: 0;
  height: 327px;
  width: 901px;
}

#homeImage h1 {
  display: none;
}

#homeImage p {
  position: absolute;
  margin: 173px 0 0 43px;
  padding: 0;
  width: 390px;
  color: #FFF;
  font-size: 85%;
  line-height: 145%;
}


/* -------------- home content -------------- */

#homeContent {
  background-image: url(/resources/images/homeImageCap.png);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0 4px 0 4px;
  padding: 10px 25px 0 40px;
  text-align: left;  
  background-color: #FFF;
  overflow: auto;
}


#intro {
  float: left;
}

#intro h1 {
  color: #3154B8;
  font-weight: normal;
  font-size: 170%;
  margin: 20px 0 10px 0;
  font-family: Tahoma, Arial, Helvetica, sans-serif;
}

#intro p {
  color: #3154B8;
  font-size: 95%;
  margin: 15px 0;
}

#promoCol {
  float: right;
  width: 395px;
}

#promoCol .bookAppButton {
  float: right;
  width: 205px;
  height: 45px;
  margin: 0 15px 0 0;
}

#promoCol .bookAppButton a {
  display: block;
  width: 205px;
  height: 45px;
}

#promoCol .bookAppButton a span {
  display: none;
}

#promoCol .promoBoxout {
  background-image: url(/resources/images/homePromoBoxes/physiotherapyBox.jpg);
  background-repeat: no-repeat;
  background-position: left top;
  width: 382px;
  height: 214px;
  margin: 39px 0 0 0;
  padding: 13px;
}

#promoCol .promoBoxout h2 {
  color: #3154B8;
  font-weight: normal;
  font-size: 120%;
  padding: 15px 0 0 0;
}

#promoCol .promoBoxout p {
  font-size: 75%;
  margin: 7px 0;
  width: 170px;
  color: #666;
}

#serviceBox2,
#serviceBox3,
#serviceBox4,
#serviceBox5,
#serviceBox6,
#serviceBox7,
#serviceBox8,
#serviceBox9,
#serviceBox10,
#serviceBox11,
#serviceBox12 {
  display: none;
}


/* -------------- services box nav matrix -------------- */

#boxNav {
  float: left;
  width: 440px;
  margin: 0 0 15px 0;
}

#boxNav .servicesBox {
  float: left;
  width: 101px;
  height: 60px;
  border: 1px solid #A8B7E1;
  font-family: Arial, Helvetica, sans-serif;
  color: #3154B8;
  font-weight: bold;
  font-size: 75%;
  margin: 0 5px 6px 0;
}

#boxNav .servicesBox.one {
  background-image: url(/resources/images/servicesBoxNav/servicesBoxFill1.gif);
  background-repeat: no-repeat;
  background-position: left top;
  width: 101px;
  height: 60px;
}

#boxNav .servicesBox.two {
  background-image: url(/resources/images/servicesBoxNav/servicesBoxFill2.gif);
  background-repeat: no-repeat;
  background-position: left top;
  width: 101px;
  height: 60px;
}

#boxNav .servicesBox.three {
  background-image: url(/resources/images/servicesBoxNav/servicesBoxFill3.gif);
  background-repeat: no-repeat;
  background-position: left top;
  width: 101px;
  height: 60px;
}

#boxNav .servicesBox.four {
  background-image: url(/resources/images/servicesBoxNav/servicesBoxFill4.gif);
  background-repeat: no-repeat;
  background-position: left top;
  width: 101px;
  height: 60px;
}

#boxNav .servicesBox.one a, 
#boxNav .servicesBox.two a, 
#boxNav .servicesBox.three a, 
#boxNav .servicesBox.four a {
  display: block;
  width: 89px;
  height: 14px;
  padding: 23px 6px;
  text-decoration: none;
}

#boxNav .servicesBox.one A:hover, 
#boxNav .servicesBox.two A:hover, 
#boxNav .servicesBox.three A:hover, 
#boxNav .servicesBox.four A:hover {
  color: #FFF;
  background-color: #3154B8;
}

#boxNav .servicesBox.one.active,
#boxNav .servicesBox.two.active,
#boxNav .servicesBox.three.active,
#boxNav .servicesBox.four.active {
  display: block;
  background-image: none;
  background-color: #3154B8;
  width: 101px;
  height: 60px;
}

#boxNav .servicesBox.one.active a,
#boxNav .servicesBox.two.active a,
#boxNav .servicesBox.three.active a,
#boxNav .servicesBox.four.active a{
  display: block;
  width: 89px;
  height: 14px;
  padding: 23px 6px;
  color: #FFF;
  text-decoration: none;
}

#boxNav .servicesBox.one.double a, 
#boxNav .servicesBox.two.double a, 
#boxNav .servicesBox.three.double a, 
#boxNav .servicesBox.four.double a {
  display: block;
  width: 89px;
  height: 30px;
  padding: 15px 6px;
  text-decoration: none;
}

#boxNav .servicesBox.one.double A:hover, 
#boxNav .servicesBox.two.double A:hover, 
#boxNav .servicesBox.three.double A:hover, 
#boxNav .servicesBox.four.double A:hover {
  color: #FFF;
  background-color: #3154B8;
}

#boxNav .double.active {
  display: block;
  background-image: none;
  background-color: #3154B8;
  width: 101px;
  height: 60px;
}

#boxNav .double.active a {
  display: block;
  width: 89px;
  height: 30px;
  padding: 15px 6px;
  color: #FFF;
  text-decoration: none;
}


/* -------------- general content -------------- */

#pageContent {
  background-image: url(/resources/images/pageVerticalTelNumber.gif);
  background-repeat: no-repeat;
  background-position: 823px 245px;
  margin: 0 4px 0 4px;
  padding: 20px 40px 10px;
  text-align: left;  
  background-color: #FFF;
  overflow: auto;
}

#pageContentInfo {
  background-image: url(/resources/images/pageVerticalTelNumber.gif);
  background-repeat: no-repeat;
  background-position: 823px 25px;
  margin: 0 4px 0 4px;
  padding: 20px 40px 10px;
  text-align: left;  
  background-color: #FFF;
  overflow: auto;
}

#pageSectionImage {
  float: right;
  border: 1px solid #A8B7E1;
  margin: 0;
  padding: 0;
}

#pageContent h1,
#pageContentInfo h1 {
  color: #3154B8;
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 170%;
  margin: 5px 0 10px 0;
  width: 600px;
}

#pageContent h1.last,
#pageContentInfo h1.last {
  color: #3154B8;
  font-weight: normal;
  font-size: 170%;
  margin: 30px 0 10px 0;
  width: 620px;
}

#pageContent p,
#pageContentInfo p {
  margin: 10px 0;
  width: 620px;
  color: #666;
  font-size: 80%;
  line-height: 135%;
}

#pageContent h2,
#pageContentInfo h2 {
  color: #3154B8;
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-weight: normal;
  font-size: 110%;
  margin: 20px 0 10px 0;
  width: 600px;
}

#pageContent ul,
#pageContentInfo ul {
  color: #666;
  line-height: 135%;
  margin-left: 0; 
  padding-left: 16px;
}

#pageContent li,
#pageContentInfo li {
  color: #666;
  line-height: 135%;
  margin-left: 0; 
  padding-left: 0;
  font-size: 80%;
}


#pageContent div.hr,
#pageContentInfo div.hr {
  background-color: #999;
  height: 1px;
  width: 80%;
}

#pageContent div.hr hr,
#pageContentInfo div.hr hr {
  display: none;
}


/* -------------- prices screen -------------- */

#priceTable td {
  font-size: 75%;
  color: #666;
}

#priceTable td h3 {
  color: #FFF;
  margin: 0; 
  padding: 0;
}

#priceTable tr.headRow {
  background-color: #5e7eda;
}

#priceTable tr.altRow {
  background-color: #efefef;
}

#priceTable tr.altRow1 {
  background-color: #ebf0fe;
}


/* -------------- contact us screen -------------- */

#contactForm,
#appointmentForm {
    margin: 5px 0;
    padding: 10px 20px 20px 20px;
  width: 300px;
    background-color: #efefef;
}

#contactForm input,
#appointmentForm input {
    margin: 5px 0;
    padding: 0;
  width: 300px;
    height: 22px;
    line-height: 15px;
  font-size: 80%;
    color: #666;
}

#appointmentForm input.dateInput {
  width: 175px;
}

#contactForm textarea,
#appointmentForm textarea {
    display: block;
    margin: 5px 0;
    padding: 0;
  width: 300px;
    height: 130px;
  font-size: 80%;
    color: #666;
}

#contactForm label,
#appointmentForm label {
    display: block;
    color: #3154B8;
  font-weight: bold;
  font-size: 80%;
    margin: 9px 0 0 0;
    padding: 0;
}

#contactForm input:focus,
#appointmentForm input:focus {
  background: #fcfcdb;
}

#contactForm textarea:focus,
#appointmentForm textarea:focus {
  background: #fcfcdb;
}

#contactForm #submit {
    margin: 10px 0 0 0;
    padding: 0;
  width: 125px;
    height: 23px;
    color: #000;
}

#appointmentForm #submit {
    margin: 10px 0 0 0;
    padding: 0;
  width: 190px;
    height: 23px;
    color: #000;
}

.required {
    color: #FF0000;
  font-weight: bold;
}


/* -------------- footer -------------- */

#footer {
  background-image: url(/resources/images/pageFooterBox.gif);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 20px 0 0 0;
  padding: 0px;
  text-align: left;
  height: 40px;
  width: 909px;
  color: #FFF;
  background-color: #3154B8;
}

.footerNav {
  float: left;
  font-size: 70%;
  padding: 0 0 0 45px;
  text-align: left;
  width: 565px;
  line-height: 34px;
  height: 34px;
}

.footerCopyright {
  float: right;
  font-size: 70%;
  padding: 0 45px 0 0;
  text-align: right;
  width: 250px;
  line-height: 34px;
  height: 34px;
}

#footer A:link {
  color: #FFF;
  text-decoration: none;
}

#footer A:visited {
  color: #FFF;
  text-decoration: none;
}

#footer A:hover {
  color: #FFF;
  text-decoration: underline;
}


/* -------------- call to action links -------------- */

#callToActionHead {
  margin: 0 0 0 10px;
  padding: 10px 0 10px 0;
  font-weight: normal;
  font-size: 120%;
  border-bottom: 2px solid #FCE0D3;
}

.actionBookApptLink {
  background-image: url(/resources/images/actionBookIcon.gif);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0;
  padding: 0 0 0 20px;
}

.actionGenericLink {
  background-image: url(/resources/images/actionGenericIcon.gif);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0 0 0 10px;
  padding: 0 0 0 20px;
}

.actionContactLink {
  background-image: url(/resources/images/actionContactIcon.gif);
  background-repeat: no-repeat;
  background-position: left top;
  margin: 0 0 0 10px;
  padding: 0 0 0 20px;
}