1 /*!

     2 Pure v0.3.0

     3 Copyright 2013 Yahoo! Inc. All rights reserved.

     4 Licensed under the BSD License.

     5 https://github.com/yui/pure/blob/master/LICENSE.md

     6 */

     7 

     8 /*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/

     9 

    10 .yui3-g {

    11     letter-spacing: -0.31em;

    12     /* Webkit: collapse white-space between units */

    13     *letter-spacing: normal;

    14     /* reset IE < 8 */

    15     *word-spacing: -0.43em;

    16     /* IE < 8: collapse white-space between units */

    17     text-rendering: optimizespeed;

    18     /* Webkit: fixes text-rendering: optimizeLegibility */

    19     /*

    20     Sets the font stack to fonts known to work properly with the above letter

    21     and word spacings. See: https://github.com/yui/pure/issues/41/

    22 

    23     The following font stack makes Pure Grids work on all known environments.

    24 

    25     * FreeSans: Ships with many Linux distros, including Ubuntu

    26 

    27     * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and

    28       Arial to get picked up by the browser, even though neither is available

    29       in Chrome OS.

    30 

    31     * Droid Sans: Ships with all versions of Android.

    32 

    33     * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows.

    34     */

    35     font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;

    36     /*

    37     Use flexbox when possible to avoid `letter-spacing` side-effects.

    38 

    39     NOTE: Firefox (as of 25) does not currently support flex-wrap, so the

    40     `-moz-` prefix version is omitted.

    41     */

    42     display: -webkit-flex;

    43     -webkit-flex-flow: row wrap;

    44     /* IE10 uses display: flexbox */

    45     display: -ms-flexbox;

    46     -ms-flex-flow: row wrap;

    47 }

    48 

    49 /* Opera as of 12 on Windows needs word-spacing.

    50    The ".opera-only" selector is used to prevent actual prefocus styling

    51    and is not required in markup.

    52 */

    53 

    54 .opera-only :-o-prefocus,

    55 .yui3-g {

    56     word-spacing: -0.43em;

    57 }

    58 

    59 .yui3-u {

    60     display: inline-block;

    61     *display: inline;

    62     /* IE < 8: fake inline-block */

    63     zoom: 1;

    64     letter-spacing: normal;

    65     word-spacing: normal;

    66     vertical-align: top;

    67     text-rendering: auto;

    68 }

    69 

    70 /*

    71 Resets the font family back to the OS/browser's default sans-serif font,

    72 this the same font stack that Normalize.css sets for the `body`.

    73 */

    74 

    75 .yui3-g [class *= "yui3-u"] {

    76     font-family: sans-serif;

    77 }

    78 

    79 .yui3-u-1,

    80 .yui3-u-1-2,

    81 .yui3-u-1-3,

    82 .yui3-u-2-3,

    83 .yui3-u-1-4,

    84 .yui3-u-3-4,

    85 .yui3-u-1-5,

    86 .yui3-u-2-5,

    87 .yui3-u-3-5,

    88 .yui3-u-4-5,

    89 .yui3-u-1-6,

    90 .yui3-u-5-6,

    91 .yui3-u-1-8,

    92 .yui3-u-3-8,

    93 .yui3-u-5-8,

    94 .yui3-u-7-8,

    95 .yui3-u-1-12,

    96 .yui3-u-5-12,

    97 .yui3-u-7-12,

    98 .yui3-u-11-12,

    99 .yui3-u-1-24,

   100 .yui3-u-5-24,

   101 .yui3-u-7-24,

   102 .yui3-u-11-24,

   103 .yui3-u-13-24,

   104 .yui3-u-17-24,

   105 .yui3-u-19-24,

   106 .yui3-u-23-24 {

   107     display: inline-block;

   108     *display: inline;

   109     /* IE < 8: fake inline-block */

   110     zoom: 1;

   111     letter-spacing: normal;

   112     word-spacing: normal;

   113     vertical-align: top;

   114     text-rendering: auto;

   115 }

   116 

   117 .yui3-u-1 {

   118     width: 100%;

   119 }

   120 

   121 .yui3-u-1-2 {

   122     width: 50%;

   123     *width: 49.969%;

   124 }

   125 

   126 .yui3-u-1-3 {

   127     width: 33.3333%;

   128     *width: 33.3023%;

   129 }

   130 

   131 .yui3-u-2-3 {

   132     width: 66.6667%;

   133     *width: 66.6357%;

   134 }

   135 

   136 .yui3-u-1-4 {

   137     width: 25%;

   138     *width: 24.969%;

   139 }

   140 

   141 .yui3-u-3-4 {

   142     width: 75%;

   143     *width: 74.969%;

   144 }

   145 

   146 .yui3-u-1-5 {

   147     width: 20%;

   148     *width: 19.969%;

   149 }

   150 

   151 .yui3-u-2-5 {

   152     width: 40%;

   153     *width: 39.969%;

   154 }

   155 

   156 .yui3-u-3-5 {

   157     width: 60%;

   158     *width: 59.969%;

   159 }

   160 

   161 .yui3-u-4-5 {

   162     width: 80%;

   163     *width: 79.969%;

   164 }

   165 

   166 .yui3-u-1-6 {

   167     width: 16.6667%;

   168     *width: 16.6357%;

   169 }

   170 

   171 .yui3-u-5-6 {

   172     width: 83.3333%;

   173     *width: 83.3023%;

   174 }

   175 

   176 .yui3-u-1-8 {

   177     width: 12.5%;

   178     *width: 12.469%;

   179 }

   180 

   181 .yui3-u-3-8 {

   182     width: 37.5%;

   183     *width: 37.469%;

   184 }

   185 

   186 .yui3-u-5-8 {

   187     width: 62.5%;

   188     *width: 62.469%;

   189 }

   190 

   191 .yui3-u-7-8 {

   192     width: 87.5%;

   193     *width: 87.469%;

   194 }

   195 

   196 .yui3-u-1-12 {

   197     width: 8.3333%;

   198     *width: 8.3023%;

   199 }

   200 

   201 .yui3-u-5-12 {

   202     width: 41.6667%;

   203     *width: 41.6357%;

   204 }

   205 

   206 .yui3-u-7-12 {

   207     width: 58.3333%;

   208     *width: 58.3023%;

   209 }

   210 

   211 .yui3-u-11-12 {

   212     width: 91.6667%;

   213     *width: 91.6357%;

   214 }

   215 

   216 .yui3-u-1-24 {

   217     width: 4.1667%;

   218     *width: 4.1357%;

   219 }

   220 

   221 .yui3-u-5-24 {

   222     width: 20.8333%;

   223     *width: 20.8023%;

   224 }

   225 

   226 .yui3-u-7-24 {

   227     width: 29.1667%;

   228     *width: 29.1357%;

   229 }

   230 

   231 .yui3-u-11-24 {

   232     width: 45.8333%;

   233     *width: 45.8023%;

   234 }

   235 

   236 .yui3-u-13-24 {

   237     width: 54.1667%;

   238     *width: 54.1357%;

   239 }

   240 

   241 .yui3-u-17-24 {

   242     width: 70.8333%;

   243     *width: 70.8023%;

   244 }

   245 

   246 .yui3-u-19-24 {

   247     width: 79.1667%;

   248     *width: 79.1357%;

   249 }

   250 

   251 .yui3-u-23-24 {

   252     width: 95.8333%;

   253     *width: 95.8023%;

   254 }

   255 

   256 /*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/

   257 

   258 .yui3-g-r {

   259     letter-spacing: -0.31em;

   260     *letter-spacing: normal;

   261     *word-spacing: -0.43em;

   262     /*

   263     Sets the font stack to fonts known to work properly with the above letter

   264     and word spacings. See: https://github.com/yui/pure/issues/41/

   265 

   266     The following font stack makes Pure Grids work on all known environments.

   267 

   268     * FreeSans: Ships with many Linux distros, including Ubuntu

   269 

   270     * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and

   271       Arial to get picked up by the browser, even though neither is available

   272       in Chrome OS.

   273 

   274     * Droid Sans: Ships with all versions of Android.

   275 

   276     * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows.

   277     */

   278     font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif;

   279     /*

   280     Use flexbox when possible to avoid `letter-spacing` side-effects.

   281 

   282     NOTE: Firefox (as of 25) does not currently support flex-wrap, so the

   283     `-moz-` prefix version is omitted.

   284     */

   285     display: -webkit-flex;

   286     -webkit-flex-flow: row wrap;

   287     /* IE10 uses display: flexbox */

   288     display: -ms-flexbox;

   289     -ms-flex-flow: row wrap;

   290 }

   291 

   292 /* Opera as of 12 on Windows needs word-spacing.

   293    The ".opera-only" selector is used to prevent actual prefocus styling

   294    and is not required in markup.

   295 */

   296 

   297 .opera-only :-o-prefocus,

   298 .yui3-g-r {

   299     word-spacing: -0.43em;

   300 }

   301 

   302 /*

   303 Resets the font family back to the OS/browser's default sans-serif font,

   304 this the same font stack that Normalize.css sets for the `body`.

   305 */

   306 

   307 .yui3-g-r [class *= "yui3-u"] {

   308     font-family: sans-serif;

   309 }

   310 

   311 .yui3-g-r img {

   312     max-width: 100%;

   313     height: auto;

   314 }

   315 

   316 @media (min-width: 980px) {

   317     .yui3-visible-phone {

   318         display: none;

   319     }

   320 

   321     .yui3-visible-tablet {

   322         display: none;

   323     }

   324 

   325     .yui3-hidden-desktop {

   326         display: none;

   327     }

   328 }

   329 

   330 @media (max-width: 480px) {

   331     .yui3-g-r > .yui3-u,

   332     .yui3-g-r > [class *= "yui3-u-"] {

   333         width: 100%;

   334     }

   335 }

   336 

   337 @media (max-width: 767px) {

   338     .yui3-g-r > .yui3-u,

   339     .yui3-g-r > [class *= "yui3-u-"] {

   340         width: 100%;

   341     }

   342 

   343     .yui3-hidden-phone {

   344         display: none;

   345     }

   346 

   347     .yui3-visible-desktop {

   348         display: none;

   349     }

   350 }

   351 

   352 @media (min-width: 768px) and (max-width: 979px) {

   353     .yui3-hidden-tablet {

   354         display: none;

   355     }

   356 

   357     .yui3-visible-desktop {

   358         display: none;

   359     }

   360 }

   361 /* YUI CSS Detection Stamp */

   362 #yui3-css-stamp.cssgrids-responsive { display: none; }