* {
   padding:0;
   margin:0;
   box-sizing: border-box;
}
html {
   overflow-y: scroll;
}
body {
   font-size: 62.5%;
   background-color: #ffffff;
   text-align: center;
   margin-bottom: 20px;
   color: #111111;
}
#wrapper {
   border-top: 0;
   border-left: 0;
   border-right: 0;
   text-align: left;
   margin: 0 auto;
   margin-bottom: 50px;
}
div.bottom_space {
   margin-bottom:800px;
}
ul, ol {
   padding-bottom: 1em;
}
/*#mailinglist ul#f_links {
   padding-top:35px;
}*/



html, p, ul, ol, td {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 1.2em;
   line-height: 1.8em;
}
@media (max-width: 800px) {
   html, p, ul, ol, td {
      font-size: 1.3em;
   }
}
p a, ul a, ol p, li a, td a {
   /* in case the <p> etc. font size is anything but 1em */
   font-size: 1em;
}
@media screen and (min-width: 821px) {
   p, ul, ol, td, p a, ul a, ol p, li a, td a {
      font-size: 12.5px;
   }
}


/* ************* */
html, p, ul, ol, td, p a, ul a, ol p, li a, td a {
   font-size: 13px;
}
@media (max-width: 500px) {
   html, p, ul, ol, td, p a, ul a, ol p, li a, td a {
      font-size: 16px;
   }
}






img {
   border:0;
}
.copy img {
   max-width: 100% !important;
}


h1, h2, h3 {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-weight: 500;
   color: maroon;
   color: #444;
}
h1, h2 {
   font-size: 2.4em;
   padding-top: 0.5em;
   padding-bottom: 0.3em;
}
#contact h1 {
   padding-bottom: 0.6em;
}
.news_issue_date {
   color: #999999;
}
h2.no_backtotop {
   padding-top: 1em;
}
h2#testimony {
   padding-bottom:0.7em;
}
p#quotes i {
   color:#814466;
}
h3 {
   font-size: 1.8em;
   padding-bottom: 0.3em;
   padding-top: 12px;
}


p {
   padding-bottom: 1em;
}
p#usui {
   background: url(images/mobilereiki_dr-mikau-usui.jpg) no-repeat ;
   padding-left: 90px;
}
p#helen_index {
   background: url(images/mobilereiki_helen.jpg) no-repeat ;
   padding-left: 110px;
}
p#helen_contact {
   background: url(images/mobilereiki_helen_contact.jpg) no-repeat ;
   padding-top: 0;
   padding-left: 90px;
}
p#physically {
   padding-top: 15px;
}
span.caption {
   color:#777777;
   font-size: 14px;
   font-style: italic;
   padding-bottom: 0;
   padding-top: 0;
}
@media screen and (min-width: 821px) {
   span.caption {
      font-size: 12.5px;
   }
}
img.pic {
   padding:0;
}



a {
   color: #0267ff;
   text-decoration: underline;
}
a:visited {
   color: #0267ff;
   text-decoration: underline;
}
a:hover {
   text-decoration: underline;
   color: #a31111;
   /*color: #cc0000;*/
}
a.highlight {
   color: #a31111;
   text-decoration:underline;
}
a.highlight:visited {
   color: #a31111;
   text-decoration: underline;
}
a.highlight:hover {
   text-decoration: underline;
   color: #0267ff;
}
a img {
   text-decoration: none;
}
span.backtotop {
   display:inline-block;
   width:333px;
   text-align:right;
}




#nav {
   /*padding-top: 2px;*/
   height: 40px;
}
#nav ul {
   list-style:none;
}
#nav li a {
   display: block;
   /* width:113px; */  /* dimensions needed for IE5.x/Win */
   /*********************color: #ffffff;*/
   color: #ddd;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-style: normal;
   font-size: 15.8px;
   line-height: 2.4em;
   height: 40px;
   text-decoration: none;
}



.btn {
   /*display: inline-block;*/
   padding: 4px 16px 5px 16px;
   border-radius: 10px;
   text-decoration: none;
   background-color: orange;
   color: #111 !important;
   font-size: 14px;
   margin-top: 10px;
   margin-bottom: 20px;
   display: block;
   max-width: 150px;
   text-align: center;
}
.btn:hover,
.btn:focus {
   text-decoration: none;
   background-color: #ba9635;
   color: #fff !important;
}



