﻿/************************************************************  Reset */
html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td {
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  background: transparent;
  }  

body {
  font-size: small;
  font-family: 'Trebuchet MS', 'Geneva CE', lucida, sans-serif;
  line-height: 1.6em;
	background: #fff url(../images/bg.jpg) top center repeat-x;
	color: #826955;
  }

html, body {
  height: 100%;
  }

a:link {
  color: #7f9a4a;
  }

a:visited {
  color: #7f9a4a;
  }
  
a:hover {
  color: #9c6c51;
  }

p {
  padding: 0.7em 0;
  }

strong {
  color: #476418;
  }
  
blockquote {
  text-align: center;
  font-style: italic;
  padding: 10px 0;
  }

h1 {
  margin: 0 auto;
  overflow: hidden;
  font-size: 1.9em;
  }

h1, h1 span {
  position: relative;
  top: 20px;
  width: 253px;
  height: 63px;
  }

h1 span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/logo.jpg) top left no-repeat;
  }
  
h1 a:hover span {
  cursor: pointer;
  }
  

h2 {
  margin: 36px auto 0 auto;
  overflow: hidden;
  font-size: 1.9em;
  }

h2, h2 span {
  position: relative;
  width: 730px;
  height: 29px;
  }

h2 span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/slogan.jpg) top left no-repeat;
  }

/************************************************************  PAGE */

body>#page {
  height: auto;
  }

#page {
  width: 960px;
  margin: 0 auto;
  position: relative;
  min-height: 100%;
  height: 100%;
  }

#header {
  height: 150px;
  background: #fff url(../images/header.jpg) bottom left no-repeat;
  }

/************************************************************  NAVIGATION */

#nav {
  width: 574px;
  height: 48px;
  margin: 0 auto;
  position: relative;
  top: 50px;
  left: 0px;
  }
  
#nav ul {
  list-style: none;
  }

#nav ul li {
  float: left;
  display: block;
  }
  
  
#nav ul li a {
  font-size: 1.2em;
  display: block;
  height: 37px;
  line-height: 37px;
  color: #b67321;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  }
  
#nav ul li a:hover {
  text-decoration: underline;
  color: #c23d2e;
  }
  
/* a */
#nav li#a {
  position: relative;
  overflow: hidden;
  }
  
#nav li#a,
#nav li#a span {
  width: 92px;
  height: 37px;
  }
  
#nav li#a span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/menu.jpg) 0 0 no-repeat;
  }
  
#nav li#a a:hover span {
  background: url(../images/menu.jpg) 0 -40px no-repeat;
  cursor: pointer;
  }
 
#nav li#a a.active span {
  background: url(../images/menu.jpg) 0 -40px no-repeat;
  }
  
/* b */
#nav li#b {
  position: relative;
  overflow: hidden;
  }
  
#nav li#b,
#nav li#b span {
  width: 86px;
  height: 37px;
  }
  
#nav li#b span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/menu.jpg) -92px 0 no-repeat;
  }
  
#nav li#b a:hover span {
  background: url(../images/menu.jpg) -92px -40px no-repeat;
  cursor: pointer;
  }
 
#nav li#b a.active span {
  background: url(../images/menu.jpg) -92px -40px no-repeat;
  }
  
/* c */
#nav li#c {
  position: relative;
  overflow: hidden;
  }
  
#nav li#c,
#nav li#c span {
  width: 107px;
  height: 37px;
  }
  
#nav li#c span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/menu.jpg) -178px 0 no-repeat;
  }
  
#nav li#c a:hover span {
  background: url(../images/menu.jpg) -178px -40px no-repeat;
  cursor: pointer;
  }
 
#nav li#c a.active span {
  background: url(../images/menu.jpg) -178px -40px no-repeat;
  }
  
/* d */
#nav li#d {
  position: relative;
  overflow: hidden;
  }
  
#nav li#d,
#nav li#d span {
  width: 113px;
  height: 37px;
  }
  
#nav li#d span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/menu.jpg) -285px 0 no-repeat;
  }
  
#nav li#d a:hover span {
  background: url(../images/menu.jpg) -285px -40px no-repeat;
  cursor: pointer;
  }
 
#nav li#d a.active span {
  background: url(../images/menu.jpg) -285px -40px no-repeat;
  }
  
/* e */
#nav li#e {
  position: relative;
  overflow: hidden;
  }
  
#nav li#e,
#nav li#e span {
  width: 176px;
  height: 37px;
  }
  
#nav li#e span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/menu.jpg) -398px 0 no-repeat;
  }
  
