/*******************************************************************
 *    Copyright © 2006 Dragon of The South. All rights reserved.   *
 *    ---------------------------------------------------------    *						
 *******************************************************************/


/****************** standard html element styles *******************/

	body 
	{ 
		font: 13px Arial, Helvetica, sans-serif;
		margin:0;
		border:0;
		padding:0;
		height:100%;
		/*background:#eee;*/
		text-align: justify;
	} 

	a
	{ 	
		font-weight: bold; 
		color:#333399;   
		background-color:transparent;	
	}	

	a:hover
	{		
		color: #cc3333;
	}

	.hiddentitle {z-index:0; position:absolute}

	img	{ border: none}	

	abbr	{ cursor:help }
		
	h1 	{ font-size:2em; text-align:left; padding-right:150px}	

	h2	{ font-size:1.4em; color:#663399}	

	.headingcolor {color:#663399; font-size:2em; font-weight:bold;color:#663399}
	
	h4	{ font-size:1em}

	.email  { font-size:10px}
		
	/******** pics positioning ********/

	.bkcornerleft
	{
		z-index:2;		
		position:absolute;
		left:-21px;
		top:-228px;
		width:77px;
		height:77px;
		background: url(backgroundcorner.jpg) no-repeat ;		
	}

	* html .bkcornerleft {top:-273px}

	.bkcornerright
	{
		z-index:2;
		position:absolute;
		left:841px;
		top:-234px;
		width:77px;
		height:77px;
		background: url(backgroundcorner2.jpg) no-repeat;
	}
	
	* html .bkcornerright {top:-279px; }	

	.bktop
	{
		position:absolute;z-index:100;
		top:-261px;
		left:-4px;		
		width:848px;
		height:40px;
		background: url(backgroundtop.jpg);
	}

	* html .bktop {height:20px;top:-286px;left:-2px;}

	.bkaboutl, .bkaboutr
	{
		top:-270px;
		height:127.5em;		
		position:absolute;				
		border:1px solid black;	
		visibility;visible;
	}

	.bkaboutl
	{		
		left:-89px;		
		width:77px;
		background: url(backgroundborder.jpg);		
	}

	* html .bkaboutl { top:-275px;height:1666px; }

	.bkaboutr
	{
		left:862px;		
		width:60px;
		background: url(backgroundborder2.jpg);
	}

	* html .bkaboutr { top:-275px;height:1666px; }

	.bkhomel
	{
		top:-228px;
		height:164%;
		left:-89px;		
		width:77px;		
		position:absolute;
		background: url(backgroundborder.jpg);
		border:1px solid black;
	}

	* html .bkhomel { top:-275px;height:815px; }

	.bkhomer
	{
		top:-228px;
		height:164%;
		left:862px;		
		width:60px;
		position:absolute;
		background: url(backgroundborder2.jpg);
		border:1px solid black;
	}

	* html .bkhomer { top:-275px;height:815px; }

	.bkbottom
	{
		position:absolute;
		left:100px;
		top:1432px;
		left:300px;
		height:20px;
		width:800px;
		background: url(backgroundbottom.jpg) repeat-x;
	}


	.leftcontentline	
	{
		position:absolute;
		top:101px;
		left:197px;
		height:91%;
		width:1px;
		border:1px dotted black;
	}

	* html .leftcontentline {top:55px;height:1300px}

	.rightcontentline
	{
		position:absolute;
		top:101px;
		left:843px;
		height:91%;
		width:1px;
		border:1px dotted black;		
	}

	* html .rightcontentline {top:55px;height:1300px}

	/************/	

	.quote img { margin-top:59px; }	

	* html .quote img { margin-top:3px; }
	
	.homepageposition {top:-100px}

	.footer img {top:498px; margin-left:-214px;margin-top:12px;margin-bottom:0px; z-index:70; position:absolute}
	
	* html .footer img {top:431px;}
	
	.dragonsign img {height:190px; width:170px: top:10px;padding-top:20px;}
	
	* html .dragonsign img {height:140px;width:150px;margin-top:-20px;margin-left:15px;}

	.homepagepic img {height:405px;width:650px;margin-left:-10px; margin-top:-4px;margin-bottom:15px;z-index:50}

	* html .homepagepic {width:690px;margin-top:-8px;position:absolute;margin-left:-10px;}

	* html .pic img {margin-top:-70px;display:block;}

	.welcomebox { position:absolute; margin-left:-9px;top:405px;padding-bottom:70px; margin-bottom:40px;}

	* html .welcomebox {top:340px;}
	
	.quotetext {font-size:12px; color:navy;margin-left:20px;display:block}
	
	.andypic img { margin-top:-10px; height:230px; width:290px}

	.liondance img { margin-top:0px; }	

	* html .liondance img { margin-top:10px; }

	.liondance2 img { margin-top:50px; }	

	* html .liondance2 img { margin-top:135px; }

	.buddha img { margin-top:25px;}

	* html .buddha img { margin-top:30px;}

	.dragondance img { margin-top:0px }

	.dragondance2 img { margin-top:140px; }		

	* html .dragondance2 img { margin-top:198px; }

	.drumpicture img { margin-top:3px;}	

	* html .drumpicture img { margin-top:10px;}

	.cymbals img { margin-top:89px;float:left;}	

	* html .cymbals img { margin-top:120px;	float:left;}

	.contactus img {margin-top:0px;border:1px solid black}	
	
	* html .contactus img { margin-top:15px;border:1px solid black }

	.emailpic {position:absolute;top:300px;left:60px;}

	* html .emailpic {top:323px;}

	.liondance img, .liondance2 img, .buddha img, .dragondance img, .dragondance2 img, .cymbals img, .drumpicture img, .aboutus img, .andypic img, .contactus img
	{
		margin-left:15px;
		margin-right:-9px;	
	}

	* html .liondance img, .liondance2 img, .buddha img, .dragondance img, .dragondance2 img, .cymbals img, .drumpicture img, .aboutus img, .andypic img, .contactus img
	{
		margin-left:11px;
		margin-right:-5px;	
	}

	.aboutus img { margin-top:-5px; }

	.w3C
	{
		Z-INDEX: 112;
		LEFT: 0px; 
		POSITION: relative; 
		TOP: -10px;	
	}


/*************** divisioning of various sections of page **********/

	#mainContainer
	{
		Z-INDEX: 1; 
		LEFT: 0%; 
		POSITION:relative;
		top:0%;			
		padding:0px;	
		margin:0 8%;	
		/*border:3px solid red;*/
		margin-bottom:100px;
	}

	/* start for multi-browser homepage display */

	.logoContainer
	{
		Z-INDEX: 1; 
		LEFT: 0%; 
		POSITION: relative;
		top:119px ;			
		padding:0px;	
		margin:0 8%;	
		/*border:3px solid red;*/
		margin-bottom:100px;
	}

	* html .logoContainer {top:0px;}

	/* End homepage hack */

	#logobanner		
	{ 
		Z-INDEX: 5; 
		POSITION: absolute;
		LEFT: 3px; 		 
		TOP: -212px;
	}

	* html #logobanner { LEFT: 3px;TOP: -260px;}

	#date
	{				
		position:absolute;
		left:525px;
		top:21px;
		font: bold .8em verdana;
		color: navy;
		text-align:left;
	}

	* html #date{ left:500px}


	.footer
	{
		margin-top:10px;
		
	}

	.homefooter
	{
		position:absolute; 
		margin-left:0px;
		top:513px;
		left:-202px;
	}	

	* html .homefooter {top:448px;}

	#footer2
	{
		position:absolute;
		left:3px;
		top:1337px;			
	}

	.bottomlinks, .bottomlinks2, .bottomlinks3 {z-index:500; 
		position:absolute;		
		width:850px;
		text-align:center;
		font-size:0.9em;
	}

	.bottomlinks {margin-top:-20px;}

	.bottomlinks2 {margin-top:-10px;}	

	* html .bottomlinks, .bottomlinks2 {top:1361px;}

	* html #footer2 {top:1341px;}

	.bottomlinks3 {text-align:left;margin-top:110px;}

	* html .bottomlinks3 {margin-top:460px;}

	.footer2
	{
		position:absolute;
		top:1323px;
		left:2px;		
	}
	
	* html .footer2 {top:1337px;}
	
	#topnavposition
	{
		z-index:4;
		position:absolute;
		top:-1px;	
		left:558px;		
	}	

	* html #topnavposition {top:10px;}

	.topnav
	{		
		position:relative;
		font-weight: bold;
		font-size: 11px;
		list-style-type: none;	
	}


	* html .topnav { position:absolute; left:-0px; right:-90px}

	.topnav li
	{
		display: inline;
	}

	.topnav li a
	{
		color:gray;		
		text-decoration:underline;		
	}

	.navbar li a:hover
	{
		color: #777777;
	}
			
/******************** Navigation bar ******************************/

	
	.navbarposition
	{
		Z-INDEX: 3;
		left:0;position:absolute;
		top:8px;	 
		LEFT: 24%;		
	}	
	
	* html .navbarposition { left:24%; right:-490px;}
	
	.navbar
	{	
		position:relative;
		TOP:223px;
		padding: 3px 0;
		margin-left:50px;
		margin:0px;
		font-weight: bold;
		font-size: 13px;
		/* border-bottom: 1px solid gray; */
		list-style-type: none;
		text-align: left; /*set to left, center, or right to align the menu as desired*/  
		/*border:1px solid black;*/
	}

	* html .navbar {top:222px; } 
	

	.navbar li
	{
		display: inline;
		margin: 0;
	}

	.navbar li a
	{
		text-decoration: none;
		padding:22px 7px;
		margin-right: 3px;
		/*border: 1px solid gray;*/
		border-bottom: none;
		/*background-color: #f6ffd5;*/
		color: #ffffff;
	}

	


	.navbar li a:hover
	{
		/*background-color: #DBFF6C;*/
		color: #ffff00;
	}

	/*
	.navbar li a:active
	{
		color: black;
	}
	*/

/******************** positioning dropdown menus *******************/

	
	/* club information dropdown menu */

	#mnu_info		
	{ 
		Z-INDEX: 15; /*Z-INDEX: 113;*/
		LEFT: 330px; 
		POSITION: absolute; 
		TOP: 261px; 
		visibility:hidden;
	}		

	#mnu_info a img		
	{ 				
		width:130px;		
		height:24px;		
	}		

	* html #mnu_info a img	{margin-top:-1px;}

	/* Dragon/Lion Dance dropdown menu */

	#mnu_Dance		
	{ 
		Z-INDEX: 5;
		LEFT: 460px; 
		POSITION: absolute; 
		TOP: 262px;  
		visibility:hidden
	}

	#mnu_Dance a img	
	{ 
		width:145px; 
		height:24px;
	} 

	#mnu_Dance a img {margin-top:-1px;}	

	/* Media dropdown menu */

	#mnu_test
	{ 
		Z-INDEX: 5;
		LEFT: 605px; 
		POSITION: absolute; 
		TOP: 262px; 
		visibility:hidden
	}

	#mnu_test a img	
	{ 
		width:114px; 
		height:24px;
	}

	#mnu_test a img {margin-top:-1px;}


	* html #mnu_info, #mnu_Dance, #mnu_test {padding-top:1px; top:262px}	

/******************************* sidebar **************************************/
	
	#sidebar
	{
		Z-INDEX: 4; 
		LEFT: 8%;
		Position:relative;
		TOP: 228px;
		width:180px;			
		padding:5px;		
		float:left;
		/*border:1px dotted gray;*/
	}	

	* html #sidebar{ top:270px;padding-top:15px;}
		
	.newsborder
	{
		list-style-type: none;
		margin: 5px 0;		
		border-bottom-width: 0;
		background: white url(glossyback.jpg) repeat-x bottom left;
		font: bold 13px sans-serif;
		color: white;
		display: block;
		width: 168px;
		padding: 5px 0;
		padding-left: 10px;
		text-decoration: none;
		border: 1px solid navy;		
		margin-top:57px;
	}

	* html .newsborder{ width: 168px; }
	

	.joinborder2
	{
		list-style-type: none;
		margin: 5px 0;		
		border-bottom-width: 0;
		background: white url(glossy_red.jpg) repeat-x bottom left;
		font: bold 13px sans-serif;
		color: white;
		display: block;
		width: 168px;
		padding: 5px 0;
		padding-left: 10px;
		text-decoration: none;
		border: 1px solid navy;		
	}

	* html .joinborder2 { width: 168px; }
	

	.joinbox a:hover
	{
		color:#ff3300;		
	}		

	.joinbox ul
	{
		margin-left:-.9cm;
		margin-top:-.3cm;
		list-style:none;
		text-align:left;		
	}		

	* html .joinbox ul{ margin-left:.5cm }

	.joinbox ul li a
	{
		color:black;
		font-size:10px;	
	}

	.joinbox, .newsbox
	{
		postion:relative;
		left:0px;
		margin-left:0px;
		margin-bottom:10px;
		text-align:justify;
		border:1px solid navy;
		font-size:11px;
		padding:13px;
	}	


	.newstitle {text-decoration:none;margin-left:15px}	

	.joinbox
	{		
		margin-TOP: -6px;
		width:152px;	
		background-color:#ffcccc;			
	}
	
	* html .joinbox{ width: 152px; }

	.xhtmlbox
	{
		position:relative;
		LEFT: 0px; 
		TOP: -15px;
		width:152px;							
		padding:13px;
		font-size:11px;
		/*border:1px solid navy;*/
		text-align:center;
		visibility:visible;
	}	

	* html .xhtmlbox{width:180px;}

	.addsensebox
	{
		margin-left:10px;
	}


	.addsensecontent
	{
		position:absolute;
		top:950px;
		left:100px;
	}

	/* Advertisement border */
	.bl {background: url() 0 100% no-repeat #e68200; width: 11em; text-align:left;}
	.br {background: url() 100% 100% no-repeat;}
	.tl {background: url(tl.gif) 0 0 no-repeat}
	.tr {background: url(tr.gif) 100% 0 no-repeat; padding:5px}		 	
	.clear {font-size: 1px; height: 1px}


	/*************** gallery **************/
	
	.galleryborder
	{
		height:20px;
		width:300px;
		padding: 5px 0;
		border: 1px solid black;
		background: white url(glossyback.jpg) repeat-x bottom left;
		font: bold 13px sans-serif;
		color: yellow;
	}

	.gallerybox
	{	
		height:95px;
		margin-TOP: -6px;
		width:300px;	
		background-color:#dbe0e3;
		margin-top:-3px;
		border:1px solid black;	
		margin-bottom:20px;
	}

	.gallerybox img
	{
		margin-top:10px;
		margin-left:20px;
		height:70px;
		width:100px;	
	}

	.gallerybox span 
	{
		margin-left:135px;
		margin-top:-70px;
		float:left;
		color:black;
	}

/******************************* content positioning **************************/

	#pagecontent 
	{		
		LEFT: 182px; 
		POSITION: absolute; 
		TOP: 54px;
		width:665px;		
		padding:0px;	
		/*background-color:ccccff;*/
		/*border:1px solid gray;*/
	}

	
	* html #pagecontent{top:8px; left:183px;width:644px;}

	.content
	{		
		position:absolute;
		top:45px;
		margin-left:.4cm;
		/*border:1px solid #333;*/
		/*border-left:1px dotted black;*/
		/*border-right:1px dotted black;*/
		float:left;

		color:#666699;
		padding:0px 10px;
		padding-right:25px;
	}

	* html .content{left:0px;top:50px; }
			
	.photo
	{
		float:right;
		margin-top:55px;
		margin-left:5px;
		margin-right:10px;
	}

	* html .photo{ margin-top:42px;margin-left:8px;margin-right:10px } /** html .photo{ margin:30 8 }*/

	.pageText
	{
		top:10px;
		position:relative;
		margin-right:15px;
		color:#666699;
		padding:0px 10px;
		/*border:1px solid black;*/		
		margin-bottom:30px;
	}


	* html .pagetext{ margin-top:10px; margin-right:20px;}
		

	#indexlinks
	{ 		
		margin:0;
		padding: 15px;
		font: bold 11px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
	}

			
	#indexlinks ul
	{
		margin: 0;
		margin-bottom: 1em;
		padding-left: 0;
		float: left;
		width: 102%;						
		background: url(stripe.gif) center center repeat-x;
		border: 1px solid gray;
		border-width: 1px 0; /*gets rid of side borders*/
	}

	* html #indexlinks ul{width:105%}

	* html .newsindexlinks{width:92%}

	* html .indexlinks ul{ /*IE only rule. Delete extra margin-bottom*/
	margin-bottom: 0;
	}
	
	#indexlinks ul li
	{
		display: inline;		
	}

	#indexlinks ul li span
	{
		float:left;
		padding-top:3px;
	}


	#indexlinks ul li a
	{		
		float: left;
		color: navy;
		padding: 3px 6px 4px 6px;		
		padding-right: 18px;
		text-decoration: none;
		background: transparent url(breadcrumb.gif) no-repeat center right;	
	}

	#indexlinks ul li a:hover
	{
		text-decoration: underline;
	}
	
	
	#indexlinks a:visited, #indexlinks a:active
	{
		color: navy;
	}


/* photo Gallery */

	#flashcontent {
		z-index:4;
		margin-top:20px;
		height: 660px;
		width:610px;
		margin-bottom:40px;
	}

	.counter
	{		
		z-index:120;
		position:absolute;
		top:469px;
		left:-190px;	
	}

	* html .counter {top:403px;}

	.visitors
	{
		position:absolute;
		margin-top:50px;
		left:-99px;
		font-size:10px;
		color: black;
	}

	* html .visitors { top:350px;left:-100px }
	
/* video Gallery */

	.videoplayer
	{
		position:absolute;
		top:120px;
		left:150px;	
		padding:10px;
		padding-top:20px;
		border:1px solid black;	
		background-color:#ddddd0;
	}


.pagetext {}

.pagetext h2 {line-height:140%;}

.pagetext ul {list-style:square}

.pagetext ul li li a {text-decoration:none;}


/*------------------ RSS Feed Reader styles ------------------*/


.RSSfeedContainer{
	margin-top:2em;
	margin-bottom:1em;
	color:black;
	background-color:#ffffcc;
}

.RSSfeedHeading{
	margin:0;
	width:33.6em;
	background:url(glossy_red.jpg);
	border:1px solid black;
	padding-left:0.3em;
	color:#666666;
}

* html .RSSfeedHeading{width:33.7em;}

.titlefield{ /*CSS for RSS title link in general*/
	text-decoration: none;
	color:blue;
}

.labelfield{ /*CSS for label field in general*/
	color:brown;
	font-size: 90%;
}

.datefield{ /*CSS for date field in general*/
	color:#666666;
	font-weight:bold;
	font-size: 90%;
}

#example3{ /*Demo 3 main container*/
	width: 46.9em;
	height: 22em;
	border: 1px solid navy;
	padding: 4px;
}

* html #example3{width:47em;}

#example3 p{ /*Demo 3 P element that separates each entry*/
	margin-top: 0;
	margin-bottom: 9px;
}

code{ /*CSS for insructions*/
	color: red;
}