html {
	/* TODO color de fondo */
	background: #06001A url(images/bg2.gif) repeat;
	color: #FFF;
	overflow-x: hidden; /* IE hack to prevent scrolling when using javascript setXY */
}

body { font-family: "Trebuchet MS"; }

strong { font-weight: bold; }
a { color: white; }
a:focus { outline: none; }
h1 { font-size: 160%; }
h2 { font-size: 145%; }
.pic { 
  border: 2px solid white; 
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
.signature { text-align: center; font-size: 8pt;}
.clearfix { clear: both; }
.onebit_mp3 span {
  vertical-align: middle;
}

/* -------------------------
 * Top frame contents
 * ------------------------- */
/* has hack */
#top-frame {
	border-bottom: 2px solid white;
	padding: 8px;
	background-image: url(images/bgc.png);
}

	#site-title { 
		letter-spacing: 7px; 
		margin: 0 5px; 
		font-size: 200%; 
		font-weight: bold; 
		color: white; 
		float: left;
	}

	#page-section {
		letter-spacing: 5px; 
		margin: 5px 20px;
		text-align: right; 
		font-size: 154%;
		font-weight: bold;
		float: right;
	}

	
	#navigation-menu {
		text-align: right;
		padding: 3px;
		margin: 0;
		color: white;
		clear: both;
		font-size: 100%;
	}

	#navigation-menu  a { margin: 0 5px; }
	
	/* has hack */
	#subnavigation-menu {
		text-align: center;
		padding: 0 3px;
		margin: 0;
		color: white;
		font-size: 14pt;
		border: 1px dotted white;
		padding: 8px;
		background: transparent url(images/bgc.png);
		letter-spacing: 4px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
	}

	#subnavigation-menu  a { margin: 0 5px; }	
	
	.current-section { font-weight: bold; letter-spacing: 1px;}
	
	.current-subsection { 
		font-weight: bold; 
		letter-spacing: 4px; 
		border: 1px solid white; 
		background-color: #101010;
    padding: 0 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
	}
	
/*
	\\ End top frame content
*/

/* -----------------------
 * Center frame content
 * ----------------------- */

#container {
	width: 800px;
	border: 1px solid white;
	margin: auto;
	margin-top: 50px;
	background: #080808 url(images/bgc.jpg) no-repeat center center;
}

	/* has hack */
	#content-frame {
		height: 480px;
		overflow: auto;
		padding: 20px 25px;
		background: transparent url(images/bgc2.png) repeat;
		font-size: 110%;
		*font-size: 105%;
		overflow-x:hidden;/* FF hack to prevent scrolling when using javascript setXY */
	}
	
		#content-frame h1 { border-bottom: 1px solid white; font-weight: bold; }
		#content-frame h2 { border-bottom: 1px solid white; font-weight: bolder; border-bottom: 1px solid white; width: 70%;}
		#content-frame p { padding: 5px 0; }
		#content-frame ul.outer-list { padding: 5px 0; }
		#content-frame ul.inner-list { padding: 5px 0; }
		#content-frame ul.outer-list  li { list-style-type: square; list-style-position: inside; margin-left: 10px; }
		#content-frame ul.inner-list li { list-style-type: circle; list-style-position: inside; margin-left: 30px;}
		#content-frame .list-header { font-size: 114%; text-decoration: none; font-weight: bolder;}
		/* has hack */	
		#content-frame .criticism { 
			background: transparent url(images/bgc.png) repeat;
			font-size: 10pt; 
			border: 4px double #2d2d2d; 
			padding: 15px 20px; 
			margin: 10px auto; 
			width: 90%;
			font-style: italic;
      -moz-border-radius: 6px;
      -webkit-border-radius: 6px;
      border-radius: 6px;      
		}
			#content-frame .criticism-author { 
				font-size: 85%;
				*font-size: 80%;
				text-align: right;
				font-style: italic;
				display: block;
				padding-top: 10px;
			}
		/* has hack */
		#content-frame .expo {
			background: transparent url(images/bgc.png) repeat;
			font-size: 100%;
			*font-size: 95%;
			border-left: 1px solid white;
			border-right: 1px solid white;
			border: 1px solid white;
			padding: 15px 20px;
			margin: 10px auto;
			width:90%;
      -moz-border-radius: 6px;
      -webkit-border-radius: 6px;
      border-radius: 6px;      
		}
			#content-frame .expo-name { font-size: 11pt; font-weight: bold; display: block; font-style: italic; padding-bottom: 5px;}
			#content-frame .expo-date { font-weight: normal; font-style: normal; }
			#content-frame .expo-info { }
			#content-frame .expo-aux { font-size: 8pt; padding-top: 5px; display:block; }
			#content-frame .expo-pictures { text-align: center; padding: 10px 0 0 0; }
			#content-frame .expo-pictures a { text-decoration: none; }
      #content-frame .expo-picture-container  { float: left; margin: 0 5px; }
      #content-frame .picture-description { display: block; font-size: 9pt; margin:0;}  

/* End center frame content */

/* ------------------------
 * Footer frame content
 * ------------------------ */
/*
#footer-frame {
	border-top: 2px solid white;
	text-align: right;
	padding: 10px;
	margin: 0;
	background-image: url(images/bgc.png);
	font-size: 140%;
}*/

#footer  { text-align: center; font-size: 85%; margin: 10px 0; }
	#footer  p { text-align: center; }
		#footer p img { margin: 0 10px; }

/* End footer frame content */

/* -------------------------
 * Sections
 * ------------------------- */

	/* ***************************
	 * Home (language selection)
	 * *************************** */
		#home {
			width: 784px;
			border: 1px solid white;
			margin: auto;
			margin-top: 50px;
			height: 506px;
			background: #2d2d2d url(images/home-c1.jpg) center center;
		}	
		
	
	/* ************************
	 * Galleries
	 * ************************ */
		#gallery { padding: 15px 0; margin: 15px 0; }
		#paints-preview { 
			text-align: center; 
			float: left; 
			width: 330px; 
			border-right: 2px solid white; 
			padding: 10px 0 30px 0;
		}
		#paints-preview-aux { /* supports vertical overflow */
			text-align: center; 
			float: left; 
			width: 330px; 
			border-right: 2px solid white; 
			padding: 10px 0 30px 0;
			height: 325px;
			margin-top: 15px;
			overflow: auto;
		}		
			.preview { border: 2px solid white; margin: 4px 8px;}
			.preview-selected { border: 2px solid #101010} 
			a:hover .preview { border: 2px solid #101010;}
			
		#paints-container { 
			float: left; 
			width: 346px; 
			text-align: center; 
			padding: 10px; 
			overflow: auto; 
			border: 1px solid white;
			margin-left: 30px;
			margin-top: 15px;
			height: 345px; 
		}
			#paints-container ul { /* width is setted inline */ }
			/* has js and css hack */
			.paint { 
				display: block; 
				float: left;
				margin: 0 50px 0 70px;
			}
			.paint img { border: 2px solid white;}
			.paint-name{ font-size: 86%; text-align: center; height: 1px; padding: 0 !important; }
			.paint-description { /* is displayed using javascript */
				width: 120px;
				border: 2px solid white;
				font-size: 75%;
				text-align: center;
				background-color:#080808;
				position: absolute;
				display: none;
			}			
			.pic-desc { /* displayed using javascript*/
				font-size: 12pt;
				text-align: center;
				background-color: #080808;
				position: relative;
				display: none;
			}