body { font-family: Georgia; }

/********* @font-face to use */

@font-face {
	font-family: 'GraublauWebRegular';
	src: url('type/GraublauWeb/GraublauWeb.eot');
	src: local('Graublau Web Regular'), local('GraublauWeb-Regular'), 
		url('type/GraublauWeb/GraublauWeb.otf') format('opentype'), 
		url('type/GraublauWeb/GraublauWeb.svg#GraublauWeb-Regular') format('svg');
}

@font-face {
	font-family: 'GraublauWebBold';
	src: url('type/GraublauWeb/GraublauWebBold.eot');
	src: local('Graublau Web Bold'), local('GraublauWeb-Bold'), 
		url('type/GraublauWeb/GraublauWebBold.otf') format('opentype'), 
		url('type/GraublauWeb/GraublauWebBold.svg#GraublauWeb-Bold') format('svg');
}

@font-face {
	font-family: 'Museo700';
	src: url('type/Museo/Museo700-Regular.eot');
	src: local('Museo 700'), local('Museo-700'), 
		url('type/Museo/Museo700-Regular.woff') format('woff'), 
		url('type/Museo/Museo700-Regular.otf') format('opentype'), 
		url('type/Museo/Museo700-Regular.svg#Museo-700') format('svg');
}

@font-face {
	font-family: 'Museo500';
	src: url('type/Museo/Museo500-Regular.eot');
	src: local('Museo 500'), local('Museo-500'), 
		url('type/Museo/Museo500-Regular.woff') format('woff'), 
		url('type/Museo/Museo500-Regular.otf') format('opentype'), 
		url('type/Museo/Museo500-Regular.svg#Museo-500') format('svg');
}

@font-face {
	font-family: 'Museo300';
	src: url('type/Museo/Museo300-Regular.eot');
	src: local('Museo 300'), local('Museo-300'), 
		url('type/Museo/Museo300-Regular.woff') format('woff'), 
		url('type/Museo/Museo300-Regular.otf') format('opentype'), 
		url('type/Museo/Museo300-Regular.svg#Museo-300') format('svg');
}

/********* interface */

#typeQuery{
	position: fixed;
	font-family: Helvetica;
	top: 0px;
	width: 100%;
}

.panelFontSize{
	font-size: 24px;
	padding-top: 8px;
	color: #fff;
}

.btn-change {
	text-align: center;
	width: 244px;
	height: 35px;
	padding: 5px 10px 0 0;
	display: block;
	font: bold 120%/100% Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
}

/********* collapsible panel */


a:focus {
	outline: none;
}
#panel {
	background: #ccc;
	height: 20px;
	display: none;
}
.slide {
	margin: 0;
	padding: 0;
	border-top: solid 4px #422410;
	background: url(images/btn-slide.gif) no-repeat center top;
}
.btn-slide {
	background: url(images/white-arrow.gif) no-repeat right -50px;
	text-align: center;
	width: 144px;
	height: 20px;
	padding: 5px 10px 0 0;
	margin: 0 auto;
	display: block;
	font: bold 120%/100% Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
}
.active {
	background-position: right 12px;
}