#index ul.dropdown .index,
#reiki ul.dropdown .reiki,
#sekhem ul.dropdown .sekhem,
#indian ul.dropdown .indian,
#booking ul.dropdown .booking,
#offers ul.dropdown .offers,
#contact ul.dropdown .contact {
   background-color: orange;
}
#index ul.dropdown .index a,
#reiki ul.dropdown .reiki a,
#sekhem ul.dropdown .sekhem a,
#indian ul.dropdown .indian a,
#booking ul.dropdown .booking a,
#offers ul.dropdown .offers a,
#contact ul.dropdown .contact a {
   color: #000;
   cursor: default;
}

/*#nav ul.dropdown li.treat a {
   cursor: default;
}*/
ul.dropdown {             /* this is the main navigation bar across the top of the page */
   position: relative; 
   list-style:none;
   padding-bottom: 0;
}
ul.dropdown li { 
   float: left; 
   zoom: 1; 
}
ul.dropdown li a { 
   text-align: center;
}
ul.dropdown li.hover, 
ul.dropdown li:hover,
ul.dropdown li:focus {
   background-color: orange !important;
   color: #000;
}
#nav li:hover a,
#nav li a:hover, 
#nav li:focus a,
hr {

}


#nav li a:focus { 
   color: #000;
   background-color: orange;
}






#nav ul span.nb {
   font-size: 12px;
}

/* CSS bg logo looks awful in IE7 when increased with Ctrl+. so it's an image in the HTML */
div#logo {
   float: left;
   padding-top: 0;
   width: 800px;
   height: 100px;
}
div#content {
   width: 800px;
}




a#subscribe {
   color: #0267ff;
   text-decoration: underline;
}
a#subscribe:visited {
   color: #0267ff;
   text-decoration: underline;
}
a#subscribe:hover {
   text-decoration: underline;
   color: #a31111;
}
/* see _inc_nav.php. for pages where we don't want the subscription link */
div#no_leftside {
   background-color: #ffffff;
   float: left;
   border: 0;
   margin-top: 73px;
   padding-top: 6px;
   padding-left: 11px;
   padding-right: 6px;
   padding-bottom: 6px;
   width: 120px;
}
span#button_yes:hover {
   background: #e1e8f3 url(images/button_yes.gif) no-repeat left bottom;
   display:block;
   width:116px;
   height:43px;
}




div#content div.copy {
   float: left;
   /* margin- and padding-left adjusted here so that can see hanging bullets in IE */
   margin-left: 0;  
   /************** padding-left: 35px;*/
   width: 333px;
   margin-top: 0;
   /* border: 1px solid #999999; */
}

.clear {
   clear: left;
   height: 1px;
}


div#footer {
   background-color: #000;
   background-color: #442e17;
}
div#footer, div#footer a {
   color:#ffffff;
   color: #ddd;
}
div#footer a:hover {
   color:#e7d9b7;
}
div#footer span {
   margin-right: 12px;
}

table {
   font-size: 1.05em;
   font-size: 1em;
   line-height: 2em;
   margin-bottom: 18px;
}
td.first_treat {
   height:30px;
}


form {
   background-color:#e3e9f3;
   background-color:#eee;
   background-color:#fff;
   margin-bottom: 18px;
}
form p {
   padding-left: 10px;
}
form p.booking_form_text {
   padding-top: 15px;
   padding-right: 10px;
   padding-bottom: 18px;
}
form table {
   width:100%;
   font-size: 1.05em;
   line-height: 1em;
}
fieldset {
   margin-top: 15px;
   border:1px solid #666666;
}
#fs_paypal { padding-top: 20px;}
#fs_paypal #submit { margin-top: 3px;}

.label_contact {
   display: inline-block;
   width: 6em;
   font-weight: normal;
}
.label_booking {
   font-weight: normal;
}
.label_paypal {
   display: inline-block;
   font-weight: normal;
   vertical-align:top;
   padding-top:4px;
   padding-bottom:10px;
   padding-right:10px;
}
.textarea {
   margin-top: 10px;
}
input.textbx, .textarea {
   border: 1px solid #999999;
}
.submit {
   margin-bottom: 5px;
}
span.contact_submit {
   display:inline-block;
   width:285px;
   text-align:right;
}
span.book_submit {
   display:inline-block;
   /*width: 313px;*/
   text-align:right;
}
span.form_msg {
   color: #cc0000;
   font-style: italic;   
   padding-right: 3px;
}

