@charset "utf-8";

body {  
  font-family: Arial, Helvetica, Sans-serif;  
  font-size: 12px;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  min-width: 300px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;
}

H1 {  
  font-size: 1.5em;  
  margin-top: 2px;  
  margin-right: 0px;  
  margin-bottom: 2px;  
  margin-left: 2px;
}

H2 {  
  font-size: 1.3em;
}

H3 {  
  font-size: 1.17em;
}

H4 {  
  font-size: 1.17em;
}

H5 {  
  font-size: 1em;
}

H6 {  
  font-size: 1em;
}

article, header, nav, section, footer, figure {  
  display: block;
}

header {  
  background-color: white;  
  border-bottom-width: medium;  
  border-bottom-style: solid;  
  border-bottom-color: red;  
  left: 0px;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 4px;  
  padding-left: 0px;  
  position: fixed;  
  top: 0px;  
  width: 100%;  
  z-index: 2;
}

header nav {  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 2px;
}

header h1:hover {  
  cursor: pointer;
}

#container {  
  display: block;  
  padding-top: 0em;  
  padding-bottom: 2em;  
  position: relative;
}

section > h2 {  
  cursor: pointer;  
  background-color: #cccccc;  
  border-bottom-width: 1px;  
  border-bottom-style: solid;  
  border-bottom-color: rgba(0, 0, 0, 0.25);  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;  -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);  
  margin-bottom: 1px;  
  padding-top: 2px;  
  padding-right: 4px;  
  padding-bottom: 2px;  
  padding-left: 10px;  
  text-decoration: none;  text-shadow: 0px -1px 1px rgba(255, 255, 255, 0.3);  
  width: 99%;
}

section div {  
  margin-left: -0.5em;
}

section section div {  
  margin-left: -1.5em;
}

section h3 {  
  color: #666666;  
  cursor: pointer;
}

section h4 {  
  color: #660066;  
  cursor: pointer;
}

figure, span.step {  
  display: list-item;  
  font-weight: bold;  
  list-style-type: decimal;  
  list-style-position: outside;  
  list-style-image: none;  
  margin-left: 1.5em;
}

figcaption, span.step p {  
  font-weight: normal;
}

footer {  
  background-color: black;  
  margin-top: 3.5em;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 2px;  
  padding-left: 0px;  
  position: relative;  
  text-align: center;  
  width: 100%;
}

footer a {  
  border-right-width: 1px;  
  border-right-style: solid;  
  border-right-color: white;  
  color: white;  
  display: inline;  
  font-size: 0.9em;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 4px;  
  padding-bottom: 0px;  
  padding-left: 4px;
}

footer a:last-child {  
  border-right-width: medium;  
  border-right-style: none;  
  border-right-color: initial;
  border-right-color: -moz-initial;
}

footer a:hover {  
  background-color: blue;
}

div.overlay {  
  position: relative;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  top: 9px;  
  left: -9px;  
  z-index: 1;
}

img.ScreenShot {  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: black;  
  border-right-width: 1px;  
  border-right-style: solid;  
  border-right-color: black;  
  border-bottom-width: 1px;  
  border-bottom-style: solid;  
  border-bottom-color: black;  
  border-left-width: 1px;  
  border-left-style: solid;  
  border-left-color: black;
}

img.view_icon {  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;
  border-top-color: -moz-initial;  
  border-right-width: medium;  
  border-right-style: none;  
  border-right-color: initial;
  border-right-color: -moz-initial;  
  border-bottom-width: medium;  
  border-bottom-style: none;  
  border-bottom-color: initial;
  border-bottom-color: -moz-initial;  
  border-left-width: medium;  
  border-left-style: none;  
  border-left-color: initial;
  border-left-color: -moz-initial;  
  width: auto;  
  height: auto;
}

a {  
  text-decoration: none;
}

a[id] {  
  display: block;  
  font-size: 0px;  
  height: 0px;  
  margin-top: 0px;  
  margin-right: 0px;  
  margin-bottom: 0px;  
  margin-left: 0px;  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  position: relative;  
  top: -65px;  
  width: 0px;
}

#dialog {  
  display: none;
}

#dialog-help {  
  display: none;
}

#dialog ul {  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  list-style-type: none;  
  list-style-position: outside;  
  list-style-image: none;  
  margin-left: 0.5em;
}

#dialog ul ul {  
  padding-top: 0px;  
  padding-right: 0px;  
  padding-bottom: 0px;  
  padding-left: 0px;  
  list-style-type: none;  
  list-style-position: outside;  
  list-style-image: none;  
  margin-left: 1.5em;
}

