git.plutz.net Git - confetti/blob - style.css

   1 * {
   2   font-family: sans-serif;
   3   -moz-box-sizing: border-box;
   4   -webkit-box-sizing: border-box;
   5   box-sizing: border-box;
   6   z-index: 0;
   7 }
   8 body {
   9   background: #EEE;
  10   margin: 0;
  11   padding: 0;
  12   padding-top: 2.5em;
  13   position: absolute;
  14   min-height: 100%;
  15   width: 100%;
  16   padding-bottom: 2em;
  17 }
  18 .NAVIGATION {
  19   position: fixed;
  20   top: 0;
  21   display: inline-block;
  22   border-style: none solid solid solid;
  23   border-width: 0 1px 1px 1px;
  24   border-radius: 0 0 4px 4px;
  25   margin: 0 2em;
  26   padding: .5em 1ex;
  27   background: #FFF;
  28   z-index: 1;
  29 }
  30 .NAVIGATION label,
  31 .NAVIGATION a {
  32   color: #008;
  33   border: solid 1px #BBF;
  34   margin: .5em .5ex .25em .5ex;
  35   padding: .2em 3ex .2em 3ex;
  36   background: #EFF;
  37 }
  38 .NAVIGATION label:hover,
  39 .NAVIGATION a:hover {
  40   border-width: 2px 1px;
  41   background: #F3FFFF;
  42 }
  43
  44 #CONFIGURE        label[for="navigationconfig"] { display: none; }
  45 #CONFIGURE:target label[for="navigationconfig"] { display: inline; }
  46
  47 .NAVIGATION input#navigationconfig { display: none; }
  48 .NAVIGATION input + form.config {
  49   position: static;
  50   display: none;
  51 }
  52
  53 .NAVIGATION .config a { display: block; }
  54 .NAVIGATION .config a:hover { border-width: 1px 2px; }
  55 .NAVIGATION input:checked + form.config { display: block; }
  56 .NAVIGATION .config input[type=text],
  57 .NAVIGATION .config button {
  58   font-size: .875em;
  59   line-height: 1.5em;
  60   height: 1.75em;
  61   padding: 0 .25em;
  62   vertical-align: bottom;
  63   border: 1px solid #000;
  64   background-color: #FFF;
  65 }
  66 .NAVIGATION .config input[type=text] {
  67   margin: .25em 0 0 .375em;
  68   border-right: none;
  69   width: 70%;
  70 }
  71 .NAVIGATION .config button {
  72   min-width: 2.5em;
  73   text-align: center;
  74   max-width: 30%;
  75 }
  76 .NAVIGATION .config button[value=del] {
  77   background: #FCC;
  78 }
  79
  80 #message {
  81   display: block;
  82   position: fixed;
  83   top: 0; width: 100%;
  84   margin: 0; padding: 1em;
  85   text-align: center;
  86   font-weight: bold;
  87   background-color: #FAA;
  88   border: 1px solid #000;
  89   border-style: none none solid none;
  90 }
  91
  92 .trailbtn { display: none; }
  93 .trailbtn + .trailbox { display: none; }
  94 .trailbtn:checked + .trailbox { display: inline-block; }
  95 .trailbtn:checked + .trailbox + .trailbtn { display: block; }
  96 .trailbtn:checked + .trailbox + .trailbtn:before {
  97    display: block; content: '+';
  98    width: 3ex; text-align: center;
  99    margin-top: .25em; padding: .25em 0;
 100    background-color: #FFF;
 101    border-width: 1px; border-style: solid;
 102 }
 103 .trailbtn:checked + .trailbox + .trailbtn:checked,
 104 .trailbtn:checked { display: none; }
 105
 106 #footer {
 107   width: 100%;
 108   background-color: #FFF;
 109   border-top: 1px solid #BBF;
 110   margin: 0; padding: .5em 2em;
 111   position: absolute; bottom: 0;
 112 }