skyquake/framework/style/base.scss

   1 /* /fonts
   2 ############################################################################ */
   3
   4 /* Source Sans Pro */
   5 @font-face{
   6   font-family: 'Source Sans Pro';
   7   font-stretch: normal;
   8   font-style: normal;
   9   font-weight: 200;
  10   src: url('/fonts/SourceSansPro-ExtraLight.otf.woff') format('woff');
  11 }
  12
  13 @font-face{
  14   font-family: 'Source Sans Pro';
  15   font-stretch: normal;
  16   font-style: italic;
  17   font-weight: 200;
  18   src: url('/fonts/SourceSansPro-ExtraLightIt.otf.woff') format('woff');
  19 }
  20
  21 @font-face{
  22   font-family: 'Source Sans Pro';
  23   font-stretch: normal;
  24   font-style: normal;
  25   font-weight: 300;
  26   src: url('/fonts/SourceSansPro-Light.otf.woff') format('woff');
  27 }
  28
  29 @font-face{
  30   font-family: 'Source Sans Pro';
  31   font-stretch: normal;
  32   font-style: italic;
  33   font-weight: 300;
  34   src: url('/fonts/SourceSansPro-LightIt.otf.woff') format('woff');
  35 }
  36
  37 @font-face{
  38   font-family: 'Source Sans Pro';
  39   font-stretch: normal;
  40   font-style: normal;
  41   font-weight: 400;
  42   src: url('/fonts/SourceSansPro-Regular.otf.woff') format('woff');
  43 }
  44
  45 @font-face{
  46   font-family: 'Source Sans Pro';
  47   font-stretch: normal;
  48   font-style: italic;
  49   font-weight: 400;
  50   src: url('/fonts/SourceSansPro-It.otf.woff') format('woff');
  51 }
  52
  53 @font-face{
  54   font-family: 'Source Sans Pro';
  55   font-stretch: normal;
  56   font-style: normal;
  57   font-weight: 600;
  58   src: url('/fonts/SourceSansPro-Semibold.otf.woff') format('woff');
  59 }
  60
  61 @font-face{
  62   font-family: 'Source Sans Pro';
  63   font-stretch: normal;
  64   font-style: italic;
  65   font-weight: 600;
  66   src: url('/fonts/SourceSansPro-SemiboldIt.otf.woff') format('woff');
  67 }
  68
  69 @font-face{
  70   font-family: 'Source Sans Pro';
  71   font-stretch: normal;
  72   font-style: normal;
  73   font-weight: 700;
  74   src: url('/fonts/SourceSansPro-Bold.otf.woff') format('woff');
  75 }
  76
  77 @font-face{
  78   font-family: 'Source Sans Pro';
  79   font-stretch: normal;
  80   font-style: italic;
  81   font-weight: 700;
  82   src: url('/fonts/SourceSansPro-BoldIt.otf.woff') format('woff');
  83 }
  84
  85 @font-face{
  86   font-family: 'Source Sans Pro';
  87   font-stretch: normal;
  88   font-style: normal;
  89   font-weight: 900;
  90   src: url('/fonts/SourceSansPro-Black.otf.woff') format('woff');
  91 }
  92
  93 @font-face{
  94   font-family: 'Source Sans Pro';
  95   font-stretch: normal;
  96   font-style: italic;
  97   font-weight: 900;
  98   src: url('/fonts/SourceSansPro-BlackIt.otf.woff') format('woff');
  99 }
 100
 101 /* Source Sans Code */
 102 @font-face{
 103   font-family: 'Source Sans Code';
 104   font-stretch: normal;
 105   font-style: normal;
 106   font-weight: 200;
 107   src: url('/fonts/SourceSansCode-ExtraLight.otf.woff') format('woff');
 108 }
 109
 110 @font-face{
 111   font-family: 'Source Sans Code';
 112   font-stretch: normal;
 113   font-style: italic;
 114   font-weight: 200;
 115   src: url('/fonts/SourceSansCode-ExtraLightIt.otf.woff') format('woff');
 116 }
 117
 118 @font-face{
 119   font-family: 'Source Sans Code';
 120   font-stretch: normal;
 121   font-style: normal;
 122   font-weight: 300;
 123   src: url('/fonts/SourceSansCode-Light.otf.woff') format('woff');
 124 }
 125
 126 @font-face{
 127   font-family: 'Source Sans Code';
 128   font-stretch: normal;
 129   font-style: italic;
 130   font-weight: 300;
 131   src: url('/fonts/SourceSansCode-LightIt.otf.woff') format('woff');
 132 }
 133
 134 @font-face{
 135   font-family: 'Source Sans Code';
 136   font-stretch: normal;
 137   font-style: normal;
 138   font-weight: 400;
 139   src: url('/fonts/SourceSansCode-Regular.otf.woff') format('woff');
 140 }
 141
 142 @font-face{
 143   font-family: 'Source Sans Code';
 144   font-stretch: normal;
 145   font-style: italic;
 146   font-weight: 400;
 147   src: url('/fonts/SourceSansCode-It.otf.woff') format('woff');
 148 }
 149
 150 @font-face{
 151   font-family: 'Source Sans Code';
 152   font-stretch: normal;
 153   font-style: normal;
 154   font-weight: 600;
 155   src: url('/fonts/SourceSansCode-Semibold.otf.woff') format('woff');
 156 }
 157
 158 @font-face{
 159   font-family: 'Source Sans Code';
 160   font-stretch: normal;
 161   font-style: italic;
 162   font-weight: 600;
 163   src: url('/fonts/SourceSansCode-SemiboldIt.otf.woff') format('woff');
 164 }
 165
 166 @font-face{
 167   font-family: 'Source Sans Code';
 168   font-stretch: normal;
 169   font-style: normal;
 170   font-weight: 700;
 171   src: url('/fonts/SourceSansCode-Bold.otf.woff') format('woff');
 172 }
 173
 174 @font-face{
 175   font-family: 'Source Sans Code';
 176   font-stretch: normal;
 177   font-style: italic;
 178   font-weight: 700;
 179   src: url('/fonts/SourceSansCode-BoldIt.otf.woff') format('woff');
 180 }
 181
 182 @font-face{
 183   font-family: 'Source Sans Code';
 184   font-stretch: normal;
 185   font-style: normal;
 186   font-weight: 900;
 187   src: url('/fonts/SourceSansCode-Black.otf.woff') format('woff');
 188 }
 189
 190 @font-face{
 191   font-family: 'Source Sans Code';
 192   font-stretch: normal;
 193   font-style: italic;
 194   font-weight: 900;
 195   src: url('/fonts/SourceSansCode-BlackIt.otf.woff') format('woff');
 196 }
 197
 198
 199 /* ICONS
 200 ############################################################################ */
 201
 202 .svg-24px {
 203   fill: black;
 204   height: 24px;
 205   width: 24px;
 206 }
 207
 208
 209
 210 /* ROOT
 211 ############################################################################ */
 212
 213 *, *::before, *::after {
 214   box-sizing: border-box;
 215 }
 216
 217 html {
 218   font-family: "Source Sans Pro", helvetica, arial, sans-serif;
 219   font-size: 16px;
 220   height: 100%;
 221   line-height: 1;
 222   -ms-text-size-adjust: 100%;
 223   -webkit-text-size-adjust: 100%;
 224   width: 100%;
 225 }
 226
 227 body {
 228   height: 100%;
 229   margin: 0;
 230   width: 100%
 231 }
 232
 233
 234
 235 /* DISPLAY
 236 ############################################################################ */
 237
 238 article,
 239 aside,
 240 details,
 241 figcaption,
 242 figure,
 243 footer,
 244 header,
 245 main,
 246 menu,
 247 nav,
 248 section,
 249 summary {
 250   display: block;
 251 }
 252
 253 progress {
 254   vertical-align: baseline;
 255 }
 256
 257
 258
 259 /* LINKS
 260 ############################################################################ */
 261
 262 a {
 263   background-color: transparent;
 264   -webkit-text-decoration-skip: objects;
 265 }
 266
 267 a:active,
 268 a:hover {
 269   outline-width: 0;
 270 }
 271
 272
 273
 274 /* TEXT-LEVEL SEMANTICS
 275 ############################################################################ */
 276
 277 abbr[title] {
 278   border-bottom: none;
 279   text-decoration: underline;
 280   text-decoration: underline dotted;
 281 }
 282
 283 b,
 284 strong {
 285   font-weight: bolder;
 286 }
 287
 288 h1 {
 289   font-size: 2em;
 290   margin: 0.67em 0;
 291 }
 292
 293 small {
 294   font-size: 80%;
 295 }
 296
 297 sub,
 298 sup {
 299   font-size: 75%;
 300   line-height: 0;
 301   position: relative;
 302   vertical-align: baseline;
 303 }
 304 sub {
 305   bottom: -0.25em;
 306 }
 307 sup {
 308   top: -0.5em;
 309 }
 310
 311
 312
 313 /* EMBEDDED CONTENT
 314 ############################################################################ */
 315
 316 svg:not(:root) {
 317   overflow: hidden;
 318 }
 319
 320
 321
 322 /* GROUPING CONTENT
 323 ############################################################################ */
 324
 325 code,
 326 kbd,
 327 pre,
 328 samp {
 329   font-family: monospace, monospace;
 330   font-size: 1em;
 331 }
 332
 333 hr {
 334   box-sizing: content-box;
 335   height: 0;
 336   overflow: visible;
 337 }
 338
 339 dl {
 340   -webkit-margin-before: 0px;
 341   -webkit-margin-after: 0px;
 342 }
 343
 344 /* FORMS
 345 ############################################################################ */
 346
 347 button,
 348 input,
 349 select,
 350 textarea {
 351   font: inherit;
 352   margin: 0;
 353 }
 354
 355 optgroup {
 356   font-weight: bold;
 357 }
 358
 359 button,
 360 input {
 361   overflow: visible;
 362 }
 363
 364 button,
 365 select {
 366   text-transform: none;
 367 }
 368
 369 button,
 370 html [type="button"],
 371 [type="reset"],
 372 [type="submit"] {
 373   -webkit-appearance: button;
 374 }
 375
 376 button::-moz-focus-inner,
 377 [type="button"]::-moz-focus-inner,
 378 [type="reset"]::-moz-focus-inner,
 379 [type="submit"]::-moz-focus-inner {
 380   border-style: none;
 381   padding: 0;
 382 }
 383
 384 button:-moz-focusring,
 385 [type="button"]:-moz-focusring,
 386 [type="reset"]:-moz-focusring,
 387 [type="submit"]:-moz-focusring {
 388   outline: 1px dotted ButtonText;
 389 }
 390
 391 fieldset {
 392   border: 1px solid #c0c0c0;
 393   margin: 0 2px;
 394   padding: 0.35em 0.625em 0.75em;
 395 }
 396
 397 legend {
 398   box-sizing: border-box;
 399   color: inherit;
 400   display: table;
 401   max-width: 100%;
 402   padding: 0;
 403   white-space: normal;
 404 }
 405
 406 textarea {
 407   overflow: auto;
 408 }
 409
 410 [type="number"]::-webkit-inner-spin-button,
 411 [type="number"]::-webkit-outer-spin-button {
 412   height: auto;
 413 }
 414
 415 [type="search"] {
 416   -webkit-appearance: textfield;
 417   outline-offset: -2px;
 418 }
 419
 420 [type="search"]::-webkit-search-cancel-button,
 421 [type="search"]::-webkit-search-decoration {
 422   -webkit-appearance: none;
 423 }
 424
 425 ::-webkit-input-placeholder {
 426   color: inherit;
 427   opacity: 0.54;
 428 }
 429
 430 ::-webkit-file-upload-button {
 431   -webkit-appearance: button;
 432   font: inherit;
 433 }