/*  THIS IS THE STYLE SHEET FOR THE INDEX.HTML FOR THE THINKINGMUSIC HOMEPAGE  */
/* all CSS validated by W3C CSS Validation Service,  */

html, body
	{
	margin: 0; padding: 0; 
	}
	
body
	{position: relative;
	min-height: 100vh;
	background: #3C4144 linear-gradient(to bottom, white 299px,
transparent 299px) no-repeat; /*   previous way of doing it:      background: url(images/bodyimage.gif) repeat-x; */  /* was #3d3d3d  */
	}	


#top /*main div for whole page, horizontally centered*/
	{
	position: relative;
	width: 1024px;
	padding-top: 1px; padding-bottom: 0; padding-right: 0; padding-left: 0;  
	margin-top: -1px; margin-bottom: 0px; margin-right: auto; margin-left: auto;	
		/* padding-top and margin top take care of Opera bug that 'lowers page' if fed a long page */
	border: none;	
	background: transparent;
	}


#logo  /* image-replacement div, with li's (for actual text) and image-containing span */
    	{
     	position: relative;
     	width: 520px;
     	height: 160px;
     	margin-top: 16px; margin-right: auto; margin-bottom: 0px; margin-left: 97px;
		padding: 0;
     	text-align: center;
     	overflow: hidden;
     	background: transparent;
     	border: none;
     	}

		#logo span
			{
			background: url(images/logo.jpg) no-repeat;
			position: absolute;
			top: 0; 
			left: 0;
			width: 100%;
			height: 100%
			}
		
		#logo h1 
			{			
			padding: 0; 
			text-align: center;
			margin-top: 50px; 
			margin-bottom: 6px;
			font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
			font-size: 29px; 
			font-weight: normal;
			color: #8A3404;
			/*border: 1px solid green;*/
			}
			
		

a 	{
	line-height: 135%;   
	padding: 0;
	margin: 0;
	background-color: transparent;
	border: none;
	text-decoration: none;
	outline: none;
	}









	
#left   /*  sidebar div  */
	{
	position: absolute;
	left: 17px; top: 328px; right: 763px; 
	width: 242px; 
	border: 2px solid #a49b5d;  /* was  #605D5C  */
	margin: 0;  
	padding: 0;
	background: #445f81 url(images/tmldvandimg_240x590_blue.png) no-repeat; /* was #495F5F  */
	z-index: 2;
	font-family: "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", "Lucida", "Verdana", "Arial", "Helvetica", sans-serif; 	/* was font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;  */
	height: 592px; 
	}
	

#left ul#highest
	{
	margin: 123px 0 auto /*531px */ 34px;
	padding: 0;
	/*border: 1px solid red;*/
	}
	
#left ul
	{
	margin: 0  0 219px 65px;
	padding: 0;
	/*border: 1px solid red;*/
	}  


#left li.first
	{
	margin: 0;
	list-style: none;
	font-size: 24px;
	background: transparent;
	padding: 0;
	}	
	
#left li.indenttop
	{
	margin-top: 6px;
	margin-left: 48px;
	padding: 0;
	list-style: none;
	font-size: 14px;
	background: transparent;
	/*border: 1px solid yellow;*/
	}	

#left li.indent
	{
	margin-top: 13px;
	margin-left: 48px;
	margin-right: 0; 
	margin-bottom: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	background: transparent;
	/*border: 1px solid yellow;*/
	}	


#left li.th
	{
	margin: 18px -300px 0 0;  
	padding: 0;
	list-style: none;
	font-size: 24px;
	background: transparent;
	}
	
#left li.bottom
	{
	margin: 18px 0 0 0;  
	padding: 0;
	list-style: none;
	font-size: 24px;
	background: transparent;
	}

	
#left li.th span#conv
	{
	margin-left: 7px; /* was 13px; */
	font-size: 18px; /* was 18 */
	}	
	
li a, li.indenttop a, li.indent a, li.th a
	{
	background-color: transparent;
	padding: 0;
	margin: 0;
	background-color: transparent;
	text-decoration:none;
	outline: none;
	border: none;
	/*border:1px solid green; */
	}

li a, li a:link, li a:visited
	{
	color: #F9F5E8; 
	}
	
li a:hover, li a:active
	{
	color: #a49b5d;  /* blue was #449284; */
	background-color: transparent;
	}	
	

/*	______________ main div ____________________________ */


#main  /*right div*/
	{
	position: absolute;
	left: 211px; top: 200px; right: 23px; 
	width: 790px; 
	height: 748px; /* was 708px;   */
	z-index: 1;
	background: #0b1115 url(images/tmis_blue,smaller.png) no-repeat;   
	margin: 0 0 0 0;
	padding: 0;
	border: none;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 16px;/* on analysis, is 15px;*/
	line-height: 135%;
	color: #451B07;
	}
	
#main div#video
	{
	width: 480px; height: 270px;
	background: #0b1115 url("images/thumbnail.png") no-repeat;
	padding: 0;
	margin: 127px auto 0 auto;		
	}

#main div#vol
	{
	position: absolute;
	top: 405px; left: -5px;
	width: 790px; height: 16px;
	background: #0b1115 url("images/volume_img.png") no-repeat;
	padding: 0;
	margin: 0;	
	}

#main div#danny
	{
	position: absolute;
	top: 445px; left: 447px;
	width: 188px; height: 265px;
	background: #0b1115 url("images/danny_pic.png") no-repeat;
	padding: 0;
	margin: 0;	
	}
#danny p
	{
	width: 188px;  
	margin: 15px auto 0px  103px;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 24px;
	color: #445f81; 
	}		

#main div#classical
	{
	position: absolute;
	top: 447px; left: 106px;
	width: 251px; height: 172px;
	background: #0b1115 url("images/classical_harmony2.png") no-repeat;
	padding: 0;
	margin: 0;	
	}


#main div#lessons
	{
	position: absolute;
	top: 656px; left: 197px;
	width: 193px; height: 57px;
	background: #0b1115 url("images/orange_lessons.png") no-repeat;
	padding: 0;
	margin: 0;	
	}