
body {
  margin: 0;
  padding: 0;
  font-size: 11pt;
  font-family: verdana, sans-serif;
  background-color: #ddf;

/*   font-size:.83em;
  font-family: "segoe ui", verdana, sans-serif;
 */
}

body.contact {
  background-color: #aaa;
}

div.content {
/*
background-image:url(/images/lightoctave.png);
background-position: left right;
background-repeat: repeat-y;
*/

  width: 980px;
  margin: 10px auto 10px auto;
  background-color: #fff;
  border: 4px solid #aaa;

}


div.tuition {
border: 1px solid #669;
width: 280px;
background-color: #ffd;
margin-top: 10px;
padding: 10px 30px 10px 20px;
font-size: 90%;
float: right;
margin-right: 40px;


}


h2.section { 
margin-top: 2px;
color: #b00;

text-align: left;
font-size: 125%;
}


h3.subsection { 
margin-top: 0px;
color: #b00;
margin-bottom: 0px;
text-align: center;
font-size: 125%;

}

h2.blue { 
color: #449;
text-align: left;
font-size: 125%;
margin-bottom: 30px;
}

h2.big { 
color: #b00;
text-align: left;

}

div.cent {
font-size: 80%;

}

span.req {
color: #900;

}

span.mgcolor {
color: #900;

}



div.mast {

padding: 12px 0 0 12px; 
color: #000;
text-align: left;
margin-bottom: 0px;
border-bottom: 8px solid #a00;

/* border: 1px solid red; */

/*
font-family: serif;
background-image:url(/images/blegtext.gif.jpg);
background-position: left;
background-repeat: repeat-y;
border-bottom: 1px dotted blue;
*/

}

div.piano {

background-image:url(/images/keyboard.png);
background-position: left bottom;
background-repeat: repeat-x;
height: 44px;
border: 1px solid #555;
border-left: 2px solid #555;
border-right: 2px solid #555;

border-left: 2px solid #fff;
border-right: 2px solid #fff;



margin-top : 0px;
}



img.logo {
  float: right;
  margin: 0 50px 0 0;
  padding: 0px 12px 0px 12px;

}





h1.name {

 color: #b00;
 font-size: 200%;
 margin: 0 0 0 185px;

 padding-bottom: 4px;
 padding-top: 0px;
}



div.byline {

margin-top: -8px;
 margin: 0 0 0 185px;
color: #444;
}

div.phones {


border: 0px dotted #eee; 
width: 420px;
margin: 10px 0px 0px 185px;
font-size: 9pt;
}


div.textblocks {
width: 90%;

}



div.mast p {
 text-align: left;

}


div.map {
width: 480px;
height: 400px;
margin-bottom: 45px;
border: 1px solid #004;
float: left;
}

div.localaddress {
width: 300px;
float: left;
border: 0px dotted yellow;
margin: 0px 0px 0px 20px; 
}


div.locdetail {
color: #000;
width: 200px;
font-size: 8pt;
}

div.spacer {
height: 50px; 
border: 0px dashed yellow;
float: none;
}


div.main {

  margin: 0px 45px 0px 0px;
  padding: 0px;
  width: 740px;
  border: 0px solid blue;
  float: right;

}


body.text div.main {

  margin: 0;
  padding: 0px 70px 0px 50px
  border: 0px solid red;

}



div.nav  {

margin: 35px 0px 0px 0px;
padding: 0px 0px 0px 0px;
border-top: 0px solid #fc0;
color: #fff;
text-align: left;
font-size: 10pt;
width: 158px;
float: left;

background-color: #22a;
}



div.nav a, div.nav a:link, div.nav a:visited
 {

margin: 0px;
color: #ffc;

text-decoration: none;


border-top: 1px solid #22a;
border-right: 3px solid #22a;
background-color: #22a;
display: block;
height: 25px;
padding-top: 8px;
border: 1px solid black;
background-color: #fff;
color: #000;
text-align: right;
/* 
border-top: 1px solid #444;
border-right: 1px solid #444; 
display: block;
break: no-break;
background-color: #77d;
background-color: #77d;
*/


}


a.keydown {

background-image:url(/images/keydown.gif);
background-position: bottom left;
background-repeat: no-repeat;
background-color: #ddd;

}

a.keyup {

background-image:url(/images/keyup.gif);
background-position: bottom left;
background-repeat: no-repeat;
background-color: #ddd;

}


a.keyd {

background-image:url(/images/both.gif);
background-position: top left;
background-repeat: no-repeat;
background-color: #ddd;

}


