
#wrapper {
    border-spacing:15px;    
    border:0px solid black;
    height:100%;
    width: 770px; 
    margin:auto;
    line-height:20px;
}
 
#header {
    margin-top:8px;
    width:100%;
    height:105px;
    vertical-align:middle;
}
#header .innertable {
    width:100%;
}
#toplogo {
    margin-top:15px;
    margin-left:15px;
    width:320px;
}
#topleftlogo{ 
    /*position:relative;*/
    text-align:right;
    /*top: -20px;*/
    margin-top:-3px;
    margin-right:10px;
	height:85px;
}
#topmenu{
    word-spacing:5px;
    /*font-weight:bold;*/
    /*float:right;*/
    margin-left:80px;
    margin-top:-8px;
    /*position:relative;*/
    /*text-align:right;*/
    /*top:-10px;*/
    /*right:10px;*/
    /*z-index:10;*/
    /*border:1px solid yellow;*/
    
}
#topmenu a:hover{
    background-color:#5e0000;
}


#maincontent .roundcorner{
    margin-top:10px;
    padding:10px 0px 0px 0px;
    /*border:0px solid black;*/
    /*width:100%;*/
    /*height:250px;*/
}
#leftbanner{
    /*width:68%;*/
    width:518px;
    height:255px;
}

#coin-slider{
    /*add more to the default coin-slider style*/
   /*top:15px;*/
   right:-8px;
   /*width:550px;*/
   /*border:1px solid yellow;*/
}
#classic_slider{
    border:1px solid white;
}
#pop_slider{
    border:1px solid white;
}
#pane_teacher {
    float: right;
    width:242px;
    height:255px;
}

#shuffleteacher{
    /*position:relative;*/
    width:238px;
    border: 0px solid yellow;
}
#shuffleteachertxt{
    position:relative;
    /*top:205px;*/
    left:5px;
    font-size:13px;
    /*font-weight:bold;*/
    word-spacing:2px;
    text-align:left;
    width:97%;
}

#shuffle4x4 {
    margin-top:-4px;
    margin-left: 7px;
    margin-bottom:10px;
    
}
#shuffle4x4 img{
    padding:0 0 2px 2px;
    /*border: 1px solid yellow;*/
    border: 0px;
}


/*Teachers section*/
#pane_teacher_big{ 
    width:100%;
    height:560px;
    position:relative;
    
}
#teacherintro{
/*    position:absolute;
    top:-5px;
    left:10px;*/
    /*font-size:13px;*/
    color:white;
    
    border:0px solid yellow;
}
#teacherintro span{
    /*font-size:13px;*/
    color:white;
}
.toptitle_teacher{ 
    margin-left:10px;
    color:#ffff00;
    border:0px solid yellow;
}
.toptitle_teacher span{
    vertical-align:top;
    border:0px solid yellow;
}
#teacherselecticons{
    width:240px;
    margin-top: 15px;
    margin-left:10px;

    border:0px solid yellow;
}
.deepred{
    background-color:#800000;
    font-size:13px;
    margin: 5px 0px 3px -10px;
}
.deepred img{
    margin-left:15px;
}
.deepred span{
    margin-left:15px;
    font-weight:bold;
}
.teacherselecticons_s{
    width:100%;
    margin-left:9px;
    border:0px solid yellow;
}
.teacherselecticons_s img{
    border:1px solid #cf1100;
}
.teacherselecticons_s img:hover{
    border:1px solid white;

}

#teachercontent{
    position:absolute;
    top:38px;
    left:250px;
    width:95%;
    border:0px solid yellow;
}
#teachercontent_f{
    width:510px;
    height:500px;
    /*height:90%;*/
    border:0px solid yellow;
}


#pane_courses_big{
    width:100%;
    height:700px;
    position:relative;
    
}
#coursescontent{
    position:absolute;
    top:5px;
    left:245px;
    width:95%;
    border: 0px solid yellow;

}
#coursescontent_frame{
    width:517px;
    height:690px;
    /*height:90%;*/
    border: 0px solid yellow;
}

#coursesselection{
    margin-left:7px;
    width:500px;
    border: 0px solid yellow;
    font-family:Arial, Helvetica, sans-serif, Verdana;
    /*font-family:新細明體,Arial, mingliu;*/

    
    border: 0px solid yellow;
}

