* {
	padding: 0;
	margin: 0;
}

body {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	background: #ffffff;
	color: #000000;
	text-align: center;
}

img {border:0;}

/* content */

div#content {
	width: 960px;
	height: 1455px; 
	text-align:left; 
	background: #ffffff url(../../img/tech/ct_bg.gif) repeat-y top left;
	
	margin: 0 auto; 
}

	div#content .top {
		background: url(../../img/tech/ct_top.gif) no-repeat top left;
	}

		/* category */
	
		div#cat {
			width: 216px;
			float:left;
			margin-top: 5px;
		}
		
			div#cat form {
				margin: 0 0 15px 0;
			}	
		
			div#cat form input {
				font-family: tahoma;
				font-size: 0.8em;
				border: 1px solid #cccccc;
			}
			
			div#cat form input.txt {
				
				background: #ffffff url('../../img/lupa.gif') no-repeat left center;
				width: 163px;
				padding: 5px 0 5px 25px;
				margin: 5px 0 0 18px;
			
			}
	
			
			
			div#cat a {
				color: #00234c;
				text-decoration: none;
			
				display: block;
				background: url(../../img/nota.gif) no-repeat top left;
				
				padding-left: 38px;
				margin-bottom:4px;
			}
	
			div#cat a:hover {text-decoration: underline; color:#000000;}
			
			div#cat a.active {background: url('../../img/nota_r.gif') no-repeat left top; color: #000000;}
	
			div#cat div.sub a {
				font-size: 0.8em;
				padding-left: 45px;
				
				background: url('../../img/nota_s.gif') no-repeat top left;
			}
			
			div#cat div.sub a.active {
				background: url('../../img/nota_s_r.gif') no-repeat top left;
				color: black;
			}
			
			div#cat a b {
				color:#CC0033;
				font-style:italic; 
				padding-left: 4px;
			}
			
	
		/* category */
	
		/* center */
	
		div#center {
			width: 571px;
			float:left;
	
			margin: 0 1px;
		}
	
			div#player {
				background: #696969;
			}
	
			div#src_str { 
				padding: 10px; 
				background: #99dff9;  
				border-bottom: 1px solid #ffffff;
			}
			
			div#err_str {
				margin: 15px 10px;
			}
			
				div#err_str  p {
					margin-bottom: 10px;
				}
			
			/* melody */
			
			table#melody {
				margin: 5px 10px 5px 10px;
				font-size: 13px;
			}
	
			table#melody td {
				height: 40px;
	
				padding: 0 2px;
			}
			
			table#melody td.d {
				width: 100%;
	
				padding-left: 8px;
			}
			
			table#melody td.d a {
				color:#000000;
				text-decoration: none;
			}
			
			table#melody td.d a:hover {
				text-decoration: underline;
			}
			
			table#melody td.d b {
				color:#CC0033;
				font-style:italic; 
				padding-left: 4px;
			}
			
			table#melody td.ln {
				height: 10px;
				background: url("../../img/tech/d_line.gif") repeat-x left;
			}
			
			table#melody td.d p {
				font-size: 10px;
				font-weight: bold;
				color: #808080;
			}
	
			/* melody */
	
		/* center */
	
		/* info */
		
		div#info { /*171*/
			width: 165px;
			float:left;
			
			padding-top: 15px;
		}
		
			div#info p {
				font-size: 11px;
				margin: 0 10px 10px 5px;
			}
	
		/* info */

/* content */

/* content bottom: pages */

div#con_bottom{
	width: 960px;
	background: #ffffff url(../../img/tech/ct_bg.gif) repeat-y top left;

	text-align:left;
	margin: 0 auto;
}

	div#con_bottom .bottom {
		height: 40px;
		background: url(../../img/tech/ct_bottom.gif) no-repeat bottom left;
		
	}

		div#pages {
			width:530px;
			height: 21px;
			background: #dadada url(../../img/tech/pg_bottom.gif) no-repeat bottom left;;

			margin-left: 217px;
			padding: 9px 10px 10px 30px;
		}
		
			div#pages a { color: #626469; text-decoration: none; margin: 0 3px;}
		
			div#pages a:hover { color: #000000; text-decoration: underline; }
			div#pages a:visited { color: #626469; }
			div#pages a:visited:hover { color: #000000; text-decoration: underline;}
			
			div#pages b {
				margin: 0 3px;
			}

/* content bottom: pages */


.f_clear {
	clear: both;
}


/* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {
    content: ".";              /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;                  /* ensure the period is not visible */
    clear: both;               /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

.clearfix {display: inline-block;}   /* a fix for IE Mac */

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */