﻿/*======================== css reset ======================*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*============================ css stylesheeet ===============================*/
* {
	color: #000000;
	white-space: normal;
	font-family: "Times New Roman", Times, serif;
	font-size: small;
	font-style: normal;
	font-weight: bold;
}
body { center top #00000; font-family:Georgia, "Times New Roman", Times, serif; font-size:100%; line-height:1.0625em; color:#000000;}

input, select, textarea { font-family:Georgia, "Times New Roman", Times, serif; font-size:1em;}

.fleft {
	float: left;
	font-size: large;
}
.fright { float:right;}
.clear { clear:both;}

.alignright { text-align:right;}
.aligncenter {
	text-align: center;
	color: #00000;
}

.wrapper, block {
	width: 100%;
	overflow: auto;
}
.container { width:100%;}

p {
	margin-bottom: 17px;
	color: #00000;
}

.auto-style1 {
	margin-top:128px;
}

/*================== forms ====================*/
input, select { vertical-align:middle; font-weight:normal;}
img {
	border: 0;
	vertical-align: top;
	text-align: left;
	border-bottom-color: #3B3B3B;
	border-bottom-style: none;
	border-bottom-width: medium;
}

#contacts-form label { display:block; height:41px;} 
#contacts-form label input { width:280px; padding:1px 0 1px 3px; color:#fff; left top repeat-x; border:1px solid #000;}
#contacts-form .textarea-box {left top repeat-x; border:1px solid #000; margin-bottom:20px; width:283px; height:166px; overflow:hidden;}
#contacts-form textarea {width:280px; height:165px; padding:1px 0 1px 3px; color:#fff; overflow:auto; border:none; background:none;}

/*================== list ====================*/
ul { list-style:none;}

.nav { width:100%; overflow:hidden; background:url("../images/divider.gif") no-repeat left top;}
.nav li {
	float: left;
	padding-right: 2px;
	color: #000000;
	font-family: "Times New Roman";
	font-size: small;
	font-style: normal;
	font-variant: small-caps;
	font-weight: bold;
	vertical-align: sub;
	text-align: center;
}
.nav li a {
	display: block;
	width: 135px;
	height: 49px;
	line-height: 48px;
	text-align: center;
	font-family: "Times New Roman", Times, serif;
	color: #000000;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	font-size: small;
}
.nav li a:hover {left top repeat-x;}
.nav li a.current {left top repeat-x;}

.list1 { width:100%; overflow:hidden;}
.list1 li { float:left; padding:0 34px 28px 0;}
.list1 li img { margin-bottom:10px; border:1px solid #000;}
.list1 li.alt { padding-right:0;}
.list1 li a:hover img { border:1px solid #fff;}

.list2 li { width:100%; overflow:hidden; background:url("../images/line-dot.gif") left bottom repeat-x; padding-bottom:4px; margin-bottom:3px; vertical-align:top;}
.list2 li a { float:left; color:#000000; text-decoration:none; left top;}
.list2 li a:hover { color:#fff; text-decoration:underline;}
.list2 li span { float:right; left top;}

.list3 li { padding-bottom:7px;}

.list4 li {
	width: 100%;
	overflow: hidden;
	padding-bottom: 28px;
	font-family: "Times New Roman";
	font-size: medium;
	font-weight: bold;
	color: #000000;
}
.list4 li img {
	float: left;
	margin-right: 15px;
	font-size: medium;
}
.list4 li strong {
	color: #000000;
	font-family: "Times New Roman";
	font-size: medium;
}
.list4 li span {
	color: #000000;
	font-size: medium;
	font-weight: normal;
}


.img-box { width:100%; overflow:hidden; padding-bottom:15px;}
.img-box img {
	float: left;
	margin: 0 15px 0 0;
	color: #FFD200;
}

.extra-wrap { overflow:hidden; }

.p1 { margin-bottom:17px;}
.p2 { margin-bottom:10px;}

/*================== txt, links, lines, titles ====================*/
a {
	color: #0000FF;
	text-transform: none;
	font-size: medium;
}
a:hover{text-decoration:none;}

a {
	color: #0000FF;
	text-transform: none;
	font-size: small;
}
a:hover{text-decoration:none;}

h2 {
	font-size: large;
	color: #000000;
	font-family: "Times New Roman", Times, serif;
	line-height: 1.1em;
	text-transform: none;
	margin-bottom: 16px;
	font-style: normal;
	font-variant: normal;
}
h3 { font-size:1em; color:#000000; padding:10px 0 0 0; margin-bottom:17px;}
h4 { font-size:1.25em; color:#000000; text-transform:uppercase; margin-bottom:8px;}
h5 { font-size:1em; color:#000000;}

iframe {
	padding-left:100px;
}

.txt1 {
	color: #000000;
}

.line-hor { background:url("../images/line-hor.gif") left top repeat-x; height:1px; overflow:hidden; font-size:0; line-height:0; margin:22px 0 16px 0;}
.line-ver { background-image:url("../images/line-ver.gif"); background-repeat:repeat-y; width:100%;}
.line-ver-top { background:url("../images/line-ver-top.gif") left top repeat-x; width:100%;}

/*================== boxes ====================*/
.box {
	background-position: center;
	width: 100%;
	color: #000000;
	margin-top: 36px;
	background-image: url('../images/piano%20guitar%20background.jpg');
}
.box .inner { padding:21px 30px 20px 15px;}
.box a {
	color: #000000;
	font-weight: bold;
}
.box p { margin-bottom:11px;}

.cont-box { padding:0 85px 0 0; margin:0;}
.cont-box span { float:right;}

/*================== header =======================*/
#header .row-1 {
	border-top-color: #007910;
	border-top-style: none;
	border-top-width: thick;
}
#header .row-1 .indent {}
#header .row-2 {
	border-bottom-color: #0000FF;
	border-bottom-style: solid;
}
#header .slogan { font-family:"Times New Roman", Times, serif; 
				  font-size:20px; 
				  font-style:italic; 
				  color: #FF0000;
				  text-align:center; 
				  float:right; 
				  padding:35px 12px 9px 0; 
				  font-weight:bold;
				  height:67px;
}

/*==================== content ===================*/
#content { padding:26px 0 48px 0;}
#content .indent { padding:45px 0 0 17px;}
.AboutTxt {
	width: 275px;
	color: #000000;
	font-size: 14px;
	font-weight: normal;
	vertical-align:middle;
	text-align:center;
}
.BulletList {
	list-style-type: disc;
	padding-left:50px;
}
.center {
	display: block;
	margin-left: auto;
	margin-right: auto;	
}
.Footer {
	width: 1000px;
}
.MsoFooter {
	text-align:center;
	text-size: 14px;
}
.MsoFooterHead {
	color: #0000FF;	
	text-align:center;
	font-size: 16px;
}

.MsoItal {
	color: #000000;
	font-style:italic;
}
.MsoNormal {
	color: #000000;
	font-size: 14px;
	font-style:normal;
}
.TeacherBio {
	width: 275px;
	color: #000000;
	font-size: 14px;
	font-weight: normal;
	vertical-align:middle;
}
.TeacherName {
	width: 275px;
	padding-left: 5px;
	padding-top: 10px;
	padding-bottom: 5px;
	color: #0000FF;
	font-size: 16px;
	font-weight: bold;
}
.TeacherPhoto {
	width: 45px;
	color: #000000;
	font-size: 14px;
	font-weight: normal;
	float:left;
	vertical-align:middle;
}
.TeacherSpacer {
	width=10px;
}
.top_story {
	width: 800px;
	color: #000000;
	padding-left: 100px;
	font-size:14px;
}
.topStoryHead {
	text-align:center;
	width: 860px; 
	font-size: 32px; 
	color: #0000FF;
	line-height: 110%;
}

* {box-sizing:border-box}
/* Slideshow container */
.slideshow-container {
  max-width: 800px;
  position: relative;
  margin-left: 100px;
}

/* Hide the images by default */
.mySlides {
  display: none;
  padding-left: 100px;
}

/* Caption text */
.slideText {
  color: #f2f2f2;
  font-size: 40px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: left;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}/*--------------- footer ==========================*/
#footer p { margin:0; padding:20px 0 0 0;}

/*==========================================*/


