github.com/mweagle/Sparta@v1.15.0/docs/css/nucleus.css (about)

     1  *, *::before, *::after {
     2    -webkit-box-sizing: border-box;
     3    -moz-box-sizing: border-box;
     4    box-sizing: border-box; }
     5  
     6  @-webkit-viewport {
     7    width: device-width; }
     8  @-moz-viewport {
     9    width: device-width; }
    10  @-ms-viewport {
    11    width: device-width; }
    12  @-o-viewport {
    13    width: device-width; }
    14  @viewport {
    15    width: device-width; }
    16  html {
    17    font-size: 100%;
    18    -ms-text-size-adjust: 100%;
    19    -webkit-text-size-adjust: 100%; }
    20  
    21  body {
    22    margin: 0; }
    23  
    24  article,
    25  aside,
    26  details,
    27  figcaption,
    28  figure,
    29  footer,
    30  header,
    31  hgroup,
    32  main,
    33  nav,
    34  section,
    35  summary {
    36    display: block; }
    37  
    38  audio,
    39  canvas,
    40  progress,
    41  video {
    42    display: inline-block;
    43    vertical-align: baseline; }
    44  
    45  audio:not([controls]) {
    46    display: none;
    47    height: 0; }
    48  
    49  [hidden],
    50  template {
    51    display: none; }
    52  
    53  a {
    54    background: transparent;
    55    text-decoration: none; }
    56  
    57  a:active,
    58  a:hover {
    59    outline: 0; }
    60  
    61  abbr[title] {
    62    border-bottom: 1px dotted; }
    63  
    64  b,
    65  strong {
    66    font-weight: bold; }
    67  
    68  dfn {
    69    font-style: italic; }
    70  
    71  mark {
    72    background: #FFFF27;
    73    color: #333; }
    74  
    75  sub,
    76  sup {
    77    font-size: 0.8rem;
    78    line-height: 0;
    79    position: relative;
    80    vertical-align: baseline; }
    81  
    82  sup {
    83    top: -0.5em; }
    84  
    85  sub {
    86    bottom: -0.25em; }
    87  
    88  img {
    89    border: 0;
    90    max-width: 100%; }
    91  
    92  svg:not(:root) {
    93    overflow: hidden; }
    94  
    95  figure {
    96    margin: 1em 40px; }
    97  
    98  hr {
    99    height: 0; }
   100  
   101  pre {
   102    overflow: auto; }
   103  
   104  button,
   105  input,
   106  optgroup,
   107  select,
   108  textarea {
   109    color: inherit;
   110    font: inherit;
   111    margin: 0; }
   112  
   113  button {
   114    overflow: visible; }
   115  
   116  button,
   117  select {
   118    text-transform: none; }
   119  
   120  button,
   121  html input[type="button"],
   122  input[type="reset"],
   123  input[type="submit"] {
   124    -webkit-appearance: button;
   125    cursor: pointer; }
   126  
   127  button[disabled],
   128  html input[disabled] {
   129    cursor: default; }
   130  
   131  button::-moz-focus-inner,
   132  input::-moz-focus-inner {
   133    border: 0;
   134    padding: 0; }
   135  
   136  input {
   137    line-height: normal; }
   138  
   139  input[type="checkbox"],
   140  input[type="radio"] {
   141    padding: 0; }
   142  
   143  input[type="number"]::-webkit-inner-spin-button,
   144  input[type="number"]::-webkit-outer-spin-button {
   145    height: auto; }
   146  
   147  input[type="search"] {
   148    -webkit-appearance: textfield; }
   149  
   150  input[type="search"]::-webkit-search-cancel-button,
   151  input[type="search"]::-webkit-search-decoration {
   152    -webkit-appearance: none; }
   153  
   154  legend {
   155    border: 0;
   156    padding: 0; }
   157  
   158  textarea {
   159    overflow: auto; }
   160  
   161  optgroup {
   162    font-weight: bold; }
   163  
   164  table {
   165    border-collapse: collapse;
   166    border-spacing: 0;
   167    table-layout: fixed;
   168    width: 100%; }
   169  
   170  tr, td, th {
   171    vertical-align: middle; }
   172  
   173  th, td {
   174    padding: 0.425rem 0; }
   175  
   176  th {
   177    text-align: left; }
   178  
   179  .container {
   180    width: 75em;
   181    margin: 0 auto;
   182    padding: 0; }
   183    @media only all and (min-width: 60em) and (max-width: 74.938em) {
   184      .container {
   185        width: 60em; } }
   186    @media only all and (min-width: 48em) and (max-width: 59.938em) {
   187      .container {
   188        width: 48em; } }
   189    @media only all and (min-width: 30.063em) and (max-width: 47.938em) {
   190      .container {
   191        width: 30em; } }
   192    @media only all and (max-width: 30em) {
   193      .container {
   194        width: 100%; } }
   195  
   196  .grid {
   197    display: -webkit-box;
   198    display: -moz-box;
   199    display: box;
   200    display: -webkit-flex;
   201    display: -moz-flex;
   202    display: -ms-flexbox;
   203    display: flex;
   204    -webkit-flex-flow: row;
   205    -moz-flex-flow: row;
   206    flex-flow: row;
   207    list-style: none;
   208    margin: 0;
   209    padding: 0; }
   210    @media only all and (max-width: 47.938em) {
   211      .grid {
   212        -webkit-flex-flow: row wrap;
   213        -moz-flex-flow: row wrap;
   214        flex-flow: row wrap; } }
   215  
   216  .block {
   217    -webkit-box-flex: 1;
   218    -moz-box-flex: 1;
   219    box-flex: 1;
   220    -webkit-flex: 1;
   221    -moz-flex: 1;
   222    -ms-flex: 1;
   223    flex: 1;
   224    min-width: 0;
   225    min-height: 0; }
   226    @media only all and (max-width: 47.938em) {
   227      .block {
   228        -webkit-box-flex: 0;
   229        -moz-box-flex: 0;
   230        box-flex: 0;
   231        -webkit-flex: 0 100%;
   232        -moz-flex: 0 100%;
   233        -ms-flex: 0 100%;
   234        flex: 0 100%; } }
   235  
   236  .content {
   237    margin: 0.625rem;
   238    padding: 0.938rem; }
   239  
   240  @media only all and (max-width: 47.938em) {
   241    body [class*="size-"] {
   242      -webkit-box-flex: 0;
   243      -moz-box-flex: 0;
   244      box-flex: 0;
   245      -webkit-flex: 0 100%;
   246      -moz-flex: 0 100%;
   247      -ms-flex: 0 100%;
   248      flex: 0 100%; } }
   249  
   250  .size-1-2 {
   251    -webkit-box-flex: 0;
   252    -moz-box-flex: 0;
   253    box-flex: 0;
   254    -webkit-flex: 0 50%;
   255    -moz-flex: 0 50%;
   256    -ms-flex: 0 50%;
   257    flex: 0 50%; }
   258  
   259  .size-1-3 {
   260    -webkit-box-flex: 0;
   261    -moz-box-flex: 0;
   262    box-flex: 0;
   263    -webkit-flex: 0 33.33333%;
   264    -moz-flex: 0 33.33333%;
   265    -ms-flex: 0 33.33333%;
   266    flex: 0 33.33333%; }
   267  
   268  .size-1-4 {
   269    -webkit-box-flex: 0;
   270    -moz-box-flex: 0;
   271    box-flex: 0;
   272    -webkit-flex: 0 25%;
   273    -moz-flex: 0 25%;
   274    -ms-flex: 0 25%;
   275    flex: 0 25%; }
   276  
   277  .size-1-5 {
   278    -webkit-box-flex: 0;
   279    -moz-box-flex: 0;
   280    box-flex: 0;
   281    -webkit-flex: 0 20%;
   282    -moz-flex: 0 20%;
   283    -ms-flex: 0 20%;
   284    flex: 0 20%; }
   285  
   286  .size-1-6 {
   287    -webkit-box-flex: 0;
   288    -moz-box-flex: 0;
   289    box-flex: 0;
   290    -webkit-flex: 0 16.66667%;
   291    -moz-flex: 0 16.66667%;
   292    -ms-flex: 0 16.66667%;
   293    flex: 0 16.66667%; }
   294  
   295  .size-1-7 {
   296    -webkit-box-flex: 0;
   297    -moz-box-flex: 0;
   298    box-flex: 0;
   299    -webkit-flex: 0 14.28571%;
   300    -moz-flex: 0 14.28571%;
   301    -ms-flex: 0 14.28571%;
   302    flex: 0 14.28571%; }
   303  
   304  .size-1-8 {
   305    -webkit-box-flex: 0;
   306    -moz-box-flex: 0;
   307    box-flex: 0;
   308    -webkit-flex: 0 12.5%;
   309    -moz-flex: 0 12.5%;
   310    -ms-flex: 0 12.5%;
   311    flex: 0 12.5%; }
   312  
   313  .size-1-9 {
   314    -webkit-box-flex: 0;
   315    -moz-box-flex: 0;
   316    box-flex: 0;
   317    -webkit-flex: 0 11.11111%;
   318    -moz-flex: 0 11.11111%;
   319    -ms-flex: 0 11.11111%;
   320    flex: 0 11.11111%; }
   321  
   322  .size-1-10 {
   323    -webkit-box-flex: 0;
   324    -moz-box-flex: 0;
   325    box-flex: 0;
   326    -webkit-flex: 0 10%;
   327    -moz-flex: 0 10%;
   328    -ms-flex: 0 10%;
   329    flex: 0 10%; }
   330  
   331  .size-1-11 {
   332    -webkit-box-flex: 0;
   333    -moz-box-flex: 0;
   334    box-flex: 0;
   335    -webkit-flex: 0 9.09091%;
   336    -moz-flex: 0 9.09091%;
   337    -ms-flex: 0 9.09091%;
   338    flex: 0 9.09091%; }
   339  
   340  .size-1-12 {
   341    -webkit-box-flex: 0;
   342    -moz-box-flex: 0;
   343    box-flex: 0;
   344    -webkit-flex: 0 8.33333%;
   345    -moz-flex: 0 8.33333%;
   346    -ms-flex: 0 8.33333%;
   347    flex: 0 8.33333%; }
   348  
   349  @media only all and (min-width: 48em) and (max-width: 59.938em) {
   350    .size-tablet-1-2 {
   351      -webkit-box-flex: 0;
   352      -moz-box-flex: 0;
   353      box-flex: 0;
   354      -webkit-flex: 0 50%;
   355      -moz-flex: 0 50%;
   356      -ms-flex: 0 50%;
   357      flex: 0 50%; }
   358  
   359    .size-tablet-1-3 {
   360      -webkit-box-flex: 0;
   361      -moz-box-flex: 0;
   362      box-flex: 0;
   363      -webkit-flex: 0 33.33333%;
   364      -moz-flex: 0 33.33333%;
   365      -ms-flex: 0 33.33333%;
   366      flex: 0 33.33333%; }
   367  
   368    .size-tablet-1-4 {
   369      -webkit-box-flex: 0;
   370      -moz-box-flex: 0;
   371      box-flex: 0;
   372      -webkit-flex: 0 25%;
   373      -moz-flex: 0 25%;
   374      -ms-flex: 0 25%;
   375      flex: 0 25%; }
   376  
   377    .size-tablet-1-5 {
   378      -webkit-box-flex: 0;
   379      -moz-box-flex: 0;
   380      box-flex: 0;
   381      -webkit-flex: 0 20%;
   382      -moz-flex: 0 20%;
   383      -ms-flex: 0 20%;
   384      flex: 0 20%; }
   385  
   386    .size-tablet-1-6 {
   387      -webkit-box-flex: 0;
   388      -moz-box-flex: 0;
   389      box-flex: 0;
   390      -webkit-flex: 0 16.66667%;
   391      -moz-flex: 0 16.66667%;
   392      -ms-flex: 0 16.66667%;
   393      flex: 0 16.66667%; }
   394  
   395    .size-tablet-1-7 {
   396      -webkit-box-flex: 0;
   397      -moz-box-flex: 0;
   398      box-flex: 0;
   399      -webkit-flex: 0 14.28571%;
   400      -moz-flex: 0 14.28571%;
   401      -ms-flex: 0 14.28571%;
   402      flex: 0 14.28571%; }
   403  
   404    .size-tablet-1-8 {
   405      -webkit-box-flex: 0;
   406      -moz-box-flex: 0;
   407      box-flex: 0;
   408      -webkit-flex: 0 12.5%;
   409      -moz-flex: 0 12.5%;
   410      -ms-flex: 0 12.5%;
   411      flex: 0 12.5%; }
   412  
   413    .size-tablet-1-9 {
   414      -webkit-box-flex: 0;
   415      -moz-box-flex: 0;
   416      box-flex: 0;
   417      -webkit-flex: 0 11.11111%;
   418      -moz-flex: 0 11.11111%;
   419      -ms-flex: 0 11.11111%;
   420      flex: 0 11.11111%; }
   421  
   422    .size-tablet-1-10 {
   423      -webkit-box-flex: 0;
   424      -moz-box-flex: 0;
   425      box-flex: 0;
   426      -webkit-flex: 0 10%;
   427      -moz-flex: 0 10%;
   428      -ms-flex: 0 10%;
   429      flex: 0 10%; }
   430  
   431    .size-tablet-1-11 {
   432      -webkit-box-flex: 0;
   433      -moz-box-flex: 0;
   434      box-flex: 0;
   435      -webkit-flex: 0 9.09091%;
   436      -moz-flex: 0 9.09091%;
   437      -ms-flex: 0 9.09091%;
   438      flex: 0 9.09091%; }
   439  
   440    .size-tablet-1-12 {
   441      -webkit-box-flex: 0;
   442      -moz-box-flex: 0;
   443      box-flex: 0;
   444      -webkit-flex: 0 8.33333%;
   445      -moz-flex: 0 8.33333%;
   446      -ms-flex: 0 8.33333%;
   447      flex: 0 8.33333%; } }
   448  @media only all and (max-width: 47.938em) {
   449    @supports not (flex-wrap: wrap) {
   450      .grid {
   451        display: block;
   452        -webkit-box-lines: inherit;
   453        -moz-box-lines: inherit;
   454        box-lines: inherit;
   455        -webkit-flex-wrap: inherit;
   456        -moz-flex-wrap: inherit;
   457        -ms-flex-wrap: inherit;
   458        flex-wrap: inherit; }
   459  
   460      .block {
   461        display: block;
   462        -webkit-box-flex: inherit;
   463        -moz-box-flex: inherit;
   464        box-flex: inherit;
   465        -webkit-flex: inherit;
   466        -moz-flex: inherit;
   467        -ms-flex: inherit;
   468        flex: inherit; } } }
   469  .first-block {
   470    -webkit-box-ordinal-group: 0;
   471    -webkit-order: -1;
   472    -ms-flex-order: -1;
   473    order: -1; }
   474  
   475  .last-block {
   476    -webkit-box-ordinal-group: 2;
   477    -webkit-order: 1;
   478    -ms-flex-order: 1;
   479    order: 1; }
   480  
   481  .fixed-blocks {
   482    -webkit-flex-flow: row wrap;
   483    -moz-flex-flow: row wrap;
   484    flex-flow: row wrap; }
   485    .fixed-blocks .block {
   486      -webkit-box-flex: inherit;
   487      -moz-box-flex: inherit;
   488      box-flex: inherit;
   489      -webkit-flex: inherit;
   490      -moz-flex: inherit;
   491      -ms-flex: inherit;
   492      flex: inherit;
   493      width: 25%; }
   494      @media only all and (min-width: 60em) and (max-width: 74.938em) {
   495        .fixed-blocks .block {
   496          width: 33.33333%; } }
   497      @media only all and (min-width: 48em) and (max-width: 59.938em) {
   498        .fixed-blocks .block {
   499          width: 50%; } }
   500      @media only all and (max-width: 47.938em) {
   501        .fixed-blocks .block {
   502          width: 100%; } }
   503  
   504  body {
   505    font-size: 1.05rem;
   506    line-height: 1.7; }
   507  
   508  h1, h2, h3, h4, h5, h6 {
   509    margin: 0.85rem 0 1.7rem 0;
   510    text-rendering: optimizeLegibility; }
   511  
   512  h1 {
   513    font-size: 3.25rem; }
   514  
   515  h2 {
   516    font-size: 2.55rem; }
   517  
   518  h3 {
   519    font-size: 2.15rem; }
   520  
   521  h4 {
   522    font-size: 1.8rem; }
   523  
   524  h5 {
   525    font-size: 1.4rem; }
   526  
   527  h6 {
   528    font-size: 0.9rem; }
   529  
   530  p {
   531    margin: 1.7rem 0; }
   532  
   533  ul, ol {
   534    margin-top: 1.7rem;
   535    margin-bottom: 1.7rem; }
   536    ul ul, ul ol, ol ul, ol ol {
   537      margin-top: 0;
   538      margin-bottom: 0; }
   539  
   540  blockquote {
   541    margin: 1.7rem 0;
   542    padding-left: 0.85rem; }
   543  
   544  cite {
   545    display: block;
   546    font-size: 0.925rem; }
   547    cite:before {
   548      content: "\2014 \0020"; }
   549  
   550  pre {
   551    margin: 1.7rem 0;
   552    padding: 0.938rem; }
   553  
   554  code {
   555    vertical-align: bottom; }
   556  
   557  small {
   558    font-size: 0.925rem; }
   559  
   560  hr {
   561    border-left: none;
   562    border-right: none;
   563    border-top: none;
   564    margin: 1.7rem 0; }
   565  
   566  fieldset {
   567    border: 0;
   568    padding: 0.938rem;
   569    margin: 0 0 1.7rem 0; }
   570  
   571  input,
   572  label,
   573  select {
   574    display: block; }
   575  
   576  label {
   577    margin-bottom: 0.425rem; }
   578    label.required:after {
   579      content: "*"; }
   580    label abbr {
   581      display: none; }
   582  
   583  textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], select[multiple=multiple] {
   584    -webkit-transition: border-color;
   585    -moz-transition: border-color;
   586    transition: border-color;
   587    border-radius: 0.1875rem;
   588    margin-bottom: 0.85rem;
   589    padding: 0.425rem 0.425rem;
   590    width: 100%; }
   591    textarea:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, select[multiple=multiple]:focus {
   592      outline: none; }
   593  
   594  textarea {
   595    resize: vertical; }
   596  
   597  input[type="checkbox"], input[type="radio"] {
   598    display: inline;
   599    margin-right: 0.425rem; }
   600  
   601  input[type="file"] {
   602    width: 100%; }
   603  
   604  select {
   605    width: auto;
   606    max-width: 100%;
   607    margin-bottom: 1.7rem; }
   608  
   609  button,
   610  input[type="submit"] {
   611    cursor: pointer;
   612    user-select: none;
   613    vertical-align: middle;
   614    white-space: nowrap;
   615    border: inherit; }