/* Disable the auto text scaling here, because it looks terrible when
 * there is some text not floated (and scaled) and some floated (and
 * not scaled). For the same reason, we suppress Chome's Font Boosting.
 * We'll adjust the font sizes for small screens. */

body {
  margin:0px; padding:0;
  background-color:#929292;
  text-size-adjust: 100%; 
  -ms-text-size-adjust: 100%; 
  -moz-text-size-adjust: 100%; 
  -webkit-text-size-adjust: 100%;
}

a {
  text-decoration:none;
  outline-style:none;
  display:inline-block;
}
ul {
  margin:0px 0px 0px 0px; padding-left:48px;
}
li {
  margin:0px 0px 0px 0px; list-style-type: disc;
}
img {
  margin-left:auto; margin-right:auto
}
td ,th {
  padding:5px;
}
* {
  filter:inherit;
}

/* Here's the old non-scrolling background image, but it's big and doesn't quite work
 * as expected on some browsers, so maybe we'll just go for simple and fast instead? */

#fixed_background {
   position:relative;
   background-color:#949494;
   background-image:url('../images/page_background.jpg');
   background-repeat:no-repeat;
   background-attachment:fixed;
   background-position:center top;
}

#scrolling_page {
   position:relative;
   margin-left:auto; margin-right:auto;
   width:1000px;
   background-color:transparent;
}
#black_banner {
   position:relative;
   width:1000px; height:150px;
   left:0px; top:0px; margin-top:2px; margin-bottom:2px;
   border:0px;
   background-color:#000000;
}
#banner_title {
   position:absolute; 
   width:480px; height:110px;
   left:95px; top:10px;
}
#aikido_left  { position:absolute; left:25px;  top:10px; }
#aikido_right { position:absolute; left:920px; top:10px; }
#rose_sword   { position:absolute; left:580px; top:20px; }

#buttons_set1 { position:absolute; left:102px; top:112px; }
#buttons_set2 { position:absolute; left:505px; top:112px; }

#footer       { position:relative; width:100%; bottom:0px; margin-top:50px;}

#intro_part1  {
   position:relative; float:left;
   width:275px;
   margin-left:0px; margin-right:12px; margin-top:10px;
}
#intro_part2  {
   position:relative; float:right;
   width:275px;
   margin-left:12px; margin-right:0px; margin-top:10px;
}
#intro_graphic1 {
   position:absolute; left:335px;
   width:302px; height:302px; top:60px;
}
#intro_graphic2 {
   visibility:hidden;
   position:absolute; left:335px;
   width:302px; height:227px; top:60px;
}
#welcome_part1  {
   position:relative; float:left;
   width:436px;
   margin-left:0px; margin-right:10px;
}
#welcome_part2  {
   position:relative; float:right;
   width:436px;
   margin-left:10px; margin-right:0px;
}
#intro_imagebar {
   position:relative; clear:both;
   width:900px;
   margin-left:auto; margin-right:auto;
}
#mapbox {
   width:100%; height:600px;
}
#map {
   position:relative;
   top:20px; width:900px; height:500px;
   margin-left:auto; margin-right:auto;
   border:1px solid #979797; 
   background-color:#e5e3df;
}
#contacts {   
   position:relative;
}
@media handheld, screen and (max-device-width: 800px) {
   #contacts { height:210px; }
}

/* Menu buttons */

.MenuButton, .MenuButton:link, .MenuButton:visited {
    position:absolute; top:5px; height:26px;
    text-decoration:none;
    background-position:0px 0px;
}
.MenuButton:focus  { outline-style:none; }
.MenuButton:hover  { background-position:0px -52px; }
.MenuButton:active { background-position:0px -26px; }