.courses_whitebtn{
    position:relative;
    width:230px;
    padding: 3px 0px 3px 8px;
    background-color:white;
    color:#9C0000;
    font-weight:900;
    -webkit-border-radius:8px;
       -moz-border-radius:8px;
	    border-radius:8px;
    -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3) inset;
       -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3) inset;
	    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3) inset;

    behavior: url(js/PIE.htc);

    border: 0px solid yellow;
}
.courses_whitebtnhover:hover{
    background-color:#cdcdcd;
}
.courses_redbtn{
    width:240px;
    margin-top: 6px;
    margin-bottom: 6px;
    margin-left:4px;
    padding-left:2px;
    border: 0px solid yellow;
}
.courses_redbtn:hover{
    background-color:#b00000;
}
.courses_shuffleteacher{
    margin-top:25px;
    margin-left:8px;
}


#panetitleimg {
    margin-top:-10px;
    margin-left:4px;
    border: 0px solid yellow;
    width:50px;
}

/*.fourthumbs {*/
/*    text-align:center;*/
/*    margin-bottom:5px;*/
/*    border: 0px solid yellow;*/
/*}*/
/*.fourthumbs img{*/
/*    border:1px solid white;*/
/*    width:170px;*/
/*}*/


.thumbtext {
    text-align:center;
    margin-bottom:5px;
    margin-left: 8px;
    border:0px solid yellow;
    width:172px;
}
.thumbtext img{
    border:1px solid white;
    width:170px;
}






/*.fourthumbs img:hover{*/
/*        /*border:1px solid yellow;*/*/
/*    -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);*/
/*    -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);*/
/*    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);*/
/*}*/
/*.thumbtext{*/
/*    /*margin-top:1px;*/*/
/*    margin-bottom:15px;*/
/*}*/


.onethumb span{
    border: 1px solid yellow;
} 
.onethumb img{
    /*Make the text on the side of the image*/
    float:left;
    margin-right: 10px;
    margin-left:8px;
    /*margin: 0px 10px 0px 0px;*/
    width:170px;
    
    border: 1px solid white;
}
.onethumb2 img{
    /*Make the text on the side of the image*/
    float:left;
    margin-right: 8px;
    margin-left:8px;
    /*margin: 0px 10px 0px 0px;*/
    width:170px;
    
    border: 1px solid white;
}

/*#family {*/
/**/
/*} */
/*#family img{*/
/*    /*Make the text on the side of the image*/*/
/*    float:left;*/
/*    margin-right: 10px;*/
/*    margin-left:8px;*/
/*    /*margin: 0px 10px 0px 0px;*/*/
/*    width:170px;*/
/*    */
/*    border: 1px solid white;*/
/*}*/


#rental {

}

#rental img{
    /*Make the text on the side of the image*/
    float:left;
    margin-left:8px;
    margin-right: 5px;
    width:170px;
    border: 1px solid white;
}
#rental span{
    position:relative;
    top:20px;
    left:5px;
    border: 0px solid yellow;
}



#pane_aboutus_big{
    width:100%;
    height:420px;
    position:relative;
    
}
#aboutusyellowtitle{
    margin-top:1px;
    margin-left:10px;
}
#aboutustxt{
    margin-left:11px;
    margin-top:5px;
    /*width:220px;*/
    /*word-spacing:5px;*/
    /*line-height:200%;*/
    
    border: 0px solid yellow;
}
#aboutusslider{
    /*float:right;*/
    /*margin-top:-155px;*/
    /*margin-right:35px;*/
    position:absolute;
    top:40px;
    right:25px;

    border: 0px solid yellow;
}




#pane_contactus_big{
    width:100%;
    height:445px;
    position:relative;
    
}
#contactusyellowtitle{
    margin-top:1px;
    margin-left:15px;
}
#contactuscontent{ 
    position:relative;
    left:120px;
}
#contactustxt{
    margin-top:-10px;
    /*word-spacing:5px;*/
    line-height:150%;
    
    border: 0px solid yellow;
}
#contactemail{
    font-weight:bold;
    color:#fff45c;
}
#contactemail:hover{
	
	   /*background-color:#ff8080;*/
}



#pane_special_big{
    width:100%;
    height:450px;
    position:relative;
    
}
#pane_special_big_summer{
    width:100%;
    height:430px;
    position:relative;
    
}
#toptitle_special{
    margin-left:10px;
    color:#fff45c;
    /*font-weight:bold;*/
}
#toptitle_special span{
    color:#ffffff;
    vertical-align:top;
}

#specialcontent{
    margin-left:15px;
    margin-right:15px;

    /*border:1px solid yellow;*/
}
#specialcontent table{
    border:0px solid yellow;
    /*padding:10px;*/
}
#specialcontent td{
    vertical-align:top;
    /*border:0px solid yellow;*/
    /*padding:10px;*/
    padding-bottom:20px;
	
}
#specialcontent span{
	color:#fff;
	background-image: url(graphics/spechead_bg.jpg);
	background-repeat: repeat-y;
	display: block;
	line-height:17px;
	padding-top: 2px;
	padding-bottom: 2px;	
}



