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

}

@font-face {
    font-family: "OpenSansCondensedLight";
    src: url("OpenSans-CondLight-webfont.eot");
    src: url("OpenSans-CondLight-webfont.eot?#iefix") format("embedded-opentype"),
         url("OpenSans-CondLight-webfont.woff") format("woff"),
         url("OpenSans-CondLight-webfont.ttf") format("truetype"),
         url("OpenSans-CondLight-webfont.svg#OpenSansCondensedLight") format("svg");
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: "OpenSansCondensedLightItalic";
    src: url("OpenSans-CondLightItalic-webfont.eot");
    src: url("OpenSans-CondLightItalic-webfont.eot?#iefix") format("embedded-opentype"),
         url("OpenSans-CondLightItalic-webfont.woff") format("woff"),
         url("OpenSans-CondLightItalic-webfont.ttf") format("truetype"),
         url("OpenSans-CondLightItalic-webfont.svg#OpenSansCondensedLightItalic") format("svg");
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: "OpenSansCondensedBold";
    src: url("OpenSans-CondBold-webfont.eot");
    src: url("OpenSans-CondBold-webfont.eot?#iefix") format("embedded-opentype"),
         url("OpenSans-CondBold-webfont.woff") format("woff"),
         url("OpenSans-CondBold-webfont.ttf") format("truetype"),
         url("OpenSans-CondBold-webfont.svg#OpenSansCondensedBold") format("svg");
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: "SawarabiGothicMedium";
    src: url("sawarabi-gothic-medium-webfont.eot");
    src: url("sawarabi-gothic-medium-webfont.eot?#iefix") format("embedded-opentype"),
         url("sawarabi-gothic-medium-webfont.woff") format("woff"),
         url("sawarabi-gothic-medium-webfont.ttf") format("truetype"),
         url("sawarabi-gothic-medium-webfont.svg#SawarabiGothicMedium") format("svg");
    font-weight: normal;
    font-style: normal;

}

a {	color:#DC1010; text-decoration:none;}
a:hover, a:focus { text-decoration:underline;}
a:active, a:visited { }

table, td, th{
	border:none;
	width: auto;
	vertical-align:top;
	padding: 5px;
	white-space:nowrap;
	
}

/* ** ** Header Styles ** ** */
h1, h2, h3, h4, h5 {margin:0 0 0 0; line-height:1.1em; font-family:"PacificoRegular", Arial, Helvetica, sans-serif;}
h1 {	font-size:2.52em; font-weight:normal;} 
h2 {	font-size:1.952em;font-weight:normal;} 
h3 {	font-size:1.652em;font-weight:normal;} 
h4 {	font-size:1.452em;font-weight:normal;} 
h5 {	font-size:1.252em;font-weight:normal;} 
h6 {	font-size:1.152em;font-weight:normal;}

/* ** ** ul li's ** ** */
ul{
  list-style:outside disc;
}
ul,ol{
  margin: 0;
  padding: 0;
}
li ul,li ol{
  padding: 0;
  margin: 0;
}

/* ** ** paragraph styling ** ** */
p {
	margin:0 0 1.52em;
	font-family:"OpenSansCondensedLight", Arial, Helvetica, sans-serif;
	font-size:1em;
	line-height:1.5em;
}
p img.left {float:left;margin:1.52em 1.52em 1.52em 0;padding:0;}
p img.right {float:right;margin:1.52em 0 1.52em 1.52em;}

strong   		{	font-weight:600;}
dfn  		{	font-style:italic; font-weight:600;}
sup, sub 		{   line-height:0;}
abbr, acronym   {	border-bottom:1px dashed #ccc;}
address 		{	margin:0 0 1.5em;font-style:italic;}
del 			{	color:#666;}
pre, code, tt   {	font:1em "andale mono", "lucida console", monospace;line-height:1.5; display:block;}
code 			{	background-color:#eee; display:inline; padding:0px 2px 1px 2px; line-height:1.1em;}
pre 			{	margin:1.5em 0;white-space:pre;}
b				{	font-family:"OpenSansCondensedBold", Arial, Helvetica, sans-serif;}
em				{	font-family:"OpenSansCondensedLightItalic", Arial, Helvetica, sans-serif;}


/* ** ** general ** ** */

body {
	background: url(../images/background.jpg) top center repeat-x;
	background-color: #FFF;
	font-family:"OpenSansCondensedLight", Arial, Helvetica, sans-serif;
}

/* ** ** front page ** ** */

#front_page_wrapper {
	background: url(../images/frontpage_back.jpg) top center no-repeat;
	width:1044px;
	height:692px;
	margin:0 auto;
}

/* This is the animation for lensflare. */
@keyframes lensflare {
   0% { opacity: 0;}
   25% {opacity: 1;} 
   75% {opacity: 1;}
   100% { opacity: 0;}
}

@-moz-keyframes lensflare {
   0% { opacity: 0;}
   25% {opacity: 1;} 
   75% {opacity: 1;}
   100% { opacity: 0;}
}

@-webkit-keyframes lensflare {
   0% { opacity: 0;}
   25% {opacity: 1;} 
   75% {opacity: 1;}
   100% { opacity: 0;}
}

@-o-keyframes lensflare {
   0% { opacity: 0;}
   25% {opacity: 1;} 
   75% {opacity: 1;}
   100% { opacity: 0;}
}

#front_page_wrapper .lensflare {
	top:20px;
	float:right;
	right:38px;
	position:relative;
	background:url(../images/lensflare.jpg) no-repeat;
	width:709px;
	height:651px;
	
	animation-name: lensflare;
	animation-timing-function: ease-in;
	animation-iteration-count: infinite;
	animation-duration: 15s;
	animation-direction: normal;
/* Firefox: */	
	-moz-animation-name: lensflare;
	-moz-animation-timing-function: ease-in;
	-moz-animation-iteration-count: infinite;
	-moz-animation-duration: 15s;
	-moz-animation-direction: normal;
/* Safari and Chrome: */
	-webkit-animation-name: lensflare;
	-webkit-animation-timing-function: ease-in;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-duration: 15s;
	-webkit-animation-direction: normal;
/* Opera */
	-o-animation-name: lensflare;
	-o-animation-timing-function: ease-in;
	-o-animation-iteration-count: infinite;
	-o-animation-duration: 15s;
	-o-animation-direction: normal;

}


/* ** ** menu ** ** */

#menu ul {
	display:block;
	text-decoration:none;
	list-style: none;
	position:relative;
	width:250px;
}

#menu a {
  display: block;
  text-indent: -900% !important;
  position: absolute;
  outline: none;
}