#dialog ul li a img {  
  border-top-width: medium;  
  border-top-style: none;  
  border-top-color: initial;
  border-top-color: -moz-initial;  
  border-right-width: medium;  
  border-right-style: none;  
  border-right-color: initial;
  border-right-color: -moz-initial;  
  border-bottom-width: medium;  
  border-bottom-style: none;  
  border-bottom-color: initial;
  border-bottom-color: -moz-initial;  
  border-left-width: medium;  
  border-left-style: none;  
  border-left-color: initial;
  border-left-color: -moz-initial;
}

#dialog a:focus {  
  outline-width: medium;  
  outline-style: none;  
  outline-color: initial;
  outline-color: -moz-initial;
}

#dialog a:hover {  
  background-color: blue;  
  color: white;
}

.r_arrow {  
  background-image: url("images/right_arrow.png");  
  background-position: 0px 50%;  
  background-repeat: no-repeat;  
  margin-bottom: 5px;  
  padding-left: 1.5em;
}

.d_arrow {  
  background-image: url("images/down_arrow.png");  
  background-position: 0px 50%;  
  background-repeat: no-repeat;  
  margin-bottom: 5px;  
  padding-left: 1.5em;
}

#dialog-help dl dt {  
  font-weight: bold;  
  margin-left: 1.5em;
}

#topicBtn, #tglTopicBtn, #tglImageBtn, #printBtn, #extraHelpBtn {  
  font-weight: bold;
}

#extraHelpBtn {  
  float: right;  
  right: 0.5%;
}

.ui-button-text {  
  font-size: 0.9em;
}

button.ui-button {  
  white-space: nowrap;
}

.ui-icon-closethick {  
  background-color: #cccccc;  
  border-top-width: 1px;  
  border-top-style: solid;  
  border-top-color: black;  
  border-right-width: 1px;  
  border-right-style: solid;  
  border-right-color: black;  
  border-bottom-width: 1px;  
  border-bottom-style: solid;  
  border-bottom-color: black;  
  border-left-width: 1px;  
  border-left-style: solid;  
  border-left-color: black;  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;  
  z-index: 1;
}

._obe_enter_click_or_select {  
  font-weight: bold;
}

._obe_highlight_red {  
  font-weight: bold;  
  color: red;
}

._obe_code_enter {  
  font-family: "Courier New", Courier, mono;  
  font-weight: bold;
}

._obe_code_element {  
  font-family: "Courier New", Courier, mono;
}

._obe_file_or_directory {  
  font-family: "Courier New", Courier, mono;
}

._obe_emphasis {  
  font-style: italic;
}

._obe_variable {  
  font-family: "Courier New", Courier, mono;  
  font-style: italic;
}

@media only screen and (max-width: 590px) {
  button.ui-button { height: 2em; width: 2em; }
  h2 .ui-button-text { font-size: 1em; }
}

@media only screen and (max-device-width: 480px) and (orientation: portrait) {
  header h1 { font-size: 1.2em; }
  footer a { font-size: 0.9em; }
  button.ui-button { height: 2em; width: 2em; }
  h2 .ui-button-text { font-size: 1em; }
  img.ScreenShot { width: 98%; }
  img.view_icon { border: medium none; width: auto; height: auto; }
}

@media only screen and (max-device-width: 480px) and (orientation: landscape) {
  html {  }
  header h1 { font-size: 1.2em; }
  footer a { font-size: 0.9em; }
  button.ui-button { height: 2em; width: 2em; }
  h2 .ui-button-text { font-size: 1em; }
  img.ScreenShot { width: 98%; }
  img.view_icon { border: medium none; width: auto; height: auto; }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait) {
  header h1 { font-size: 1.2em; }
  button.ui-button { height: 2em; width: auto; }
  h2 .ui-button-text { font-size: 1em; }
  img.view_icon { border: medium none; width: auto; height: auto; }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape) {
  header h1 { font-size: 1.2em; }
  button.ui-button { height: 2em; width: auto; }
  h2 .ui-button-text { font-size: 1em; }
  img.view_icon { border: medium none; width: auto; height: auto; }
}

@media print {
  * {    
    background-color: transparent;    
    background-image: none;    
    background-repeat: repeat;    
    background-attachment: scroll;    
    background-position: 0% 0%;    
    color: black;  
}
  header, #container {    
    position: relative;    
    top: 1em;    
    width: 95%;  
}
  nav, div.overlay, footer, #dialog, #dialog-help {    
    display: none;  
}
}

#id1 {  
  background-color: #ffff33;
}