#summercontent{
    margin-left:15px;
    margin-right:15px;

    /*border:1px solid yellow;*/
}
#summercontent table{
    width:100%;
    /*border:1px solid yellow;*/
}
#summercontent td{
    vertical-align:top;
}
#summercontent span{
    color:#fff;
	background-image: url(graphics/spechead_bg.jpg);
	background-repeat: repeat-y;
	display: block;
	line-height:17px;
	padding-top: 2px;
	padding-bottom: 2px;
}
.smallterms{
	color: #ffff8a;
	padding-top: 5px;
}




#pane_popmusic{
    float: left;
    width:379px;
    height:229px;
}
#pane_classical{
    float: right;
    width:379px;
    height:229px;
}

#pane_family{
    float: left;
    width:379px;
    height:110px;
}
#pane_family .innertable{
    width:100%;
}

#pane_rental{
    float: right;
    width:379px;
    height:110px;
}
#pane_rental .innertable{
    width:100%;
}
#footer {
    width:100%;
    height:95px;
    margin-top: 10px;
    /*border:1px solid yellow;*/
}
#footer .innertable {
    width:100%;
}
#footeraddress {
    margin:5px 0px 0px 10px;
    font-size:12px;
	line-height:130%;
	
}
#footercopyright {
    margin:15px 0px 0px 10px;

    font-size:10px;
}
#footer_socialmedia{
/*    position:relative;
    right:-90px;*/
    float:right;
    margin-right:20px;
    margin-top:20px;
}
#footer_socialmedia img{
    border:0px;
}
#bottom {
    clear:both;
    text-align:right;
}
	

/* Shared styles */
body {
    background-color: #CCCCCC;
    font-family:Arial, Helvetica, sans-serif, Verdana;
    /*font-family:新細明體,Arial, mingliu;*/
    
    font-size:13px;
    color:white;
    /*color:black;*/
    letter-spacing:-0.4px;
}

a{
    color:white;
    text-decoration:none;
}



.innertable{
    position:relative;
}
div .innertable{
    /*width:100%;*/
    height:100%;
    border: 0px solid yellow;
    
} 
div .innertable td{
    vertical-align:top;
    border: 0px solid yellow;
} 

.yellowtitle{
    color:#ffff00;
    font-weight:bold;
    margin-left:5px;
    margin-top:-8px;
}





.roundcorner {
    -webkit-border-radius:8px;
       -moz-border-radius:8px;
	    border-radius:8px;

}

/* Drop Shadow */
.normal-drop-shadow {
    position:relative;
    float:left;
    /*padding:1em; */
    /*margin:2em 10px 4em; */
    margin-top:0px;
    vertical-align:top;
    /*background:#ffffff ;*/
    background:#cf1100;
    
    -webkit-box-shadow: #888888 2px 3px 5px;
       -moz-box-shadow: #888888 2px 3px 5px;
	    box-shadow: #888888 2px 3px 5px;
    behavior: url(js/PIE.htc);
}	

	
.drop-shadow {
    position:relative;
    float:left;
    /*width:40%;    */
    /*padding:1em; */
    /*margin:2em 10px 4em; */
    background:#9C0000;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.drop-shadow:before,
.drop-shadow:after {
    content:"";
    position:absolute; 
    z-index:-2;
}







/* Lifted corners */
.lifted{
    border-bottom:10px;
}
.lifted:before,
.lifted:after { 
    bottom:15px;
    left:10px;
    width:50%;
    height:20%;
    max-width:300px;
    -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);   
       -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	    box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
    -webkit-transform:rotate(-3deg);    
       -moz-transform:rotate(-3deg);   
	-ms-transform:rotate(-3deg);   
	 -o-transform:rotate(-3deg);
	    transform:rotate(-3deg);
}

.lifted:after {
    right:10px; 
    left:auto;
    -webkit-transform:rotate(3deg);   
       -moz-transform:rotate(3deg);  
	-ms-transform:rotate(3deg);  
	 -o-transform:rotate(3deg);
	    transform:rotate(3deg);
}

#tooltip.mytooltips {
	font-family: Arial;
	/*font-family:新細明體,Arial, mingliu;*/
	border: none;
	opacity: 0.8;
	color:black;
	font-size:10px;
	-webkit-border-radius:3px;
	   -moz-border-radius:3px;
		border-radius:3px;
	-webkit-box-shadow:0 5px 5px rgba(0, 0, 0, 1);
	   -moz-box-shadow:0 5px 5px rgba(0, 0, 0, 1);
		box-shadow:0 5px 5px rgba(0, 0, 0, 1);

	/*background: url('shadow.png');*/
}

