/*
 * PixInsight Website Style Sheet
 * Updated 2011 September 19
 */

html {
   height: 100%;
}

body {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   height: 100%;
   font-family: Arial,Helvetica,sans-serif;
   font-size: 10pt;
   line-height: 1.25em;
   background: #e0e0e0;
   color: #000000;
   background-image: url( '../pixel_bkg.png' );
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-position: top right;
}
body.tutorial {
   background: #ffffff;
}
body.document {
   background: #ffffff;
}
body.image {
   background-color: #e8e8e8;
}

:focus {
   outline: 0;
}

a {
   text-decoration: none;
   color: #3333ff;
}
a:visited {
}
a:active {
}
a:hover {
   text-decoration: underline;
}
#dark a {
   color: #a8a8ff;
}

strong, b {
   font-weight: bold;
}

emph, i {
   font-style: italic;
}

p {
   margin-top: 1.0em;
   margin-bottom: 1.0em;
   line-height: 1.25em;
}

li {
   margin-top: 0.25em;
   margin-bottom: 0.25em;
}

ul {
   margin-top: 1.1em;
   margin-bottom: 1.1em;
   list-style-type: square;
}
ul.unindented {
   padding-left: 1em;
}

h1 {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 200%;
   font-weight: 200;
   line-height: 1.2em;
   letter-spacing: -0.5px;
   margin-top: 1.5em;
   margin-bottom: 0.5em;
   color: #0066ff;
}
h2 {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 130%;
   font-weight: 200;
   line-height: 1.2em;
   margin-top: 1.5em;
   color: #0066ff;
}
h3 {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 120%;
   font-weight: 200;
   line-height: 1.2em;
   color: #0066ff;
}
#dark h1, #dark h2, #dark h3 {
   color: #9BC3FF;
}
h4 {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 110%;
   font-weight: 200;
   line-height: 1.2em;
   color: #990000;
}
h5 {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 100%;
   font-weight: bold;
   line-height: 1.2em;
   color: #660000;
}

img {
   border: none;
}
img.block {
   display: block;
}

hr {
   border: none;
   background: #969696;
   color: #969696;
   width: 100%;
   height: 2px;
}
hr.separator {
   margin-top: 2em;
   margin-bottom: 2em;
   background: #d0d0d0;
   color: #d0d0d0;
}

code {
   font-family: DejaVu Sans Mono,Courier New,Courier,monospace;
}
p code {
   margin: 5px 0 5px 0;
   padding: 4px 8px 4px 4em;
}
p.codeBox {
   font-family: DejaVu Sans Mono,Courier New,Courier,monospace;
   border: 2px dashed #cccccc;
   margin: 5px 0 5px 0;
   padding: 4px 8px 4px 1em;
}
pre.code {
   border: 2px dashed #cccccc;
   margin: 5px 0 5px 0;
   padding: 4px 8px 4px 2em;
}
div.code {
   border: 2px dashed #cccccc;
   margin: 5px 0 5px 0;
   padding: 12px 8px 12px 2em;
}

form {
   background: #f0f0f0;
   border: 1px solid #d0d0d0;
   padding: 12px;
}
input, textarea, select {
   border: 1px solid #b0b0b0;
}

.author {
   font-size: 110%;
   font-weight: bold;
}

.leadingImage {
   float: left;
   border: 1px solid #606060;
   width: 150px;
   height: 150px;
   margin-right: 10px;
   margin-bottom: 8px;
}

/* Paragraphs in tutorial and example index descriptions */
.documentIndexData p {
   margin-top: -0.5em;
}

.figure {
   border: 2px solid #cccccc;
   margin: 0;
   padding: 8px;
   background-color: #eeeeee;
}
.figure_panel {
   border-bottom: 2px solid #cccccc;
   padding: 0;
   background-color: #eeeeee;
}
.figure_caption {
   font-size: 80%;
}
.figure_credits {
   font-size: 75%;
}
.figure_padded {
   padding-left: 1em;
   padding-right: 1em;
}

.identifier {
   font-family: "Courier New",Courier,monospace;
}
.menu_item {
   font-style: italic;
}
.shortcut {
   font-family: "Courier New",Courier,monospace;
}

.small {
   font-size: 80%;
}
.tiny {
   font-size: 75%;
}

.red {
   color: #990000;
}
.green {
   color: #006600;
}
.blue {
   color: #0000ff;
}
.invisible {
   display: none;
}

.courier {
   font-family: "Courier New",Courier;
}
.symbol {
   font-family: symbol;
}
.helvetica {
   font-family: Arial,Helvetica,sans-serif;
}

.tableHeader {
   background: #eeeeee;
   border-bottom: 1px solid black;
}
.rowEven {
   background: #dddddd;
}
.rowOdd {
   background: #eeeeee;
}

.headline {
   border-bottom: 1px solid #999999;
   margin-top: 2em;
   margin-bottom: 1em;
   padding-bottom: 0.1em;
}

.firstLine {
   margin-top: 0;
}

.collapsible {
   margin-top: 4px;
   margin-bottom: 0.5em;
   background: #f0f0f0;
   border: 1px solid #d0d0d0;
   padding-left: 1em;
   padding-right: 1em;
}

.collapsibleLink {
   font-weight: bold;
   margin-bottom: 0.25em;
}

.homeAnimatedImage {
   display: block;
   width: 660px;
   height: 406px;
}