div.nav a.it {
background-color: #eef;
color: #222;


}

#it {
background-color: #eef;
color: #222;


}

div.nav a:hover {

color: #00b;
background-color: #fd7;

}




a.within, a.within:link ,a.within:visited {
 color : #00a;
 text-decoration: none;

}

a.within:hover {
  color: #000;
  background-color: #ff6;
}

p { margin-top: 0 }


div.top {
background-image:url(/images/baywide.jpg);

background-position: left;
background-repeat: no-repeat;
background-color: #337;
padding-top: 0px; padding-bottom: 0px; 
padding-left: 5%; padding-right: 5%;
color: #fff; margin-top: 0;
text-align: right;
font-family: serif;
height: 192px;
}

div.test {
background-image:url(/images/baywide.jpg);
background-position: left;
background-repeat: no-repeat;
background-color: #337;
padding-top: 0px; padding-bottom: 0px; 
padding-left: 5%; padding-right: 5%;
color: #fff;
margin-top: 0;
text-align: right;
font-family: serif;
height: 192px;
position: relative;

}

br.fresh  { clear: both;}


img.fr {  
  float: right; 
  padding: 3px;
  border: 1px solid blue;
  margin: 0 0 1em 1em;
}

img.fl {  
  float: left;
  padding: 3px;
  border: 1px solid blue;
  margin: 0 1em 1em 0;  
}

img.flc {  
  float: left;
  padding: 3px;
  border: 1px solid blue;
  margin: 0 1em 0em 0;  
}



img.kfr {  
  float: right; 
  padding: 3px;
  border: 1px solid red;
  margin: 0 0 0 1em;
}

img.kfl {  
  float: left;
  padding: 3px;
  border: 1px solid red;
  margin: 0 1em 0 0;
}


a:link, a:visited  {
color: #00b;
text-decoration: underline;
}


a:hover  {
text-decoration: none;
}

ul.space li { 

line-height: 1.5;
}


div.hrule {
 border-bottom: 1px solid black;

}



a.white:link, a.white:visited, a.white {
color: #fff;
text-decoration: underline;
}

textarea { 
font-size: 10pt;
}



div.tablecontact {
background-color: #fff;
padding: 0px 00px;
margin: 10px 10px 10px 40px;
border: 0px solid #bbd;
font-size: 10pt;
}

div.tablecontact input.coolinput, div.tablecontact textarea {

margin-top: 2px;
background-color: #ffd;
border: 1px solid #aaa;

}




table.schedule {
border-collapse: collapse;
}


table.schedule th {
border: 1px solid #777;
padding: 5px;
background-color: #ffb;
font-size: 9pt;

}


table.schedule td {
font-size: 8.5pt;
border: 1px solid #777;
padding: 8px;
background-color: #eee;
vertical-align: top;
}

table.schedule td.spacer {
border: 0px solid #777;
padding: 5px;
background-color: #fff;
}

table.schedule td.data {
text-align: right;
}




table.groupclass {
border-collapse: collapse;
}


table.groupclass th {
border: 1px solid #777;
padding: 5px;
background-color: #ffb;
}

table.groupclass td {

border: 1px solid #777;
padding: 8px;
background-color: #eee;
vertical-align: top;
}

table.groupclass td.spacer {
border: 0px solid #777;
padding: 5px;
background-color: #fff;
}

table.groupclass td.data {
background-color: #fff;
padding-left: 30px;
}









table.contact td.data {
text-align: right;
width: 180px;
padding-right: 15px;
}



table.fees {
width: 100%;
border-collapse: collapse;
border: 1px solid #aaa;
}

table.fees td {

border-bottom: 1px solid #aaa;
padding: 10px 5px;
background-color: #eee;
vertical-align: top;
text-align: center;
}


table.fees td.details {
text-align: center;
background-color: #ddd;
}



table.fees td.spacer {
border: 0px solid #777;
border-bottom: 1px solid #aaa;
background-color: #fff;
}


table.fees th {
border: 1px solid #777;

padding: 5px;
background-color: #ffb;
font-size: 8.5pt;
font-weight: bold;
}



div.utility a, div.utility a:link, div.utility a:visited  {

 text-decoration: none;
 color: #bbb;

}


div.utility {
text-align: right;
text-decoration: none;
font-family:  sans-serif;
background-color: transparent;
margin-right: 0;
margin-bottom: 00px;
padding-right: 50px;
border: 0px dotted green;
font-size: 9pt;

/*

font-size: 9pt;
border-bottom: 1px solid #449;

*/


}




div.rectangle {

width: 320px;
float: left;

}