.MenuButton span, .MenuButton:link span, .MenuButton:visited span{
    position:absolute; left:0px; top:4px; width:100%;
    font-family:Arial,sans-serif; font-weight:700; font-style:normal;
    text-decoration:none; text-align:center;
    color:#333333;
    cursor:pointer;
}
.MenuButton:hover span{ color:#ffffff; }

/* Sub-menus */

.SubMenu {
   position:absolute; overflow:auto;
   background-color:rgb(227,227,227);
   border:1px solid; border-color:rgb(64,64,64); border-radius:5px;
   box-shadow:3px 3px 3px rgb(64,64,64);
   margin-top:5px; margin-bottom:5px;
}
.SubMenuItem,.SubMenuItem:link,.SubMenuItem:visited {
    position:absolute; left:10px; height:22px;
    background-image:url('../images/controls/menu_item.png');
    text-decoration:none;
    background-position:0px 0px;
}
.SubMenuItem:focus { outline-style:none; }
.SubMenuItem:hover { background-position:0px -22px; }
.SubMenuItem span,.SubMenuItem:link span,.SubMenuItem:visited span {
    position:absolute; left:10px;top:2px;height:22px;
    font-family:Arial,sans-serif; font-weight:500; font-style:normal; font-size:15px;
    text-decoration:none; text-align:center; text-transform:none;
    color:#606060;
    cursor:pointer;
}
.SubMenuItem:hover span { color:#ffffff; }

/* Suppress annoying Font Boosting in Chrome */

.PageBox, .PageTitleBox, .FallbackBox,
.ItemBox, .ItemBoxLeft, .ItemBoxRight, .ItemBoxSmall
.CentredBox, .FloatBoxLeft, .FloatBoxRight, .FloatBoxInner {
   max-height:1000000px;           /* suppress font boosting */
}

/* rgba color, border-radius and box-shadow are only understood by modern browsers */

.PageBox {
   position:relative;
   background-image: url('../images/grey-alpha-50.png');
   /* background-color:rgba(255,255,240,0.5); */
   border:1px solid; border-color:rgb(100,100,100);
   left:0px; top:0px; width:998px;
}

.FallbackBox {
   position:relative; overflow:hidden;
   background-color:rgb(227,227,227);
   left:0px; top:0px; width:100%; height:100px;
   /* padding-left:15px; padding-right:15px; padding-top:10px; padding-bottom:10px; */
}

.ItemBox,.ItemBoxLeft,.ItemBoxRight,.ItemBoxSmall {
   position:relative; overflow:hidden;
   background-image: url('../images/cream-alpha-50.png');
   /* background-color:rgba(255,255,200,0.4); */
   border:2px solid; border-color:rgb(64,64,64); border-radius:20px;
   box-shadow:5px 5px 5px rgb(64,64,64);
   margin-top:5px; margin-bottom:15px;
   padding-left:30px; padding-right:30px; padding-top:20px; padding-bottom:20px;
}
.ItemBox      { width:915px; margin-left:10px; margin-right:10px; left:0px;   }
.ItemBoxSmall { width:700px; margin-left:auto; margin-right:auto; float:none; }
.ItemBoxLeft  { width:400px; height:100%; margin-left:25px; margin-right:10px; float:left; }
.ItemBoxRight { width:400px; height:100%; margin-left:10px; margin-right:25px; float:right; }

.NewsBox {
   position:relative; overflow:hidden;
   background-image: url('../images/cream-alpha-50.png');
   width:100%; padding:0px;
   margin-left:auto; margin-right:auto; margin-top:0px; margin-bottom:0px;
}
.NewsBar {
   width:95%;
   margin-left:auto; margin-right:auto; margin-top:1px; margin-bottom:1px;
   text-align:center;
}

.PageTitleBox {
   border:2px solid; border-color:rgb(128,128,64); border-radius:2px;
   box-shadow:2px 2px 2px rgb(64,64,64);
   margin-left:10px; margin-right:10px; margin-top:5px; margin-bottom:15px;
}

.PageTitle {
   margin-left:10px; margin-right:10px; margin-top:0px; margin-bottom:0px; text-align:center;
}

.CentredBox {
  position:relative; overflow:hidden;
  margin-left:auto; margin-right:auto; margin-top:0px; margin-bottom:10px; 
}
.FloatBoxLeft {
  position:relative; float:left; overflow:hidden;
  margin-left:0px; margin-right:20px; margin-top:10px; margin-bottom:10px;
}
.FloatBoxRight {
  position:relative; float:right; overflow:hidden;
  margin-left:10px; margin-right:0px; margin-top:10px; margin-bottom:10px;
}
.FloatBoxInner {
  position:relative; float:left; overflow:hidden;
  margin-left:10px; margin-right:20px; margin-top:10px; margin-bottom:10px;
  max-width:255px;
}

.SenseiTable {
   position:relative;
   min-width:70%; max-width:90%;
   margin-left:auto; margin-right:auto;
}
.SenseiSection {
   position:relative; overflow:hidden;
   min-height:0px;
   margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:0px;
}
.SenseiImageSection {
   position:relative; 
   width:550px;
   margin-left:auto; margin-right:auto; margin-top:10px; margin-bottom:10px;
}
.SenseiImageBox0 {
   position:relative; float:left;
   width:200px;
   margin-left:10px; margin-right:30px; margin-top:10px; margin-bottom:15px;
}
.SenseiImage0 {
   border:0px; width:200px;
}
.SenseiImageBox1 {
   position:relative; float:right;
   width:200px;
   margin-left:20px; margin-right:10px; margin-top:10px; margin-bottom:5px;
}
.SenseiImage1 {
   border:0px; width:200px;
}
.SenseiImage {
   position:relative; float:left;
   margin-left:30px; margin-right:30px; margin-top:10px; margin-bottom:15px;
}

.SenseiImage2 {
   position:relative; float:right;
   margin-left:30px; margin-right:10px; margin-top:10px; margin-bottom:15px;
}
.SenseiText {
   position:relative; clear:both;
}
.SenseiText1 {
   position:relative; float:left; width:660px;
}
.SenseiText2 {
   position:relative; float:left; width:430px;
}
.SenseiText3 {
   position:relative; float:left; width:660px;
}
.SenseiText4 {
   position:relative; float:left; width:670px;
}

.VariableImage256  { width:256px; }
.VariableImage300  { width:256px; }
.VariableImage400  { width:300px; }
.GalleryIndexImage { width:200px; }

.Certificate {
   position:relative; float:left;
   width:auto; max-width:222px;
   margin-left:15px; margin-right:15px;
   margin-top:5px; margin-bottom:15px;
   overflow:hidden;
}
.CertificateImageBox {
   width:auto; overflow:hidden;
}
.CertificateImage {
   float:none;
   margin-left:0px; margin-right:0px;
   border-style:solid; border-color:#000000; border-width:1px;
}
.CertificateCaption {
   position:relative; float:none;
   text-align:center;
}

.ClassTitle {
   position:relative;
   text-align:center;
}
.ClassText {  
  position:relative; float:left; clear:none;
  max-width:500px;
  margin-left:0px; margin-right:0px;
}
.ClassImage, .ClassVideo {
  position:relative; float:right; width:384px;
  margin-left:20px; margin-right:5px; margin-top:30px; margin-bottom:20px;
}

.ClassPhotosBox {
  position:relative; width:850px; overflow:hidden;
  margin-left:auto; margin-right:auto; margin-top:10px; margin-bottom:10px; 
}
.ClassPhoto {
  position:relative; float:left;
  margin-left:10px; margin-right:10px; margin-top:10px; margin-bottom:0px; 
}

.PhotoCredit {
   position:relative;
   width:100%; text-align:right;
   color:#888888;
}
.PhotoCredit, .PhotoCredit a { color:#888888; }
.PhotoCreditThumb, .PhotoCreditThumb a { color:#888888; }

.PhotoCreditInSlide, .PhotoCreditInSlideDark, .PhotoCreditInSlideLight {
   position:absolute; top:94%;
   width:98%; text-align:right;
}
.PhotoCreditInSlide,     .PhotoCreditInSlide      a { color:#888888; }
.PhotoCreditInSlideDark, .PhotoCreditInSlideDark  a { color:#555555; }
.PhotoCreditInSlideLigh, .PhotoCreditInSlideLight a { color:#aaaaaa; }

.Address {
  position:relative;
  margin-left:0px;
  margin-right:60px;
}
  
.GalleryTitle {
  position:relative; max-width:700px;
  margin-left:auto; margin-right:auto;  margin-top:0px;margin-bottom:30px;
  text-align:center;
}
.GalleryText {
  position:relative; max-width:700px;
  margin-left:auto; margin-right:auto;  margin-top:0px;margin-bottom:10px;
  text-align:center;
}
/* background is transparent .. with light grey fall-back */
.GalleryBox {
  position:relative;
  width:660px; height:540px;
  background:#e3e3e3;
  background-color:rgba(227,227,227,0);
  overflow:hidden;
  margin-left:auto; margin-right:auto; margin-top:0px;margin-bottom:15px;
  border-style:none;border-color:blue;border-width:0px;
}
.GalleryThumbBox {
  position:relative; float:left; width:200px;
  margin-left:10px; margin-right:10px; margin-top:10px; margin-bottom:10px;
}
.GallerySlide {
  position:relative; overflow:hidden;
  left:0px; top:0px;
  width:660px; height:440px;
  cursor:move;
  border-style:none;border-color:green;border-width:0px;
}
.GalleryImage {
  top:0px; bottom:0px;margin-left:auto;margin-right:auto;
  border-style:none;border-color:red;border-top-width:0px;
}
.GalleryThumb {
  margin-top:0px; margin-bottom:0px;
  border-style:solid;border-width:0px;
}
.GalleryCredit  { position:absolute; top:5px; right:10px; }
.GalleryCredit1 { position:absolute; top:5px; right:75px; }
.GalleryCredit2 { position:absolute; top:5px; right:115px; }
.GalleryCredit3 { position:absolute; top:5px; right:155px; }
 
.GalleryCredit,  .GalleryCredit  a,
.GalleryCredit1, .GalleryCredit1 a,
.GalleryCredit2, .GalleryCredit2 a,
.GalleryCredit3, .GalleryCredit3 a {
  color:#555555;
}

.GalleryCaption, .GalleryShortCaption {
   position:relative; top:420px;
   margin-left:auto; margin-right:auto; 
   background:#808080;
   background-color:rgba(0, 0, 0, 0.5);
   color:#ffffff;
   font-family:"Arial", sans-serif; line-height:20px; text-align:center;
   border-radius:4px;
}
.GalleryCaption { min-width:500px; max-width:600px; }
.GalleryShortCaption { min-width:300px; max-width:440px; }
  
.VideoTitle {
   position:relative;
   width:94%;
   margin-left:auto; margin-right:auto;  margin-top:20px;margin-bottom:10px;
   text-align:center;
}
.VideoBox {
   position:relative;
   width:640px; height:480px;
   margin-left:auto; margin-right:auto; margin-top:10px;margin-bottom:5px;
}
.Video {
   width:100%; height:100%;
}
.VideoNote {
   position:relative;
   width:640px;
   margin-left:auto; margin-right:auto;  margin-top:20px;margin-bottom:10px;
}

.StackFrame {
   position:relative; clear:both; overflow:hidden;
   width:720px; 
   margin-left:auto; margin-right:auto; margin-top:10px; margin-bottom:10px;
}
.StackBox {
   position:relative; float:left;
   width:180px;
   text-align:left;
}

.GridFrame {
   position:relative; clear:both; overflow:hidden;
   max-width:672px; 
   margin-left:auto; margin-right:auto; margin-top:30px; margin-bottom:30px;
   padding:20px; border-style:solid;
}
.GridBox {
   position:relative; float:left;
   min-width:92px; min-height:92px; 
   margin-left:10px; margin-right:10px; margin-top:15px; margin-bottom:15px;
   text-align:center;
}

.SubTitle {
   position:relative;
   width:94%;
   margin-left:auto; margin-right:auto;
   margin-top:0px; margin-bottom:15px;
   text-align:center; 
}
.SubHeading {
   position:relative;
   margin-left:0px; margin-right:15px;
   margin-top:0px; margin-bottom:15px;
   text-align:justify; 
}

.NormalPara {
   margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:15px;
   text-align:justify;
}
.CentredPara {
   margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:15px;
   text-align:center;
}
.SmallCaption {
   margin-left:0px; margin-right:0px; margin-top:0px; margin-bottom:5px;
   text-align:center;
}

.IfMobile { display:none; }
.IfNotMobile { display:inline; }

/* Text styles for large screens */

.BannerText, .SmallBannerText
{
   font-family:"Times New Roman", serif; font-style:italic; font-weight:600;
   color:#908050; text-shadow: 1px 1px #c02020; line-height:1.2; 
}
.SmallBannerText { font-weight: 500; }

.PageTitleText, .PageTitle
{
   font-family:"Times New Roman", serif; font-style:italic; font-weight:600;
   color:#505030; line-height:1.2;
}
.TitleText, .SubTitleText, .SubTitle, .SubHeading {
    font-family:"Arial", sans-serif; font-weight:700; line-height:1.2;
}
.NormalText, .NormalPara, .CentredPara, .SmallText {
    font-family:"Arial", sans-serif; line-height:1.2;
}
.EmailText {
    font-family:"Arial Narrow", sans-serif; line-height:1.2;  
}
.YearText {
    font-family:"Arial", sans-serif; font-weight:700; line-height:1.2;
    margin-right:15px;
}
.QuoteText {
    font-family:"Arial", sans-serif; font-weight:700; font-style:italic; line-height:1.2;
}
.CaptionText, .SmallCaptionText, .SmallCaption, .FootNoteText {
    font-family:"Arial", sans-serif; line-height:1.2; text-align:center;
}
.CreditText, .GalleryCredit, .PhotoCredit, .PhotoCreditInSlide {
    font-family:"Arial", sans-serif; text-align:right;
}
.PhotoCreditThumb {
    font-family:"Arial", sans-serif; text-align:center;
}
.NewsBarText, .NewsBar {
    font-family:"Arial", sans-serif;
    font-weight:500; line-height:1.4;
}

/* Standard font sizes for large screens */

.MenuButton span, .MenuButton:link span, .MenuButton:visited span { font-size:15px; }
.BannerText { font-size:38px; }
.SmallBannerText { font-size:24px; }
.PageTitleText, .PageTitle { font-size:18px; }
.TitleText { font-size:18px; }
.SubTitleText, .SubTitle, .SubHeading, .YearText { font-size:17px; }
.NormalText, .NormalPara, .CentredPara, .QuoteText, .EmailText { font-size:16px; }
.CaptionText, .GalleryCaption, .GalleryShortCaption { font-size:14px; }  
.SmallCaptionText, .SmallCaption { font-size:12px; }
.CreditText, .GalleryCredit, .GalleryCredit1, .GalleryCredit2, .GalleryCredit3 { font-size:12px; }
.PhotoCreditInSlide, .PhotoCreditInSlideDark, .PhotoCreditInSlideLight { font-size:12px; }
.PhotoCredit, .PhotoCreditThumb { font-size:12px; }
.FootNoteText { font-size:14px; }
.NewsBarText, .NewsBar { font-size:18px; }

/* Some font-scaling for intermediate screen sizes */

@media handheld, screen and (max-device-width: 800px) {

.MenuButton span, .MenuButton:link span, .MenuButton:visited span { font-size:17px; }
.BannerText { font-size:38px; }
.SmallBannerText { font-size:24px; }
.PageTitleText, .PageTitle { font-size:22px; }
.TitleText { font-size:22px; }
.SubTitleText, .SubTitle, .SubHeading, .YearText { font-size:20px; }
.NormalText, .NormalPara, .CentredPara, .QuoteText, .EmailText { font-size:18px; }
.CaptionText, .GalleryCaption, .GalleryShortCaption { font-size:15px; }  
.SmallCaptionText, .SmallCaption { font-size:14px; }
.CreditText, .GalleryCredit, .GalleryCredit1, .GalleryCredit2, .GalleryCredit3 { font-size:13px; }
.PhotoCreditInSlide, .PhotoCreditInSlideDark, .PhotoCreditInSlideLight { font-size:13px; }
.PhotoCredit, .PhotoCreditThumb { font-size:13px; }
.FootNoteText { font-size:15px; }  
.NewsBarText, .NewsBar { font-size:20px; }
}