body 	{ 	background-color: rgb(214,214,214); /*#696969;rgb(80,100,80);*/
			text-align: center;
			color: white;
			}
	
		/*Firefox 3.6+, Chrome 6+, Safari 3.1+, IE 9+, Opera 10+*/
		
		@font-face {	font-family: 'Inkpen2 Script';
				src: url('fonts/INK2SCRI.TTF') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'Arial';
				src: url('fonts/arial.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'Times New Roman';
				src: url('fonts/times.ttf') format('truetype'); 
				font-weight: normal;    
				font-style: normal;}

		@font-face {	font-family: 'Courier New';
				src: url('fonts/cour.ttf') format('truetype');
				font-weight: normal;    
				font-style: normal;}

		@font-face {	font-family: 'Roboto-Regular';
				src: url('fonts/Roboto-Regular.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'Roboto-Medium';
				src: url('fonts/Roboto-Medium.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'Roboto-Italic';
				src: url('fonts/Roboto-Italic.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'Roboto-MediumItalic';
				src: url('fonts/Roboto-MediumItalic.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'OpenSans-Italic';
				src: url('fonts/OpenSans-Regular.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		@font-face {	font-family: 'OpenSans-Italic';
				src: url('fonts/OpenSans-Italic.ttf') format('truetype');
				font-weight: normal;
				font-style: normal;}

		*	{	font-family: Roboto-Regular, OpensSans-Regular, OpenSans-Italic, Times New Roman,/*Special Elite,*/ Inkpen2 Script, Times New Roman, Arial, Courier New;
				font-size : 16px;
				color : black;}

		.robotomediumitalic
			{	font-family: Roboto-MediumItalic, Roboto-Regular, Inkpen2 Script, Times New Roman, Arial, Courier New;
				font-size : 16px;
				color :  rgb(10,10,10);
				}

		h1	{ 	text-align : center;
				color: white;
				background-color : black;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;
				font-weight: normal;
				font-size: 28px;
				}

		h2	{ 	text-align : center;
				color: black;
				font-size: 16px;
				}	
				
		.fs_18b {	color: black;
				font-size: 18px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}	

		.fs_18w {	color: white;
				font-size: 18px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}	

		.fs_24b {	color: black;
				font-size: 24px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_24w {	color: white;
				font-size: 24px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		a.fs_32red {	color: red;
				text-decoration : underline;
				font-size: 32px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		a.fs_24blue {	color: blue;
				text-decoration : underline;
				font-size: 24px;
				font-family: Roboto-Medium, Roboto-Regular, Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_32red {	color: red;
				text-decoration : none;
				font-size: 32px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_24blue {	color: blue;
				text-decoration : none;
				font-size: 24px;
				font-family: Roboto-Regular, Inkpen2 Script, Times New Roman, Arial, Courier New;}


		.fs_48b {	color: black;
				font-size: 48px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_48w {	color: white;
				font-size: 48px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_60b {	color: black;
				font-size: 60px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.fs_60w {	color: white;
				font-size: 60px;
				font-family: Inkpen2 Script, Times New Roman, Arial, Courier New;}

		.spelite18b {	color: black;
				font-size: 18px;
				font-family: Special Elite, Courier New, Times New Roman;}

		.spelite18w {	color: white;
				font-size: 18px;
				font-family: Special Elite, Courier New, Times New Roman;}

		.spelite16b {	color: black;
				font-size: 16px;
				font-family: Special Elite, Courier New, Times New Roman;}

		.spelite16w {	color: white;
				font-size: 16px;
				font-family: Special Elite, Courier New, Times New Roman;}

		.website_link {	text-decoration : none;}

	audio { width: 300px; height: 30px; display: block; }
	
	#logo_box {	position : absolute;
			background-color: rgb(220,220,220);
			border-width: 1px; 
			border-color: black; 
			top : 20px; left : 10px; width : 160px; height : 200px; 
			}

	#header_box {	position : absolute;
			background-color: rgb(220,220,220); 
			top : 20px; left : 190px; width : 760px; height : 200px; 
			}

/*
#div_top_hypers {
    background-color:#eeeeee;
    display:inline;      
}
#ul_top_hypers li{
    display: inline;
}
*/
	#nav_box {	position : absolute;
			display : inline;
			background-color: #A0A0A0;
			top : 150px; left : 200px; width : 740px; height : 60px; 
			}

	#ul_nav_box li {	display : inline;
				font-family : Inkpen2 Script, Roboto-Medium, Roboto-Regular;
				font-size : 23px;
				color : black; }

	#ul_nav_box li a {	display : inline;
				font-family : Inkpen2 Script, Roboto-Medium, Roboto-Regular;
				font-size : 23px;
				color : black; }

	#message_box {	position : absolute;
			text-align: center;
			background-color: rgb(220,220,220); 
			top : 240px; left : 10px; width : 940px; height : 100px; 
			}

	#image_box {	position : absolute;
			background-color: rgb(220, 220, 220);
			top : 240px; left : 10px; width : 940px; height : 890px; /* was 360 & 725 */
			}

	#image_box_content {	
			position : absolute;
			top : 240px; left : 10px; width : 940px; height : 890px; /* was 360 & 725 */
			}

	#footer_box {	position : absolute;
			text-align: center;
			background-color: rgb(220,220,220); 
			top : 1150px; left : 10px; width : 940px; height : 40px; 
			}

	#audio_box1 {	position : absolute;
			background-color: rgb(220,220,220); 
			top : 240px; left : 10px; width : 300px; height : 890px; /* was 360 & 725 */
			}

	#audio_box2 {	position : absolute;
			background-color: rgb(220,220,220); 
			top : 240px; left : 330px; width : 300px; height : 890px; /* was 360 & 725 */
			}

	#video_box1 {	position : absolute;
			background-color: rgb(220,220,220); 
			top : 240px; left : 330px; width : 300px; height : 890px; /* was 360 & 725 */
			}

	#video_box2 {	position : absolute;
			background-color: rgb(220,220,220); 
			top : 240px; left : 650px; width : 300px; height : 890px; /* was 360 & 725 */
			}

	#pngpic { 	position : absolute;
			top : 40px; left : 830px; width : 100px; height : 100px;
			z-index : 5;
			}

	#wrapper {	position: relative;
			left: 0px;
			top:  0px;
			width: 960px;
			height: 740px; 
			margin: 0px auto 0px auto;
			background-color: white;
			text-align: left;}

	#wrapper_long {	position: relative;
			left: 0px;
			top: 0px;
			width: 960px;
			height: 1210px;
			background-color: #A0A0A0;
			/*background-color: #393939;*/
			margin: 0px auto 0px auto;
			text-align: left;}

	#top_page {	position: absolute;
			left: 0px;
			top: 0px;
			text-align: left;}

		ul {	list-style: none;
			padding-left: 10px; }​

