@charset "UTF-8";
/* CSS Document */

/*@font-face {
	font-family:"EntypoRegular";
	src:url("entypo-webfont.eot");
	src:url("entypo-webfont.eot?#iefix") format("embedded-opentype"),
    	url("entypo-webfont.woff") format("woff"),
    	url("entypo-webfont.ttf") format("truetype"),
    	url("entypo-webfont.svg#EntypoRegular") format("svg");
	font-weight:normal;
	font-style:normal;
}*/

html {
	height:100%;
}

body {
	position:relative;
	height:100%;
	min-width:1024px;
	margin:0px;
}

	a, a:link, a:active, a:visited {color:black; text-decoration:none;}
	a img, a:link img, a:active img, a:visited img {border:0px;}
			a.underline:hover {text-decoration:underline;}
	
	.interactive {
		cursor:pointer;
		transition:opacity .25s ease;
			-webkit-transition:opacity .25s ease;
				-webkit-backface-visibility: hidden;
			-moz-transition:opacity .25s ease;
	}
	
			.interactive:hover {opacity:0.75 !important;}
	
	.active {opacity:1.0 !important;}
			
			.active:hover {opacity:1.0 !important;}
	
	.data {display:none;}
	
	.borderless {border:none !important;}

#body {
	position:relative;
	min-height:100%;
	height:auto !important;
	height:100%;
	z-index:5;
}

	#body::after {
		content:"";
		display:block;
		height:22px;
	}
	
#gallery {
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, .875);
	z-index:100;
}
		
		#gallery > .box {
			position:relative;
			width:90%;
			height:100%;
			margin:0px auto;
			position:relative;
		}
	
	.gallery-image {cursor:pointer;}