#nav li#e a:hover span {
  background: url(../images/menu.jpg) -398px -40px no-repeat;
  cursor: pointer;
  }
 
#nav li#e a.active span {
  background: url(../images/menu.jpg) -398px -40px no-repeat;
  }

#main {
  width: 960px;
  background: url(../images/main_bg.jpg) 0 15px no-repeat;
  padding: 20px 0 119px 0;
  }
  
#main.none {
  background: url(../images/teacher_bg.jpg) 210px 23px no-repeat;
  }

/************************************************************ CONTENT */

#content {
  width: 960px;
  float: left;
  position: relative;
  }

/************************ intro */

#intro {
  padding-bottom: 15px;
  background: url(../images/short_dotted_line.jpg) bottom left no-repeat;
  }
  
#intro.second {
  background: none;
  }

h3#headline-yoga-classes {
  overflow: hidden;
  font-size: 1.9em;
  margin: 10px 0 5px 0;
  }

h3#headline-yoga-classes, h3#headline-yoga-classes span {
  position: relative;
  width: 141px;
  height: 29px;
  }

h3#headline-yoga-classes span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_yoga_classes.jpg) top left no-repeat;
  }
  
h4 {
  padding: 0.8em 0 0.3em 0;
  font-size: 1.4em;
  font-weight: normal;
  color: #db6100;
  }

/************************ box 1 */

h3#headline-1-have-a-one-on-one {
  overflow: hidden;
  font-size: 1.9em;
  margin: 20px 0 5px 0;
  }

h3#headline-1-have-a-one-on-one, h3#headline-1-have-a-one-on-one span {
  position: relative;
  width: 387px;
  height: 30px;
  }

h3#headline-1-have-a-one-on-one span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_1_have_a_one_on_one.jpg) top left no-repeat;
  }

/************************ second */
  
#second {
  width: 520px;
  float: left;
  padding-bottom: 15px;
  }

#double-box {
  width: 960px;
  float: left;
  background: url(../images/double-box-line.gif) top left no-repeat;
  padding: 10px 0 20px 0;
  }
  
#double-box.style {
  background: url(../images/line-style.jpg) top left no-repeat;
  }
  
#double-box ul {
  list-style: none;
  padding: 5px 0;
  }
  
#double-box li {
  padding: 10px 0 10px 40px;
  background: url(../images/li.jpg) 0 8px no-repeat;
  }
  
#left {
  width: 500px;
  float: left;
  padding-right: 40px;
  }
  
h3#headline-2-bring-friends {
  overflow: hidden;
  font-size: 1.9em;
  margin: 20px 0 5px 0;
  }
  
h3#headline-2-bring-friends, h3#headline-2-bring-friends span {
  position: relative;
  width: 528px;
  height: 22px;
  }

h3#headline-2-bring-friends span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_2_bring_friends.jpg) top left no-repeat;
  }
  
#right {
  width: 360px;
  float: right;
  }
  
h3#headline-3-practice-at-office {
  overflow: hidden;
  font-size: 1.9em;
  margin: 20px 0 0px 0;
  }
  
h3#headline-3-practice-at-office, h3#headline-3-practice-at-office span {
  position: relative;
  width: 269px;
  height: 27px;
  }

h3#headline-3-practice-at-office span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_3_practice_at_office.jpg) top left no-repeat;
  }
  
h3#headline-4-yoga-style {
  overflow: hidden;
  font-size: 1.9em;
  margin: 6px 0 5px 0;
  }

h3#headline-4-yoga-style, h3#headline-4-yoga-style span {
  position: relative;
  width: 60px;
  height: 29px;
  }

h3#headline-4-yoga-style span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_4_yoga_style.jpg) -64px 0 no-repeat;
  }
  
h3#headline-5-each-class-consist {
  overflow: hidden;
  font-size: 1.9em;
  margin: 6px 0 5px 0;
  }

h3#headline-5-each-class-consist, h3#headline-5-each-class-consist span {
  position: relative;
  width: 190px;
  height: 19px;
  }

h3#headline-5-each-class-consist span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_5_each_class_consist.jpg) top left no-repeat;
  }
  
h3#headline-6-teacher {
  overflow: hidden;
  font-size: 1.9em;
  margin: 6px 0 5px 0;
  }

h3#headline-6-teacher, h3#headline-6-teacher span {
  position: relative;
  width: 120px;
  height: 29px;
  }

h3#headline-6-teacher span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_6_teacher.jpg) 0 0 no-repeat;
  }
  