.course_details {
   font-style:italic;
}



span.learn-reiki {
   display:block;
   width:333px;
   text-align:right;
   padding-left:195px;
}
span.learn-reiki a {
   display: inline-block;
   width:132px;
   height: 32px;
   text-decoration: none;
}
span#learn-reiki1, span#learn-reiki2, span#learn-reiki3 {
   display:inline-block;
   width:132px;
}
span#learn-reiki1 a {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat left top;
}
span#learn-reiki1 a:hover {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat left bottom;
}
span#learn-reiki2 a {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat center top;
}
span#learn-reiki2 a:hover {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat center bottom;
}
span#learn-reiki3 a {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat right top;
}
span#learn-reiki3 a:hover {
   background: #ffffff url(images/btn_learn-reiki.gif) no-repeat right bottom;
}

em.newsletter {
   color: #a31111;
}
#violet { color:#cf6ae6; }
#indigo { color:#583f80; }
#blue   { color:#0a50ec; }
#green  { color:#1c9b1f; }
#yellow { color:#d7c108; }
#orange { color:#f58604; }
#red    { color:#f73148; }

#newsletter4 a img {
   cursor:default;
}
#newsletter4 img.pic {
   margin-top:12px;
}





/************************************************************************************************************************/


#wrapper {
   max-width: 800px;
}


div#leftarrow {
   display: none;
}
div#logo {
   width: 100%;
}
div#content {
   width: 100%;
   float: left;
   z-index: 99;
   position: relative;
}
div#no_leftside,
div#leftside {
   display: none;
}

#nav li a:hover {
   color: #000;
}
div#quoteofday {
   display: none;
}
div#footer {
   margin-top: 30px;
   padding-left: 15px;
}
div#footer p {
   padding-top: 13px;
   padding-bottom: 13px;
   line-height: 1.4em;
}



h1 {
   padding-top: 0;
   padding-bottom: 20px;
   font-size: 3em;
}
#index h1 {
   /*text-indent: -9999px;
   height: 0;*/
}
h2 {
   margin-top: 50px;
   padding-top: 15px;
   font-size: 2.2em;
   border-top: 1px dashed #666;
}
.p_on-this-page {
   padding-bottom: 0;
}
.p_on-this-page:after {
   content: ":";
}
.hr_on-this-page {
   display: none;
   border: 0 none;
   border-top: 1px dashed #666;
   background: none;
   height:0;
   margin-top: 20px;
}
.ul_on-this-page,
.ul_page-content {
   list-style: none;   
}
.ul_on-this-page li,
.ul_page-content li {
   list-style: none;
   padding-left: 20px;
   list-style-position: inside;
   text-indent: -1.1em;
   padding-left: 1.1em;
}
.ul_on-this-page li:before,
.ul_page-content li:before {
   content: "\00BB";
   padding-right: 7px;
}
.tbl_prices {
   padding-bottom: 1em;
}
.tbl_prices td {
   border-bottom: 1px solid #ccc;
   padding-top: 5px;
   padding-bottom: 5px;
   vertical-align: top;
}

#frm_booking td {
   vertical-align: top;
}
#frm_booking input {
   height: 25px;
}
#frm_booking input[type="submit"] {
   padding-left: 8px;
   padding-right: 8px;
}
.left {
   float: left;
}
.clear-left {
   clear: left;
}
#footer .cloak_eml {
   letter-spacing: 0.05em;
}
.img_bordered {
   display: block;
   float: left;
   padding: 8px;
   border: 1px solid #999;
   width: 350px;
   max-width: 100%;
}

.space {
  width: 4px;
   display: inline-block;
}
.nospace {
  width: 0;
}












