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 #content figcaption.center {
 178   text-align: center;
 179 }
 180
 181 #content figcaption.titleover {
 182   text-align: center;
 183   caption-side: top;
 184 }
 185
 186 #content figure.right {
 187   margin: 0 0 1em 1em;
 188   float: right;
 189   clear: right;
 190 }
 191
 192 #content figure.left {
 193   margin: 0 1em 1em 0;
 194   float: left;
 195   clear: left;
 196 }
 197
 198 #content figure.center {
 199   margin: 1em auto 1em auto;
 200   clear: both;
 201 }
 202
 203 #content img.mini {
 204   width: 200px;
 205 }
 206
 207 #content img.mini:hover {
 208   width: 100%;
 209 }
 210
 211 #content img.fit {
 212   width: 100%;
 213 }
 214
 215 #content p.center {
 216         text-align:center;
 217 }
 218
 219 @media (max-width: 800px) {
 220   #tree {
 221     position: relative;
 222     height: 250px;
 223     width: 100%;
 224     margin-top: 20px;
 225   }
 226   #content {
 227     padding-left: 20px;
 228     margin-top: 0px;
 229   }
 230 }
 231
 232 /* for the TOC */
 233 #content p.chapter,
 234 #content p.subchapter,
 235 #content p.section,
 236 #content p.subsection {
 237   line-height:1em;
 238 }
 239 #content p.chapter { padding-top: 1em; padding-left: 1em; padding-bottom:1em; }
 240 #content p.subchapter { padding-left: 4em; }
 241 #content p.section { padding-left: 6em; }
 242 #content p.subsection { padding-left: 8em; }
 243