#masthead {
	display:block;
	padding:10px 0px;
	z-index:10;
	/*background:rgba(205, 205, 255, 0.25);*/
}

		#masthead > .box {
			margin:0px auto;
			padding-bottom:40px;
			position:relative;
		}
	
	#logo {
		display:block;
		width:300px;
		height:160px;
		margin:0px auto;
		overflow:hidden;
	}
	
		#logo img {
			position:relative;
			top:-50px;
			width:300px;
		}
	
	#spot {
		box-sizing:border-box;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-o-box-sizing:border-box;
		position:absolute;
		left:50%;
		top:-60px;
		width:180px;
		height:180px;
		margin-left:-360px;
		border-width:10px;
		border-style:solid;
		border-radius:90px;
			-webkit-border-radius:90px;
			-moz-border-radius:90px;
		background:rgba(255, 255, 255, 1.0);
	}
	
	.spot-home {border-color:rgba(64, 140, 172, 0.5);}
	.spot-instruments {border-color:rgba(114, 149, 179, 0.5);}
	.spot-studio {border-color:rgba(179, 113, 148, 0.5);}
	.spot-about {border-color:rgba(148, 179, 113, 0.5);}
	.spot-rates {border-color:rgba(179, 144, 113, 0.5);}
	.spot-contact {border-color:rgba(113, 170, 179, 0.5);}
	
		#spot > .box {
			box-sizing:border-box;
				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				-o-box-sizing:border-box;
			position:absolute;
			top:50%;
			left:50%;
			width:150px;
			height:150px;
			margin:-75px 0px 0px -75px;
			padding:10px;
			color:rgba(255, 255, 255, 1.0);
			text-align:center;
			line-height:130px;
			font-family:Arial, Helvetica, sans-serif;
			border-radius:75px;
				-webkit-border-radius:75px;
				-moz-border-radius:75px;
			cursor:pointer;
			opacity:0.5;
			z-index:5;
			transform:rotate(-15deg);
				-webkit-transform:rotate(-15deg);
				-moz-transform:rotate(-15deg);
				-ms-transform:rotate(-15deg);
				-o-transform:rotate(-15deg);
		}
		
		.spot-home > .box {color:rgba(64, 140, 172, 1.0) !important; font-size:24px;}
		.spot-instruments > .box {background:rgba(114, 149, 179, 1.0); font-size:18px;}
		.spot-studio > .box {background:rgba(179, 113, 148, 1.0); font-size:33px;}
		.spot-about > .box {background:rgba(148, 179, 113, 1.0); font-size:36px;}
		.spot-rates > .box {background:rgba(179, 144, 113, 1.0); font-size:36px;}
		.spot-contact > .box {background:rgba(113, 170, 179, 1.0); font-size:27px;}
		
			#spot > .box:hover {opacity:1.0}
			
			.spot-link {
				display:block;
				box-sizing:border-box;
					-webkit-box-sizing:border-box;
					-moz-box-sizing:border-box;
					-o-box-sizing:border-box;
				position:absolute;
				top:50%;
				right:80px;
				margin:-18px 0px 0px 0px;
				padding:0px 95px 0px 0px;
				transform-origin:center right;
						-webkit-transform-origin:center right;
						-moz-transform-origin:center right;
						-ms-transform-origin:center right;
						-o-transform-origin:center right;
			}
			
				.spot-link:nth-of-type(1) {
					transform:rotate(-15deg);
						-webkit-transform:rotate(-15deg);
						-moz-transform:rotate(-15deg);
						-ms-transform:rotate(-15deg);
						-o-transform:rotate(-15deg);
				}
				
				.spot-link:nth-of-type(2) {
					transform:rotate(-40deg);
						-webkit-transform:rotate(-40deg);
						-moz-transform:rotate(-40deg);
						-ms-transform:rotate(-40deg);
						-o-transform:rotate(-40deg);
				}
				
					.spot-link a {
						display:block;
						box-sizing:border-box;
							-webkit-box-sizing:border-box;
							-moz-box-sizing:border-box;
							-o-box-sizing:border-box;
						position:relative;
						height:36px;
						padding:9px 15px 9px 15px;
						line-height:15px;
						font-family:Arial, Helvetica, sans-serif;
						font-size:13px;
						border-width:1px;
						border-style:solid;
						background:rgba(255, 255, 255, 1.0);
					}
					
						.spot-link a:hover, .spot-link a.active {color:rgba(255, 255, 255, 1.0) !important;}
						
						/*.spot-link a.active {opacity:0.5 !important;}
						.spot-link a:hover {opacity:1.0 !important;}*/
						
						.spot-link a > .frame {
							display:block;
							box-sizing:border-box;
								-webkit-box-sizing:border-box;
								-moz-box-sizing:border-box;
								-o-box-sizing:border-box;
							position:absolute;
							top:50%;
							right:0%;
							width:15px;
							height:15px;
							margin:-8px -8px 0px 0px;
							border-right-width:1px;
							border-top-width:1px;
							border-right-style:solid;
							border-top-style:solid;
							background:rgba(255, 255, 255, 1.0);
							transform-origin:center center;
								-webkit-transform-origin:center center;
								-moz-transform-origin:center center;
								-ms-transform-origin:center center;
								-o-transform-origin:center center;
							transform:rotate(45deg);
								-webkit-transform:rotate(45deg);
								-moz-transform:rotate(45deg);
								-ms-transform:rotate(45deg);
								-o-transform:rotate(45deg);
						}
					
					.spot-home .spot-link a,
					.spot-home .spot-link a > .frame
						{color:rgba(64, 140, 172, 1.0); border-color:rgba(64, 140, 172, 1.0);}
					.spot-instruments .spot-link a,
					.spot-instruments .spot-link a > .frame
						{color:rgba(114, 149, 179, 1.0); border-color:rgba(114, 149, 179, 1.0);}
					.spot-studio .spot-link a,
					.spot-studio .spot-link a > .frame
						{color:rgba(179, 113, 148, 1.0); border-color:rgba(179, 113, 148, 1.0);}
					.spot-about .spot-link a,
					.spot-about .spot-link a > .frame
						{color:rgba(148, 179, 113, 1.0); border-color:rgba(148, 179, 113, 1.0);}
					.spot-rates .spot-link a,
					.spot-rates .spot-link a > .frame
						{color:rgba(179, 144, 113, 1.0); border-color:rgba(179, 144, 113, 1.0);}
					.spot-contact .spot-link a,
					.spot-contact .spot-link a > .frame
						{color:rgba(113, 170, 179, 1.0); border-color:rgba(113, 170, 179, 1.0);}
					
					.spot-home .spot-link a:hover,
					.spot-home .spot-link a.active,
					.spot-home .spot-link a:hover > .frame,
					.spot-home .spot-link a.active > .frame
						{background-color:rgba(64, 140, 172, 1.0);}
					.spot-instruments .spot-link a:hover,
					.spot-instruments .spot-link a.active,
					.spot-instruments .spot-link a:hover > .frame,
					.spot-instruments .spot-link a.active > .frame
						{background-color:rgba(114, 149, 179, 1.0);}
					.spot-studio .spot-link a:hover,
					.spot-studio .spot-link a.active,
					.spot-studio .spot-link a:hover > .frame,
					.spot-studio .spot-link a.active > .frame
						{background-color:rgba(179, 113, 148, 1.0);}
					.spot-about .spot-link a:hover,
					.spot-about .spot-link a.active,
					.spot-about .spot-link a:hover > .frame,
					.spot-about .spot-link a.active > .frame
						{background-color:rgba(148, 179, 113, 1.0);}
					.spot-rates .spot-link a:hover,
					.spot-rates .spot-link a.active,
					.spot-rates .spot-link a:hover > .frame,
					.spot-rates .spot-link a.active > .frame
						{background-color:rgba(179, 144, 113, 1.0);}
					.spot-contact .spot-link a:hover,
					.spot-contact .spot-link a.active,
					.spot-contact .spot-link a:hover > .frame,
					.spot-contact .spot-link a.active > .frame
						{background-color:rgba(113, 170, 179, 1.0);}
	
	nav {
		display:block;
		position:absolute;
		bottom:0px;
		width:100%;
	}
	
	nav.fixed {
		position:fixed;
		top:-1px;
		bottom:auto;
		z-index:50;
	}
		
			nav > .box {
				position:relative;
				width:502px;
				margin:0px auto;
			}
		
		nav #main-menu {
			display:block;
			position:relative;
			margin:0px;
			padding:5px 0px 5px 5px;
			border:1px solid rgba(0, 0, 0, .5);
			background:rgba(255, 255, 255, 0.875);
			list-style:none;
		}
				
				#main-menu::after {
					content:"";
					display:block;
					clear:both;
				}
		
			#main-menu li {
				position:relative;
				float:left;
				width:20%;
				font-family:Arial, Helvetica, sans-serif;
				font-size:12px;
			}
			
				#main-menu li a {
					display:block;
					position:relative;
					height:15px;
					margin:0px 5px 0px 0px;
					padding:5px;
					text-align:center;
					background-color:rgba(255, 255, 255, 1.0);
					border:1px solid rgba(0, 0, 0, .25);
					overflow:hidden;
					opacity:.75;
					transition:opacity .25s ease;
						-webkit-transition:opacity .25s ease;
							-webkit-backface-visibility: hidden;
						-moz-transition:opacity .25s ease;
				}
					
						#main-menu li a:hover {
							color:rgba(255, 255, 255, 1.0) !important;
							border-color:transparent;
							opacity:1.0;
						}
						
						a.menu-instruments:hover {background:rgba(114, 149, 179, 1.0) !important;}
						a.menu-studio:hover {background:rgba(179, 113, 148, 1.0) !important;}
						a.menu-about:hover {background:rgba(148, 179, 113, 1.0) !important;}
						a.menu-rates:hover {background:rgba(179, 144, 113, 1.0) !important;}
						a.menu-contact:hover {background:rgba(113, 170, 179, 1.0) !important;}
					
				#main-menu li a.active, #main-menu li a.active:hover {
					color:rgba(255, 255, 255, 1.0);
					background-color:rgba(64, 64, 64, 1.0) !important;
					opacity:1.0;
				}
		
		nav #search {
			display:block;
			position:absolute;
			top:0px;
			left:100%;
			width:200px;
			margin:1px 0px;
			padding:5px 0px;
			list-style:none;
		}
				
			#search input[type=text] {
				display:block;
				float:left;
				height:15px;
				width:125px;
				margin:4px 5px 4px 5px;
				color:rgba(0, 0, 0, 0.5);
				border:1px solid rgba(0, 0, 0, .25);
				background:rgba(255, 255, 255, .5);
					-webkit-appearance:none;
			}
					
				#search input[type=text]:focus {
					color:rgba(0, 0, 0, 1.0);
					background:rgba(255, 255, 255, .875);
				}
					
				#search input[type=submit] {
					display:block;
					float:left;
					height:27px;
					width:27px;
					margin:0px;
					padding:5px;
					border:1px solid rgba(102, 144, 0, .5);
					border-radius:3px;
						-webkit-border-radius:3px;
						-moz-border-radius:3px;
					background:url(../image/graphic/menu-search.png);
					background-position:0px;
					cursor:pointer;
				}
					
					#search input[type=text]:focus + input[type=submit] {background-position:-25px;}
					#search input[type=submit]:hover {background-position:-50px !important;}

		nav #media-menu {
			display:block;
			position:absolute;
			top:0px;
			left:-6px;
			margin:0px 0px 0px -71px;
			padding:5px 0px 5px 5px;
			border:1px solid rgba(0, 0, 0, .125);
			background:rgba(255, 255, 255, 0.75);
			list-style:none;
		}

			#media-menu li {
				position:relative;
				float:left;
			}

				#media-menu li > a {
					display:block;
					position:relative;
					height:25px;
					width:25px;
					margin:0px 5px 0px 0px;
					background-color:rgba(255, 255, 255, 1.0);
					border:1px solid rgba(0, 0, 0, .25);
					overflow:hidden;
				}
					
					#media-menu li > a:hover {border-color:rgba(0, 102, 144, 0.5);}
					#media-menu li > a.active {border:1px solid rgba(0, 102, 144, .75);}
					
					#media-menu li > a img {
						display:block;
						position:absolute;
						top:0px;
						left:0px;
						width:25px;
						height:25px;
						opacity:0.5;
					}
					
						#media-menu li > a:hover img {opacity:0.75;}
						#media-menu li > a.active img {opacity:1.0;}
			
			#media-menu .player {
				display:none;
				position:absolute;
				top:39px;
				left:-6px;
			}

		nav #share-menu {
			display:block;
			position:absolute;
			left:50%;
			top:200px;
			margin:0px 0px 0px -512px;
			padding:5px 0px 0px 5px;
			list-style:none;
			z-index:25;
		}
	
			#share-menu li {
				display:block;
				position:relative;
			}
	
				#share-menu li > a {
					display:block;
					position:relative;
					height:25px;
					width:25px;
					margin:0px 5px 5px 0px;
					background-color:rgba(255, 255, 255, 1.0);
					border-width:1px;
					border-style:solid;
					border-color:rgba(0, 0, 0, .25);
					border-radius:13px;
						-webkit-border-radius:13px;
						-moz-border-radius:13px;
					opacity:.75;
					transition:opacity .25s ease;
						-webkit-transition:opacity .25s ease;
							-webkit-backface-visibility: hidden;
						-moz-transition:opacity .25s ease;
				}
					
					#share-menu li > a:hover {opacity:1.0;}
					
					#share-menu li:nth-of-type(1) > a:hover {border-color:rgba(60, 90, 192, 1.0) !important;}
					#share-menu li:nth-of-type(2) > a:hover {border-color:rgba(51, 204, 255, 1.0) !important;}
					#share-menu li:nth-of-type(3) > a:hover {border-color:rgba(191, 47, 41, 1.0) !important;}
					#share-menu li:nth-of-type(4) > a:hover {border-color:rgba(250, 110, 15, 1.0) !important;}
					#share-menu li:nth-of-type(5) > a:hover {border-color:rgba(0, 104, 168, 1.0) !important;}
				
					#share-menu li > a img {position:absolute;}
					
					#share-menu li > a img:first-of-type {opacity:.25;}
					#share-menu li > a img:last-of-type {display:none;}
					
							#share-menu li > a:hover img:first-of-type {display:none;}
							#share-menu li > a:hover img:last-of-type {display:block;}
					
					/*#share-menu .share-box {
						display:none;
						position:absolute;
						top:-1px;
						left:26px;
						width:100px;
						height:100%;
						margin-left:5px;
						border:1px solid rgba(0, 0, 0, 0.25);
						border-radius:12px;
							-webkit-border-radius:12px;
							-moz-border-radius:12px;
						background-color:rgba(255, 255, 255, 1.0);
					}
					
						#share-menu li:nth-of-type(1) .share-box {border-color:rgba(60, 90, 192, 1.0) !important;}
						#share-menu li:nth-of-type(2) .share-box {border-color:rgba(51, 204, 255, 1.0) !important;}
					
							#share-menu li > a:hover .share-box {display:block;}
							
							#share-menu .share-box::before {
								content:"";
								display:block;
								position:absolute;
								top:0px;
								left:-6px;
								right:-1px;
								height:100%;
							}*/

	.place {
		display:block;
		position:absolute;
		bottom:0px;
		width:100%;
	}