#menu a:hover {
  background-position: left bottom;
}

#menu .biography {
	width: 239px;
	height: 54px;
	background: url(../images/menu_biography.png) no-repeat;
	top:50px;
	left:50px;
}

#menu .schedule {
	width: 239px;
	height: 54px;
	background: url(../images/menu_schedule.png) no-repeat;
	top:114px;
	left:50px;
}

#menu .listening {
	width: 239px;
	height: 54px;
	background: url(../images/menu_listening.png) no-repeat;
	top:178px;
	left:50px;
}

#menu .teaching {
	width: 239px;
	height: 54px;
	background: url(../images/menu_teaching.png) no-repeat;
	top:242px;
	left:50px;
}

#menu .presskit {
	width: 239px;
	height: 54px;
	background: url(../images/menu_presskit.png) no-repeat;
	top:306px;
	left:50px;
}

#menu .contact {
	width: 239px;
	height: 54px;
	background: url(../images/menu_contact.png) no-repeat;
	top:370px;
	left:50px;
}

#menu .home {
	width:383px;
	height:70px;
	background: url(../images/clear.png) repeat;
	top:20px;
	left:610px;
}

/* ** ** Biography ** ** */

#menu .japanese {
	width:81px;
	height:16px;
	background: url(../images/Japanese.png) repeat;
	top:610px;
	left:620px;
}

#menu .english {
	width:83px;
	height:20px;
	background: url(../images/English.png) repeat;
	top:610px;
	left:750px;
}

/* ** ** footer ** ** */
#footer {
	padding:0;
	margin:0;
	text-align:center;
	font-size:0.8em;
	width:100%;
}

/* ** ** Pages ** ** */

#page_wrapper {
	background: url(../images/page_background.jpg) top center no-repeat;
	width:1044px;
	height:692px;
	margin:0 auto;
}

.page_wrapper {
	margin: 150px 0 0 307px;
	width:267px;
	float:left;
	display:block;
}
	

/* ** ** Text scroll ** ** */

#page_scroll {
	color:#FFF;
	float:right;
	margin-top: 130px;
	margin-right: 100px;
}

#page_scroll .viewport {
	width: 330px;
	height: 450px;
	overflow: hidden;
	position: relative;
}

#page_scroll .viewport a
{
	color: #FFF !important;
	text-decoration:underline;
}

#page_scroll .overview {
	list-style: none;
	position: absolute;
	width: 90%;
}

#page_scroll .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0;
	position: relative;
	background-position: 0 0;
	float: right;
	width: 15px;
}

#page_scroll .track {
	background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%;
	height: 100%;
	width:15px;
	position: relative;
}

#page_scroll .thumb {
	background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%;
	height: 20px;
	width: 25px;
	cursor: pointer;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: -5px;
}
#page_scroll .thumb .end {
	background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0;
	overflow: hidden;
	height: 20px;
	width: 25px;
}
#page_scroll .disable{
	display: none;
}