/* BIG */
@media screen and (min-width: 821px) {
   #wrapper {
      background: #ffffff url(images/mobilereiki_bg_map.jpg) no-repeat right 0px;
      margin-top: 10px;
   }
   div#content div.copy {
      width: 465px;
      margin-left: 15%;
      background-color: rgba(255, 255, 255, 0.9);
      padding: 10px;
      padding-right: 15px;
   }


   #navtoggle-open,
   #navtoggle-close {
      display: none;
   }



   #nav {
      background-color: #090a0a;
   }
   #nav a {
      outline: none;
   }
   #nav li a {
      padding-left: 23px;
      padding-right: 23px;
   }
   div#logo {
      visibility: hidden;
   }
   ul.dropdown {
      padding-left: 5px;
   }
   ul.dropdown li {
      border-left: 2px #666 solid;
   }
   ul.dropdown li:first-child {
      border-left: 3px #000 solid;
   }
   ul.dropdown li:hover > ul { 
      visibility: visible; 
   }
   div#logo {
      margin-bottom: 40px;
   }

   /* FLEXBOX MENU */
   ul.dropdown {
      display: flex;
      padding: 0;
      background-color: #090a0a;
      background-color: #442e17;
    }
    ul.dropdown li {
      flex-grow: 1;
    }
    ul.dropdown li:first-child {
      border-left: 0;
    }
    #nav li a {
      padding-left: 0;
      padding-right: 0;
    }
   /* FLEXBOX MENU */
}


/* SMALL */
@media screen and (max-width: 820px) {
/*   #wrapper {
      margin-top: 10px;
   }*/
   div#logo {
      background: url(logo-mobilereiki_new2.jpg) no-repeat right -100px;
      background-size: cover;
      height: 0;
   }
   #logo img {
      position: absolute;
      top: -45px;
      right: 17px;
      width: 350px;
      max-width: 50%
   }

   div#content div.copy {
      width: 100%;
      padding-left: 5%;
      padding-right: 5%;
      /*font-size: 14px;*/
   }







  .navtoggle {
    text-decoration: none;
    font-family: Arial;
    color: #000;
    display: inline-block;
    padding: 10px 0px 10px 10px;
    width: 108px;
    background-color: orange;
    color: #000;
    border: none;
    font-size: 16px;
    text-align: left;
    border-radius: 0;
    margin-left: 5%;
    margin-top: 20px;
  }
  .navtoggle:visited {
    color: #000;
  }

  #wrapper:target #nav {
    top: 0px;
  }
  .navtoggle-close {
    display: none;
  }
  #wrapper:target .navtoggle-open {
    display: none;
  }
  #wrapper:target .navtoggle-close {
    display: inline-block;
  }
  #close-menu:target .navtoggle-close {
    display: none;
  }
  #close-menu:target .navtoggle-open {
    display: inline-block;
  }







   #nav {
      position: relative;
      top: -1000px;
      z-index: 999;
   }


/*   #navtoggle {
      display: inline-block;
      z-index: 999;
      padding: 10px 0px 10px 10px;
      width: 108px;
      background-color: orange;
      color: #000;
      border: none;
      font-size: 16px;
      text-align: left;
      border-radius: 0;
      margin-left: 15px;
      margin-left: 5%;
      margin-top: 20px;
   }*/
   
/*   #navtoggle.toggle + #nav {
      top: 0px;
   }
   #navtoggle:before {
      content: "View ";
   }
   #navtoggle.toggle:before {
      content: "Close ";
   }*/


   ul.dropdown {
      width: 220px;
      background-color: #333;
      margin-left: 5%;
   }
   ul.dropdown li {
      float: none;
      border-top: 1px solid #aaa;
      width: 100% !important;
   }
   ul.dropdown li a {
    text-align: left;
   }
   #nav li a {
      padding-left: 10px;
      font-size: 1em;
   }
   ul.dropdown li.hover, ul.dropdown li:hover { 
      background-image: none;
      background-color: #aaa;
   }
   #nav ul.dropdown li.treat:hover {
      background-color: #333;  
   }
}



@media screen and (max-width: 720px) {
   div#footer {
      padding-left: 5%;
   }
   div#footer span {
      display: block;
   }
}
@media screen and (max-width: 500px) {
   #logo img {
      top: -4px;
   }
}
@media screen and (max-width: 360px) {
   #logo img {
      width: 200px;
   }
}




@media only screen {
   .sp_url {
      display: none;
   }
}

@media print {
   nav,
   .navtoggle,
   div#logo {
      display: none;
   }
   div#content div.copy {
      width: 60%;
      float: none;
      margin: auto auto;
   }
   div#logo {
      display: block;
   }
   div#logo img {
      max-width: 300px;
      float: right;
   }


   h1 {
      margin-top: -30px;
      margin-bottom: 10px;
      font-size: 2.5em;
      width: 70%;
   }
   div#logo {
      margin-top: -15px;
   }
   div#logo img {
      max-width: 250px;
   }

   .sp_copyright {
      display: none;
   }
}



