git.fiddlerwoaroof.com
css/screen.less
be9b2e82
 @import "grid.less";
 
 @column-width: 60;
 @gutter-width: 5;
 @columns: 15;
 @total-width: 100%;
 
 * {
    outline: 0px;
    padding: 0px;
    margin: 0px;
    border: 0px;
 }
 
 body {
    background: black;
 }
 
 
 
 h1 {
    color: white;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 10px;
 }
 
 h2 {
    .column(15);
    text-align: center;
    border-bottom: thin #888 solid;
    padding-top: 10px;
    padding-bottom: 5px;
 }
 
 ul#nav {
    list-style: none;
 }
 
 ul#nav > li {
    padding: 5px;
    text-decoration: none !important;
 }
 
 
 .paragraph + .paragraph {
    margin-top: 5px;
 }
 
 p + p {
    margin-top: 3px;
 }
 
 .paragraph {
    border-radius: 5px;
    clear: both;
    position: relative;
    overflow: hidden;
    background: white;
    padding-left: 0px;
    padding-right: 0px;
 }
 
 .paragraph > div {
    padding-top: 5px;
    padding-bottom: 5px;
 }
 
 .orig {
    .column(5);
    //position: -webkit-sticky;
    top: 5px;
    height: 100%;
 }
 
 .expand {
    .column(9);
    .push(3);
 }
 
 
 .comment {
    .column(9);
    border-left: thin #888 solid;
    padding-left: 5px;
    height: 100%;
 }
 
 .hidden {
    display: none;
 }
 
 section#commentary {
    .column(10);
 
    background: green;
 }
 
 .instructions{
    margin-top: 1em;
 }
 
 @media print {
   .button {
     display: none;
   }
 
   section#sidebar {
     display: none;
   }
 
   article {
      .column(15);
      text-align: justify;
   }
 
 }
 
 @media screen {
   .paragraph {
     border: thin #888 solid;
  }
 
   .button {
     font: lighter small monospace;
     color: blue;
     border: groove grey 3px;
     background: grey;
     position:absolute;
     left: 2em;
     top: 1em;
69584931
     padding: 0.25em;
be9b2e82
   }
 
   section#sidebar {
      .column(2);
      .push(1);
      color: white;
      background: #888;
      position: -webkit-sticky;
      top: 0px;
      border: thin #888 solid;
      border-radius: 5px;
      text-align: center;
   }
 
   article {
      .column(11);
      text-align: justify;
   }
 
 }