Shamusworld >> Repos - ardour-manual/blob - source/css/screen.css

   1 @font-face {
   2     font-family: 'junge-regular';
   3     src: url('../css/junge-regular-webfont.ttf')  format('truetype');
   4     font-weight: normal;
   5     font-style: normal;
   6 }
   7
   8 body {
   9   font-family: 'junge-regular';
  10   font-size: 16px;
  11 }
  12
  13
  14 .clear {
  15   clear:both;
  16 }
  17
  18 #tree {
  19   background-color: #212A30;
  20   line-height: 1.8ex;
  21   height: 100%;
  22   overflow: scroll;
  23   position: fixed;
  24   top: 0;
  25   bottom: 0;
  26   left: 0;
  27   width: 20em;
  28   padding: 1em 1em 2em 1.5em;
  29 }
  30
  31 #tree h1 {
  32   font-size: 1.75em;
  33   margin-bottom: 1em;
  34   font-weight: normal;
  35 }
  36
  37 #tree ul {
  38   padding-left: 1em;
  39   list-style-type: none;
  40 }
  41
  42 #tree a {
  43   display: inline !important;
  44   font-size: 0.88em;
  45   line-height: 2em;
  46   color: #E4E4E4;
  47   border-bottom: 1px solid transparent;
  48 }
  49
  50 #tree a:hover {
  51   text-decoration: none;
  52   border-bottom: 1px solid #aaa;
  53 }
  54
  55 #tree .active > a {
  56   display: inline;
  57   color: #FF8080;
  58 }
  59
  60 #content {
  61   padding: 1em 2em 2ex 21em;
  62   margin-left: 0;
  63   line-height: 1.8em;
  64 }
  65
  66 #content h1,
  67 #content h2,
  68 #content h3,
  69 #content h4 {
  70   font-weight: normal;
  71   padding-bottom: .3ex;
  72 }
  73
  74 #content h1 {
  75   font-size: 1.8em;
  76   margin: 0 0 2ex 0;
  77   padding-bottom: .8ex;
  78   border-bottom: 2px solid #ccc;
  79 }
  80
  81 #content h2 {
  82   font-size: 1.3em;
  83   margin: 2ex 0 1ex 0;
  84   border-bottom: 2px solid #ddd;
  85 }
  86
  87 #content h3 {
  88   font-size: 1.2em;
  89   margin: 1.5ex 0 1ex 0;
  90   border-bottom: 1px solid #eee;
  91 }
  92
  93 #content h4 {
  94   font-size: 1.1em;
  95   margin: 1.5ex 0 .5ex 0;
  96   border-bottom: 1px solid #eee;
  97 }
  98
  99 #content table {
 100   width:100%;
 101   margin: 1em 0;
 102   padding: 0;
 103   font-weight: normal;
 104   text-align: left;
 105 }
 106
 107 #content table tr {
 108   border-bottom: 2px solid #eeeeee;
 109 }
 110
 111 #content table tr:nth-child(odd){
 112   background-color: white;
 113 }
 114
 115 #content table tr:nth-child(even){
 116   background-color: #f5f5f5;
 117 }
 118
 119 #content table tr:hover {
 120   background-color: #F2F9FF;
 121 }
 122
 123 #content table td,
 124 #content table th {
 125   margin: 0;
 126   padding: .5em;
 127 }
 128
 129 #content table th {
 130   font-weight: bold;
 131 }
 132
 133 #content table th.sub1 {
 134   padding-left: 2em;
 135 }
 136
 137 #content table th.sub2 {
 138   padding-left: 4em;
 139 }
 140
 141 #content table thead {
 142   font-weight:bold;
 143 }
 144
 145 #content table.dl th {
 146   /* dl class (definition list) is for 2-columns tables that describe properties:
 147   maximmizes the width of the 2nd (description) column */
 148   vertical-align: top;
 149   min-width: 20%;
 150   white-space:nowrap
 151 }
 152
 153 #content table.dl td {
 154   vertical-align: top;
 155   width: 100%;
 156 }
 157
 158 #content ul,
 159 #content ol {
 160   overflow: hidden;
 161 }
 162
 163 #content figure {
 164   display: table;
 165 }
 166
 167 #content figcaption {
 168   display: table-caption;
 169   caption-side: bottom;
 170   font-style: italic;
 171   padding-top: 0.4em;
 172   padding-bottom: 1em;
 173   font-size: .9em;
 174   line-height: .9em;
 175 }
 176 }
 177
 178 #content figcaption.center {
 179   text-align: center;
 180 }
 181
 182 #content figcaption.titleover {
 183   text-align: center;
 184   caption-side: top;
 185 }
 186
 187 #content figure.right {
 188   margin: 0 0 1em 1em;
 189   float: right;
 190   clear: right;
 191 }
 192
 193 #content figure.left {
 194   margin: 0 1em 1em 0;
 195   float: left;
 196   clear: left;
 197 }
 198
 199 #content figure.center {
 200   margin: 1em auto 1em auto;
 201   clear: both;
 202 }
 203
 204 #content img.mini {
 205   width: 200px;
 206 }
 207
 208 #content img.mini:hover {
 209   width: 100%;
 210 }
 211
 212 #content img.fit {
 213   width: 100%;
 214 }
 215
 216 kbd {
 217   text-shadow: 0 0 2px rgb(255, 255, 255);
 218   box-shadow: inset 0 0 1px rgb(255, 255, 255), inset 0 0 .4em rgb(200, 200, 200), 0 .1em 0 rgb(130, 130, 130), 0 .11em 0 rgba(0, 0, 0, .4), 0 .1em .11em rgba(0, 0, 0, .9);
 219 }
 220
 221
 222 kbd.cmd {
 223   text-shadow: none;
 224   box-shadow: none;
 225 }
 226
 227 #content p.center {
 228         text-align:center;
 229 }
 230
 231 @media (max-width: 800px) {
 232   #tree {
 233     position: relative;
 234     height: 250px;
 235     width: 100%;
 236     margin-top: 20px;
 237   }
 238   #content {
 239     padding-left: 20px;
 240     margin-top: 0px;
 241   }
 242 }
 243
 244 /* for the TOC */
 245 #content p.chapter,
 246 #content p.subchapter,
 247 #content p.section,
 248 #content p.subsection {
 249   line-height:1em;
 250 }
 251 #content p.chapter { padding-top: 1em; padding-left: 1em; padding-bottom:1em; }
 252 #content p.subchapter { padding-left: 4em; }
 253 #content p.section { padding-left: 6em; }
 254 #content p.subsection { padding-left: 8em; }
 255