#page_scroll_j {
	font-family:"SawarabiGothicMedium";
	color:#FFF;
	float:right;
	margin-top: 130px;
	margin-right: 100px;
}

#page_scroll_j p {
	
	font-family:"SawarabiGothicMedium";
}

#page_scroll_j .viewport {
	width: 330px;
	height: 450px;
	overflow: hidden;
	position: relative;
}

#page_scroll_j .viewport a
{
	color: #FFF !important;
	text-decoration:underline;
}

#page_scroll_j .overview {
	list-style: none;
	position: absolute;
	width: 90%;
}

#page_scroll_j .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0;
	position: relative;
	background-position: 0 0;
	float: right;
	width: 15px;
}

#page_scroll_j .track {
	background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%;
	height: 100%;
	width:15px;
	position: relative;
}

#page_scroll_j .thumb {
	background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%;
	height: 20px;
	width: 25px;
	cursor: pointer;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: -5px;
}
#page_scroll_j .thumb .end {
	background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0;
	overflow: hidden;
	height: 20px;
	width: 25px;
}
#page_scroll_j .disable{
	display: none;
}


/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

body {
	background: url(../images/background_768.jpg) top center repeat-x;
}

#front_page_wrapper {
	background: url(../images/frontpage_back_768.jpg) top center no-repeat;
	width:768px;
	height:512px;
	margin:0 auto;
}

#front_page_wrapper .lensflare {
	top:15px;
	right:28px;
	background:url(../images/lensflare_768.jpg) no-repeat;
	width:517px;
	height:480px;
}

#menu .biography {
	top:20px;
	left:10px;
}

#menu .schedule {
	top:84px;
	left:10px;
}

#menu .listening {
	top:148px;
	left:10px;
}

#menu .teaching {
	top:212px;
	left:10px;
}

#menu .presskit {
	top:276px;
	left:10px;
}

#menu .contact {
	top:340px;
	left:10px;
}

#menu .home {
	width:270px;
	height:50px;
	top:20px;
	left:450px;
}

#menu .japanese {
	top:460px;
	left:490px;
}

#menu .english {
	top:460px;
	left:600px;
}

#page_wrapper {
	background: url(../images/page_background_768.jpg) top center no-repeat;
	width:768px;
	height:512px;
	margin:0 auto;
}

.page_wrapper {
	margin: 100px 0 0 223px;
	width:200px;
}

#page_scroll {
	color:#FFF;
	float:right;
	margin-top: 90px;
	margin-right: 50px;
}

#page_scroll .viewport {
	width: 260px;
	height: 350px;
}

#page_scroll .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y_768.png) no-repeat 0 0;
}

#page_scroll_j {
	color:#FFF;
	float:right;
	margin-top: 90px;
	margin-right: 50px;
}

#page_scroll_j .viewport {
	width: 260px;
	height: 350px;
}

#page_scroll_j .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y_768.png) no-repeat 0 0;
}
}

/* #Tablet (Landscape)
================================================== */

    /* Note: Design for a width of 1024px */

@media only screen and (min-width: 960px) and (max-width: 1024px) {
	
body {
	background: url(../images/background_960.jpg) top center repeat-x;
}

#front_page_wrapper {
	background: url(../images/frontpage_back_960.jpg) top center no-repeat;
	width:960px;
	height:621px;
	margin:0 auto;
}

#front_page_wrapper .lensflare {
	top:18px;
	right:46px;
	background:url(../images/lensflare_960.jpg) no-repeat;
	width:641px;
	height:584px;
}

#menu .biography {
	left:65px;
}

#menu .schedule {
	left:65px;
}

#menu .listening {
	left:65px;
}

#menu .teaching {
	left:65px;
}

#menu .presskit {
	left:65px;
}

#menu .contact {
	left:65px;
}

#menu .home {
	width:330px;
	height:60px;
	top:20px;
	left:540px;
}

#menu .japanese {
	top:565px;
	left:610px;
}

#menu .english {
	top:565px;
	left:740px;
}

#page_wrapper {
	background: url(../images/page_background_960.jpg) top center no-repeat;
	width:960px;
	height:621px;
}

.page_wrapper {
	margin: 130px 0 0 285px;
	width:240px;
}

#page_scroll {
	margin-top: 130px;
	margin-right: 90px;
}

#page_scroll .viewport {
	width: 300px;
	height: 400px;
}

#page_scroll .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y_960.png) no-repeat 0 0;
}

#page_scroll_j {
	margin-top: 130px;
	margin-right: 90px;
}

#page_scroll_j .viewport {
	width: 300px;
	height: 400px;
}

#page_scroll_j .scrollbar{
	background: transparent url(../images/bg-scrollbar-track-y_960.png) no-repeat 0 0;
}
}