git.oblomov.eu Git - git/blob - stylesheets/stylesheet.css

   1 /*******************************************************************************
   2 Slate Theme for GitHub Pages
   3 by Jason Costello, @jsncostello
   4 *******************************************************************************/
   5
   6 @import url(pygment_trac.css);
   7
   8 /*******************************************************************************
   9 MeyerWeb Reset
  10 *******************************************************************************/
  11
  12 html, body, div, span, applet, object, iframe,
  13 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  14 a, abbr, acronym, address, big, cite, code,
  15 del, dfn, em, img, ins, kbd, q, s, samp,
  16 small, strike, strong, sub, sup, tt, var,
  17 b, u, i, center,
  18 dl, dt, dd, ol, ul, li,
  19 fieldset, form, label, legend,
  20 table, caption, tbody, tfoot, thead, tr, th, td,
  21 article, aside, canvas, details, embed,
  22 figure, figcaption, footer, header, hgroup,
  23 menu, nav, output, ruby, section, summary,
  24 time, mark, audio, video {
  25   margin: 0;
  26   padding: 0;
  27   border: 0;
  28   font: inherit;
  29   vertical-align: baseline;
  30 }
  31
  32 /* HTML5 display-role reset for older browsers */
  33 article, aside, details, figcaption, figure,
  34 footer, header, hgroup, menu, nav, section {
  35   display: block;
  36 }
  37
  38 ol, ul {
  39   list-style: none;
  40 }
  41
  42 table {
  43   border-collapse: collapse;
  44   border-spacing: 0;
  45 }
  46
  47 /*******************************************************************************
  48 Theme Styles
  49 *******************************************************************************/
  50
  51 body {
  52   box-sizing: border-box;
  53   color:#373737;
  54   background: #212121;
  55   font-size: 16px;
  56   font-family: 'Myriad Pro', Calibri, Helvetica, Arial, sans-serif;
  57   line-height: 1.5;
  58   -webkit-font-smoothing: antialiased;
  59 }
  60
  61 h1, h2, h3, h4, h5, h6 {
  62   margin: 10px 0;
  63   font-weight: 700;
  64   color:#222222;
  65   font-family: 'Lucida Grande', 'Calibri', Helvetica, Arial, sans-serif;
  66   letter-spacing: -1px;
  67 }
  68
  69 h1 {
  70   font-size: 36px;
  71   font-weight: 700;
  72 }
  73
  74 h2 {
  75   padding-bottom: 10px;
  76   font-size: 32px;
  77   background: url('../images/bg_hr.png') repeat-x bottom;
  78 }
  79
  80 h3 {
  81   font-size: 24px;
  82 }
  83
  84 h4 {
  85   font-size: 21px;
  86 }
  87
  88 h5 {
  89   font-size: 18px;
  90 }
  91
  92 h6 {
  93   font-size: 16px;
  94 }
  95
  96 p {
  97   margin: 10px 0 15px 0;
  98 }
  99
 100 footer p {
 101   color: #f2f2f2;
 102 }
 103
 104 a {
 105   text-decoration: none;
 106   color: #007edf;
 107   text-shadow: none;
 108
 109   transition: color 0.5s ease;
 110   transition: text-shadow 0.5s ease;
 111   -webkit-transition: color 0.5s ease;
 112   -webkit-transition: text-shadow 0.5s ease;
 113   -moz-transition: color 0.5s ease;
 114   -moz-transition: text-shadow 0.5s ease;
 115   -o-transition: color 0.5s ease;
 116   -o-transition: text-shadow 0.5s ease;
 117   -ms-transition: color 0.5s ease;
 118   -ms-transition: text-shadow 0.5s ease;
 119 }
 120
 121 a:hover, a:focus {text-decoration: underline;}
 122
 123 footer a {
 124   color: #F2F2F2;
 125   text-decoration: underline;
 126 }
 127
 128 em {
 129   font-style: italic;
 130 }
 131
 132 strong {
 133   font-weight: bold;
 134 }
 135
 136 img {
 137   position: relative;
 138   margin: 0 auto;
 139   max-width: 739px;
 140   padding: 5px;
 141   margin: 10px 0 10px 0;
 142   border: 1px solid #ebebeb;
 143
 144   box-shadow: 0 0 5px #ebebeb;
 145   -webkit-box-shadow: 0 0 5px #ebebeb;
 146   -moz-box-shadow: 0 0 5px #ebebeb;
 147   -o-box-shadow: 0 0 5px #ebebeb;
 148   -ms-box-shadow: 0 0 5px #ebebeb;
 149 }
 150
 151 p img {
 152   display: inline;
 153   margin: 0;
 154   padding: 0;
 155   vertical-align: middle;
 156   text-align: center;
 157   border: none;
 158 }
 159
 160 pre, code {
 161   width: 100%;
 162   color: #222;
 163   background-color: #fff;
 164
 165   font-family: Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace;
 166   font-size: 14px;
 167
 168   border-radius: 2px;
 169   -moz-border-radius: 2px;
 170   -webkit-border-radius: 2px;
 171 }
 172
 173 pre {
 174   width: 100%;
 175   padding: 10px;
 176   box-shadow: 0 0 10px rgba(0,0,0,.1);
 177   overflow: auto;
 178 }
 179
 180 code {
 181   padding: 3px;
 182   margin: 0 3px;
 183   box-shadow: 0 0 10px rgba(0,0,0,.1);
 184 }
 185
 186 pre code {
 187   display: block;
 188   box-shadow: none;
 189 }
 190
 191 blockquote {
 192   color: #666;
 193   margin-bottom: 20px;
 194   padding: 0 0 0 20px;
 195   border-left: 3px solid #bbb;
 196 }
 197
 198
 199 ul, ol, dl {
 200   margin-bottom: 15px
 201 }
 202
 203 ul {
 204   list-style: inside;
 205   padding-left: 20px;
 206 }
 207
 208 ol {
 209   list-style: decimal inside;
 210   padding-left: 20px;
 211 }
 212
 213 dl dt {
 214   font-weight: bold;
 215 }
 216
 217 dl dd {
 218   padding-left: 20px;
 219   font-style: italic;
 220 }
 221
 222 dl p {
 223   padding-left: 20px;
 224   font-style: italic;
 225 }
 226
 227 hr {
 228   height: 1px;
 229   margin-bottom: 5px;
 230   border: none;
 231   background: url('../images/bg_hr.png') repeat-x center;
 232 }
 233
 234 table {
 235   border: 1px solid #373737;
 236   margin-bottom: 20px;
 237   text-align: left;
 238  }
 239
 240 th {
 241   font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 242   padding: 10px;
 243   background: #373737;
 244   color: #fff;
 245  }
 246
 247 td {
 248   padding: 10px;
 249   border: 1px solid #373737;
 250  }
 251
 252 form {
 253   background: #f2f2f2;
 254   padding: 20px;
 255 }
 256
 257 /*******************************************************************************
 258 Full-Width Styles
 259 *******************************************************************************/
 260
 261 .outer {
 262   width: 100%;
 263 }
 264
 265 .inner {
 266   position: relative;
 267   max-width: 640px;
 268   padding: 20px 10px;
 269   margin: 0 auto;
 270 }
 271
 272 #forkme_banner {
 273   display: block;
 274   position: absolute;
 275   top:0;
 276   right: 10px;
 277   z-index: 10;
 278   padding: 10px 50px 10px 10px;
 279   color: #fff;
 280   background: url('../images/blacktocat.png') #0090ff no-repeat 95% 50%;
 281   font-weight: 700;
 282   box-shadow: 0 0 10px rgba(0,0,0,.5);
 283   border-bottom-left-radius: 2px;
 284   border-bottom-right-radius: 2px;
 285 }
 286
 287 #header_wrap {
 288   background: #212121;
 289   background: -moz-linear-gradient(top, #373737, #212121);
 290   background: -webkit-linear-gradient(top, #373737, #212121);
 291   background: -ms-linear-gradient(top, #373737, #212121);
 292   background: -o-linear-gradient(top, #373737, #212121);
 293   background: linear-gradient(top, #373737, #212121);
 294 }
 295
 296 #header_wrap .inner {
 297   padding: 50px 10px 30px 10px;
 298 }
 299
 300 #project_title {
 301   margin: 0;
 302   color: #fff;
 303   font-size: 42px;
 304   font-weight: 700;
 305   text-shadow: #111 0px 0px 10px;
 306 }
 307
 308 #project_tagline {
 309   color: #fff;
 310   font-size: 24px;
 311   font-weight: 300;
 312   background: none;
 313   text-shadow: #111 0px 0px 10px;
 314 }
 315
 316 #downloads {
 317   position: absolute;
 318   width: 210px;
 319   z-index: 10;
 320   bottom: -40px;
 321   right: 0;
 322   height: 70px;
 323   background: url('../images/icon_download.png') no-repeat 0% 90%;
 324 }
 325
 326 .zip_download_link {
 327   display: block;
 328   float: right;
 329   width: 90px;
 330   height:70px;
 331   text-indent: -5000px;
 332   overflow: hidden;
 333   background: url(../images/sprite_download.png) no-repeat bottom left;
 334 }
 335
 336 .tar_download_link {
 337   display: block;
 338   float: right;
 339   width: 90px;
 340   height:70px;
 341   text-indent: -5000px;
 342   overflow: hidden;
 343   background: url(../images/sprite_download.png) no-repeat bottom right;
 344   margin-left: 10px;
 345 }
 346
 347 .zip_download_link:hover {
 348   background: url(../images/sprite_download.png) no-repeat top left;
 349 }
 350
 351 .tar_download_link:hover {
 352   background: url(../images/sprite_download.png) no-repeat top right;
 353 }
 354
 355 #main_content_wrap {
 356   background: #f2f2f2;
 357   border-top: 1px solid #111;
 358   border-bottom: 1px solid #111;
 359 }
 360
 361 #main_content {
 362   padding-top: 40px;
 363 }
 364
 365 #footer_wrap {
 366   background: #212121;
 367 }
 368
 369
 370
 371 /*******************************************************************************
 372 Small Device Styles
 373 *******************************************************************************/
 374
 375 @media screen and (max-width: 480px) {
 376   body {
 377     font-size:14px;
 378   }
 379
 380   #downloads {
 381     display: none;
 382   }
 383
 384   .inner {
 385     min-width: 320px;
 386     max-width: 480px;
 387   }
 388
 389   #project_title {
 390   font-size: 32px;
 391   }
 392
 393   h1 {
 394     font-size: 28px;
 395   }
 396
 397   h2 {
 398     font-size: 24px;
 399   }
 400
 401   h3 {
 402     font-size: 21px;
 403   }
 404
 405   h4 {
 406     font-size: 18px;
 407   }
 408
 409   h5 {
 410     font-size: 14px;
 411   }
 412
 413   h6 {
 414     font-size: 12px;
 415   }
 416
 417   code, pre {
 418     min-width: 320px;
 419     max-width: 480px;
 420     font-size: 11px;
 421   }
 422
 423 }