.homeAnimatedText {
   display: block;
   margin-top: 4px;
   font-size: 80%;
}

#container {
   margin-top: 0;
   margin-bottom: 0;
   margin-left: auto;
   margin-right: auto;
   padding: 0;
   width: 1000px;
   height: 100%;
   background: transparent;
   visibility: hidden; /* to avoid transitional states - will be set to visible in AdjustCSSPageComponents() */
}

#logo {
   float: left;
   width: 80px;
   height: 100%;
   margin-top: 0;
   padding-top: 35px;
   padding-right: 8px;
   background: #414b55;
}

#thumbs {
   float: left;
   width: 150px;
   height: 100%;
   margin-top: 0;
   padding-top: 35px;
   background: #929292;
}
#dark #thumbs {
   background: #404040;
}

#contents {
   float: left;
   width: 660px;
   height: 100%;
   margin-top: 0;
   padding-top: 35px;
   padding-left: 24px;
   padding-right: 20px;
   background-image: url(../graphics/W180.png);
}
#dark #contents {
   color: #e0e0e0;
   background-image: url(../graphics/K150.png);
}
#contents.home {
   width: 510px; /* for pages with a thumbs column, such as the home page. */
}

#toc {
   float: left;
   width: 200px;
   margin-top: 0;
   padding-top: 35px;
   margin-left: 8px;
   background-image: url(../graphics/K20.png);
}
#dark #toc {
   background-image: url(../graphics/K20.png);
}

.tocText {
   margin-left: 8px;
   margin-top: 0;
   font-family: Arial,Helvetica,sans-serif;
   font-size: 8pt;
   font-weight: bold;
   text-align: left;
   line-height: 1.6em;
   cursor: default;
   color: #37414b;
}
.tocText p {
   margin-top: 0.5em;
}
.tocText a, .tocText a:link {
   border-right: 5px solid transparent;
   display: block;
   text-decoration: none;
   cursor: pointer;
   /*cursor: default;*/
   color: #37414b;
}
.tocText a:hover {
   border-right: 5px solid #69737d;
   color: #000000;
   background: #c7e0ff;
   text-decoration: none;
}
.tocText hr {
   border: none;
   background: #646e78;
   color: #646e78;
   width: 100%;
   height: 1px;
}
.tocSubItem {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 7.5pt;
   font-weight: bold;
   text-align: left;
   line-height: 1.2em;
   color: #3741b4;
}
.tocSubItem ul {
   margin-left: 0;
   margin-bottom: 0;
   padding-left: 0; /* to be set by script code */
   list-style-image: url( '../graphics/arrow-right.png' );
}
.tocPageContents ul {
   list-style-image: none;
}
.tocSubItem li {
   margin-top: -0.8em;
   margin-bottom: 0;
}
.tocSubItem a, .tocItem1 a:link {
   color: #3741b4;
}
.tocSubItem a:hover {
   color: #000000;
}
.tocIndex a {
   border-right: 5px solid #b0b0b0;
}

/*
 * Document title bar (fixed frame)
 */
#docTitleBar {
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 55px;
   z-index: 1;
   padding: 0;
   overflow: auto;
   background-color: #414b55;
}

/*
 * Document table of contents (fixed frame)
 */
#docTOC {
   position: fixed;
   left: 0;
   top: 55px;
   width: 250px;
   height: 100%;
   z-index: 1;
   padding: 0;
   overflow: auto;
   background: #cbcbcb;
}

/*
 * Document contents (TOC at the left side: tutorials, examples)
 */
#docContents {
   position: absolute;
   left: 0;
   top: 0;
   width: 801px;
   margin-top: 65px;
   margin-left: 265px;
   padding-top: 0;
   padding-left: 0;
   font-family: DejaVu Sans,Arial,Helvetica,sans-serif;
}
#docContents h1 {
   font-size: 210%;
   margin-top: 0.5em;
}
#docContents h2 {
   font-size: 140%;
}
#docContents h3 {
   font-size: 125%;
}
#docContents h4 {
   font-size: 120%;
}
#docContents h5 {
   font-size: 105%;
}

/*
 * Document contents: wide page, no TOC: images, small videos
 */
#docPage {
   width: 900px;
   height: 100%;
   margin-top: 75px;
   margin-left: auto;
   margin-right: auto;
   padding: 0;
   font-family: Arial,Helvetica,sans-serif;
}

/*
 * Document contents: HD720p videos
 */
#videoPageHD720 {
   width: 1280px;
   height: 100%;
   margin-top: 75px;
   margin-left: auto;
   margin-right: auto;
   padding: 0;
   padding-left: 24px;
   padding-right: 24px;
   font-family: Arial,Helvetica,sans-serif;
}
#videoHD720 {
   padding: 0;
}

#docPage #videoPageHD720 h1 {
   font-size: 210%;
   margin-top: 0.5em;
}
#docPage #videoPageHD720 h2 {
   font-size: 140%;
}
#docPage #videoPageHD720 h3 {
   font-size: 125%;
}
#docPage #videoPageHD720 h4 {
   font-size: 120%;
}
#docPage #videoPageHD720 h5 {
   font-size: 105%;
}

/*
 * We no longer support IE6 and IE7!
 */
#IE6Warning {
   background: #ffff00;
   border: 2px solid #000000;
   color: #000000;
   font-family: Arial,sans-serif;
   padding: 30px 30px;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 10;
   width: 300px;
   visibility: hidden;
}