opalang.css

@media screen {
* {
      margin: 0;
      padding: 0;
}
html {
      background: #FFF;
}
body {
      color:#454545;
      font-size:14px;
      line-height:18px;
      font-weight: normal;
      font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
      text-align:left;
      background: #FFF;
}

/*links*/
a, a:link, a:visited {color: #0B67B2;text-decoration: none;}
a:hover {color: #0B4D86;text-decoration: underline;}
a:active {color: #B30A0A;}

/*Lists*/
ul, ol { margin: 0 0 1.5em 0; }
ul li, ol li {list-style-type: disc;margin:0;}
ul li ul, ol li ol {margin-left:20px;}
ul, ol {list-style-image: none;  list-style-position: inside;}

ul > li {color: #B6B6B2;}
ul > li >* {color: #252525;}
button {padding: 2px 6px 3px 6px;}
table {
  border-collapse: collapse;
  margin: 5px 0;
  width: 100%;
}
table td {vertical-align:top;border-bottom: 1px solid #ddd;padding: 3px;color: #555;font-size:0.9em;}
table td.icon {width:10%;}
table td.icon .title {
  background: #F46E0B;
  text-align:center;
  color:white;
  border-radius: 0.3em 0.3em 0.3em 0.3em;
  -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
  -moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
  text-shadow: 0 1px 0 #777777;
}
table td.icon:after {border:none;}
table td.content {padding-left:10px;}
table td.content .title {font-weight:bold;font-size:1.2em;color:#000;}

p {margin: 1em 0;}
li p, td p {display:inline;}
h1 {color:#000; font-size: 2.2em; line-height:1.4em; margin: 0.7em 0; }
h2 {color:#F46E0B; font-size: 2.5em; line-height:1.4em; margin: 1em 0 0.5em 0;}
h3, #toctitle {color:#000; font-size: 1.5em; line-height:1em; margin: 1em 0;}
h4 {color:#000; font-size: 1.3em; line-height:1em; margin: 0.5em 0;}
h5 {color:#F46E0B; font-size: 1.25em; line-height:1.2em; margin: 0 0 0.5em 0;}
h1, h2, h3, h4, h5 {font-family: "Helvetica", "Arial", sans-serif;font-weight: 700;}
div.sectionbody { padding-top:10px;}
img {
  position:relative;
  margin:10px auto; 
  text-align:center;
  display:block;
}
pre {
   font-size: 12px;
   font-weight: normal;
   line-height: 18px;
   margin:10px 0;
   padding:1em;
   border: 1px solid #ddd;
   color: #195F91;
   background-color: #FEFBF3;
   margin: 0;
   max-height: 500px;
   overflow: auto;
  border-radius: 0.3em 0.3em 0.3em 0.3em;
  -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
  -moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
    box-shadow: 0 1px 3px #ddd inset;
    -webkitbox-shadow: 0 1px 3px #ddd inset;
    -mozbox-shadow: 0 1px 3px #ddd inset;
}

/*Structure*/
#header {
    width: 100%;
}
#header h1{
    text-align:center;
    background:black;
    border-top: 3px solid #FF9238;
    border-bottom: 1px solid #ECECEC;
    color:#eee;
    height: 50px;
    padding-top:10px;
    left: 0;
    margin: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 50;
}
#toc {
   float:left;
   font-size:12px;
   width:200px;
   position:relative;
   left:50%;
   top:0;
   margin:10px 0 0 -500px;
}
#content {
   position:relative;
   top:0;
   left:50%;
   margin: 60px 0 0 -280px;
   width: 780px;
}
#footer-text {
  position: relative;
  text-align: left;
  width:1000px;
  padding:10px 0;
  margin: 0 auto;
}
#footer {
  position: relative;
  text-align: center;
  width:100%;
  background: #bbb; 
  color:#eee; 
  border-top:1px solid #999; 
  text-shadow: 0 -1px 0 #999;
}



  .left {
      text-align: left;
  }
  .right {
      text-align: right;
  }



/* #preamble {position: absolute;right: 0;top: -370px;} */
.toctitle {color:#969692;}
.toclevel1 {font-size:1.2em; margin-top:10px;}
.toclevel2 {margin-left:20px;}
.toclevel3 {margin-left:40px;}
.toclevel4 {margin-left:80px;}
}

/**
 * Print style sheet.
 */
@media print {
/**
 * {1 General stuff}
 */

  html {
  }
  body {
      color:       #252525;
      line-height: 1.4em;
      font-weight: normal;
      font-family: serif;
      text-shadow: 0 1px 0 white;
      text-align:  left;
      width:       20cm;
  }
  * {
      margin:  0;
      padding: 0;
  }
  #header, #footer {
      display:none;
  }
  #footnotes {
      page-break-before:always;
  }
  img {
      page-break-inside:avoid;
      position:relative;
      margin:10px auto;
      text-align:center;
      display:block;
  }

  a, a:link, a:visited {
      color:           #0B67B2;
      text-decoration: none;
      display:         inline;
      font-style:      italic;
  }
  ul, ol { margin: 0 0 1.5em 0; }
  ul li, ol li {list-style-type: disc;margin:0;}
  ul li ul, ol li ol {margin-left:20px;}
  ul, ol {list-style-image: none;  list-style-position: inside;}
  ul > li {color: #B6B6B2;}
  ul > li >* {color: #252525;}


/**
 * {1 Listings}
 */

  pre {
      font-size: small;
      overflow:  hidden;/*Do not remove this: otherwise, wkhtmltopdf will adjust margin&font size arbitrarily to
                          print <pre>, which generally breaks everything else.*/
      background:#FFF;
      margin:0px 1.5cm;
      padding: 3px;
      color: #767672;
      border-color: #C6C6C2;
      border-style: solid;
      border-width: 1px 1px 1px 5px;
      line-height:  1.2em;
      -webkit-box-shadow:1pt 1pt 5px #aaa;
  }

  div.listingblock div.title {
      font-weight:     bold;
      page-break-after:avoid;
  }
  div.listingblock {
      margin-left:      auto;
      margin-right:     auto;
      margin-bottom:    1cm;
      margin-top:       1cm;
      page-break-inside:avoid;
      width:            95%;
  }

/**
 * {1 Sections}
 */
  body{
      counter-reset: part;
  }
  h1:before {
      counter-increment: part;
      content: counter(part, upper-roman) ". ";
  }
  h1 {
      color:      #000;
      font-size:  3em;
      line-height:1.5em;
      margin:     0 0 0.7em 0;
      page-break-before:left;
      margin-top:       12cm;
      padding-top:      12cm;
  }
  h2 {
      page-break-before:always;
      color:       #B30A0A;
      font-size:   2.5em;
      line-height: 1.4em;
      border-top:  solid;
  }
  h3 {
      color:#000;
      font-size: 1.5em;
      line-height:1em;
      margin: 1em 0;
  }
  h4 {
      color:#969692;
      font-size: 1.3em;
      line-height:1em;
      margin: 0.5em 0;
  }
  h5 {
      color:#B30A0A;
      font-size: 1.25em;
      line-height:1.2em;
      margin: 0 0 0.5em 0;
  }
  h1, h2, h3, h4, h5 {
      font-family: "proxima-nova", "Avenir", "Futura", "Helvetica", "Arial", sans-serif;
      font-weight: normal;
  }
  div.sectionbody {
      padding-top:150px;
  }

/**
 * {1 Content}
 */

  #content {
      margin:     0 auto;
      position:   relative;
      padding:    10px 0;
      text-align: justify;
      -webkit-hyphens:    auto;
      width:      110%;
  }
  p {
      margin: 0 0 1.5em 0;
  }

/**
 * {1 Tables}
 */
  div.tableblock {
      width: 100%;
      margin:auto;
  }
  div.tableblock table {
      border-collapse: collapse;
      margin: 5px 0 0 0;
      width: 100%;
  }

/**
 * {1 Tips, warnings, etc.}
 */
  div.admonitionblock {
      width: 100%;
  }
  div.admonitionblock table {
      border-collapse: collapse;
      margin: 5px 0 0 0;
      width: 100%;
  }
  div.admonitionblock table td {
      vertical-align:top;
      color: #767672;
      font-size:0.9em;
      border:none;
  }
  div.admonitionblock table td.icon {
      width:10%;
  }
  div.admonitionblock table td.icon div.title {
      background: #F46E0B;
      text-align:center;
      color:white;
      -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
      -moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
      text-shadow: 0 1px 0 #777777;
  }
  div.admonitionblock table td.content {
      padding-left:  10px;
      padding-right: 10px;
      border-top:    1px solid #c6c6c2;
      border-bottom: 1px solid #c6c6c2;
      background:    #FAFAFA;
  }
  div.admonitionblock table td.content .title {
      font-variant:small-caps;
      font-size:1.2em;
      color:#B30A0A;
  }


/**
 * {1 Header, footer}
 */
  table.print_header, table.print_footer {
      color: rgb(200,200,200);
      width: 100%;
  }
  table.print_header {
      padding-bottom: 1cm;
/*      border-bottom:  solid 1px;*/
  }
  table.print_footer {
/*      border-top:  solid 1px;*/
      padding-top: 1cm;
  }
  .left {
      text-align: left;
  }
  .right {
      text-align: right;
  }
/*
  button {padding: 2px 6px 3px 6px;}
  li p, td p {display:inline;}
*/
}

span.run {
    border: 1px solid gray;
    padding: 8px;
    font-size: 1.2em;
    border-radius: 8px;
    background: #DDD;
    display: inline;
    position: relative;
    top: -62px;
    float: right;
}

/*tip block*/
div.admonitionblock {
    margin: 15px 0;
    background:#F8F8F8;
    border:1px solid #ddd;
    padding:0.5em;
      border-radius: 0.3em 0.3em 0.3em 0.3em;
  -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
  -moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
    box-shadow: 0 1px 3px #CCCCCC inset;
    -webkitbox-shadow: 0 1px 3px #CCCCCC inset;
    -mozbox-shadow: 0 1px 3px #CCCCCC inset;
}
div.admonitionblock table td {border:none;}
/*image block*/
.imageblock {
    border: 1px solid #CCCCCC;
    border-radius: 0.3em 0.3em 0.3em 0.3em;
    -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;
    -moz-border-radius: 0.3em 0.3em 0.3em 0.3em;
    box-shadow: 0 1px 3px #CCCCCC inset;
    -webkitbox-shadow: 0 1px 3px #CCCCCC inset;
    -mozbox-shadow: 0 1px 3px #CCCCCC inset;
}
.imageblock img {
    border:none;
    max-width:100%;
}
div.listingblock div.title {
    font-weight:bold;
}