#content {
	display:block;
	position:relative;
	padding-bottom:10px;
	z-index:-5;
	/*background:rgba(255, 205, 255, 0.25);*/
}

		#content > .box {
			display:block;
			position:relative;
			width:950px;
			margin:0px auto;
		}
		
				#content > .box::after {
					content:"";
					display:block;
					clear:both;
				}

#credit {
	display:block;
	height:22px;
	margin-top:-22px;
	/*background:rgba(235, 205, 255, 0.25);*/
}
	
		#credit > .box {
			box-sizing:border-box;
				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				-o-box-sizing:border-box;
			width:500px;
			height:100%;
			margin:0px auto;
			padding:5px 0px;
			color:rgba(0, 0, 0, .5);
			font-family:Arial, Helvetica, sans-serif;
			font-size:10px;
			text-align:center;
			border-top:1px solid rgba(0, 0, 0, .25);
			border-left:1px solid rgba(0, 0, 0, .25);
			border-right:1px solid rgba(0, 0, 0, .25);
	}
	
		#credit div span {
			color:rgba(0, 0, 0, .75);
		}
		
.ribbon {
	position:absolute;
	top:-5px;
	right:-5px;
	width:150px;
	height:150px;
	overflow:hidden;
	z-index:5;
}
		
		.ribbon::before, .ribbon::after {
			content:"";
			display:block;
			box-sizing:border-box;
				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				-o-box-sizing:border-box;
			position:absolute;
			background:rgba(0, 0, 0, 0.125);
			z-index:10;
		}
		
			.ribbon.color-blue::before, .ribbon.color-blue:after {background:rgba(0, 102, 144, 0.125) !important;}
			.ribbon.color-green::before, .ribbon.color-green:after {background:rgba(102, 144, 0, 0.125) !important;}
			.ribbon.color-red::before, .ribbon.color-red:after {background:rgba(144, 51, 51, 0.125) !important;}
		
		.ribbon::before {
			top:0px;
			left:0px;
			width:58px;
			height:5px;
			border-top:1px solid rgba(0, 0, 0, 0.375);
			border-left:1px solid rgba(0, 0, 0, 0.375);
		}
		
		.ribbon::after {
			bottom:0px;
			right:0px;
			width:5px;
			height:58px;
			border-right:1px solid rgba(0, 0, 0, 0.375);
			border-bottom:1px solid rgba(0, 0, 0, 0.375);
		}

	.ribbon > .box {
		display:block;
		box-sizing:border-box;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			-o-box-sizing:border-box;
		position:absolute;
		bottom:50%;
		left:50%;
		width:300px;
		height:40px;
		margin:0px 0px -5px -135px;
		text-align:center;
		line-height:38px;
		color:rgba(0, 0, 0, 0.75);
		text-shadow:
			rgba(255, 255, 255, 0.5) 0px 1px 0px,
			rgba(0, 0, 0, 0.125) 0px 0px 3px;
		font-family:Arial, Helvetica, sans-serif;
		font-size:18px;
		border-top:1px solid rgba(0, 0, 0, 0.5);
		border-bottom:1px solid rgba(0, 0, 0, 0.5);
		background:rgba(255, 255, 255, 0.75);
		box-shadow:0px 0px 10px rgba(0, 0, 0, 0.125);
			-webkit-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.125);
			-moz-box-shadow:0px 0px 10px rgba(0, 0, 0, 0.125);
		transform-origin:center center;
			-webkit-transform-origin:center center;
			-moz-transform-origin:center center;
			-ms-transform-origin:center center;
			-o-transform-origin:center center;
		transform:rotate(45deg);
			-webkit-transform:rotate(45deg);
			-moz-transform:rotate(45deg);
			-ms-transform:rotate(45deg);
			-o-transform:rotate(45deg);
	}
		
		.ribbon.color-blue > .box {
			color:rgba(0, 102, 144, 0.75);
			text-shadow:
				rgba(255, 255, 255, 0.5) 0px 1px 0px,
				rgba(0, 102, 144, 0.125) 0px 0px 3px;
			background:rgba(245, 249, 251, 0.75);
			box-shadow:0px 0px 10px rgba(0, 102, 144, 0.125);
				-webkit-box-shadow:0px 0px 10px rgba(0, 102, 144, 0.125);
				-moz-box-shadow:0px 0px 10px rgba(0, 102, 144, 0.125);
		}
		
		.ribbon.color-green > .box {
			color:rgba(102, 144, 0, 0.75);
			text-shadow:
				rgba(255, 255, 255, 0.5) 0px 1px 0px,
				rgba(102, 144, 0, 0.125) 0px 0px 3px;
			background:rgba(249, 251, 245, 0.75);
			box-shadow:0px 0px 10px rgba(102, 144, 0, 0.125);
				-webkit-box-shadow:0px 0px 10px rgba(102, 144, 0, 0.125);
				-moz-box-shadow:0px 0px 10px rgba(102, 144, 0, 0.125);
		}
		
		.ribbon.color-red > .box {
			color:rgba(144, 51, 51, 0.75);
			text-shadow:
				rgba(255, 255, 255, 0.5) 0px 1px 0px,
				rgba(144, 51, 51, 0.125) 0px 0px 3px;
			background:rgba(251, 247, 247, 0.75);
			box-shadow:0px 0px 10px rgba(144, 51, 51, 0.125);
				-webkit-box-shadow:0px 0px 10px rgba(144, 51, 51, 0.125);
				-moz-box-shadow:0px 0px 10px rgba(144, 51, 51, 0.125);
		}
		
.extra {
	position:relative;
	cursor:pointer;
}
	
.extra.active.static {cursor:default;}
	
	.extra-button {
			display:block;
			box-sizing:border-box;
				-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				-o-box-sizing:border-box;
			position:absolute;
			top:50%;
			right:0px;
			width:20px;
			height:20px;
			margin-top:-10px;
			text-align:center;
			line-height:18px;
			color:rgba(102, 144, 0, 1.0) !important;
			font-family:Arial, Helvetica, sans-serif;
			font-size:14px;
			font-weight:bold;
			border:1px solid rgba(102, 144, 0, 0.5) !important;
			border-radius:3px;
				-webkit-border-radius:3px;
				-moz-border-radius:3px;
			background:rgba(255, 255, 255, 0.5);
		}
		
		.extra.active.static .extra-button {display:none;}
			
				.extra-button::before {
					content:"+";
					display:inline;
				}
				
					.extra.active > .extra-button::before {content:"−";}
		
			.extra:hover .extra-button {
				color:rgba(255, 255, 255, 1.0) !important;
				background:rgba(102, 144, 0, 0.5);
			}
		
			.extra-button:hover {
				color:rgba(255, 255, 255, 1.0) !important;
				background:rgba(102, 144, 0, 1.0) !important;
			}