/* AUDIO PLAYER css styling */
	#playlist{
            list-style: none;
        }
        #playlist li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist .current-song a{
            font-weight : bold;
	    text-decoration : underline;
        }

/* AUDIO PLAYER 1 css styling */
	#playlist1{
            list-style: none;
        }
        #playlist1 li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist1 .current-song1 a{
            font-weight : bold;
	    text-decoration : underline;
        }

/* AUDIO PLAYER 2 css styling */
	#playlist2{
            list-style: none;
        }
        #playlist2 li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist2 .current-song2 a{
            font-weight : bold;
	    /* background-color : rgb(40,40,40); 
	    color : rgb(254,80,0); */
	    text-decoration : underline;
        }

/* AUDIO PLAYER 3 css styling */
	#playlist3{
            list-style: none;
        }
        #playlist3 li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist3 .current-song3 a{
            font-weight : bold;
	    /* background-color : rgb(40,40,40);  
	    color : rgb(254,80,0); */
	    text-decoration : underline;
        }

/* AUDIO PLAYER 4 css styling */
	#playlist4{
            list-style: none;
        }
        #playlist4 li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist4 .current-song4 a{
            font-weight : bold;
	    /* background-color : rgb(40,40,40);  
	    color : rgb(254,80,0); */
	    text-decoration : underline;
        }

/* AUDIO PLAYER 5 css styling */
	#playlist5{
            list-style: none;
        }
        #playlist5 li a{
            font-weight : normal;
	    text-decoration : none;
        }
        #playlist5 .current-song5 a{
            font-weight : bold;
	    /* background-color : rgb(40,40,40);  
	    color : rgb(254,80,0); */
	    text-decoration : underline;
        }


/* My styling */

	a	{ text-decoration : none; }

	a.nav_text { 	text-decoration : none;
			color : white; }

	li a.nav_text:hover { background-color : yellow;
			      color : black; }		

/*p:hover, h1:hover, h2: hover, a:hover,*/ 
			li a:hover {
			background-color : yellow;
			}
/* didn't work
	audio	{	filter: sepia(20%) saturate(70%) grayscale(1) contrast(99%) invert(12%);
		}
*/