h3#headline-7-pricelist {
  overflow: hidden;
  font-size: 1.9em;
  margin: 6px 0 5px 0;
  }

h3#headline-7-pricelist, h3#headline-7-pricelist span {
  position: relative;
  width: 100px;
  height: 29px;
  }

h3#headline-7-pricelist span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_7_pricelist.jpg) 0 0 no-repeat;
  }  
  
h3#headline-8-contact {
  overflow: hidden;
  font-size: 1.9em;
  margin: 6px 0 5px 0;
  }

h3#headline-8-contact, h3#headline-8-contact span {
  position: relative;
  width: 100px;
  height: 29px;
  }

h3#headline-8-contact span {
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/headline_8_contact.jpg) 0 0 no-repeat;
  }  

a.more {
  float: right;
  display: block;
  width: 81px;
  height: 24px;
  line-height: 18px;
  background: url(../images/more.jpg) 0 -32px no-repeat;
  color: #476418;
  text-indent: 43px;
  text-decoration: none;
  margin: 10px 0;
  }
  
a.more:hover {
  background: url(../images/more.jpg) 0 -6px no-repeat;
  color: #2b4304;
  }
  
a.more-position {
  float: right;
  position: relative;
  left: 21px;
  display: block;
  width: 81px;
  height: 24px;
  line-height: 18px;
  background: url(../images/more.jpg) 0 -32px no-repeat;
  color: #476418;
  text-indent: 43px;
  text-decoration: none;
  margin: 10px 0;
  }
  
a.more-position:hover {
  background: url(../images/more.jpg) 0 -6px no-repeat;
  color: #2b4304;
  }

/*********************************************************** COLUMN */

#column {
  width: 270px;
  float: right;
  }

/************************************************************  pricelist table */

table.pricelist {
  width: 250px;
  border: 5px solid #e8f1d9;
  }
  
table.pricelist td {
  padding: 2px 5px;
  border: 1px solid #f4f9ed; 
  }

/************************************************************  contact form */

#form

fieldset {
  border: none;
  }

input, textarea, select {
  border: 1px solid #ca9664;
  padding: 2px;
  color: #536e24;
  }
  
#button {
  padding: 5px 8px;
  color: 3d501a;
  background: #ecf3df;}

/************************************************************  FOOTER */

#footer {
  height: 119px;
  background: url(../images/footer.jpg) top left no-repeat;
  position: absolute;
  bottom: 0;
  left: 0;
  }
  
#footer #navigation {
  width: 405px;
  height: 52px;
  float: right;
  }
  
#footer #navigation ul {
  list-style: none;
  }

#footer #navigation ul li {
  float: left;
  }
  
  
#footer #navigation ul li a {
  float: left;
  font-size: 0.85em;
  display: block;
  height: 52px;
  line-height: 52px;
  color: #b67321;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  padding: 0 0 0 25px;
  }
  
#footer #navigation ul li a:hover {
  text-decoration: underline;
  }
  
#footer p {
  float: right;
  display: block;
  width: 901px;
  text-align: right;
  padding-right: 39px;
  font-size: 0.9em;
  }
  
#footer p a:hover {
  text-decoration: none;
  }

br.cleaner {
  clear: both;
  height: 1px;
  }

.teachers {
  width: 100%;
  height: 100%;
  float: left;
  padding: 0px 0 25px 0;
  background: url(../images/line-style.jpg) top left repeat-x;
  }
  
.teachers .img {
  float: left;
  width: 195px;
  padding-top: 25px;
  text-align: center;
  }

.teachers .teacher {
  float: right;
  width: 750px;
  padding-left: 15px;
  padding-top: 25px;
  }

.teachers#first {
  padding: 10px 0 25px 0;
  background: none;
  }

.teachers#first .img,
.teachers#first .teacher{
  padding-top: 0;
  }

.teachers#last .teacher {
  }

.teacher-panel {
  width: 750px;
  height: 46px;
  background: url(../images/teacher-panel.jpg) top left no-repeat;
  }

#Container {
  position: absolute;
  top: 50px;
  left: 670px;
  }
  
#Container ul {
  list-style: none;
  }

address {
  font-style: normal;
  }

#main.long {
  padding-bottom: 350px;
  }
  
a.schedule-class  {
  display: block;
  width: 156px;
  height: 35px;
  line-height: 40px;
  text-indent: 48px;
  text-decoration: none;
  background: url(../images/bg-schedule-class.jpg) top left no-repeat;
  color: #476418;
  margin-top: 15px;
  }
  
a.schedule-class:hover {
  color: #db6100;
  }




